/* **************************************************************************************************** * CSS reset and fixes to make the default page style consistent across all browsers */ body,div,dl,dt,dd,ul,ol,li,pre,form,fieldset,input,textarea,th,td { margin: 0; padding: 0; } table { border-collapse:collapse; border-spacing: 0; } th, td { text-align: left; vertical-align: top; } fieldset,img { border: 0; } ul { list-style: none; } img { display: block; } .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } * html .clearfix { zoom: 1; } *:first-child+html .clearfix { zoom: 1; } /* **************************************************************************************************** * General typography */ body { background: #eee; font-size: 62.5%; color: #333; font-family: Helvetica, Arial, sans-serif; } p { font-size: 1.2em; line-height: 17px; margin: 0 0 10px 0; } p.large { font-size: 1.4em; line-height: 1.3em; } p.small { color: #555; font-size: 1.1em; line-height: 15px; } p.quote { color: #555; font-size: 1.2em; font-style: italic; line-height: 16px; } a, a:link, a:visited, a:active { color: #27a42e; } a:hover { text-decoration: none; } h1, h2, h3, h4, h5 { font-weight: bold; } h1 { font-size: 2.8em; line-height: 1.2em; margin: 0 0 20px 0; } h2 { font-size: 2.0em; line-height: 1.2em; margin: 0 0 15px 0; } h3 { font-size: 1.8em; line-height: 1.2em; margin: 0 0 10px 0; } h4 { font-size: 1.4em; line-height: 1.2em; margin: 0 0 10px 0; } h5 { font-size: 1.2em; line-height: 1.2em; margin: 0 0 10px 0; } h2.secondary { font-size: 1.6em; margin: -15px 0 10px 0; } h2.border-top { border-top: 1px dashed #ccc; padding: 15px 0 0 0; margin: 15px 0 15px 0; } /* **************************************************************************************************** * General Layout */ /* #page-wrapper wraps the entire content to centre it */ #page-wrapper { width: 1000px; padding: 0; background: #fff; margin: 0 auto; } /* #header-content-wrapper wraps the page #footer and #content to add padding around it */ #header-content-wrapper { width: 980px; padding: 20px 10px 0 10px; } /* #content containing element for everything between the #header and #footer */ #content { width: 960px; padding: 20px 10px 0 10px; } /* generic classes to layout elements inside #content with various column arrangements */ .col { padding: 0 10px; float: left; } .colright { padding: 0 10px; float: right; } .c3 { width: 220px; } .c6 { width: 460px; } /* re-style the visible content bullet points */ ul.bullets, .product-content ol { list-style-position: outside; list-style-type: disc; margin: 15px 30px; } ul.bullets li, .product-content ol li { margin: 0 0 5px 0; font-size: 1.2em; line-height: 1.4em; } ul.bullets li li, .product-content ol li li { font-size: 1em; line-height: 1.2em; } /* re-style the visible content bullet points */ .product-content ol { list-style-position: outside; list-style-type:decimal; margin: 15px 30px; } .product-content ol li { margin: 0 0 5px 0; font-size: 1.2em; line-height: 1.4em; } .product-content ol li li { font-size: 1em; line-height: 1.2em; } ol { list-style-position: outside; margin: 15px 30px; } ol li { margin: 0 0 5px 0; font-size: 1.2em; line-height: 1.4em; } ol li li { font-size: 1em !important; line-height: 1.2em; } /* **************************************************************************************************** * Header */ #header { position: relative; height: 47px; padding: 74px 0 0 0; } /* area for affiliates co-branding */ #header-affiliates { position: absolute; top: -10px; right: 0; text-align: right; height: 76px; float:right; } #helpucover-logo { position: absolute; left: 0; top: 0; } #helpucover-tagline { font-size: 1.4em; line-height: 20px; font-weight: bold; position: absolute; top: 51px; left: 200px; } /* main site tab navigation */ #header #nav { display: block; width: 970px; height: 46px; padding: 0 0 0 10px; border-bottom: 1px solid #999; } #header #nav li { display: block; float: left; height: 46px; padding: 0 15px 0 0; background: url('images/nav.png') right -50px no-repeat; } #header #nav li a { display: block; float: left; height: 36px; color: #fff; font-size: 1.4em; font-weight: bold; line-height: 36px; padding: 10px 0 0 15px; background: url('images/nav.png') left -50px no-repeat; text-decoration: none; text-shadow: 0 -1px 2px #168b16; } #header #nav li.other { background-position: right -100px; } #header #nav li.other a { background-position: left -100px; color: #fff; text-shadow: 0 -1px 2px #444; } #header #nav li.selected { background-position: right top; } #header #nav li.selected a { height: 41px; line-height: 41px; padding: 5px 0 0 15px; background-position: left top; color: #333; text-shadow: 0 -1px 2px #fff; } #header #nav li:hover { background-position: right top; } #header #nav li:hover a { height: 41px; line-height: 41px; padding: 5px 0 0 15px; background-position: left top; color: #27a42e; text-shadow: 0 -1px 2px #fff; } /* secondary site navigation */ #secondary-navigation { position: absolute; top: 15px; right: 15px; } #secondary-navigation a { font-size: 1.2em; color: #ddd; font-weight: bold; text-decoration: none; } #secondary-navigation a:hover { color: #fff; } #secondary-navigation li { float: left; border-right: 1px solid #999; margin: 0 7px 0 0; padding: 0 7px 0 0; } #secondary-navigation li.last { border: 0; margin: 0; padding: 0; } /* **************************************************************************************************** * Product and page banners */ /* #products-banner the black box containing the main product and feature product boxes on the home page */ #products-banner { width: 980px; position: relative; color: #fff; background: #000 url('images/bannerbg.png') center bottom no-repeat; background: -webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(51,51,51)), color-stop(1, rgb(20,20,20))); background: -moz-linear-gradient(center bottom, rgb(51,51,51) 0%, rgb(20,20,20) 100%); -webkit-border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; } #products-banner-image { display: block; width: 720px; height: 360px; display: block; } /* specific main products within #products-banner */ #map-banner .caption h1 { font-size: 3.2em; color: #222; font-weight: bold; line-height: 1.2em; position: absolute; left: 340px; top: 60px; width: 180px; } #cvp-banner .caption h1 { font-size: 4.2em; color: #222; font-weight: bold; line-height: 1.0em; position: absolute; left: 35px; top: 225px; width: 450px; } #hcp-banner .caption h1 { font-size: 3.2em; color: #222; font-weight: bold; line-height: 1.2em; position: absolute; left: 65px; top: 310px; width: 450px; } #ip-banner .caption h1 { font-size: 4.2em; font-weight: bold; line-height: 1.0em; position: absolute; left: 325px; top: 160px; width: 220px; } #lsp-banner .caption h1 { font-size: 4.2em; color: #222; font-weight: bold; line-height: 1.0em; position: absolute; right: 285px; top: 245px; width: 200px; } #mppi-banner .caption h1 { font-size: 3.2em; font-weight: bold; line-height: 1.2em; position: absolute; left: 35px; top: 65px; width: 180px; } #pet-banner .caption h1 { font-size: 3.2em; font-weight: bold; line-height: 1.2em; position: absolute; left: 35px; top: 65px; width: 180px; } #sports-banner .caption h1 { font-size: 5.2em; font-weight: bold; line-height: 1.0em; position: absolute; left: 35px; top: 65px; width: 200px; } #life-banner .caption h1 { font-size: 3.2em; font-weight: bold; line-height: 1.2em; position: absolute; left: 35px; top: 65px; width: 180px; } #bike-banner .caption h1 { font-size: 4.2em; color: #222; font-weight: bold; line-height: 1.0em; position: absolute; right: 285px; top: 245px; width: 200px; } #motor-banner .caption h1 { font-size: 3.2em; color: #222; font-weight: bold; line-height: 1.2em; position: absolute; left: 340px; top: 60px; width: 180px; } #car-banner .caption h1 { font-size: 3.2em; font-weight: bold; line-height: 1.2em; position: absolute; left: 35px; top: 65px; width: 180px; color:#151515; } #home-banner .caption h1 { font-size: 3.2em; font-weight: bold; line-height: 1.2em; position: absolute; left: 35px; top: 65px; width: 180px; } /* #normal-banner is the thinner black box containing the page title and secondary navigation */ #normal-banner { width: 980px; height: 80px; position: relative; color: #fff; background: #000 url('images/normalbannerbg.png') center bottom no-repeat; background: -webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(51,51,51)), color-stop(1, rgb(20,20,20))); background: -moz-linear-gradient(center bottom, rgb(51,51,51) 0%, rgb(20,20,20) 100%); -webkit-border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; } #normal-banner h1 { font-size: 3.4em; margin: 0; position: absolute; left: 30px; top: 22px; } #normal-banner .telephone { position: absolute; right: 15px; bottom: 10px; color: #4cd34a; font-size: 2.4em; font-weight: bold; } /* telephone details (between hours) */ #telephone-open { padding: 10px 0 0 5px; width: 235px; height: 120px; position: absolute; right: 0; top: 40px; background: url('images/telephone1.png') right top no-repeat; } #telephone-open .open { color: #fff; font-size: 2.0em; font-weight: bold; } #telephone-open .telephone { color: #4cd34a; font-size: 2.2em; font-weight: bold; } #telephone-open .times strong { color: #fff; font-size: 1.2em; } #telephone-open .times .small { color: #fff; font-size: 1.1em; } /* telephone details (out of hours) */ #telephone-closed { padding: 10px 0 0 5px; width: 235px; height: 120px; position: absolute; right: 0; top: 40px; background: url('images/telephone1.png') right top no-repeat; } #telephone-closed .closed { color: #fff; font-size: 2.0em; font-weight: bold; } #telephone-closed .callback { color: #fff; font-size: 1.6em; font-weight: bold; } #telephone-closed .telephone { color: #fff; font-size: 1.4em; font-weight: bold; display: block; padding: 4px 0 2px 0; } #telephone-closed .small { color: #fff; font-size: 1.1em; line-height: 13px; } /* adjust telephone boxes when they're inside the content area */ #content #telephone-open, #content #telephone-closed { position: relative; float: right; top: -5px; width: 214px; height: 114px; padding: 12px 0 0 12px; margin: 0 0 10px 10px; border: 2px solid #3eb944; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background: #1c1c1c url('images/telephone1.png') right top no-repeat; background: #1c1c1c url('images/telephone1.png') right top no-repeat -webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(51,51,51)), color-stop(1, rgb(20,20,20))); background: #1c1c1c url('images/telephone1.png') right top no-repeat -moz-linear-gradient(center bottom, rgb(51,51,51) 0%, rgb(20,20,20) 100%); } /* featured product boxes */ #feature-boxes { padding: 10px; width: 960px; } #feature-boxes h3 { font-size: 1.6em; line-height: 20px; margin: 0 0 5px 0; } #feature-boxes a { color: #4cd34a; } .feature-box { float: left; width: 206px; height: 90px;padding: 10px; margin: 0 5px; border: 2px solid #999; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; background: #333 url('images/feature.png') repeat-x; background: -webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(51,51,51)), color-stop(1, rgb(68,68,68))); background: -moz-linear-gradient(center bottom, rgb(51,51,51) 0%, rgb(68,68,68) 100%); } .feature-box p { font-size: 1.2em; line-height: 1.2em; margin: 0; } /* **************************************************************************************************** * Other elements */ /* latest news box in the #content area */ #latest-news-box { padding-top: 7px; padding-bottom: 0; position: relative; } #latest-news-box a { font-size: 1.2em; font-weight: bold; display: block; } #latest-news-box h2 { margin: 0 0 8px 0; } #latest-news-box ul { display: block; } #latest-news-box li { width: 220px; border-bottom: 1px solid #ccc; line-height: 15px; padding: 7px 0; } #latest-news-box .date { color: #555; font-size: 1.1em; line-height: 15px; } #latest-news-box .button { margin-top: 10px; } /* adjust latest news when it's inside the content area */ #content #latest-news-box { float: right; margin: 0 0 20px 20px; padding: 0; } #content #latest-news-box ul { list-style: none; margin: 0; } #content #latest-news-box li { margin: 0; } /* online quote box in the #content area */ #online-quote-box { background: #f5f5f5; width: 228px; border: 1px solid #bbb; padding: 0; margin: 0 10px 0 0; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -webkit-box-shadow: 2px 2px 4px #ddd; -moz-box-shadow: 2px 2px 4px #ddd; } #online-quote-box ul { display: block; padding: 0; margin: 0; } #online-quote-box a { font-size: 1.1em; color: #333; text-decoration: none; display: block; height: 29px; } #online-quote-box a:hover { color: #27a42e; } #online-quote-box li { background: url('images/arrow-grey.png') right 10px no-repeat; display: block; margin: 0 10px; width: 208px; height: 29px; line-height: 29px; border-bottom: 1px solid #ccc; } #online-quote-box li.last { border: 0; } #online-quote-box .head { height: 36px; width: 228px; padding: 0; margin: 0; border: 1px solid #009111; text-align: center; position: relative; top: -1px; left: -1px; background: #24ad2b center center repeat-x; background-image: url('images/button.png'); background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.4, rgb(40,175,47)), color-stop(0.7, rgb(99,199,102))) !important; background-image: -moz-linear-gradient(center bottom, rgb(40,175,47) 40%, rgb(99,199,102) 70%) !important; border-top-left-radius: 10px; border-top-right-radius: 10px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; } #online-quote-box .head h4 { margin: 0; color: #fff; line-height: 36px; text-shadow: 0 -1px 2px #168b16; } /* Side navigation (site-wide) */ #side-navigation { } #side-navigation ul { display: block; border-bottom: 1px dashed #ccc; padding: 0 0 15px 0; } #side-navigation li { display: block; border-bottom: 1px solid #ccc; background: url('images/sidenavitem.png') 0 0 no-repeat; } #side-navigation li.last { border: 0; } #side-navigation a { display: block; padding: 8px 0 6px 30px; font-size: 1.2em; line-height: 1.2em; color: #333; text-decoration: none; } #side-navigation li:hover { background-position: -220px 0; } #side-navigation a:hover { color: #27a42e; } #side-navigation li.selected { background-position: right 0; } #side-navigation li.selected:hover { background-position: right 0; } #side-navigation li.selected a, #side-navigation li a.sub_nav_selected { color: #27a42e; font-weight: bold; text-shadow: 0 1px 2px #fff; } /* side sub-navigation */ #side-navigation ul ul.sub_navigation { border: 0; border-top: 1px solid #ccc; padding: 0 0 2px 0; margin: -1px 0 0 0; } #side-navigation ul ul.sub_navigation li { margin: 0; padding: 0 0 0 24px; background-position: 22px 0; background-color: #fff; } /* Side navigation (news-archive) */ #side-navigation.news-archive { position: relative; } #side-navigation.news-archive h2 { margin: 0 0 10px 0; } #news-archive-rss { position: absolute; right: 0; top: 0; } /* Side testimonial */ #side-testimonial { padding: 20px; } #side-testimonial img { border: 2px solid #3eb944; margin: 0 0 10px 0; } #side-testimonial p { font-style: italic; color: #555; } #side-testimonial .read-more { font-size: 1.2em; font-weight: bold; } /* **************************************************************************************************** * Template specific content and elements */ /* Product content (right column) */ #product-content { float: right; width: 680px; padding: 0 10px 0 20px; border-left: 1px solid #ccc; } #comparison-table { margin: 0 0 15px 0; border-bottom: 1px dashed #ccc; } #comparison-table table { border: 1px solid #383838; margin: 0 0 15px 0; } #comparison-table td { padding: 8px; font-size: 1.2em; vertical-align: middle; border: 1px solid #ccc; border-bottom: 0; border-left: 0; } #comparison-table .table_headers td { font-weight: bold; background: #f6f6f6; border-bottom: 1px solid #009111; border-top: 0; } #comparison-table .hightlighted_row { height: 22px; color: #fff; font-weight: bold; font-size: 1.3em; text-shadow: 0 -1px 2px #168b16; background: #28a32e url('images/button.png') 0 -14px repeat-x; } #comparison-table .no_border { border-right: 0; } #comparison-table p.small { margin: 0 30px 15px 30px; } #comparison-table .col_provider { width: 30%; } #comparison-table .col_cost { width: 35%; } /* a generic table style */ .generic-table { margin: 0 0 20px 0; border-bottom: 1px solid #ccc; } .generic-table th { padding: 15px 10px; font-size: 1.4em; font-weight: bold; border-right: 1px dashed #ccc; } .generic-table td { padding: 10px; font-size: 1.2em; vertical-align: middle; border-top: 1px solid #ccc; border-right: 1px dashed #ccc; } .generic-table .alternate td { background: #e1f2e0; } .generic-table .noborder { border-right: 0; } /* product question and answers */ .contents-list { margin: 0 0 20px 0; padding: 15px 0; border-top: 1px dashed #ccc; border-bottom: 1px dashed #ccc; } .contents-list ul { list-style: disc inside; } .contents-list li { padding: 6px 15px; font-size: 1.4em; } .contents-list .alternate { background: #f5f5f5; } #product-answers li.clearfix { position: relative; margin: 0 0 10px 0; padding: 0 0 15px 0; border-bottom: 1px dashed #ccc; } #product-answers .backtotop { position: absolute; font-size: 1.2em; top: 3px; right: 0; } /* Product category content (left column) */ #product-category-content { float: left; width: 710px; padding: 0 0 0 0; } #product-category-content .product-category { position: relative; float: left; width: 320px; padding: 210px 0 5px 0; margin: 0 30px 15px 5px; } #product-category-content .product-category img { position: absolute; width: 335px; height: 195px; left: -5px; top: 0; } /* Generic page with large left column */ #page-left-content { float: left; width: 680px; padding: 0 20px 0 0; border-right: 1px solid #ccc; } /* position adjustments for right column elements */ #content .colright #telephone-open { float: left; margin: 0 0 10px -10px; } #content .colright #online-quote-box { float: left; margin: 0 0 20px -10px; } #content .colright #latest-news-box { float: left; width: 100%; margin: 0 0 20px 0; border-top: 1px dashed #ccc; padding: 15px 0 0 0; } /* News content (right column) */ #news-content { float: right; width: 680px; padding: 0px 10px 0px 20px; border-left: 1px solid #ccc; } #news-content li { margin: 0 0 10px 0; padding: 0; border-bottom: 1px dashed #ccc; } #news-content .news-article { position: relative; padding: 10px 10px 5px 110px; /*min-height: 80px;*/ margin:0px 0px 0px 0px;} #news-content .news-date { position: absolute; left: 0; top: 0; width: 100px; height: 100px; background: url('images/news-date.png') left top no-repeat; } #news-content .news-date-month { color: #fff; font-weight: bold; text-shadow: 0 1px 2px #127617; font-size: 1.2em; line-height: 20px; text-align: center; padding: 12px 0 0 0; height: 18px; width: 100px; } #news-content .news-date-day { font-size: 3.0em; text-align: center; font-weight: bold; width: 100px; padding: 15px 0 0 0; } #news-content .alternate { padding: 0px 0px 10px 0px; } #news-content .alternate .news-article { background: #f5f5f5; padding: 10px 10px 5px 110px; } #news-content .alternate .news-date { background-position: right 0; } /* Quote content centred (with no column left or right) */ #quote-content-centred { width: 690px; margin: 0 auto; } #quote-result { border-top: 1px dashed #ccc; border-bottom: 1px dashed #ccc; padding: 10px 0 15px 0; margin: 0 0 15px 0; } #quote-result-premium { text-align: center; padding: 30px 0; margin: 0 0 15px 0; border: 2px solid #3eb944; background: #f5f5f5; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; background: -webkit-gradient(linear, left bottom,left top, color-stop(0, rgb(238,238,238)), color-stop(1, rgb(245,245,245))); background: -moz-linear-gradient(center bottom, rgb(238,238,238) 0%, rgb(245,245,245) 100%); } #quote-result-premium h1 { margin: 0; } #quote-result-details { float: left; width: 320px; padding: 0 0 0 5px; } #quote-result-details table { width: 320px; margin: 0 0 10px 0; } #quote-result-details td { width: 50%; font-size: 1.2em; padding: 5px 0; border-bottom: 1px solid #eee; } #quote-result-purchase { float: right; width: 325px; padding: 0 0 0 19px; border-left: 1px solid #ccc; } #quote-result-purchase div p { width: 180px; } #quote-result-purchase .button { float: right; margin: 0 0 15px 0; } #quote-result-purchase .border { border-bottom: 1px dashed #ccc; margin: 0 0 15px 0; } #quote-result-apply { font-size: 1.8em; width: 120px; text-align: center; padding: 5px 0; } #quote-result-callme { font-size: 1.6em; width: 120px; text-align: center; padding: 2px 0; } #quote-result-details input.backsubmit, #quote-result-purchase input.submit { cursor: pointer; color: #fff; height: 32px; outline: none; text-shadow: 0 -1px 2px #168b16; font-size: 1.2em; font-weight: bold; font-family: Helvetica, Arial, sans-serif; background: #24ad2b center center repeat-x; background-image: url('images/button.png'); background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.4, rgb(40,175,47)), color-stop(0.7, rgb(99,199,102))) !important; background-image: -moz-linear-gradient(center bottom, rgb(40,175,47) 40%, rgb(99,199,102) 70%) !important; border: none; border-radius: 10px;-webkit-border-radius: 10px; -moz-border-radius: 10px; border: 1px solid #186822; float: left; color: #fff !important; text-decoration: none; padding: 0 12px 4px; line-height: 28px; } #quote-result-purchase input.submit { float: right; margin: 0 0 15px 0; width: 122px; font-size: 1.8em; height: 42px; } /* **************************************************************************************************** * Footer */ #footer { width: 960px; margin: 0 auto; padding: 40px 10px 10px 30px; background: #ddd url('images/footer.png') center top no-repeat; } #footer ul { width: 140px; padding: 0 20px 20px 0; float: left; } #footer ul.padding { padding-top: 28px; } #footer li { display: block; min-height: 20px; border-bottom: 1px solid #ccc; } #footer a { color: #333; font-size: 1.1em; line-height: 1.8em; text-decoration: none; } #footer a:hover { color: #27a42e; } #footer p { color: #999; } /* **************************************************************************************************** * Genertic forms styles */ input, select, textarea { border: 1px solid #aaa; color: #333; font-size: 1.2em; font-family: Helvetica, Arial, sans-serif; } input:focus, select:focus, textarea:focus { border: 1px solid #27a42e; outline: none; } input { height: 18px; line-height: 18px; padding: 2px 5px; } select { padding: 2px; } label { color: #333; font-size: 1.2em; font-weight: bold; line-height: 24px; } /* Mouse-over tooltips */ .help_tooltip { display: block; width: 15px; height: 16px; overflow: hidden; background: url('images/tooltip.png') 0 0 no-repeat; cursor: pointer; font-weight: normal; } .help_tooltip .help_text, .help_tooltip .help_text_one, .help_tooltip .help_text_two, .help_tooltip .help_text_three { color: #333; z-index: 1000; position: absolute; top: 20px; width: 300px; padding: 7px; margin: 5px; font-size: 1.1em; line-height: 1.2em; text-align: left; background: #fff; border: 1px solid #3eb944; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; box-shadow: 2px 2px 8px #666; -webkit-box-shadow: 2px 2px 8px #666; -moz-box-shadow: 2px 2px 8px #666; filter: progid:DXImageTransform.Microsoft.Shadow(color=#444444,direction=135); } .help_left .help_text, .help_tooltip .help_text_one, .help_tooltip .help_text_two, .help_tooltip .help_text_three { right: 0 !important; } .help_top .help_text { bottom: 20px !important; top: auto !important; } .help_tooltip:hover { overflow: visible; } /* Consistent green button style for links and submits */ .button { cursor: pointer; color: #fff; padding: 7px 15px; height: 30px; outline: none; text-shadow: 0 -1px 2px #168b16; font-size: 1.2em; line-height: 14px; font-weight: bold; font-family: Helvetica, Arial, sans-serif; background: #24ad2b center center repeat-x; background-image: url('images/button.png'); background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.4, rgb(40,175,47)), color-stop(0.7, rgb(99,199,102))) !important; background-image: -moz-linear-gradient(center bottom, rgb(40,175,47) 40%, rgb(99,199,102) 70%) !important; border: none; border-radius: 10px;-webkit-border-radius: 10px; -moz-border-radius: 10px; } a.button { border: 1px solid #186822; float: left; color: #fff !important; text-decoration: none; padding: 0 15px; line-height: 28px; } /* General style of small quote forms */ form.smallquote { padding: 10px; background: #eee; border: 2px solid #3eb944; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; background: -webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(221,221,221)), color-stop(0.7, rgb(245,245,245))); background: -moz-linear-gradient(center bottom, rgb(221,221,221) 0%, rgb(245,245,245) 70%); } form.smallquote h2 { color: #27a42e; margin: 0 0 10px 0; } .content-smallquote { margin: 0 0 15px 0; padding: 0 0 15px 0; border-bottom: 1px dashed #ccc; } /* **************************************************************************************************** * Specific forms styles */ /* small quote form for MPPI banner */ #products-banner form.smallquote { width: 216px; height: 171px; position: absolute; right: 10px; top: 165px; } #products-banner form.smallquote .button { height: 50px; width: 215px; font-size: 2.0em; position: absolute; left: 10px; bottom: 10px; } #products-banner label { line-height: 1.4em; } /* small quote form for Appliance banner */ #smallquote-appliance h2 { margin: 0 0 15px 0; } #smallquote-appliance label { line-height: 1.2em; } #smallquote-appliance select { width: 174px; margin: 10px 0 4px 0; } #smallquote-appliance .help_tooltip { position: absolute; right: 20px; top: 90px; } /* small quote form for CVP banner */ #smallquote-cvp h2 { margin: 0 0 5px 0; } #smallquote-cvp select { width: 130px; margin: 0 0 4px 0; } /* small quote form for HCP banner */ #smallquote-hcp h2 { margin: 0 0 5px 0; } #smallquote-hcp .field { width: 40px; margin: 0 4px 4px 0; } #smallquote-hcp select { width: 130px; } /* small quote form for IP banner */ #smallquote-ip h2 { margin: 0 0 5px 0; } #smallquote-ip select { width: 213px; } #smallquote-ip .field { margin: 0 0 3px 0; } /* small quote form for IP banner */ #smallquote-pet label { font-size: 1.6em; } #smallquote-pet select { width: 210px; font-size: 1.4em; padding: 5px; margin: 10px 0 3px 0; } /* small quote form for sports banner */ #smallquote-sports h2 { margin: 0 0 5px 0; } #smallquote-sports .field { width: 40px; margin: 0 4px 4px 0; } #smallquote-sports select { width: 130px; } /* small quote form for Lifestyle banner */ #smallquote-lifestyle h2 { margin: 0 0 5px 0; } #smallquote-lifestyle select { width: 213px; margin: 0 0 3px 0; font-size: 1em;} /* small quote form for MPPI banner */ #smallquote-mppi { width: 216px; height: 171px; position: absolute; right: 10px; top: 165px; } #smallquote-mppi h2 { margin: 0 0 5px 0; } #smallquote-mppi-t-monthlybenefit { position: absolute; right: 10px; top: 38px; } #smallquote-mppi-monthlybenefit { width: 204px; margin: 0px 0 3px 0; } #smallquote-mppi-l-cover { float: left;} #smallquote-mppi-cover { float: left; width: 213px; } /* small quote form for Lifestyle content area */ #content-smallquote-life input { width: 136px; } /* small quote form for MPPI content area */ #content-smallquote-mppi form { position: relative; height: 110px; } #content-smallquote-mppi label { width: 230px; float: left; text-align: right; margin: 0 10px 5px 0; font-size:1.0em } #content-smallquote-mppi label.switcher_question {line-height:17px;} #content-smallquote-mppi input { margin: 0 15px 5px 0; } #content-smallquote-mppi .help_tooltip { position: absolute; left: 370px; top: 42px; } #content-smallquote-mppi .button { border: 1px solid #186822; height: 48px; width: 213px; margin: 0; font-size: 2.0em; position: absolute; right: 15px; top: 20px; } /* **************************************************************************************************** * Quick Quote form */ #quick-quote-steps { border-top: 1px dashed #ccc; padding: 10px 0; height: 34px; } #quick-quote-steps li { display: block; float: left; padding: 8px 10px; color: #999; font-size: 1.4em; line-height: 1.2em; border-right: 1px solid #ccc; } #quick-quote-steps li.selected { color: #27a42e; font-weight: bold; text-shadow: 0 -1px 2px #fff; background: #efefef; border: 1px solid #ccc; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background: -webkit-gradient(linear, left bottom, left top, color-stop(0, rgb(238,238,238)), color-stop(1, rgb(243,243,243))); background: -moz-linear-gradient(center bottom, rgb(238,238,238) 0%, rgb(243,243,243) 100%); } #quick-quote-steps li.last { border: 0; } #quick-quote-steps li.noborder { border: 0; } /* main quote form container */ .errormsg, .font_red { color:#FF0000; } .errormsg { font-weight:normal; } /* * Landing page */ #landing-page-image-container { margin-bottom:25px; } #landing-page-image-container img { border: 1px solid #000; } /*Positing h1 for IE6 - Saroz mitra*/ .h1ie6{margin-top:50px !important /*Non-IE6*/; margin-top:63px /*IE6*/;} .div-height{height:30px;} /*[WR1068] Complaints Wording - Style by SAM - 12 Jan 11*/ /* list items without bullet */ ul.without-bullets li { margin-left : 20px; margin-top : 2px; list-style : none; font-size : 0.875em; line-height : 1.5em; } .bullet-listAddress {font-size: 0.9em; margin:0px; padding: 0px 0px 0px 30px;}