@import url("fonts.css");
@import url("fontello/css/fontello.css");
@import url("font-awesome/css/font-awesome.min.css");

body,html {  width: 100%;  height: 100%;  margin: 0;  padding: 0; background-color:#fff;font-family: 'merriweather';}
ol, ul {	list-style: none;}

h1,
h2,
h3,
h4, 
#header .info,
#carousel .title,
#reqform button{font-family: 'montserrat-bold', sans-serif;}

.cycle-slideshow {margin:20px 0}
div.responsive img { width: auto; height: auto }
#prev {float:left; margin-left:-50px; margin-top:-180px;}
#next {float:right; margin-right:-50px; margin-top:-180px;} 
.responsive div {margin:12px 0; font-family: 'montserrat-bold', sans-serif; font-size:1.05em; white-space: pre-wrap; color:#444444;}

.responsive div :after {opacity:0; content:'Broad range of styles & specs. \A \A Contact us to discuss your requirements.'; width:78%;padding:11% 6%; background:#402E6B;  color:#ffffff; font-size:0.9em;float:left; 
margin:-215% 6%; text-align:center; position:relative;  z-index:999;transition:0.5s;}
.responsive div :hover:after {opacity:1;content:'Broad range of styles & specs. \A \A Contact us to discuss your requirements.'; width:78%;padding:11% 6%; background:#402E6B;  color:#ffffff; font-size:0.9em; float:left; 
margin:-125% 5%; text-align:center; position:relative;  z-index:999;}


h1 { font-size:2.5em; margin:0px; letter-spacing:-1px; font-weight:600; text-align:center}
h2 { font-weight:400; font-size:1.6em; margin:20px 0 0 0;color:#402E6B; letter-spacing:-1px; }
h3 { font-weight:400; font-size:1.1em; margin:10px 0 0 0 ; color:#333; letter-spacing:-1px; }
h4 { font-weight:400; font-size:1.2em; margin:10px 0 0 0 ; color:#333; letter-spacing:-1px; }

hr {clear:both;border:0px; border-bottom:1px solid #ccc; margin:20px 0 20px 0}
.spacer {padding-top:24px;}
p{ color:#FFF; font-size:1.2em; margin:12px 0 0px 0;   font-family: 'merriweather-light'; text-align:center}
td{ color:#333; font-size:1.2em;}
strong {color:#402E6B; font-weight:600;}
.left {float:left}
.right {float:right; }
.half { width:100%; height:auto; }
.green {color:#A7BB41; }

.clear {clear:both; }

#map {float:right; width:50%; height:300px; margin:0 0 0 20px;}

.holder {margin:0px auto; max-width:1080px;  }
.holder:before, .holder:after {	content: "\0020";	display: block;	height: 0;	overflow: hidden;}
.holder:after {	clear: both;}

.fullholder {width:100%;}
.fullholder .holder {margin:0px auto 0;}

#header { width:100%; background-color:transparent; position:absolute; z-index:9999;}
#header .logo {clear:both; width:30%; margin:80px 35% 0;height:auto;position:relative; z-index:999; }
#header .logo span {display:none}
#header .logo img{ width:100%}
#header .phone {border:2px solid #ffffff; border-radius:10px; padding:3px 8px; font-family: 'montserrat-bold', sans-serif;float:left; margin-top:30px; color:#ffffff; font-size:1.2em; letter-spacing:-1px; position:relative; z-index:999;}
#header .email {border:2px solid #ffffff; border-radius:10px; padding:3px 8px; font-family: 'montserrat-bold', sans-serif;float:right; margin-top:30px;  color:#ffffff; font-size:1.2em; letter-spacing:-1px;   position:relative; z-index:999;}
#header .phone a,
#header .email a{ text-decoration:none; color:#ffffff;}

#header i{ margin-right:10px; }

#carousel .holder2 {position:relative; z-inde:9999;margin:0px auto; max-width:960px; 	display: block;  }
#carousel {float:left; width:100%; margin:0px 0 0px;height:630px;  color:#ffffff; text-align:center; background: #fff url(../images/header-background.jpg) no-repeat center top; background-attachment:fixed; background-size:cover;}
#carousel .title {font-family: 'montserrat-bold', sans-serif;width:56%;padding:310px 0px 0px 0px;margin:0px auto 0px auto ;  font-size:2.4em;  text-align:center; 	box-sizing: border-box;line-height: 110%; text-shadow: 0px 1px 3px rgba(0, 0, 0, .5);}
#carousel .strapline{  text-shadow: 0px 1px 2px rgba(0, 0, 0, .7);   font: 21px/30px 'merriweather-light', sans-serif;width:70%; margin:20px auto 20px auto ;  line-height:1.5em;  letter-spacing:0px; text-align:center ; 	box-sizing: border-box;}


.box1,.box11, .box2 {float:left; width:31%; margin-right:3.5%; margin-bottom:3%; height:auto; -webkit-box-sizing: border-box; 	-moz-box-sizing: border-box; 	box-sizing: border-box; 	 }
.box1:nth-of-type(3n){margin-right:0%;}

.box11 {width:48.5%; margin-right:0%; }
.box12 {float:right; width:48.5%;}

.box6 {float:left; width:15%; margin-right:2%; margin-top:2%; height:auto; -webkit-box-sizing: border-box; 	-moz-box-sizing: border-box; 	box-sizing: border-box; }
.box6:nth-of-type(6n){margin-right:0%;}
.box6:nth-of-type(10n){margin-left:17%;}

#options {background-color: #402E6B; padding-top:20px; }
#options.fullholder h1{font-size:2em; margin:0 0 0 0; padding:30px 0px 30px;color:#fff; }

#options.fullholder .box1{	position:relative; border:0px;  margin-top:0px; padding:0px; text-align:center; }
#options.fullholder .hex{width:50%;	border:0px;  margin:0px 25%; padding:0px;background:#ffffff;  border-radius:50%; text-align:center }
#options.fullholder .hex img{display:inline-block; width:100%; margin:0px auto}
#options.fullholder h2{font-size:1.55em; height:60px; margin:0 0 0 0; padding:20px 0px 0; box-sizing: border-box; color:#eee; }
#options.fullholder p{margin:0 0 0 0; padding:10px 00px 10px; font-size:1.3em; line-height:1.5em; color:#fff; }


#specialistsholder {clear:both; width:100%;   color:#000; background: #ffffff; padding:30px 0;}
#specialistsholder .box1{margin-bottom:0%; padding:0 0px;}
#specialistsholder h2 {font-size:2.2em; margin: 0 0 10px 0;color:#055938;  letter-spacing:-1px; font-weight:600; text-align:center}
#specialistsholder h3 {letter-spacing:-1px; color:#402E6B; font-weight:600;font-size:1.35em; margin:20px 0 0 0; text-align:center; padding:10px 0; }
#specialistsholder h3 div { margin-top:-10px;}
#specialistsholder .holder { margin:0px auto 0px; padding:5px 0}
#specialistsholder p{margin:0 0 0 0; padding:10px 00px 10px; font-size:1.3em; line-height:1.5em; color:#444; }


.mainholder a { text-decoration:none; color: #000; font-weight:700;}
.mainholder a:hover {text-decoration:underline;}
.mainholder {clear:left;float:left; width:100%; margin:0% 0 30px;height:auto;color:#333; text-align:center; background-color:#fff; padding:40px 0}

#reqformholder {clear:both; width:100%;   color:#000; background:#055938; margin:0 0 0px 0; text-align:center }
#reqformholder h2 {color:#ffffff; margin:30px 0 30px 0%; text-align:center; font-size:2.3em;}
#reqform fieldset {clear:both;margin:30px 0 0; padding:0; border:0px; width:100%}
#reqform input{box-sizing: border-box; 	float:left; color:#333; background-color:#F3F3F3; width:100%; margin:0 0 5% 0%;border:0; padding: 3% 4%; font-size:1em; border-radius:5px;}
#reqform textarea {box-sizing: border-box;  float:left; color:#333; background-color:#F3F3F3; width:100%; height:206px;margin:0 0 0px 0%;border:0; padding: 3% 4%;font-size:1em; border-radius:5px;}
#reqform input.error { background:#ffb2b2;font-style:italic}

#reqform button {clear:both; display:inline-block; text-align:center; background-color:#402E6B;color:#ffffff;  width:190px; margin:-30px auto 40px;  border:0px; padding: 1% 0% ; font-size:1.2em;border-radius:5px;}
#formsent {display:none; font-family: 'montserrat-bold', sans-serif; font-size:2em; color:#ffffff; font-style:italic; padding:30px 0 50px;}


#contactfooter {clear:both; width:100%; color:#fff;  background: #666666; }
#contactfooter .box1{margin-bottom:0%;padding-top:10px;padding-bottom:30px; text-align:center;}

#contactfooter h2 { font-size:1.3em; color:#fff; }
#contactfooter h2 i{ margin-right:10px; }
#contactfooter p{ font-size:1.1em; line-height:170%;}

#contactfooter .holder {  line-height:150%; margin:0px auto 0px; padding:0px 0;}
#contactfooter .icons {float:right;width:50%; margin:-20px 0 32px 0 ; }
#contactfooter .icons .icon {float:right;width:20px; height:20px !important;background-color:#D1CFD0; padding:5px; }
#contactfooter a { color:#fff; text-decoration:none;}
#contactfooter a:hover { color:#fff; text-decoration:underline;}

.mobshow {display:none; }

/*@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px){ 
ACTIVE WHEN LIVE*/ 
@media only screen 
and (min-width : 0px) 
and (max-width : 991px){

.noshow {display:none; }
.mobshow {display:block; }

	.holder {width:100%;font-size:1em;}
	#header { width:100%; margin:0px; height:69px;padding:0px;}
	
#header .phone {margin-left:30px; }
#header .email { margin-right:30px;}

#carousel2 {float:left; width:100%; height:100px !important; margin:70px 0 20px;} 

#carousel .title {font-family: 'montserrat-bold', sans-serif;width:56%;padding:310px 0px 0px 0px;margin:0px auto 0px auto ;  font-size:2.4em;  text-align:center; 	box-sizing: border-box;line-height: 110%; text-shadow: 0px 1px 3px rgba(0, 0, 0, .5);}
#carousel .strapline{  text-shadow: 0px 1px 2px rgba(0, 0, 0, .7);   font: 21px/30px 'merriweather-light', sans-serif;width:70%; margin:20px auto 20px auto ;  line-height:1.5em;  letter-spacing:0px; text-align:center ; 	box-sizing: border-box;}

#udform{	display:none;   }
#options.fullholder .box1, #options.fullholder .box2{margin-bottom:3%;}
#options { width:94%; padding:3%; }
#specialistsholder .holder { width:94%; margin:0 3% 1% 3%;}
#contactfooter .holder { width:94%; margin:0 3% 1% 3%; }

.fullholder {clear:both; width:100%; background-color: #fff; padding:0% 0; margin:0 0 0% 0;height:auto; }
.fullholder .holder {margin:0; }

.maintextbox {clear:left;float:left; width:100%; margin:0% 0%;height:auto;color:#333; text-align:left; background-color:#fff; padding:0 0%}
.maintextbox a, .mainholder a { text-decoration:none; color: #000; font-weight:bold;}
.maintextbox a:hover, .mainholder a:hover {text-decoration:underline;}
.mainholder {clear:left;float:left; width:94%; margin:0% 0 20px;height:auto;color:#333;  background-color:#fff; padding:40px 3% 0}



.cycle-slideshow {margin:20px 10px 0}
#prev {display:none;float:left; margin-left:-10px; margin-top:-160px; }
#next {display:none;float:right; margin-right:-10px; margin-top:-160px;}
.cycle-slideshow div {margin:12px 0 0; font-family: 'montserrat-bold', sans-serif; font-size:1.05em; white-space: pre-wrap; color:#444444;}




#reqformholder fieldset{ width:94%; margin:0 3% 5% 3%;    text-align:center; padding:0; }

}


@media only screen 
and (min-width : 569px) 
and (max-width : 991px){
	#header {  }
	.box1, .box2 {float:left; width:45%; margin:0 2.5% 5%; height:auto; text-align:center}
	.half {clear:left; width:48.5%!important; margin:0 0% 0 0%; }
	.half2 {float:right; width:48.5%!important; margin:0 0% 0 0%; }
	
	#options.fullholder h2{margin:0 0 0 0; padding:20px 0px 0; font-weight:600;}

	
.noxs {display:none; }


	#contactfooter .box1 {width:33.3%;  margin:0}
	
	#reqformholder .box1{float:left;	text-align:left;  margin:0 0% 3% 3%;   width:45.5% !important; }
	#reqformholder .box2{float:left;	text-align:left;  margin:0 0% 3% 3%;  width:45.5% !important;}

#header .logo {	 width:40%; margin:60px 30% 0; }
	.box6 {float:left; width:45%; margin:5% 2.5% 0; height:auto; -webkit-box-sizing: border-box; 	-moz-box-sizing: border-box; 	box-sizing: border-box; }
.box6:nth-of-type(6n){margin:5% 2.5% 0; }
.box6:nth-of-type(10n){margin:5% 2.5% 0; }
}




@media only screen 
and (min-width : 0px) 
and (max-width : 690px){
	
.box1, .box2 {float:left; width:94%; margin:0 3% 5% 3%; height:auto; text-align:center}
	
	.box6 {float:left;  width:94%; margin:0 3% 5% 3%; height:auto; -webkit-box-sizing: border-box; 	-moz-box-sizing: border-box; 	box-sizing: border-box; }
.box6:nth-of-type(6n){margin:0 3% 5% 3%; }
.box6:nth-of-type(10n){margin:0 3% 5% 3%; }
	
	
	#contactfooter .half, #contactfooter .half2 {width:100%; margin:3% 0% 2% 0; }
	
	#contactfooter .holder {width:94%; position:relative;}
	#contactfooter .box1  {width:100% !important;  text-align:center; margin:0px;}

	#header .logo {	 width:50%; margin:0px 25% 0; }
	
	#header .phone {padding:3px 0px 3px 8px;  }
	#header .email { padding:3px 0px 3px 8px; }
	#header .phone span{display:none; padding: 3px 8px 3px 8px;}
	#header .email span{display:none;padding: 3px 8px 3px 8px;}

#carousel .title {font-family: 'montserrat-bold', sans-serif;width:76%;padding:270px 0px 0px 0px;margin:0px auto 0px auto ;  font-size:2.4em;  text-align:center; 	box-sizing: border-box;line-height: 110%; text-shadow: 0px 1px 3px rgba(0, 0, 0, .5);}
#carousel .strapline{  text-shadow: 0px 1px 2px rgba(0, 0, 0, .7);   font: 21px/30px 'merriweather-light', sans-serif;width:80%; margin:20px auto 20px auto ;  line-height:1.5em;  letter-spacing:0px; text-align:center ; 	box-sizing: border-box;}

#reqformholder { width:94%;   padding:0 3%; text-align:center }
#reqformholder fieldset{ width:94%; margin:3%;    text-align:center; padding:0; }

.box11 {width:100%; }
.box12 {width:100%;}

}


@media only screen 
and (min-width : 0px) 
and (max-width : 568px){
	#header {  }
	.box1, .box2 {float:left; width:94%; margin:0 3% 5% 3%; height:auto; text-align:center}
	.half, .half2 {width:100%; margin:3% 0% 2% 0; }

	#reqformholder .box1{float:left;	 clear:left;text-align:left; width:94%; margin:0 3% 3%}
	#reqformholder .box2{float:left;	 clear:left;	text-align:left; width:94%;margin:0 3% 3%}
	
#header .info {display:none;}

#carousel .title {font-family: 'montserrat-bold', sans-serif;width:86%;padding:270px 0px 0px 0px;margin:0px auto 0px auto ;  font-size:2.0em;  text-align:center; 	box-sizing: border-box;line-height: 110%; text-shadow: 0px 1px 3px rgba(0, 0, 0, .5);}
#carousel .strapline{  text-shadow: 0px 1px 2px rgba(0, 0, 0, .7);   font: 17px/26px 'merriweather-light', sans-serif;width:80%; margin:20px auto 20px auto ;  line-height:1.5em;  letter-spacing:0px; text-align:center ; 	box-sizing: border-box;}




}

@media only screen 
and (min-width : 0px) 
and (max-width : 375px){


}
.showf {display:none; }