html, body, ul, ol, li, p,
h1, h2, h3, h4, h5, h6,
form, fieldset, a, img, div, header, nav, span, dl, dt, dd {margin: 0; padding: 0; border: 0;}

ul, li, p, h1, h2, h3, h4, h5, h6, a, img {font-weight: 400;}

ul, ol {list-style-type: none;}

/*
span, img, a {display: block;}
*/

h1 {font-size: 1.2em; font-weight: 600;}
h2, h3 {font-size: 1em; font-weight: 600; color: #fefefe;}
h4 {font-size: 1.2em; font-weight: bold;}
h5 {font-size: 1em;}
h6 {font-size: 0.8em;}

a, a:link, a:hover, a:visited {color: #313131; text-decoration: none;}

* {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

.clearfix:before, .clearfix:after {content: " "; display: table;}
.clearfix:after {clear: both;}
.clearfix {*zoom: 1;}

html, body {width: 100%; height: 100%; position: relative;}

body {margin: 0 auto; color: #414141; font-size: 1em; font-family: 'Segoe UI', 'San Fransico', 'Helvetica Neue', Arial, sans-serif; font-weight: 400;}
a[href^="tel"] {color: inherit; text-decoration: none;}

#mainoverlay {position: fixed; display: none; width: 100%; height: 100%; top: 0; left: 0; z-index: 900;}
.blackscreen {background: rgba(0,0,0,0.8);}

#topbar {position: fixed; top: 0; left: 0; width: 100%; z-index: 50; background: #fff;}
#lcglogo {display: flex; align-items: center; justify-content: center; width: 100%; background: #fff; position: relative; height: 60px; margin: 10px 0;}
#lcglogo a {height: 60px;}
#lcglogo img {height: 100%; width: auto;}
#mainmenu {width: 100%; position: relative; background: #02066f; overflow-x: hidden; overflow-y: hidden;}
#mainmenu nav {display: flex; justify-content: center; overflow-x: auto; overflow-y: hidden;}
#mainmenu nav a {display: flex; align-items: center; height: 50px; padding: 0 20px; color: #fff; transition: background .2s linear; font-size: 20px; font-weight: 600;}
#mainmenu nav a:hover, #mainmenu nav a.cpage {background: #305cde;}

#home-page-slider {position: relative; width: 100%; height: 100%;}
#home-page-slider div {position: relative; width: 100%; height: 100%;}
#home-page-slider div.slidera {background-size: cover; background-position: center; display: table;}
#home-page-slider div.home-slider1 {background-image: url('/images/servicing-exeter.jpg');}
#home-page-slider div.home-slider2 {background-image: url('/images/mot-exeter.jpg'); background-position: top;}
#home-page-slider div.home-slider3 {background-image: url('/images/tyres-exeter.jpg');}

#home-page-slider div.text-holder {display: table; position: absolute; color: #fefefe; height: 100%; width: 100%;}
#home-page-slider div.text-holder .inner-text {display: table-cell; vertical-align: bottom; text-align: center;}
#home-page-slider div.text-holder h2 {font-size: 3em; font-weight: 600; padding: 20px 40px; background: rgba(0,0,0,0.4); background: linear-gradient(rgba(30,30,30,0),rgba(30,30,30,0.9));}

#maincontainer {position: relative; padding: 100px 0 0; height: 100%;}

#textleft {position: relative; width: 100%; height: 80%; display: block; background-size: cover; background-position: center;}
.page-contact {background-image: url('/images/lcg-services-exeter.jpg');}
.page-about {background-image: url('/images/lcg-services-exeter.jpg');}
.page-tyres {background-image: url('/images/tyres-exeter.jpg');}
.page-servicing {background-image: url('/images/servicing-exeter.jpg');}
.page-mot {background-image: url('/images/mot-exeter.jpg');}
.page-privacy {background-image: url('/images/privacy.jpg');}
.page-404 {background-image: url('/images/404.jpg');}
#textleft h1 {padding: 20px 40px; background: #02066f; color: #fff; font-weight: 600; font-size: 4em; display: block; position: absolute; width: 40%; bottom: 40px; border-radius: 0 5px 5px 0;}

#textright {width: 100%; padding: 70px 15% 32px; line-height: 1.7em; font-size: 1.1em; min-height: 100%; font-size: 1.8em;}
#textright h2 {border-bottom: 2px #02066f solid; width: 100%; padding-bottom: 16px; margin: 0 0 32px; color: #212121; font-size: 1.3em; font-weight: 600;}
#textright p {margin-bottom: 24px;}
#textright p a {text-decoration: underline;}
#textright ul {margin: 40px 0; padding: 0 80px;}
#textright img {width: 50%; height: auto; margin: 0 auto;}
#textright p.cname {font-size: 1.2em; font-variant: small-caps; font-weight: 600;}

#pfooter {position: relative; width: 100%; background: #02066f; padding: 40px 15%; font-size: 1.5em;}
#pfooter h2 {margin-bottom: 16px;}
#pfooter a:hover {color: #fff;}
#fleft, #fright {float: left; color: #fff; margin-bottom: 40px;}
#fleft {padding-right: 30px; width: 80%; border-right: 1px #fff solid;}
#fright {padding-left: 30px; width: 20%;}
#fleft p, #fright li {font-size: 0.9em;}
#fleft a, #fright a {color: #fff; display: inline-block;}
#fend {position: relative; background: #191919; color: #e1e1e1!important; text-decoration: none; width: 100%; padding: 8px 15%; font-size: 0.7em; text-align: left;}

@media screen and (max-width: 1440px) {
	#textright {padding: 70px 60px 32px;}
	#pfooter {padding: 40px 60px;}
	#fend {padding: 8px 60px;}
}

@media screen and (max-width: 1200px) {
	#textleft {position: relative; width: 100%; height: 60%;}
	#textleft h1 {font-size: 2.7em; padding: 10px 40px; width: auto;}
	#textright {width: 100%; height: auto; min-height: auto; margin-left: 0; padding: 70px 100px 40px;}
	#pfooter {width: 100%; margin-left: 0; padding: 40px 100px;}
	#fend {padding: 8px 100px;}
}

@media screen and (orientation: landscape){
	#textleft {height: 75%;}
}

@media screen and (orientation: portrait){
	#textleft {height: 80%;}
	#textleft.page-about {background-position: center right;}
}

@media screen and (max-width: 1024px) {
	#textright {padding: 50px 50px 30px;}
	#pfooter {padding: 30px 50px;}
	#fleft {width: 60%;}
	#fright {width: 40%;}
	#fend {padding: 8px 50px;}
}

@media screen and (max-width: 840px){
	#home-page-slider div.text-holder h2 {padding: 40px 20px; font-size: 2.7em;}
}

@media screen and (max-width: 800px){
	#mainmenu nav {justify-content: left;}
	#textright, #pfooter {padding: 32px;}
	#textright h2 {margin: 0 0 16px;}
	#textright ul {padding: 0 40px;}
	#textright, #pfooter {font-size: 1.2em;}
	#textright ul#mobilebargallery li {width: 47.1098265%; margin: 10px 1.4450867%; padding: 5px;}
	#fend {padding: 8px 32px;}
}

@media screen and (max-width: 480px){
	#home-page-slider div.text-holder h2 {padding: 30px 20px; font-size: 2em;}
	#textleft h1 {font-size: 2em; padding: 10px 20px;}
	#textright {font-size: 1em; padding: 20px; line-height: 1.5em;}
	#textright h2 {font-size: 1.5em; line-height: 1;}
	#pfooter {padding: 20px;}
	#fleft {width: 100%; border-right: none; border-bottom: 1px #fff solid; padding-bottom: 20px;}
	#fright {width: 100%; padding-left: 0;}
	#fleft, #fright {margin-bottom: 20px;}
	#fend {padding: 8px 20px;}
}