@import "common"

a,
input[type="submit"]
  &.button
    +button
  &.in_collection, &.associated
    +button(#7e9eba, #1e5587)
    color: #ffffff
    text-shadow: 0 1px 1px #222222
    border-color: #1e5587

.help_text
  background: $fieldset_light_blue
  border: 1px solid $grayblue
  padding: 10px
  margin: 0 0 20px 0
  line-height: 140%
  img.indicator
    position: relative
    margin: 0 5px
    top: -1px

form
  &.button_to
    margin-top: 20px
  dl
    dt
      padding: 0 0 5px 0
      label
        font-weight: bold
      small
        color: $darker_blue
      p
        font-weight: normal
    dd
      padding: 0 0 10px 0
      input[type="text"], input[type="password"], textarea, select
        margin: 0 0 5px 0
      input[type="text"], input[type="password"]
        +input
      input[type="file"]
        margin: 0 0 10px 0
      textarea
        +textarea
    input[type="radio"]
      margin: 0 5px 0 0
  input.standard
    +input
  label
    &.required
      background: image-url("v2/icon_required.png") 0 45% no-repeat
      padding-left: 10px
      margin-left: -10px
    &.checkbox
      display: block
      font-weight: bold
      input
        margin: 0 5px 0 0
      p
        font-weight: normal
    span.error
      color: #e94c1b
  fieldset.actions,
  div
    margin: 10px 0
    button
      display: none
    input[type="submit"],
    button
      +button
      margin: 0 5px 0 0
      padding: 3px 10px
      font-size: .92em
      cursor: pointer
      &.delete
        border-color: #cd331e
        +gradient-bg(#e07f71, #cd331e)
        color: #fff
        &:hover
          +gradient_bg(saturate(#e07f71 + #111111, 10%), saturate(#cd331e + #111111, 10%))
        &:active
          +gradient-bg(#e07f71, #cd331e)
      &.with_case
        text-transform: none
  .heading &.filter
    label
      text-transform: uppercase
      color: $loafer_text_color
    dl
      display: inline
      dt
        display: inline
        padding: 0 5px 0 0
      dd
        display: inline
        padding: 0
        select
          margin: 0 5px 0 0
    input[type="submit"]
      +button
      padding: 3px 10px
      font-size: .92em

.main_container
  overflow: hidden
  position: relative
  left: -1px
  z-index: 1
  padding: 0 17px
  border: 1px solid $darker_gray
  border-width: 0 1px
  min-height: 17em
  .heading
    position: relative
    text-align: left
    overflow: hidden
    padding: 8px 10px 7px 10px
    border-bottom: 1px solid #ccd399
    background: #f1f4dc
    h3, label
      font-weight: bold
      text-transform: uppercase
      color: $loafer_text_color
    h3, &.subnav ul
      + form, + a
        position: absolute
        right: 10px
        top: 6px
    label
      font-size: 0.92em
    fieldset
      display: inline
    &.subnav
      ul
        overflow: hidden
        font-weight: bold
        float: left
        li
          float: left
          margin: 0 10px 0 0
          padding: 0
          &.active a
            background: #fff
          &.active a, a:hover
            border: 1px solid $loafer_text_color
            color: #394651
          a
            padding: 5px
            display: block
            text-decoration: none
            color: $loafer_text_color
            background: #f5f7e7
            border: 1px solid #cfd5a9
      form
        padding-top: 5px
form.comment
  padding: 0 20px
  margin: 0 0 20px 0
  fieldset
    overflow: hidden
    padding: 0 0 10px 0
  img
    float: left
    margin: 0 10px 0 0
    border: 1px solid #394651
  img + div
    float: left
    margin: 0
  textarea
    width: 370px
    +textarea
  fieldset.actions
    clear: both
    padding: 0 0 0 62px
    margin: 0 0 10px 0
    label
      float: right
    input[type="submit"]
      margin: 0 10px 0 0
    a
      font-weight: bold
ul.tabs
  margin: 0 0 20px 0
  li
    margin: 0 0 1px 0
    font-weight: bold
    border: 1px solid $grayblue
    border-right-color: $darker_gray
    +border-top-left-radius(3px)
    +border-bottom-left-radius(3px)
    -webkit-background-clip: padding-box
    +gradient-bg-horizontal(#ffffff, #f0f4f7)
    a
      display: block
      padding: 7px 10px 6px 10px
      text-decoration: none
      color: $darker_blue
    &:hover
      border-color: $darker_gray
      a
        color: #28323a
    &.active
      border-color: $darker_gray
      border-right-color: #ffffff
      +gradient-bg-horizontal(#fff, #fff)
      a
        color: #28323a
    &.total
      a
        padding-left: 20px
        font-size: 1.14em
    &.taxa
      a
        background: transparent image-url("v2/icon_taxa_tabs.png") 9px 50% no-repeat
    &.videos
      a
        background: transparent image-url("v2/icon_videos_tabs.png") 11px 10px no-repeat
    &.sounds
      a
        background: transparent image-url("v2/icon_sounds_tabs.png") 14px 50% no-repeat
    &.images
      a
        background: transparent image-url("v2/icon_images_tabs.png") 7px 8px no-repeat
    &.communities
      a
        background: transparent image-url("v2/icon_communities_tabs.png") 8px 16px no-repeat
    &.people
      a
        background: transparent image-url("v2/icon_people_tabs.png") 9px 10px no-repeat
    &.collections
      a
        background: transparent image-url("v2/icon_collections_tabs.png") 6px 8px no-repeat
    &.articles
      a
        background: transparent image-url("v2/icon_articles_tabs.png") 9px 9px no-repeat
    &.links
      a
        background: transparent image-url("v2/icon_links_tabs.png") 6px 9px no-repeat
    &.data
      a
        background: transparent image-url("v2/icon_data_tabs.png") 6px 9px no-repeat
  &.with_icons
    li
      font-size: 1.16em
      a
        padding: 17px 20px 17px 50px
      &.total,
      &.comments
        a
          padding-left: 20px
      &.total
        font-size: 1.14em

p.status
  clear: both
  padding: 7px 10px
  margin: 10px 0
  font-size: 1.16em
  font-weight: bold
  text-align: center
  color: #394651
  border: 1px solid #c7d471
  background: #edf6b2
  a
    color: #394651
  strong
    text-decoration: underline
    color: #809203
  &.neutral
    border-color: $grayblue
    background: #f1f4f7
    strong
      color: #195184
  &.negative
    border-color: #f2d2cc
    background: #ffeae6
    strong
      color: $negative_red

.copy
  h2
    margin: 0 0 15px 0
    font-size: 1.5em
  h3
    margin: 0 0 15px 0
    font-size: 1.33em
  h4
    margin: 0 0 15px 0
    font-size: 1.08em
  p
    margin: 0 0 15px 0
    line-height: 170%
    img
      margin-right: 0.5em
  dl
    margin: 0 40px 15px 40px
    line-height: 170%
    dt
      font-weight: bold
    dd
      margin: 0 0 10px 20px
  form
    dl
      margin-left: 0
      dd
        margin: 0 0 10px 0
  ul, ol
    margin: 0 40px 15px 40px
    line-height: 170%
    li
      margin: 0 0 10px 0
      list-style-type: disc
  ol li
    list-style-type: decimal
  blockquote
    background: #eff2f4
    border: 1px solid $grayblue
    margin: 0 -20px 25px -20px
    padding: 15px 20px 0 20px
  p, ul, ol, dl, blockquote
    & + h2,
    & + h3,
    & + h4
      padding-top: 20px

table.standard
  border-collapse: collapse
  width: 100%
  margin: 0 0 15px 0
  line-height: 170%
  thead
    tr
      border: 1px solid $grayblue
      th
        background: #eff2f4
        padding: 5px 20px
        font-weight: bold
        text-align: left
  tbody
    tr
      border: 1px solid $grayblue
      td
        padding: 5px 20px

.article .header, .header_underlined
  overflow: hidden
  padding: 0 10px 0 0
  margin: 0 -10px 12px -10px
  border-bottom: 1px solid #394651
  h3
    float: left
    padding: 0 10px 3px 10px
    font-size: 1.16em
    border-bottom: 3px solid #394651

.article
  padding: 0 10px 25px 10px
  .header
    a
      float: right
      padding: 2px 0 0 0
      font-weight: bold
      text-transform: lowercase
  .meta
    clear: both
    padding: 0 0 20px 0
    overflow: hidden
    font-size: .92em
    img
      float: left
      margin: 0 10px 0 0
    p
      float: left
      margin: 0
      line-height: 120%
      + p
        display: list-item
        margin: 0 0 0 25px
        list-style: disc
  &.list
    > ul
      > li
        overflow: hidden
        padding: 0 0 10px 0
        line-height: 160%
        & + li
          border-top: 1px solid #d7dadc
        > a > img, > img, > .editable > a > img, img.no_user
          float: left
          margin: 15px 10px 0 15px
          border: 1px solid #394651
          +set_dimensions($logo_size_secondary, $logo_size_secondary)
        .details
          margin: 15px 15px 0 0
          padding: 0
          overflow: hidden
          img
            max-width: 400px
            margin: 5px 0
          p.meta
            color: #62707d
            padding: 0
        .editable
          margin: 15px 15px 0
          > a > img
            margin: 0 10px 0 0
          .details
            margin: 0
    &.half
      > ul
        > li
          & + li
            border: none
          > a > img
            margin: 0 10px 0 0
          .details
            margin: 0
  &.updates
    padding: 0
    blockquote, p
      line-height: 140%
      padding: 0 0 8px 0
    li
      form
        &.edit_comment
          margin-top: 10px
          label
            display: block
            font-weight: bold
          textarea
            margin: 3px 0
            width: 430px
            height: 60px
            +textarea
.article.updates, ul.object_list
  blockquote, p
    &.meta
      font-size: .75em
      font-weight: bold
      text-transform: uppercase
      color: #62707d
      padding: 0
      span.expired
        display: inline-block
        color: #B40404
  ul.actions
    li
      display: inline
      font-size: .9em
      font-weight: bold
      text-transform: lowercase
      a
        display: inline-block
        padding: 5px 0
        margin: 0 5px 0 0
      form
        margin: 0
        padding: 0
        display: inline
        input[type="submit"]
          +button_styled_as_hyperlink
          font-weight: bold
          padding: 5px 0
          margin: 0 5px 0 0

.empty, .copy .empty, .explain
  padding: 15px 15px 10px 15px
  margin: 10px 0
  font-size: 1.16em
  text-align: center
  border: 1px solid $grayblue
  background: $fieldset_light_blue
  p
    margin: 0
    padding: 0 0 5px 0
    line-height: 150%
  a.button, input[type="submit"]
    font-size: .78em
    display: inline-block
    margin-bottom: 5px
  input[type="submit"]
    padding: 5px 10px 6px 10px

.explain
  text-align: left
  padding: 15px
  p
    margin: 0.5em 0

= star
  position: absolute
  top: 0
  left: 0
  height: 13px
  font-size: 0
  text-indent: -8685px
  overflow: hidden
.rating
  ul,
  ul a:hover,
  ul a:active,
  ul a:focus
    background: transparent image-url("v2/icon_stars.png") 0 100% repeat-x
  ul
    float: left
    position: relative
    width: 80px
    height: 13px
    overflow: hidden
    list-style: none
    background-position: 0 0
    li
      display: inline
      @for $i from 1 through 5
        &.current_rating_#{$i}
          +star
          width: 20% * $i
          background: transparent image-url("v2/icon_stars.png") 0 -26px repeat-x
    a
      +star
      &:hover, &:active, &:focus
        background-position: 0 -26px
      @for $i from 1 through 5
        &.star_#{$i}
          width: 20% * $i
          z-index: 7 - $i
  ul:hover
    @for $i from 1 through 5
      li.current_rating_#{$i}
        width: 0
  p
    float: left
    font-size: .83em
    font-weight: bold
    margin: 0 10px 0 0

.average_rating
  font-size: .83em
  font-weight: bold
  p
    float: left
    margin: 0
    margin: 0 10px 0 0
  .rating
    float: left
    width: 76px
    height: 13px
    background: transparent image-url("v2/icon_stars.png") 0 0 repeat-x
    p
      height: 12px
      font-size: 0
      margin: 0
      text-indent: -8685px
      background: transparent image-url("v2/icon_stars.png") 0 50% repeat-x
    &.one
      p
        width: 20%
    &.two
      p
        width: 40%
    &.three
      p
        width: 60%
    &.four
      p
        width: 80%

.data
  span.icon
    background: $fieldset_light_blue image-url("v2/icon_data.png") 50% 50% no-repeat
.taxon
  span.icon
    background: $fieldset_light_blue image-url("v2/icon_taxa_tabs.png") 50% 50% no-repeat
.video
  span.icon
    background: $fieldset_light_blue image-url("v2/icon_videos_tabs.png") 50% 50% no-repeat
.image
  span.icon
    background: $fieldset_light_blue image-url("v2/icon_images_tabs.png") 50% 50% no-repeat
.community
  span.icon
    background: $fieldset_light_blue image-url("v2/icon_communities_tabs.png") 50% 50% no-repeat
.person
  span.icon
    background: $fieldset_light_blue image-url("v2/icon_people_tabs.png") 50% 50% no-repeat
.collection
  span.icon
    background: $fieldset_light_blue image-url("v2/icon_collections_tabs.png") 50% 50% no-repeat
.article
  span.icon
    background: $fieldset_light_blue image-url("v2/icon_articles_tabs.png") 50% 50% no-repeat
.link
  span.icon
    background: $fieldset_light_blue image-url("v2/icon_links_tabs.png") 50% 50% no-repeat
.sound
  span.icon
    background: $fieldset_light_blue image-url("v2/icon_sound_tabs.png") 50% 50% no-repeat

form.select_content_partner
  padding: 5px 0
  text-align: center
  color: #394651
  border: 1px solid #c7d471
  background: #edf6b2
  p
    display: inline
    font-size: 1.16em
    font-weight: bold
  input[type="submit"]
    +button
    padding: 3px 10px
    font-size: .92em

.disclaimer
  clear: both
  border-top: 1px solid $grayblue
  padding-top: 10px
  margin-top: 40px
  p
    text-align: center
    font-size: 0.9em
    color: #394651
    margin: 0

body
  > #central
    margin-top: 16.6em /* BANNER - was 9.4em */
  > #header
    position: absolute
    top: $global_nav_height
    left: 0
    width: 100%
    background: #394651
    border-top: 2.7em solid #28323a /* BANNER - remove this */
    .section
      height: 11.2em /* BANNER - was: 9.4em */
      .global_navigation
        top: -2em
        ul.nav
          li:before
            color: #6f7e8b
      .actions
        z-index: 900
        top: -2.3em
        p
          border-color: #616b74
          a span
            border-color: #616b74
        .language, p.print
          background: #394651
          ul
            background: #394651
            li
              border-color: #616b74
      .session
        position: absolute
        width: 320px
        right: 0
        top: 32px
        z-index: 1
        &.join
          float: right
          text-align: right
          color: #fff
          p
            line-height: 150%
          a
            color: #90bce4
        &.signed_in
          ul
            &.notifications
              float: right
              overflow: hidden
              margin-left: 1px
              font-weight: bold
              font-size: .9em
              li
                a
                  display: block
                  height: 25px
                  line-height: 25px
                  text-decoration: none
                  background: image-url("v2/icon_header_messages.png") 6px 45% no-repeat #566572
                  padding: 0 5px 0 24px
                  &:hover
                    background-color: #667d91
                + li
                  margin-top: 1px
                  a
                    background-image: image-url("v2/icon_header_notifications.png")
                    background-position: 9px 50%
          img
            float: right
            margin: 0 0 0 10px
            border: 1px solid $grayblue
          .details
            overflow: hidden
            padding: 5px 0 0 0
            font-size: .92em
            line-height: 130%
            text-align: right
            color: #ffffff
            strong
              font-size: 1.09em
            ul.user_links
              font-size: 0.83em
              text-transform: uppercase
              text-align: right
              color: #62707d
              li
                display: inline-block
                &:before
                  content: "\2022\0000a0"
                &:first-child:before
                  content: ""
                a
                  text-decoration: none
                  color: #acd7ff

#content
  overflow: hidden
  padding: 20px 0
  background: #ffffff
  &.cms_page,
  &.newsfeed
    h2
      font-size: 1.4em
    .nav
      float: left
      margin: 0 20px 0 0
      width: 240px
      h3
        margin: 10px
        font-size: 14px
      ul
        li
          a
            border: 1px solid $grayblue
            margin: 0 0 1px 0
            display: block
            font-weight: bold
            padding: 7px 10px 6px 10px
            text-decoration: none
            color: $darker_blue
            &:hover
              border-color: $darker_gray
          &.active
            a
              border-color: $darker_gray
              background: $light_blue
              color: #394651
    .copy
      overflow: hidden
      padding: 40px 40px 25px 40px
      border: 1px solid $grayblue
      img
        float: right
        padding: 10px
        border: 1px solid $grayblue
        margin: 0 0 20px 20px
  &.newsfeed
    .article
      margin: 0 0 20px 260px
      padding: 20px
      h2
        border-bottom: 1px solid $grayblue
        padding: 0 10px 15px 10px
        margin: 0 -10px 15px -10px
      .meta
        font-weight: bold
        padding: 0
        border-top: 1px solid $grayblue
        padding: 15px 10px 0 10px
        margin: 15px -10px 0 -10px
    div
      .empty
        margin: 0 0 20px 260px

#page_heading
  padding: 10px 0 0 0
  border-bottom: 1px solid $darker_gray
  background: $light_blue
  .hgroup
    float: left
    width: 670px
    padding: 10px 0 20px 10px
  &.with_nav
    .site_column
      overflow: visible
      &:after
        display: block
        clear: both
        content: ""
  &.with_breadcrumbs
    padding-top: 20px
    .hgroup
      clear: both
      padding-top: 5px
    ul.breadcrumbs
      margin: 0 0 0 10px
      li
        float: left
        font-size: .92em
        a
          font-weight: bold
          text-decoration: none
          &:hover
            text-decoration: underline
        span
          margin: 0 10px
  &.discover_heading
    background: #dbebd2
    padding: 0
    .hgroup
      padding: 20px 0 20px 10px
    .site_column
      background: transparent image-url("v2/bg_discover-header.png") 112% 50% no-repeat
  .site_column
    overflow: hidden
  h1
    font-size: 2em
    font-weight: normal
    color: #394651
  h2
    margin: 5px 0 0 0
    font-size: 1.66em
    font-weight: normal
    color: $lighter_text_color
    small
      padding: 0 0 0 10px
      font-size: .6em
    &.greyedout
      color: #93a4b0
  p
    font-size: 1.08em
    line-height: 140%
    color: $lighter_text_color
    &.status
      color: #394651
    &.message
      clear: both
      background: #fff
      border: 1px solid #d4dce2
      text-align: center
      padding: 3px 0
      margin: 0 0 10px 0
  .page_actions
    float: right
    padding-left: 20px
    ul
      padding: 0 0 10px 0
    li
      overflow: hidden
      margin: 0 0 10px 0
      & + li
        margin: 0
      .link_button
        margin-left: 10px
    a
      float: right
    form.button_to
      float: right
      margin: 0
      input[type="submit"]
        +button
        margin: 0
  &.with_image
    overflow: hidden
    padding-bottom: 10px
    &.with_nav
      padding-bottom: 0
      overflow: visible
      img
        margin-bottom: 10px
    .hgroup,
    .hgroup_fields
      width: 640px
      padding: 0
      float: left
      h1
        padding-top: 10px
    img
      float: left
      margin: 0 20px 0 0
      border: 1px solid #394651
    input[type="text"],
    textarea
      padding: 8px
      font: normal 1em Helvetica, Arial, sans-serif
      color: #394651
      border: 1px solid $grayblue
      width: 610px
    .page_actions
      padding-top: 10px
      padding-bottom: 10px
      ul
        padding: 0
    input[type="text"]
      font-size: 16px
      margin: 0 0 5px 0
    textarea
      height: 40px
      margin: 0 0 10px 0

#page_heading, #known_uris
  ul.nav
    clear: both
    position: relative
    bottom: -1px
    li
      float: left
      margin: 0 1px 1px 0
      border: 1px solid #d4dce2
      border-bottom: none
      +border-top-left-radius(2px)
      +border-top-right-radius(2px)
      background: #f1f4f7
      a
        display: block
        padding: 10px
        font-size: 1.08em
        font-weight: bold
        text-decoration: none
        color: $darker_blue
      &.active,
      &:hover
        border-color: $darker_gray
        a
          color: #28323a
      &.active
        border-bottom: 1px solid #ffffff
        background: #fff
        margin-bottom: 0
#tabs_sidebar
  float: left
  position: relative
  z-index: 2
  width: 200px
  padding: 20px 0 0 0
  h3
    margin: 0 0 10px 10px
    font-size: 14px
  form
    padding: 0 0 0 10px
    dt
      padding-left: 5px

#sidebar
  float: right
  width: 180px
  padding: 0 0 0 20px
  h3
    padding: 0 0 10px 0
    font-size: 1.33em
  .empty
    font-size: 1em
    margin: 0 0 20px 0
  .collection_contributors
    margin: 0 0 20px 0
    li
      overflow: hidden
      padding: 0 0 20px 0
      line-height: 140%
    img
      float: left
      margin: 0 10px 0 0
      border: 1px solid #394651
    h4
      a
        color: inherit
        text-decoration: none
        &:hover
          text-decoration: underline
  .collection_list
    margin: 0 0 20px 0
    > .copy
      > p
        font-size: .83em
        margin: 0 0 10px 0
    li
      position: relative
      padding: 10px 0 10px 45px
      margin: 0 0 15px 0
      font-weight: bold
      a + a
        line-height: 140%
      img
        position: absolute
        left: 0
        top: 50%
        z-index: 1
        margin: -18px 0 0 0
        border: 1px solid #394651
  &.filters
    float: left
    width: 180px
    margin: 0 20px 20px 0
    img
      display: block
      margin: 0px -20px 20px -20px
  &.filters,
  .filters
    background: #f1f4dc
    border-bottom: 1px solid #ccd399
    padding: 20px
    margin-bottom: 20px
    h3
      padding: 0 0 15px 0
      font-size: 1.33em
    h4
      margin: 0 0 10px 0
    fieldset + h4,
    p + h4
      margin-top: 20px
    p
      padding: 0 0 0 10px
    h4,
    dt label
      font-weight: bold
      text-transform: uppercase
      color: #667309
    dd
      margin: 0 0 10px 0
      padding: 0 0 0 10px
      + dt
        padding-top: 10px
      li
        padding: 0 0 8px 0
        label
          font-weight: bold
    fieldset.actions
      padding: 0 0 0 10px
      input
        margin-top: 10px
    &.small
      dd
        margin: 0
      fieldset.actions
        margin: 0
        input
          margin: 0 5px 5px 0

#collection
  .heading
    padding: 1px 10px 4px 10px
    text-align: center
  ul.object_list
    li
      img
        margin-right: -1px
      .checkbox
        float: right
        border: 1px solid $grayblue
        height: 68px
        line-height: 68px
        padding: 0 3px
      .editable
        clear: both
        margin: 0
      .annotation
        clear: both
        margin: 0
      .references
        clear: both
        font-size: .9em
        margin: 0
        p + p
          margin-top: 10px
      .references + p.sort_value
        padding-top: 10px
      p.sort_value
        clear: both
        font-size: .9em
      p.edit
        clear: both
        font-size: .9em
      .collection_item_form
        margin: 1.5em 0 0 0
        textarea
          display: block
          clear: both
          +textarea
          width: 460px
          height: 50px
        label
          font-weight: bold
          margin: 10px 0 0 0
          display: block
          small
            display: inline
        input[type="text"]
          +input
  ul.collection_gallery
    padding-top:  20px
    li
      float: left
      position: relative
      width: 88px
      min-height: 88px
      margin: 0 0 20px 14px
      padding: 0
      img
        position: absolute
        left: 0
        top: 0
        +set_dimensions($logo_size_standout, $logo_size_standout)
        z-index: 2
      h4
        +screenreader_accessible
        a
          text-decoration: none
          color: #394651
        &.balloon
          font-weight: normal
          overflow: hidden
          position: absolute
          top: 0
          left: -10px
          z-index: 3
          margin: 68px 0 0
          width: 102px
          padding: 3px
          background-color: #394651
          background: rgba(57, 70, 81, 0.9)
          color: #fff
          a
            color: #fff
      span.icon
        position: absolute
        left: 0
        top: 0
        padding: 0
        width: 86px
        height: 86px
        border: 1px solid $grayblue
        margin: 0
        display: block
        z-index: 1
      &.first
        margin-left: 0
        clear: left
      .checkbox
        position: absolute
        border: 1px solid $grayblue
        top: 0
        left: 0
        padding: 8px
        margin: 0
        background: #fff
        z-index: 3
  ul.collection_names
    padding-bottom: 12px
    li
      border-bottom: 1px solid $grayblue
      overflow: hidden
      padding: 5px 10px
      .checkbox
        float: right
        margin: 0
      h4
        small
          font-weight: bold
          color: $lighter_text_color

#collections_edit
  width: 500px
  margin: 0 auto
  h2
    margin: 0 0 20px 0
  input[type="text"]
    +input(488px)
  textarea
    width: 482px
    height: 60px
  fieldset.actions
    padding: 20px 0
    input[type="submit"]
      padding: 7px 10px
      font-size: 1em

#community_collections, #profile_collections, #profile_communities
  ul.object_list
    img
      float: left
      margin: 0 20px 0 0
    & + .heading
      margin-top: 40px
#profile_newsfeed
  form.comment
    padding: 5px 0 20px 15px
    margin: 0
    border-bottom: 1px solid #D4DCE2
    fieldset
      margin: 0
    textarea
      width: 580px
      height: 100px
    input[type="submit"]
      font-size: 1em
      padding: 7px 10px
#profile_newsfeed, #profile_activity
  ul.feed
    > li
      form.edit_comment
        textarea
          width: 580px
#profile_info
  padding: 40px
  .section.half
    float: left
    width: 299px
    margin-right: 20px
    + .half
      margin-right: 0
    dl
      line-height: 140%
      margin: 0 0 40px 0
      dt
        font-weight: bold
      dd
        margin: 0 0 5px 20px
      &.activity
        overflow: hidden
        text-align: right
        dt
          float: left
#profile_curator_info,
#profile_content_partner
  width: 640px
  fieldset
    padding-top: 10px
    dt
      margin: 0
      p, label, ol, ol li
        margin-bottom: 0
    dd
      margin: 0 0 10px 0
      input[type="text"]
        +input
      textarea
        width: 600px
        height: 60px
    input[type="submit"]
      padding: 7px 10px
      font-size: 1em

#profile_curator_info
  fieldset
    label
      font-size: 1.2em

#profile_notifications
  width: 680px
  .copy
    form
      fieldset
        padding: 20px
        dt
          width: 360px
          clear: both
          float: left
          label
            font-weight: normal
        dd
          width: 200px
          float: right
          text-align: right
        &.actions
          border-top: 1px solid $grayblue

#profile_content_connections
  padding: 40px
  ul
    margin: 0 0 30px 0
    li
      overflow: hidden
      margin: 0 0 10px 0
      > a
        float: left
        border: 1px solid #394651
        margin: 0 10px 0 0
        img
          display: block
      .details
        overflow: hidden
        margin: 5px 0 0 0
        a
          color: #27282B
          +underline-on-hover

#content_partner
  padding: 40px
  fieldset
    input[type="text"],
    input[type="password"]
      +input
    textarea
      width: 622px
      height: 60px
    input[type="submit"]
      padding: 7px 10px
      margin: 0 10px 0 0
      font-size: 1em
  &.contact
    padding: 0
    width: 640px

#new_content_partner_agreement, form.edit_content_partner_agreement
  dl
    clear: both
    dd
      margin: 0 0 10px 0
      input[type="text"]
        +input
      textarea
        +input(700px)
        height: 400px

#content_partner_show
  #sidebar
    width: 240px
    padding-left: 40px
    padding-bottom: 20px
    ul
      li
        margin: 0 0 20px 0
        h4
          b
            font-size: .9em
            color: $darker_blue
        p
          font-size: .9em
          line-height: 140%
          & + p
            a
              font-weight: bold
    dl
      margin: 0 0 5px 0
      overflow: hidden
      line-height: 140%
      dt
        clear: both
        float: left
        padding-right: 0.5em
        font-weight: bold
        &.actions
          float: none
  .main_container
    border: none
    padding: 0
    table.standard
      font-size: .9em
      thead
        tr
          th
            padding: 5px 10px
            white-space: nowrap
      tbody
        tr
          td
            padding: 5px 10px
            &.actions
              white-space: nowrap
              a
                margin: 0 5px 0 0
                & + a
                  margin: 0
    &#resources_show
      .section
        &.half
          float: left
          width: 299px
          margin-right: 20px
          margin-bottom: 40px
        dl
          line-height: 140%
          margin: 10px 0
          dt
            font-weight: bold
          dd
            margin: 0 0 5px 20px
        &.processing_status
          clear: both
      .group
        h4
          font-style: italic
          font-weight: normal
        dt
          margin-left: 20px
        dd
          margin-left: 40px
  .empty
    font-size: 1em
  .agreement
    address
      display: block
      width: 40%
      line-height: 170%
      &.partner
        float: left
      &.eol
        float: right
  dl.agreement
    margin: 0 0 15px 0
    line-height: 140%
    dd
      margin-bottom: 5px
  p
    &.resource_status
      border: 1px solid $grayblue
      background: #f1f4f7
      padding: 20px
      margin: 0 0 10px
      font-size: 1.66em
      font-weight: bold
      text-align: center
      &.upload_failed, &.processing_failed, &.validation_failed
        background: #ffeae6
        border-color: #f2d2cc
#content_partner_edit, #content_partner_new
  &.site_column
    width: 640px

ul.content_partner_contacts
  li
    margin: 0 0 20px 0
#content_partner_statistics
  .main_container
    border: none
    padding: 0
  .header
    border-top: 1px solid $grayblue
    padding-top: 1em
    margin-top: 40px
  .heading
    text-align: center
    fieldset, input[type="submit"]
      display: inline
      margin: 0
  table
    margin-top: 20px
    caption
      line-height: 170%
      font-size: 1.08em
      font-weight: bold
#content_partner_resources
  width: 600px
  fieldset
    padding-top: 10px
    dl
      dt
        margin: 0
        p, label, ol, ol li
          margin-bottom: 0
      dd
        margin: 0 0 10px 0
        input[type="text"]
          +input(588px)
        textarea
          width: 582px
          height: 60px
        ul
          li
            list-style-type: none
            margin: 2px 0
      &.resources
        padding-bottom: 20px
        > dd
          border: 1px solid $grayblue
          background: #eff2f4
          padding: 20px 30px 0 30px
          margin: 5px 40px 20px 40px
          input[type="text"]
            width: 448px
          input[type="file"]
            margin: 0
    input[type="submit"]
      padding: 7px 10px
      font-size: 1em

#community
  padding: 0 20px

#community_new
  .copy
    width: 300px
    float: right
    margin: 0 0 0 40px
  form
    float: right
    width: 600px
    dt
      p
        margin: 0
    input[type="text"]
      +input
    textarea
      width: 582px
      height: 100px
    dd.invite
      position: relative
      input[type="text"]
        display: none
      textarea
        height: 40px
      ul.spotlite-results
        li
          border: 1px solid #d4dce2
          +border-radius(3px)
          float: left
          padding: 4px 5px
          cursor: pointer
          background: image-url("v2/icon_remove.png") no-repeat 5px center
          padding-left: 17px
          margin: 0 5px 5px 0
          &:hover
            background-color: $fieldset_light_blue
    fieldset
      &.actions
        clear: both
        width: 100%
        input[type="submit"]
          font-size: 1em
          padding: 7px 20px
          margin: 10px 20px 10px 0
#taxon_names
  .article.recognized
    ul
      span
        margin: 0 10px
      a.view
        font-size: .9em
  .main_container
    h4
      font-size: 1.2em
      margin: 0 0 10px 20px
  table.standard
    tr
      td
        position: relative
        width: 33%
        &.preferred
          background: image-url("v2/icon_required.png") 7px 1em no-repeat
#taxon_literature
  .main_container
    .bhl_description
      overflow: hidden
      margin: 0 0 20px 0
      p
        margin: 5px 20px 10px 220px
      a
        font-weight: normal
        +underline-on-hover
      img
        float: left
        margin: 0
    .heading
      text-align: center
      margin: 0 0 20px 0
    table
      tr
        td
          vertical-align: middle
          &.pages
            white-space: nowrap
          a
            font-weight: bold
            +underline-on-hover
          + td
            font-size: .9em
            line-height: 120%
            color: $darker_blue

#taxon
  float: left
  width: 580px
  .gallery
    overflow: hidden
    padding: 20px 20px 10px 20px
    border: 1px solid $grayblue
    .images
      float: left
      position: relative
      width: 430px
      z-index: 0
      .image
        background: #ffffff
        > a
          display: block
          position: relative
          width: 430px
          height: 310px
          line-height: 310px
          text-align: center
          > img
            margin: 0 auto
            vertical-align: middle
        span.flag
          padding: 1px 2px
          font-size: .75em
          line-height: 1em
          vertical-align: 1px
          text-transform: uppercase
          color: #ffffff
          &.trusted
            border: 1px solid #6b7910
            background: #849513
          &.unreviewed
            border: 1px solid #677682
            background: #8695a1
    ul.thumbnails
      float: right
      width: 100px
      padding: 0
      background: transparent
      li
        width: 98px
        height: 68px
        margin: 0 0 10px 0
        border: 1px solid $grayblue
        background: $light_blue
        overflow: hidden
        line-height: 68px
        text-align: center
        img
          vertical-align: middle
        &.active
          width: 94px
          height: 64px
          border: 3px solid #c1d62e
          line-height: 64px
          text-align: center
          img
            margin: -2px 0 0 -2px
    .attribution
      position: relative
      margin: 5px 0 0 0
      z-index: 100
      font-size: .92em
      p
        margin: 0
        line-height: 120%
      img
        position: absolute
        top: 50%
        left: 0
        margin-top: -8px
        + .copy
          padding: 0 0 0 90px
    p.all
      float: right
      padding: 5px 0 0 0
      font-weight: bold
      text-transform: lowercase
  p.languages
    padding: 2px 20px
    border-top: 1px solid $grayblue
    border-bottom: 1px solid $grayblue
    background: $fieldset_light_blue
    margin: 10px 0
    line-height: 160%
    font-weight: bold
    font-size: .9em
    text-align: center
  .article.overview
    margin: 35px 0 0 0
    .copy
      margin: 0 0 15px 0
      line-height: 170%
    .meta.learn_more
      padding: 0 0 10px 0
      p, form
        float: none
        display: inline
        margin: 0 10px 0 0
        &:after
          content: "\2022\0000a0"
          margin: 0 0 0 10px
        &.last
          &:after
            content: ''
  .article.half
    float: left
    width: 260px
    &.clear
      clear: both
      margin: 0 20px 0 0
  + #sidebar
    width: 340px
    padding: 0
    margin-bottom: 20px
    h3
      padding: 0 10px 3px 10px
      font-size: 1.16em
    #classifications_summary
      a.current
        font-weight: bold
      > ul
        line-height: 160%
        font-size: .9em
        > li
          white-space: nowrap
          overflow-x: auto
          border: 1px solid #d7dadc
          padding: 10px 15px
          margin: 0 -10px 20px -10px
          h4
            font-weight: normal
            a
              font-weight: bold
          ul
            margin-left: 10px
    .article
      &.list
        > ul
          > li
            + li
              border: none
            > a > img, img.no_user
              margin: 10px 10px 0 0
            .details
              margin: 10px 0 0 0
            .editable
              margin: 10px 0 0 0
              > a > img
                margin: 0 10px 0 0
              .details
                margin: 0
      &.updates
        padding: 0 10px 25px 10px
        > ul
          border-bottom: 1px solid #d7dadc
        form
          &.comment
            padding: 20px 10px 0 10px
            margin: 0 -10px
            img
              border: 1px solid #394651
            textarea
              width: 240px
            fieldset.actions
              padding: 0 0 0 60px
              input[type="submit"]
                padding: 6px 15px
          &.edit_comment
            textarea
              width: 300px
#taxon_detail
  #sidebar
    float: left
    width: 220px
    padding: 0 20px 20px 20px
    margin: 0 20px 0 0
    border-bottom: 1px solid #ccd399
    background: #f1f4dc
    img
      display: block
      margin: 0 -20px 20px -20px
    h4
      padding: 0 0 8px 0
      font-size: .83em
      text-transform: uppercase
      color: #667309
    ul
      padding: 0 0 0 10px
      li
        padding: 0 0 8px 0
        font-weight: bold
      a
        text-decoration: none
        color: #394651
  #main
    overflow: hidden
    p.languages
      padding: 2px 20px
      border-top: 1px solid $grayblue
      border-bottom: 1px solid $grayblue
      background: $fieldset_light_blue
      margin: 0 0 20px 0
      line-height: 160%
      font-weight: bold
      font-size: .9em
    > h2
      padding: 10px 20px
      margin: 0 0 20px 0
      text-transform: uppercase
      color: $loafer_text_color
      border: 1px solid #ccd399
      border-width: 1px 0
      background: #f1f4dc
    > .section
      > h3
        padding: 0 20px 20px 20px
        font-size: 2em
      > .article
        padding: 20px
        border: 1px solid $grayblue
        margin: 0 0 20px 0
        > h4
          font-size: 1.5em
        > .copy
          border-top: 1px solid $grayblue
          border-bottom: 1px solid $grayblue
          padding: 20px 10px 15px 10px
          margin: 0 -10px 20px -10px
          line-height: 170%
          &.link
            border: none
            padding: 0px 10px 15px 10px
        > .references
          border-bottom: 1px solid $grayblue
          padding: 0 10px
          margin: 0 -10px 20px -10px
          line-height: 170%
          ul
            margin: 0 40px 15px 40px
            li
              list-style-type: disc
              margin: 0 0 10px 0
        > .meta
          padding: 0 0 10px 0
          &.learn_more
            padding: 0 0 20px 0
            p, form
              float: none
              display: inline
              margin: 0 10px 0 0
              &:after
                content: "\2022\0000a0"
                margin: 0 0 0 10px
              &.last
                &:after
                  content: ''
        > p.flag
          float: left
          padding: 1px 2px
          font-size: .83em
          text-transform: uppercase
          color: #ffffff
          margin: 0 40px 0 0
          &.trusted
            border: 1px solid #6b7910
            background: #849513
          &.unreviewed
            border: 1px solid #677682
            background: #8695a1
        > p.filing
          float: left
          margin-right: 30px
        > .average_rating
          float: left
          padding: 2px 40px 0 0
          margin: 0 0 20px 0
        > .rating
          padding: 2px 0 20px 0
        > p.actions
          clear: both
          margin: 0 0 20px 0
        a.button
          display: inline-block
          padding: 7px 20px
          margin: 0 15px 0 0
          font-size: 1em
          &.comment
            display: none
      > form.comment
        padding: 0 15px 0 0
        textarea
          width: 522px
        input[type="submit"]
          padding: 7px 20px
        a.cancel
          display: none

#taxon_resources
  .main_container
    table.standard
      img
        display: block

#text_object_new_edit
  fieldset
    width: 630px
    float: left
    dl
      margin: 0
      padding-left: 10px
    input[type="text"]
      +input
    textarea
      width: 580px
      height: 200px
      &#data_object_description
        height: 300px
    &.content + fieldset
      width: 300px
      input[type="text"]
        width: 288px
      textarea
        width: 282px
        height: 100px
    &.actions
      padding-left: 8px
      clear: both
      width: 100%
      input[type="submit"]
        font-size: 1em
        padding: 7px 20px
        margin: 10px 20px 10px 0
#permalink
  .article.list.updates
    padding: 0 10px
    > ul
      > li
        .editable
          margin: 0
        > a > img
          margin: 15px 10px 0 0
        .details
          margin: 15px 0 0 0
  .ratings
    h5
      float: left
      padding: 0 0 5px 0
      font-size: 1.16em
    > .rating
      border-color: #c1d72e
      ul, li[class^="current_rating"], a
        height: 17px
      ul,
      li[class^="current_rating"],
      ul a:hover,
      ul a:active,
      ul a:focus
        background-image: image-url("v2/icon_permalink-stars.png")
      ul
        width: 100px
  .media
    float: left
    width: 540px
    padding: 19px
    margin: 0 0 40px 0
    border: 1px solid $grayblue
    img
      display: block
      margin: 0 auto
    p
      padding-top: 8px
      text-align: center
    video
      max-width: 540px
  &.image
    #main
      .article
        .copy
          line-height: 170%
          word-wrap: break-word
  &.text
    #main
      .article.copy
        overflow: hidden
        padding: 40px
        margin: 0 0 40px 0
        border: 1px solid $grayblue
        .references
          margin: 20px 0 0 0
          padding: 20px 0 0 0
          border-top: 1px solid $grayblue
  #main
    clear: both
    float: left
    width: 580px
    form
      &.comment
        padding: 20px 10px 0 10px
        margin: 10px -10px 0 -10px
        border-top: 1px solid #d7dadc
        textarea
          width: 480px
          height: 100px
      &.edit_comment
        textarea
          width: 540px
  #sidebar
    .article
      &.list
        > ul
          > li
            + li
              border-top: none
    width: 340px
    padding: 0
    h3
      padding: 0 10px 3px 10px
      font-size: 1.16em
    ul.review_status
      p
        float: right
        padding: 1px 2px
        font-size: .75em
        text-transform: uppercase
        color: #ffffff
        &.trusted
          border: 1px solid #6b7910
          background: #849513
        &.unreviewed
          border: 1px solid #677682
          background: #8695a1

  .article.source
    p
      font-size: .92em
      line-height: 150%
      &.inappropriate
        a
          color: #cd331e
  form.review_status
    fieldset
      padding: 0 10px 0 10px
      margin: 0 0 10px 0
      border-bottom: 1px solid #d7dadc
      &.actions
        padding: 10px 0 0 10px
        border: none
    legend
      padding: 0 0 5px 0
      font-size: 1.16em
      font-weight: bold
    p
      padding: 0 0 10px 0
      font-size: .92em
    select
      margin: 0 5px 10px 0
      + select
        margin-left: 5px
    textarea
      +textarea
      width: 282px
      height: 44px
      margin: 0
    ul
      margin: 0 0 10px 0
      li
        display: inline
        font-weight: bold
        font-size: .92em
        margin: 0 10px 0 0
        input
          margin: 0 3px 0 0
  #crop_panel
    height: 140px
    .preview
      float: left
      margin-left: 10px
      .title
        padding: 0 0 4px 0
        font-weight: bold
    .crop_preview
      overflow: hidden
      border: 2px black solid
      &.width_130
        width: 130px
        height: 130px
      &.width_88
        width: 88px
        height: 88px
  #crop_form
    clear: both
    padding: 4px 0 0 10px

#permalink_add_association
  width: 700px
  > form
    background: #f1f4dc
    border-top: 1px solid #ccd399
    border-bottom: 1px solid #ccd399
    text-align: center
    padding: 20px 0
    margin: 0 0 20px 0
    label
      font-weight: bold
      margin: 0 20px 0 0
    input[type="text"]
      +input(200px)
    input[type="submit"]
      padding-right: 20px
      padding-left: 20px
      margin: 0 20px 0 10px
  #main
    .header
      position: relative
      padding: 10px 0
      text-align: center
      border-bottom: 1px solid #394651
      h3
        font-size: 1.33em
      .pagination
        width: 100%
        position: absolute
        top: 10px
        left: 0
        margin: 0
    > ul
      > li
        overflow: hidden
        padding: 10px
        border-bottom: 1px solid #d7dadc
        img
          float: left
          margin: 0 20px 0 0
        .details
          float: left
          h4
            font-size: 1.2em
            margin: 15px 0 3px 0
            a
              color: #28323a
              text-decoration: none
              &:hover
                text-decoration: underline
          p
            color: $lighter_text_color
            margin: 0 0 10px 0
          ul
            li
              margin: 0 0 3px 0
              font-size: .9em
              color: $lighter_text_color
              form
                display: inline
                input[type="submit"]
                  font-size: .9em
                  padding: 2px 0
                  width: 100px
                  margin: 0 10px 0 0
              span
                margin: 0 5px

#worklist
  .filters
    overflow: hidden
    padding: 15px 25px
    margin: 0 0 20px 0
    border-bottom: 1px solid #ccd399
    background: #f1f4dc
    fieldset
      dl
        float: left
        dt
          label
            text-transform: uppercase
            color: #667309
        dd
          padding: 0
#worklist
  .filters
    fieldset.actions
      margin: 10px 0 0 0
      input[type="submit"]
        float: left
        margin: 0 20px 0 0
      p
        display: inline
        font-weight: bold
        line-height: 170%
        color: #667309
  form
    &.comment
      padding: 20px 10px 0 10px
      margin: 10px -10px 0 -10px
      border-top: 1px solid #d7dadc
      textarea
        width: 420px
        height: 100px
    &.edit_comment
      textarea
        width: 450px
  #tasks
    float: left
    width: 380px
    ul
      float: left
      width: 360px
      margin: 0 20px 25px 0
      border: 1px solid $darker_gray
      border-top: none
      border-bottom: none
      li
        clear: both
        float: left
        position: relative
        width: 340px
        padding: 10px
        cursor: pointer
        background: $fieldset_light_blue
        border-top: 1px solid $darker_gray
        + li
          border-top: 1px solid #d7dadc
        &.last
          border-bottom: 1px solid $darker_gray
        &:hover
          background-color: #ffffff
        p
          padding: 10px 0 0 0
          font-weight: bold
          line-height: 140%
          color: $lighter_text_color
          font-size: .92em
        a
          display: block
          font-size: 1.13em
          text-decoration: none
          color: #28323a
        span.icon
          float: left
          width: 48px
          height: 48px
          margin: 0 10px 0 0
          border: 1px solid $grayblue
        span.indicator
          position: absolute
          right: -8px
          top: 50%
          z-index: 1
          padding: 1px 3px
          margin: -8px 0 0 0
          font-weight: bold
          text-transform: uppercase
          text-shadow: 0 1px 1px rgba(107, 121, 16, .75)
          color: #ffffff
          border: 1px solid #677682
          background: #8695a1
          &::after
            display: block
            position: absolute
            right: -1px
            top: -8px
            z-index: 1
            width: 7px
            height: 7px
            content: ""
            background: transparent image-url("v2/bg_wrap-behind-tail.png") 0 0 no-repeat
        img
          float: right
          border: 1px solid #394651
        &.ignored
          background: #d2d9df
        &.saved
          background: #dde3cc
          span.icon, p
            +opacity(.6)
          span.indicator
            border-color: #849517
            background: #9fb31b
            &::after
              background-position: 0 100%
        &.active
          width: 340px
          padding-right: 30px
          border: 1px solid $darker_gray
          border-left: none
          border-right-color: #ffffff
          background: #ffffff
          + li
            border: none
    p.more
      text-align: center
      a
        display: inline-block
  #task
    overflow: hidden
    padding: 19px
    border: 1px solid $darker_gray
    #sidebar
      h3
        padding: 0 10px 3px 10px
        font-size: 1.16em
    .article.list.updates
      padding: 0 10px
      > ul
        > li
          .editable
            margin: 0
          > a > img
            margin: 15px 10px 0 0
          .details
            margin: 15px 0 0 0
    .media
      margin: 0 0 20px 0
    form.review_status
      legend
        padding: 0 0 5px 0
        font-size: 1.16em
        font-weight: bold
      select
        margin: 0 0 5px 0
      p
        padding: 0 0 5px 0
      ul
        padding: 0 0 5px 0
        li
          display: inline
          padding: 0 20px 0 0
          label
            font-weight: bold
      textarea
        width: 486px

label.hiddenoverlay
  position: absolute
  right: 0
  bottom: 0
  z-index: 2
  font-size: 0.75em
  padding: 1px 2px
  text-transform: uppercase
  font-weight: bold
  background: none repeat scroll 0 0 #ffeae6
  border: 1px solid #f2d2cc
  color: #677682
#media_list
  #sidebar
    padding-top: 0
  #main
    overflow: hidden
    .header
      position: relative
      padding: 10px 0
      margin: 0 0 20px 0
      text-align: center
      border-bottom: 1px solid #394651
      h3
        font-size: 1.33em
      .pagination
        margin: 0
  ul.media
    > li
      float: left
      width: 160px
      padding: 0 0 30px 20px
      .figure
        position: relative
        background: #ffffff
        cursor: pointer
        .overlay
          position: absolute
          left: 0
          top: 0
          z-index: 1
          width: 100%
          height: 100%
        label
          display: none
          position: absolute
          right: 0
          bottom: 0
          left: 0
          z-index: 2
          padding: 10px
          font-weight: bold
          background: transparent image-url("v2/bg_exemplar.png") repeat
        &:hover
          label
            display: block
      &.no_thumbnail
        .figure
          cursor: default
      &.inappropriate
        .figure
          .overlay
            background: transparent image-url("v2/bg_media-inappropriate.png") 50% 0 no-repeat
          img
            +opacity(.5)
      &.untrusted
        .figure
          img
            +opacity(.5)
      a.image
        display: block
        height: 125px
        width: 160px
        margin: 0 0 5px 0
        img
          display: block
          margin: 0 auto
      fieldset
        clear: both
        select
          margin: 0 0 3px 0
      .ratings
        > .rating
          display: none
          float: left
          margin: 0 0 5px 0
        &:hover
          .average_rating
            display: none
          > .rating
            display: block
        &.rated
          > .rating
            display: block
          .average_rating
            display: none
      .average_rating
        float: left
        margin: 0 0 5px 0
      p.flag
        float: right
        padding: 1px 2px
        font-size: .75em
        text-transform: uppercase
        color: #ffffff
        &.trusted
          border: 1px solid #6b7910
          background: #849513
        &.unreviewed
          border: 1px solid #677682
          background: #8695a1
      a.button
        clear: both
        display: inline-block
        padding: 4px 10px
        font-size: .92em
      &.first
        clear: both
        padding-left: 0
    + .footer
      border-top: 1px solid #394651
      padding-top: 12px
      clear: both
#search_results
  #main
    .header
      position: relative
      padding: 10px 0
      text-align: center
      border-bottom: 1px solid #394651
      h3
        font-size: 1.33em
      .pagination
        width: 100%
        top: 10px
        left: 0
        margin: 0

#collections_endorse
  width: 700px
  padding: 20px 0 0 0
  margin: 0 auto
  h3
    border: none
  li
    overflow: hidden
    padding: 10px
    border-bottom: 1px solid #d7dadc
    img
      float: right
      border: 1px solid #394651
    span.icon
      float: left
      width: 68px
      height: 68px
      margin: 0 20px 0 0
      border: 1px solid $grayblue
      background: $fieldset_light_blue image-url("v2/icon_communities_tabs.png") 50% 50% no-repeat
    p
      padding: 6px 0 0 0
      font-weight: bold
      line-height: 160%
      color: $lighter_text_color
    h4
      padding: 15px 0 0 0
    a
      display: block
      font-size: 1.16em
      text-decoration: none
      color: #28323a

#taxon_community
  .article.list
    > ul
      > li
        + li
          border: none

#taxon_maps
  #gmap
    margin: 0
    padding: 0
  #panel
    float: left
    height: 0px
    width: 0px
  /* The following was added from Eli's CSS: */
  #map-container
    height: 100%
    background: white
  #map-canvas
    height: 500px
    width: 900px
  #goBackUI:hover, #goNextUI:hover, #goOrigUI:hover, #goPanelUI:hover, #goFullUI:hover
    background: #e0ecff
  #goBackUI, #goNextUI, #goOrigUI, #goRadioUI, #goPanelUI, #goFullUI
    background-color: #fff
    border: 2px solid #fff
    box-shadow: 0 2px 6px rgba(0,0,0,.3)
    cursor: pointer
    float: left
    text-align: center
    margin-left: 4px
  #goBackText, #goNextText, #goOrigText, #goRadioText, #goPanelText, #goFullText
    color: rgb(25,25,25)
    margin: 3px
  #markerlist
    height: 93%
    margin: 5px 2px 0 5px
    overflow: auto
  .title
    border-bottom: 1px solid #e0ecff
    overflow: hidden
    cursor: pointer
    padding: 2px 0
    display: block
    color: #000
    text-decoration: none
  .title:visited
    color: #000
  .title:hover, #goRadioUI:hover
    background: #e0ecff
  .info
    width: 400px
  .info img
    border: 0
  .info-body
    width: 400px
    height: 200px
    line-height: 200px
    margin: 2px 0
    text-align: center
    overflow: hidden
  .info-img
    height: auto
    width: 100%
  /* The above was added from Eli's CSS: */
  #map
    p
      margin: 10px
  #media_list
    padding: 30px 0
    ul.media
      padding: 0 30px

#taxon_updates
  .header
    position: relative
    padding: 10px 0
    text-align: center
    border-bottom: 1px solid #394651
    h3
      font-size: 1.33em
    a
      position: absolute
      right: 10px
      top: 15px
      z-index: 1
      font-weight: bold
      &.prev
        right: auto
        left: 10px
  .page_statistics
    dl
      float: right
      line-height: 140%
      width: 200px
      padding: 50px 30px 30px 0
      dt
        font-size: 1.8em
        margin: 0 0 10px 0
        & + dd
          font-size: 2em
          & + dt
            font-size: 1.2em
            & + dd
              font-size: 1.6em
      dd
        font-weight: bold
        margin: 0 0 20px 0
    .copy
      float: left
      width: 380px
      margin-top: 30px
      background: $fieldset_light_blue
      border: 1px solid $grayblue
      padding: 20px 20px 0 20px
  .update_feed
    form.comment
      textarea
        width: 580px
    .article.updates
      padding: 0
      > ul
        > li
          form
            &.comment
              padding: 0
              margin-bottom: 10px
            &.edit_comment
              textarea
                width: 650px
#content.cms_page
  #statistics
    position: relative
    line-height: 2em
    padding-top: 40px
    .hide
      position: absolute
      left: -9327px
    h2
      font-size: 1.3em
      text-align: center
      margin: 0 0 20px 0
      font-weight: bold
      text-transform: uppercase
      + p
        font-size: 1.2em
        span
          display: block
          position: absolute
          top: 40px
          font-weight: bold
          text-decoration: none
          color: #394651
          &.date_one
            left: 30px
            padding-left: 30px
          &.date_two
            right: 30px
            padding-right: 30px
    form
      label
        img
          position: absolute
          top: 43px
          left: 30px
        + label
          img
            left: auto
            right: 30px
      &.with_picker
        span, select, input[type="submit"]
          display: none
    dl
      position: relative
      border: 1px solid $darker_gray
      line-height: 2.2em
      background: #f6f8fa
      margin: 0 0 40px 0
      float: left
      width: 100%
      dt
        text-align: center
        background: #f6f8fa
        width: 248px
        margin: 0 auto
        position: relative
        font-weight: normal
        span
          display: block
        &.emphasize
          span
            font-size: 130%
          + dd,
          + dd + dd
            span
              font-size: 130%
              line-height: 140%
      dd
        margin: 0
        width: 160px
        border-right: 1px solid $darker_gray
        background: $light_blue
        float: left
        text-align: right
        position: relative
        margin-top: -2.2em
        height: 2.2em
        z-index: 10
        color: #7a838b
        + dd
          float: right
          text-align: left
          border-right: none
          border-left: 1px solid $darker_gray
        span
          display: block
          background: $light_blue
          padding: 1px 20px
          line-height: 1.9em
          margin: 1px 0
        &.greater
          z-index: 11
          span
            background: #fff
            padding: 0 22px
            border: 1px solid $darker_gray
            margin: 1px -3px
            color: #394651

#comment_edit
  textarea
    width: 600px
    +textarea

#content.session
  background: $light_blue
  #sign_up, #sign_in, #recover_account
    overflow: hidden
    width: 640px
    min-height: 295px
    margin: 0 auto
    border: 1px solid $grayblue
    background: #f0f4f7 image-url("v2/bg_sign-in.gif") 0 0 no-repeat
    padding-bottom: 40px
    h1
      font-size: 2em
      font-weight: normal
      text-align: center
      padding: 75px 40px 0
    > form
      padding: 25px 159px 20px 159px
      width: 320px
      h2
        text-align: center
        padding: 0 0 25px 0
        font-size: 1.2em
        font-weight: normal
      label
        font-size: 1.08em
      input[type="text"], input[type="password"]
        +input
      input[type="submit"]
        padding: 7px 10px
        margin: 0 10px 0 0
        font-size: 1em
      dl.captcha
        margin: 20px 0 20px -65px
      a
        font-weight: bold
      label.checkbox
        padding: 0 0 15px 0
      &.terms_agreement
        padding: 25px 100px
        width: 440px
        h2
          text-align: left
          padding-bottom: 0
    .open_authentications, .pending
      overflow: hidden
      width: 400px
      padding: 25px 100px 20px 140px
      form
        float: left
        margin-bottom: 20px
        fieldset.actions
          padding-left: 32px
          height: 31px
          margin: 0
          input[type="submit"]
            padding: 7px 10px 8px
            margin: 0 10px 0 0
            font-size: 1em
            min-width: 155px
        &#new_user_facebook, &#new_session_facebook
          fieldset.actions
            background: transparent image-url("v2/icon_social_plugins.png") 0 0 no-repeat
        &#new_user_twitter, &#new_session_twitter
          fieldset.actions
            background: transparent image-url("v2/icon_social_plugins.png") 0 -34px no-repeat
        &#new_user_yahoo, &#new_session_yahoo
          fieldset.actions
            background: transparent image-url("v2/icon_social_plugins.png") 0 -68px no-repeat
        &#new_user_google, &#new_session_google
          fieldset.actions
            background: transparent image-url("v2/icon_social_plugins.png") 0 -102px no-repeat
      & + p
        clear: both

#profile_edit
  p.tip
    margin: 0 10px 20px 10px
  input[type="text"], input[type="password"]
    +input(248px)
  .header
    margin: 0 0 20px 0
  .fieldsets
    float: left
    overflow: hidden
    margin: 0
    padding: 0
    button
      display: block
  fieldset
    padding: 0 40px 20px 0
    dl
      padding: 0 10px
    dt
      font-size: 1.08em
      font-weight: bold
    button
      +button
    &.profile,
    &.account
      width: 320px
      input[type="text"],
      input[type="file"],
      input[type="password"]
        width: 288px
    &.profile
      dd
        img
          display: block
          margin: 0 0 15px 0
          border: 1px solid #394651
      textarea
        width: 282px
        height: 120px
      ul
        overflow: hidden
        li
          float: left
          padding: 0 10px 5px 0
          font-weight: bold
    &.account
      input[type="checkbox"],
      select
        margin-left: 10px
      ul
        margin: 0 20px 0
        li
          list-style: none
          margin: 0 0 5px 0
          padding: 0 20px 0
          background: transparent image-url("v2/icon_social_plugins.png") no-repeat 0 0
          background: none\9
          background-size: 16px
          line-height: 140%
          small
            float: right
          &.facebook
            background-position: 0 0
          &.google
            background-position: 0 -53px
          &.twitter
            background-position: 0 -17px
          &.yahoo
            background-position: 0 -35px
    &.requests
      float: right
      word-break: break-word /* This is a very thin column and doesn't work well in other langs without wordbreaks. */
      width: 218px
      margin: 0
      padding: 0
      dl
        padding: 20px 20px 10px 20px
        margin-top: 20px
        background: $fieldset_light_blue
        border: 1px solid $grayblue
      p
        font-size: .9em
        padding-top: 5px
        font-weight: normal
        line-height: 150%
      textarea
        +textarea
        width: 158px
    &.actions
      clear: both
      float: none
      padding: 20px
      border-top: 1px solid $grayblue
      input[type="submit"]
        padding: 7px 10px
        margin: 0 10px 0 0
        font-size: 1em
      a
        font-weight: bold
#profile_open_authentications
  .article.list
    ul
      margin: 0 100px
      li
        position: relative
        padding-top: 20px
        h3
          font-size: 1.67em
          line-height: 150%
          background: transparent image-url("v2/icon_social_plugins.png") no-repeat 0 0
          min-height: 31px
        p, h3
          padding-left: 40px
        .buttons
          position: absolute
          top: 25px
          right: 0
          form, fieldset, div, input
            display: inline
            margin: 0
          form + form
            margin-left: 5px
        &.facebook
          h3
            background-position: 0 0
        &.google
          h3
            background-position: 0 -102px
        &.twitter
          h3
            background-position: 0 -34px
        &.yahoo
          h3
            background-position: 0 -68px
  > a
    display: block
    padding-top: 20px
    border-top: 1px solid $grayblue

#contact_us
  width: 640px
  dd
    input[type="text"], textarea
      width: 500px
    select
      max-width: 500px
  input[type="submit"]
    font-size: 1.2em

ul.spotlite-matches
  background: #fff
  border: 1px solid #d4dce2
  li
    padding: 4px 5px
    &.spotlite-selected
      background: #f1f4dc

#modal
  width: 600px
  padding: 20px
  background: #fff
  z-index: 999
  #choose_collections, #choose_communities
    h2
      font-size: 1.33em
      margin: 0 0 10px 0
    fieldset
      &.new_community
        input[type="text"]
          +input(210px)
      &.new_collection
        overflow: hidden
        margin: 0 0 20px 0
        input[type="text"]
          float: left
          +input(210px)
          margin: 0 10px 0 0
    input[type="submit"]
      padding-left: 20px
      padding-right: 20px
      font-size: 1.08em
      padding: 5px 10px 6px 10px
    ul
      border: 1px solid $grayblue
      height: 230px
      overflow-y: scroll
      margin: 0 0 20px 0
      li
        font-weight: bold
        padding: 5px 10px
        &.collected
          background: #f4f4f4
        input[type="checkbox"]
          margin: 0 5px 0 0
        a, span
          font-size: .95em
        & + li
          border-top: 1px solid $grayblue

#modal_layer
  display: none
  z-index: 998
  position: fixed
  background: #28323a
  +opacity(.8)
  top: 0
  left: 0
  width: 100%
  height: 100%

.news_details
  li, blockquote
    margin: 0 0 0 40px
  ol
    li
      list-style: decimal
  ul
    li
      list-style: disc

#taxon_detail
  .empty
    .link_button
      margin-left: 7px

.auto_margin
  margin: 0px auto

#sidebar
  .ratings dl
    font-size: 0.83em
    font-weight: bold
    margin: 0 0 10px 0
    overflow: hidden
    dt
      clear: left
      float: left
      width: 100px
      margin: 0 20px 5px 0
      text-align: right
      text-transform: lowercase
    dd
      float: left
      margin: 0 0 5px 0
      overflow: hidden
      color: #82919e
      font-weight: normal
      > p
        float: left
      > span
        display: block
        position: relative
        float: left
        margin: 0 10px 0 0
        background: $light_blue
        border: 1px solid #c9cdd0
        width: 74px
        height: 10px
      > span span
        display: block
        position: absolute
        width: 76px
        height: 10px
        top: -1px
        left: -1px
        border: 1px solid #7e90a0
        background: #93a4b2
ul#permissions
  .can
    font-weight: bold
    a.grant
      display: none
    a.revoke
      padding-left: 1em
      display: inline
      font-weight: normal
  .cannot
    font-weight: normal
    a.grant
      padding-left: 1em
      display: inline
      font-weight: normal
    a.revoke
      display: none
.override_lowercase
  text-transform: none !important
#globalWrapper
  .references
    margin: 0 30px 15px !important
    padding: 0px !important
    border: none !important
#data_summary
  .data_div
    border: 1px solid $grayblue
    +gradient-bg($fieldset_light_blue, #fefeff)
    padding: 10px 5px 10px
  table
    margin: 0px
    tr
      border: 0px
      line-height: 100%
      font-size: 1.0em
      vertical-align: top
      th
        width: 40%
        text-align: right
        padding-bottom: 1.1em
      td
        padding: 0 0 1.1em 1em
      &:last-child
        th
          padding-bottom: .2em
        td
          padding: 0 0 0.2em 1em
      .stat
        color: #93a4b0
        &:before
          content: '('
        &:after
          content: ')'
  div.see_more
    colspan: 2
    text-align: center
#search_results
  .taxon_summary
    width: 55%
    float: left
    a.icon
      color: #cad3db
  .data_summary
    float: right
    padding-top: 15px
    text-align: right
    width: 300px
    .attribute
      text-transform: uppercase
      color: $darker_blue
      font-weight: normal
    .value
      font-weight: 500
      font-size: 1.3em
      color: $nearly_black
div.definition, .search_summary
  padding: 15px
  margin: 10px 0px
  border: 1px solid $grayblue
  background: $fieldset_light_blue
  li
    margin: 0px
#curation_legend.help_text
  display: inline-block
