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

@import url('https://fonts.googleapis.com/css?family=Roboto+Slab:300,400|Roboto:300,300i,400,400i,500,500i');
@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css');


/*----------------------------------------------------------------
	Branding Colour
----------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6, #header2, ul, ol, ul a, ol a, ul a:hover, ol a:hover, ul a:focus, ol a:focus, .contact_detail, .contact_detail a, .contact_detail a:hover, .contact_detail a:focus, .formbuilder-form input#submit-form {
	color: orange;
}
.btn, #services, .form, #quote_form_form {
	background: orange;
}


/*----------------------------------------------------------------
	Common Styles
----------------------------------------------------------------*/

.none { display: none !important; }
.inline { display: inline; }
.block { display: block; }
.iblock { display: inline-block; }
.TAC { text-align: center; }
.TAL { text-align: left; }
.TAR { text-align: right; }
.left { float: left !important; }
.right { float: right !important; }
.slim { font-weight: 300; }
.bold { font-weight: 500; }
.slx_ml_0 { margin-left: 0 !important; }

.btn {
	font-size: 20px;
	line-height: 24px;
	font-weight: 500;
	color: white;
	padding: 18px 60px;
	text-decoration: none;
	white-space: normal;
}
	.btn:hover,
	.btn:focus {
		color: white;
		text-decoration: underline;
	}

.flex_center,
.content_block > .row {
	display: inline-block;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	  -webkit-box-align: center;
	-webkit-align-items: center;
		 -ms-flex-align: center;
			align-items: center;
}

/*----------------------------------------------------------------
	Layout
----------------------------------------------------------------*/

body {
	background-color: white;
	font-size: 18px;
	line-height: 28px;
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
	font-weight: 300;
	color: DimGrey;
}

ul, ol {
	list-style: none;
	margin: 0 0 25px;
	padding: 0;
	font-weight: 400;
}
	ul ul, ol ol { margin-bottom: 0; }

	ul li,
	ol li {
		list-style-type: none;
		list-style-position: outside;
		list-style-image: none;
		margin: 0 0 0 25px;
		padding: 0;
		position: relative;
	}
		#header ul li:before,
		#content ul li:before,
		#services ul li:before,
		#contact1a ul li:before,
		#contact1b ul li:before,
		#contact2 ul li:before {
			content: '\f058';
			font-family: 'FontAwesome';
			font-size: 16px;
			position: absolute;
			top: 0px;
			left: -25px;
		}
			div.formbuilder-wrapper .form-elements li { margin-left: 15px; }
			/* div.template-body div.formbuilder-wrapper li:before,
			div.formbuilder-wrapper .form-elements li:before { content: ''; } */

	ol li {	list-style-type: decimal; }

	.list_half {
		width: 48%;
		float: left;
		margin-right: 2%;
		overflow: hidden;
	}
		.list_half:after {
			content: "";
			display: table;
			clear: both;
		}

	.list_normal {
		font-weight: 300;
		color: DimGrey;
	}
		.list_normal a,
		.list_normal a:hover,
		.list_normal a:focus { color: DimGrey; }

p {
	margin: 0 0 25px;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 400;
	margin: 0 0 25px;
	padding: 0;
	font-family: 'Roboto Slab', Palatino, "Book Antiqua", Garamond, Georgia, serif;
}
h1, h3, h4, h5, h6 {}
	h1 { font-size: 36px; line-height: 40px; }
	h2 { font-size: 30px; line-height: 34px; }
	h3 { font-size: 26px; line-height: 30px; }
	h4 { font-size: 24px; line-height: 28px; }
	h5 { font-size: 22px; line-height: 26px; }
	h6 { font-size: 20px; line-height: 24px; }

a, button, input[type=submit], input[type=reset] { cursor: pointer; }
a {
	text-decoration: underline;
	word-wrap: break-word;
	color: DimGrey;
}
	a:hover, a:focus {
		text-decoration: none;
		color: DimGrey;
	}

strong, b { font-weight: 500; }
	
	
/*----------------------------------------------------------------
	Header Block
----------------------------------------------------------------*/

header {
	background-color: white;
	padding: 50px 0;
	color: DimGrey;
	font-weight: 500;
	position: relative;

	background-image: url('../img/img_3.jpeg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
	header a,
	header span {
		color: DimGrey;
		text-decoration: none;
	}
		header a:hover,
		header a:focus {
			color: DimGrey;
			text-decoration: underline;
		}

	#header1 p {
		font-size: 65px;
		line-height: 70px;
	}

	#header2 { text-align: right; }
		#header2a {
			font-size: 40px;
			line-height: 48px;
		}
			#header2a:before {
				content: '\f095';
				font-family: 'FontAwesome';
				font-size: 34px;
				position: relative;
			}
		#header2b {
			font-size: 20px;
			line-height: 26px;
			font-weight: 300;
		}


/*----------------------------------------------------------------
	Banner Block
----------------------------------------------------------------*/

#banner {
	padding: 120px 0 180px;
}
	#banner h1 {
		color: DimGrey;
		font-size: 50px;
		line-height: 58px;
		font-weight: 300;
		margin: 0;
	}
	#banner p {
		margin: 25px 0 0;
	}

.banner_cover {
	background-color: White;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.5;
}


/*----------------------------------------------------------------
	Services Block
----------------------------------------------------------------*/

#services {
	padding: 100px 0 80px;
	text-align: center;
	color: white;
}
	.service {
		margin-bottom: 20px;
	}
	.service img {
		width: 100px;
		height: 100px;
		margin: 0 auto;
	}
	.service h1,
	.service h2,
	.service h3,
	.service h4,
	.service h5,
	.service h6,
	.service p,
	.service a,
	.service a:hover {
		margin: 20px 0 0;
		color: white;
	}
	.service h1 + p,
	.service h2 + p,
	.service h3 + p,
	.service h4 + p,
	.service h5 + p,
	.service h6 + p,
	.service h1 + ul,
	.service h2 + ul,
	.service h3 + ul,
	.service h4 + ul,
	.service h5 + ul,
	.service h6 + ul {
		margin: 10px 0 0;
	}
	.service ul li {
		color: white;
		margin-left: 0;
	}
		#services ul li:before {
			position: relative;
			left: -5px;
		}


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

#content {
	padding: 100px 0;
}
	#content p.img {
		margin-bottom: 0;
	}
		#content p.img img {
			-webkit-box-shadow: 0 2px 14px 0 rgba(0,0,0,0.25);
			   -moz-box-shadow: 0 2px 14px 0 rgba(0,0,0,0.25);
				 -o-box-shadow: 0 2px 14px 0 rgba(0,0,0,0.25);
					box-shadow: 0 2px 14px 0 rgba(0,0,0,0.25);
		}
	.content_block {
		padding-bottom: 100px;
	}
	.content_block:last-child {
		padding-bottom: 0;
	}

/*----------------------------------------------------------------
	Gallery Block
----------------------------------------------------------------*/

#gallery {
	background-color: WhiteSmoke;
	padding: 100px 0 80px;
}
	#gallery p, #gallery p a {
		display: inline-block;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;

		-webkit-flex-flow: row wrap;
			-ms-flex-flow: row wrap;
				flex-flow: row wrap;

		-webkit-justify-content: space-around;
				  -ms-flex-pack: distribute;
				justify-content: space-around;

		  -webkit-box-align: center;
		-webkit-align-items: center;
			 -ms-flex-align: center;
				align-items: center;

		-webkit-align-content: center;
		   -ms-flex-line-pack: center;
				align-content: center;
	}
		#gallery p img,
		#gallery p > a,
		#gallery p.gallery1 > a,
		#gallery p.gallery1 img {
			-webkit-box-flex: 0 1 32%;
				-webkit-flex: 0 1 32%;
					-ms-flex: 0 1 32%;
						flex: 0 1 32%;
			max-width: 32%;
			margin-bottom: 20px;
		}
			#gallery p.gallery1 > a,
			#gallery p.gallery1 img {
				-webkit-box-flex: 0 1 100%;
					-webkit-flex: 0 1 100%;
						-ms-flex: 0 1 100%;
							flex: 0 1 100%;
				max-width: 100%;
			}
			#gallery p.gallery2 > a,
			#gallery p.gallery2 img {
				-webkit-box-flex: 0 1 49%;
					-webkit-flex: 0 1 49%;
						-ms-flex: 0 1 49%;
							flex: 0 1 49%;
				max-width: 49%;
			}
			#gallery p.gallery4 > a,
			#gallery p.gallery4 img {
				-webkit-box-flex: 0 1 24%;
					-webkit-flex: 0 1 24%;
						-ms-flex: 0 1 24%;
							flex: 0 1 24%;
				max-width: 24%;
			}
			#gallery p.gallery5 > a,
			#gallery p.gallery5 img {
				-webkit-box-flex: 0 1 19%;
					-webkit-flex: 0 1 19%;
						-ms-flex: 0 1 19%;
							flex: 0 1 19%;
				max-width: 19%;
			}
			#gallery p.gallery6 > a,
			#gallery p.gallery6 img {
				-webkit-box-flex: 0 1 16%;
					-webkit-flex: 0 1 16%;
						-ms-flex: 0 1 16%;
							flex: 0 1 16%;
				max-width: 16%;
			}
.featherlight .featherlight-content {
	padding: 0;
	border: none;
}
	.featherlight-previous {
		top: 0;
		left: 0;
	}
	.featherlight-next {
		top: 0;
		right: 0;
	}

/*----------------------------------------------------------------
	Contact Block
----------------------------------------------------------------*/

#contact {
	background-color: WhiteSmoke;
	padding: 100px 0;
}
	.contact_detail {
		margin-bottom: 10px;
		font-weight: 400;
		padding-left: 28px;
		position: relative;
	}
		.contact_detail:before {
			font-family: 'FontAwesome';
			position: absolute;
			top: auto;
			left: 0;
		}
			.contact_phone:before {
				content: '\f095';/*f098*/
			}
			.contact_mobile:before {
				content: '\f10b';
			}
			.contact_email:before {
				content: '\f0e0';
			}
			.contact_address:before {
				content: '\f041';
			}
		.contact_address {
			margin-bottom: 50px;
		}

	.contact_map iframe {
		width: 100%;
		height: 210px;
	}


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

footer {
	background-color: White;
	padding: 45px 0 50px;
	color: DimGrey;
	text-align: center;
	font-size: 16px;
	line-height: 20px;
}
	footer p { margin: 0; }
	footer a {
		font-weight: 500;
		text-decoration: none;
	}
		footer a:hover,
		footer a:focus {
			text-decoration: underline;
		}



/*----------------------------------------------------------------
	Responsive YouTube Video / Google Map
----------------------------------------------------------------*/

.iframe_responsive {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 0px;
	overflow: hidden;
	margin-bottom:20px;
}

.iframe_responsive iframe,
.iframe_responsive object,
.iframe_responsive embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/*----------------------------------------------------------------
	Fixes
----------------------------------------------------------------*/

img,
.img-responsive {
	display: inline-block;
	height: auto !important;
	max-width: 100%;
}
span.nospace { display: none; }


/*----------------------------------------------------------------
	Forms
----------------------------------------------------------------*/

.form,
#quote_form_form {
	margin: 0 0 25px;
	padding: 30px;
	border-radius: 3px;
}
	.formbuilder-form {
		margin: 0;
		padding: 0;
	}
	#quote_form.formbuilder-elements { padding: 10px; }

.formbuilder-form .row {
	margin: 0 0 10px;
	width: 100%;
}

.formbuilder-form label {
	width: 100%;
	font-size: 16px;
	line-height: 20px;
	font-weight: 300;
	color: white;
	margin-bottom: 2px;
}

input[type="file"],
input[type="image"],
input[type="submit"],
input[type="reset"],
input[type="button"],
input[type="radio"],
input[type="checkbox"] {
	width: auto !important;
}
.formbuilder-form input[type="radio"], .formbuilder-form input[type="checkbox"]{
	height: auto !important;
	min-height: 10px;
}	
	
	.checkBoxGroup { margin: 0; display: inline-block; }
		.checkBoxGroup label { font-weight: 300; width: auto; }
		.checkBoxGroup .option {
			margin: 0 10px 0 0;
			display: inline-block;
			clear: both;
			float: none;
			overflow: hidden;
			padding: 2px 0;
		}
			.checkBoxGroup .option input { margin: 6px 4px 0 0; }

	.radioButton { margin: 0; display: inline-block; }
		.radioButton label { font-weight: 300; width: auto; }
		.radioButton .option { margin: 0 10px 0 0; display: inline-block; }
			.radioButton .option input { margin: 6px 4px 0 0; }
	
	.formbuilder-form input,
	.formbuilder-form select,
	.formbuilder-form textarea {
		width: 100%;
		float: left;
		display: inline-block;
		min-height: 30px;
		box-sizing: border-box;
		background: WhiteSmoke;
		border-radius: 3px;
		margin: 0;
		padding: 10px;
		font-size: 16px;
		line-height: 20px;
		font-weight: 300;
		color: DimGrey;
	}
		.formbuilder-form input,
		.formbuilder-form textarea,
		.formbuilder-form select,
		.formbuilder-form select option {
			color: DimGrey;
			background-image: none !important;
			background: WhiteSmoke;
			border: none;
			padding: 10px;
		}
			.formbuilder-form select { padding: 0; }
			.formbuilder-form input#submit-form {
				margin-top: 10px;
				padding: 10px 50px;
			}
				.formbuilder-form input#submit-form:hover { text-decoration: underline; }

		
#__email__ {
	height: 0;
	margin: 0;
	width: 0;
	min-height: 0;
	padding: 0;
	visibility: hidden;
}

.formbuilder-form label.error {
	color: white;
	background-color: red;
	border: 1px solid white;
	border-radius: 3px;
	padding: 5px 10px;
	margin-bottom: 5px;
}

#extraFormsContainer .modal {
	bottom: 0 !important;
	display: block;
	height: 100%;
	left: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	right: 0 !important;
	top: 0 !important;
	width: 100%;
	background: none;
}
	#extraFormsContainer .modal-dialog {
		background: darkgrey;
		border-radius: 10px;
		left: 50%;
		margin: 0;
		padding: 20px;
		top: 40%;
		transform: translate(-50%, -50%);
	}
		#extraFormsContainer .modal-dialog input#submit-form { color: darkgrey; }

div.formbuilder-wrapper .adjust_close_link_spacing {
	position: absolute;
	top: 9px;
	right: 5px;
	cursor: pointer;
}

/*----------------------------------------------------------------
	Media Queries
----------------------------------------------------------------*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {}

@media only screen and (min-width : 992px) and (max-width : 1200px) {}

/* Medium Devices, Desktops */
@media only screen and (max-width : 991px) {
	.list_half { width: 100%; float: none; margin: 0; }
		.list_half + .list_half { margin-bottom: 25px; }
}

/* Small Devices, Tablets */
@media only screen and (max-width : 767px) {
    
     #content ul li:before,
     #contact1a ul li:before, 
     #contact1b ul li:before, 
     #contact2 ul li:before{
         position: relative; left: 0;
     }
     
    #service3 {clear:left }

	#content, #contact{
		padding: 30px 0;
	}
	#gallery{ padding:30px 0 30px 0;}
	#gallery p{ margin:0; }

	body { padding: 0; text-align: center; }
	.flex_center,
	.content_block > .row {
		-webkit-flex-flow: column nowrap;
			-ms-flex-flow: column nowrap;
				flex-flow: column nowrap;
	}
	#banner { padding: 80px 0 100px; }
	#content p.img { margin-bottom: 25px; }
	#header1 { margin-bottom: 0px; }
	#header2 { text-align: center; }
	#header1 p { margin: 0; }
	ul li:before,
	.contact_detail:before {
		position: relative;
		top: auto;
		left: auto;
		margin-right: 8px;
	}
	ul li { margin-left: 0; }
	.contact_detail { padding: 0; }
	img { margin: 0 auto; }
	#gallery p img,
	#gallery p.gallery3 img,
	#gallery p.gallery4 img,
	#gallery p.gallery5 img,
	#gallery p.gallery6 img {
		-webkit-box-flex: 0 1 49%;
			-webkit-flex: 0 1 49%;
				-ms-flex: 0 1 49%;
					flex: 0 1 49%;
		max-width: 49%;
	}
	#contact1 { margin-bottom: 25px; }
	.form { padding: 10px; }

	#content2a, #content4a, #content6a{
		order:2;
	}
}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
	.container { padding: 0 10px; }
	#banner { padding: 60px 0 80px; }
	.form { padding: 5px; }
	h1 { font-size: 30px; line-height: 34px; }
	h2 { font-size: 24px; line-height: 28px; }
	#banner h1 { font-size: 40px; line-height: 44px; }
	.service { width: 100%; }
}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
	.container { padding: 0 5px; }
	#gallery p img,
	#gallery p.gallery1 img,
	#gallery p.gallery2 img,
	#gallery p.gallery3 img,
	#gallery p.gallery4 img,
	#gallery p.gallery5 img,
	#gallery p.gallery6 img {
		-webkit-box-flex: 0 1 100%;
			-webkit-flex: 0 1 100%;
				-ms-flex: 0 1 100%;
					flex: 0 1 100%;
		max-width: 100%;
	}
}
