/* 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Title : 
Author : John Davies / john.davies@gforces.co.uk / G-Forces Web Management Ltd

Type: Screen, Projection

Description : Screen and projection stylesheet for Humphries and Parks site

Created : 06/03/07
Modified : 

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
*/

/* COMMON AND GLOBAL */
body { font:62.5%/1.6 arial, verdana, helvetica, sans-serif; margin:0; padding:0; background:#ffffff; color:#333333; text-align:center; }
/*  This font sizing is for standards based browsers (firefox, opera, mozilla) that can re-size text.  
Declaring the font size in pixels makes it more consistent across browsers. */
td, textarea, input, select { font:110% arial, helvetica, sans-serif; }
html>body td, html>body textarea, html>body input, html>body select { font-size:11px; }
/* some browsers don't inherit the font into tables or textareas! */
address { font-style:normal;}

/* ----- GLOBAL IDS ----- */
#container { width:912px; margin:0 auto; text-align:left; min-height: 400px;  }
#header { height: 87px; position:relative; }
#printHeader { display: none; }
#logoGroup { position:absolute; top: 42px; left: 0px; }
#leftCol { width: 179px; float: left; font-size: 1.1em; line-height: 120%;}
#usedCarSearch { background:url(../../images/layup/usedCarBg.gif) top left repeat-x; height: 249px; position:relative; margin-bottom:1px; }
#contactUs { position:relative; background:url(../../images/layup/greyGradBg.gif) top left repeat-x; min-height: 395px; }
#contactUs .padding { padding: 5px 20px 0px 20px;}
#map { position:absolute; top: 64px; right: 10px; }
#requestService  { position:relative; background:url(../../images/layup/greyGradBg.gif) top left repeat-x; min-height: 395px; }
#requestService .padding { padding: 5px 15px 0px 20px;}
#requestService .content p { padding: 0px 0px 0px 50px;}
#requestService .content img { padding: 0px 0px 0px 45px;}
#serviceImage { position:absolute; top: 46px; left: 19px; }
#internalContent {padding: 10px 10px 0px 0px; position:relative; }
#internalContent p{  line-height: normal !important;}

#innerContainer { margin-top: 8px; position:relative; width: 714px; background:#FFFFFF; min-height: 599px; padding-bottom: 20px}
#innerContainer .padding { padding: 15px 14px 0px 14px;}
#innerContainerUsedCar { margin-top: 8px; position:relative; width: 714px; background:#FFFFFF; min-height: 599px; padding-bottom: 20px}
#innerContainerUsedCar .padding { padding: 15px 14px 0px 14px;}
#shadow { position:absolute; top: -8px; left: -11px; z-index: 0;}
#shadowBottom1 { position:absolute; bottom: 0px; right: -11px; z-index: 0;}
#shadowBottom2 { position:absolute; bottom: -8px; right: -11px; z-index: 0;}

#rightColHome { float: left; background:url(../../images/layup/rightColHomeBg.gif) top left repeat-x; width: 733px; font-size: 1.1em; }
#rightCol {float: left; background:url(../../images/layup/rightColBg.gif) top left repeat-x; width: 733px; font-size: 1.1em; }
#cantFindMain { position:relative; background:url(../../images/layup/cantFind.gif) top left no-repeat; float: left; height: 140px; width: 361px;}
#cantFindMain .click { position:absolute; top: 76px; left: 125px; }
#requestServiceMain { position:relative; background:url(../../images/layup/requestService.gif) top left no-repeat; float:left; height: 110px; width: 361px; }
#requestServiceMain p { position:absolute; top: 44px; left: 125px; color: #ffffff; width: 200px; line-height: 120%; padding: 0px; }
#requestServiceMain a { color:#FFFFFF;}
#rightColHome .padding { padding: 0px 50px 0px 14px;}

#carDetails { height: 290px; width: 686px; position: relative; padding-top: 10px; }
#carPictureLarge { position:relative; float: left; width: 370px; height: 290px; }
#carPictureLargeFrame { position: absolute; top: -9px; left: 0px; } 
#carPictureLargeImage { padding: 7px 0px 20px 13px; }
.iconEnlarge { float:left; background:url(../../images/layup/iconEnlarge.gif) 15px 3px no-repeat; padding:0px 0 0px 35px; }
.iconEnlarge a { color: #3c3c3c;}
.usedCarThumb {float: right; position:relative; width: 158px; height: 127px; }
.usedCarThumbFrame { position: absolute; top: 0px; left: 5px; }  
.usedCarThumbImage { padding: 7px 0px 0px 13px;}
#usedCarInfo ul{ margin: 0px; padding: 0px 0px 0px 10px; }
#usedCarInfo li{ display:inline; }
.iconEmail { background:url(../../images/layup/iconEmail.gif) 0px 5px no-repeat; padding:3px 62px 3px 22px;}
.iconPrint { background:url(../../images/layup/iconPrint.gif) 0px 4px no-repeat; padding:3px 62px 3px 22px;}
.iconTestDrive { background:url(../../images/layup/iconTestDrive.gif) 0px 6px no-repeat; padding:3px 62px 3px 22px;}
.iconCar { background:url(../../images/layup/iconEnquiry.gif) 0px 5px no-repeat; padding:3px 0px 3px 22px;}
.iconEmail a { color:#5d5d5d; font-weight: bold;}
.iconPrint a { color:#5d5d5d; font-weight: bold;}
.iconCar a { color:#5d5d5d; font-weight: bold;}
.iconTestDrive a { color:#5d5d5d; font-weight: bold;}

#newCarDescription a { font-weight: bold;}
#newCarInfo { color:#5d5d5d; float: left; padding: 20px 0px 0px 20px}
#newCarInfo ul{ list-style:none; margin: 0px; padding: 60px 0px 0px 10px; font-weight: bold;}
#newCarInfo li{ line-height: 230%; }
#newCarInfo p {font-size: 0.9em;}
#newCarInfo .iconEmail { background:url(../../images/layup/iconEmail.gif) 0px 8px no-repeat; padding:1px 39px 1px 22px;}
#newCarInfo .iconPrint { background:url(../../images/layup/iconPrint.gif) 0px 7px no-repeat; padding:1px 39px 1px 22px;}
#newCarInfo .iconCar { background:url(../../images/layup/iconEnquiry.gif) 0px 9px no-repeat; padding:1px 39px 1px 22px;}
#newCarInfo .iconTestDrive { background:url(../../images/layup/iconTestDrive.gif) 0px 10px no-repeat; padding:1px 39px 1px 22px;}

/* ----- GROUP IDS ----- */
#rightColGroup { float: left; background:url(../../images/layup/usedCarBg.gif) top left repeat-x; width: 733px; font-size: 1.1em; }
#rightColGroup .padding { padding: 10px 20px 0px 14px;}
#groupManufacturerLogo {}
#groupMitsubishiLogo { position:absolute; right: 8px; top: 25px; }
#groupKiaLogo { position:absolute; right: 60px; top: 39px; }
#groupDaihatsuLogo { position:absolute; right: 142px; top: 34px; }
#groupSeatLogo { position:absolute; right:140px; top:37px; }

/* ----- FLASH ----- */
.flashMain { float: left; height: 270px; width: 372px; padding-top: 7px; background:url(../../images/layup/flashBg.gif) top left repeat-x;}
#flashNewCars { float: left; height: 216px; width: 265px; }
#flashUsed { float: left; height: 216px; width: 265px; }
#flashOffers { float: left; height: 216px; width: 198px; }
.flashGroupMain { padding-top: 10px; float: left; height: 201px; width: 733px; background:url(../../images/layup/flashGroupMainBg.gif) top right no-repeat; }
.flashSplash { float:left; height: 211px; }
#imageSwapper { background:url(../../images/layup/imageSwapperBg.gif) top left no-repeat; width: 733px; height: 201px;}
#imageSwapper .padding { padding: 11px 0px 0px 10px; }

/* ----- FOOTER ----- */
#footer { background:url(../../images/layup/dots.gif) top left repeat-x; padding: 10px 0px 0px 194px; font-size:1.1em; color: #545454; margin-top: 10px; }
#footer span { padding-right: 3px;}
#footer a { color: #545454; font-weight: normal; }
#motability { position:absolute; top: -60px; left: -172px;}

/* ----- CLASSES ----- */
.clear { clear:both; }
.hide { display:none; }
.show { display:block; }
.printShow { display:none; }
.float_left { float:left !important; }
.float_right { float:right !important; }
.align_left { text-align:left !important; }
.align_center { text-align:center !important; }
.align_right { text-align:right !important; }
.align_justify { text-align:justify !important; }
.align_bottom { vertical-align:bottom !important; }
.image_right { float:right; padding:0 0 15px 15px; }
.image_left { float:left; padding:0 15px 15px 0; }
.relative { position:relative; }
.inline {display:inline; }
.line{ text-decoration:line-through; color: #494949;}
.price { font-size: 1.1em;}
.red { color:#d50324;}

#leftList { width:335px; float:left; background:url(../../images/layup/dotsV.gif) top right repeat-y;}
#leftList .title { padding-left:8px;}
#rightList { width:335px; padding-left:15px; margin-left:-1px; float:left; background:url(../../images/layup/dotsV.gif) top left repeat-y;}
#rightList .title { padding-left:4px;}
.splitListBox { position:relative; width:165px; height:155px; margin-top:5px; }
.splitListFrame { position:absolute; top: 13px; left: 0px; width: 158px; height:121px}
.splitListPicture {  position:absolute; top: 20px; left: 8px; }
.splitListTitle { position:absolute; top: -5px; left: 10px;}
.splitListTitle a { color:#333333;}
.splitListLink { position:absolute; top:133px; left:70px; font-weight:bold;}


.newCarBox { position:relative; width:167px; height:165px; }
.newCarFrame { position:absolute; top: 23px; left: 0px; width: 158px; height:121px}
.newCarPicture {  position:absolute; top: 30px; left: 8px; }
.newCarTitle { position:absolute; top: -5px; left: 10px; line-height:120%;}
.newCarTitle a { color:#333333;}
.newCarLink { position:absolute; top:143px; left:70px; font-weight:bold;}
.divider { background:url(../../images/layup/dots.gif) top left repeat-x; width: 685px; height: 12px; clear:both;}

.usedCarRow { position:relative; min-height:120px; width:690px; }
.usedCarListThumb { width: 158px; float: left; }
.usedCarListFrame { position:absolute; top: 5px; left: 0px; width: 158px; height:121px}
.usedCarListPicture { position: relative; padding: 13px 0px 0px 8px; }
.usedCarListText { float: left; width: 380px; padding: 20px 0px 0px 13px;}
.usedCarListText h4 { text-transform: uppercase;}
.usedCarListText ul { width: 200px; list-style: none; padding:13px 0px 0px 0px; margin: 0px; }
.usedCarListText li { padding: 0px 0px 0px 20px; background:url(../../images/layup/iconPhoto.gif) left 2px no-repeat; display:inline;}
.usedCarListPrice { position: absolute; top:40px; right:5px; line-height:130%; text-align: right; font-weight: bold; color: #c50101;}
.usedCarListLink { position:absolute; bottom:16px; right:10px; font-weight:bold;}
.divider2 { background:url(../../images/layup/dots.gif) bottom left repeat-x; width: 685px; height: 12px; clear:both;}

/* ----- HEADINGS & PARAGRAPHS ----- */
h1, h2, h3, h4, h5, h6 { margin:0; padding:0; font-size:1.0em; line-height: 120% }

/* ----- NAVIGATION ----- */
#nav  { height: 37px; font-size:110%; position:relative; background:url(../../images/layup/navBg.gif) top left repeat-x; color:#FFFFFF; font-weight:bold;}
#nav a {color:#FFFFFF; text-decoration:none; font-weight:bold; text-transform:uppercase; padding:7px 9px;}
#nav ul { list-style:none; padding:12px 0 0 8px; margin:0 0 0 0px;}
#nav ul li { display:inline;}
#nav a:hover { text-decoration:none; color:#000000; background:url(../../images/layup/topNavRight.gif) top right no-repeat; padding:7px 0px;}
#nav a:hover span { background:url(../../images/layup/topNavLeft.gif) top left no-repeat; padding:7px 9px;}
#nav .active a { text-decoration:none; color:#000000; background:url(../../images/layup/topNavRight.gif) top right no-repeat; padding:7px 0px;}
#nav .active span { background:url(../../images/layup/topNavLeft.gif) top left no-repeat; padding:7px 9px;}

/* ----- SITE MAP ----- */
#sitemap { list-style:none; margin:0 0 0 10px; padding:0; position:relative;}
#sitemap ul { list-style:none; padding: 0px; margin: 0px 0px 0px 10px;}
#sitemap li {padding: 5px 0px 5px 10px;}
#sitemap .sitemapLi {padding: 10px 0px 0px 15px; background:url(../../images/layup/iconArrow.gif) 0px 15px no-repeat;}
#sitemap a { color:#3c3c3c;}

/* ----- BREADCRUMBS ----- */
#breadcrumbs { line-height: 200%; background:url(../../images/layup/dots.gif) bottom left repeat-x; padding:0px 0 4px 0px; margin:0 0px 0px 0px; position: relative; min-height: 20px;}
#breadcrumbs a { font-weight:normal; color: #000000; }
#breadcrumbs a:hover {text-decoration:underline;}

/* ----- PAGINATION ----- */
.pagination { text-align:right; font-weight:bold; margin:0px; position:absolute; top:-24px; right:0px;}
.pagination ul { list-style:none; padding:0; margin:0; }
.pagination li { display:inline; font-weight:bold; }
.pagination a { font-weight:bold; text-decoration:none; color:#333333; padding:0px 2px 0px 3px; }
.pagination .active a { background:#ffffff; color:#d00001; font-weight:bold; }
.pagination a:hover {  text-decoration:none; background:#d00001; color:#FFFFFF; }

.paginationBottom { text-align:right; font-weight:bold; margin:10px 0px 0px 0; }
.paginationBottom ul { list-style:none; padding:0; margin:0; }
.paginationBottom li { display:inline; font-weight:bold; }
.paginationBottom a { font-weight:bold; text-decoration:none; color:#333333; padding:0px 2px 0px 3px; }
.paginationBottom .active a { background:#ffffff; color:#d00001; font-weight:bold; }
.paginationBottom a:hover {  text-decoration:none; background:#d00001; color:#FFFFFF; }

/* ----- ADDITIONAL PAGE DETAILS ----- */
#pageDetails {  background:url(../../images/layup/dots.gif) bottom left repeat-x; padding:7px 0 4px 0px; margin:0 0px 0px 0px; position: relative; min-height: 23px;}
#pageDetails a { font-weight:normal; color: #000000; }
#pageDetails a:hover {text-decoration:underline;}
.sort { text-align:right; font-weight:bold; margin:0px; position:absolute; top:-27px; right:0px;}
.sort select{ width: 98px; border:1px solid #d0d0d0; font-weight: bold; color: #4d4d4d; font-size: 1.0em; font-family: Arial, Helvetica, sans-serif; }


/* ----- GLOBAL ----- */
img { display:block; border:0; }
p { padding:10px 0px 0px 0px; margin:0; line-height: 120% }

/* ----- LINKS ----- */
a { color:#d50324; font-weight:bold; text-decoration:none; }
a:hover { text-decoration:underline; }

/* ----- FORMS ----- */
form { padding:0; margin:0; }
fieldset { padding:0; margin:0; border:0px none; display:inline; }
legend { padding:0; margin:0; display:none; }
label { display:none; }

#usedCarSearch form{ padding:10px 0px 0px 20px;}
#usedCarSearch select{ width:132px; border:1px solid #d0d0d0; padding:1px 0px; margin:0px 0px 12px 0px; font-size: 1.0em; font-family: Arial, Helvetica, sans-serif; }
#usedCarSearch .submit { width:71px !important; height: 29px !important; position:absolute; bottom: 35px; right: 24px;}

#contact fieldset {border: 0px; display:block;}
#contact label { display:block; width:210px; float:left; padding-top: 10px;}
#contact input, #contact textarea { width:200px; padding:1px 2px; margin-top: 13px; border: 1px solid #acacac;}
#contact .submit { width:71px; height: 29px; border: 0px !important;}
#contact select { width:208px; margin-top: 13px; }

/** Prototype Validation **/
#contact input.disabled { border: 1px solid #F2F2F2; background-color: #ce0100; }
#contact input.required, #contact textarea.required, #contact select.required { border: 1px solid #de002c; }
#contact input.validation-failed, #contact textarea.validation-failed, #contact select.validation-failed { border: 1px solid #de002c; color : #FF3300; }
#contact input.validation-passed, #contact textarea.validation-passed, #contact select.validation-passed { border: 1px solid #00CC00; color : #000; }
#contact .validation-advice { margin: 5px 0; padding: 5px; background-color: #ce0100; color : #FFF; font-weight: bold; }

/* ----- TABLES ----- */
table{ border-collapse:collapse; margin-top:10px; margin-bottom:7px; color: #616161; font-size: 0.9em !important; }
.altRow { background:#eaeaea;}
td { padding:5px 0 5px 14px; }
.tableTop { background: #9d9d9d url(../../images/layup/tableTopBg.gif) 0px 0px no-repeat; margin-bottom: 0px; width:685px; height:25px; color:#FFFFFF;}
.tableTop a { color:#FFFFFF; cursor:pointer; font-weight:normal; padding-right:525px; padding-top:3px; padding-bottom:3px; padding-left: 5px;}
.tableTop a:hover { text-decoration:none;}
.tableTopText { padding:4px 0 0 5px; text-transform:uppercase;}
.magnifyingGlass { position:absolute; top:0px; right:0px;}
.tableTitle { background: url(../../images/layup/tableTitleBg.gif) top left repeat-x; margin-bottom: 1px; width:685px; height:36px; padding: 0px; color:#FFFFFF; text-transform:uppercase;}
.tableTitle td { font-weight:bold;  padding:5px 0 5px 10px;}
table ul{ list-style: disc; padding: 0px 0px 0px 3px;  margin: 0px;}
table li{ padding: 0px 0px 10px 0px; }
/*#carInformationTables { height: 275px;}*/
#carInformationTables { }
