/* Title: FlowServe Screen Styles Copyright: 2009 */ /* =Lists --------------------------------------------- */ ul {list-style-type: none;} ul.nav li {float: left;} body {background: #2E2E2E url(../images/bg_body.png) repeat-x; font-size: 11px; font-family: Arial, Verdana, San-serif;} /* =Pre-defined --------------------------------------------- */ ul, li, li a { vertical-align:bottom;} /* eliminates LI whitespace bugs */ .clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} .clearfix {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ /* =Headers --------------------------------------------- */ #content-col #sub-content h1{font-size: 17px; color: #CC1F00; margin-bottom: 13px;} #content-col #sub-content h2 {font-size: 12px; color: #CC1F00; margin-bottom: 5px; text-transform: uppercase;} #content-col #sub-content h2.community, #actual-content #copy-and-thumb h2.community {margin-bottom: 5px; font-size: 12px; text-transform: none; color: #797878;} #content-col #sub-content .community-list h2 {font-size: 12px; margin-bottom: 10px;} #content-col #sub-content #discussion-board h3 {color: #4F4F4F; margin-bottom: 10px; text-transform: uppercase; font-size: 10px; padding: 4px 4px 4px 10px; background: #E0F3F2;} #content-col #content-mast h1 {width: 204px; padding: 0 0 4px 2px; position: absolute; top: 123px; left: 35px; font-size: 18px; color: #9B1400; border-bottom: 5px solid #9B1400;} #actual-content #copy-and-thumb h1 {font-size: 13px; color: #CC1F00; margin-bottom: 17px;} #actual-content #copy-and-thumb h2 {font-size: 11px; color: #CC1F00; margin-bottom: 10px;} #content-col #actual-content .intro-row h2 {color: #CC1F00; font-size: 12px;} #actual-content .intro-row h2 a {display: block; font-size: 11px; margin-top: 3px; width: 55px;} #content-col #actual-content .mp-story .mp-story-copy h2 {font-size: 13px; color: #CC1F00; margin-bottom: 4px; line-height: 15px;} #content-col #actual-content .env-session h2 {color: #CC1F00; font-size: 12px; margin-bottom: 12px;} #content-col #actual-content .wp-info h2 {color: #CC1F00; margin-bottom: 2px;} #movie-sidenote h3 {font-size: 18px; font-weight: normal; margin-bottom: 12px;} #sustainability h4 {font-size: 11px; padding: 7px 0 0 11px; color: #FFF;height: 19px; background: #686868; text-transform: uppercase;} #sidebar .case-studies .case h3 {color: #30C8C5; font-size: 11px; font-weight: normal;} #sidebar h5 {background: #000; color: #F12600; font-size: 11px; text-transform: uppercase; padding: 8px 0 8px 7px;} /* =Links --------------------------------------------- */ a {outline: none; text-decoration: none; color: #1FBFBA;} a:hover {color: #CC1F00;} a img {border: none;} /* =Structure --------------------------------------------- */ #breadcrumbs {margin: 0 auto; width: 912px; position: relative; background: transparent url(../images/bg_breadcrumbs.png) no-repeat; height: 23px; padding: 12px 0 0 20px; font-size: 12px; font-weight: bold; color: #D4D4D4; text-transform: uppercase;} #breadcrumbs span {color: #FFF;} #container {width: 922px; margin: 0 auto;} #container #masthead {height: 88px; border: 1px solid #656565; margin-bottom: 19px;} #container #content-wrapper {border-left: 2px solid #AEAEAE; border-right: 2px solid #AEAEAE;width: 918px; position: relative;} #bottom {background: transparent url(../images/bg_home_bottom.png) no-repeat; height: 12px; width: 922px; margin-bottom: 20px;} #bottom-inside {background: transparent url(../images/bg_bottom_inside.png) no-repeat; height: 12px; width: 922px; margin-bottom: 20px;} /* =Headmast --------------------------------------------- */ #logo {height: 73px; width: 167px; float: left; padding: 15px 0 0 36px; background: #000000 url(../images/bg_logo.png) repeat-x;} #logo a {display: block; width: 132px; height: 57px;} #header-navs {float: left; width: 717px;} /* [Top Nav] */ #header-navs #top {height: 26px; background: #000000;} #top ul.nav {float: right; height: 19px; padding-top: 6px;} #top ul.nav li {margin-right: 9px; height: 16px; padding-left: 10px; background: transparent url(../images/arrow_turq.png) no-repeat 0 4px !important; background-position: 0 5px;} #header-navs #mid {height: 28px; background: #000000 url(../images/bg_headmast_mid.png) repeat-x;;} /* [Main Nav] */ #header-navs #main {height: 34px;} #main ul.nav {float: left; height: 34px; background: #CC1F00;} #main ul.nav li {height: 34px; text-align: center; border-right: 1px solid #9C1500; border-left: 1px solid #F12600;} #main ul.nav li.last {border-right: 1px solid #F12600;} #main ul.nav li a {color: #FFFFFF; font-weight: bold; padding: 12px 10px 11px 10px; height: 11px; text-transform: uppercase; display: block;} #main ul.nav li a:hover, ul.nav li.on a {background: #9B1400;} #main ul.nav li.first {border-left: none;} #main ul.nav li.last {border-right: 1px solid #F12600;} /* Nav Widths/Heights Necessary for IE Blocking */ #main ul.nav li#introduction a {width: 79px;} #main ul.nav li#marketplace a {width: 81px;} #main ul.nav li#workplace a {width: 68px;} #main ul.nav li#environmental a {width: 91px;} #main ul.nav li#community a {width: 67px;} #main ul.nav li#news a {width: 30px;} /* [Search Box] */ #header-navs #search-box {float: left; height: 34px; width: 170px; background: #434343 url(../images/bg_searchbox.png) repeat-x;} #search-box form {padding: 7px 0 0 12px;} #search-box input {width: 123px; height: 16px; background: #3C3C3C; border: 1px solid #898989; float: left; padding-left: 3px; color: #BFBFBF;} #search-box a#searchbtn {background: #000; display: block; height: 12px; width: 16px; padding: 3px 0 3px 0; text-align: center; color: #BFBFBF; border: 1px solid #898989; float: left; border-left: none; cursor:pointer;} /* =Main Content Wrapper --------------------------------------------- */ /** HOME PAGE CONTENT SECTION **/ #home-content {background: #545454;} #home-content #feature {float: left; width: 664px;} #feature #movie-holder {height: 291px; width: 918px;} #feature #movie-sidenote {float: left; width: 309px; height: 241px; padding: 50px 50px 0 30px; background: transparent url(../images/bg_sidenote.png) no-repeat;} #movie-sidenote p {color: #FFF; line-height: 18px; font-weight: bold; font-size: 14px; margin-bottom: 15px;} #movie-sidenote p span {font-size: 11px; display: block; text-align: right;} #movie-sidenote p a {font-size: 10px; color: #000; text-transform: uppercase;} #movie-sidenote p a span {float: left; margin: -2px 3px 0 0;} #feature #movie {float: left; height: auto; width: 529px;} #feature #jwplayer {float: left;} #feature #sustainability {background: #404040; width: 918px;} #sustainability h4 a {font-size: 10px;} #sustainability #gauge-holder {float: left; width: 430px; padding: 13px 0 2px 23px;} #gauge-holder .gauge {float: left; margin-right: 22px; width: 88px; text-align: center; font-weight: bold; color: #FFF;} #gauge-holder .gauge a {margin-bottom: 5px; display: block;} #gauge-holder .gauge-last {margin-right: 0;} #sustainability #initiatives {float: left; width: 412px; padding: 12px 36px 0 15px; } #initiatives p {color: #FFF; line-height: 15px;} #initiatives p.link {margin-top: 7px;} #initiatives p a {text-transform: uppercase;} #initiatives p span {text-transform: uppercase; font-weight: bold;} /** GLOBAL CONTENT (MINUS HOMEPAGE) **/ #three-col {background: transparent url(../images/bg_threecol.png) repeat-y; width: 918px; min-height: 590px; height: auto !important; height: 590px;} /* Sub-Nav */ #three-col #sub-nav {width: 180px; float: left; position: relative; z-index: 10;} #three-col #sub-nav ul li {width: 180px; position: relative;} #three-col #sub-nav ul li.head {height: 20px; width: 180px; background: transparent url(../images/bg_submenuhead.png) no-repeat;} #three-col #sub-nav ul li a {background: #D5D5D5; border-top: 1px solid #BFBFBF; border-bottom: 1px solid #E6E6E6; text-transform: uppercase; padding: 6px 6px 7px 10px; color: #CC1F00; font-size: 10px; font-weight: bold; display: inline-block; width: 164px;} #three-col #sub-nav ul li a:hover {border-top: 1px solid #FFF; background: #F2F2F2;} #three-col #sub-nav ul li.on {height: 25px;} #three-col #sub-nav ul li.big-on {height: 35px;} #three-col #sub-nav ul li.on a, #three-col #sub-nav ul li.on a:hover {position: absolute; width: 166px; color: #FFF; padding: 7px 10px 8px 10px; border-top: none; border-bottom: none; background: transparent url(../images/bg_submenu_on.png) no-repeat;} #three-col #sub-nav ul li.big-on a, #three-col #sub-nav ul li.big-on a:hover {position: absolute; width: 166px; color: #FFF; padding: 7px 10px 8px 10px; border-top: none; border-bottom: none; background: transparent url(../images/bg_submenu_bigon.png) no-repeat;} /* Content Column */ #three-col #content-col.sub-level {width: 696px;} #three-col #content-col #content-mast {position: relative; margin-bottom: 25px; height: 150px;} #three-col #content-col {float: left; width: 738px; padding: 0 0 42px 0;} #three-col #content-col .img-mid {text-align: center;} /* First Level Content */ #content-col #actual-content .intro-row {width: 661px; border-bottom: 1px dotted #000;} #actual-content .intro-row .intro-col {float: left; padding: 15px 25px 13px 0; width: 297px;} #actual-content .intro-row .col-left {border-right: 1px dotted #000;} #actual-content .intro-row .col-right {padding-left: 25px; padding-right: 0; width: 312px;} #actual-content .intro-col .col-copy {padding-top: 16px;} #actual-content .intro-col .col-copy p {color: #363636; line-height: 14px;} #actual-content .intro-col .col-copy p.more {margin: 15px 0 8px 0;} #actual-content .intro-col .col-copy p span.date {display:block; color: #898989; font-weight: bold;} #actual-content .intro-col .col-copy p.more a {text-transform: uppercase; font-size: 10px; font-weight: bold; color: #30C8C5;} #actual-content .intro-col .col-copy p.more a:hover {color: #CC1F00;} #content-col #actual-content .intro-row-last {border-bottom: 0;} #content-col #actual-content .slogan {font-size: 17px; margin-bottom: 25px; font-weight: bold; color: #CC1F00; padding: 0 70px 0 35px; line-height: 20px;} #content-col #actual-content .slogan-with-follow {font-size: 17px; margin-bottom: 15px; font-weight: bold; color: #CC1F00; padding: 0 70px 0 35px; line-height: 20px;} #content-col #actual-content .slogan-xtra {font-size: 14px; line-height: 16px; padding: 0 75px 0 35px; margin-bottom: 15px;} #actual-content .slogan-xtra strong {color: #363636;} #content-col #actual-content #highlights, #content-col #actual-content #sub-highlights {padding: 18px 0 0 35px;} #content-col #actual-content #highlights p.highlights-hdr {font-size: 12px; margin-bottom: 20px; font-weight: bold; text-transform: uppercase; color: #797878;} #content-col #actual-content .mp-story {padding: 0; margin-bottom: 35px;} #actual-content .mp-story img {float: left; margin-right: 25px;} #actual-content .mp-story .mp-story-copy {float: left; width: 466px;} #actual-content .mp-story .mp-story-copy p {color: #363636; margin-top: 13px; line-height: 14px;} #actual-content .mp-story .mp-story-copy p.share a {font-size: 10px; font-weight: bold; text-transform: uppercase;} #content-col #actual-content .env-session {margin-bottom: 25px; padding: 10px 35px 0 35px;} #actual-content .env-session img {float: left; margin-right: 10px;} #actual-content .env-session .env-session-copy {float: left; width: 360px;} #actual-content .env-session .env-session-copy ul {list-style-type: disc; line-height: 15px; color: #363636; margin: 5px 0 0 16px;} #actual-content .env-session .env-session-copy p {color: #363636; line-height: 14px;} #actual-content .env-session .env-session-copy p a {text-transform: uppercase; display: block; width: 70px; font-size: 10px; font-weight: bold; margin-top: 13px;} #content-col #actual-content .wp-info {margin-bottom: 35px; padding: 0 40px 0 26px;} #content-col #actual-content .wp-info p {line-height: 15px;} #content-col #actual-content .wp-info img.img-right {float: right; margin-left: 25px;} /* Sub Level Content */ #content-col #sub-content {padding: 44px 30px 50px 35px; } #content-col #sub-content p {color: #363636; line-height: 14px;} #content-col #sub-content p.index, #actual-content #copy-and-thumb #cat-copy p.index {font-size: 12px; color: #797878; font-weight: bold; margin-bottom: 20px; margin-top: -20px; text-transform: uppercase;} #content-col #sub-content p.helping-hand {line-height: 16px;} #sub-content .rel-partial {margin-top: 25px; padding-right: 38px;} #sub-content .rel-partial p {margin: 0 0 15px 0;} #sub-content .rel-partial p span.date {display:block; color: #898989; font-weight: bold;} #sub-content .rel-partial p.more a {text-transform: uppercase; font-weight: bold; color: #30C8C5;} #sub-content .rel-partial p.more a:hover {color: #CC1F00;} #sub-content #video-holder {padding: 5px; background: #E5E5E5; width: 431px; margin-bottom: 25px;} #sub-content #video-holder #video {float: left; width: 290px; margin-right: 5px;} #sub-content #video-holder #video-controls {float: left; width: 136px;} #sub-content #video-holder #video-controls img {vertical-align: top;} #sub-content #video-holder #video-controls a {display: block; font-size: 10px; color: #FFF; width: 136px; text-align: center; text-transform: uppercase; font-weight: bold;} #sub-content #video-holder #video-controls #buttons {padding: 5px 0 0 0;} #video-controls a#watch-video {background: #737373; height: 19px; padding: 7px 0 0 0;} #video-controls a#view-photo-gallery {background: #999; height: 30px; padding: 22px 0 0 0;} #sub-content #discussion-board {margin-top: 20px;} #sub-content #discussion-board .comment {margin-bottom: 18px; padding-left: 10px; padding-right: 60px;} #sub-content #discussion-board .comment p {line-height: 16px;} #discussion-board .comment p span.username {font-weight: bold; display: block; margin-bottom: 2px;} #sub-content .community-list {padding-top: 17px;} #sub-content .community-list p {margin-bottom: 17px; line-height: 15px;} #actual-content #copy-and-thumb {padding: 15px 0 0 35px;} #actual-content #copy-and-thumb #cat-thumb {width: 119px; float: left; margin-right: 22px;} #actual-content #copy-and-thumb #cat-copy {float: left; padding-right: 75px; width: 485px;} #copy-and-thumb #cat-copy .policy-holder {padding-top: 14px;} #copy-and-thumb #cat-copy .last-policy {margin-bottom: 25px;} #copy-and-thumb #cat-copy .policy-holder a {float: left; padding: 10px; color: #363636; line-height: 15px; display: block; width: 190px; background: #E8E8E8; margin-right: 42px;} #actual-content #copy-and-thumb #cat-copy.full {width: auto;} #actual-content #copy-and-thumb #cat-copy p {font-size: 11px; line-height: 15px; color: #363636; margin-bottom: 17px;} #actual-content #copy-and-thumb #cat-copy ul {margin: 0 0 17px 16px; list-style-type: disc; line-height: 15px; color: #363636;} .index-holder {padding: 15px 0;} /*-- Sidebar --*/ #sidebar {float: left;} #sidebar p {line-height: 15px; color: #B7B6B6;} #sidebar a {text-transform: uppercase;} #home-content #sidebar {width: 252px;} #sidebar .featured-report {padding: 17px 0 0 0;} #sidebar .featured-report p span {color: #FFF;} #sidebar .featured-report img {float: left; margin: 0 10px 0 18px;} #three-col #sidebar {float: left; width: 230px;} #three-col #sidebar .see-more {padding-left: 8px; margin-top: 5px;} #three-col #sidebar .see-more a {text-transform: none;} #three-col #sidebar .blurb {background: transparent url(../images/bg_blurb.png) no-repeat; height: 134px; width: auto;} /* featured document */ #three-col #sidebar .featured-doc {padding: 13px 7px 0 20px;} #three-col #sidebar .featured-doc span {font-weight: bold; font-size: 12px; color: #1FBFBA;} /* media center */ #three-col #sidebar .media-center {padding: 5px 7px 20px 10px; margin-bottom: 20px;} #three-col #sidebar .media-center p {margin-bottom: 10px;} #three-col #sidebar .media-center p a {font-weight: bold; font-size: 12px;} /* awards recognition */ #three-col #sidebar .awards-rec {padding: 5px 7px 20px 10px; margin-bottom: 20px;} #three-col #sidebar .awards-rec p {color: #FFF; margin-bottom: 10px;} #three-col #sidebar .awards-rec p a {font-weight: bold; font-size: 10px;} /* share your story */ #three-col #sidebar .share-story {padding: 11px 20px 0 18px;} #three-col #sidebar .share-story p {margin-bottom: 15px;} #three-col #sidebar .share-story p span {color: #1FBFBA;} /* featured report */ #three-col #sidebar .featured-report {padding: 15px 6px 0 8px;} #three-col #sidebar .featured-report img {float: left; width: 54px; margin: 0 5px 0 0;} #three-col #sidebar .featured-report .side-copy {float: left; width: 157px;} /* case-studies */ #three-col #sidebar .case-studies .case {margin-bottom: 15px; padding: 9px 25px 0 9px;} #three-col #sidebar .case-studies .case p {line-height: normal; margin-top: 10px; font-size: 10px; color: #B7B6B6;} #three-col #sidebar .case-studies .case p a {text-transform: uppercase;} /* testimonials */ #three-col #sidebar .testimonials {padding: 15px 6px 0 8px;} #three-col #sidebar .testimonials img {float: left; width: 92px; margin: 0 8px 0 0;} #three-col #sidebar .testimonials .side-copy {float: left; width: 116px;} #sidebar .testimonials .side-copy p {line-height: 14px; font-size: 10px;} #sidebar .testimonials .side-copy p span {color: #30C8C5; font-size: 11px; display: block;} #sidebar .testimonials .side-copy p a {display: block; margin-top: 10px;}