.clearBoth { display: block; margin-top: -1px; height: 1px; clear: both; border: 0; outline-style: none; outline-width: 0 } .clearSpacer { display: block; margin-bottom: 20px; height: 1px; clear: both } body#com .lifeSupItem, body#com .afoItem { display: none} body#lifesupport .comInkItem, body#lifesupport .afoItem { display: none} body#afo .comInkItem, body#afo .lifeSupItem { display: none} body#com .comInkItem{ display: block} body#afo .afoItem{ display: block} body#lifesupport .lifeSupItem{ display: block} /*.lifeSupItem, .afoItem { display: none } */ body { color: #373737; font-size: 75%; font-family: Verdana, sans-serif; line-height: 1.8em; background-image: url("http://www.lifeguardenvelope.com/images/bk.jpg"); background-repeat: repeat-x; background-position: 0 0; margin: 0; padding: 0 } /* TYPOGRAPHY */ ul { list-style: square inside; margin: 0 } hr { border-top: 1px solid #aeb0b3; border-right: none; border-bottom: none; border-left: none; outline-style: none } a, a:visited, a:focus, a:active { color: #004e95; text-decoration: none; border-style: none; outline: none medium } -moz-any-link:focus { border-style: none; outline: none } a:hover, a:active { color: #ca8900 } blockquote { padding: 0 20px; margin-left: 20px; border-left: 20px solid #ccc; font-size: 14px; font-family: Georgia, serif; font-style: italic; margin-top: 10px;} h1, h2, h3, h4, h5, h6 { font-weight: normal; margin-top: 0.3em; margin-bottom: 0.8em } h1 { color: #46350c; font-size: 1.8em; text-transform: capitalize } h2 { color: #282828; font-size: 1.4em } h3 { color: #4b4b4b; font-size: 1.25em; font-family: Georgia, serif; font-weight: normal } h4 { color: #282828; font-size: 1.1em } h5 { color: #282828; font-size: 1em } h6 { color: #282828; font-size: 0.85em } p { margin-top: 0.5em; margin-bottom: 1em } blockquote { border-left: 2px solid #aeb0b3 } /*Cool table styles*/ .numbers { text-align: left; vertical-align: top; border-collapse: collapse } .numbers col { border-right: 1px solid #aeb0b3 } .numbers thead th:hover col { background-color: #e6e6e6 } .numbers thead th { background-color: #eee; 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 { } .numbers th em, .numbers td em { font-weight: bold } .numbers th, .numbers td { padding: 6px 4px } .numbers tr { background-color: #fff } .numbers tr.odd { background-color: #f5f5f5 } .numbers tr:hover { color: #282828; background-color: #e1e1e1 } /* 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*/ /*#header { background-image: url("images/header.jpg"); background-repeat: no-repeat; background-position: 0 0; display: block; margin: 0 auto; padding: 0; width: 850px; height: 150px; clear: both } */ #header { background-image: url("http://www.lifeguardenvelope.com/images/header.jpg"); background-repeat: no-repeat; background-position: 0 0; display: block; margin: 0 auto; padding: 0; position: relative; width: 850px; min-height: 150px; clear: both } body#home #header { background-image: url("http://www.lifeguardenvelope.com/images/woman.jpg"); background-repeat: no-repeat; background-position: 0 30px; height: 280px } /*TOP NAV #topNav { background-color: #fffff0; padding: 0; position: absolute; z-index: 9999; top: 0; right: 20px; float: right; border-top: none; border-right: 2px solid #004e95; border-bottom: 2px solid #004e95; border-left: 1px solid #2e6fa9 }*/ #topNav { color: #aeb0b3; background-image: url("http://www.lifeguardenvelope.com/images/nav.jpg"); background-repeat: repeat-x; background-position: 0 0; display: block; margin: 0 10px 0 0; padding: 3px 0 0; height: 27px; float: right }#topNav a { color: #aeb0b3; font-size: 11px; text-decoration: none; margin: 0; padding: 0 10px 0 } #topNav a:hover, #topNav a:focus { color: #fff } /*#mainNav { background-color: #fff; display: block; padding-top: 20px; padding-bottom: 10px; width: 100%; clear: both; border-bottom: 1px solid #004e95 } */ #mainNav { background-image: url("http://www.lifeguardenvelope.com/images/navbar.gif"); background-repeat: no-repeat; background-position: 0 0; display: block; margin: 0; padding: 0; width: 850px; height: 50px; float: left } /* #mainNav a.link { color: #004e95; font-size: 16px; text-decoration: none; margin: 0; padding: 0 20px } #mainNav a.first { border-left: none } */ #mainNav a { background-image: url("http://www.lifeguardenvelope.com/images/navbar.gif"); text-indent: -10000px; margin-right: 9px; padding: 0; overflow: hidden } /*LINKS*/ #mainNav a.product { background-image: url("http://www.lifeguardenvelope.com/images/navbar.gif"); background-repeat: no-repeat; background-position: 0 -100px; display: block; width: 120px; height: 50px; float: left } #mainNav a.faq { background-image: url("http://www.lifeguardenvelope.com/images/navbar.gif"); background-repeat: no-repeat; background-position: -140px -100px; display: block; width: 60px; height: 50px; float: left } #mainNav a.resource { background-image: url("http://www.lifeguardenvelope.com/images/navbar.gif"); background-repeat: no-repeat; background-position: -220px -100px; display: block; width: 120px; height: 50px; float: left } #mainNav a.quote { background-image: url("http://www.lifeguardenvelope.com/images/navbar.gif"); background-repeat: no-repeat; background-position: -360px -100px; display: block; margin-right: 145px; width: 80px; height: 50px; float: left } #mainNav a.home { background-image: url("http://www.lifeguardenvelope.com/images/navbar.gif"); background-repeat: no-repeat; background-position: -460px -100px; display: block; width: 60px; height: 50px; float: left } #mainNav a.about { background-image: url("http://www.lifeguardenvelope.com/images/navbar.gif"); background-repeat: no-repeat; background-position: -530px -100px; display: block; width: 85px; height: 50px; float: left } #mainNav a.questions { background-image: url("http://www.lifeguardenvelope.com/images/navbar.gif"); background-repeat: no-repeat; background-position: -620px -100px; display: block; width: 95px; height: 50px; float: left } #mainNav a.contact { background-image: url("http://www.lifeguardenvelope.com/images/navbar.gif"); background-repeat: no-repeat; background-position: -735px -100px; display: block; margin-right: 0; width: 90px; height: 50px; float: left } /*hover STATE*/ #mainNav a.product:hover { background-position: 0 -150px } #mainNav a.faq:hover { background-position: -140px -150px } #mainNav a.resource:hover { background-position: -220px -150px } #mainNav a.quote:hover { background-position: -360px -150px } #mainNav a.home:hover { background-position: -460px -150px } #mainNav a.about:hover { background-position: -530px -150px } #mainNav a.questions:hover { background-position: -620px -150px } #mainNav a.contact:hover { background-position: -735px -150px } /*ACTIVE STATE*/ #mainNav a.product:active { background-position: 0 -50px } #mainNav a.faq:active { background-position: -140px -50px } #mainNav a.resource:active { background-position: -220px -50px } #mainNav a.quote:active { background-position: -360px -50px } #mainNav a.home:active { background-position: -460px -50px } #mainNav a.about:active { background-position: -530px -50px } #mainNav a.questions:active { background-position: -620px -50px } #mainNav a.contact:active { background-position: -735px -50px } /*INDEX STATE*/ #mainNav a.product.indexHere { background-position: 0 -200px } #mainNav a.faq.indexHere { background-position: -140px -200px } #mainNav a.resource.indexHere { background-position: -220px -200px } #mainNav a.quote.indexHere { background-position: -360px -200px } #mainNav a.home.indexHere { background-position: -460px -200px } #mainNav a.about.indexHere { background-position: -530px -200px } #mainNav a.questions.indexHere { background-position: -620px -200px } #mainNav a.contact.indexHere { background-position: -735px -200px } /* HOVER STATE #mainNav a.link:hover, #mainNav a.link:focus { background-color: #dee5f7; border-bottom: 8px solid #fdc022 } /* INDEX STATE #mainNav a.indexHere { background-color: #eff5ff; border-bottom: 8px solid #fde499 }*/ #mainNav .dropdown { margin: 0 auto; width: 850px } #mainNav .sub_menu { background-color: #3587b9; border: solid 1px #004e95 } #mainNav .sub_menu a { color: #fff; font-weight: normal; margin: 0; padding: 0 } #wrapper { background-image: url("http://www.lifeguardenvelope.com/images/wrapper.gif"); background-repeat: repeat-y; background-position: 0 0; display: block; margin: 0 auto; padding: 0; width: 850px; min-height: 600px; clear: both } #wrapperhead { background-image: url("http://www.lifeguardenvelope.com/images/wrapper_head.gif"); background-repeat: no-repeat; background-position: 0 0; display: block; width: 100%; height: 10px; clear: both } #wrapperfoot { background-image: url("http://www.lifeguardenvelope.com/images/wrapper_foot.gif"); background-repeat: no-repeat; background-position: 0 0; display: block; width: 100%; height: 10px; clear: both } #content { display: block; padding: 0 25 0 20; width: 540px; min-height: 100px; float: left } #content .article { background-color: #fff; background-image: url("http://www.lifeguardenvelope.com/images/articlebk.gif"); background-repeat: no-repeat; background-position: 0 bottom; display: block; margin: 0 0 20px; padding: 15px; border-left: 1px solid #eee } #sidebar { font-size: 95%; line-height: 1.5em; background-repeat: repeat-y; background-position: 15px 0; display: block; margin: -13px 0 0; padding-left: 15px; width: 280px; min-height: 100px; float: left } #sidebar .article { background-image: url("http://www.lifeguardenvelope.com/images/sidebar_mid.gif"); background-repeat: repeat-y; background-position: 0 0; margin: 0; padding: 1px 20px 1px 15px } #sidebar .article h2 { color: #96721a; font-family: Georgia, serif } .topShadow { background-image: url("http://www.lifeguardenvelope.com/images/sidebar_top.gif"); background-repeat: no-repeat; background-position: 0 top; display: block; margin: 0; padding: 0; position: relative; height: 15px; clear: both } .topShadowRight { background-image: url("http://www.lifeguardenvelope.com/images/sidebar_top.gif"); background-repeat: no-repeat; background-position: right top; display: block; margin: 0; padding: 0; position: absolute; top: 0; right: 0; width: 20px; height: 15px } .botShadow { background-image: url("http://www.lifeguardenvelope.com/images/sidebar_bot.gif"); background-repeat: no-repeat; background-position: 0 bottom; display: block; margin: 0; padding: 0; position: relative; height: 15px; clear: both } .botShadowRight { background-image: url("http://www.lifeguardenvelope.com/images/sidebar_bot.gif"); background-repeat: no-repeat; background-position: right bottom; display: block; margin: 0; padding: 0; position: absolute; top: 0; right: 0; width: 20px; height: 15px } /* Footer */ #footer { background-image: url("http://www.lifeguardenvelope.com/images/footer.jpg"); background-repeat: repeat-x; background-position: 0 0; display: block; padding-top: 20px; width: 100%; min-height: 178px; clear: both } #footCode { display: block; padding-left: 40px; float: left } #idCrimeLogo { } #footLogoCom { background-image: url("http://www.lifeguardenvelope.com/images/footlogo.gif"); background-repeat: no-repeat; background-position: 0 0; text-indent: -10000px; display: block; margin: 0 0 -20px; padding: 0; width: 220px; height: 60px; overflow: hidden } #footLogoLife { background-image: url("http://www.lifeguardenvelope.com/images/footlogo_ls.gif"); background-repeat: no-repeat; background-position: 0 0; text-indent: -10000px; display: block; margin: 0 0 -20px; padding: 0; width: 220px; height: 74px; overflow: hidden } #footLogoAFO { background-image: url("http://www.lifeguardenvelope.com/images/footlogo_afo.gif"); background-repeat: no-repeat; background-position: 0 0; text-indent: -10000px; display: block; margin: 0 0 -20px; padding: 0; width: 220px; height: 70px; overflow: hidden } #poBoxAdd { font-size: 120%; margin-left: 56px; padding: 0 } /* FAQ */ #faqList { } #faqList .tab_head { line-height: 22px; background-color: #eee; display: block; margin-bottom: 5px; padding: 5px 10px 5px 32px } #faqList .tab_head:hover, #faqList .tab_head:active { background-color: #dee5f7 } /*Products*/ #content .article.rel { padding-top: 30px; position: relative } .optionsTabB { position: absolute; top: 0; right: 15px } .optionsTabB.tab_open { background-color: #e5f4ff } .options { background-color: #f3ea00; background-image: url("http://www.lifeguardenvelope.com/images/options_mid.gif"); background-repeat: repeat-y; background-position: 0 0; margin: 0; padding: 0; position: absolute; z-index: 5000; bottom: 25px; left: 15px; width: 430px; border: solid 1px #eee } .options .topShadow { background-image: url("http://www.lifeguardenvelope.com/images/options_top.gif"); background-repeat: no-repeat; background-position: 0 top; display: block; margin: 0; padding: 0; position: relative; height: 15px; clear: both } .options .topShadowRight { background-image: url("http://www.lifeguardenvelope.com/images/options_top.gif"); background-repeat: no-repeat; background-position: right top; display: block; margin: 0; padding: 0; position: absolute; top: 0; right: 0; width: 20px; height: 15px } .options .botShadow { background-image: url("http://www.lifeguardenvelope.com/images/options_bot.gif"); background-repeat: no-repeat; background-position: 0 bottom; display: block; margin: 0; padding: 0; position: relative; height: 15px; clear: both } .options .botShadowRight { background-image: url("http://www.lifeguardenvelope.com/images/options_bot.gif"); background-repeat: no-repeat; background-position: right bottom; display: block; margin: 0; padding: 0; position: absolute; top: 0; right: 0; width: 20px; height: 15px } /* Quote */ #orderForm { position: relative } #orderForm h3.tab_head { background-image: none; margin-left: 75px; padding-left: 0 } #orderForm a.seeMore { font-size: 80%; padding: 2px 28px 5px 5px } #orderForm a.seeMore:hover { color: #ca8900; background-image: url("http://www.lifeguardenvelope.com/images/tabs.gif"); background-repeat: no-repeat; background-position: right -135px; padding-right: 28px; height: 32px } #orderForm .tab_open a.seeMore { color: #004e95; background-image: url("http://www.lifeguardenvelope.com/images/tabs.gif"); background-repeat: no-repeat; background-position: right -102px; padding: 2px 28px 0 5px; height: 32px } #orderForm .error { color: #d00000 } #orderForm .addOrd { display: block; position: relative } .tab_body.details { background-color: #eee; display: block; margin-bottom: 15px; padding: 5px; border: solid 1px #aeb0b3 } .ordTab_head { cursor: pointer; position: absolute; z-index: 9999; top: 8px; left: 55px } .ordTab_Text { color: #5a5b5e; position: absolute; z-index: 9999; top: 8px; right: 458px } .ordTab_body.ordOptions { background-color: #eee } .enColor { cursor: pointer; display: block; margin: 0 0 0 10px; width: 15px; height: 15px; float: left; border: solid 1px #eee } .enColor.enB { background-color: #b8ddff } .enColor.enY { background-color: #fffbc4 } .enColor.enC { background-color: #baea0e } .envo-image { display: block; position: relative; width: 200px; height: 140px; overflow: hidden } .envo-image img { position: absolute; z-index: 4000; top: 0; left: 0 } /*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("http://www.lifeguardenvelope.com/images/tabs.gif"); background-repeat: no-repeat; background-position: right -68px; padding-right: 25px } .tabLink.idxH { background-color: #c4ddf7 } .tab_head { background-image: url("http://www.lifeguardenvelope.com/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-position: 0 -130px } .tab_open { background-position: 0 -32px } .tab_open:hover, .tab_open:active { background-position: 0 -97px } div .tabe-more { background-color: #eee; margin: 0; padding: 5px 10px } .tab-more { } .tabs .showHide { display: block; margin: 0 0 20px; padding: 10px } /* PAGE STRUCTURE */ /* Drop Menu*/ /* LEVEL ONE */ ul.dropdown { list-style-type: none; display: block; position: relative } ul.dropdown li { background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; float: left; zoom: 1 } ul.dropdown a:hover { } ul.dropdown a:active { } ul.dropdown li a { display: block } ul.dropdown li:last-child a { border-right: medium none } /* Doesn't work in IE */ ul.dropdown li { position: relative; z-index: 1000 } /* LEVEL TWO */ ul.dropdown ul { visibility: hidden; list-style-type: none; padding: 5px; position: absolute; z-index: 1000; top: 100%; left: 0 } ul.dropdown ul li { font-weight: normal; float: none } /* IE 6 & 7 Needs Inline Block */ ul.dropdown ul li a { display: block; width: 100% } /* LEVEL THREE */ ul.dropdown ul ul { padding: 5px; z-index: 1000; top: 0; left: 100% } ul.dropdown li:hover > ul { visibility: visible; } /* CODA SLIDER*/ #slider { background-image: url("http://www.lifeguardenvelope.com/images/slider.jpg"); background-repeat: no-repeat; background-position: -3px -5px; display: block; margin: 0 auto; padding-top: 5px; padding-left: 8px; width: 842px; height: 330px; clear: both; } #slider .sliderIMG { display: block; width: 540px; height: 288px } .slider-wrap { display: block; top: 87px; left: 40px; width: 530px; float: left } .stripViewer .panelContainer .panel ul { text-align: left; margin: 0 15px 0 30px; } .stripViewer { position: relative; width: 530px; height: 288px; overflow: hidden } .stripViewer .panelContainer { position: relative; left: 0; top: 0; } .stripViewer .panelContainer .panel { position: relative; width: 530px; height: 100%; float: left } .stripNavL, .stripNavR, .stripNav { display: none; } .nav-thumb { } #movers-row { margin-top: 20px; margin-left: 5px; float: left } #movers-row div { display: block } /* slider Images */ #slider a.sliderIMG { background-image: url("http://www.lifeguardenvelope.com/images/codaslider.gif"); background-repeat: no-repeat; display: block; width: 540px; height: 288px } #lifeguardIMG.sliderIMG { background-position: 0 0 } #idtheftIMG.sliderIMG { background-position: 0 -288px } #take2testIMG.sliderIMG { background-position: 0 -576px } #solutionIMG.sliderIMG { background-position: 0 -864px } /* slider Images:hover */ #lifeguardIMG:hover { background-position: 0 -1152px } #idtheftIMG:hover { background-position: 0 -1440px } #take2testIMG:hover { background-position: 0 -1728px } #solutionIMG:hover { background-position: 0 -2016px } /* Slider Links */ #movers-row div a.cross-link /* All links are -72px */ { text-decoration: none; text-indent: -300px; cursor: pointer; display: block; margin: 0 0 10px; padding: 0; width: 276px; height: 50px; overflow: hidden; border-style: none } #movers-row div a#slideNav1 { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 0 } #movers-row div a#slideNav2 { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -72px } #movers-row div a#slideNav3 { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -144px } #movers-row div a#slideNav4 { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -216px } /* Slider Links HOVER*/ #movers-row div a#slideNav1:hover { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -576px } #movers-row div a#slideNav2:hover { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -648px } #movers-row div a#slideNav3:hover { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -720px } #movers-row div a#slideNav4:hover { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -792px } #movers-row div a#slideNav1.active-thumb { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -288px } #movers-row div a#slideNav2.active-thumb { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -360px } #movers-row div a#slideNav3.active-thumb { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -432px } #movers-row div a#slideNav4.active-thumb { background-image: url("http://www.lifeguardenvelope.com/images/slidernav.gif"); background-repeat: no-repeat; background-position: 0 -504px } .stripViewer .wrapper img { position: absolute; z-index: 100; float: left } .photo-meta-data { padding: 10px; position: relative; z-index: 9999 } .photo-meta-data span { font-size: 13px; } .cross-link { } .active-thumb { background-color: #aeb0b3 } /*Forms */ form { display: block; width: auto } /* fieldset styling */ fieldset { background-color: #f5f5f5; display: block; margin: 1em 0; padding: 1em; border: solid 1px #aeb0b3 } fieldset em { color: #004e95; font-family: Georgia, serif; font-style: italic } fieldset span.tab-more { display: none } /* legend styling */ legend { font-weight: bold; } form p { } /* style for labels */ label { margin-right: 1em; float: left } #remember-me label { width: 4em; } /* style for required labels */ label .required { font-size: 0.83em; color:#760000; } /* style error messages */ label .feedback { color: #760000; font-weight: bold; background: url("http://www.lifeguardenvelope.com/images/error.png") no-repeat left top; margin-left: 11em; padding-left: 18px; position: absolute; right: 0; left: 200px } /* :KLUDGE: Explicitly set the width for IE6- */ * html .feedback{ width: 10em; } input[type="text"], textarea { } input.radio, input.checkbox, input.submit { width: auto; } /* style form elements on focus */ input:focus, textarea:focus { background: #ffffeb } input.radio { float: left; margin-right: 1em; } textarea { width: 300px; height: 100px; } /*miscellaneous*/ .pdf { background-image: url("http://www.lifeguardenvelope.com/images/pdf.gif"); background-repeat: no-repeat; background-position: right 0; padding-top: 5px; padding-right: 25px } .pdfsmall { background-image: url("http://www.lifeguardenvelope.com/images/pdfsmall.gif"); background-repeat: no-repeat; background-position: right 0; padding-top: 5px; padding-right: 18px } .doc { background-image: url("http://www.lifeguardenvelope.com/images/doc.gif"); background-repeat: no-repeat; background-position: right 0; padding-top: 5px; padding-right: 25px } .docsmall { background-image: url("http://www.lifeguardenvelope.com/images/docsmall.gif"); background-repeat: no-repeat; background-position: right 0; padding-top: 5px; padding-right: 18px } .txt { background-image: url("http://www.lifeguardenvelope.com/images/txt.gif"); background-repeat: no-repeat; background-position: right 0; padding-top: 5px; padding-right: 25px } .txtsmall { background-image: url("http://www.lifeguardenvelope.com/images/txtsmall.gif"); background-repeat: no-repeat; background-position: right 0; padding-top: 5px; padding-right: 18px }