@import url("firefox.css");

/*
@font-face {  
  font-family: "dearjoe 5 CASUAL";  
  src: url(/fonts/dearjoecasual.eot);
  src: local("dearjoe 5 CASUAL"), url(/fonts/dearjoecasual.ttf) format("truetype");
}
*/

@font-face {
    font-family: 'ArtBrushMedium';
    src: url('/fonts/artbrush-webfont.eot');
    src: url('/fonts/artbrush-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/artbrush-webfont.woff') format('woff'),
         url('/fonts/artbrush-webfont.ttf') format('truetype'),
         url('/fonts/artbrush-webfont.svg#ArtBrushMedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
	margin: 0; padding: 20px 0;
	background: #EBEBEB; color: #65686B;
	text-align: center;
	font-family: Arial, Sans-Serif; font-size: 14px;
	-webkit-text-size-adjust: none;
}

h1,h2, h3, h4, h5, p { margin: 0; }
h3, h4 { color: #666; margin: 0 0 14px 0; padding: 0 0 3px 0; width: auto; display: inline; }
h1 { font-size: 24px; font-weight: bold; font-family: Arial; color: #185C8E; letter-spacing: -1px; line-height: 32px; text-transform: uppercase; }
h1.full-page { font-family: Arial!important; color: #65686B; margin: 0; padding: 7px 0; text-align: left; letter-spacing: 0; font-size: 18px; font-weight: normal; line-height: 24px; text-transform: none; }
h2 { font-size: 18px; font-weight: bold; font-family: Arial; color: #185C8E; letter-spacing: -1px; line-height: 32px; text-transform: uppercase; }
h2.full-page { font-family: Arial!important; color: #65686B; margin: 0; padding: 7px 0; text-align: left; letter-spacing: 0; font-size: 18px; font-weight: normal; line-height: 24px; text-transform: none; }
h3 { font-size: 18px; font-weight: normal; font-family: Arial; color: #185C8E; line-height: 32px; text-transform: none; }
h4 { font-size: 30px; font-weight: normal; font-family: Arial; }

hr { color: #E67817; background: #E67817; border:0; height: 2px; margin: 10px 0; clear: both; }
hr.white { color: #FFF; background: #FFF; }

p { padding: 7px 0; text-align: left; line-height: 20px; }

a { color: #E67817; text-decoration: none; }
a:hover { color: #005D9C; }

img { border: 0; }
img.right { display: block; float: right; }
img.ad-banner { margin: 20px 0 0 0; display: block; }
img.ad-banner.short { margin: 13px 0 0 0; }
img.product-image { margin: 10px 20px 5px 20px; float: right; }
img.tool {margin: 15px 0 20px 0; display: block; float: right;}

input.flright { float: right !important; }

ul li, ol li { margin: 0; padding: 5px 0; }

div.cycle { margin: 0 20px 5px 20px; padding: 0; float: right; }
div.cycle img { margin: 0; padding: 0; }

.uc { text-transform: uppercase; }
.hide { display: none; }
.red { color: #BF0000; }
.clear { clear: both; }
.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }
.small { font-size: 11px; }
.medium { font-size: 14px; line-height: 20px; }
.flat { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.flat li { margin: 0; padding: 0; }
.intro { font-size: 18px; font-weight: normal; line-height: 24px; }
.two-col { width: 120px; margin: 0; padding: 10px 20px 10px 0; display: block; float: left; font-size: 12px; }
.two-col.end { padding: 10px 0; }
.three-col { width: 135px; margin: 0; padding: 10px 0 20px 0; float: left; font-size: 12px; }
.three-col.wide { width: 160px; }
.contact-info { margin: 20px 0 0 0; padding: 10px 0; }
.quote { font-family: 'ArtBrushMedium'; color:#E67817; font-size: 35px; text-align: left; padding:  30px 0 0 0; }

/************************************************************************* layout ***/

#container {
	width: 950px;
	margin: 0 auto; padding: 0;
	text-align: left;
	background: #FFF;
}

/************************************************************************* header ***/

header {
	width: 950px; height: 120px;
	margin: 0; padding: 0;
	display: block; clear: both;
	background: url(../images/miles-hire.jpg) no-repeat;
}
header a.logo {
	width: 307px; height: 55px;
	margin: 19px 15px 0 0; padding: 0;
	display: block; float: right;
}
header a.logo span { display: none; }

nav {
	width: 950px; height: 30px;
	margin: 0 0 10px 0; padding: 0;
	display: block; clear: both;
	background: #E67817;
	border-bottom: #EBEBEB 10px solid;
}
nav ul { margin: 0; padding: 0 0 0 10px; list-style: none; text-transform: uppercase; }
nav ul li { margin: 0; padding: 0 49px 0 0; display: block; float: left; font-size: 14px; font-weight: bold; }
nav ul li.end { padding: 0; background: none; }
nav ul li a { margin: 0; padding: 7px 6px; display: block; color: #FFF; }
nav ul li a:hover { background: #d76d0f; color: #FFF; }

#reel { width: 930px; height: 134px; margin: 0 auto; padding: 0; clear: both; background: #000; }

/************************************************************************* content ***/

article {
	width: 735px; min-height: 520px;
	margin: 0 0 20px 0; padding: 10px 0 0 30px;
	display: block; float: left;
	border-left: #d7d7d7 2px solid;
}

article a { color: #005D9C; text-decoration: none; }
article a:hover { color: #E67817; }

aside {
	width: 153px;
	margin: 10px 0 10px 0; padding: 0 10px 0 20px;
	display: block; float: left; clear: both;
}

section.main {
	width: 435px;
	margin: 0; padding: 0 15px 10px 0;
	display: block; float: left;
}
section.main.home { padding: 10px 15px 10px 0; }

section.full-page {
	width: 700px;
	margin: 0; padding: 0 35px 20px 0;
	display: block; float: left;
}

section.side {
	width: 270px;
	margin: 0; padding: 0px 10px 10px 0;
	display: block; float: left;
}

section.side h3 { font-family: Arial; font-size: 14px; font-weight: bold; color: #65686B; text-transform: none; }

section ul { padding-left: 20px; font-size: 12px; }

ul.categories, ul.categories li ul { margin: 0; padding: 0; list-style: none; }
ul.categories { margin: 0; padding: 0 0 0 11px; display: block; clear: both; }
ul.categories li { margin: 0; padding: 4px 0; color: #666; font-size: 12px; font-weight: bold; text-transform: uppercase; }
ul.categories li.external { padding: 30px 0 0 0; }
ul.categories li a { color: #185C8E; }
ul.categories li ul { margin: 0; padding: 5px 0; }
ul.categories li ul li { margin: 0 0 1px 0; padding: 2px 5px; color: #666; font-size: 11px; font-weight: normal; text-transform: none; border-left: #E67817 5px solid; }
ul.categories li ul li:hover { border-left: #1B5D8F 5px solid; }
ul.categories li ul li a { color: #BB5B07; }
ul.categories li ul li a:hover { color: #1B5D8F; }

ul.action { margin: 0 15px 20px 0; padding: 0; clear: both; float: right; list-style: none; }
ul.action li { margin: 0; padding: 0 5px 0 0; display: block; float: left; }
ul.action li a, ul.action li span {
	width: 220px; height: 80px;
	margin: 0; padding: 0;
	display: block; float: left;
}
ul.action li a span, ul.action li span span { display: none; }
ul.action li a.download { background: url(../images/button-download.gif) no-repeat; }
ul.action li span.advice { background: url(../images/button-advice.gif) no-repeat; }
ul.action li a.contact { background: url(../images/button-enquiry.gif) no-repeat; }
ul.action li a:hover { background-position: 0 -80px; }

ul.sub { margin: 0; padding: 20px 0 0 0; list-style: none; }
ul.sub li { width: 170px; margin: 0; padding: 0 10px 20px 0; display: block; float: left; text-align: center; font-size: 14px; font-weight: bold; }
ul.sub li.end { padding: 0; }
ul.sub li a { margin: 0; padding: 0; display: block; }
ul.sub li a img { margin: 0 0 5px 0; display: block; border: #D7D7D7 2px solid; }
ul.sub li a br { display: none; }

ul.sitemap { margin: 0; padding: 0 40px 0 0; list-style: none; }
ul.sitemap li { margin: 0; padding: 10px 0; display: block; clear: both; }

/************************************************************************* social******************/

#online-quote{ position:fixed; width:33px; height:330px; right:0px; background:url(/images/online-quote-tab.png) no-repeat; top:15%; z-index: 24; cursor: pointer;}
#online-quote span { display: none;}
.online-quote-slider{ position:fixed; padding: 0 0 20px 0; min-height:406px; border: 10px solid #1B5D8F; background:#1B5D8F; width:496px; right:0px; margin-right: -516px; top:15%; z-index: 24;}
.online-quote-slider p { color: #FFF; padding: 10px 0 0 0;}

/*.online-quote-slider .error { width: 300px; display: inline-block; float: left; padding: 10px; margin: 0 88px 20px 88px; background: #093C60;}
.online-quote-slider .error p{ font-size: 12px; margin: 0; padding: 0; text-align: center;}*/

.online-quote-slider label { color: #FFF;}
.online-quote-slider dt { width: 130px!important;}
.online-quote-slider fieldset.contact_form { width: 426px;}
.online-quote-slider fieldset.contact_form select { width: 208px; height: 30px; padding: 4px 0; text-align: left; color: #0E5073;}
.online-quote-slider fieldset.contact_form dl dd input#btnsubmit { width: 210px; }
.online-quote-slider fieldset.contact_form dl dd input#btnsubmit:hover { background: #D76D0F; }
.online-quote-slider .intro { display: block; float: left; margin: 0; padding: 0 10px 0 25px;}
.online-quote-slider .intro p { font-weight: bold; font-size: 14px;}
.ui-widget-header { background: #EBEBEB!important; color: #185C8E!important; text-transform: uppercase; font-weight: bold!important; font-family: Arial Black!important;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background: #E47825!important; color: #FFF!important; border: 1px solid #FFF!important;}
.ui-datepicker th { color: #1B5D8F!important;}
.ui-widget-content { color: #D76D0F!important;}
.ui-state-hover { background: none!important; }
#ui-datepicker-div { background: #FFF!important; }
.ui-datepicker-header { background: #1B5D8F!important; border: none!important; Color: #FFF!important;}
.ui-widget-header .ui-icon { background-image: url(/images/ui-icons_222222_256x240.png)!important;}

/************************************************************************* footer ***/

footer {
	width: 930px; height: 60px;
	margin: 0; padding: 14px 10px 0 10px;
	display: block; clear: both;
	background: #1B5D8F; color: #FFF;
	border-top: #E67817 5px solid;
	font-size: 12px;
}
footer a:hover { color: #FFF; }
footer a.right { margin: 0 0 0 20px; float: right; }

.copyright { width: 100%; display: inline-block; margin: 0 auto 10px auto; padding: 0; text-align: center;}
.links { width: 100%; display: inline-block; margin: 0 auto; padding: 0; text-align: center;}
/************************************************************************* slider ***/

#slider1 { width: 950px; height: 114px; clear: both; overflow:hidden; margin: 0; padding: 4px 0 0 0; border-top: #EBEBEB 10px solid; border-bottom: #EBEBEB 10px solid; }
#slider1 .viewport { margin: 0; float: left; width: 950px; height: 114px; overflow: hidden; position: absolute; z-index: 1; }
#slider1 .buttons { background:url(../images/buttons.png) no-repeat scroll 0 0 transparent; display: none; margin: 65px 0 0 4px; background-position: 0 -38px; width: 39px; height: 37px; overflow: hidden; position: absolute; z-index: 99; float: left; }
#slider1 .buttons span { display: none; }
#slider1 .next { background-position: 0 0; margin: 64px 0 0 728px; }
#slider1 .disable { visibility: hidden; }
#slider1 .overview { list-style: none; position: absolute; padding: 0; margin: 0; left: 0; top: 0; }
#slider1 .overview li { width: 97px; height: 114px; margin: 0 11px; padding: 0; display: block; float: left; border: 0; }
#slider1 .overview li .product-info .title { padding: 10px 0 0 0; }
#slider1 .overview li a.product-image { margin: 5px 0 0 0; }

/************************************************************************* forms ***/

fieldset.contact_form {
	width: 326px;
	margin: 10px 40px 0 0; padding: 0;
	float: left;
}
fieldset.contact_form dl dt { width: 100px; margin: 3px 0; padding: 5px 5px 0 0; float: left; clear: both; font-size: 14px; text-align: right; }

fieldset.contact_form dl dd { 
	position: relative;
	width: 210px; 
	margin: 3px 0;  
	float: left; 
}

fieldset.contact_form dl dd label.error {
	position: absolute;
	top: 2px;
	right: 4px;
	display: inline-block;
	margin: 0;
	padding: 2px;
	font-size: 0.8em;
	color: #fff;
	background-color: #a00;
}
fieldset.contact_form dl dd label#inputagree-error {
	position: absolute;
	top: 0;
	left: 0;	
	font-size: 0.8em;
	margin-bottom: 5px;
	text-align: center;
}

fieldset.contact_form dl dd #inputagree-container {
	display: block;
	margin: 20px 0;
	font-size: 1.0em;
	line-height: 1.2em;
}
fieldset.contact_form dl dd #inputagree-container #inputagree {
	display: inline-block;
	width: 15px;
	height: 15px;
}

.online-quote-slider fieldset.contact_form dl dd #inputagree-container {
	color: #fff;
}

fieldset.contact_form dl dd input#btnsubmit {
	margin: 0; padding: 10px;
	background: #E67817; color: #FFF; border: 0;
	cursor: pointer;
	font-size: 14px; font-weight: bold; font-family: Arial, Sans-Serif; text-transform: uppercase;
}

fieldset.contact_form dl dd input#btnsubmit:hover { background: #1B5D8F; }

form, fieldset, dl, dt, dd { margin: 0; padding: 0; border: 0; }
input.text, textarea.text {
	width: 200px; padding: 5px 3px;
	border: #C8DBEA 1px solid; color: #0E5073;
	font-size: 14px; font-family: Arial, Sans-Serif;
}
textarea.text { height: 100px; }
input.postcode { width: 90px; }
form.add-basket { margin: 0; padding: 0 0 70px 0; }

/************************************************************************* MultiBox v1.3 ***/

.MultiBoxContainer {
	position: absolute;
	border: 20px solid #FFF;
	background-color: #FFF !important;
	display: none;
	z-index: 2;
	text-align: left;
}

.MultiBoxLoading {
	background: url(../images/multibox/loader.gif) no-repeat center;
}

.MultiBoxContent {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.MultiBoxClose {
	position: absolute;
	top: -26px;
	right: -26px;
	background: url(../images/multibox/close.png) no-repeat;
	width: 24px;
	height: 24px;
	cursor: pointer;
}


.MultiBoxControlsContainer {
	overflow: hidden;
	height: 0px;
	width: 100%;
	position: relative;
}

.MultiBoxControls {
	width: 100%;
	height: auto;
	background-color: #FFF;
	padding: 0 0 2px 0;
	position: absolute;
	bottom: 0px;
}


.MultiBoxPrevious {
	position: absolute;
	background: url(../images/multibox/left.png) no-repeat;
	width: 24px;
	height: 24px;
	left: 0px;
	margin-top: 5px;
	cursor: pointer;
}

.MultiBoxNext {
	position: absolute;
	background: url(../images/multibox/right.png) no-repeat;
	width: 24px;
	height: 24px;
	right: 0px;
	margin-top: 5px;
	cursor: pointer;
}

.MultiBoxNextDisabled {
	cursor: default;
	background: url(../images/multibox/rightDisabled.png) no-repeat;
}

.MultiBoxPreviousDisabled {
	cursor: default;
	background: url(../images/multibox/leftDisabled.png) no-repeat;
}

.MultiBoxTitle {
	position: relative;
	margin: 10px 0 0 35px;
	padding: 0 0 0 10px;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #2E2E2E;
	font-weight: bold;
	text-align: left;
}

.MultiBoxNumber {
	position: relative;
	width: 50px;
	margin: 10px 35px 0 0;
	float: right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666;
	text-align: right;
}

.MultiBoxDescription {
	clear: left;
	position: relative;
	margin: 0 35px 0 35px;
	padding-top: 5px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFF;
	text-align: left;
}

/************************************************************************* new ***/
article.thanks { min-height: 200px;}
aside h2 {font-size: 20px;}
img.miles-hire-side { display: block; float: left; margin: 20px 0 0 0; padding: 0;}
.areas-covered { width: 910px; display: block; float: left; margin: 0; padding: 20px; border-top: 10px solid #EBEBEB; border-bottom: 10px solid #EBEBEB;}
.areas-covered h3 { width: 910px; display: block; float: left; clear: both; border-bottom: 2px solid #D7D7D7; margin: 0 0 20px 0; padding: 0;}
.areas-covered ul { width: 227px; display: block; float: left; margin: 0; padding: 0; list-style: none;}
.areas-covered ul li { width: 207px; display: block; float: left; font-size: 12px; margin: 0; padding: 0 0 10px 20px; background: url(../images/location-icon.png) no-repeat;}
.two-column { width: 350px; display: block; float: left; margin: 0; padding: 0; font-size: 12px;} 