/*typography*/ * { margin: 0; padding: 0 } body { color: #414141; font-size: 12px; font-family: Verdana, sans-serif; line-height: 18px; margin: 0; padding: 0 } h1, h2, h3, h4, h5, h6, dl { margin: 0.5em 0 } th h1, th h2, th h3, th h4, th h5, th h6, th dl { margin: 0; } h1 { color: #0f4e78; font-size: 24px; line-height: 26px } h2 { color: #0f4e78; font-size: 22px } h3 { font-size: 18px; } h4 { font-size: 16px; } h5 { font-size: 14px; } h6 { font-size: 11px; } p { margin: 0.5em 0 1em; } :-moz-any-link:focus { border-style: none; outline: none; } a { color: #3d6faa; text-decoration: none; border-style: none; } a:hover, a:focus, a:active { color: #ca8900; border-style: none; } ul, ol { list-style-type: square; margin: 0.5em 0 0.5em 30px; padding: 0; } ul ul li, ol ol li { list-style-type: disc } table { font-size: 12px; text-align: left } /*CLEAR ELMENTS*/ .clearBoth { display: block; margin-top: -1px; height: 1px; min-height: 1px; clear: both } .clearBothMargin { display: block; margin-bottom: 20px; height: 1px; min-height: 1px; clear: both } .pdf { background-image: url("../images/pdf.gif"); background-repeat: no-repeat; background-position: right 0; padding-top: 5px; padding-right: 24px } .pdfsmall { background-image: url("../images/pdfsmall.gif"); background-repeat: no-repeat; background-position: right 0; padding-top: 5px; padding-right: 18px } /* END TYPEOGHRAPHY =========== */ /* WARNING BOX */ .warningHide { visibility: hidden; display: none; width: 0; height: 0 } #warningBox { background-color: #777; background-image: url("../images/warning.gif"); background-repeat: repeat; background-position: 0 0; text-align: left; display: block; margin: 0; padding: 10px; z-index: 90000 } #warningBox strong { color: #ff4500; font-size: 14px; text-transform: capitalize } #warningBox p { color: #282828; font-size: 12px; background-color: #fff; text-transform: capitalize; margin: 0; padding: 10px } /* WARNING BOX */ /* Body Background ART */ body#home, body#welcome { background: url("../images/duck.gif") no-repeat fixed 0 40px } body#banquet { background: url("../xxx/images/banquets.jpg") no-repeat fixed center 0; } body#lifechain { background: url("../images/fish.jpg") no-repeat fixed center 0; } body { text-align: center; margin: 0; padding: 0 } #header { display: block; margin: 0 auto; padding-top: 70px; width: 850px; clear:both; position: relative; } #headerOverflow { position: absolute; z-index: 1001; top: 0; left: 150px; width: 400px; height: 90px; overflow: hidden } #headerLogo { background: url("../images/header100.png") no-repeat; padding: 0; position: absolute; top: 0; left: 0; width: 400px; height: 90px } #headerLogoLink { visibility: visible; display: block; position: absolute; top: 0; left: 40px; width: 300px; height: 70px } /* == WRAPPER ================*/ #wrapper { background-image: url("../images/middle_shadowb900.png"); background-repeat: repeat-y; background-position: 0 0; text-align: left; display: block; margin: 0 auto; padding: 0; width: 850px } #wrapper{ -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 0px; -moz-border-radius-bottomright: 0px; -moz-border-radius-bottomleft: 0px; -webkit-border-radius: 8px 0px 0px 0px; border-radius: 8px 0px 0px 0px; } #wrapper div.fade { background-image: url(../images/middle_shadowb_fade.gif); background-repeat: no-repeat; background-position: 0 top; width: 100%; height: 20px } /* subNav */ #subNav { margin: 0; padding: 0; position: absolute; z-index: 20; top: 50px; right: 15px; width: 220px } #subNav a, #subNav a:link { color: #fff; font-size: 10px; font-weight: bold; display: inline; padding: 3px 5px; opacity: 1.0 } #subNav a:hover, #subNav a:focus { color: #eee; background-color: #004e95; background-color: rgba(0,87,149, 0.6); } #subNav a.first { border-left: medium none } /* mainNav */ #mainNavHold { background-color: #6e6e72; min-width: 850px } #mainNav { background-repeat: no-repeat; background-position: center -3px; display: block; margin: 0; padding: 0 150px 0 0; position: relative; z-index: 1; width: 70%; clear: both } #mainNav ul { list-style-type: none; margin: 0; padding: 0 } #mainNav li.nav { list-style-type: none; display: list-item; margin: 0; padding: 0; position: relative; width: 12.5%; min-width: 110px; float: left } #mainNav a.link span { background-image: url("../images/nav-sprite.png"); background-repeat: no-repeat; display: block; margin: 10px auto 0; width: 40px; height: 35px; content: '' } #mainNav a#resLink span { background-position: 0 0 } #mainNav a#devLink span { background-position: 0 -80px } #mainNav a#desLink span { background-position: 0 -120px } #mainNav a#prtLink span { background-position: 0 -160px } #mainNav a#disLink span { background-position: 0 -200px } #mainNav a#proLink span { background-position: 0 -240px } #mainNav a#malLink span { background-position: 0 -40px } #mainNav a.link { color: #fff; font-size: 10px; font-weight: bold; text-transform: uppercase; display: block; margin: 0; padding: 5px 10px 15px; border-right: 1px solid #e2e3e4 } /* RESIZE */ #mainNav.narrow a.link span {display: none;} #mainNav a.link.borderLeft, #mainNav.medium a.link.brdLeftScl { margin-left: -1px; border-left: 1px solid #e2e3e4 } #mainNav.medium {width: 700px; margin-left:50px;} #mainNav.medium a.link {text-align: left;} #mainNav.medium li.nav {width:175;} #mainNav.medium a.link span {float: left; padding: 0px 0px 0px 10px; margin-top:-5px;} #mainNav.medium .dropNav, #mainNav.narrow .dropNav /* DropNav */{ display: none; top: 38px } #mainNav.wide li.nav {max-width: 130px;} .addDropNav:hover .dropNav, .dropNav:hover, li.addDropNav:hover ul.dropNav, ul.dropNav:hover { display: block; } .addDropNav { position: relative } #leftNav .dropNav { top: 0; left: 140px } .dropNav { background-color: #fff; text-align: left; display: none; margin: 0; padding: 1px; position: absolute; z-index: 1005; top: 70px; left: 0; width: 150px; border: solid 1px #aeb0b3 } .dropNav li { background-color: #6e6e72; /* background-color: rgba(0,0,0,0.6); */ list-style-type: none; display: block; margin: 0; padding: 0 } .dropNav a { color: #ffffff; font-size: 11px; font-weight: bold; display: block; margin: 0; padding: 6px 4px; border-bottom: 1px solid #aaa } /*sub menu*/ #submenu, .submenu { color: #282828; line-height: 25px; background-color: #eee; text-align: left; display: block; margin: 0 0 20px; width: 100%; height: 22px } #submenu a, .submenu a, #submenu span, .submenu span { font-size: 11px; font-family: Verdana, sans-serif; font-weight: bold; line-height: 12px; text-decoration: none; display: block; margin: 0; padding: 5px; float: left; border-right: 1px solid #fff } /*sub menu*/ /* START RANDOM COLORS */ #annualreports a.annualReports {color: #ffffff; background-color: #00CCFF; } #ministryfocus a.min_appeals {color: #ffffff; background-color: #FFCC00;} #banquet a.banquets {color: #ffffff; background-color: #FF6600; } #cards a.cards {color: #ffffff; background-color: #FF33CC; } #lifechain a.lifechain {color: #ffffff; background-color: #660099; } #newsletters a.newsletters {color: #ffffff; background-color: #FF0000; } #walk a.walkForLife {color: #ffffff; background-color: #00CC00; } #annualreports a.indexHere, #leftNav a.annualReports:hover{color: #ffffff; background-color: #00CCFF; } #ministryfocus a.indexHere, #leftNav a.min_appeals:hover {color: #ffffff; background-color: #FFCC00;} #banquet a.indexHere, #leftNav a.banquets:hover {color: #ffffff; background-color: #FF6600; } #cards a.indexHere, #leftNav a.cards:hover {color: #ffffff; background-color: #FF33CC; } #lifechain a.indexHere, #leftNav a.lifechain:hover {color: #ffffff; background-color: #660099; } #newsletters a.indexHere, #leftNav a.newsletters:hover {color: #ffffff; background-color: #FF0000; } #walk a.indexHere, #leftNav a.walkForLife:hover {color: #ffffff; background-color: #00CC00; } /* Appeals SubNav RANDOM COLORS */ #whatif .min_appeals, #sos .min_appeals, #mothers_day .min_appeals, #sohl .min_appeals { color: #ffffff; background-color: #FFCC00;} #whatif .min_appeals:hover, #sos .min_appeals:hover, #mothers_day .min_appeals:hover, #sohl .min_appeals:hover {background-color: #777777;} a.indexHere[href=http://www.life-support.org/ministryfocus/], a.indexHere[href=http://www.life-support.org/whatif/] , a.indexHere[href=http://www.life-support.org/sos/] , a.indexHere[href=http://www.life-support.org/shol/] {color: #ffffff; background-color: #FFCC00;} #submenu .selected, .submenu .selected { color: #ffffff; background-color: #00CCFF; } /* LEFTNAV ========== */ #leftNav { line-height: 13px; list-style-type: none; display: block; margin: 0 0 20px; padding: 0 } #leftNav li { list-style-type: none; display: block; margin: 0; padding: 0; position: relative; border-bottom: 1px solid #eee } #leftNav a { font-size: 11px; font-weight: bold; display: block; padding: 8px 5px } .checkMark, .arrow, .arrowHover, #leftNav a:hover .tMargin, #leftNav a.indexHere:hover .arrow, #leftNav a.indexHere .tMargin, #leftNav a.indexHere .arrow, #leftNav a.indexHere:hover .arrow { display: none } #leftNav .tMargin, #leftNav a:hover .arrow, #leftNav a.indexHere:hover .chackMark, #leftNav a.indexHere .checkMark { display: block } #sixWaySave { background-image: url("http://www.life-support.org/images/sideboxs/6ways.png"); background-position: -10px 0; display: block; width: 130px; height: 170px } #whatCustsay { background-image: url("http://www.life-support.org/images/sideboxs/what_say.gif"); background-position: -20px 0; display: block; width: 130px; height: 170px } #nlThumbAd { background-image: url("http://www.life-support.org/images/sideboxs/nl_thumb.png"); background-repeat: no-repeat; background-position: 0 0; display: block; margin: 0; padding: 0; width: 130px; height: 160px } .tick { display: none; margin-right: 2px; width: 15px; float: left } .blue { color: #3d6faa } .box { margin-bottom: 20px; padding-bottom: 5px; border-bottom: 1px solid #aeb0b3 } /* END LEFTNAV ========== */ /*CONTENT ============== */ #content { display: block; margin: 15px 0 0; padding-top: 20px; padding-bottom: 0; padding-left: 30px; position: relative; width: 600px; float: left } .alnLeft { float: left } .col { margin: 0; width: 150px } .col div.box { margin: 10px; padding-bottom: 10px; border-bottom: 1px solid #aeb0b3 } /*FOOTER ============== */ #footNav { margin-right: auto; margin-left: auto; width: 500px } #footNav a, footNav a:link { color: #282828; display: inline; margin: 0; padding: 2px 5px } #footNav a:hover, footNav a:focus { color: #fff; background-color: #326593 } #footerSpan { opacity: 0.8; background-repeat: repeat-x; background-position: 0 0; margin-top: 0; padding-top: 20px; width: 100%; border-top: 1px solid #d7d7d7 } #footer { background-repeat: no-repeat; background-position: 0 0; margin-right: auto; margin-left: auto; padding-top: 40px; width: 850px; clear: both; opacity: 1.0 } #footerSpan { background-color: #e0e0e0; background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.09, rgb(224,224,224)), color-stop(0.94, rgb(255,255,255)) ); background-image: -moz-linear-gradient( center bottom, rgb(224,224,224) 9%, rgb(255,255,255) 94% ); } /* TABLES ============ */ /*Cool table styles*/ .numbers { background-color: #fff; margin-bottom: 10px; border: solid 1px #aeb0b3; border-collapse: collapse } .numbers col { border-right: 1px solid #aeb0b3 } .numbers thead th:hover col { background-color: #eee } .numbers td:hover col { background-color: #eee } .numbers thead th { background-color: #d7d7d7; background-repeat: repeat-x; background-attachment: scroll; background-position: left center; border-top: 1px solid #a5a5a5; border-bottom: 1px solid #a5a5a5 } .numbers_grayed { background-color: #eee; background-repeat: repeat-x; background-attachment: scroll; background-position: left center; border-bottom: 1px solid #a5a5a5 } .numbers th { font-weight: normal; text-align: left } .numbers th b, .numbers td b { color: #282828 } .numbers th em, .numbers td em { font-weight: bold } .numbers th, .numbers td { padding: 4px 6px } /* Numbers Tabs */ .numbers .tab_head { background-image: none; margin: 0; padding: 0 } .numbers .tab_head th { background-color: #fff; background-image: url("../images/tabs.gif"); background-repeat: no-repeat; background-position: 0 0; cursor: pointer; padding-top: 9px; padding-bottom: 5px; padding-left: 32px; border-style: none } .numbers .tab_head th:hover, .numbers .tab_head:active { background-position: 0 -130px } .numbers .tab_open th { background-position: 0 -32px } .numbers .tab_open th:hover, .numbers .tab_open th:active { background-position: 0 -97px } .numbers tr { background-color: #fff } .numbers tr.odd { background-color: #ececec } .numbers tr:hover { color: #282828; background-color: #FFFFCF } .numbers tr.odd:hover { color: #282828; background-color: #f4f6e0 } /* Old Style .numbers tr:hover { color: #fff; background-color: #3d80df }*/ .numbers tr:hover th { color: #282828 } .numbers thead tr:hover { color: inherit; background-color: transparent } .numbers col#noBorderCol { border: none } /*Cool table styles Close*/ /*java css*/ /* Accordion */ .accordionBox { margin-bottom: 40px; padding-top: 22px; position: relative } .accordionBox a.close { background-image: url("../images/lightbox/closelabel1.gif"); background-repeat: no-repeat; background-position: right 0; text-indent: -5000px; display: block; position: absolute; top: 4px; left: 0; width: 100%; height: 20px } .accordionBox a.topLink { text-decoration: underline; display: block; margin-top: 5px; margin-bottom: 5px; clear: both } .accordionNav .tabInfo, .accordionNav .selected .lessT { display: inline; margin-right: 2px } .accordionNav .lessT { display: none } .accordionNav .selected .moreT { display: none } /* Accordion Close*/ /* TABS */ .tabs ul, .tabs li { margin-top: 0; padding-left: 0 } .tab_body { padding: 10px } .tabLink { background-color: #eee; margin: 0; padding: 5px 10px } .check { background-image: url(../images/tabs.gif); background-repeat: no-repeat; background-position: right -68px; padding-right: 25px } .tabLink.idxH { background-color: #c4ddf7 } .tab_head { background-image: url("../images/tabs.gif"); background-repeat: no-repeat; background-position: 0 0; cursor: pointer; display: block; margin: 0; padding: 5px 10px 5px 32px } .tab_head:hover, .tab_head:active { background-color: #ffffd2; background-position: 0 -130px } .tab_open, .tab_head .selected { background-position: 0 -32px } .tab_open:hover, .tab_open:active { background-color: #ebf5ff; background-position: 0 -97px } div .tabe-more { background-color: #eee; margin: 0; padding: 5px 10px } .tab-more { } .tabs .showHide { background-color: #eee; display: block; margin: 0 0 20px; padding: 10px } /*Tiny Tabs*/ .tinyTabs { list-style-type: none; margin-left: 10px } .tinyTabs .tab_head { background-image: url("http://www.life-support.org/images/tiny_tab.gif"); background-repeat: no-repeat; background-position: 0 0; cursor: default; padding: 3px 0 0 22px; height: 20px } .tinyTabs .tab_head a { cursor: pointer } .tinyTabs .tab_head.tab_open { background-position: 0 -40px; padding-left: 22px; height: 20px } .tinyTabs .tab_body { margin-left: 15px; padding: 0 0 0 25px; border-left: 1px solid #aeb0b3 } .tinyTabs .tab_body li { list-style-type: none; list-style-image: url("../images/h-boarder.gif") } /* TABS Close */ /* READ More */ .read-more a { color: #ff6b0a } /* READ More */ /*Basic FORM*/ fieldset { margin: 0; padding: 5px; border: solid 1px #aeb0b3 } legend { font-size: 10px; font-weight: bold; margin-right: 5px; margin-left: 5px } label.error { color: #900; font-size: 10px; font-style: italic; font-weight: normal; margin-left: 5px } label { font-size: 11px; margin: 0 5px 0 0; padding: 0 } textarea { margin: 0; padding: 0 } input[type="text"] { background-color: #fff; display: inline; margin: 0 0 5px; padding: 0; right: 10px; width: auto; height: 20px; border: solid 1px #6e6e72 } input[type="password"] { display: inline; margin: 0 0 5px; padding: 0; right: 10px; width: auto; height: 20px; border: solid 1px #6e6e72 } /*Basic FORM CLOSE*/ /* Directory */ #directoryHold { margin-right: auto; margin-left: auto; padding-top: 20px; width: 800px } #directory .list { color: #6e6e72; font-size: 10px; line-height: 14px; text-align: left; list-style-type: none; margin: 0 0 0 50px; padding-left: 0; width: 100px; float: left } #directory .list li { margin-bottom: 8px } #directory .listSub { margin-left: 10px } #directory ul li ul li { list-style-type: none } #directory .list a { color: #282828; cursor: pointer } #directory .list span { cursor: pointer } #directory .list a:hover { color: #2e6ea8; background-color: #eee } #directory .list b { color: #2e6ea8 } /* Follow */ #fbFrame { position: absolute; top: 2px; right: 140px } #twLike { position: absolute; top: 2px; right: 15px } .follow { position: absolute; top: 12px; right: 30px; width: 68px; } .follow a.icon { background: url("http://www.life-support.org/images/follow_sprite.png") no-repeat; display: block; margin-left: 8px; padding: 0; width: 25px; height: 25px; float: left } .follow a.icon span { display: none } .follow a.icon.email {background-position: -40px 0px;} .follow a.icon.facebook { background-position: -25px 0 } .follow a.icon.twitter {background-position: 0px 0px;} /* twitter_div */ .follow a.twitter:hover + #twitter_div, #twitter_div:hover { display: block } #twitter_div { color: #fff; background-color: #282828; text-align: left; display: none; padding: 15px; position: absolute; z-index: 1002; top: 25px; right: 0; opacity: 0.9; width: 250px; } #twitter_div ul { list-style-type: none; margin: 0 } #twitter_div span {display: block;} #twitter_div a[style] { color: #eee; font-size: 11px; display: inline; float: left } #twitter_div a[title='@LifeSupInc'] { color: #00aeef; font-size: 10px; float: right } /* RANDOM COLORS Hover*/ a.indexHere:hover, .dropNav a.indexHere:hover, .dropNav a:hover, #submenu a:hover, .submenu a:hover, #leftNav a.indexHere:hover { color: #ffffff; background-color: #989898 } .bgColor1, .bgColor2, .bgColor3, .bgColor4, .bgColor5, .bgColor6 {color: #ffffff; font-weight: bold;} .bgColor1 {background-color: #00CCFF; } .bgColor2 {color: #ffffff; font-weight: bold; background-color: #FFCC00; } .bgColor3 {color: #ffffff; font-weight: bold; background-color: #FF6600; } .bgColor4 {color: #ffffff; font-weight: bold; background-color: #FF33CC; } .bgColor5 {color: #ffffff; font-weight: bold; background-color: #660099; } .bgColor6 {color: #ffffff; font-weight: bold; background-color: #00CC00; } .bgColor7{color: #ffffff; font-weight: bold; background-color: #FF0000; } /* MAIN NAV COLORS */ body#resources a#resLink, body#resources a.indexHere, a#resLink:hover { background-color: #f00 } body#development a#devLink, body#development a.indexHere, a#devLink:hover { background-color: #0cf; } body#design a#desLink, body#design a.indexHere, a#desLink:hover { background-color: #fc0; } body#printing a#prtLink, body#printing a.indexHere, a#prtLink:hover { background-color: #f60; } body#displays a#disLink, body#displays a.indexHere, a#disLink:hover { background-color: #f3c; } body#promo a#proLink, body#promo a.indexHere, a#proLink:hover { background-color: #609; } body#mail a#malLink, body#mail a.indexHere, a#malLink:hover { background-color: #0c0; } /*cssTrix*/ #mainNav a.link, #leftNav a, a.indexHere { -webkit-transition: background-color 0.5s ease; -moz-transition: background-color 0.5s ease; -ms-transition: background-color 0.5s ease; -o-transition: background-color 0.5s ease; } /*cssTrix*/ /* END RANDOM COLORS */ /*Narrow*/ @media screen and (max-width:845px){ body#home a#reslink { background-color: transparent; } #mainNav {max-width: 500px; padding-top:80px;} #mainNav li.nav { max-width: 100px;} #mainNav a.link span {display: none;} #mainNav .dropNav /* DropNav */{ display: none; top: 38px } } /*Medium*/ @media screen and (max-width:1099px){ body#home a#reslink {background-color: transparent;} #mainNav a.link.borderLeft, #mainNav a.link.brdLeftScl { margin-left: -1px; border-left: 1px solid #e2e3e4 } #mainNav {width: 700px; margin-left:50px;} #mainNav a.link {text-align: left;} #mainNav li.nav {width:175;} #mainNav a.link span {float: left; padding: 0px 0px 0px 10px; margin-top:-5px;} #mainNav .dropNav /* DropNav */{ display: none; top: 38px } } /*Wide*/ @media screen and (min-width:1100px){ #mainNav li.nav { max-width: 130px;} }