/* SCREEN.css */

/* reset all margins */
* {
	margin:0;
	padding:0;
}

/* ================================================= */
/* ================ NEW SITE CSS =================== */
/* ================================================= */

/********** HEADER CSS **********/
#Header {
	width: 765px;
	height: 120px;
	margin-top:5px;
	background-image:url(../png/header-background.png);
	background-position:left top;
	background-repeat:no-repeat;
	text-align:center;
}

#Header div.img1 {
	float:left;
	margin: 7px 5px 0px 25px;
	width:153px;
}
*html #Header div.img1 {
	margin: 7px 5px 0px 10px;
}

#Header div.img2 {
	float:left;
	margin: 7px 25px 0px 0px;
	width:556px;
}
*html #Header div.img2 {
	margin: 7px 20px 0px 5px;
}


/*********************************************************/


/********** BODY CSS **********/
body {
	background-color:#000;
	background-position:top center;
	margin:0 auto 0 auto;
	padding:0;
	text-align:center;
}

/* WRAPPER */
#Wrapper {
	text-align:center;
	margin-right:250px;
}

#Focus {
	text-align:center;
	width: 769px;
	margin-top:6px;
	margin-left:18px;
}


#BackgroundImage {
	background-image:url(../jpg/background-image.jpg);
	background-repeat:no-repeat;
	background-position: top;
	min-height:800px;
	margin:0px auto 0px auto;
}
* html div.backgroundImage {
	height: 800px;
}


#Navigation {
	text-align:center;
	margin-top:-2px;
	width: 765px;
	height: 30px;
	background-image:url(../png/background-repeat.png);
	background-position:left top;
	background-repeat:repeat-y;/**/
}
*html #Navigation {
	margin-left:-3px;
}
#Navigation div.buttons {
	text-align:center;
	width: 765px;
}
/*********************************************************/


/********** CONTENT CSS **********/

#ContentSurround {
	width:765px;
	background-image:url(../jpg/content-surround-background.jpg);
	background-position:left top;
	background-repeat:repeat-y;
}

#ContentBackground {
	background-image:url(../jpg/car-background.jpg);
	background-repeat:no-repeat;
	width:765px;
}

#Content div.titleImage {
	margin:10px 0px 10px 20px;
	width:240px;
}

#Content {
	text-align:left;
	width: 765px;
	
	padding: 15px 0px 25px 25px;
	
}

#Content div.left {
	width:255px;
	height:300px;
	text-align:left;
	margin: 0px 10px 0px 0px;
	float:left;
}

#Content div.left div.image {
	margin-bottom:10px;
}

#Content div.center {
	margin-top:-50px;
	float:left;
	margin:0px 10px 10px 10px;
}

#Content div.right {
	padding-top:52px;
	margin:0px 10px 0px 10px;
}

div.tyrePlusLogos {
	width: 708px;
	height: 48px;
	color: #000;
	background-color:#FFF;
	border: 1px solid #000;
	margin-top: 30px;
	margin-left: 5px;
	clear:both;
}
* html div.tyrePlusLogos {
	margin-top: 25px;
}
div.tyrePlusLogo {
	float: left;
}

/*********************************************************/


/********** FOOTER CSS **********/



#Footer  {
	width: 765px;
	height: 45px;
	background-image:url(../png/footer-surround-background.png);
	background-position:left bottom;
	background-repeat:repeat-y;
	padding-top: 5px;
}
*html #Footer {
	margin-left:-3px;
}
#Footer div.footerSurround {
	width: 720px;
	height:34px;
	color: #000;
	background-image:url(../png/footer-background.png);
	background-position:left top;
	background-repeat:repeat-y;
	margin: 0px 0 0 0px;
	font-size: 0.75em;
}

div.footerLeft {
	float:left;
	margin: 5px 0 0 7px;
}
div.footerRight {
	float:right;
	margin: 5px 7px 0 0;
	height:20px;
}

#BelowFooter p {
	color:#FFF;
	width:700px;
	font-size:10px;
	margin-top:10px;
}


/*********************************************************/


/********** ENQUIRY CSS **********/

#ContactInfo {
	width:300px;
	float:left;
	margin-right:10px;
}

#Enquiry {
	width:450px;
	float:left;
	
}

#Enquiry div.label {
	color:#000;
	font-size:10px;
	margin-right:4px;
}

#Enquiry div.value {
	height:30px;
}

#Enquiry div.title {
	
	height:20px;
	width:100px;
	float:left;
}

#Enquiry div.title div.label {
	margin-top:4px;
	float:left;
}

#Enquiry div.firstName {
	
	height:20px;
	width:170px;
	float:left;
}

#Enquiry div.firstName div.label {
	margin-top:4px;
	float:left;
}

#Enquiry div.surname {
	
	height:20px;
	width:170px;
	float:left;
}

#Enquiry div.surname div.label {
	float:left;
}

#Enquiry div.organisation {
	padding-top:25px;
	
}

#Enquiry div.organisation div.label {
	width:100px;
	margin-top:4px;
	float:left;
}

#Enquiry div.address1 {
	
}

#Enquiry div.address1 div.label {
	width:100px;
	margin-top:4px;
	float:left;
	height:135px;
	
}

#Enquiry div.address5 {
	width:132px;
	
	float:left;
}

#Enquiry div.postcode {
	
}

#Enquiry div.postcode div.label {
	margin-top:4px;
	float:left;
}

#Enquiry div.telephoneHome {
	
	width:239px;
	float:left;
}

#Enquiry div.telephoneHome div.label {
	width:103px;
	float:left;
}

#Enquiry div.telephoneWork {
	
}

#Enquiry div.telephoneWork div.label {
	float:left;
	width:60px;
	
}

#Enquiry div.telephoneMobile {
	
	width:239px;
	float:left;
}

#Enquiry div.telephoneMobile div.label {
	width:103px;
	float:left;
}

#Enquiry div.fax {
	
}

#Enquiry div.fax div.label {
	margin-top:4px;
	float:left;
	width:60px;
	
}

#Enquiry div.email {
	
}

#Enquiry div.email div.label {
	margin-top:4px;
	float:left;
	width:100px;
	
}

#Enquiry div.enquiry {
	
	height:160px;
}

#Enquiry div.enquiry div.label {
	float:left;
	width:100px;
	margin-top:3px;
	
}

div.swzImgSec {
	margin-left:auto;
	margin-right:auto;
	width:300px;
}

div.swzImgSec div.description {
	float:left;
	width:140px;
	font-size:13px;
	color:#000;
	font-size:10px;
}

div.swzImgSec div.image {
	margin-top:0px;
}

div.swzImgSec div.input {
	
	width:100px;
}


div.errorMessage {
	color:#000;
}

#Enquiry div.button {
	margin-top:20px;
	margin-bottom:10px;
	text-align:center;
}

div.errorMessage p {
	size:12px;
	color:#FF0000;
}

/*#Enquiry div.title div.label {
	margin-top:4px;
	float:left;
}	

#Enquiry div.title {
	float:left;
	width:100px;
}

#Enquiry div.firstName div.label {
	margin-top:4px;
	float:left;
}

#Enquiry div.firstName {
	float:left;
	width:164px;
}

#Enquiry div.surname div.label {
	margin-top:4px;
	float:left;
	width:62px;
}

#Enquiry div.surname {
	width:180px;
	float:left;
}



#Enquiry div.organisation div.label {
/*	margin-top:4px;
	float:left;
	width:80px;

}

#Enquiry div.organisation div.value {
	width:320px;

}

#Enquiry div.organisation {
}

#Enquiry div.address1 {
	border:1px solid #000;
	height:20px;
}


#Enquiry div.address2 div.label,
div.address3 div.label,
div.address4 div.label,
div.address5 div.label {

	display:none;
}

#Enquiry 
div.address2 div.value,
div.address3 div.value,
div.address4 div.value{

	
}


#Enquiry div.address1 div.label{
	margin-top:4px;
	float:left;
	width:80px;
	border:1px solid #000;
	height:130px;
}



#Enquiry div.address5 div.value {
	width:133px;
	float:left;
}



#Enquiry div.postcode div.label {
	margin-top:4px;
	float:left;
}

#Enquiry div.telephoneHome div.label {
	float:left;
	width:80px;
}

#Enquiry div.telephoneHome {
	float:left;
	width:218px;

}

#Enquiry div.telephoneWork div.label {
	float:left;
	width:60px;
	
}

#Enquiry div.telephoneMobile {
	width:218px;
	float:left;
}

#Enquiry div.telephoneMobile div.label {
	width:80px;
	float:left;
}


#Enquiry div.fax div.label {
	margin-top:4px;
	float:left;
	width:58px;
}

#Enquiry div.email div.label {
	margin-top:4px;
	float:left;
	width:80px;
}

#Enquiry div.enquiry div.label {
	float:left;
	width:80px;
}

#Enquiry div.enquiry div.value {
	height:150px;
}






div.swzImgSec {
	margin-left:auto;
	margin-right:auto;
	width:300px;
}

div.swzImgSec div.description {
	float:left;
	width:140px;
	font-size:13px;
	color:#000;
	font-size:10px;
}

div.swzImgSec div.image {
	margin-top:10px;
}

div.swzImgSec div.input {
	border:1px solid #000;
	width:100px;
}


div.errorMessage {
	color:#000;
}


#Enquiry div.button {
	margin-top:20px;
	text-align:center;
}*/

/*********************************************************/


/********** CENTRE INFO CSS **********/

div.headerYellow {
	width: 420px;
	height: 20px;
	background-image:url(../png/centre-detail-header-yellow.png);
	background-repeat:no-repeat;
	background-position:left top;
	margin-top: 10px;
}
div.headerCream {
	width: 420px;
	height: 20px;
	background-image:url(../png/centre-detail-header-cream.png);
	background-repeat:no-repeat;
	background-position:left top;
}

div.centreTitle {
	padding: 2px 0 0 5px;
	font-weight:bold;
}

div.centreIcons {
	margin: 10px 0 10px 0;
}
div.centreIcon {
	float: left;
	margin-right: 12px;
	margin-top:0px;
	padding-top:0px;
	width:40px;
}
div.centreHours {
	margin: 10px 0 0 5px;
}
div.centreHours td {
	padding: 0px 8px 0 0;
}
div.centreHours td.opening {
	text-align: right;
}
div.centreHours td.closing {
	text-align: right;
}
div.centre {
	margin-top: 10px;
	margin-left: 5px;
	width:420px;
	
	
}
div.centreArea {
	width: 150px;
	float:left;
	font-weight:bold;
}
div.centreAddress {
	float:left;
	margin-bottom:10px;
	width:180px;
}

div.centreMap {
	border:1px solid #000;
}


div.centreSeparator {
	width: 420px;
	border-top: 1px dotted #000;
	margin: 15px 0 15px 0;
}

div.centreDesc {
	float:left;
	min-height:400px;
	width:270px;
	margin: 0px 20px 0px 20px;
}

div.centreDesc div.image {
	margin-left:auto;
	margin-right:auto;
}

div.centreInfo {
	float:left;
	width:420px;
}/**/



/*********************************************************/




/********** OTHER CSS **********/

p.tyreBullet {
	background-image:url(../png/paragraph-tyre.png);
	background-position:top left;
	background-repeat:no-repeat;
	padding-left: 20px;
	margin-top: 25px;
}

p.tyreBulletList {
	background-image:url(../png/paragraph-tyre.png);
	background-position:top left;
	background-repeat:no-repeat;
	padding-left: 20px;
}


li.tyreBullet {
	list-style-image:url(../png/tyre-bullet.png);
}

/*********************************************************/


/********** TYRE-SEARCH CSS **********/
div.tyreSearchHeader {
	
}
strong.red {
	color: #A00;
}
div.tyreSearchLeft {
	float:left;
	margin-top: 10px;
}
div.tyreSearchRight {
	float:left;
	margin: 10px 0 0 20px;
	min-height: 350px;
}
* html div.tyreSearchRight {
	height: 350px;
}
div.tyreSearchStep1Left {
	width: 300px;
	float:left;
}
div.tyreSearchStep1Right {
	float:left;
	width: 240px;
	text-align:center;
	margin-left: 20px;
}
div.selectCentre {
	margin-bottom: 5px;
}

div.tyreSizeInfoDEF, div.tyreSizeInfoSEC, div.tyreSizeInfoASP, div.tyreSizeInfoRIM, div.tyreSizeInfoSPD {
	width: 570px;
	height:220px;
	background-position:left top;
	background-repeat:no-repeat;
}
div.tyreSizeInfoDEF {
	background-image:url(../png/tyresearch/tyre-size-default.png);
}
div.tyreSizeInfoSEC {
	background-image:url(../png/tyresearch/tyre-size-sec.png);
}
div.tyreSizeInfoASP {
	background-image:url(../png/tyresearch/tyre-size-asp.png);
}
div.tyreSizeInfoRIM {
	background-image:url(../png/tyresearch/tyre-size-rim.png);
}
div.tyreSizeInfoSPD {
	background-image:url(../png/tyresearch/tyre-size-spd.png);
}
div.enterTyreSizeLeft {
	width: 140px;
	margin: 5px 0 0 10px;
	float:left;
}
* html div.enterTyreSizeLeft {
	margin: 10px 0 0 5px;
}
div.enterTyreSizeRight {
	float:left;
	width: 400px;
	height: 120px;
	margin: 10px 0 0 10px;
}
div.enterTyreSizeLeft select {
	width: 120px;	
	margin-bottom: 5px;
}
div.enterTyreSizeLeft input {
	margin-top: 15px;
}
div.enterTyreSizeLeft img.infoButton {
	margin-top: 5px;
	cursor:hand;
}


div.orderTyreResults{
	float: right;
}
td.sort {
	margin-left: 5px;
}


div.tyreLeft {
	float: left;
	width: 440px;
}
div.proceedToStep4 div.price,div.proceedToStep4 div.quantityLabel,div.proceedToStep4 div.quantityValue,div.proceedToStep4 div.proceedButton {
	float: left;
	margin-right: 5px;
	font-size:1.1em;
}
* html div.proceedToStep4 div.price, * html div.proceedToStep4 div.quantityLabel, * html div.proceedToStep4 div.quantityValue, * html div.proceedToStep4 div.proceedButton {
	margin-right: 10px;
}
div.proceedToStep4 div.price, div.proceedToStep4 div.quantityLabel {
	margin-top: 3px;
}
div.proceedToStep4 div.quantityValue {
	margin-top: 1px;
}
div.tyreRight {
	float: left;
	width: 105px;
	margin-left: 10px;
}
* html div.tyreRight {
	margin-left:10px;
}
div.tyreRight img {
	border: 1px solid #000;
	margin-bottom: 3px;
}
img.tyreSeparator {
	margin: 20px 0 5px 0;
}

#GarageSelect h3 {
	font-size:15px;
	margin-top:5px;
	margin-bottom:5px;
}
#GarageSelect {
	border-top:1px dotted #CCC;
	margin-top:20px;
	width:585px;
}
#GarageSelect table {
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
	wdith: 100%;
}
#GarageSelect td {
	border-bottom: 1px solid #CCC;
	border-left: 1px solid #CCC;
	padding: 3px;
}
#GarageSelect td.garage {
	width: 150px;
	text-align:center;
}
#GarageSelect td.city, #GarageSelect td.address {
	text-align: left;
}
#GarageSelect td.select {
	width: 50px;
	text-align:center;
}
#GarageSelect td.proceed {
	text-align: right;
	padding: 6px;
}


#TyreBasket table {
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
	wdith: 100%;
}
#TyreBasket tr.tr1 {
	font-weight: bold;
	background-color: #F9EDAC;
}
#TyreBasket td {
	border-bottom: 1px solid #CCC;
	border-left: 1px solid #CCC;
	padding: 3px;
}
#TyreBasket td.description {
	text-align: left;
}
#TyreBasket td.retailPrice, #TyreBasket td.lineValue {
	width: 80px;
	text-align:right;
}
#TyreBasket td.quantity {
	width: 50px;
	text-align:center;
}
#TyreBasket td.update {
	text-align: right;
	padding: 6px;
}

div.tyreSearchCustomer {
	margin-top: 20px;
}
div.tyreSearchCustomer td.col1 {
	width: 120px;
}
div.tyreSearchCustomer td.col2 {
	width: 120px;
}
div.tyreSearchCustomer td.col3 {
	width: 120px;
}
div.tyreSearchCustomer table {
	width: 580px;
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
}
div.tyreSearchCustomer td {
	padding: 3px;
	border-bottom: 1px solid #CCC;
	border-left: 1px solid #CCC;
}	
div.tyreSearchCustomer input {
}
div.tyreSearchCustomer input.title {
	width: 60px;
}

div.tyreSearchCustomer input.forename, div.tyreSearchCustomer input.surname {
	width: 125px;
}
div.tyreSearchCustomer input.company, div.tyreSearchCustomer input.address1, div.tyreSearchCustomer input.address2, div.tyreSearchCustomer input.address3, div.tyreSearchCustomer input.email {
	width: 98%;
}
div.tyreSearchCustomer input.address4, div.tyreSearchCustomer input.postcode, div.tyreSearchCustomer input.telephone {
	width: 96%;
}
div.tyreSearchCustomer textarea{
	width: 495px;
	height: 120px;
}
div.tyreSearchCustomer input.proceed {
	margin-right: 5px;
}
div.tyreSearchCustomer tr.tr1 {
	background-color: #F9EDAC;
}
img.quotationImage {
	border: 1px solid #000;
	margin-left: 10px;
}
p.downloadAcrobat {
	margin-top: 50px;
}
div.tyreSearchCustomer td.postcode {
	text-align: right;
}

div.tyre {
/*	width: 585px;
	border: 1px solid #000;*/
}

div.tyreImage,div.tyreDescription,div.tyreOptions {
	border: 0px solid #000;
}
div.tyreImage {
	width: 200px;
	float:left;
	text-align:center;
}
div.tyreImage img {
	border: 1px solid #000;
}
div.tyreDescription {
	width: 210px;
	float:left;
	margin-top: 5px;
	background-image:url(../png/tyresearch/vertical-background.png);
	background-position:right top;
	background-repeat:repeat-y;
	padding-right: 7px;
}
div.tyreOptions {
	width: 150px;
	margin-top: 5px;
	float:right;
}
div.tyreOption {
	margin-bottom: 3px;
}
div.tyreLabel {
	float: left;
	text-align:right;
	width: 85px;
	margin-top: 3px;
}
div.tyreValue {
	float: left;
	text-align:center;
	width: 50px;
	border: 0px solid #000;
}
div.proceed {
	margin-top: 4px;
}



/******** END TYRE-SEARCH CSS ********/
/********** VACANCIES CSS **********/
input.showVacancies {
	margin-left: 5px;
}
div.vacancies table {
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
	wdith: 100%;
}
div.vacancies tr.tr1 {
	font-weight: bold;
	background-color: #F9EDAC;
}
div.vacancies td {
	border-bottom: 1px solid #CCC;
	border-left: 1px solid #CCC;
	padding: 3px;
}
/****** END VACANCIES CSS ******/
/******** CONTACT US CSS ********/

div.contactSection {
	margin-top: 10px;
	margin-bottom:10px;
}
div.contactLeft {
	width: 30px;
	float:left;
	margin-right:10px;
}
div.contactRight {
	float: left;
	margin-top:5px;
}

div.commType {
	width: 75px;
	float:left;
}
div.contactForm {
	margin-top: 20px;
}
div.contactForm td {
	padding: 2px 5px 0px 0px;
}	
div.contactForm input.title {
	width: 40px;
}
div.contactForm input.forename, div.contactForm input.surname {
	width: 80px;
}
td.right {
	text-align: right;
}
div.contactForm input.company, div.contactForm input.address1, div.contactForm input.address2, div.contactForm input.address3 {
	width: 322px;
}
div.contactForm input.address4, div.contactForm input.postcode, div.contactForm input.telephone {
	width: 120px;
}
div.contactForm input.email, div.contactForm textarea.comments {
	width: 322px;
}
div.contactForm textarea {
	height: 100px;
}
div.contactForm input.submit {
	margin-right: 4px;
}
/****** END CONTACT US CSS ******/

/********** LOCATE A GARAGE CSS **********/
iframe.viaMichelin {
	width: 450px;
	height: 400px;
}
/******** END LOCATE A GARAGE CSS ********/


/* ================================================= */
/* CLASSES */
/* clearfix */
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/* ================================================= */