*, *:before, *:after {box-sizing:border-box;}
body{margin:auto; font-family:'Jost', sans-serif; font-size:15px; font-weight: 300; color:#363636; -webkit-text-size-adjust: 100%; display: block; margin: auto; background: #fdfdfd;}

button{display:inline-block; margin:3px 0; padding:8px 20px; font-family:'Montserrat' , Arial, Helvetica, sans-serif; font-size:12px; background:#06C; border:1px solid #06C; color:#fff; border-radius:5px; cursor:pointer; -webkit-appearance:button; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; transition: all 0.2s ease-out; text-transform: uppercase; text-align: center;}
button:hover{background:transparent; color:#06C;}

.btn-secondary{background: rgba(255,255,255,0.1); border:1px solid rgba(0,0,0,0.8); color:#333;}
.btn-secondary:hover{background: rgba(255,255,255,0.1); border:1px solid rgba(0,0,0,0.4); color:#777;}

input,select,textarea{width:100%; margin:3px 0; padding:11px 13px; font-family:'Jost' , Arial, Helvetica, sans-serif; font-size:13px; -ms-box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box; -webkit-appearance:none; border-radius: 4px; border:1px solid #ebedf4; background: #f5f6fa; color:#333; box-sizing: border-box;}
input[type='checkbox']{width:20px; -webkit-appearance: checkbox; padding:0;}
input[type='radio']{width:20px; -webkit-appearance: radio; padding:0;}
select{background:#f5f6fa url(//www.autosynergy.co.uk/assets/icons/select-arrow-black.png) no-repeat; background-position:right 10px center; background-size:22px;}


h1{font-size:36px; line-height: normal; font-weight:normal; display:block; margin:0; font-family: 'Jost', serif; font-weight: 400;}
h2{font-size:22px; line-height: normal; font-weight:normal; display:block; margin:0; font-family: 'Jost', serif;}
h3{font-size:20px; line-height: normal; font-weight:normal; display:block; margin:0; font-family: 'Jost', serif;}
h4{font-size:18px; line-height: normal; font-weight:normal; display:block; margin:0; font-family: 'Jost', serif;}

@media screen and (max-width:768px){
	h1{font-size:34px; line-height: 42px; letter-spacing: -1px;}
}

a:link    {text-decoration:none; color:#06C; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
a:visited {text-decoration:none; color:#06C;}
a:hover   {text-decoration:none; color:#a00;}

article,aside,div,li,dt,a{box-sizing: border-box;}
b{font-weight: normal;}
p{line-height: 1.6em; margin:0; padding:10px 0;}

@media screen and (max-width:768px){
	p{line-height: 1.5em;}
}

.i-wrap{position: relative; margin:15px 0; }
.i-wrap input{background:#fff; height:45px; padding:8px 18px; overflow: auto; border-color: #ddd;}
.i-wrap select{background-color: #fff; height:45px; padding:8px 18px; overflow: auto; border-color: #ddd;}
.i-wrap textarea{background-color: #fff; padding:16px 18px; overflow: auto; border-color: #ddd;}
.i-wrap small{position: absolute; top:-5px; left:13px; z-index:1; padding:0 6px; font-size: 12px; color: #888; background:#fff;}
.i-wrap i{position: absolute; right:0; top:3px; z-index:1; padding:15px; font-size:20px; cursor: pointer;}

section .wrapper{max-width:1440px; margin:auto;}
section .wrapper.pad{padding:40px;}
section .wrapper small{display: block;}

@media screen and (max-width:1500px){
	section .wrapper{max-width:1340px;}
}

@media screen and (max-width:768px){
	section .wrapper.pad{padding:30px;}
}


/* ---------------------------------------
Tables
------------------------------------------*/
table{width:99%; margin:2% 0; background: #ddd; border-spacing:1px;}
table th{padding:12px 25px; font-weight:normal; text-align:left;}
table tr{background:#fff;}
table td{padding:12px 25px;}
@media screen and (max-width: 1024px){
	table{font-size: 14px;}
	table td{padding:12px 20px;}
}
@media screen and (max-width: 768px){
	table{width:100%; font-size: 13px;}
	table td{padding:12px 16px;}
}
@media screen and (max-width: 480px){
	table{font-size: 12px;}
	table td{padding:10px 12px;}
}


.red{background: #a00;}
.yellow{background: #ffdd00;}
.green{background: #1ca633;}
.orange{background: #f60;}
.grey{background: #888;}
.blue{background: #3982ef;}
.black{background: #000;}
.silver{background: #ccc;}
.white{background: #f9f9f9;}
.brown{background: #8f5124;}
.purple{background: #a33bc1;}
.gold{background: #d68d00;}
