@charset "utf-8";
/* CSS Document */

body{
	background-color: #FFFFFF;
	font-family: Titillium Web, sans-serif;
	overflow-x: hidden;
}

body a{
	text-decoration: none;
	color: #4A97D2;
}

body a:hover{
	text-decoration: none;
	color: #818181;
}

.asterisk{
	color: red;
}

.horizontalline{
	width: 100%;
	height: 2px;
	background-color: #C0C0C0;
	margin-top: 15px;
}

.top{
	font-size: 16px;	
	padding-top: 15px;
}

.logo{
	text-align: left;
}

.freephone{
	text-align: center;
}

.available{
	text-align: right;
}

/* Styles for the mobile navigation */
.mobilenav{
	display: none;
}

.sidenav {
	background-color: #ECECEC;
	height: 100%;
	width: 0;
	position: fixed;
	z-index: 99;
	top: 0;
	left: 0;
	overflow-x: hidden;
	transition: 0.7s;
	padding-top: 60px;
}

.sidenav p{
	color: #818181;
	text-align: center;
}

.sidenav a {
	padding: 8px 8px 8px 32px;
	text-decoration: none;
	font-size: 25px;
	color: #111;
	display: block;
}

.sidenav a:hover {
	color: #C0C0C0;
}

.sidenav .closebtn {
	position: absolute;
	top: 0;
	right: 25px;
	font-size: 36px;
	margin-left: 50px;
	color: #4A97D2;
}

#main {
	transition: margin-left .5s;
	padding: 16px 16px 16px 26px;
	position: fixed;
	z-index: 99;
	color: #4A97D2;
	font-size: 30px;
	cursor: pointer;	
}

/* Styles for desktop navigation */
.navbar{
	border-bottom: 2px solid #ECEFFF;
	padding: 15px 0;
	text-shadow: none;
}

.navborder{
	border: 1px solid #ECECEC;
}

#navbar a{
	color: #4A97D2;
	padding: 0 30px;
	font-size: 20px;
}

#navbar a:hover{
	color: #818181;
}

#navbar .active a, #navbar .active a:hover{
	color: #31434D;
}

.banner{
	background-image: url(banner.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.banner  > .container{
	color: white;
	padding: 100px 0 300px 0;
}

.banner h1{	
	font-size: 44px;
}

.banner h2{	
	font-size: 35px;
}

.cta{
	color: #4A97D2;
	background-color: #F5F5F5;
	border: 1px solid #DCDCDC;
	padding: 100px 0;
}

.cta h2{	
	font-size: 52px;
}

.icon-container{
	padding: 100px 0;
}

.icon-title{
	padding: 40px 0 0 0;
	margin-bottom: 0;
	font-size: 23px;
}

.icon-desc{
	padding: 20px 0 0 0;	
	font-size: 23px;
}

.mainbg{
	background-image: url(main-bg.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	color: white;
}

.maintitle{
	margin-bottom: 0;
	padding: 100px 0 0 0;
	font-size: 52px;
}

.main-paragraph{
	margin-bottom: 0;
	padding-top: 50px;
	padding-bottom: 100px;
	font-size: 23px;
}

#main-paragraph{
	margin-bottom: 0;
	padding-top: 50px;
	padding-bottom: 50px;
	font-size: 23px;
}

.contactform{
	padding-bottom: 100px;
}

.contactform > div:not(:first-child):not(:last-child){
	padding-top: 30px;
}

.contactform div > input, .contactform div > label, .contactform div > textarea, .contactform div > button{
	font-size: 23px;
}

.small{
	color: white !important;
}

#testimonial{
	min-height: 571px;	
}

.testimonial h2{	
	font-size: 52px;
}

.testimonial-title{
	padding: 100px 0 0 0;
	margin-bottom: 0;
}

#testimonial{
	background-color: #F5F5F5;
	border: 1px solid #DCDCDC;
}

.trustpilot{
	padding: 20px 0 0 0;
	margin-bottom: 0;
}

.testimonial-subject{
	padding: 30px 0 0 0;
	margin-bottom: 0;
	font-size: 23px;
}

.testimonial-paragraph{
	padding: 20px 0 100px 0;
	font-size: 23px;
}

.service{
	padding: 100px 0 0 0;
}

.service > h2{
	margin-bottom: 0;
}

.service > .main-paragraph{
	padding: 50px 0 100px 0;
}

.active{
	padding: 0 !important;
}

.compliance{
	padding: 100px 0;
	width: 450px;
}

.footer{
	color: white;
	font-size: 23px;
	padding: 100px 0;
	background-color: #2C2C2C;
}

@media only screen and (max-width: 991px){
	.horizontalline{
		display: none;
	}
	
	.top{
		padding-bottom: 15px;
	}
	
	.desktopnav{
		display: none;
	}
	
	.mobilenav{
		display: inline;
	}
	
	.sidenav{
		box-shadow: 10px 0px 75px #111;
		z-index: 6;
	}
	
	#main{
		z-index: 5;
	}
}

@media only screen and (max-width: 768px){
	.logo{
		text-align: center;
		padding-bottom: 15px;
	}

	.freephone{
		text-align: center;
		padding-bottom: 15px;
	}

	.available{
		text-align: center;
	}
	
	.banner h1{	
		font-size: 34px;
	}

	.banner h2{	
		font-size: 25px;
	}
	
	.banner  > .container{
		padding: 50px 0 50px 0;
		text-align: center;
	}
	
	.cta{
		padding: 50px 0;
	}	

	.cta h2{	
		font-size: 32px;
	}
	
	.icon-container{
		padding: 50px 15px;
	}

	.icon-title{
		padding: 20px 0 0 0;
		margin: 0;
		font-size: 18px;
	}

	.icon-desc{
		padding: 10px 0 0 0;	
		font-size: 18px;
	}
	
	.maintitle{
		margin: 0;
		padding: 50px 0 0 0;
		font-size: 42px;
	}

	.main-paragraph{
		margin: 0;
		padding-top: 40px;
		padding-bottom: 50px;
		font-size: 18px;
	}
	
	#main-paragraph{
		margin: 0;
		padding-top: 40px;
		padding-bottom: 50px;
		font-size: 18px;
	}
	
	.contactform > div:not(:first-child):not(:last-child){
		padding-top: 15px;
	}
	
	.contactform > div, .contactform div > input, .contactform div > textarea, .contactform div > button{
		font-size: 18px;
	}
	
	#testimonial{
		min-height: 0;	
	}
	
	.testimonial{
		min-height: 0;
		padding: 0 15px;
	}

	.testimonial h2{	
		font-size: 42px;
	}

	.testimonial-title{
		padding: 50px 0 0 0;
		margin: 0;
	}

	.trustpilot{
		padding: 10px 0 0 0;
		margin: 0;
	}

	.testimonial-subject{
		padding: 15px 0 0 0;
		margin: 0;
		font-size: 18px;
	}

	.testimonial-paragraph{
		padding: 10px 0 50px 0;
		font-size: 18px;
	}
	
	.service{
		padding: 50px 0 0 0;
	}

	.service > .main-paragraph{
		padding: 25px 0 50px 0;
	}

	.active{
		padding: 0 !important;
	}
	
	.compliance{
		padding: 50px 0;
		width: 345px;
	}

	.footer{
		color: white;
		font-size: 18px;
		padding: 50px 0;
		background-color: #2C2C2C;
	}
}