/* ------ FONT IMPORTS ------ */
@import url(https://fonts.googleapis.com/css?family=Open+Sans:200,400,500,600,700,900);
/* @import url(https://fonts.googleapis.com/css?family=Lato:200,400,500,700,900); */

/* ------ GLOBAL PAGE STYLES (tags) ------ */
html{width:100%; height:100%;}
body{width:100%; height:100%;margin: 0; padding: 0;font-family: 'Open Sans', serif;}
p { padding: 0px; line-height: 1.5; font-size: 16px; color: #333; font-family: Lato; text-align: justify;}
img{border-width: 0px; max-width: 100%;}
h1{color: #333; font-size: 40px; margin: 20px 0px; font-family: 'Open Sans', sans-serif; font-weight: normal; line-height:100%;}
h2{color: #333; font-size: 30px; margin: 10px 0px; font-family: 'Open Sans', sans-serif; font-weight: normal; line-height:100%;}
h3{color: #333; font-size: 24px; margin: 10px 0px; font-family: 'Open Sans', sans-serif; font-weight: normal; line-height:150%;}
h4{color: #333; font-size: 20px; font-weight: bold; font-family: 'Open Sans', sans-serif; margin: 0 0 10px 0; line-height:100%;}
h5{color: #333; font-size: 16px; font-weight: bold; font-family: 'Open Sans', sans-serif; margin: 0 0 10px 0; line-height:100%;}
a, a img{
	color: inherit;
	text-decoration: none;
	-o-transition: .3s;
	-ms-transition: .3s;
	-moz-transition: .3s;
	-webkit-transition: .3s;
	transition: .3s;
	cursor: pointer;
}
*{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}


/* ------ SITE COLOURS ------ */
.f0f0f0bg { background-color: #f0f0f0 !important;}
.blueText { color: #233484 !important; }
.bluebg { background-color: #233484 !important; }
.lblueText { color: #0070c0 !important; }
.lbluebg { background-color: #0070c0 !important; }
.redText { color: #cc1517 !important; }
.redbg { background-color: #cc1517 !important; }
.lgraybg {background-color: #ccc; }
.whiteText { color: #fff !important; }

.bold {
	font-weight: 700;
}


/* ------ GLOBAL PAGE STYLES (classes) ------ */
#outer {	width: 100%; height: 100%; margin: 0; padding: 0; border: 0px; overflow: hidden;}
#content {width: 100%;overflow: hidden;}
.container {	
	width: 94%;
	max-width: 1400px;
	margin: 0px auto;
	overflow: hidden;
	height: auto;
	background-color: transparent;
}
.newsection { padding: 60px 0px; }
.hideme { display: none; }
.showme_md { display: none; }
.showme_xs { display: none; }


/* ------ FORMS/INPUTS/MESSAGES ------ */
input[type="text"]{font-size: 14px; font-family: 'Lato', serif; color: #000; border: 1px solid #333; padding: 10px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
input[type="text"]:focus{border-color: #000;}
select{font-size: 14px; font-family: 'Lato', serif; color: #000; border: 1px solid #000; padding: 10px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
select:focus{border-color: #fff;}
textarea{font-size: 14px; font-family: 'Lato', serif; color: #000; border: 1px solid #333; padding: 10px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
textarea:focus{border-color: #000;}
div.success{width: 100%; display: block; margin: 10px 0px; background-color: #6fb500; border: 1px solid #62a000; color: #fff; font-weight: bold; text-align: left;}
div.msg{padding: 5px 10px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
div.error{width: 100%; display: block; margin: 10px 0px; background-color: #FFC4C4 !important; border: 1px solid #F00; color: #333; font-weight: bold; text-align: left;}
input.error{background-color: #FFC4C4 !important; border: 1px solid #F00;}
textarea.error{background-color: #FFC4C4; border: 1px solid #F00;}
select.error{background-color: #FFC4C4; border: 1px solid #F00;}
.isRequired {background-color: #FFC4C4 !important; border: 1px solid #F00 !important;}
#tokenbox{margin: 8px 0px; padding: 5px; background-color: #eee; border: 2px solid #eee; border-radius: 3px; text-align: right;}

.isRequired {background-color: #FFC4C4 !important; border: 1px solid #F00 !important;}
#tokenbox{margin: 8px 0px; padding: 5px 10px 5px 5px; background-color: #f0f0f0; border-radius: 3px; text-align: right; font-weight: 200; font-size: 18px;}
#tokenbox .spacer { display: none; }
#contactFormMessage { width: 100%; padding: 7px 5px; text-align: center; display: none; color: #000; font-size: 20px; font-weight: 200; margin: 10px 0px;}
#contactFormMessage .msg {font-weight: 400;text-align: center;padding: 7px 0px;}


/* ------ GRIDS ----- */
.row { width: 100%; vertical-align: top; height: auto; overflow: hidden;}
.row > div {
	float: left;
	background-color: transparent;
	display: inline-block;
	padding: 0px 10px;
	vertical-align: top; 
	min-height: 1px;
}
.row .grid100 { width: 100%; }
.row .grid90 {width: 90%;}
.row .grid80 {width: 80%;}
.row .grid75 {width: 75%;}
.row .grid70 {width: 70%;}
.row .grid60 {width: 60%;}
.row .grid50 {width: 50%;}
.row .grid40 {width: 40%;}
.row .grid33 {width: 33%;}
.row .grid30 {width: 30%;}
.row .grid25 {width: 25%;}
.row .grid20 {width: 20%;}
.row .grid10 {width: 10%;}


/* ----- ALIGNMENT CLASSES ----- */
.alignLeft { text-align: left; }
.alignCenter{ text-align: center; }
.alignRight{ text-align: right; }
.tablerow { display: table-row;}
.table { display: table; width: 100%; }
.table .tablerow > div { display: table-cell; }


/* ----- TEXT CLASSES ----- */
.largetext_p {
    font-size: 17px;
    line-height: 1.5;
    text-align: justify;
}
.large{font-size: 150% !important;}

.sectionHeader {
	text-align: center;
	margin-bottom: 40px;
	font-size: 40px;
	font-weight: 600;
}


/* ----- LIST CLASSES ----- */
.clean_list {padding: 0px;}
.clean_list li {
	list-style-type: none;
	font-size: 17px;
    line-height: 35px;
    text-align: justify;
}


/* ----- BUTTON CLASSES ----- */
.button {
	font-size: 16px;
	padding: 15px 20px;
	display: inline-block;
}
.button.large {
	font-size: 22px;
	padding: 20px 30px 15px;
	font-weight: 600;
	border-bottom: 5px solid transparent;
}
.button.lbluebg {border-bottom: 5px transparent solid !important; }
.button.lbluebg:hover {border-bottom: 5px solid #233484 !important;}

/* ------ NAVBAR ------ */
#navbar, #navbar-sticky {
	width: 100%;
	height: auto;
	text-align: right;
	padding: 25px 0px 25px;
	position: relative;
	display: block;
}
#navbar .container, #navbar-sticky .container { background-color: transparent !important; overflow: visible;}
#navbar .logo, #navbar-sticky .logo {
    float: left;
    width: auto;
    vertical-align: top;
    text-align: center;
    overflow: hidden;
	z-index: 2;
	padding: 0px;
	display: inline-block;
	width: 100%;
	max-width: 500px;
	margin-bottom: 20px;
}
#navbar .logo img, #navbar-sticky .logo img{width: 100%;}
#navMenu {
	display: inline-block;
	float: right;
	text-align: right;
}

#navbar .details {
	max-width: 500px;
	display: inline-block;
}

#navbar .phone {
	display: block;
	font-size: 26px;
	vertical-align: top;
	font-weight: 700;
	line-height: 30px;
	color: #333;
	text-align: center;
	margin-bottom: 20px;
}
#navbar .phone .fa { display: inline-block; font-size: 60px; margin-right: 15px; }
#navbar .phone div { display: inline-block; font-size: 35px; }
#navbar .phone div span {
	display: block; 
	text-align: left;
	font-size: 17px;
	font-weight: 700;
	color: #777;
	margin: 0px 0px -3px 5px;
}

#navbar .quote {display: block; text-align: center;}
#navbar .quote h1 { font-size: 27px; font-weight: 700; margin: 0px 0px 5px;}
#navbar .quote h3 { font-size: 20px; font-weight: 600; margin: 0px; line-height: 20px;}

/* ------ FOOTER ------ */
#footer {
    width: 100%;
	z-index: 1;
	position: relative;
    color: #fff;
    text-align: center;
    padding: 35px 0px 35px;
	vertical-align: bottom;
	font-size: 18px;
	background-color: #0070C0;
}
#footer .social_icons { margin-bottom: 15px; }
#footer .social_icons h1 { vertical-align: top; font-size: 25px; display: inline-block; margin: 0px; margin-top: 8px; color: #777;}
#footer .social_icons img {height: 40px; margin: 0px 15px; cursor: pointer;}
#footer .expertsystems a {color: #fff;}
#footer .expertsystems a:hover {color: #000;}
#backtotop {
	position: fixed;
	z-index: 10;
	bottom: 20px;
	right: 20px;
	padding: 10px 10px;
	font-size: 22px;
	background-color: rgba(0,0,0,0.5);
	cursor: pointer;
	color: #eee;
}

/* ----- BANDS ----- */
.band { width: 100%; margin: 0px auto; text-align: center; padding: 20px 0px;}
.band.blue { background-color: #233484; }
.band h1 { 
	color: #fff; 
	text-align: center;
	font-size: 30px;
	margin: 0px;
	font-weight: 600;
	line-height: 1.2;
}
.band h1.large { font-size: 40px !important;}
.marginTop15 { margin-top: 15px !important; }


/* ----- LIST CLASSES ----- */
.cleanList {padding: 0px;}
.cleanList li {line-height: 1.35; font-family: 'Open Sans', sans-serif; text-align: left; color: #231f20; font-weight: 400; font-size: 20px;}
.cleanList.numbered li { list-style-type: number; }
.cleanList.noBullets li { list-style-type: none; padding: 8px 0px;}
.cleanList.noBullets li .fa { padding-right: 15px; display:table-cell;}
.cleanList.noBullets li span { display: table-cell;}



/* ----- CUSTOM CLASSES ----- */


.imagePricing img { 
	width: 100%; 
	height: 300px; 
	background-color: #eee;
	margin-bottom: 15px;
	margin: 7px 0px 15px;
	display: block;
	background-position: center center;
	background-size: cover;
}
.imagePricing .row > div {position: relative; }
.imagePricing .overlay {
	background-image: url('../img/image_overlay.png');
	position: absolute;
	color: #fff;
	width: 95px;
	height: 75px;
	background-size: 95px 75px;
	top: 0px;
	right: 25px;
	text-align: center;
	font-weight: 700;
	font-size: 25px;
	padding: 15px 0px;
}

.imagePricing .overlay span {
	display: block;
	font-size: 13px;
	margin-bottom: -5px;
}
.imagePricing h3 {
	position: absolute;
	bottom: 25px;
	margin: 0px;
	padding: 7px 5px;
	font-weight: 600;
	text-align: center;
	display: block;
	width: 100%;
	background-color: rgba(255,255,255,0.7);
	line-height: 1;
}

.yearGuarantee { position: relative; padding-left: 65px; }
.yearGuarantee img {
	position: absolute;
	top: -2px;
	left: -10px;
	width: 142px;
}
.yearGuarantee h1 { 
	margin: 0px 0px 3px;
	padding: 10px 0px;
	padding-left: 30px;
	text-align: center;
	font-size: 25px;
	color: #fff;
	font-weight: 600;
}

.ultra_bond {margin-top: 50px; }
.ultra_bond span {
	display: block;
	font-size: 25px;
	margin-bottom: -5px;
}
.ultra_bond h1 { margin: 0px 0px 5px; font-weight: 700; font-size: 43px;}
.ultra_bond p { font-size: 20px; margin: 0px;}

h1.title {
	text-align: center;
	margin: 0px 0px 30px;
	font-weight: 700;
	font-size: 33px;
}


.ticks { padding: 0px; margin: 0px; }
.ticks li {list-style-type: none;font-size: 24px;margin-bottom: 5px;}
.ticks li .fa { margin-right: 20px; }

.testimonial {
	padding: 15px;
	background-color: #d7ebf9;
	margin-bottom: 10px;
	border: 1px solid #cee6f8;
}
.companyLogos {max-width: 1200px; margin: 0px auto; text-align: center;}
.companyLogos img {max-width: 40%; margin: 5px;}


/* CONTACT PAGE */
.cleanList .fa { width: 40px; }
#contactform, #minicontactform {font-weight: 300; font-size: 17px;}
#contactform .row input[type='text'],
#contactform .row textarea, #minicontactform .row input[type='text'], #minicontactform .row textarea { width: 100%; font-weight: 300; border-color: #e0e0e0; background-color: #fff;}
#contactform .row, #minicontactform .row { margin-bottom: 12px; }
#contactform #tokenbox, #minicontactform #tokenbox { background-color: #f5f5f5;}
#contactform #tokenbox #captcha, #minicontactform #tokenbox #captcha{ width: 60px; }
#contactform p, #minicontactform p { text-align: right; padding-right: 7px;}
#contactform h3, #minicontactform h3{margin-bottom: 0px; padding-left: 4px;}
#contactform .welcomeMessage, #minicontactform .welcomeMessage {
	text-align: left; 
	margin-bottom: 35px;
	margin-top: 5px;
	padding-left: 3px;
}
#contactform .button, #minicontactform .button {
	float: right;
	margin-top: 35px;
	padding: 13px 40px 7px;
	font-size: 18px;
	border: 0px;
	cursor: pointer;
	margin-bottom: 30px;
	margin-right: 7px;
	color: #fff;
}


.averageCost {
	text-align: center;
	padding: 12px 0px;
	background-color: #0070c0;
	margin: 6px 10px 15px;
	color: #fff;
	font-weight: 600;
	font-size: 18px;
	border-radius: 3px;
}


/* --- FEATURES --- */
.features {margin-top: 0px; }
.features .feature {
	padding: 0px;
	margin-bottom: 20px;
}
.features .feature > div {
	vertical-align: top;
	padding: 20px;
}

.features .feature > div:first-child { text-align: center;}
.features .feature > div:first-child .fa{
	font-size: 55px;
	color: #777;
}
.features.orange .feature > div:first-child .fa { color: #ff5700; }
.features.purple .feature > div:first-child .fa { color: #9500c7; }
.features .feature h4 {
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
	color: #0070c0;
	margin: 0px 0px 10px;
	text-align: center;
}
.features .feature p {margin: 0px; color: #444; text-align: center;}

.terms p {
	font-size: 12px;
	text-align: center;
}