@import url('//fonts.googleapis.com/css?family=Raleway:300, 400, 900,700,600');
@import url('//fonts.googleapis.com/css?family=Open+Sans:400,600,700');
body,
html {  width: 100%;  height: 100%;  margin: 0;  padding: 0; letter-spacing:-1px; font-family: 'Raleway', sans-serif; }

h1 {  font-size:2.8em; margin:0px;color:#003273; letter-spacing:-2px; font-weight:700; text-align:left; border:0px; line-height:100%;}
h2 {  font-size:2.5em; margin:10px 0 0 0;color:#003273;; letter-spacing:-1px; font-weight:700; text-align:left; }
h3 {font-size:1.6em; font-weight:700;  margin-top:30px!important ; color:#003273; 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}

h1,h2,h3,h4 {font-family: 'Raleway', sans-serif;   display: inline-block;
    padding-bottom: 20px;
	margin:0 0 10px 0;
    position: relative;}

h1:before,
h2:before,
h3:before{
    content: "";
    position: absolute;
    width: 100px;;
    height: 1px;
    bottom: 0;
    left: 0%;
    border-bottom: 3px solid #ccc;
}


.spacer {padding-top:80px;}
p{ color:#333; font-size:1.3em; margin:6px 0 6px 0; font-weight:300; line-height:1.3em;letter-spacing:-0.5px;}
.white {color:#ffffff !important}
td{ color:#333; font-size:1em;}
strong {font-weight:600; color:#000000;}
.left {float:left}
.right {float:right; }
SPAN {COLOR:#E52324;}

.half { float:left; width:50%; margin-right:0%; height:auto; padding:2% 0;  box-sizing: border-box	 }
.half:nth-of-type(2n){margin-right:0%;padding:3%;}
.half2 { float:right; width:49%; margin-left:0%;}

.clear {clear:both; } 

.imgleft{float:left; width:25%; margin:0 3% 3% 0%}
.imgright{float:right; width:25%; margin:0 0% 3% 3%}
.holder {margin:0px auto; max-width:960px; }
.holder:before, .holder:after {	content: "\0020";	display: block;	height: 0;	overflow: hidden;}
.holder:after {	clear: both;}

.halfholder {margin:0px auto; max-width:480px; float:left; }
.hmap {padding:0;margin:0;}

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

.formbtn {position: relative;
	    font-family: 'Raleway', sans-serif;
    z-index: 1000;
    pointer-events: all;
    clear: both;
    display: inline-block;
    background-color: transparent;
    padding: 8px 18px;
    color: #ffffff !important;
    text-align: center;
    text-decoration: none;
    font-size: 1.0em;
    font-weight: 300;
    border:0px;
      border: 2px solid #ffffff;
    transition: 0.5s;
border-radius:10px;}


header { width:100%; background-color:#fff; position:relative; z-index:11;}
header .top{ position:relative; z-index:9999;} 
header .logo { float:left; width:32%; margin-right:0%;height:auto;margin-top:25px;margin-bottom:5px; position:relative; z-index:1000; pointer-events:all;}
header .logo span {display:none}
header .logo img{ width:100%}

header .logo2 { float:right; width:20%; margin-right:0%;height:auto;margin-top:25px;margin-bottom:5px; position:relative; z-index:1000; pointer-events:all; text-align: center; color:#E52324; 
	font-size:1.4em;	    font-weight: bold}

header .logo2 img{ width:100%}


header .strapline {width:60%; text-align:center; height:auto;  margin:20px 0 0 0%;   pointer-events:all;float:left; font-size:2.5em; font-weight:600; line-height:1em; color:#444444;}
header .contacts {float:left;width:48%; margin-top:50px; text-align: center; 	  }
header .contacts a {color:#E52324;  color:#003273;  font-size:1.3em;font-weight:600; text-decoration: none}
header .contacts i {margin:0 10px 0 20px}



.phone-contact-h {position:relative; z-index:1000; pointer-events:all;float:right; color: #444444 !important; font-size:1.4em; height:24px;font-weight:600;  line-height:0.9em; text-decoration:none !important;margin-bottom:15px;}

header .navholder {width:100%; clear:both;margin-top:-40px; background-color:#003273;}


.flexslider {clear:both;}
.flexslider .slides li {    position:relative; height:0; padding-bottom:35%; background-size:cover; background-position:center center}
.flex-caption {text-align:center;  position:absolute;    top:275px; left:0;right:0; bottom:0;   z-index:1; padding:0% 0 0 0; }
.flex-strapline {float:left; text-align:left; background-color:#003273; color:#fff;text-shadow: 2px 2px 15px #444444;font-family: 'Raleway', sans-serif;  margin-top:0px;
	font-size:1.9em; padding:20px 30px; font-weight:600; line-height:100%; letter-spacing:-1px;position:relative; width:auto;  z-index:1; 
	-webkit-animation: slideIn2;animation: slideIn2;-webkit-animation-duration: 1s;animation-duration: 1s;}

#hero { height:440px ; margin-bottom:10px;} 
#hero .slide { height:440px ;background-color:#eee; position:relative; background-size:cover; background-position:center center}
#hero .slide .cover {background-color:rgba(0,0,0,0.3); position:absolute; top:0; width:100%; height:100%;}
#hero .slide .strapline { height:440px ; font-size:0.85em; }
#hero .slide .strapline .title { padding:130px 0 0 0; color:#fff; text-shadow: 2px 2px 0px rgba(0,0,0,0.5) ; font-size:3.8em; font-weight:600; text-align:center; letter-spacing:-3px; line-height:1.18em;}
#hero .slide .strapline .intro {text-align:center; padding:10px 50px; color:#fff;font-size:2.3em; font-weight:600;line-height:1.2em; letter-spacing:-1px; text-shadow: 2px 2px 0px rgba(0,0,0,0.5) ;}



@-webkit-keyframes slideIn {    0% { top: -50px; opacity: 0;		}    100% { top: 0; opacity: 1;    }}
@keyframes slideIn {		    0% { top: -50px; opacity: 0; 		}    100% { top: 0; opacity: 1; 	}}
@-webkit-keyframes slideIn2 {   0% { top: 50px; opacity: 0;     	}	 100% { top: 0; opacity: 1;    }}
@keyframes slideIn2 {		    0% { top: 50px; opacity: 0; 		}    100% {top: 0; opacity: 1; 	}}
/*FLEX CAROUSEL */

.box {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; 	 }
.box:nth-of-type(3n) {margin-right:0%;}
.box img{width:100%;}


#contactfooter {clear:both; width:100%; font-size:0.88em;padding:2% 0; background:#E52324; color:#fff; }
#contactfooter p{color:#fff; line-height:140%; margin:0 0 0 0;}

#contactfooter .box{ margin:0; width:33.3%}
#contactfooter .box:nth-of-type(3) p{ text-align: right}
#contactfooter .box:nth-of-type(3) img{ width:60px; margin: 0px 0 -10px 4px; opacity:1; transition:0.5s}
#contactfooter .box:nth-of-type(3) img:hover{ opacity:1}



#contactfooter a {text-decoration:none; color:#fff; }
#contactfooter a:hover{text-decoration:underline; color:#fff; }





.maintextbox {clear:left;float:left; width:65.5%; margin:0% 0 0;height:auto;color:#333; text-align:left; background-color:#fff; padding:0 }
.maintextbox h2, .mainholder h2 {text-align:left;  }
.maintextbox p, .mainholder p{color:#333;  }
.maintextbox a, .mainholder a { text-decoration:none; color: #333; font-weight:bold;}
.maintextbox a:hover, .mainholder a:hover {text-decoration:underline;}
.mainholder {clear:left;float:left; width:100%; margin:30px 0 30px;height:auto;color:#333; text-align:left;  padding:0 0}
/*SECOND LEVEL SETUP*/

.sidebar {float:right; width:31%;float:right; margin:0% 0 0 0 ; }
.sidebar .box1, .sidebar .box2 {float:left; width:100%; margin:0 0% 10% 0%; height:auto; background-color: #fff; padding: 0 0 5% 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0;}
.sidebar img { width:100%}
.sidebar h2 {width:100%; margin:0 0 1% 0}
.sidebar .box1 .btn ,.sidebar .box2 .btn,
.sidebar .box1 p, .sidebar .box2 p { color: #333; padding:0 10%}
.mainholder ul ,.half ul  {padding:1% 0%}
.mainholder ul li, .half ul li  {list-style-type: none;
    background: 0 0;
    padding-left: 0;
    line-height: 1.4em;
    margin: 0 0 5px;
    font-size: 1.4em;
   }



.mainholder ul li :before, .half ul li:before{
    content: "\02714";
    color: #E52324;
    font-weight: 400;
    margin-right: 2%;
}


#cform fieldset {margin:2% 0% 2%; padding:0; border:0px; width:100%}
#cform input {float:left; color:#333; background-color:#ffffff; width:100%; margin:0 0 8% 0%;border:0px; padding: 5% 5%;font-size:1.2em; box-sizing: border-box }
#cform select {float:left; color:#333; background-color:#ffffff; width:100%; margin:0 0 8% 0%;border:0px; padding: 5% 5%;font-size:1.2em; box-sizing: border-box  }
#cform textarea {float:left; color:#333; background-color:#ffffff; width:100%;height:100px; margin:0 0 10px 0;border:0px;  padding:2.5%;font-size:1.2em;box-sizing: border-box }
#cform .formbtn { float:left !important; font-size:1.4em; margin-top:20px;}
#cform fieldset label {float:left;width:100%; margin:0px 0 3px;  font-size:1.4em; color:#E52324;font-weight:700; }


#map {float:left; width: 98%; height: 320px; margin-top:5%;}

.halfcol {background:#003273 }
.halfcol p,
.halfcol li,
.halfcol h2{color:#ffffff }


@media (min-width: 1200px){
	header .contacts a {  font-size:1.6em}
	.enqform { padding:5% 0% 5% 5% !important}
.halfholder {
    margin: 0px auto;
    max-width: 600px;
    float: left;
    padding: 6%;
    box-sizing: border-box;
    padding: 3% 0% 3% 3% !important;
}

.holder {    max-width: 1170px!important; }

.phone-contact-h {float:right; color: #444444 !important; font-size:1.75em; height:24px;font-weight:600; line-height:0.9em; text-decoration:none !important;background: transparent  url(images/phone-icon.png) no-repeat 0px 0px ; background-size:contain;padding-left:32px; margin-bottom:15px;}

.flexslider .slides li {    position:relative; height:440px; padding-bottom:0%; background-size:cover; background-position:center center}

}


.enqform { }
@media only screen 
and (min-width : 0px) 
and (max-width : 991px){
	
	.enqform {background:#003273; padding:5% !important}
	.halfcol {background: #ffffff !important }

	.box.b2 {clear:both; width:100% !important; }
	
	.half{width:100%;}
	
	.halfcol p, .halfcol li, .halfcol h2 {    color: #003273;}
	
	.holder {width:100%;  font-size:1em; box-sizing: border-box}
	header { width:100%; margin:0px; padding:0px;}
	header .logo { float:left; width:242px; margin-right:0;height:auto;margin-left:3%;margin-top:10px;position:relative; z-index:1000; pointer-events:all;}
	header .strapline { display:none; }
	header .contacts {float:left;width:35%; margin-top:24px; margin-bottom:15px;  margin-right:0px; font-size:1.2em}
	header a.enquire-btn {float:right; clear:none; display:block;  margin:0 5% 0 0;  padding:4px 8px 5px; color:#ffffff; text-align:center; text-decoration:none; font-size:1.4em;font-weight:600;box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.2);}
	header .emailus {display:none}


	header .logo2  {margin-right: 75px;}
	header .logo2 span {display: none}
	
	#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, .sidebar {clear:left;float:left; width:100%; margin:0% 0%;height:auto;color:#333; text-align:left; background-color:#fff; padding:0 0%}
	.sidebar {margin:3% 0% 0;}
	.maintextbox h2, .mainholder h2 {text-align:left;  }
	.maintextbox p, .mainholder p{color:#333;  }
	.maintextbox a, .mainholder a, .sidebar a { text-decoration:none; color: #000; font-weight:bold;}
	.maintextbox a:hover, .mainholder a:hover, .sidebar a:hover {text-decoration:underline;}
	.mainholder {clear:left;float:left; width:100%; margin:3% 0 3%;height:auto;color:#333; text-align:left; background-color:#fff; padding:0 3%; box-sizing: border-box}
	

	
/*	
.mainholder br {display:none; }
*/

#map {float:left; width: 98%; height: 360px;}	

#contactfooter .box{width:50% !important; margin:0 25% !important;}
#contactfooter .box:nth-of-type(1){ text-align:left;}
#contactfooter .box:nth-of-type(3){ width:16%; margin-right:0%;padding:0.5% 0 0;}
#contactfooter .box:nth-of-type(4){ width:15%; margin-right:0%;padding:0.5% 0 0;}
	
		#hero { height:320px !important; margin-bottom:10px;} 
#hero .slide { height:320px !important; position:relative}
#hero .slide .strapline { height:320px !important; font-size:0.85em; }
#hero .slide .strapline .title {  padding:50px 30px 0 30px;  font-size:3.0em; }
#hero .slide .strapline .intro { padding:10px 100px; font-size:2.3em;  }


.flex-caption {text-align:center;  position:absolute;    top:145px; left:0;right:0; bottom:0;   z-index:1; padding:0% 0 0 0; }
	.flex-strapline {font-size:3vw;    padding: 10px 3%; }
	
	
}


@media only screen 
and (min-width : 679px) 
and (max-width : 991px){
	#header {  }


	
	.noxs {display:none; }


	
	

#contactfooter {clear:both; width:100%; background:#E52324; color:#fff; }
#contactfooter .box{margin-bottom:0%;padding:0.5% 0 1.75%; text-align:center;}
#contactfooter .box p{text-align:center !important;}
#contactfooter .box:nth-of-type(1){ width:50%;text-align:center;}
#contactfooter .box:nth-of-type(2){ width:50%;text-align:center;}
#contactfooter .box:nth-of-type(3){ width:50%; margin-right:0%;padding:0.5% 0 0;}
#contactfooter .box:nth-of-type(4){ width:50%; margin-right:0%;padding:0.5% 0 0;}
#contactfooter .box:nth-of-type(4) img{ width:20%; margin: 15px 0 0 0; opacity:0.7; transition:0.5s}
#contactfooter .box:nth-of-type(4) img:hover{ opacity:1}

#contactfooter .icon {float:left;width:33.3%; margin-right:0% ;height:auto; padding-bottom:15%;   box-sizing:border-box; position:relative}
#contactfooter .icon:nth-of-type(4) {margin-right:0% ;}

#contactfooter .icon img{ position:absolute; width:32px; top:15px;right:50%; margin-right:-16px; opacity:0.7; transition:0.5s}
#contactfooter .icon img:hover{ opacity:1}


}





@media only screen 
and (min-width : 0px) 
and (max-width : 678px){
	header .logo2 span {display:none}
	.imgleft{float:left; width:100%; margin:0 0 3% 0%}
.imgright{float:right; width:100%; margin:0 0% 3% 0%}

	.b2 div {font-size:1.5em !important}
	
		
	.holder {width:94%;  font-size:1em; box-sizing: border-box}

	header .logo2  {display: none}
	header .contacts { float:right;
    width: 52px;
    overflow: hidden;
    height: 34px;  margin-right:76px;
}
header .logo { float:left; width:200px; margin-right:0;height:auto;margin-top:15px;margin-left:5%; position:relative; z-index:1000; pointer-events:all;}
	.box {float:left; width:100%; margin:0 0% 3% 0%; height:auto;}
	.half, .half2 {width:100%; margin:3% 0% 0% 0; }
	.noxs {display:none; }
	.phone-contact-h {line-height: 0;
    font-size: 0;
    width: 36px;
    height: 36px;
    padding-left: 0px;
    margin-top: 12px;
    margin-bottom: -5px;
    margin-right: 85px;
    background: url(images/phone-icon.png) no-repeat 9px 1px;
    background-size: 80%;
    color: transparent !important;	}
	header a.enquire-btn {display:none; }
	header .fullholder {margin-top:0px;}

	.flexslider .slides li {    position:relative; height:270px; padding-bottom:0%; background-size:cover; background-position:center center}
	.flex-strapline {font-size:8vw; }

#cform .formbtn { float:right !important; font-size:1.2em; margin-top:0px;}

#contactfooter {clear:both; width:100%; background:#E52324; color:#fff; }
#contactfooter .box{margin-bottom:0%;padding:0.5% 0 1.75%; text-align:center;}
#contactfooter .box:nth-of-type(1){ width:100%;text-align:center;}
#contactfooter .box:nth-of-type(2){ width:100%;text-align:center;}
#contactfooter .box:nth-of-type(3){ width:100%; margin:0%;padding:0.5% 0 0;}
#contactfooter .box:nth-of-type(4){ width:100%; margin:0%;padding:0.5% 0 0;}
#contactfooter .box:nth-of-type(4) img{ width:20%; margin: 10px 0 0 0; opacity:0.7; transition:0.5s}
#contactfooter .box:nth-of-type(4) img:hover{ opacity:1}

#contactfooter .icon {float:left;width:22%; margin-right:4% ;height:auto; padding-bottom:12%;   box-sizing:border-box; position:relative}
#contactfooter .icon:nth-of-type(4) {margin-right:0% ;}

#contactfooter .icon img{ position:absolute; width:32px; top:15px;right:50%; margin-right:-16px; opacity:0.7; transition:0.5s}
#contactfooter .icon img:hover{ opacity:1}

		#hero { height:240px !important; margin-bottom:10px;} 
#hero .slide { height:240px !important; position:relative}
#hero .slide .strapline { height:240px !important; font-size:0.85em; }
#hero .slide .strapline .title {  padding:50px 30px 0 30px;  font-size:2.2em;line-height:100%; letter-spacing:-1px; }
#hero .slide .strapline .intro { padding:10px 30px; font-size:1.4em;  }

}


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

h1 {  font-size:1.6em;}
span { color:#E52324;}
h2 {  font-size:1.8em;  }
h3 {font-size:1.8em;}
	
	p {
    color: #333;
    font-size: 1.2em !important;
    margin: 6px 0 16px 0;
    font-weight: 400;
		line-height: 1.2em;}

	.holder {width:100%;  box-sizing: border-box}



	.flexslider .slides li {    position:relative; height:240px; padding-bottom:0%; background-size:cover; background-position:center center}
	
.flex-caption {padding:9% 0 0 0; }

.flex-strapline {font-size:7vw !important; }
	.box .formbtn {float:right; font-size:1.2em; margin:5px 0 10px; padding:6px 15px;}

}


.showf {display:none; }