.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }

img { max-width: 100%; height: auto; }
.ie8 img { width: auto; }

body { background: white; color: #6d6e71; font-family: Roboto, Arial, sans-serif; font-size: 16px; line-height: 1.6em; }
#main, #footer-images { background: #f9f9f9; }
#site-footer:after { content: ""; display: block; background: #f9f9f9; height: 50px; }
#home-header { background: #000000; border-bottom: 5px solid #ff0000; }
a { color: #6d6e71; text-decoration: underline; }
a:visited { color: #6d6e71; }

.big { font-size: 22px; line-height: 28px; font-weight: 300; }
.intro { font-size: 18px; }

h1 { font-size: 30px; }
h1.page-header { font-weight: 300; }

nav ul { background: white; list-style: none; margin: 0; text-align: center; }
nav li { padding: 0 15px; margin: 0; display: inline-block; }
nav li:hover a { color: #ff0000; }
nav a { text-decoration: none; font-weight: 300; text-transform: uppercase; }
.home nav .home a, .about-us nav .about-us a, .contact-trans-tune nav .contact a, .diesel nav .diesel a, .services nav .services a, .tyres nav .tyres a, .location nav .location a, .quads nav .quads a { color: #ff0000; font-weight: 700; }

#topnav { position: relative; background: white url(images/nav-bg960x16.jpg) center top no-repeat; border-top: 1px solid #eeeeee; padding: 16px 15px 0 15px; margin-top: 10px; font-size: 16px; }
#topnav ul { padding: 10px 10px 15px 10px; }
#topnav a { font-size: 18px; }

.margin-wrap { margin: 0 auto; max-width: 960px; min-width: 260px; }

#top-banner { text-align: center; padding: 25px 15px 25px 15px; }
#top-banner img, #main img { display: block; margin: 0 auto; }

#home-logo { font-size: 40px; font-weight: bold; color: white; text-shadow: 0px 0px 12px rgba(0, 0, 0, 0.75); text-decoration: none; }
#center-header { font-size: 18px; font-weight: 300; text-align: center; }
.home #center-header { margin: 0 20%; }

#main { border-top: 1px solid #eeeeee; padding-top: 40px; }
.home #main { padding-top: 0; }
#main .margin-wrap { overflow: hidden; background: url(images/footer-images-bg960x6.jpg) center bottom no-repeat; padding-bottom: 6px; }
.home #main .margin-wrap { background: none; padding-bottom: 0; }

.page { margin: 0; padding: 15px; border: 1px solid #eeeeee; }

.page ul { margin: 1em 0 1em 0; padding: 0 0 0 1em; xx-list-style: disc inside; }
.page p { margin: 0.2em 0 0.2em 0; }

.services .page { background: white url(images/Button-red-services-60x65.jpg) 15px 15px no-repeat; padding-top: 70px; }
.quads .page { background: white url(images/Button-red-services-60x65.jpg) 15px 15px no-repeat; padding-top: 70px; }
.diesel .page { background: white url(images/Button-red-services-60x65.jpg) 15px 15px no-repeat; padding-top: 70px; }
.tyres .page { background: white url(images/Button-red-tyres-60x65.jpg) 15px 15px no-repeat; padding-top: 70px; }
.location .page { background: white url(images/Button-red-location-60x65.jpg) 15px 15px no-repeat; padding-top: 70px; }
.about-us .page { background: white url(images/Button-red-about-us-60x65.jpg) 15px 15px no-repeat; padding-top: 70px; }
.contact-trans-tune .page { background: white url(images/Button-red-contact-us-60x65.jpg) 15px 15px no-repeat; padding-top: 70px; }

#location-map  { position: relative; padding-bottom: 65.25%; padding-top: 30px; height: 0; overflow: hidden; margin: 25px 0; }
#location-map iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

#call-to-action { background: white; border: 1px solid #eeeeee; list-style: none; margin: 0 0 40px 0; padding: 0; text-align: center; }
#call-to-action li { display: inline-block; vertical-align: top; margin: 0 0 10px 0; /*border-left: 1px solid #eeeeee;*/ min-height: 130px; text-align: center; }
/*#call-to-action li:first-child { border-left-color: white; }*/
#call-to-action li a { display: block; padding: 80px 10px 0 0px; width: 270px; text-decoration: none; xx-text-align: left; }
#call-to-action .service { background: url(images/Button-red-services-60x65.jpg) 105px 20px no-repeat; }
#call-to-action .contact { background: url(images/Button-red-contact-us-60x65.jpg) 105px 20px no-repeat; }
#call-to-action .location { background: url(images/Button-red-location-60x65.jpg) 105px 20px no-repeat; }
#call-to-action .tyres { background: url(images/Button-red-tyres-60x65.jpg) 105px 20px no-repeat; }
#call-to-action .quads { background: url(images/Button-red-services-60x65.jpg) 105px 20px no-repeat; }
#call-to-action .diesel { background: url(images/Button-red-services-60x65.jpg) 105px 20px no-repeat; }

#call-to-action h2 { text-transform: uppercase; font-size: 24px; font-weight: 300; color: black; margin-bottom: 5px; }
#call-to-action p { margin-top: 5px; }


.row { overflow: hidden; clear: both; }

#footer-images { padding: 40px 0 40px 0; }
#footer-images .margin-wrap { background: url(images/footer-images-bg960x6.jpg) center bottom no-repeat; padding-bottom: 6px; }
#footer-images ul { background: white; border: 1px solid #eeeeee; list-style: none; margin: 0; padding: 4px 0 2px 0; text-align: center; }
#footer-images li { padding:  5.5px; margin: 0; display: inline-block; }

#footer-logos { list-style: none; margin: 0; padding: 0; float: left; }
#footer-logos li { padding: 0 15px; margin: 0; display: inline-block; }

#tyre-images { float: right; margin: 0 7px 0 60px; }
#tyre-images ul { margin: 0 -20px; background: white; xx-border: 1px solid #eeeeee; list-style: none; padding: 4px 0 2px 0; text-align: center; }
#tyre-images li { padding: 5.5px; margin: 0; xx-display: inline-block; }

#xx-tyre-logos { list-style: none; margin: 0; padding: 0; float: left; }
#xx-tyre-logos li { padding: 0 15px; margin: 0; display: inline-block; }

#site-footer { margin-top: 2px; padding-top: 20px; border-top: 1px solid #eeeeee; background: white url(images/site-footer-bg960x6.jpg) center top no-repeat; text-align: center; }

.big-phone { float: right; padding: 15px; font-size: 30px; font-weight: 700; }

.page p.intro { margin-bottom: 1em; }
.page p.spaced { margin-bottom: 1em; }

#websmart { padding: 10px 15px; float: right; font-size: 12px; }
#websmart a { text-decoration: none; color: #808184; }

#footer-nav { float: left; }
#footer-nav ul { padding: 10px 0; }
#footer-nav a { font-size: 14px; }

label { display: block; font-size: 16px; line-height: 25px; }
input { padding: 3px 0; }
input[type="submit"] { background: #ffcc00; border: none; text-transform: uppercase; padding: 10px 15px; font-size: 16px; font-weight: bold; }
.info-msg { background: #ffcc00; padding: 10px; }
.error-msg { background: #cc0000; padding: 10px; }

.schema_url { text-decoration: none; font-weight: 700; }

.pull-right { float: right; }
.text-inset { max-width: 40%; margin: 0 20px 20px 50px; }
.opening-hours td { padding: 3px 5px; }


@media screen and (max-width: 960px) {
	#call-to-action li { border-left: 0; }
	#tyre-images { margin-right: 15px; }
}

@media screen and (max-width: 650px) {
	.big-phone, #footer-logos { float: none; }
	#websmart, #footer-nav { float: none; }
	.home #center-header { margin: 0 25px 35px; }
	.intro { font-size: 16px; }
	.big { font-size: 20px; line-height: 25px; }
	.text-inset { float: none; margin-left: 0; max-width: 100%; }
	#tyre-images { display: none; }
}

@media screen and (max-width: 520px) {
        #footer-images { display: none; }
}