html{
	height: 100%;
}

body{	
	min-height: 100%;
	background: #0f0f0f;
	font-family: 'Lato', sans-serif;
	text-align: justify;
	padding-top:56px;

}

.grecaptcha-badge {
    display: none !important;
}

.inverted{
	color: #ffffff;
}


section.white{
	background: #ffffff;
	padding:15px 0 15px;
}

section.grey{
	background: #dfe8ef;
	padding:15px 0 2rem;
}

section.blue{
	background: #2c548a;
	padding:2rem 0;
}

section.dark-blue{
	background: #1e4272;
	padding:2rem 0;
}

section.bg-emission{	
	background: #000000 url('images/exhaust-pipe.jpg') no-repeat center bottom;
	background-size: cover;
	min-height: 75vh;
	padding:2rem 0;
}	

section.quiz{
	min-height: 75vh;
}	

section.bg-car{	
	background: #000000 url('images/car.jpg') no-repeat center bottom;
	background-size: cover;
	min-height: 75vh;
	padding:2rem 0;
}	

.black-box{
	background: rgba(0,0,0,0.85);
	border-radius:4px;
	padding:30px;
	margin: 2rem 0;
}

.photo-cover{	
	width:100%;
	min-height: 65vh;
	background: #333333 url('images/exhaust-pipe.jpg') no-repeat center center;
	background-size: cover;
	position:relative;
}

.photo-cover:after{
	display:block;
	content:'';
	position:absolute;
	top:10px;
	left:10px;
	right:10px;
	bottom:10px;
	background: url('images/overlays.png') no-repeat center right;
	background-size: contain;
	
}
	

	.photo-cover.mercedes{	
		background: #333333 url('images/mercedes-wheel.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.photo-cover.seat{	
		background: #333333 url('images/seat-wheel.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.photo-cover.volkswagen{	
		background: #333333 url('images/volkswagen-wheel.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.photo-cover.audi{	
		background: #333333 url('images/audi-wheel.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.photo-cover.skoda{	
		background: #333333 url('images/skoda-wheel.jpg') no-repeat center center;
		background-size: cover;
	}
	
	
	.photo-cover.nissan{	
		background: #333333 url('images/nissan-wheel.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.photo-cover.renault{	
		background: #333333 url('images/renault-wheel.jpg') no-repeat center center;
		background-size: cover;
	}
	

	
.mini-cover{	
	width:100%;
	min-height: 45vh;
	background: #333333 url('images/exhaust-pipe.jpg') no-repeat center center;
	background-size: cover;
	position:relative;
}

.mini-cover:after{
	display:block;
	content:'';
	position:absolute;
	top:10px;
	left:10px;
	right:10px;
	bottom:10px;
	background: url('images/overlays.png') no-repeat center right;
	background-size: contain;
	
}	

	.mini-cover.mercedes{	
		background: #333333 url('images/mini-mercedes.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.mini-cover.seat{	
		background: #333333 url('images/mini-seat.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.mini-cover.volkswagen{	
		background: #333333 url('images/mini-volkswagen.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.mini-cover.audi{	
		background: #333333 url('images/mini-audi.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.mini-cover.skoda{	
		background: #333333 url('images/mini-skoda.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.mini-cover.renault{	
		background: #333333 url('images/mini-renault.jpg') no-repeat center center;
		background-size: cover;
	}
	
	.mini-cover.nissan{	
		background: #333333 url('images/mini-nissan.jpg') no-repeat center center;
		background-size: cover;
	}
	

.navbar-brand{
	font-family: 'Orbitron', sans-serif;
	letter-spacing: 1px;
}

		
	.navbar-brand .logo{
		max-height: 35px;
	}


span.sub {
    display: block;
    font-size: 0.8em;
    /*text-align: center;*/
    margin-top: 5px;
	letter-spacing: 0.4px;
	opacity: 0.75;
}

	span.sub.center {
		text-align: center;
	}

.extra{
	padding:0 5px;
	color:#ffffff;
	background:#2c548a;
	border-radius:4px;	
	white-space: nowrap;
}
.extra a, .extra a:hover, a:active {
	color:#ffffff;
}

	
	.navbar-dark .navbar-nav .extra .nav-link{
		color:#ffffff;
	}

	
h2{
	font-size:1.75rem;
	margin-top: 2rem;
}


h3{
	font-size:1.45rem;
}	

h4{
	font-size:1.15rem;
}	

.faqs{
	list-style: none;
	padding:0;
	margin:0;
}

	.faqs li{
		background: rgba(255,255,255,0.7);
		border-radius:4px;
		margin:0.5rem 0;
		transition: background 0.3s;
	}
	
		.faqs li a{
			display:block;
			padding:0.7rem 55px 0.7rem 10px;
			color: #333333;
			text-decoration: none;
			position:relative;
			font-size:1.15rem;
			
		}	
		.faqs li a:after{
			display:block;
			content:'';
			position:absolute;
			top:5px;
			left:auto;
			right:10px;
			bottom:5px;
			width:36px;
			background: url('images/question.png') no-repeat center right;
			background-size: contain;			
		}

		.faqs li:hover {
			background: rgba(255,255,255,1);		
		}
		.faqs li:hover a:after{
			animation: shake 2.6s both;			
		}
			
.answers h3{
	min-height:40px;
	background: url('images/question.png') no-repeat center left;	
	padding:1rem 0 1rem 50px;
	margin-top:2rem;
	font-weight:600;
	color:#2c548a;
	
}

.button{
		width:100%;
		max-width:320px;
		padding:20px;
		font-size:1.5rem;
		line-height:1;
		font-weight:700;
		text-transform:uppercase;
		text-align:center;
		border-radius:4px;
		display:block;
		margin:1.5rem 0 0;
		cursor:pointer;
		white-space: normal;
	}
	
	.button:hover{
		text-decoration:none;
	}

		.button.main{
			color:#ffffff;
			background:#2c548a;
			border:0;
			transition:all .5s;
		}
		
		.blue .button.main,
		.dark-blue .button.main{
			background:#73c8c8;
			color:#ffffff;
			border:0;
			transition:all .5s;
		}
		
		.button.center{
			margin:2rem auto 0;
		}
		
		.button.wide{
			max-width:initial;
		}
		
			.button.main:hover{
				color:#ffffff;
				background:#73c8c8;
			}
		
			.blue .button.main:hover,
			.dark-blue .button.main:hover{
				color:#73c8c8;
				background:#ffffff;
			}
		
.steps p, .steps h2,.steps h4{
	text-align: center;
	margin:1rem auto;
}	
.steps>div{
	padding:40px 40px 0;
}

.step {
    display: block;
    height: 120px;
    width: auto;
    margin: 0 auto 1em;
}

	.step.st-1 {
		background: url(/images/st-1.png) 50% 50% no-repeat;
		background-size: contain;
	}
	.step.st-2 {
		background: url(/images/st-2.png) 50% 50% no-repeat;
		background-size: contain;
	}
	.step.st-3 {
		background: url(/images/st-3.png) 50% 50% no-repeat;
		background-size: contain;
	}
	.step.pro-1 {
		background: url(/images/pro-1.png) 50% 50% no-repeat;
		background-size: contain;
	}
	.step.pro-2 {
		background: url(/images/pro-2.png) 50% 50% no-repeat;
		background-size: contain;
	}
	.step.pro-3 {
		background: url(/images/pro-3.png) 50% 50% no-repeat;
		background-size: contain;
	}

input, textarea{
	margin-bottom:1rem;
}
 label{
	margin-bottom:0.6rem;
}

.checkbox {
  display: block;
  position: relative;
  padding-left: 35px;
  margin: 0 !important;
  font-size:.75rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.checkmark {
  position: absolute;
  top: 10px;
  left: 0;
  height: 18px;
  width: 18px;
  background-color: #ffffff;
  border: 2px solid #c1c1c1;
  border-radius:4px;
}

.checkbox:hover input ~ .checkmark {
  background-color: #e8e8e8;
}

.checkbox input:checked ~ .checkmark {
  background-color: #ffffff;
}


.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.checkbox input:checked ~ .checkmark:after {
  display: block;
}

.checkbox .checkmark:after {
  left: 4px;
  top: 0;
  width: 6px;
  height: 12px;
  border: solid #2c548a;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


footer{
	padding-top:2em;
}	
	
	footer .footer-menu{
		text-align:center;
	}
		
		footer .footer-menu a{
			font-size:0.85rem;
			color:#ffffff;
			margin:5px 15px;			
		}
		
		footer .footer-menu a:hover{
			color:rgba(255,255,255,0.75);
			text-decoration:none;			
		}
		
	footer hr{
		margin:25px 0;
		border-color:rgba(255,255,255,0.2);
	}
	
	footer .disclaimer{
		font-size:0.75rem;
		line-height:1.1;
		color:#ffffff;
	}
	
.success-icon{
	margin:3rem 0;
}	

	
	
#back-to-top {
    position: fixed;
    right: 0;
    bottom: 30px;
    background-color: #fff;
    width: 70px;
    height: 70px;
    border-top-left-radius: 35px;
    border-bottom-left-radius: 35px;
    z-index: 999;
    box-shadow: 0 4px 10px 0 rgba(0,0,0,.2);
    font-size: 16px;
    color: #333937;
    -webkit-box-align: center;
    align-items: center;
    padding: 5px;
    opacity: 0;
    transition: visibility 0s linear 0s,opacity .25s;
	cursor:pointer;
}	

	#back-to-top .round {
		width: 60px;
		height: 60px;
		background: url(/images/to-top.png) 50% 50% no-repeat;
		background-size: contain;		
		float:left;
	}

	#back-to-top .btn-text {
		
		display:none;
		float:left;
		margin-left: 20px;
		line-height: 60px;
}


@media (min-width: 992px){
	.navbar-expand-lg .navbar-nav .nav-link {
		padding-right: 1rem;
		padding-left: 1rem;
	}
}

@media (max-width: 991px){
		.photo-cover,
		.mini-cover{	
			width:100%;
			min-height: 25vh;
		}
}

@media (max-width: 767px){
	
	section.bg-emission {
		padding: 0.75rem 0;
	}

	.black-box {
		padding: 10px;
		margin: 0;
	}
	
	.button.main {
		margin:10px auto 0;
	}
	
	span.sub{
		text-align: center;
	}
	
	.photo-cover{
		margin-bottom:10px;
	}
	
	h1{		
		text-align: left;
		font-size:1.5rem;
		font-weight: 600;
	}	
	.text-center h1{
		text-align: center;
	}
	
	.success-icon{
		display:none;
	}

}

/* Animations */


.jump {
    -webkit-animation: jump 1.5s ease 0s infinite normal ;
    animation: jump 1.5s ease 0s infinite normal ;
 }

	@keyframes jump {
	  0%{
		transform: translateY(0);
	  }
	  20%{
		transform: translateY(0);
	  }
	  40%{
		transform: translateY(-20px);
	  }
	  50%{
		transform: translateY(0);
	  }
	  60%{
		transform: translateY(-10px);
	  }
	  80%{
		transform: translateY(0);
	  }
	  100%{
		transform: translateY(0);
	 }
	}


	@-webkit-keyframes jump {
	  0%{
		-webkit-transform: translateY(0);
	  }
	  20%{
		-webkit-transform: translateY(0);
	  }
	  40%{
		-webkit-transform: translateY(-20px);
	  }
	  50%{
		-webkit-transform: translateY(0);
	  }
	  60%{
		-webkit-transform: translateY(-10px);
	  }
	  80%{
		-webkit-transform: translateY(0);
	  }
	  100%{
		-webkit-transform: translateY(0);
	 }
	}

.shake{
	animation: shake 2.6s infinite both;
}


	@keyframes shake {
	  10%, 40% {
		transform: translate3d(-1px, 0, 0);
	  }
	  
	  15%, 35% {
		transform: translate3d(2px, 0, 0);
	  }

	  20%, 25%, 30% {
		transform: translate3d(-4px, 0, 0);
	  }

	  22%, 28% {
		transform: translate3d(4px, 0, 0);
	  }
	}
	
	@-webkit-keyframes shake {
	  10%, 40% {
		-webkit-transform: translate3d(-1px, 0, 0);
	  }
	  
	  15%, 35% {
		-webkit-transform: translate3d(2px, 0, 0);
	  }

	  20%, 25%, 30% {
		-webkit-transform: translate3d(-4px, 0, 0);
	  }

	  22%, 28% {
		-webkit-transform: translate3d(4px, 0, 0);
	  }
	}

	
	
.pulse{
	animation-name: pulse;
	-webkit-animation-name: pulse;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

	@keyframes pulse {
		0% {
			transform: scale(0.95);
			opacity: 1;		
		}
		50% {
			transform: scale(1);
			opacity: 1;	
		}	
		100% {
			transform: scale(0.95);
			opacity: 1;	
		}			
	}

	@-webkit-keyframes pulse {
		0% {
			-webkit-transform: scale(0.95);
			opacity: 1;		
		}
		50% {
			-webkit-transform: scale(1);
			opacity: 1;	
		}	
		100% {
			-webkit-transform: scale(0.95);
			opacity: 1;	
		}			
	}