/* Meyer's Browser Default Reset (http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/) -------------------------------------------------------------------------------------------------------------------------------*/ 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, 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-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } /* remember to define focus styles! */ :focus { outline: 0; } body { line-height: 1; color: black; background: white; } ol, ul { list-style: none; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } embed { z-index:1; } /* DEBUG -------------------------------------------------------------------------------------------------------------------------------*/ /* div { border-top: 1px solid red; }*/ /* Essential -------------------------------------------------------------------------------------------------------------------------------*/ body { background: #000; padding: 0 0 10px 0; font-size: .875em; font-family: arial, helvetica, sans-serif; } a { color:#369; text-decoration:none; } a:hover { color:#222; text-decoration:underline; } #container { width: 960px; margin: 0 auto; background: #101010 url(../_img/container_bg.jpg) no-repeat; border-bottom: 3px solid #101010;} /* Base Typography -------------------------------------------------------------------------------------------------------------------------------*/ h2 { text-align: right; background: #0f0f0f url(../_img/h2_gradient.gif) repeat-x; color: #fff; font-size: 1.1em; overflow: hidden; padding: 3px; } h2 strong { float: left; display: inline; margin: 10px 0 0 10px; } h2 em { padding: 0 10px 0 0; font-size: 0.7em; line-height: 2.7; } h2 em a { color: #666; } h2 em a:hover { color: #fff; text-decoration: none; } p { margin: 5px 10px 15px 10px; line-height: 1.1; font-size: 0.875em; } /* Header & Logo -------------------------------------------------------------------------------------------------------------------------------*/ #header { height: 118px; overflow:visible;} #logo { width: 246px; height: 66px; background: url(../_img/mcat_logo.gif) no-repeat; float: left; display: inline; margin: 23px 0 0 10px;} #logo h1 { } #logo h1 a { display: block; width: 246px; height: 66px; text-indent: -20000px; } #logo h1 a:hover { border: none; background: none; } #tagline { position:relative; top: 35px; left: 28px; display: block; float: left; width: 365px; height: 65px; color: #ffd025; font-size: 18px;} #subtagline { position: relative; top: 5px; left: 30px; width: 165px; height: 20px; color: #ffd025; font-size: 14px; padding: 0px; margin:0px;} #search { float: left; display: inline; margin: 35px 0 0 90px; width: 240px; } #search form { } #search form input.form-text { float: left; display: inline; margin: 0 10px 0 0;} #search form input.form-button { float: left; display: inline; } /* Top-Nav -------------------------------------------------------------------------------------------------------------------------------*/ #top-nav { width: 640px; float: left; display: inline; padding: 0 0 0 20px; overflow:visible; } #top-nav ul { font-size: 0.9em; overflow:visible; } #top-nav ul li { float: left; position: relative; z-index: 999; } #top-nav ul li a { display: block; float: left; color: #fff; padding: 6px 9px; text-decoration: none; } #top-nav ul li a:hover { color: #fc0; background: #171b23; } /* second-level lists */ #top-nav li ul { overflow:visible; position: absolute; background: #171b23; width: 150px; padding: 2px 2px 1px 2px; top: 25px; left: -999em; clear: left; text-transform: none; z-index: 999; } #top-nav li ul li { background-image: none; } #top-nav li ul a { display: block; font-size: 1em; width: 136px; padding: 7px; background: #333; color: #fff; border-bottom: 1px solid #101010; } #top-nav li ul a:hover { display: block; font-size: 1em; width: 136px; padding: 7px; background: #ccc; color: #fc0; } /* lists nested under hovered list items */ #top-nav li:hover ul, #top-nav li.sfhover ul { left: auto; } #top-nav li:hover a, #top-nav li.sfhover a { color: #fc0; background: #171b23; } #top-nav li:hover li a, #top-nav li.sfhover li a { background: #171b23; color: #fff; } #top-nav li:hover li a:hover, #top-nav li.sfhover li a:hover { color: #fff; background: #b5011a; } /* Content -------------------------------------------------------------------------------------------------------------------------------*/ #content { clear: both; width: 966px; float: left; display: inline; } #content.interior { background: url(../_img/interior_content_bg.gif) repeat-y; } #wide-left-column { width: 732px; background: #101010; float: left; display: inline;} /* Home-Content -------------------------------------------------------------------------------------------------------------------------------*/ #home-billboard { float: left; display: inline; border-top: 2px solid #171b23; padding: 1px 0; width: 730px; } #home-left { width: 190px; height:300px; float: left; display: inline; background:url(../_img/home_flash_bg.jpg) 0 30px no-repeat; } #home-left h2 { background:url(../_img/welcome_head.jpg) no-repeat; width:190px; height:30px; margin:0; padding:0; } #home-left h2 strong { display:none; margin:0; padding:0; } #home-left object { } #home-left ul { margin:40px 0 0 0; padding:0; } #home-left ul li { font-size:11px; font-weight:bold; display:block; float:left; clear:both; margin:0 0 2px 15px; padding:0; background:url(../_img/homenavbg.gif) left center no-repeat; } #home-left ul li a { display:block; padding:5px 0 5px 15px; color:#fff; } #home-right { width: 540px; float: left; display: inline; } #home-right img { display: block; } #home-banner { float: left; width: 728px; height: 90px; margin-top: 4px; margin-bottom: 4px;} #home-blocks { clear: both; padding: 1px 0 0 0; margin: 0; width: 730px;} #home-blocks div.home-block { width: 144px; float: left; display: inline; border-right: 2px solid #101010; } #home-blocks div.home-block a { } #home-blocks div.home-block img { overflow: hidden; border: none; margin: 0; padding: 0; } #home-blocks div.home-block h2 { float: left; display: inline; width: 144px; font-size: 0.9em; text-align: left; background: #101010 url(../_img/h2_blue_gradient.gif) repeat-x; margin: 0; padding: 0; } #home-blocks div.home-block h2 strong { display: block; font-weight: normal; /*margin-bottom: 7px; width: 124px;*/ margin: 0 7px 0 0; padding: 10px 7px 12px 7px; } #home-blocks div.home-block h2 strong a { background: url(../_img/h2_orange_arrow.gif) right center no-repeat; display: block; width: 130px; color: #fff; text-decoration: none; } #home-blocks div.home-block h2 strong a:hover { color: #fc0; } #home-blocks div.no-border { border-right: none; } /* Promotions -------------------------------------------------------------------------------------------------------------------------------*/ #promotions { border-top: 2px solid #b5011a; border-bottom: 2px solid #b5011a; padding: 1px 0 1px 0; float: left; display: inline; width: 730px; } #promotions a { width: auto !important; float: left; display: inline; margin: 0; padding: 0; overflow: hidden; border: none; } #promotions img { display: block; border: none; overflow: hidden; } #promotions img.border { border-right: 2px solid #101010; } /* Interior-Header -------------------------------------------------------------------------------------------------------------------------------*/ #interior-header { width: 730px; float: left; display: inline; border-top: 2px solid #171b23; padding: 1px 0; overflow: auto; background: #0f0f0f url(../_img/h2_gradient.gif) repeat-x; } #interior-header h2 { font-size: 1.1em; width: 190px; float: left; display: inline; text-align: left; color: #fc0; font-weight: bold; text-transform: uppercase; } #interior-header h2 strong { margin: 7px 10px 4px 10px; } /* Breadcrumbs -------------------------------------------------------------------------------------------------------------------------------*/ #breadcrumbs { float: left; display: inline; } #breadcrumbs p { margin: 0; padding: 10px 15px; line-height: 1; color: #666; font-size: 0.75em; } #breadcrumbs p a { color: #666; } #breadcrumbs p a:hover { color: #fc0; } #breadcrumbs p a.active { color: #999; text-decoration: none; } #breadcrumbs p span { margin: 0 6px; } /* Interior-Content -------------------------------------------------------------------------------------------------------------------------------*/ #interior-content { width: 730px; margin-right: 2px; float: left; display: inline; } /* Left-Column -------------------------------------------------------------------------------------------------------------------------------*/ #left-column { width: 190px; min-height: 292px; height: auto !important; height: 292px; float: left; display: inline; background: #ccc url(../_img/left_column_bg.jpg) no-repeat; } #left-column h2 { } #left-column h2 strong { } #left-column div.side-nav { } #left-column div.side-nav h3 { margin: 10px; font-size: 0.9em; font-weight: bold; border-bottom: 1px solid #999; padding-bottom: 4px; } #left-column div.side-nav dl { margin: 10px; border-bottom: 1px solid #999; padding-bottom:2px; } #left-column div.side-nav dl dt { font-size: 1em; font-weight: bold; margin-bottom: 10px; } #left-column div.side-nav dl dt a { font-size: 0.9em; font-weight: bold; margin-bottom: 10px; color:#000; text-decoration:none;} #left-column div.side-nav dl dt a:hover { font-size: 0.9em; font-weight: bold; margin-bottom: 10px; color:#000; text-decoration:underline; } #left-column div.side-nav dl dd { color: #46474c; font-size: 0.85em; margin: 0 0 5px 0; } #left-column div.side-nav dl dd a { color: #46474c; text-decoration: none; } #left-column div.side-nav dl dd a:hover { color: #000; text-decoration: underline; } /* Middle-Column -------------------------------------------------------------------------------------------------------------------------------*/ #middle-column { font-size:1em; color:#555; width: 540px; float: left; display: inline; margin: 0; padding: 0; background: #ccc url(../_img/middle_column_bg.gif) repeat-x; } #middle-column h3 { width: 520px; float: left; display: inline; font-size: 1.5em; color: #fff; margin: 10px 10px 1px 10px; border-bottom: 2px solid #933; background: #101010 url(../_img/h2_gradient.gif) repeat-x; } #middle-column h3 strong { float: left; margin: 8px 10px 4px 10px; } #middle-column img.wide-photo { margin: 0 10px; width:520px; height:200px; } #middle-column div.photo-block { width: 200px; float: right; display: inline; margin: 10px; } #middle-column div.photo-block img { width: 197px; border: 1px solid #fff; } #middle-column div.photo-block p { font-size: 0.725em; font-style: italic; margin: 5px; } #middle-column h4 { color: #111; font-size: 1.2em; font-weight: bold; margin: 10px 10px 5px 10px; } #middle-column p { color: #555; } #middle-column p strong { color:#333; font-weight:bold; } #middle-column ul { list-style:disc; margin:0 20px 10px 30px;} #middle-column ul li { color:#555; margin:0 0 5px 0; font-size:.9em; } #middle-column div { color:#555; font-size:1em; } #middle-column #video { margin: 10px; } /* Right-Column -------------------------------------------------------------------------------------------------------------------------------*/ #right-column { width: 228px; float: right; display: inline; background: url(../_img/right_column_bg.gif) 38px 135px no-repeat; margin-left: 5px;} #right-column div.block { clear: both; } /* Online-Tools -------------------------------------------------------------------------------------------------------------------------------*/ #online-tools { border-top: 2px solid #171b23; } #online-tools h2 { color: #b5011a; background: #0f0f0f url(../_img/h-onlinetools.jpg) no-repeat; } #online-tools h2 em { font-style:normal; } #online-tools h2 strong { display:none; } #online-tools div.block-content { } #online-tools div.block-content .hidden { display: none; } #online-tools div.block-content select { margin: 7px 10px 5px 10px; z-index: 0; } #online-tools div.block-content select option { } #online-tools div.block-content p { color: #fff; font-size: 0.825em; margin: 5px 10px 10px 10px; line-height: 1.2; } #online-tools div.block-content p a { color: #369; font-style: italic; } #online-tools div.block-content p a:hover { color: #fc0; text-decoration: none; } /* Latest-News -------------------------------------------------------------------------------------------------------------------------------*/ #latest-news { border-top: 2px solid #171b23; } #latest-news h2 { color: #525f7e; background: #0f0f0f url(../_img/h-latestnews.jpg) no-repeat; } #latest-news h2 strong { display:none; } #latest-news h2 a { color: #666; } #latest-news h2 a:hover { color: #fff; } #latest-news div.block-content { } #latest-news div.block-content h3 { margin: 0 10px; font-size: .9em; font-weight: bold; } #latest-news div.block-content h3 a { color: #999; } #latest-news div.block-content h3 a:hover { color: #fc0; text-decoration: none; } #latest-news div.block-content p { color: #999; font-size: 0.825em; } /* Do-Something -------------------------------------------------------------------------------------------------------------------------------*/ #do-something { } #do-something h2 { color: #525f7e; background: #0f0f0f url(../_img/h-dosomething.jpg) no-repeat; } #do-something h2 strong { display:none; } #do-something div.block-content { } #do-something div.block-content ul { font-size: 0.8em; padding: 5px 0; } #do-something div.block-content ul li { margin: 0 0 7px 30px; list-style-image: url(../_img/bullet_red_arrow.gif); } #do-something div.block-content ul li a { color: #ccc; } #do-something div.block-content ul li a:hover { color: #fc0; } /* Salesman-Locator -------------------------------------------------------------------------------------------------------------------------------*/ #salesman-locator { } #salesman-locator h2 { color: #525f7e; } #salesman-locator h2 strong { } #salesman-locator div.block-content { } #salesman-locator div.block-content form { padding: 5px 10px; } #salesman-locator div.block-content form input.form-text { width: 145px; float: left; display: inline; margin: 0 10px 7px 0; } #salesman-locator div.block-content form input.form-button { float: left; display: inline; } #salesman-locator div.block-content form select { width:150px; margin:-20px 0 5px 0; } #middle-full div.salesmen { display:inline; float:left; font-size:11px; height:auto; padding:5px 0 0 10px; width:260px; } #middle-full div.salesmen p { display:block; float:left; margin:0; width:150px; } #middle-full div.salesmen img { display:block; float:left; margin:0 5px 0 0; width:100px; } /* Locations -------------------------------------------------------------------------------------------------------------------------------*/ #locations { } #locations h2 { color: #525f7e; background: #0f0f0f url(../_img/h-ourlocations.jpg) no-repeat; } #locations h2 strong { display:none; } #locations div.block-content { } #locations div.block-content object { } /* Footer -------------------------------------------------------------------------------------------------------------------------------*/ #footer { width: 960px; border-top: 1px solid #000; border-bottom: 1px solid #000; background: #0f0f0f url(../_img/footer_bg.gif) repeat-x; overflow: auto; clear: both; } #footer ul { font: 0.75em arial, helvetica, sans-serif; color: #666; padding: 0 2px 9px 2px; line-height: normal; } #footer ul li { float: left; margin: 9px 0 7px 10px; } #footer ul li a { border-left: 1px solid #666; padding: 0 0 0 10px; color: #666; } #footer ul li a:hover { color: #fff; } #footer div#call-us { float: right; text-align: right; margin: 6px 10px 0 0; background: url(../_img/footer_call_us.gif) no-repeat; display: block; width: 241px; height: 30px; } #footer div#call-us span { display: block; width: 241px; height: 16px; text-indent: -10000px; display: none; } /* sIFR -------------------------------------------------------------------------------------------------------------------------------*/ /* These are standard sIFR styles... do not modify */ .sIFR-flash { visibility: visible !important; margin: 0; } .sIFR-replaced { visibility: visible !important; } span.sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden; } /* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */ .sIFR-flash + div[adblocktab=true] { display: none !important; } /* Salesman Locator -------------------------------------------------------------------------------------------------------------------------------*/ #middle-full { width: 540px; float: left; display: block; } #middle-full p.loc { float:left; clear:both; } #middle-full div {width:534px; height:70px; padding:3px; display:block; float:left;} #middle-full div div { font-size: 10px; } #middle-full div div img { width: 75px; height: 70px; } #middle-full div div.lBlock1 {width:75px; display:block; float:left; padding:0 3px 0 0;} #middle-full div div.lBlock2 {width:100px; display:block; float:left; padding:0 3px 0 0;} #middle-full div div.lBlock3 {width:140px; height:70px; display:block; float:left; padding:0 3px 0 0;} #middle-full div div.lBlock4 {width:20px; display:block; float:left; padding:0;} #middle-full form { float:left; display:block; margin:6px 0 3px 10px; padding:0px } #middle-full form input { float:left; display:block; margin:0 3px 0 0; padding:0; } .odd { background:#ddd; } #middle-full div div li.right {list-style:none; margin:0; padding:0; display:block; float:left; width:70px; } #middle-full div div li {list-style:none; margin:0; padding:0; } #middle-full div div ul {list-style:none; margin:0; padding:0;} /* forms ---------------------------------------------------------------------------------*/ .forms { clear:both; margin:15px 20px 0 30px;} .forms label { display:block; float:none; margin:18px 0 10px 0; font-weight:bold; font-size:.9em; color: black; } .forms input.text { width:250px; margin:0 0 0 0; font-size:0.9em;} .forms input.column{ width:200px; margin:2px 0 0 0; font-size:0.9em;} .forms select { width:230px; margin:0 0 0 0; font-weight:bold; font-size:0.9em;} .error { color: red; font-size:0.9em; height:15px; } .forms p.alert { font-weight:bold; color:#333; padding:20px; background:#fff; } .email{clear:both; padding:3px 0 0 0;} .forms span.sub-label { display: block; clear: left; font-weight:bold; font-size:0.9em; color:#853333; margin:0 0 6px 0; } .forms span.phone-hint { display: block; clear: left; font-weight:bold; font-size:0.9em; color:#853333; margin:0 0 6px 0; } .forms input.size1 { width:30px; } .forms input.size2 { width:40px; } .forms input.size3 { width:80px; } .forms input.size4 { width:200px; }