@media (min-width: 621px)
{

  /* -------- Taxon page: -------- */

  .taxon_BreadcrumbWrap {
    display: block;
    margin: 12px;
  }

  .taxon_Breadcrumb {
    float: left;
    text-align: left;
    font: 14pt Century Gothic,Arial,sans;
  }

  .taxon_Contributors {
    margin: 6px 0px 0px 36px;
    float: right;
    text-align: right;
    font: 10pt Century Gothic,Arial,sans;
  }
  
  .taxon_Editbuttons {
    float: right;
    margin-top: 6px;
  }

  .taxon_HeaderBox {
    position: relative;
    display: block;
    width: 100%;
    border-top: 1px solid #666666;
    border-bottom: 1px solid #666666;
    overflow: hidden;
  }

  .taxon_HeaderTitle {
    margin: 4px 41px 0px 12px;
    font: 18pt Century Gothic,Arial,sans;
  }

  .taxon_HeaderSubtitle {
    display: block;
    margin: 0px 41px 8px 12px;
    font: 14pt Century Gothic,Arial,sans;
    color: #333333;
  }

  .taxon_Subheaderbox {
    clear: both;
    width: 100%;
    padding: 6px 0px 6px 0px;
    background-color: #EEEEEE;
    border-top: 1px solid #668066;
    border-bottom: 1px solid #668066;
    overflow: hidden;
  }

  .taxon_SubheaderTitle {
    margin: 0px 0px 0px 12px;
    font: 14pt Century Gothic,Arial,sans;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  
  .taxon_SelectedPhotos {
    float: right;
    width: 50%;
    margin: 24px 0px 0px 0px;
  }

  .taxon_PhotoWrapFirst {
    position: relative;
    display: block;
    margin: 0px 24px 24px 12px;
    border: 1px solid #666666;
    background-color: #F6F6F6;
  }

  .taxon_PhotoWrap {
    display: block;
    margin: 0px 24px 24px 12px;
    border: 1px solid #666666;
    background-color: #F6F6F6;
  }

  .taxon_PhotoImage {
    display: block;
    width: 100%;
    border-bottom: 1px solid #666666;
  }

  .taxon_PhotoCaption {
    padding: 0px 4px 0px 4px;
    font: 10pt Verdana,Arial,sans;
  }

  .taxon_PhotoCredit {
    padding: 4px 4px 4px 4px;
    font: 10pt Verdana,Arial,sans;
  }

  .taxon_NoImage {
    display: block;
    width: 100%;
    height: 400px;
    text-align: center;
  }

  .taxon_MapBlock {
    width: 50%;
    margin: 24px 0px 24px 0px;
  }

  .taxon_MapBlockInner {
    display: block;
    margin: 0px 12px 0px 24px;
    border-top: 1px solid #666666;
    border-left: 1px solid #666666;
    border-right: 1px solid #666666;
    background-color: #333333;
  }

  .taxon_MapImage {
    display: inline;
    width: 100%;
    padding: 0px;
  }
  
  .taxon_MapLegend {
    display: block;
    min-height: 24px;
    margin: 0px 12px 0px 24px;
    padding-left: 6px;
    border-left: 1px solid #666666;
    border-right: 1px solid #666666;
    background-color: #333333;
  }

  .taxon_MapLegendMarker {
    float: left;
    width: 12px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: 0px 6px;
    background-size: 12px 12px;
  }
  .taxon_MapLegendLabel {
    float: left;
    padding: 4px 16px 2px 6px;
    color: #EEEEEE;
    font-size: 10pt;
    line-height: 16px;
  }
  
  .taxon_MapLocalityMessage {
    display: block;
    margin: 0px 12px 0px 24px;
    padding: 2px 24px 6px 8px;
    border-left: 1px solid #666666;
    border-right: 1px solid #666666;
    background-color: #333333;
    color: #999999;
    font-size: 10pt;
    line-height: 16px;
  }
  
  .taxon_ContentBlock {
    width: 50%;
    margin: 24px 0px 0px 0px;
  }

  .taxon_ContentBlockFullWidth {
    clear: both;
    display: block;
    margin: 24px 12px 0px 0px;
  }

  .taxon_ContentText {
    margin-right: 12px;
    margin-bottom: 24px;
    margin-left: 24px;
    padding: 6px;
    border-width: 1px;
    border-style: solid;
    background-color: #F6F6F6;
    font: 10pt Verdana,Arial,sans;
  }

  .taxon_ContentTopBorder {
    padding-top: 24px;
    border-top-width: 3px;
    border-top-style: dotted;
  }

  .taxon_ContentTextFullWidth {
    margin: 0px 24px 24px 24px;
    font: 10pt Verdana,Arial,sans;
  }

  .taxon_ContentHeader {
    margin: 0px 0px 12px 0px;
    font: 14pt Century Gothic,Arial,sans;
    font-weight: bold;
  }

  .taxon_ContentSubheader {
    font: 11pt Century Gothic,Arial,sans;
    font-weight: bold;
  }

  .taxon_ContentText p {
    margin: 6px 0px 6px 0px;
  }

  .taxon_InfraspeciesBlock {
    clear: both;
    display: block;
    margin: 24px 24px 0px 24px;
    padding-left: 12px;
    padding-bottom: 12px;
    border-width: 1px;
    border-style: solid;
  }

  .taxon_InfraspeciesHeader {
    width: 100%;
    padding: 12px 0px 0px 0px;
  }

  .taxon_InfraspeciesCaption {
    margin: 4px 4px 0px 4px;
    font-size: 12pt;
    text-align: center;
  }

  .taxon_EditBar {
    clear: both;
    display: block;
    margin: 0px 0px 0px 0px;
    padding: 6px 0px 6px 12px;
    background-color: #EEEEEE;
    border-top: 1px solid #666666;
    border-bottom: 1px solid #666666;
    overflow: hidden;
  }

  /* -------- Taxon map page: -------- */

  .taxon_MapFullWrap {
    background-color: #333333;
  }

  .taxon_MapFull {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
  }

  .taxon_MapFullInner {
    position: relative;
    background-color: #333333;
  }

  .taxon_MapFullImage {
    display: inline;
    width: 100%;
    padding: 0px;
    cursor: pointer;
  }
  
  .taxon_MapHighlightMarker {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 16px;
    height: 16px;
  }

  .taxon_MapHeader {
    display: block;
    padding: 6px;
    background-color: #777777;
    color: #DDDDDD;
  }

  .taxon_MapFullLegend {
    display: block;
    padding: 3px 6px 3px 6px;
    background-color: #777777;
  }

  .taxon_MapFullLegendMarker {
    float: left;
    width: 16px;
    height: 24px;
    margin-left: 2px;
    background-repeat: no-repeat;
    background-position: 0px 4px;
    background-size: 16px 16px;
  }
  .taxon_MapFullLegendLabel {
    float: left;
    height: 24px;
    line-height: 24px;
    margin: 0px 24px 0px 6px;
    font-size: 12pt;
    color: #DDDDDD;
    white-space: nowrap;
    overflow: hidden;
  }
  
  .taxon_MapExcludedToggle {
    float: left;
    width: 16px;
    height: 16px;
    margin: 3px 0px 3px 0px;
    border: 1px solid #AAAAAA;
    background-color: #999999;
    background-repeat: no-repeat;
    background-position: 2px 2px;
    background-size: 12px 12px;
    background-image: url('../graphics/blank.png');
    cursor: pointer;
  }
  .taxon_MapExcludedToggle:hover {
    background-color: #EEEEEE;
    background-image: url('../graphics/tick.png');
  }
  .taxon_ShowExcludedLoader {
    position: absolute;
    top: 47%;
    left: 47%;
    width: 31px;
    height: 31px;
  }
  
  .specimenList {
    margin-bottom: 48px;
    padding: 0px 0px 24px 0px;
    font: 10pt Verdana,Arial,sans;
  }

}

@media (max-width: 620px)
{

  /* -------- Taxon page: -------- */

  .taxon_BreadcrumbWrap {
    display: block;
    margin: 12px;
  }

  .taxon_Breadcrumb {
    display: block;
    font: 14pt Century Gothic,Arial,sans;
  }

  .taxon_Contributors {
    display: block;
    margin: 6px 0px 0px 0px;
    font: 10pt Century Gothic,Arial,sans;
  }
  
  .taxon_Editbuttons {
    float: right;
    margin-top: 6px;
  }
  
  .taxon_HeaderBox {
    position: relative;
    display: block;
    width: 100%;
    border-top: 1px solid #666666;
    border-bottom: 1px solid #666666;
    overflow: hidden;
  }

  .taxon_HeaderTitle {
    margin: 4px 41px 0px 12px;
    font: 18pt Century Gothic,Arial,sans;
  }

  .taxon_HeaderSubtitle {
    display: block;
    margin: 0px 41px 8px 12px;
    font: 14pt Century Gothic,Arial,sans;
    color: #333333;
  }

  .taxon_SubheaderBox {
    clear: both;
    width: 100%;
    padding: 6px 0px 6px 0px;
    background-color: #98b398;
    border-top: 1px solid #668066;
    border-bottom: 1px solid #668066;
    overflow: hidden;
  }

  .taxon_SubheaderTitle {
    margin: 0px 0px 0px 0px;
    font: 14pt Century Gothic,Arial,sans;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .taxon_SelectedPhotos {
    display: block;
    width: 100%;
    margin: 24px 0px 0px 0px;
  }

  .taxon_PhotoWrapFirst {
    position: relative;
    display: block;
    margin: 0px 6px 24px 6px;
    border: 1px solid #666666;
    background-color: #F6F6F6;
  }

  .taxon_PhotoWrap {
    display: none;
  }

  .taxon_PhotoImage {
    display: block;
    width: 100%;
    border-bottom: 1px solid #666666;
    margin-bottom: 4px;
  }

  .taxon_PhotoCaption {
    padding: 0px 4px 0px 4px;
    font: 10pt Verdana,Arial,sans;
  }

  .taxon_PhotoCredit {
    padding: 2px 4px 4px 4px;
    font: 10pt Verdana,Arial,sans;
  }

  .taxon_NoImage {
    display: block;
    width: 100%;
    height: 400px;
    text-align: center;
  }

  .taxon_MapBlock {
    display: block;
    width: 100%;
    margin: 24px 0px 36px 0px;
  }

  .taxon_MapBlockInner {
    margin: 0px 6px 0px 6px;
    border-top: 1px solid #666666;
    border-left: 1px solid #666666;
    border-right: 1px solid #666666;
    background-color: #333333;
  }

  .taxon_MapImage {
    display: inline;
    width: 100%;
    padding: 0px;
  }

  .taxon_MapLegend {
    display: block;
    min-height: 24px;
    margin: 0px 6px 0px 6px;
    padding-left: 6px;
    border-left: 1px solid #666666;
    border-right: 1px solid #666666;
    background-color: #333333;
  }
  
  .taxon_MapLegendMarker {
    float: left;
    width: 16px;
    height: 24px;
    background-repeat: no-repeat;
    background-position: 0px 4px;
    background-size: 16px 16px;
  }
  .taxon_MapLegendLabel {
    float: left;
    padding: 4px 24px 4px 6px;
    color: #EEEEEE;
    font-size: 10pt;
    line-height: 16px;
  }
  
  .taxon_MapLocalityMessage {
    display: block;
    margin: 0px 6px 0px 6px;
    padding: 2px 24px 6px 8px;
    border-left: 1px solid #666666;
    border-right: 1px solid #666666;
    background-color: #333333;
    color: #999999;
    font-size: 10pt;
    line-height: 16px;
  }

  .taxon_ContentBlock {
    display: block;
    margin: 24px 6px 0px 6px;
  }

  .taxon_ContentBlockFullWidth {
    display: block;
    margin: 24px 6px 0px 6px;
  }

  .taxon_ContentText {
    margin: 0px 0px 24px 0px;
    padding: 6px;
    border-width: 1px;
    border-style: solid;
    background-color: #F6F6F6;
    font: 11pt Verdana,Arial,sans;
  }

  .taxon_ContentTopBorder {
    padding-top: 24px;
    border-top: 3px dotted #00592A;
  }

  .taxon_ContentTextFullWidth {
    margin: 0px 0px 24px 0px;
    font: 11pt Verdana,Arial,sans;
  }

  .taxon_ContentHeader {
    margin: 0px 0px 12px 0px;
    font: 14pt Century Gothic,Arial,sans;
    font-weight: bold;
  }

  .taxon_ContentSubheader {
    font: 11pt Century Gothic,Arial,sans;
    font-weight: bold;
  }

  .taxon_ContentText p {
    margin: 6px 0px 6px 0px;
  }

  .taxon_InfraspeciesBlock {
    clear: both;
    display: block;
    padding-left: 12px;
    margin-top: 24px;
    padding-bottom: 12px;
    border-top-width: 1px;
    border-top-style: solid;
    border-bottom-width: 1px;
    border-bottom-style: solid;
  }

  .taxon_InfraspeciesHeader {
    width: 100%;
    padding: 12px 0px 0px 0px;
  }

  .taxon_InfraspeciesCaption {
    margin: 4px 4px 0px 4px;
    font-size: 12pt;
    text-align: center;
  }

  .taxon_EditBar {
    clear: both;
    display: block;
    margin: 24px 0px 0px 0px;
    padding: 6px 0px 6px 12px;
    background-color: #EEEEEE;
    border-top: 1px solid #666666;
    border-bottom: 1px solid #666666;
    overflow: hidden;
  }
  
  /* -------- Taxon map page: -------- */

  .taxon_MapFullWrap {
    background-color: #333333;
  }

  .taxon_MapFull {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
  }

  .taxon_MapFullInner {
    position: relative;
    background-color: #333333;
  }

  .taxon_MapFullImage {
    display: inline;
    width: 100%;
    padding: 0px;
    cursor: pointer;
  }
  
  .taxon_MapHighlightMarker {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 16px;
    height: 16px;
  }

  .taxon_MapHeader {
    display: block;
    padding: 6px;
    background-color: #777777;
    color: #DDDDDD;
  }

  .taxon_MapFullLegend {
    display: block;
    padding: 3px 6px 3px 6px;
    background-color: #777777;
  }
  
  .taxon_MapFullLegendMarker {
    float: left;
    width: 16px;
    height: 24px;
    margin-left: 2px;
    background-repeat: no-repeat;
    background-position: 0px 4px;
    background-size: 16px 16px;
  }
  .taxon_MapFullLegendLabel {
    float: left;
    height: 24px;
    line-height: 24px;
    margin: 0px 24px 0px 6px;
    font-size: 12pt;
    color: #DDDDDD;
    white-space: nowrap;
  }
  
  .taxon_MapExcludedToggle {
    float: left;
    width: 16px;
    height: 16px;
    margin: 3px 0px 3px 0px;
    border: 1px solid #AAAAAA;
    background-color: #999999;
    background-repeat: no-repeat;
    background-position: 2px 2px;
    background-size: 12px 12px;
    background-image: url('../graphics/tickgray.png');
    cursor: pointer;
  }
  .taxon_MapExcludedToggle:hover {
    background-color: #EEEEEE;
    background-image: url('../graphics/tick.png');
  }
  .taxon_ShowExcludedLoader {
    position: absolute;
    top: 47%;
    left: 47%;
    width: 31px;
    height: 31px;
  }

  .specimenList {
    margin-bottom: 48px;
    padding: 0px 0px 24px 0px;
    font: 10pt Verdana,Arial,sans;
  }

}

@media (min-width: 461px)
{
  /* -------- Thumbnail images: -------- */
  
  .taxon_ThumbnailHeader {
    clear: both;
    display: table;
    width: 100%;
    padding: 12px 0px 10px 0px;
    background-color: #222222;
    border-bottom: 1px solid #333333;
    overflow: hidden;
  }

  .taxon_ThumbnailTitle {
    display: table-cell;
    width: 100%;
    vertical-align: top;
    color: #EEEEEE;
  }

  .taxon_ThumbnailControls {
    display: table-cell;
    vertical-align: top;
    text-align: right;
    color: #EEEEEE;
  }

  .taxon_ThumbnailControlsWrap {
    display: table;
    margin-right: 12px;
  }

  .taxon_ThumbnailGroupByLabel {
    display: table-cell;
    vertical-align: top;
    height: 26px;
    padding: 0px 6px 0px 0px;
    text-align: right;
    line-height: 26px;
    white-space: nowrap;
  }

  .taxon_ThumbnailGroupByWrap {
    display: table-cell;
    vertical-align: top;
    height: 26px;
  }

  .taxon_Thumbnails {
    clear: both;
    display: block;
    padding: 12px 0px 24px 0px;
    background-color: #000000;
  }

  .taxon_ThumbnailGroupHeader {
    clear: both;
    display: block;
  }

  .taxon_ThumbnailBlock {
    display: block;
  }
  
  .taxon_ThumbnailBox {
    display: block;
    margin: 0px 0px 0px 0px;
    overflow: hidden;
  }
  
  .taxon_ThumbnailBoxOdd {
    float: left;
    width: 208px;
    height: 256px;
  }
  
  .taxon_ThumbnailBoxEven {
    float: left;
    width: 208px;
    height: 256px;
  }

  .taxon_ThumbnailBoxDark {}

  .taxon_ThumbnailBoxDark:hover {
    background-color: #333333;
  }

  .taxon_ThumbnailBoxLight {}

  .taxon_ThumbnailBoxLight:hover {
    background-color: #EEEEEE;
  }

  .taxon_ThumbnailOuter {
    display: table;
    width: 202px;
    height: 206px;
    margin: 12px auto 0px auto;
  }

  .taxon_ThumbnailInner {
    display: table-cell;
    text-align: center;
    vertical-align: bottom;
  }

  .taxon_ThumbnailImage {
    max-width: 200px;
    max-height: 200px;
    border: 1px solid #555555;
  }

  .taxon_ThumbnailImageLight {
    border: 1px solid #CCCCCC;
  }

  .taxon_ThumbnailCaption {
    margin: 0px 4px 0px 4px;
    font-size: 10pt;
    text-align: center;
  }
}

/* -------- Specimen records: -------- */

.specimen_Block { border-bottom: 1px solid #666666; }
.specimen_Background1 { background-color: #F6F6F6; }
.specimen_Background2 { background-color: #E6E6E6; }

.specimen_Label { display: block; }
.specimen_LabelToggle { cursor: pointer; }
.specimen_Content { padding: 6px 6px 12px 6px; }
.specimen_ContentImaged { padding: 6px 172px 0px 12px; }

.specimen_Details { display: none; }
.specimen_DetailsToggle { cursor: pointer; }
.specimen_DetailHeader { display: block; padding: 24px; border-bottom: 1px solid #CCCCCC; }
.specimen_DetailTable { display: table; }
.specimen_DetailTableImaged { display: table; border-right: 1px solid #CCCCCC; }
.specimen_DetailRow { display: table-row; }
.specimen_DetailField { display: table-cell; width: 150px; padding-right: 5px; text-align: right; font-weight: bold; border-bottom: 1px solid #CCCCCC; }
.specimen_DetailValue { display: table-cell; padding-left: 5px; text-align: left; border-left: 1px solid #CCCCCC; border-bottom: 1px solid #CCCCCC; }

.specimen_Thumbnail { float: right; width: 150px; padding: 12px 12px 0px 0px; font-size: 12px; }
.specimen_ThumbnailImaged { float: right; width: 150px; padding: 12px; font-size: 12px; }