/* RESET */ * { margin: 0; padding: 0; } html, body { height: 100%; } body#red { font-size: 12px; font-family: Arial, sans-serif; color: #000; background: url(http://www.eastmidshire.com/images/bg.png) top center no-repeat #660000; } body#dark { font-size: 12px; font-family: Arial, sans-serif; color: #000; background: url(http://www.eastmidshire.com/images/bg2.jpg) no-repeat top center #1f1f1f; } a { outline: none; text-decoration: underline; color: #000; } a:hover { text-decoration: none; } a img { border: none; background: none; } p { margin: 0 0 10px; line-height: 16px; font-size: 12px; color: #000; } /* UTILITY */ .l { float: left; } .r { float: right; } .clear { clear: both; } /* STRUCTURE */ #page-wrap { width: 971px; margin: 0 auto; padding: 0; } /* RED SCHEME */ body#red #content { margin: 0 auto; width: 957px; padding: 7px; background: url(http://www.eastmidshire.com/images/bg-content.png); } body#red #footer { width: 971px; height: 200px; margin: 0 auto; background: url(http://www.eastmidshire.com/images/bg-bottom.png) center no-repeat; } body#red #bottom-text { float: left; width: 957px; background: url(http://www.eastmidshire.com/images/bg-home-text-bottom.png) repeat-y; } /* DARK SCHEME */ body#dark #content { margin: 0 auto; width: 957px; padding: 7px; background: url(http://www.eastmidshire.com/images/bg-content2.png); } body#dark #footer { width: 971px; height: 200px; margin: 0 auto; background: url(http://www.eastmidshire.com/images/bg-bottom2.png) center no-repeat; } body#dark #bottom-text { float: left; width: 957px; background: url(http://www.eastmidshire.com/images/bg-home-text-bottom2.png) repeat-y; } #footer .inner { width: 971px; margin: 0 auto; padding: 25px 0 0; } #header { float: left; width: 927px; height: 106px; padding: 25px 15px; background: #FFF; margin: 0 0 7px; } #splash { position: relative; float: left; width: 957px; height: 296px; background: url(../images/newTopWeekly.jpg) no-repeat; margin: 0 0 7px; } #sub-header { float: left; width: 975px; margin: 0 0 7px; } #buttons { float: left; width: 957px; height: 99px; margin: 0 0 7px; } #buttons img { margin: 0 3px 0 0; } #slider { float: left; width: 957px; height: 222px; padding: 0px; background: white; margin: 0 0 7px; } #latest-news { float: left; width: 260px; padding: 10px; background: white; } #about-us { float: right; width: 649px; padding: 10px; background: white; } #sub-content { float: left; width: 937px; padding: 10px; background: white; margin: 0 0 7px; } .floatbox { float: right; width: 200px; height: 200px; background: green; } /* HEADER */ .flash-holder { float: right; width: 660px; height: 80px; background: #CCC; } .nav { float: right; width: 600px; height: 15px; text-align: right; margin-top: 10px; } .nav a { float: left; display: block; overflow: hidden; text-indent: 140px; border: none; height: 15px; background-position: top left; } .nav a:hover { background-position: bottom left; height: 15px; } .nav .home { background: url(../images/nav/home.png) no-repeat; width: 47px; } .nav .bookings { background: url(../images/nav/bookings.png) no-repeat; width: 85px; } .nav .vehicles { background: url(../images/nav/vehicles.png) no-repeat; width: 82px; } .nav .our-offices { background: url(../images/nav/our-offices.png) no-repeat; width: 96px; } .nav .faqs { background: url(../images/nav/faqs.png) no-repeat; width: 60px; } .nav .business { background: url(../images/nav/business.png) no-repeat; width: 135px; } .nav .contact-us { background: url(../images/nav/contact-us.png) no-repeat; width: 81px; } /* SPLASH FORM */ #splash .form { position: absolute; top: 7px; right: 7px; width: 250px; height: 280px; background: url(../images/bg-splash-form.png); } #splash .specialBox { position: absolute; top: 45px; right: 670px; width: 250px; height: 280px; } #splash .form .top { float: left; width: 250px; height: 35px; background: #d3d4d5; color: #000; } #splash .form .top p, #splash .form .bottom p { text-transform: uppercase; font-weight: bold; padding: 10px; font-size: 20px; } #splash .form .bottom { float: left; width: 250px; height: 35px; background: #d3d4d5; color: #eb0909; text-align:center; } #splash .form .bottom a { color: #eb0909; text-decoration: none; } #splash .form .bottom a:hover { color: #333; } #splash .form .middle select, input, textarea { padding: 1px; } #splash .form .middle { float: left; width: 220px; height: 210px; padding: 0 15px; } #splash .form .middle .row-1 { width: 220px; } #splash .form .middle label { clear: left; float: left; width: 220px; display: block; padding: 4px 0; font-size: 13px; font-weight: bold; margin: 3px 0 0; } #splash .form .middle .row-1 select { width: 220px; } #splash .form .middle .row-1 input.small { float: left; width: 100px; } #splash .form .middle .row-1 .cal { float: left; width: 17px; height: 19px; margin: 1px 0 0; } #splash .form .middle .row-1 select.h { float: left; width: 40px; margin: 0 4px 0 12px; } #splash .form .middle .row-1 select.m { float: left; width: 40px; } /* SUB PAGE QUOTE BOX */ #quote-box { position: relative; width: 310px; height: 374px; overflow: hidden; background: url(../images/bg-sub-quote.png) no-repeat; } #quote-box .form-wrap { position: relative; width: 240px; height: 280px; margin: 75px 0 0 35px;} #quote-box select, input, textarea { padding: 1px; } #quote-boxe { float: left; width: 220px; height: 210px; padding: 0 15px; } #quote-box .row-1 { float: left; width: 220px; } #quote-box .form-wrap .btn { position: absolute; top: 210px; left: 27px; } #quote-box label { clear: left; float: left; width: 220px; display: block; padding: 4px 0; font-size: 13px; font-weight: bold; margin: 3px 0 0; color: #FFF; } #quote-box .row-1 select { width: 220px; } #quote-box .row-1 input.small { float: left; width: 100px; } #quote-box .row-1 .cal { float: left; width: 17px; height: 19px; margin: 1px 0 0; } #quote-box .row-1 select.h { float: left; width: 40px; margin: 0 4px 0 12px; } #quote-box .row-1 select.m { float: left; width: 40px; } #quote-box .btn { position: absolute; left: 30px; top: 0px; width: 175px; height: 60px; overflow: hidden; text-indent: -999px; background: url(../images/btn-quoteme.png) top left no-repeat; } #quote-box .btn:hover { background: url(../images/btn-quoteme.png) bottom left no-repeat; } /* SUB PAGE LOGIN BOX */ #login-box { clear: both; position: relative; width: 310px; height: 190px; overflow: hidden; background: url(../images/bg-sub-login.png) no-repeat; padding: 10px 0; } #login-box .form-wrap { position: relative; width: 240px; height: 164px; margin: 30px 0 0 35px; *margin-top: 36px; } #login-box select, input, textarea { padding: 1px; } #login-box .row-1 { float: left; width: 220px; } #login-box label { clear: left; float: left; width: 220px; display: block; padding: 4px 0; font-size: 13px; font-weight: bold; margin: 3px 0 0; color: #FFF; } #login-box .row-1 input { float: left; width: 220px; padding: 2px; } #login-box .form-wrap .btn-login { position: absolute; left: 30px; bottom: 10px; *bottom: 7px; width: 175px; height: 60px; overflow: hidden; text-indent: -999px; background: url(../images/btn-login.png) top left no-repeat; } #login-box .form-wrap .btn-login:hover { background: url(../images/btn-login.png) bottom left no-repeat; } /* SLIDER */ .slider-wrap { width: 937px; height: 222px; background: #CCC; margin: 0px 0 0; } /* LATEST NEWS & ABOUT US */ span.date { border-left: 3px solid #eb0909; padding-left: 5px; color: #6b6b6b; } .news { margin: 10px 0; } .news p, #about-us p { font-size: 11px; } /* FOOTER */ .inner span.copyright { float: left; width: 200px; color: #FFF; background: url(../images/bg-copyright2.png) top left no-repeat; padding: 0 0 25px 45px; } .inner ul { float: right; width: 700px; margin: 0; padding: 0; text-align: right; } .inner li { list-style: none; display: inline; font-family: Arial, Helvetica, sans-serif; text-transform: uppercase; font-size: 12px; font-weight: bold; padding: 0 7px; background: url(../images/divider-nav-footer.png) right repeat-y; } .inner li.end { background: none; } .inner li a { text-decoration: none; color: #FFF; } .inner li a:hover { color: #CCC; } /* TYPOGRAPHY */ h2 { font-size: 20px; font-family: Arial, Helvetica, sans-serif; color: #000; text-transform: uppercase; } h2 span { color: #eb0909; } h5 { color: #000; font-size: 11px; margin: 5px 0; }