/*/////////////////////////////////////////////////// // // CSS RESET // ///////////////////////////////////////////////////*/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } /* remember to define focus styles! */ :focus { outline: 0; } /* remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0; } .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; } * html .clearfix { height: 1%; } /*/////////////////////////////////////////////////// // // COLORS, Dark to light // // Neutrals: #bcc0c6, #C0C0A4, #CECEB7, #DDDDCC, #e9e9e9 // Green: #03467e // Red: #98002E // ///////////////////////////////////////////////////*/ /*/////////////////////////////////////////////////// // // GLOBAL // ///////////////////////////////////////////////////*/ body { font: 12px Helvetica, Arial, sans-serif; background:url(/images/site/test_bg.jpg) no-repeat #7e0001; } a { color: #000; text-decoration: none; } a:hover { color: #98002E; text-decoration: underline; } h1 { font-size: 24px; font-weight: bold; color: #03467e; margin-bottom: 10px; } h1:first-child { padding-top: 10px } h2 { font-size: 16px; font-style: italic; font-weight: normal; } h1 + h2 { margin-top: -8px; margin-bottom: 20px } h3 { font-size: 16px; font-weight: bold; color: #03467e; margin: 15px 0 3px;} h4 { font-size: 14px; font-weight: bold; color: #03467e; } h6 { font-size: 11px; color: #03467e; font-style: italic; color: #667; font-weight: normal; } p { padding-bottom: 10px; } strong { font-weight: bold; } em { font-style: italic } #site { width: 960px; margin: 0 auto; padding: 20px 0 100px; overflow: visible; } #site-head { position: relative; background: url(/images/site/header.png) no-repeat; height: 151px; z-index: 200; } #site-logo { position: absolute; display: block; width: 215px; height: 75px; top: 30px; left: 35px; z-index: 250; } #site-logo span { display: none; } #nav-secondary { position: absolute; top: 52px; right: 35px; overflow: visible; } #nav-secondary .button-wrap { display: none; } #nav-secondary li { float: right; margin-left: 10px; } #nav-search { position: relative; width: 170px; height: 22px; background: url(/images/site/header.png) 0 -345px no-repeat; padding: 4px 5px 6px; } #nav-search input[type="text"] { width: 110px; padding: 5px 0 0 5px; border: 0; } #nav-search .button {position: absolute; right: 5px; top: 4px; width: 31px; height: 24px; background: url(/images/site/header.png) 0 -387px no-repeat; padding: 0; } #nav-search .button-wrap { display: none; } #nav-request .button { display: block; padding: 0; width: 84px; height: 32px; background: url(/images/site/header.png) 0 -261px no-repeat; } #nav-request .button:hover {background-position: -84px -261px; } #nav-representative .button { display: block; padding: 0; width: 147px; height: 32px; background: url(/images/site/header.png) 0 -303px no-repeat; } #nav-representative .button:hover {background-position: -147px -303px; } #nav-main { position: absolute; top: 111px; left: 35px; overflow: visible; } #nav-main li { float: left; overflow: visible; } #nav-main .button { display: block; padding: 0; height: 40px; background: url(/images/site/header.png) 0 -160px no-repeat;} #nav-main .button-wrap { display: none; } #nav-about .button { width: 92px; background-position: 0 -160px; } #nav-team-sports .button { width: 71px; background-position: -92px -160px; } #nav-landscaping .button { width: 126px; background-position: -163px -160px; } #nav-golf .button { width: 117px; background-position: -289px -160px; } #nav-playground .button { width: 125px; background-position: -406px -160px; } #nav-pets .button { width: 119px; background-position: -531px -160px; } #nav-airport .button { width: 155px; background-position: -650px -160px; } #nav-media .button { width: 85px; background-position: -805px -160px; } #nav-about.nav-active .button { background-position: 0 -210px; } #nav-team-sports.nav-active .button { background-position: -92px -210px; } #nav-landscaping.nav-active .button { background-position: -163px -210px; } #nav-golf.nav-active .button { background-position: -289px -210px; } #nav-playground.nav-active .button { background-position: -406px -210px; } #nav-pets.nav-active .button { background-position: -531px -210px; } #nav-airport.nav-active .button { background-position: -650px -210px; } #nav-media.nav-active .button { background-position: -805px -210px; } #nav-main .nav-drop { display: none; padding: 15px 20px 10px; background: #FFF; border: 1px solid #bcc0c6; border-top: none; } #nav-main .nav-drop-wrap { overflow: hidden; } #nav-main .nav-active { position: relative; } #nav-main .nav-active .nav-drop { display: block; position: absolute; } #nav-main .nav-drop td { white-space: nowrap; } #nav-main .nav-drop td.col-1 { padding-right: 20px; border-right: 1px dotted #CCC; } #nav-main .nav-drop td.col-2 { padding-left: 20px; white-space:nowrap; } #nav-main .nav-drop td.col-3 { padding:0px 9px; width:117px; white-space:nowrap; } #nav-main .nav-drop dl { padding-top: 10px; } #nav-main .nav-drop dl:first-child { padding: 0; } #nav-main .nav-drop dt { font-weight: bold; } #nav-main .nav-drop dd { margin: 5px 0; } #nav-main .nav-drop a { display: inline; height: auto; background: none; } #nav-playground .nav-drop, #nav-pets .nav-drop, #nav-airport .nav-drop { right: -1px; } #nav-media .nav-drop { right: 0; } .ctnr-head, .ctnr-body, .ctnr-foot { height: 1%; background: url(/images/site/container.png) no-repeat; } .ctnr-head { background-position: -960px 0; height: 60px; } .ctnr-body { background-position: -1920px 0; background-repeat: repeat-y; padding: 0 35px; } .ctnr-foot { background-position: -2880px bottom; height: 35px; } /* #site-foot .ctnr-body { position: relative; } */ #foot-links { float: left; padding-bottom: 10px; } #foot-links .foot-links { float: left; width: 215px; margin-left: 10px; } #foot-links h5 { margin-top: -35px; font-size: 13px; font-weight: bold; height: 23px; border-left: 1px solid #FFF; padding: 12px 10px 0; margin-bottom: 10px; } #foot-links .foot-links ul { padding: 0 10px; border-left: 1px solid #DDC; } #foot-links .foot-links:first-child { margin-left: 0; } #foot-links .foot-links:first-child h5, #foot-links .foot-links:first-child ul { border: none; } #foot-links .foot-links li { padding: 3px 0; } #foot-links .rss { background: url(/images/site/rss-small.png) top right no-repeat; padding-right: 13px; } #foot-logos { border-top: 1px solid #DDC; overflow: hidden; float: none; clear: both; padding: 10px 10px 0; text-align: center; } /*/////////////////////////////////////////////////// // // TEMPLATES - 890 / 290, 290, 290 / 215, 665 // ///////////////////////////////////////////////////*/ #template-landing { overflow: hidden; } #template-landing #spot-1 { float: none; padding-bottom: 10px; } #template-landing #spot-2, #template-landing #spot-3, #template-landing #spot-4 { width: 288px; background: #e9e9e9; border: 1px solid #bcc0c6; margin-right: 10px; float: left; } #template-landing #spot-4 { margin-right: 0; } #template-landing .link-group { padding: 10px; } #template-landing .link-group h3 { color: #000; } #template-landing .link-group-links { border-top: 1px solid #C0C0A4; background: #DDDDCC; padding: 6px 10px; font-size: 12px; overflow: hidden; } #template-landing .link-group-links .col-1 { float: left; width: 50%; margin-right: 10px; } #template-landing .link-group-links .col-2 { float: left; } #template-landing .link-group-links a, #template-landing .link-group-links a:hover { color: #000; } #template-landing .link-group-links li { padding: 5px 0; } #template-landing .featured-ctnt { padding: 10px; } #template-landing .featured-ctnt h2 { font-size: 16px; font-weight: bold; font-style: normal; margin-bottom: 5px; } #template-landing .featured-ctnt img { max-height: 100px; max-width: 268px; margin-bottom: 10px; } #template-landing .featured-ctnt-summary { line-height: 1.4; } #template-2col { overflow: hidden; padding-top: 10px; } #template-2col .col-sidebar { border: 1px solid #bcc0c6; background: #e9e9e9; width: 213px; float: left; padding-bottom: 10px; margin-right: 10px; } #template-2col .col-main { width: 645px; padding: 0 10px 20px; float: left; } .breadcrumb { overflow: hidden; padding: 10px 0 0; } .breadcrumb li { float: left; } .breadcrumb li.separator { padding-left: 23px; background: url(/images/site/li-breadcrumb.png) 9px center no-repeat; } .breadcrumb a { color: #03467e; } .social { float: right; padding: 7px 0 0; } .section { padding-top: 10px; font-size: 13px; line-height: 1.2; float: none; clear: both; } .section .masthead { margin-bottom: 20px; } .section a { color: #98002E; text-decoration: underline; } .section a:hover { text-decoration: none; } .section h1 a, .section h3 a, .section h4 a { color: #03467e; text-decoration: none; } .section h2 a, .section h5 a, .section h6 a { color: #000; text-decoration: none;} .section h1 a:hover, .section h2 a:hover, .section h3 a:hover, .section h4 a:hover, .section h5 a:hover, .section h6 a:hover { color: #98002E; text-decoration: underline; } .section ul { margin: 0 0 10px 20px; list-style: circle; } .section ol { margin: 0 0 10px 20px; list-style: decimal; } .section li { margin: 5px 10px } .section ul.check, .section ol.numbers { list-style: none; margin: 0 0 10px 10px; } .section ul.check li { margin: 6px 0; padding: 1px 10px 2px 25px; background: url(/images/site/li-check.png) no-repeat; } .section ol.numbers li { margin: 6px 0; padding: 3px 10px 3px 25px; } h1 a.rss { display: inline-block; width: 20px; height: 20px; background: url(/images/site/rss-large.png) no-repeat; } h1 a.rss span { display: none; } .myth { color:#98002E; font-size: 1.6em; font-weight: bold; padding-right:10px; text-align: right; letter-spacing:0.02em } .fact { color:#03467e; font-size: 1.6em; font-weight: bold; padding-right:10px; text-align: right; letter-spacing:0.04em } .display { background: #e9e9e9; padding: 5px 10px; } .display span { margin: 0 5px; font-size: 11px; } .item { border-top: 1px solid #bcc0c6; padding: 15px 0; overflow: hidden; } .item h3 { margin: 5px 0 3px;} .item img { float: left; margin-right: 15px; } .item p .button { margin-top: 10px; } .info { color: #666; font-weight: 12px; font-style: italic; } .more { font-style: italic; } .result { margin-left: 5px; background: #98002E; padding: 2px 3px 1px; vertical-align: top; color: #FFF; font-size: 9px; font-weight: normal; } .no-results { padding: 15px 0; font-size: 13px; } .no-results .term { font-weight: bold; font-style: italic; } .pages h3 { margin-top: 20px; } #contact-reminder { margin-top: 30px; } #contact-reminder .col-1, #contact-reminder .col-2 { float: left; width: 290px; border: 1px solid #bcc0c6; background: #e9e9e9; padding: 10px;} #contact-reminder .col-1 { margin-right: 20px; } #contact-reminder h4 { color: #000; margin-bottom: 5px; } /*/////////////////////////////////////////////////// // // SAVINGS CALCULATOR (HOMEPAGE) // ///////////////////////////////////////////////////*/ #savings { background: url(/images/site/savings-bg.png) right 150px no-repeat; } #savings-title { float: left; font-weight: bold; font-size: 16px; padding: 10px; background: url(/images/site/savings-title.png) right 150px no-repeat; } #savings-yearly { float: none; clear: both; } #savings-year-value { padding: 0 10px; font-size: 26px; font-weight: bold; vertical-align: middle; } #savings-year-unit { font-size: 10px; vertical-align: middle; } #savings-total { padding: 10px; font-size: 12px; font-weight: bold; color: #665; width: 270px; } #savings-nav { overflow: hidden; } #savings-nav li { float: left; text-align: center; } #savings-nav a { display: block; height: 40px; background: url(/images/site/savings-nav.png) no-repeat; } #savings-nav span { display: none; } #savings-nav #savings-water { width: 71px; background-position: 0 0; } #savings-nav #savings-pesticides { width: 73px; background-position: -71px 0; } #savings-nav #savings-carbon { width: 72px; background-position: -144px 0; } #savings-nav #savings-tires { width: 72px; background-position: -216px 0; } #savings.water { background-position: right 0; } #savings.pesticides { background-position: right -150px; } #savings.carbon { background-position: right -300px; } #savings.tires { background-position: right -450px; } #savings.water #savings-title { background-position: right 7px; padding-right: 18px; } #savings.pesticides #savings-title { background-position: right -143px; padding-right: 24px; } #savings.carbon #savings-title { background-position: right -294px; padding-right: 34px; } #savings.tires #savings-title { background-position: right -442px; padding-right: 21px; } #savings.water #savings-yearly { color: #06C; } #savings.pesticides #savings-yearly { color: olive; } #savings.carbon #savings-yearly { color: purple; } #savings.tires #savings-yearly { color: gray; } #savings.water #savings-water { background-position: 0 -40px; } #savings.pesticides #savings-pesticides { background-position: -71px -40px; } #savings.carbon #savings-carbon { background-position: -144px -40px; } #savings.tires #savings-tires { background-position: -216px -40px; } /*/////////////////////////////////////////////////// // // SPORTS NAV // ///////////////////////////////////////////////////*/ #sports-nav { overflow: hidden; height: 50px; margin: 10px 0; } #sports-nav li { float: left; margin-left: 10px; } #sports-nav li:first-child { margin-left: 0; } #sports-nav a { display: block; width: 140px; height: 50px; background: url(/images/site/sports-nav.png) no-repeat; } #sports-nav span { display: none; } #sports-nav #sports-nav-football { background-position: 0 0; } #sports-nav #sports-nav-soccer { background-position: 0 -50px; } #sports-nav #sports-nav-baseball { background-position: 0 -100px; } #sports-nav #sports-nav-lacrosse { background-position: 0 -150px; } #sports-nav #sports-nav-rugby { background-position: 0 -200px; } #sports-nav #sports-nav-field-hockey { background-position: 0 -250px; } /*/////////////////////////////////////////////////// // // SEARCH // ///////////////////////////////////////////////////*/ #search-tabs { padding: 10px 10px 0; background: url(/images/site/search-tabs.png) bottom repeat-x; } #search-tabs ul { list-style: none; padding: 0; margin: 0; overflow: hidden; } #search-tabs li { float: left; margin: 0 5px; } #search-tabs li a { display: block; text-align: center; width: 100px; padding: 5px 0; background: #DDC; text-decoration: none; color: #665; border: 1px solid #bcc0c6; } #search-tabs li a.selected { background: #FFF; color: #000; border-bottom: 1px solid #FFF; } .search-group { padding-top: 10px; } .search-group .item:first-child { border-top: none; } .search-more { border-top: 1px solid #bcc0c6; padding-top: 20px; } #installations-refine.display { padding: 5px; } #installations-refine h4 { padding: 5px; } #installations-refine td { padding:5px 5px 0 5px; width: 160px; } #installations-refine td.col-4 { hite-space: nowrap; vertical-align: middle; text-align: center; } #installations-refine label { font-size: 10px; font-weight: bold; display: block; } #installations-refine div { padding-bottom: 10px; } #installations-refine select { width: 160px; } #installations-table { font-size: 11px; text-align: left; margin-top: 30px; } #installations-table th { padding: 7px 5px 5px; background: #DDC; border-bottom: 1px solid #bcc0c6; white-space: nowrap; } #installations-table td { vertical-align: middle; padding: 10px 5px; } #installations-table .col-1 { text-align: center; padding-left: 10px; } #installations-table td { border-right: 1px solid #DDC; } #installations-table .col-6 { text-align: center; padding-right: 10px; border-right: none; } #installations-table .even td { background: #e9e9e9; border-top: 1px solid #bcc0c6; border-bottom: 1px solid #bcc0c6; } /*/////////////////////////////////////////////////// // // ROTATING PROMOTIONS // ///////////////////////////////////////////////////*/ #promotions { width: 890px; height: 310px; background: #000 url(/images/site/promotions.png) no-repeat; position: relative; } #promotions td { vertical-align: middle; } #promotions-display { width: 580px; height: 290px; overflow: hidden; padding: 10px 0 10px 10px; } #promotions-display .promotion { width: 578px; height: 288px; overflow: hidden; position: relative; border: 1px solid #333; display: none; } #promotions-display .promotion-mask { background: url(/images/site/promotions-display-mask.png); position: absolute; bottom: 0; width: 100% } #promotions-display td.col-1 { padding: 10px; width: 70% } #promotions-display td.col-2 { padding: 10px; text-align: center; } #promotions-display .promotion-headline { padding-bottom: 5px; font-size: 24px; font-weight: bold; color: #FFF; } #promotions-display .promotion-body { font-size: 13px; color: #DDD; } #promotions-nav { width: 300px; height: 310px; position: absolute; top: 0; right: 0; overflow: hidden; } #promotions-nav .promotion { width: 300px; height: 75px; overflow: hidden; position: relative; cursor: pointer; } #promotions-nav .promotion-image { position: absolute; right: 10px; top: 10px; } #promotions-nav .promotion-mask { width: 300px; height: 75px; background: url(/images/site/promotions-nav-mask.png) 0 0 no-repeat; position: absolute; color: #666; } #promotions-nav .promotion-headline { font-size: 14px; font-weight: bold; } #promotions-nav td { padding: 12px 110px 0 21px;} #promotions-nav .promotion-hover .promotion-mask { background-position: 0 -100px; color: #FFF; } #promotions-nav .promotion-active .promotion-mask { background-position: 0 -200px; color: #FFF } /*/////////////////////////////////////////////////// // // REQUEST INFORMATION // ///////////////////////////////////////////////////*/ #request table { width: 100%; } #request textarea { width: 90%; height: 150px; } #request-submit { padding: 20px 10px; border-top: 1px solid #DDC; } #request td { padding: 10px; vertical-align: middle; } #request td.col-1 { width: 30%; } .request-even td { background: #e9e9e9; } .request-error td.col-1, #request-error-message { color: #98002E; font-weight: bold; } #request-honeypot { display: none; } /* trick bots for simple captcha */ /*/////////////////////////////////////////////////// // // FIND A REPRESENTATIVE // ///////////////////////////////////////////////////*/ #distributors_filter { background: #e9e9e9; padding: 5px 10px; } #distributors-start { padding: 30px 20px; } #distributors_loading { background: url(/images/site/loading.gif) center center no-repeat; height: 200px; } #distributors_list table { margin-top: 20px; width: 100%; font-size: 12px; line-height: 1.4; } #distributors_list th, #distributors_list td { padding: 5px 10px; text-align: left; } #distributors_list th { background: #DDC; border-bottom: 1px solid #bcc0c6; font-weight: normal; font-size: 11px; } #distributors_list tr.odd td { background: #e9e9e9; } #distributors_list .col-1, #distributors_list .col-2 { width: 25%; } #distributors_list .col-3 { width: 20%; } .distributors-company, .distributors-contact { font-size: 13px; font-weight: bold; } /*/////////////////////////////////////////////////// // // ADVANCED SEARCH // ///////////////////////////////////////////////////*/ #advanced-search { background: #e9e9e9; padding: 5px 10px; } #advanced-search input { width: 120px; } #advanced-search label, #advanced-search input, #advanced-search select, #advanced-search .button { vertical-align: middle; margin-right: 5px; } /*/////////////////////////////////////////////////// // // SIDEBAR // ///////////////////////////////////////////////////*/ .sidebar-group { padding: 10px; } .sidebar-group h3 { color: #000; margin: 0;} .links { border-top: 1px solid #C0C0A4; background: #fff; padding: 6px 0; font-size: 12px; } .links a, .links a:hover { color: #000; } .links li { padding: 5px 20px 3px 10px; } .links li.selected { background: #03467e url(/images/site/li-arrow.png) right center no-repeat; } .links li.selected a { font-weight: bold; color: #FFF; text-decoration: none; } /*/////////////////////////////////////////////////// // // BUTTONS // ///////////////////////////////////////////////////*/ /* buttons - base */ .button, .button-wrap { background: url(/images/site/sprite.png) no-repeat; overflow: hidden; cursor: pointer; line-height: 1 !important; } .button, .button.small, .button.large { color: #000 !important; text-decoration: none !important; font-weight: bold; display: -moz-inline-box; display: inline-block; padding-top: 0; padding-bottom: 0; padding-left: 0; } .button .button-wrap, .button.small .button-wrap, .button.large .button-wrap { display: block; padding-right: 0; padding-bottom: 0; } /* buttons - default */ .button, .button .button-wrap { height: 24px; } .button .button-wrap { font-size: 12px; padding-top: 7px; padding-left: 10px; background-position: left -230px; } .button { padding-right: 10px; background-position: right -120px; } .button:hover { background-position: right -144px; } .button:hover .button-wrap { background-position: left -254px; } .button:active { background-position: right -168px; } .button:active .button-wrap { background-position: left -278px; } .button.arrow { padding-right: 20px; background-position: right -192px; } .button.arrow:hover { background-position: right -216px; } .button.arrow:active { background-position: right -240px; } /* buttons - small */ .button.small, .button.small .button-wrap { height: 20px; } .button.small .button-wrap { font-size: 10px; padding-top: 6px; padding-left: 7px; background-position: left -170px; } .button.small { padding-right: 7px; background-position: right 0px; } .button.small:hover { background-position: right -20px; } .button.small:hover .button-wrap { background-position: left -190px; } .button.small:active { background-position: right -40px; } .button.small:active .button-wrap { background-position: left -210px; } .button.small.arrow { padding-right: 15px; background-position: right -60px; } .button.small.arrow:hover { background-position: right -80px; } .button.small.arrow:active { background-position: right -100px; } /* buttons - large */ .button.large, .button.large .button-wrap { height: 32px; } .button.large .button-wrap { font-size: 14px; padding-top: 11px; padding-left: 12px; background-position: left -302px; } .button.large { padding-right: 12px; background-position: right -264px; } .button.large:hover { background-position: right -296px; } .button.large:hover .button-wrap { background-position: left -334px; } .button.large:active { background-position: right -328px; } .button.large:active .button-wrap { background-position: left -366px; } .button.large.arrow { padding-right: 30px; background-position: right -360px; } .button.large.arrow:hover { background-position: right -392px; } .button.large.arrow:active { background-position: right -424px; } /*/////////////////////////////////////////////////// // // PAGINATION // ///////////////////////////////////////////////////*/ .pagination { border-top: 1px solid #bcc0c6; padding: 20px 0 0; line-height: 1; } .pagination .pages { margin-right: 10px; padding-top: 6px; display: inline-block; overflow: hidden; } .pagination a, .pagination strong { vertical-align: top !important; display: inline-block; overflow: hidden;} .pagination a { height: 22px; background: url(/images/site/sprite.png) -42px -110px no-repeat; border: 1px solid #B28E12; text-decoration: none; color: #000; } .pagination a:hover { background: #FA7A02; border-color: #AF5601; } .pagination strong { padding: 6px 7px 0; _padding: 5px 7px 0; } .pagination a span { display: inline-block; padding: 5px 7px 0; _padding: 4px 7px 0; } .pagination a.first, .pagination a.previous, .pagination a.next, .pagination a.last { width: 24px; height: 24px; background: url(/images/site/sprite.png) no-repeat; border: none; } .pagination a.first span, .pagination a.previous span, .pagination a.next span, .pagination a.last span { display: none; } .pagination a.first { background-position: -42px 0; margin-right: 5px; } .pagination a.previous { background-position: -92px 0;} .pagination a.next { background-position: -116px 0;} .pagination a.last { background-position: -67px 0; margin-left: 5px; } .pagination a.first:hover { background-position: -42px -25px; } .pagination a.previous:hover { background-position: -92px -25px;} .pagination a.next:hover { background-position: -116px -25px;} .pagination a.last:hover { background-position: -67px -25px; } .pagination a.first:active { background-position: -42px -50px; } .pagination a.previous:active { background-position: -92px -50px;} .pagination a.next:active { background-position: -116px -50px;} .pagination a.last:active { background-position: -67px -50px; } .pagination a.first.disabled { background-position: -42px -75px; } .pagination a.previous.disabled { background-position: -92px -75px; } .pagination a.next.disabled { background-position: -116px -75px; } .pagination a.last.disabled { background-position: -67px -75px; } /*/////////////////////////////////////////////////// // // CAROUSEL // ///////////////////////////////////////////////////*/ .carousel { width: 890px; margin-top: 20px; position: relative; float: none; } .carousel h3 { position: absolute; top: 0; left: 0; color: #000; margin: 0; padding: 0; } .carousel .button, .carousel .button-wrap, .carousel-pagination a { background: url(/images/site/sprite.png) no-repeat;} .carousel-content { position: relative; padding-top: 36px; } .carousel-holder { height: 94px; width: 840px; margin: auto; position: relative; overflow: hidden; } .carousel-holder-wrap { position: absolute; top: 0px; left: 0px; width: 100000px; overflow: hidden; } .carousel-item { float: left; width: 120px; padding: 0 10px; text-align: center; } .carousel-item img { max-height: 80px; max-width: 120px; } .carousel-frame { height: 73px; background: url(/images/site/carousel-frame.png) center no-repeat; padding-top: 7px; } .carousel .button { width: 24px; height: 24px; padding: 0; margin: 0; } .carousel .button-wrap { display: none; } .carousel-previous { position: absolute; top: 64px; left: 0; } .carousel-next { position: absolute; top: 64px; right: 0; } .carousel-previous .button { background-position: -42px 0; } .carousel-next .button { background-position: -67px 0; } .carousel-previous .button:hover { background-position: -42px -25px; } .carousel-next .button:hover { background-position: -67px -25px; } .carousel-previous.disabled .button, .carousel-previous.disabled .button:hover { background-position: -42px -75px; cursor: default; } .carousel-next.disabled .button, .carousel-next.disabled .button:hover { background-position: -67px -75px; cursor: default; } .carousel-pagination { position: absolute; text-align: center; top: 5px; left: 0; width: 100%; } .carousel-pagination a { display: inline-block; background-position: 0 -120px; width: 10px; height: 10px; margin: 0 2px 3px; } .carousel-pagination a.selected { background-position: -10px -120px; } .carousel-pagination span { display: none; } /*/////////////////////////////////////////////////// // // GALLERY // ///////////////////////////////////////////////////*/ .gallery2 { /*width: 890px;*/ margin-top: 20px; position: relative; float: none; } .gallery2 h3 { position: absolute; top: 0; left: 0; color: #000; margin: 0; padding: 0; } .gallery2 .button, .gallery2 .button-wrap, .gallery2-pagination a { background: url(/images/site/sprite.png) no-repeat;} .gallery2-content { position: relative; padding-top: 36px; } .gallery2-holder { height: 410px; /*width: 840px;*/ margin: auto; position: relative; overflow: hidden; } .gallery2-holder-wrap { position: absolute; top: 0px; left: 0px; width: 100000px; overflow: hidden; } ul.gallery2-holder-wrap { margin: 0 0 10px 30px; list-style-type:none;} .gallery2-holder-wrap li { margin:0px 50px; height:380px; background:#E9E9E9 none repeat scroll 0 0; border:1px solid #BCC0C6; padding:10px;} .gallery2-item { float: left; /*width: 120px;*/ padding: 0 10px; text-align: center; } .gallery2-item img { width: 458px; } .gallery2-frame {/* height: 73px;*/ background: url(/images/site/carousel-frame.png) center no-repeat; padding-top: 7px; } .gallery2 .button { width: 24px; height: 24px; padding: 0; margin: 0; } .gallery2 .button-wrap { display: none; } .gallery2-previous { position: absolute; top: 50%; left: 0; } .gallery2-next { position: absolute; top: 50%; right: 0; } .gallery2-previous .button { background-position: -42px 0; } .gallery2-next .button { background-position: -67px 0; } .gallery2-previous .button:hover { background-position: -42px -25px; } .gallery2-next .button:hover { background-position: -67px -25px; } .gallery2-previous.disabled .button, .gallery2-previous.disabled .button:hover { background-position: -42px -75px; cursor: default; } .gallery2-next.disabled .button, .gallery2-next.disabled .button:hover { background-position: -67px -75px; cursor: default; } .gallery2-pagination { position: absolute; text-align: center; top: 5px; left: 0; width: 100%; display:none;} .gallery2-pagination a { display: inline-block; background-position: 0 -120px; width: 10px; height: 10px; margin: 0 2px 3px; } .gallery2-pagination a.selected { background-position: -10px -120px; } .gallery2-pagination span { display: none; } .gallery2 .gallery2-title{ bottom:10px; font-size:14px; position:absolute; text-align:center; width:460px; color:#03467E; } /*/////////////////////////////////////////////////// // // MEDIA CENTER // ///////////////////////////////////////////////////*/ .media-category { overflow: hidden; } .media-category h3 { margin: 10px 0 10px; font-size: 18px; border-bottom: 1px solid #bcc0c6; } .media-item { float: left; width: 48%; margin-bottom: 20px; } .media-item.odd { padding-right: 20px;} .media-item img { float: left; margin-right: 10px; } .media-item .button { margin-top: 5px; } .media-iframe { overflow: hidden; width: 480px; height: 385px; } .media-description { margin-top: 30px; } .media-modal { background: #000; padding: 0; margin: 0; } .media-close { position: absolute; top: -18px; right: -18px; width: 32px; height: 32px; background: url(/images/site/modal-close.png) no-repeat; cursor: pointer; } /*/////////////////////////////////////////////////// // // INSTALLATION GALLERY // ///////////////////////////////////////////////////*/ #installations-header { overflow: hidden; } #installations-header table { width: 100%; } #installations-header td { vertical-align: middle; } #installations-header td.col-1 { width: 100% } #installations-logo { width: 130px; } #installations-gallery { background: #e9e9e9; border: 1px solid #bcc0c6; padding: 10px; margin-top: 10px; overflow: hidden; position: relative; } #installations-gallery ul { list-style: none; margin: 0; } #installations-gallery li { margin: 0; } #installations-gallery img { vertical-align: top; } #installations-badge { position: absolute; width: 50px; height: 60px; top: 16px; left: 374px; } #installations-badge.fifa-1-star { background: url(/images/site/badge-fifa.png) 0 0 no-repeat; } #installations-badge.fifa-2-star { background: url(/images/site/badge-fifa.png) 0 -60px no-repeat; } #installations-images { width: 420px; float: left; margin-right: 10px; } #installations-sidebar { width: 193px; float: left; } #installations-sidebar h4 { font-size: 14px; color: #000; } #installations-sidebar ul { border-top: 1px solid #C0C0A4; background: #DDDDCC; padding: 10px 10px; } #installations-about { padding: 10px 0 20px; } #installations-about ul { padding-top: 5px; } #installations-about li { padding: 5px 0 0; } #installations-thumbs ul { overflow: hidden; padding-right: 0; padding-bottom: 5px; } #installations-thumbs li { float: left; margin: 0 5px 5px 0; cursor: pointer; } #installations-description { margin-top: 20px; } #installations-testimonials { margin-top: 20px; } .quote { background: url(/images/site/quotes.png) left top no-repeat; font-size: 13px; font-style: italic; margin: 20px 0; overflow: hidden; } .quote blockquote { padding: 10px 0 10px 15px; background: url(/images/site/quotes.png) right bottom no-repeat; } .quote-name { float: right; clear: both; } .quote-title { font-size: 11px; float: right; clear: both; } /*/////////////////////////////////////////////////// // // EXPERIMENTAL STUFF // ///////////////////////////////////////////////////*/ #nav-main .nav-active .nav-drop { -webkit-box-shadow: 5px 10px 10px #333; -moz-box-shadow: 5px 10px 10px #333; box-shadow: 5px 10px 10px #333; } /*/////////////////////////////////////////////////// // // jqModal // ///////////////////////////////////////////////////*/ .jqmWindow { display: none; position: fixed; top: 10%; left: 50%; margin-left: -240px; width: 480px; background-color: #000; color: #333; border: 1px solid #CCC; padding: 10px; } .jqmOverlay { background-color: #000; } /*/////////////////////////////////////////////////// // // changes by DYNAMO // ///////////////////////////////////////////////////*/ .float-l{ float:left; } .float-r{ float:right; } .clear{ clear:both; } .section-l{ float:left; width:234px; } .section-r{ float:right; width:400px; } tr.header td { border-bottom:1px dashed #021A32; color:#021A32; font-family:Verdana; font-size:11px; font-size-adjust:none; font-stretch:normal; font-style:normal; font-variant:normal; font-weight:bold; line-height:normal; background:white; margin:0; text-transform:uppercase; padding:20px 0 5px; } .carousel{ display: block; } .gallery2{ display: block; } table.table_installations tr td{ padding:5px 0; } table.table_installations tr.grey td{ background:#eeeeee; } #template-landing #spot-5 { width: 288px; height:126px; background: #e9e9e9; border: 1px solid #bcc0c6; margin-right: 0px; float: left; } #template-landing #spot-5 h2 { border-bottom:1px solid #cccccc; background: url(/images/site/rss-small.png) top right no-repeat; } #template-landing #spot-5 .featured-ctnt-summary { border-top: 0px solid #bcc0c6; padding: 5px 0; overflow: hidden; } #template-landing #spot-5 ul { height:50px; } #template-landing #spot-5 li:hover{ background:#cccccc;} #template-landing #spot-5 a:hover{ color:black; text-decoration:none; } #template-landing #spot-5 a.more{ color:#999999; float:right; } #template-landing #spot-5 a.more:hover{ color:999999; text-decoration:underline; } #template-landing #spot-5 .float-l{ float:left;} table.table_grey{ border:1px solid #cccccc; font-size:12px; width:100%; } table.table_grey td.grey{ background:#e8f5ff; font-weight:bold; border:1px solid #666666; color:#03467E; } table.table_grey td{ padding:5px 10px; text-align:center; vertical-align:middle; } .red{ color:#C70202; } table.table_grey2 td{ padding:10px; text-align:left; vertical-align:middle; } #installations-description{ text-align:justify; } .form_architect label{ width:120px; display:block; float:left; } .form_architect .contactfield{ margin:10px 0; } .form_architect input{ /* border:1px solid #666666;*/ } .validation-advice { color: red; background: #fff url(images/alert.gif) no-repeat left center; padding-left: 22px; } table.table_search{ width:100%; } table.table_search td{ width:33%; } .color1{ display:block; border:1px solid #bebea1; padding:2px; background:#eeeee5; width:140px; float:left; font-size:12px; margin:0 10px 10px 0; text-align:right; font-size:10px; color:#333; } .color2{ display:block; width:140px; height:50px; margin:0 0 2px 0; }