﻿/*
Collection of elements constructed from core classes

Index:
*Feature/Article
*Slides
*Newsticker
*Initiatives
*Tabs
*Boxes
*Links
*Icons
*Rollovers
*Photo Rows
*Image+Content
*Headings
*Lists
*Tables
*SideBar
*Contact
*Sections
*/


/*Feature**********/
.feature ul, .feature li {
    /*^internal reset   padding: 0;   margin: 0;*/
}

.feature {
    background-color: #FFF;
    width: 680px;
    margin: 20px auto 0;
    padding: 10px;
    display: table;
}

    .feature.quadrant {
        background-color: transparent;
        display: table;
        margin: 20px auto 0;
        padding: 0;
        width: 700px;
    }

    .feature.full {
        width: 920px;
    }

.article .feature {
    margin: 0px auto 0;
    padding: 0px;
}

.feature.quadrant .top-story-list {
    padding: 0;
    margin: 0;
}

    .feature.quadrant .top-story-list .top-story-item {
        background-color: #fff;
        height: 180px;
        margin-bottom: 20px;
        margin-right: 24px;
        vertical-align: top;
        width: 338px;
        overflow: hidden;
    }

        .feature.quadrant .top-story-list .top-story-item:last-child {
            margin-right: 0px;
        }

        .feature.quadrant .top-story-list .top-story-item:first-child {
            vertical-align: top;
            width: 338px;
        }

        .feature.quadrant .top-story-list .top-story-item .top-story-link {
            padding: 0px;
        }

        .feature.quadrant .top-story-list .top-story-item .top-story-img {
            width: 338px;
            height: 94px;
            margin-bottom: 5px;
        }

        .feature.quadrant .top-story-list .top-story-item .top-story-text {
            margin-left: 15px;
            margin-right: 10px;
            padding-left: 10px;
            font-weight: normal;
            /*height: 75px;*/
        }

.feature.quadrant h2.top-story-header {
    font-size: 14px;
    margin-top: 0;
    margin-left: 10px;
    padding: 0 0 5px;
}

.feature.quadrant .blue h2.top-story-header {
    color: #0093d1;
}

.feature.quadrant .top-story-list .top-story-item.blue {
    border-top: solid 4px #0093d1;
}

.feature.quadrant .green h2.top-story-header {
    color: #336633;
}

.feature.quadrant .top-story-list .top-story-item.green {
    border-top: solid 4px #336633;
}

.feature.quadrant .orange h2.top-story-header {
    color: #C24A00;
}

.feature.quadrant .top-story-list .top-story-item.orange {
    border-top: solid 4px #C24A00;
}

.feature.quadrant .red h2.top-story-header {
    color: #CC0099;
}

.feature.quadrant .top-story-list .top-story-item.red {
    border-top: solid 4px #CC0099;
}

.feature .top-story-list {
    padding: 0;
    margin: 0;
    /*height: 85px;*/
}

    .feature .top-story-list .top-story-item {
        float: left;
        list-style: none;
        padding: 0;
        margin: 0;
        position: relative;
        /*height: 85px;*/
        width: 225px;
        vertical-align: top;
    }

        .feature .top-story-list .top-story-item .top-story-link {
            display: block;
            padding: 5px;
            /*height: 75px;*/
            vertical-align: top;
            cursor: pointer;
        }

        .feature .top-story-list .top-story-item .top-story-img {
            width: 75px;
            height: 75px;
            float: left;
        }

        .feature .top-story-list .top-story-item .top-story-text {
            font-weight: bold;
            font-size: 12px;
            display: block;
            margin: 0 0 0 85px;
            padding: 0;
            height: 75px;
        }

.feature.block ul, .feature.block ol {
    margin-left: 15px;
    padding-left: 15px;
}

#content .feature.block ul {
    padding: 0 10px 12px 25px;
}

.feature.block li {
    vertical-align: middle;
}

/** photo list featurette: as above, but with small thumbnails */

.feature .photos h3, .feature .photos p {
    margin-left: 95px;
}

.feature .photos li img {
    width: 75px;
    height: 75px;
    float: left;
}

/*Landing Page*/
/*^.directory-section*/
.article .col {
    float: left;
}
    /*^.directory-section .col*/
    .article .col.narrow {
        float: left;
        width: 220px;
        padding: 0;
        margin-top: 10px;
    }

/*^h3.directory*/
#content .article .col h3 {
    font-size: 14px;
    font-weight: bold;
}

/*Banner***********/
.banner {
    height: 178px;
    width: 700px;
    margin: 0;
    padding: 0;
}

/*Slides**********/

#slider {
    /*border: 10px solid #FFFFFF;*/
    clear: both;
    height: 245px;
    margin: 10px auto 20px;
    position: relative;
    width: 940px;
}

    #slider ul li {
        display: inline-block;
        list-style: none outside none;
    }

    #slider .arrows {
        display: inline;
    }

        #slider .arrows li {
            height: 265px;
            position: absolute;
            top: 0;
            width: 40px;
            z-index: 2;
        }

    #slider .nav li {
        margin-top: 0px;
    }

    #slider .arrows a {
        display: none /*block*/;
        height: 265px;
        text-indent: -9999em;
        width: 40px;
    }

        #slider .arrows a span {
            background: url("../images/slide-arrows.png") no-repeat scroll 0 0 transparent;
            cursor: pointer;
            display: block;
            height: 40px;
            left: 0;
            position: absolute;
            top: 38%;
            width: 40px;
            z-index: 3;
        }

    #slider .arrows .prev {
        margin-right: 445px;
        right: 50%;
    }

    #slider .arrows .next {
        left: 50%;
        margin-left: 445px;
    }

        #slider .arrows .next a span {
            background-position: -40px 0;
        }

    #slider .arrows a:link span, #slider .arrows a:visited span {
        visibility: visible;
    }

    #slider .arrows a:hover span, #slider .arrows a:active span {
        visibility: visible;
    }

    #slider .nav {
        bottom: 10px;
        height: 10px;
        left: 50%;
        margin-left: -69px;
        position: absolute; /*width: 100px;*/
        z-index: 3;
    }

        #slider .nav li {
            float: left;
            height: 8px;
            margin-right: 10px;
            width: 8px;
        }

            #slider .nav li a {
                background: none repeat scroll 0 0 #FFFFFF;
                border: 2px solid #FFFFFF;
                display: block;
                height: 8px;
                line-height: 8px;
                text-indent: -9999em;
                width: 8px;
            }

        #slider .nav a.current {
            background: none repeat scroll 0 0 #05A9D3;
            border: 2px solid #FFFFFF;
        }

    #slider .slider-background {
        height: 277px;
        margin: 0 auto;
        width: 962px;
    }

#slides {
    height: 245px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 940px;
    z-index: 1;
}

    #slides ul {
        height: 245px;
        width: 940px;
    }

    #slides li {
        float: left;
        height: 245px;
        position: relative;
        width: 940px;
        z-index: 2;
    }

    #slides p {
        position: absolute;
    }

        #slides p span {
            display: block;
            font-size: 24px;
            font-weight: bold;
        }

        #slides p sup {
            font-size: 36px;
            left: -10px;
            position: absolute;
            top: -10px;
        }

        #slides p a {
            font-weight: bold;
        }

    #slides a {
        position: absolute;
        z-index: 50;
    }

        #slides a:hover {
            cursor: pointer;
        }

/* slider narrow */
#slider.slider-narrow {
    margin-top: 0;
}

    #slider.slider-narrow #slides {
        width: 711px;
    }

    #slider.slider-narrow .arrows li {
        height: 178px;
    }

    #slider.slider-narrow .arrows .prev {
        margin-right: 0px;
        left: -16px;
    }

    #slider.slider-narrow .arrows .next {
        margin-left: 0px;
        left: 656px;
    }

    #slider.slider-narrow, #slider.slider-narrow #slides, #slider.slider-narrow #slides ul, #slider.slider-narrow #slides li {
        height: 178px;
        width: 711px;
        margin: 0;
        padding: 0;
    }

#slider.slider-narrow {
    overflow: hidden;
    width: 700px;
}

    #slider.slider-narrow .arrows a {
        height: 178px;
    }
/*^ temp adjust from new template to old 
#slider.slider-narrow #slides li{
  width: 700px;
  margin-left:-20px;
}
*/
/*^revised
#slider {
  height: 200px;
  position: relative;
  margin: 0 auto 20px;
  overflow: hidden;
  z-index: 0;
  width: 940px;
}
#slider ul li {
  display: inline-block;
  list-style: none;
}
#slider .nav {
  width: 60px;
  height: 10px;
  position: absolute;
  bottom: 13px;
  left: 50%;
  margin-left: -28px;
  z-index: 333;
}
#slider .nav li {
  width: 10px;
  height: 10px;
  float: left;
  margin-right: 5px;
}
#slider .nav li a {
  background: #fff;
  width: 10px;
  height: 10px;
  display: block;
  line-height: 10px;
  text-indent: -9999em;
}
#slider .nav a.current {
  background: #05a9d3;
}
#slides {
  width: 940px;
  height: 200px;
  position: absolute;
  top: 0;
  left: 0;
  margin: 0 auto;
  overflow: hidden;
}
#slides ul {
  width: 2820px;
  height: 200px;
}
#slides li {
  width: 940px;
  height: 200px;
  position: relative;
  float: left;
}
#slides p {
  position: absolute;
}
#slides p span {
  display: block;
  font-size: 24px;
  font-weight: bold;
}
#slides p sup {
  position: absolute;
  left: -10px;
  font-size: 24px;
}
#slides p a {
  font-weight: bold;
}
#slides .arrows {
  display: inline;
}
#slides .arrows li {
  width: 40px;
  height: 200px;
  position: absolute;
  top: 0;
  z-index: 333;
}
#slides .arrows a {
  width: 330px;
  height: 200px;
  display: block;
  text-indent: -9999em;
}
#slides .arrows a span {
  background: url(../images/UI/slide-arrows.png) 0 0 no-repeat;
  width: 14px;
  height: 26px;
  display: block;
  position: absolute;
  top: 50%;
  margin-top: -13px;
  cursor: pointer;
  z-index: 333;
}
#slides .arrows .l {
  left: 0;
}
#slides .arrows .l a span {
  background-position: -14px 0;
  right: 10px;
}
#slides .arrows .r {
  right: 0;
}
#slides .arrows .r a span {
  left: 10px;
}
#slides .arrows a:link span, #slides .arrows a:visited span {
  visibility: hidden;
}
#slides .arrows a:hover span, #slides .arrows a:active span {
  visibility: visible;
}*/

/*Newsticker*******/
#headlines {
    /*.feature*/
}

.news-header {
    font-size: 14px;
    display: inline;
    margin: 0;
    padding: 0 10px 0 0;
}

    .news-header .icon.rss {
        background: url(../images/UI/sprite.png) -24px -3px no-repeat;
        float: left;
        height: 17px;
        margin-right: 5px;
        width: 17px;
    }

#rss-feed {
    display: inline;
    width: 600px;
    overflow: hidden;
}

.ticker, .ticker ul, .ticker ul li {
    width: 560px;
}

.ticker {
    padding-top: 0px;
    display: inline-block;
}

/* ACN GOA RSS */
#goa_rss_acn ul {
    margin: 0;
    padding: 0;
}

#goa_rss_acn li {
    list-style: none;
    margin: 0;
    padding: 0;
}

    #goa_rss_acn li a {
        line-height: 1.2em;
    }

        #goa_rss_acn li a + span {
            margin-left: 5px;
            position: relative;
            top: auto;
            left: auto;
        }

/*Initiatives: three white horizontal blocks with red, orange and green colouring*/

/*^revise name - only used on home page in .initiatives*/
.initiatives {
    margin-top: 20px;
}

    .initiatives.first-line {
        margin-top: 0px;
    }

    .initiatives h2 {
        padding: 0 0 5px;
        font-size: 14px;
        margin-top: 0;
    }

    .initiatives .block {
        width: 200px;
        float: left;
        margin: 0 0 0 20px;
        border-top-style: solid;
        border-top-width: 4px;
    }

        .initiatives .block:first-child {
            margin: 0;
        }

    /*.initiatives .initiative-links {
        padding-top: 18px;
        margin-top: 20px;
        font-weight: bold;
        text-align: right;
    }*/

    .initiatives .red h2 {
        color: #CC0099;
    }

    .initiatives .red .initiative-link:hover {
        /*background: url(../images/UI/home-initiatives-hr-red.png) 0 0 no-repeat;*/
        color: #CC0099;
    }

    .initiatives .block.red {
        border-top-color: #CC0099;
    }

    .initiatives .orange h2 {
        color: #C24A00;
    }

    .initiatives .orange .initiative-link:hover {
        /*background: url(../images/UI/home-initiatives-hr-orange.png) 0 0 no-repeat;*/
        color: #C24A00;
    }

    .initiatives .block.orange {
        border-top-color: #C24A00;
    }

    .initiatives .green h2 {
        color: #336633;
    }

    .initiatives .block.green {
        border-top-color: #336633;
    }

    .initiatives .green .initiative-link:hover {
        /*background: url(../images/UI/home-initiatives-hr-green.png) 0 0 no-repeat;*/
        color: #336633;
    }
/*---*/


/*Tabs - jQueryUI */
/*^revise - will not be in ESRD site*/
#contact {
    margin-top: 20px;
}

    #contact li {
        width: 190px;
        float: left;
        padding: 10px;
        line-height: 1.2;
        list-style: none;
    }

    #contact p {
        padding: 12px 0;
    }

    #contact .tabs ul.ui-tabs-nav {
        padding: 0px;
        margin: 0px;
    }

    #contact .tabs .left {
        /*width: 450px;*/
        width: 50%;
        float: left;
        margin: 0 20px 0 0;
    }

    #contact .tabs .right {
        /*width: 210px;*/
        float: left;
    }

    #contact .tabs .content li {
        width: auto;
        float: none;
        padding: 0; /*list-style: square;*/
        line-height: 1.4;
    }

    #contact .tabs ul {
        background: none;
    }

    #contact .tabs p + ul {
        margin-top: -12px;
    }

    #contact p + p {
        /*margin-top: -6px;*/
    }

/*collapsible content*/

.article .FAQQuestion h4, .article .FAQQuestion h3, .article .FAQQuestion h2 {
    font-size: 1.2em;
    font-weight: bold;
    margin: 0;
}

.article .FAQItem {
    margin-top: 10px;
}

#content .article .FAQItem .boxNote, .FAQItem .box.note {
    width: 620px;
}

    #content .article .FAQItem .boxNote h4, #content .article .FAQItem .boxNote h3 {
        padding: 0;
        margin: 0;
    }
/*#content .article .FAQItem + .FAQItem .open h4 {
  padding: 0;
  margin: 20px 0 0;
}*/
#content .article .FAQItem .FAQAnswer {
    margin-left: 15px;
    margin-top: 10px;
}

#content .article .FAQItem .FAQHidden {
    display: none;
    visibility: hidden;
}

#content .article .FAQItem .FAQShown {
    position: inherit;
    left: auto;
    top: auto;
    height: auto;
    width: auto;
}

#content .article .FAQItem .FAQQuestion > a {
    display: block;
    padding-left: 15px;
    margin-left: 0px;
    background: url('../images/UI/bgMenuParentClosed.gif') no-repeat left center;
}

#content .article .FAQItem .open > a {
    background: url('../images/UI/bgMenuParentOpen.gif') no-repeat left center;
}

#content .article .FAQSection {
    position: relative;
    margin-top: 20px;
}

    #content .article .FAQSection:first-child {
        margin-top: 0;
        padding-top: 10px;
    }

#content .article a.FAQControl {
    font-size: 8pt;
    text-decoration: none;
}

#content .article .FAQSection a.FAQControl {
    position: absolute;
    right: 0;
    top: 0;
}

#content .article .FAQSection .boxNote + a.FAQControl {
    position: absolute;
    right: 5px;
    top: 10px;
}

#content .article .FAQItem .FAQQuestion a {
    display: table;
}

.article .FAQItem .FAQQuestion:first-child {
    padding-top: 10px;
}
/*Boxes in current use*/
/**Landing Pages*/
.directory {
    /*box*/
    width: 100%;
    margin-bottom: 10px;
    margin-top: 20px;
    position: relative; /*CSS3*/
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    .directory h2 {
        margin-top: 0;
        padding-top: 10px;
    }

.box.newsroom {
    width: 300px;
    overflow: hidden;
}

    .box.newsroom img {
        max-width: 1000px;
    }

.newsroom .social-heading-img {
    display: block;
    margin: 0;
    padding: 0;
}

.newsroom .social-link {
    font-weight: bold;
    display: block;
    padding: 0 0 10px 50px;
}
/*---*/
.boxNote, .box.note, .box.quote {
    /*box border bkgnd border-grey bkgnd-primary-light*/ /*^TEMP - change to box.note*/
    width: 640px;
    /*position: relative;*/ /*CSS3   -moz-box-sizing: border-box;   -webkit-box-sizing: border-box;   box-sizing: border-box;*/
    margin: 10px 0;
    padding: 10px;
    border: 1px solid #C0C0C0 /*grey*/;
}

    .box.note.bkgnd, .box.aside.bkgnd {
        /*box note bgknd charcoal*/
        background-color: #FFF;
    }

.box.note {
    background-color: #EFF4F5 /*primary-light*/;
}

.box.aside {
    /*box + border bkgnd border-grey bkgnd-primary-light*/ /*^replaces boxRightHighlight etc*/
    position: relative; /*CSS3*/
    padding: 10px;
    border: 1px solid #C0C0C0 /*grey*/;
    background-color: #EFF4F5 /*primary-light*/;
}

.box.quote {

}

.aside .heading {
    font-size: 16px;
    margin-bottom: 8px;
    padding: 8px;
}

    .aside .heading:first-child {
        margin-top: 0px;
    }

.boxStory, .box.story {
    /*box border-secondary-dark bkgnd-secondary-light*/
    position: relative;
    margin: 10px 0;
    padding: 10px;
    border: 1px solid #678F00 /*secondary-dark*/;
    background-color: #DCE9CD /*secondary-light*/;
}

/*boxes with event listings: name, date, location, etc.*/
.box .event {
    display: table;
    margin-top: 5px;
}

.event > .item {
    margin-bottom: 5px;
}

.event .item > .label {
    font-weight: bold;
    display: table-cell;
    width: 5em;
}
.event .item > .full {
    font-weight: bold;
    display: table;
}

.event .item > .detail {
    display: table-cell;
}

/*Links************/
.article .linkMiniH2, .heading-link.mini {
    position: absolute;
    right: 0;
    top: 0px;
}

.article .linkMiniH2 {
    /*text-decoration: none;*/
}

    .article .linkMiniH2.dual {
        top: -5px;
    }

        .article .linkMiniH2.dual + .linkMiniH2.dual {
            top: 8px;
        }

#footer h2 + .heading-link.mini {
    margin-top: 3px;
}

/*Icons************/
.article .externalLink, .article a[href^="http"] {
    padding-right: 16px;
    margin-right: 0px;
    background: url(../images/UI/docIcons/SRDxLinkIcon-ExternalWebsite.png) no-repeat right center;
}

.article .pdf, .article a[href$="pdf"] {
    padding-right: 16px;
    margin-right: 0px;
    background: url(../images/UI/docIcons/SRDxLinkIcon-PDF.gif) no-repeat right center;
}

.article .msWord, .article a[href$="doc"], .article .msWord, .article a[href$="docx"] {
    padding-right: 16px;
    margin-right: 0px;
    background: url(../images/UI/docIcons/word.gif) no-repeat right center;
}

.article .msExcel, .article a[href$="xls"], .article .msExcel, .article a[href$="xlsx"] {
    padding-right: 16px;
    margin-right: 0px;
    background: url(../images/UI/docIcons/excel.gif) no-repeat right center;
}

.article .msPowerpoint {
    padding-right: 16px;
    margin-right: 0px;
    background: url(../images/UI/docIcons/powerpoint.gif) no-repeat right center;
}


.article .photo {
    padding-right: 25px;
    margin-right: 0px;
    background: url(../images/UI/docIcons/SRDxLinkIcon-Photos.jpg) no-repeat right center;
}

.article .zip {
    padding-right: 20px;
    margin-right: 0px;
    background: url(../images/UI/docIcons/SRDxLinkIcon-ZipFile.jpg) no-repeat right center;
}

.article .onlineService {
    padding-right: 15px;
    margin-right: 0px;
    background: url(../images/UI/docIcons/SRDxLinkIcon-OnlineService.jpg) no-repeat right center;
}

.article .slideShow {
    padding-right: 16px;
    margin-right: 0px;
    background: url(../images/UI/docIcons/SRDxLinkIcon-Slideshow.jpg) no-repeat right center;
}
/**Icon Exceptions*/
.article .top-story-link[href^="http"], .article .newsroom .social-link[href^="http"], .article .linkMiniH2[href^="http"], .article .img-link[href^="http"], #googleSearch a[href^="http"], .article .widget a[href^="http"], .article a[href*="/srd."], .article a[href*="/esrd."], .article a[href*="/environment."] {
    background: none;
    margin-right: inherit;
    padding-right: inherit;
}

.article .top-story-link[href$="pdf"], .article .newsroom .social-link[href$="pdf"], .article .img-link[href$="pdf"] {
    background: none;
    margin-right: inherit;
    padding-right: inherit;
}

#content [id$=layoutTable] a {
    background: none;
    margin-right: inherit;
    padding-right: inherit;
}
/*Rollovers*/

/*enlarge image icon*/
.magnifier {
    display: block;
    position: relative;
    border: none;
}

    .magnifier span {
        position: absolute;
        bottom: 7px;
        right: 6px;
        width: 29px;
        height: 22px;
        background: transparent url(../images/interface/GFX-EnlargePhoto-Icon.png) no-repeat top left;
    }

/*FAQ printer*/
.faqPrinter {
    float: right;
    position: relative;
}

    .faqPrinter > span {
        text-indent: -9000px;
        display: block;
        position: absolute;
        width: 200px;
        height: 96px;
        top: -10px;
        left: -200px;
        background: url(../images/BubbleEmpty.png) no-repeat -180px 0;
        z-index: 10;
    }

        .faqPrinter > span:hover {
            background-position: 5px 0px;
            text-indent: 0px;
            z-index: 10;
        }

        .faqPrinter > span > span + span {
            display: block;
            overflow: hidden;
            font-size: 10px;
            font-family: arial, helvetica, sans-serif;
            margin: 3px;
            position: absolute;
            width: 130px;
            height: 80px;
            top: 0px;
            left: 7px;
            background: none;
            z-index: 10;
        }

        .faqPrinter > span.faq {
            display: block;
            position: absolute;
            width: 200px;
            height: 96px;
            top: 0px;
            left: -200px;
            background: url(../images/BubbleFAQ.png) no-repeat -180px 0;
        }

        .faqPrinter > span:hover.faq {
            background-position: 5px 0px;
        }

        .faqPrinter > span.screen {
            display: block;
            position: absolute;
            width: 200px;
            height: 96px;
            top: -10px;
            left: -200px;
            background: url(../images/BubblePrintScreen.png) no-repeat -180px 0;
        }

        .faqPrinter > span:hover.screen {
            background-position: 30px 0px;
        }

    .faqPrinter span > span {
        display: block;
        position: absolute;
        top: 10px;
        left: 160px;
        width: 40px;
        height: 42px;
        background: url(../images/PrintThisPageIcon.png) no-repeat 0 0;
    }

    .faqPrinter + p {
        margin-right: 40px;
    }

span.icon {
    background: url("../images/UI/sprite.png") no-repeat scroll 0 0 transparent;
    display: block;
    overflow: hidden;
}

.box .social span.icon {
    float: left;
    height: 21px;
    line-height: 21px;
    margin: 0 10px 10px 0;
    width: 21px;
}

.blog span.icon {
    background-position: -32px -103px;
}

.visuallyhidden, span.icon span {
    border: 0 none;
    clip: rect(0px, 0px, 0px, 0px);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.box .social li {
    list-style: none;
}

/*Photo Rows - Used on BowHabitatStation: row of three images*/
#content .article .photo-row {
    margin: 0 0 7px 0;
    padding: 0;
}

.photo-row li {
    list-style: none outside none;
    margin: 0;
    padding: 0;
    display: inline;
}

    .photo-row li:first-child {
        list-style: none outside none;
        margin: 0;
        padding: 0;
        display: inline;
    }

.photo-row img {
    margin: 0;
    padding: 0;
    width: 215px;
}

.photo-row a span {
    border: 0 none;
    clip: rect(0pt, 0pt, 0pt, 0pt);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    position: absolute;
    width: 1px;
}

/*Image+Content
  <div class="box img-content">
    <div class="box img">
      <img src="images/" alt="" />
    </div>
    <div class="box content">
      <h3></h3>
      <p></p>
      <ul></ul>
    </div>
  </div>
*/
.img-content {
    display: table;
}

    .img-content .img {
        margin: 0;
        padding: 0;
        width: 30%;
    }

    .img-content .content {
        display: table;
        margin: 0;
        padding: 0;
        width: 65%;
    }

    .img-content.note .content {
        width: 420px;
    }
    /*image left; content right*/
    .img-content .img:first-child {
        /*box left img portrait*/
        float: left;
        margin-right: 10px;
        padding-right: 10px;
    }

    .img-content .img + .content {
    }
    /*content left; image right*/
    .img-content .content:first-child {
        float: left;
        margin-right: 10px;
        padding-right: 10px;
    }

    .img-content .content + .img {
        display: inline-block;
    }

    .img-content .content h3:first-child, .img-content .content h4:first-child {
        margin-top: 0;
    }

.heading.highlighted + .img-content .content {
    width: 65%;
}

/*Headings */
.heading.highlighted {
    /*box heading border-grey bkgnd-primary-light*/
    border: 1px solid #C0C0C0;
    margin-top: 10px;
    padding: 10px;
    width: 96.96969%;
    background-color: #EFF4F5;
}

    .heading.highlighted h2 {
        /*Reduced font size to accomodate reduced line-length*/
        font-size: 1.4em;
    }

    .heading.highlighted.withchild {
        margin-bottom: 0pt;
        border-bottom: none;
    }
/*.withchild aware modules*/
.withchild + .img-content, .withchild + .video-content {
    margin-top: 0;
    width: 96.9696%;
}

.withchild + .child-content {
    margin-top: 0;
    width: 96.9696%;
}
/*Lists*/

.box.list {
    display: table;
}

.list.pair {
}
/*.list ul {
  padding-left: 15px;
}*/
.list li {
}

.list.pair ul {
    float: left;
    width: 40%;
}

.list.pair li {
}

.list.trio ul {
    float: left;
    width: 25%;
}

.list.trio li {
}

/*Side by side lists in a DIV*/
/*^Deprecated */
.listPair ul, .listTrio ul {
    padding-left: 15px;
}

.listPair > ul:first-child {
    float: left;
    width: 40%;
}

.listPair ul + ul {
    float: right;
    width: 40%;
}

.listPair + p, .listTrio + p {
    clear: both;
}

.listTrio {
    position: relative;
}

    .listTrio > ul {
        display: inline-block;
        width: 25%;
        vertical-align: top;
    }

    * + html .listTrio > ul {
        display: inline;
    }

.legend li {
    list-style: outside none none;
}

/*Tables */

/*Amphibian Life Stages*/
#table-life-stage {
    width: 480px;
}

    #table-life-stage th, #table-life-stage td {
        padding: 5px;
        border: 1px inset;
    }

    #table-life-stage th {
        width: 60px;
        text-align: center;
    }

        #table-life-stage th:first-child {
            width: 120px;
            text-align: left;
        }

    #table-life-stage td {
        padding: 0;
    }

    #table-life-stage.graph.bar .bar {
        height: 14px;
        margin-top: 7px;
    }

/*Sidebar*/
#sidebar ul.social {
    padding: 0;
}

#sidebar .social li {
    clear: both;
    list-style: none outside none;
}

#sidebar .social span.icon {
    float: left;
    height: 21px;
    line-height: 21px;
    margin: 0 10px 10px 0;
    width: 21px;
}

.article a span.icon {
    display: inline-block;
    height: 21px;
    margin: 0 10px 0 0;
    width: 21px;
}

.article a.facebook, .article a.twitter, .article a.flickr, .article a.youtube {
    line-height: 21px;
}

    #sidebar .social .facebook span.icon, .article a.facebook span.icon {
        background-position: -66px -1px;
    }

    #sidebar .social .twitter span.icon, .article a.twitter span.icon {
        background-position: -66px -22px;
    }

    #sidebar .social .flickr span.icon, .article a.flickr span.icon {
        background-position: -66px -43px;
    }

    #sidebar .social .youtube span.icon, .article a.youtube span.icon {
        background-position: -66px -65px;
    }

#sidebar .social .jiffer span.icon, .article a.jiffer span.icon {
    background-position: -88px -1px;
}

/*Contact*/
#contact ul {
    padding: 0;
    margin: 0;
}

#contact li {
    background: none repeat scroll 0 0 #EDF9FC;
    float: left;
    line-height: 1.2;
    list-style: none outside none;
    padding: 8px;
    width: 205px;
}

#contact li {
    margin: 0 0 0 12px;
}

#contact .block {
    display: table;
    margin-left: 8px;
}

    #contact .block.short {
        height: 190px;
    }

    #contact .block.tall {
        height: 250px;
    }

    #contact .block:first-child {
        margin-left: 0;
    }

#contact li h3 {
    font-size: 1.5em;
    font-weight: normal;
    padding: 0 0 5px;
    margin-top: 10px;
}

    #contact li h3:first-child {
        margin-top: 0px;
    }

#contact p {
    padding: 12px 0;
}

#contact h3 + p {
    margin-top: 0px;
}

#contact li h2, #contact li p {
    font-weight: normal;
    padding: 0 0 12px;
}

#content li p, #content li li {
    font-size: 1em;
}

#contact li ul {
    padding: 0 0 0 15px;
}

#contact li li {
    margin: 0 0 0 8px;
    background: none repeat scroll 0 50% transparent;
    float: none;
    height: auto;
    line-height: 1.4;
    list-style: square outside none;
    padding: 0;
    width: auto;
}
/*Social Media*/
.box .social-heading-img {
    max-width: inherit;
    margin-left: -20px;
}

/*container override*/
.box:first-child, .box.first, .box.newsroom {
    margin-top: 0;
}

/*Sections */
.definition > h2:first-child, .definitions > h3:first-child {
    margin-top: 20px;
}

.definition > h3 + p {
    margin-top: 5px;
}

/*RSS Feed*/ .gfc-result .gf-title {
    font-size: 1.13333em;
    line-height: 1.2em;
    font-family: Arial,Helvetica,sans-serif;
    font-weight: bold;
    margin-top: 20px;
    overflow: visible;
    height: auto;
}
