/*-----
>> Stylesheet copyright Vehicle Medic Ltd 2012
>> Design by Artome - www.artome.co.uk
>> Website and stylesheets by Theo Gray - www.theogray.com 
-----*/

/*----- Global -----*/
* { margin: 0; padding: 0; border: 0; }

/*----- Page Setup -----*/
body { background-color: #fff; color: #000; line-height: 1.0em; font-family: Arial, Helvetica, Sans-Serif; }
#header, #footer, #contentheader, #contentbody, #contentfooter, .bodyfooter { width: 815px; margin: 0 auto; }
#header { height: 131px; }
#content { background-image: url(/Style/artome/bg.jpg?130102); background-repeat: no-repeat; background-position: center -5px; clear: both; } /* center 15px */
#contentbody { height: 227px; margin: 0 auto; padding: 0 0 54px 0;}
.homewrap #contentbody { padding-left: 10px; padding-right: 10px; background-color: #fff; }

/*----- Header -----*/
#header h1, #header p, #header ul ul li { position: absolute; left: -2000px; top: -2000px; }
#header .logo { float: left; width: 352px; margin-right: 8px; height: 131px; background-image: url(/Style/artome/logo.gif); background-position: 0 center; background-repeat: no-repeat; cursor: pointer; }
#header ul { list-style: none; font-family: "Arial Black", Arial, Helvetica, Sans-Serif; font-weight: bold; }
#header ul.nav { float: left; margin-top: 35px; }
#header ul.nav ul { float: none; }
#header ul li { float: left; display: inline; list-style-type: none; font-size: 13px; font-weight: bold; text-transform: uppercase; text-align: center; }
#header ul li.first { padding-left: 6px; }
#header ul.nav a, #header ul.nav a:link, #header ul.nav a:visited { padding: 6px 6px; margin: 0 2px; color: #000; text-decoration: none; }
#header ul.nav a:hover, #header ul.nav a:active, #header ul.nav a.active { color: #58595B; }
#header ul.navBanner { float: right; margin-bottom: 10px; position: relative; top: 0px; font-family: Arial, Helvetica, Sans-Serif; }
#header ul.navBanner li { font-size: 10px; }
#header ul.navBanner li span { text-transform: none; }
#header ul.navBanner li.navContact { margin-right: 55px; }
#header ul.navBanner li.navContact a { width: 370px; }
#header ul.navBanner a, #header ul.navBanner a:link, #header ul.navBanner a:visited { display: inline-block; text-decoration: none; color: #fff; background-color: #58595B; padding: 3px 15px 5px 15px; -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; }
#header ul.navBanner li.navlogin a, #header ul.navBanner li.navlogin a:link, #header ul.navBanner li.navlogin a:visited { background-color: #fff; }
#header ul.navBanner a:hover, #header ul.navlogin a:active, #header ul.navBanner li.navlogin a:hover, #header ul.navBanner li.navlogin a:active { text-decoration: none; background-color: #58595B; }
#header #socialicons { float: right; width: 50px; height: 23px; margin-top: 27px; margin-right: 0; text-align: right; }
#header #socialicons a { text-decoration: none; color: #fff; font-size: 10px; }
#header #socialicons img { padding-right: 2px; }
#header #socialicons a.cookieprivacy { display: block; margin-right: 10px; height: 5px; }
#header .placeholder { float: left; width:400px; height: 75px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; overflow: hidden; background-color: #dcddde; }

/*----- Content -----*/
#contentheader, #contentbody, #contentfooter { color: #231F20; }
#contentheader .block, #contentbody .block, #contentfooter .block, .panel { float: left; }
#contentheader .left, #contentbody .left, #contentfooter .left { width: 350px; }
#contentheader .right, #contentbody .right, #contentfooter .right { width: 455px; padding-left: 10px; }
#contentheader { font-size: 14px; }
#contentbody .block { height: 144px; }
.panel { height: 98px; }
#contentheader li { margin-bottom: 10px; }
#contentheader ul.homelist li { font-size: 13px; }
#contentheader h2 { font-style: italic; font-size: 28px; font-weight: normal; margin: 5px 0 20px 0; }
#contentheader abbr { color: #E30E23; cursor: help; font-weight: bold; }
#contentheader h2 abbr { font-weight: normal; }
#contentheader ul { padding: 0 0 0 20px; }
#contentheader .error p { margin: 5px 0; }
#contentfooter h3, #contentfooter h1.section { font-weight: bold; font-style: italic; font-size: 18px; border-top: 1px dotted #404041; border-bottom: 1px dotted #404041; padding: 5px 0; margin: 2px 0 5px 0; }
#contentfooter p { font-size: 12px; }
#contentfooter abbr { color: #E30E23; cursor: help; }
#contentfooter a, #contentfooter a:link, #contentfooter a:visited, #contentfooter a:hover, #contentfooter a:active { font-weight: bold; color: #231F20; }

#contentbody .repairlist { float: left; margin-top: 28px; }
#contentbody .repairlist li { list-style-type: none; margin-bottom: 0; }
#contentbody .repairlist a { display: block; width: 184px; font-size:14px; color: #fff; padding: 8px; text-decoration: none;
  background: #222; /* for non-css3 browsers */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3F3F40', endColorstr='#222222'); /* for IE */
  background: -webkit-gradient(linear, left top, left bottom, from(#3F3F40), to(#222)); /* for webkit browsers */
  background: -moz-linear-gradient(top,  #3F3F40,  #222); /* for firefox 3.6+ */  }
#contentbody .repairlist a:hover, #contentbody .repairlist a.active { font-weight: bold; }
#contentbody .repairimage { width:600px; height:195px; float:right; padding: 82px 0 0 10px; font-size: 28px; font-style: italic; line-height: 1.0em;
                         color: #000; background-image:url(/Style/artome/repair.png); background-repeat:no-repeat; background-position: right bottom; }
#contentfooter .repairsection { clear:both; padding-top: 32px; }
#contentfooter .repairsection.first { padding-top: 0; }
#contentbody .repairimage abbr { color: #E30E23; cursor: help; }
#contentfooter .repairblock { float: left; }
#contentfooter .repairblock.left { width: 310px; }
#contentfooter .repairblock.right { width: 495px; padding-left: 10px; }
#contentfooter ul { padding: 0 0 0 20px; font-size: 12px; }
#contentfooter li { margin-bottom: 0; }
#contentfooter p { margin: 5px 0 10px 0; }
#contentfooter .repairblock .before { padding-right: 5px; }
#contentfooter .repairblock .backtotop { text-align: right; background-color: transparent; position: absolute; height: 34px; width: 292px; padding: 163px 18px 0 0; margin:0; background-image:url(/Style/artome/to-top.gif); background-repeat: no-repeat; background-position: right 185px; }
#contentfooter .repairblock.left p.contact { margin: 5px 0 0 0; float: left; font-weight: bold; line-height: 1.2em; text-align: left; }
#contentfooter .individual .repairblock.left p.contact { margin-top: 20px; float: none; }
#contentfooter .repairblock.left p.gototop { padding-top: 14px; }
/* .repairblock .repairimageoverlay { background-image: url(/Style/artome/after.png); background-position: left top; background-repeat: no-repeat; width: 245px; height: 29px; float: left; z-index: 99; position: absolute; background-color: transparent; } */
.backtotop a, .backtotop a:link, .backtotop a:visited { text-decoration: none; }
.backtotop p.contact a, .backtotop p.contact a:link, .backtotop p.contact a:visited { text-decoration: underline; }
.backtotop a:hover, .backtotop a:active { text-decoration: underline; }

#contentfooter .franchiseblock li span { color: #E30E23; }
#contentfooter .franchiseblock { float: left; width: 350px; }
#contentfooter .franchiseblock ul { margin-bottom: 32px; }
#contentfooter .franchiseblock p { font-weight: bold; font-style: italic; }
#contentfooter .franchiseblock p span { text-transform: uppercase; }

.contactcontent { height: 144px; padding: 60px 0; float: left; position: absolute; }
.contactsection, .login { height: 144px; background-color: #236314; }
.contactcontent .contactsection { margin-left: 20px; width: 556px; } /* margin-left: 50px; with AZIF */
.contactsection {
  background: #236314; /* for non-css3 browsers */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#84BE3F', endColorstr='#236314'); /* for IE */
  background: -webkit-gradient(linear, left top, left bottom, from(#84BE3F), to(#236314)); /* for webkit browsers */
  background: -moz-linear-gradient(top,  #84BE3F,  #236314); /* for firefox 3.6+ */  }
.contactfranchise { width: 182px; height: 124px; padding: 10px; margin-left: 7px; background-color: #236314; }
.contactsection, .contactfranchise, .login { float: left; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
.contactinfowrap { float: left; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; overflow: hidden; }
.contactinfowrapper { float: left; overflow: hidden; background-image: url(/Style/artome/quote-home.png); width:455px; height:147px; }
.contactmedic { float:left; height:124px; margin:0; width: 50px; } /* height: 263px; margin: -59px 0 -59px -70px; width: 141px; background-image: url(/Style/artome/medic.png); background-repeat: no-repeat; background-position: left top; */
#contentbody .contactinfo p, .contactblock td { text-align:center; font-family: 'Arial Narrow', Arial, Helvetica, Sans-Serif; text-shadow: #236314 -1px -1px 4px; font-weight: bold; font-style: italic; line-height: 1.0em; color: #fff; }
#contentbody .contactfranchise p { text-shadow: #000 0 -1px 1px; }
#contentbody .contactinfo p.subhead, #contentbody .contactinfo p.phone, #contentbody .contactinfo p.anytime, #contentbody .contactinfo p.estimate { text-transform: uppercase; }
#contentbody .contactinfo p.subhead { font-size: 15px; } /* 24px */
#contentbody .contactinfo p.phone { font-size: 34px; letter-spacing: -2px; margin-top: 2px; }
#contentbody .contactinfo p.email { font-size: 15px; }
#contentbody .contactinfo p.anytime { font-size: 21px; letter-spacing: -0.5px; font-style: normal; width: 110px; margin: 17px 0 0 20px; }
#contentbody .contactinfo p.anytime span { font-size: 24px; letter-spacing: -0.5px; display: block; }
#contentbody .contactinfo p.estimate { font-size: 11px; letter-spacing: -0.5px; font-style: normal; width: 110px; margin: 1px 0 0 20px; }
#contentbody .contactfranchise p.subhead { font-size: 24px; }
#contentbody .contactfranchise p.subhead, #contentbody .contactfranchise p.email { letter-spacing: -1px; }
#contentbody .contactfranchise p.phone { letter-spacing: -3px; }
#contentbody .contactinfo a { color: #fff; text-decoration: none; }
#contentbody .contactinfo a:hover, #contentbody .contactinfo a:active { text-decoration: underline; }
#contentbody .contactblock { float: left; margin: 5px 0 0 0; } /* 18px 0 */
#contentbody .contactblock.left { height: 139px; background-image: url(/Style/artome/azif-contact.png); background-repeat: no-repeat; background-position: 125px bottom; }
#contentbody .contactcontent .contactblock { width: 250px; height: 139px; }
#contentbody .contactcontent .contactblock.left { margin-left: 0; width: 220px; }
#contentbody .block .contactblock { width: 226px; }
#contentbody .block .contactblock.right { padding-left: 0; }
/* #contentbody .contactblock.right { border-left: solid 1px #236314; } */
#contentbody .contactblock input { padding: 2px; }
#contentbody .contactblock input.loginbutton { padding: 4px 10px; }
form.emailus { margin: 0 10px 0 10px; }
.contactform form.emailus { margin: 0 24px 0 24px; }
form.emailus input { width: 200px; font-size: 12px; margin-bottom: 5px; padding: 4px; border-top: 2px ridge #236314; display: block; }
form.emailus input.getquote { width: 153px; height: 41px; border: none; margin: 0 -2px 0 0; } 
.contactform form.emailus input.getquote { margin-right: 2px; }
form.emailus input.quotepostcode { padding: 5px; width: 85px; font-size: 12px; margin: 2px 2px 0 0; float: left; }
form.emailus input.quotebutton { width: 35px; height: 35px; border: none; margin: 0; padding: 0; border-top: none; }
form.emailus input.getquote:hover { src: url(/Style/artome/getquote-up.gif); }
.franchiseefooter { margin-bottom: 20px; }
.franchiseefooter a { font-weight: bold; width: 815px; height: 43px; background-image: url(/Style/artome/franchisee-footer.png); display: block; text-decoration: none; margin-bottom: 10px; }
.franchiseefooter span { padding: 13px 20px; display: block; font-family: "Helvetica Nueue", Arial, Helvetica, Sans-Serif; font-style: italic; font-size: 14px; color: #231f20; }
.placeholder, .quotes { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; overflow: hidden; background-color: #dcddde; }
.placeholder { width:352px; height: 98px; }
.quotes { width: 334px; height: 86px; padding: 8px; }
.services h1, .quotes h2 { font-size: 14px; padding: 0 0 5px 0; font-weight: bold; font-style: italic; color: #000; border-bottom: 1px dotted #404041; margin-bottom: 6px; }
.quotes h2 { background-color: #dcddde; }
.blogsummary { height: 147px; overflow: auto; }
.blogsummary h2 { font-size: 18px; font-style: italic; font-weight: normal; line-height: 1.2em; color: #d00; border-bottom: 1px dotted #404041; margin-bottom: 6px; padding: 5px 0; }
.blogsummary p, .quotes p { font-size: 11px; line-height:1.4em; }
.blogsummary p.readmore a, .quotes p.person { font-weight: bold; font-style: italic; text-decoration: none; color:#000; }
.testimonial { width: 334px; height: 82px; }
.testimonial .quotebutton { float: right; margin: 0 2px; }

.operatorinfo, .contactform, .repairvideo { float: left; }
.operatorinfo { width: 322px; }
.operatorcontact { width: 785px; height: 165px; color: #fff; padding: 15px;
  background: #3f3f40; /* for non-css3 browsers */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3f3f40', endColorstr='#222222'); /* for IE */
  background: -webkit-gradient(linear, left top, left bottom, from(#3f3f40), to(#222222)); /* for webkit browsers */
  background: -moz-linear-gradient(top,  #3f3f40,  #222222); /* for firefox 3.6+ */
}
.operatorinfo p { margin-bottom: 5px; }
.operatorinfo a, .operatorinfo a:link, .operatorinfo a:visited, .operatorinfo a:hover, .operatorinfo a:active { color: #fff; text-decoration: none; }
.operatorinfo .name { font-size: 21px; font-weight: bold; }
.operatorinfo .number { font-size: 21px; font-style: italic; }
.operatorinfo .service, .operatorinfo .address { font-size: 12px; }
.operatorinfo .address { margin-top: 15px; background-position: top left; background-repeat: no-repeat; padding-left: 160px; height: 100px; overflow: hidden; }
.contactform { width: 258px; }
#ContactFormResult { float: left; margin: 10px; padding: 40px 0 0 0; width: 443px; font-size: 21px; font-style: italic; text-align: center; display: none; color: fff; font-weight: bold; line-height: 1.4em; }
#ContactFormResult img { display: block; margin: 10px auto 0 auto; }

.services ul { float: left; width: 170px; height:96px; overflow: hidden; font-size: 12px; padding: 0; margin: 0 0 0 5px; list-style-position: inside; }
.services ul li { padding: 0; margin: 0; }


/*----- Footer -----*/
#footer { clear: both; padding: 70px 0 0 0; font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #404041; }
#footer ul { list-style: none; }
#footer ul li { width: 191px; float: left; margin-right: 17px; font-weight: normal; text-align: left; display: inline; }
#footer ul li.comingsoon { background-image: url(/Style/artome/comingsoon.gif); background-repeat: no-repeat; background-position: 60px center; }
#footer ul li.last { margin-right: 0; }
#footer ul ul li { float: none; display: block; width: auto; margin: 0; padding: 0; }
#footer h4 { border-bottom: 1px dotted #404041; font-weight: bold; padding: 5px 0; margin-bottom: 6px; }
#footer a, #footer a:link, #footer a:visited, #footer a:hover, #footer a:active { color: #404041; text-decoration: none; }
#footer a:hover, #footer a:active { text-decoration: underline; }
#footer .sitedev { display: none; }

/*----- Below Footer -----*/
.bodyfooter { margin: 10px auto; font-size: 11px; text-align: center; }
.disclaimer { color: #404041; clear: both; padding: 30px 0 40px 0; }
.bodyfooter .disclaimer p { font-size: 11px; text-align: center; }
.bodyfooter .areas { color: #aaa; }
.bodyfooter .areas a { text-decoration: none; color: #aaa; }
.areascovered { display: none; }


/*----- Contact Msg -----*/
.jqmWindow { display: none; position: fixed; top: 17%; left: 50%; }
	.jqmOverlay { background-color: #fff; }
/* Background iframe styling for IE6. Prevents ActiveX bleed-through (<select> form elements, etc.) */
* iframe.jqm {position:absolute;top:0;left:0;z-index:-1;
	width: expression(this.parentNode.offsetWidth+'px');
	height: expression(this.parentNode.offsetHeight+'px');
}
/* Fixed posistioning emulation for IE6
     Star selector used to hide definition from browsers other than IE6
     For valid CSS, use a conditional include instead */
* html .jqmWindow {
     position: absolute;
     top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}
#contactmsg { margin-left: -225px; width: 450px; height: 200px; background-color: #fff; border: solid 1px #eee; text-align: center; }
#contactmsg p { margin-top: 50px; font-weight: bold; font-style: italic; font-size: 20px; line-height: 1.3em; }
#contactmsg p.close { font-weight: normal; font-size: 14px; margin-top: 25px; }
#contactmsg p.close a { cursor: pointer; text-decoration: underline; }

/*----- Standard classes -----*/
.inline_left { float: left; margin: 0 10px 10px 0; }
.inline_right { float: right; margin: 0 0 10px 10px; }
.clearing { clear: both; display: block; border: none; }
.hide { display: none; visibility: hidden; }
.withclick { cursor: pointer; }
.column { float: left; margin-right: 50px; }
.noborder { border: none; }
.heading, .header { font-weight: bold; }
.empherror { font-weight: bold; color: #900; }
.emphgood { font-weight: bold; color: #090; }