/*--------------------------------------------------------------------------------------- Website: Just Driving Author: Bitmedia Created: October 2009 ---------------------------------------------------------------------------------------*/ @import "default.css"; html { height: 100%;} body { background: #bb2c2c; height: 100%; min-width: 949px;} /*--------------------------------------------------------------------------------------- Base Typography ---------------------------------------------------------------------------------------*/ /*------------------------------------ Links ------------------------------------*/ a:link, a:visited, a:active { color: #bf6464;} a:hover { color: #2f93c5;} /*------------------------------------ Type ------------------------------------*/ body { font: 62.5% arial, tahoma, arial, helvetica; color: #333;} #container, #footer { font-size: 1.2em; line-height: 1.4em; text-align: left;} p { padding: 0 0 1.4em 0;} /*------------------------------------ Headers ------------------------------------*/ h1 { font-size: 1.8em; padding-bottom: 13px; margin-bottom: 13px; border-bottom: 1px solid #999;} h2 { font-size: 1.5em; padding: .7em 0; } h3 { font-size: 1.4em; padding: 0 0 1em; line-height: 1.1em;} /*--------------------------------------------------------------------------------------- Layout ---------------------------------------------------------------------------------------*/ /*------------------------------------ Container ------------------------------------*/ #outerbackground { background: url('../images/outerbackground-red.jpg') repeat-x #f3f7fa; } #innerbackground { background: url('../images/innerbackground-red.jpg') no-repeat top center;} #container { width: 949px; margin: 0 auto; overflow: hidden;} #masthead { width: 100%; overflow: hidden;} img#logo { float: left;} img#mastheadImg { float: right;} #footerContainer { background: url('../images/footer.png') repeat-x;} #footer { width: 909px; padding: 10px 20px; margin: 0 auto; overflow: hidden; font-size: 1.1em; color: #fff; background: transparent;} #copyright { float: left; width: auto;} /*--------------------------------------------------------------------------------------- Content ---------------------------------------------------------------------------------------*/ /*------------------------------------ Common ------------------------------------*/ #instructorsearch { background: url('../images/instructorsearch.png') no-repeat; width:400px; height: 53px; padding: 12px 0 0 52px; color: #fff; font-weight: bold; float: none; margin: 50px 5px 0 0;} #instuctorsearchForm { font-weight: normal; padding-top: 3px;} #instuctorsearchForm .input { border-width:1px; border-color:#706b6f #e6eaeb #d4d4d4 #a2a4a1; padding: 2px 5px; vertical-align: middle; width: 190px;} #instuctorsearchForm .submit { margin: 0 0 0 7px; width: 71px; height: 23px; background: url('../images/search2.png') no-repeat; text-indent: -9999px; overflow: hidden; vertical-align: middle;} #instuctorsearchForm .submit:hover { background-position: bottom left;} body.fullpage #instructorsearch { float: right; margin: -10px 5px 0 0;} /*------------------------------------ Home Page ------------------------------------*/ #banner { margin-top: 5px; overflow: hidden; width: 949px; height: 245px; position: relative;} #banner .bannertext { position: absolute; top: 40px; right: 0; width: 545px; text-align: right; color: #fff;} #banner .bannertext h3 { background: url('../images/bannerh3.png') no-repeat; line-height: 52px; height: 52px; padding: 0 52px 0; font-size: 2.2em; margin-bottom: 15px;} #banner p { padding: 0 25px 0; font-size: 1.2em; line-height: 1.2em;} #banner a.findoutmore { background: url('../images/findoutmore.png') repeat-x; color: #fff; padding: 0 20px; height: 27px; line-height: 27px; display: inline-block; text-decoration: none; font-weight: bold; text-transform:uppercase; margin: 15px 25px 0 0;} #banner a.findoutmore:hover { background-position: bottom left;} body.fullpage #content { width: 899px; padding: 25px; background: url('../images/content-top.png') no-repeat #fff; margin-top: 5px;} p.highlight { font-size: 1.5em; font-family:Tahoma, Geneva, sans-serif; line-height: 1.3em; color: #000; float: left; margin-top: 15px; padding-top: 7px; border-top: 1px solid #999; width: 604px;} body.fullpage p.highlight { width: 425px; padding-top: 0; margin-top: 0; border-top: 0;} p.highlight span { color:#902222;} body.fullpage #features { overflow: hidden; margin-left: -32px; clear:both;} body.fullpage .feature { float: left; width: 267px; height: 165px; margin-left: 32px; padding: 6px 5px; background: url('../images/feature.png') no-repeat; position: relative;} body.fullpage .feature a span { position: absolute; bottom: 14px; left: 5px; width: 267px; display: block; color: #fff; font-size: 1.4em; background: url('../images/featurebg.png') repeat-x; height: 35px; line-height: 35px; text-align: center;} /*------------------------------------ Inner Pages ------------------------------------*/ /* Layout */ #content { width: 924px; padding: 0 0 25px 25px; overflow: hidden; background: url('../images/content-top.png') no-repeat #fff; margin-top: 5px;} #mainCol { float: left; width: 604px; padding-top: 25px;} #sideCol { float: right; width: 243px; padding: 10px 25px 0; background: url('../images/sidecol.jpg') no-repeat; min-height: 670px;} #sideCol h2 { line-height: 1.2em; border-bottom: 1px solid #74878b; margin-bottom: 10px; padding-bottom: 10px;} #innerbanner { width:604px; height: 156px; margin-bottom: 15px;} /* Lesson Form */ #lessonForm { overflow: hidden;} #lessonForm .formLeft { width: 100%;} #lessonForm .input, #lessonForm .textarea { border-width:1px; border-color:#706b6f #e6eaeb #d4d4d4 #a2a4a1; width: 214px !important; padding: 2px 5px; font-family:Arial, Helvetica, sans-serif; font-size: 14px; color: #333;} #lessonForm .textarea { height: 65px;} #lessonForm .submit { margin: 0; width: 71px; height: 23px; background: url('../images/send.png') no-repeat; text-indent: -9999px; overflow: hidden; float: left;} #lessonForm .submit:hover { background-position: bottom left;} /* Features */ #featuresInner { overflow: hidden; margin-left: -17px;} .feature { float: left; width: 277px; height: 165px; margin-left: 17px; padding: 6px 5px; background: url('../images/feature-inner.html') no-repeat;} /* Testimonials */ .testimonial { padding-bottom: 2.8em;} .testimonial .title { font-weight: bold;} .testimonial .abstract { margin-bottom: -1.4em;} /* Banner */ #innerbanner { position: relative; margin-bottom: 20px;} #innerbanner div.bannertext { position: absolute; top: 23px; right: 20px; width:235px; height: 133px; text-align: right;} #innerbanner div.bannertext h3 { color: #444; font-size: 2em; border-bottom: 1px solid #a7a7a7; padding: 0 0 12px 0; margin: 0 0 12px 0; } /*------------------------------------ FAQ ------------------------------------*/ #faq { padding-bottom: 1.4em;} #faq .question { padding-bottom: 3px;} #faq .question a { text-decoration: none; font-weight: bold; color: #333;} #faq .question a:hover { color: #2f93c5;} /*------------------------------------ News ------------------------------------*/ #news { padding-bottom: 1.4em;} #news .item { padding-bottom: 1.4em;} #news .title { font-weight: bold; font-size: 1.2em;} #news .abstract { } #news .link { } /*------------------------------------ Useful Links Page ------------------------------------*/ #usefullinks { padding-bottom: 2.8em;} #usefullinks h5 {font-size:1em; font-weight: bold; margin-top: 25px; } #usefullinks a { color: #2F93C5; line-height: 1.6em;} #usefullinks a:hover { color: #BF6464;} /*------------------------------------ Contact ------------------------------------*/ #contactform { overflow: hidden; padding-top: 1.4em;} #contactform .input, #contactform .textarea { width: 200px; padding: 3px 5px; font-family:Arial, Helvetica, sans-serif; font-size: 14px;} #contactform .textarea { height: 60px;} /*--------------------------------------------------------------------------------------- Navigation ---------------------------------------------------------------------------------------*/ /*------------------------------------ MainNav ------------------------------------*/ ul#mainNav { margin: 0; padding: 0; list-style: none; width: 100%;line-height: 1.0; } ul#mainNav li { margin: 0; padding: 0; float: left; display: inline; width: auto; position:relative;} ul#mainNav li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ } ul#mainNav li a { float: left; display: block; height: 46px; width: auto; background: url('../images/nav.png') no-repeat; text-indent: -9999px; position: relative; overflow: hidden; color: #fff;} ul#mainNav li.nav-home a { width: 76px; background-position: 0 0;} ul#mainNav li.nav-home a:hover { background-position: 0 -46px;} ul#mainNav li.nav-home a.selected { background-position: 0 -92px;} ul#mainNav li.nav-instructor a { width: 224px; background-position: -76px 0;} ul#mainNav li.nav-instructor a:hover { background-position: -76px -46px;} ul#mainNav li.nav-instructor a.selected { background-position: -76px -92px;} ul#mainNav li.nav-choose a { width: 153px; background-position: -300px 0;} ul#mainNav li.nav-choose a:hover { background-position: -300px -46px;} ul#mainNav li.nav-choose a.selected { background-position: -300px -92px;} ul#mainNav li.nav-training a { width: 154px; background-position: -453px 0;} ul#mainNav li.nav-training a:hover { background-position: -453px -46px;} ul#mainNav li.nav-training a.selected { background-position: -453px -92px;} ul#mainNav li.nav-testimonials a { width: 123px; background-position: -607px 0;} ul#mainNav li.nav-testimonials a:hover { background-position: -607px -46px;} ul#mainNav li.nav-testimonials a.selected { background-position: -607px -92px;} ul#mainNav li.nav-jobs a { width: 71px; background-position: -730px 0;} ul#mainNav li.nav-jobs a:hover { background-position: -730px -46px;} ul#mainNav li.nav-jobs a.selected { background-position: -730px -92px;} ul#mainNav li.nav-contact a { width: 121px; background-position: -801px 0;} ul#mainNav li.nav-contact a:hover { background-position: -801px -46px;} ul#mainNav li.nav-contact a.selected { background-position: -801px -92px;} ul#mainNav ul { background: url('../images/dropdownnav.png') repeat-x #af2929; border: 1px solid #7c1e1c; border-top: 0;} ul#mainNav ul li a { text-indent: 0; color: #fff; text-decoration: none; background: transparent; height: auto; padding: 10px 0 10px 25px; border-bottom: 1px solid #7c1e1c; font-weight: bold;} ul#mainNav ul li.last a { border: 0;} ul#mainNav ul li a:hover { background: url('../images/subnavhover.png');} /* Dropdown */ #mainNav ul { position:absolute; top:-999em; margin: 0; width: 10em; /* left offset of submenus need to match (see below) */ } #mainNav li:hover ul, #mainNav li.sfHover ul { left:0; top: 46px; /* match top ul list item height */ z-index: 99999; } ul#mainNav li:hover li ul, ul#mainNav li.sfHover li ul { top: -999em; } ul#mainNav li li:hover ul, ul#mainNav li li.sfHover ul { left: 10em; /* match ul width */ top: 0; } ul#mainNav li li:hover li ul, ul#mainNav li li.sfHover li ul { top: -999em; } ul#mainNav li li li:hover ul, ul#mainNav li li li.sfHover ul { left:10em; /* match ul width */ top: 0; } /*** arrows **/ #mainNav a.sf-with-ul { padding-right: 0; min-width:1px; /* trigger IE7 hasLayout so spans position accurately */ } .sf-sub-indicator { position:absolute; display: block; right:.75em; top:1.05em; /* IE6 only */ width:10px; height:10px; text-indent: -999em; overflow:hidden; background:url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */ } a > .sf-sub-indicator { /* give all except IE6 the correct values */ top:.8em; background-position: 0 -100px; /* use translucent arrow for modern browsers*/ } /* apply hovers to modern browsers */ a:focus > .sf-sub-indicator, a:hover > .sf-sub-indicator, a:active > .sf-sub-indicator, li:hover > a > .sf-sub-indicator, li.sfHover > a > .sf-sub-indicator { background-position: -10px -100px; /* arrow hovers for modern browsers*/ } /* point right for anchors in subs */ #mainNav ul .sf-sub-indicator { background-position: -10px 0; } #mainNav ul a > .sf-sub-indicator { background-position: 0 0; } /* apply hovers to modern browsers */ #mainNav ul a:focus > .sf-sub-indicator, #mainNav ul a:hover > .sf-sub-indicator, #mainNav ul a:active > .sf-sub-indicator, #mainNav ul li:hover > a > .sf-sub-indicator, #mainNav ul li.sfHover > a > .sf-sub-indicator { background-position: -10px 0; /* arrow hovers for modern browsers*/ } /*------------------------------------ MinorNav ------------------------------------*/ ul#minorNav { margin: 0; padding: 0; list-style: none; float: right; width: auto;} ul#minorNav li { margin: 0; padding: 0; float: left; width: auto; display: inline; margin: 0 7px 0 0; padding: 0 7px 0 0; background: url('../images/footerDiv.png') no-repeat center right;} ul#minorNav li.last { background: none; margin: 0; padding: 0;} ul#minorNav li a { float: left; color: #fff; width: auto; text-decoration: none; padding-bottom: 2px; background: transparent;} ul#minorNav li a:hover { border-bottom: 1px dotted #fff; padding-bottom: 1px;} ul#minorNav li a.currentPage { font-weight: bold; text-decoration: underline;} /*--------------------------------------------------------------------------------------- Misc. ---------------------------------------------------------------------------------------*/ /*------------------------------------ ErrorPage ------------------------------------*/ body#errorPage {} body#errorPage #content { margin-top: 45px;} body#errorPage #content p { padding: 100px 0; text-align: center;} /* Backlink */ .backLink { margin-top: 1.4em;} .backLink a { background: url('../images/back.png') no-repeat; center left; padding-left: 20px;}