/*

Class 4 MOT Centre - Global Stylesheet
Handwritten by Richard Wilmot (AztecMedia.eu)
http://www.class4motcentre.co.uk/

*/

																					/* ------------ Toolbox ------------ */

.float-left { float: left; }
.float-right { float: right; }
.align-right { text-align: right; }
.cleared { clear: both; }
.hide { display: none; }
.smaller { font-size: 90%; }
.larger { font-size: 110%; }
.normal { font-weight: normal; }

hr { display: none; }
strong { font-weight: bold; }

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

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

*, *::before, *::after {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

																					/* ------------ Defaults ------------ */

body, html {
	font-size:14px;
	color:#333435;
	line-height:22px;
	font-weight:300;
	font-family: 'Poppins', sans-serif;
	height: 100%;
	position:relative
	}

h1,
h2,
h3,
h4 {
	font-weight:normal;
	font-size:38px;
	text-align:center;
	text-transform:uppercase;
	margin-bottom:30px;
	font-weight:700;
	line-height:38px;
}

h2 {
	font-size:32px;
	line-height:32px;
	margin-bottom:20px;
	color:#ee2f2c
}

h3 {
	font-size:25px;
	line-height:25px;
	margin-bottom:15px;
	color:#ee2f2c
}

h4 {
	font-size:17px;
	margin-bottom:5px;
	line-height:15px;
	color:#ee2f2c
}

h1 span,
h2 span,
h3 span,
h4 span {
	color:#ee2f2c
}

p {
	margin-bottom:20px;
	text-align:center;
	line-height:28px;
}

a {
	text-decoration:none;
	color:#ee2f2c
}

a:hover {
	text-decoration: underline;
}


.btn {
	display:block;
	width:100%;
	height:40px;
	background:url(../images/btn-br.png) no-repeat top right;
	text-transform:uppercase;
	text-align:center;
	color:#FFF;
	line-height:40px;
	font-weight:700;
	color:#FFF;
	padding-right:20px
}

.btn:hover {
	background-position: right -40px;
	text-decoration:none
}

#content p img {
	width:100%;
	height:auto
}


																					/* ------------ Nav ------------ */

#nav-container {
	width:100%;
	height:130px;
	position:fixed;
	left:0;
	z-index:200;
	background: #333435 url(../images/nav-bg.gif) repeat-x bottom center;
	border-bottom: #ee2f2c solid 2px;
}

.nav-hidden {
	top:0;
	-webkit-transition: all .5s ease;
       -moz-transition: all .5s ease;
            transition: all .5s ease;
}

#home .nav-hidden {
	top:-128px;
	-webkit-transition: all .5s ease;
       -moz-transition: all .5s ease;
            transition: all .5s ease;
}

.nav-show {
	top:0;
	-webkit-transition: all .5s ease;
       -moz-transition: all .5s ease;
            transition: all .5s ease;
}

#nav {
	max-width:1170px;
	margin:auto;
}

#nav #nav-logo {
	margin:14px auto;
	height:70px;
	width:142px;
}

#nav #nav-logo a {
	display:block;
	height:70px;
	width:142px;
	text-indent:-25000px;
	background:url(../images/nav-logo.png) no-repeat top left;
}


#nav .menu,
#nav .mobile-menu {
    display: none;
}

#nav .standard-menu {
	text-align:center;
	width:100%;
	max-width:1170px;
	font-size:0;
}

#nav .standard-menu li {
	text-transform:uppercase;
	display:inline-block;
}

#nav .standard-menu li a {
	color:#fbfbfb;
	display:block;
	width:auto;
	height:30px;
	line-height:30px;
	padding:0 20px;
	font-size:14px;
	text-decoration:none;
}

#nav .standard-menu li a:hover,
#nav .standard-menu li.menuactive a {
	background:#ee2f2c
}

@media screen and (max-width: 1140px) {	
	#nav .standard-menu li a {
		padding:0 10px;
	}
}
@media screen and (max-width: 950px) {	
	#nav .standard-menu,
	#nav-container-bg {
		display: none;
	}
	
	#nav .menu {
		bottom: 0;
		cursor: pointer;
		display: table;
		height: 30px;
		line-height:30px;
		color:#f5f5f5;
		text-transform:uppercase;
		margin:auto;
		background: #ee2f2c url(../images/mobile-menu.png) no-repeat top left;
		padding:0 10px 0 40px
	}
	
	.mobile-menu {
		position:absolute;
		z-index:1000;
		width:100%;
		top:130px;
	}
	
	.mobile-menu ul {
		background:#ee2f2c;
		overflow:hidden;
		padding:5px 10px;
	}

	.mobile-menu li a {
		text-decoration:none;
		display:block;
		width:100%;
		padding: 3px 0;
		text-align:center;
		color:#f3f3f3;
		text-transform:uppercase
	}
	
	.mobile-menu li li a {
		font-size:14px;
	}

}	




	
																					/* ------------ Header ------------ */

#header-container {
	width:100%;
	height:450px;
	position:relative;
}

#home #header-container {
	height:100%;
}

#header {
	width:100%;
	margin:auto;
	width:100%;
	position:absolute;
	top:50%;
	background-color: rgba(51, 52, 53, 0.8);
	height:270px;
	margin-top:-185px;
	padding:20px 0;
	display:none
}

#home #header {
	display: block
}

#header-container #content-arrow {
    background:url(../images/jump-arrow-bg.gif) repeat-x top center;
    bottom: 0;
    display: inline;
    height: 48px;
    position: absolute;
    width: 100%;
    z-index: 5;
	border-top: #ee2f2c solid 2px;
}


#header-container #content-arrow a {
	display:block;
	background-image:url(../images/jump-arrow.png);
	background-repeat: no-repeat;
	background-position:0 0;
	width:120px;
	height:90px;
	margin:auto;
	margin-top:-45px;
	text-indent:-25000px;
	-webkit-transition: all .5s ease;
       -moz-transition: all .5s ease;
            transition: all .5s ease;
}

#header-container #content-arrow a:hover {
	background-position:0 30px;
}

#header-container #logo {
	width:100%
}

#header-container #logo a {
	display:block;
	height:230px;
	width:467px;
	text-indent:-25000px;
	background: url(../images/home-logo.png) no-repeat top center;
	margin:auto;
}



@media screen and (max-width: 580px) {	
	#header {
		height:198px;
		margin-top:-125px;
	}
	#header-container #logo a {
		height:158px;
		width:320px;
		background-size: 100% auto
	}
}

																					/* ------------ Content ------------ */


#info-container {
	width:100%;
	background:#f3f3f3;
}

#content-container {
	width:100%;
	background:#f3f3f3;
}

#content {
	width:100%;
	max-width:1170px;
	background:#f3f3f3;
	margin:auto;
	padding:65px 40px;
	text-align:center
}

#home #content {
	padding:65px 40px 40px 40px;
}


		
																					/* ------------ Footer ------------ */

#footer-container {
	width:100%;
	background:#dfe0e0;
	padding:40px 0 20px 0;
	border-top: #ee2f2c solid 2px;

}

#footer {
	width:100%;
	max-width:1170px;
	margin:auto;
	font-size:12px;
}

#footer .contacts {
	width:50%;
	float:left
}

#footer .map {
	width:50%;
	float:right
}

#footer h4 {
	text-align:left;
	margin-bottom:20px;
}

#footer li a,
#furniture a {
	color:#333435;
}

#footer li {
	margin-bottom:20px;
	padding-left:20px;
	display:block
}


#footer li.address {
	background:url(../images/footer-address.png) no-repeat left 2px;
}

#footer li.phone {
	background:url(../images/footer-phone.png) no-repeat left 2px;
}

#footer li.email {
	background:url(../images/footer-email.png) no-repeat left 2px
}


#footer .footer-map img {
	width:100%;
	height:auto
}

#furniture-container {
	width:100%;
	background:#dfe0e0;
	padding-bottom:20px
}

#furniture {
	width:100%;
	max-width:1170px;
	margin:auto;
	text-align:center;
	font-size:12px;
}

#furniture p {
    margin-bottom: 0;
    width: 50%;
}
#furniture p.copyright {
    float: left;
    text-align: left;
}
#furniture p.aztecmedia {
    float: right;
    text-align: right;
}

@media screen and (max-width: 1170px) {	
	#footer-container {
		padding:40px 20px 20px 20px;	
	}
	#furniture-container {
		padding:0 20px 20px 20px;	
	}
}

@media screen and (max-width: 680px) {	
	#footer .map,
	#footer .contacts,
	#furniture p {
		float: none;
		width: 100%;
	}
	#furniture p {
		text-align:center !important
	}
}