@import _mixins.sass

div
 &#indexContainer
  min-height: 100%
  position: relative
  background: repeat-x url('/images/index/index_bg.png')
  padding-bottom: 30px

 &#indexMain
  position: relative
  margin: 0 auto 0 auto
  width: 1200px
  padding-bottom: 20px 

 &#logo
  width: 480px
  height: 353px
  position: absolute
  top: 5px
  z-index: 1
  background: image-url('logo.png') left -85px no-repeat

 &#indexBanner
  width: 100%
  height: 194px
  position: relative

 &#indexLinks
  position: relative
  z-index: 1000
  width: 850px
  height: 25px
  padding-top: 3px
  margin-left: 250px
  color: #ffffff
  text-align: right
  span.gather
   color: #CC6600
  > a
   color: #ffffff
   &:hover
    color: #d5d5d5
   span
    color: #cc0000
    > a
     color: #cc0000

 &#indexLogin
  height: 45px
  margin: 5px auto auto 710px
  font-size: 10px
  color: #ffffff
  div
   &.logged
    text-align: center
    font-size: 11px
   &.button
    width: 75px
    height: 18px
    padding-top: 5px
    margin: 10px 1px 0px 2px
    background-image: url('/images/icons/button.png')
    font-size: 12px
    font-weight: bold
    float: left
    &:hover
     background-image: url('/images/icons/button_hl.png')
   a
    color: #ffffff
   td#links
    text-align: right
   input
    &[type=text], &[type=password]
     width: 100px
    &[type=submit]
     @include shadow
     height: 21px
     border: 1px solid #cecece
     background-color: #f7f7f7
     color: #3a3a3a
     cursor: pointer

 &#indexMenu
  margin-top: 8px
  margin-left: 500px
  height: 33px
  div
   width: 143px
   height: 33px
   color: #ffffff
   float: left
   &.contests
    background-image: url('/images/index/menu_contests.png')
    &:hover
     background-image: url('/images/index/menu_contests_shaded.png')
     cursor: pointer
   &.gather
    margin-left: 5px
    background-image: url('/images/index/menu_gather.png')
    &:hover
     background-image: url('/images/index/menu_gather_shaded.png')
     cursor: pointer
   &.material
    margin-left: 5px
    background-image: url('/images/index/menu_material.png')
    &:hover
     background-image: url('/images/index/menu_material_shaded.png')
     cursor: pointer
   &.forums
    margin-left: 5px
    background-image: url('/images/index/menu_forums.png')
    &:hover
     background-image: url('/images/index/menu_forums_shaded.png')
     cursor: pointer

 &#indexItems div
  display: none
  position: absolute
  left: 495px
  margin-top: 6px
  width: 143px
  text-align: right
  font-size: 13px
  &.gather
   left: 645px
  &.material
   left: 795px
  &.forums
   left: 943px
  a
   color: #ffffff
   &:hover
    color: #d6d5d5

 &#indexMainarea
  position: relative
  z-index: 1000
  padding: 10px 100px 10px 100px

 &#indexContent
  width: 700px
  margin-top: 15px
  margin-left: 15px
  margin-right: 20px
  float: left
  padding: 0

 &#indexRight
  padding-top: 15px
  float: left
 &.indexBox
  @include rounded-corners
  @include shadow
  width: 250px
  padding-bottom: 10px
  margin-bottom: 15px
  background-color: $bg_box
  div
   &.header
    @include shaded-top
    margin: 0
    padding-top: 5px
    height: 25px
    font-size: 14px
    font-weight: bold
   &.separator
    @include shaded-top
    border-radius: 0px
    margin: 0
    padding-top: 5px
    height: 20px
    font-size: 12px
    font-weight: normal
   &.body
    width: 100%
    text-align: left
   &.content
    margin: 0
    padding: 6px 5px 0 10px
    font-size: 10px
    h3
     margin: 0 2px 2px 2px
     padding-top: 7px
     font-size: 10px
    ol, li
     padding: 1px 2px 2px 0px
     list-style-type: none
    div.movie
     padding-left: 10px
     width: 110px
     text-align: center

 &#index-calendar
  padding-bottom: 0
  .widget-content-wrapper
   padding-bottom: 10px
   max-height: 400px
   overflow-x: hidden
   overflow-y: scroll

 &#indexPosts
  padding: 5px

 &#indexFooter
  position: absolute
  width: 100%
  height: 20px
  bottom: 0
  padding-top: 5px
  background: url('/images/index/index_footer.png') repeat-x center #2a536d
  text-align: center
  font-size: 80%
  color: #fff
  a
   font-weight: bold
   color: #fff
   text-transform: uppercase