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

@import url('https://fonts.googleapis.com/css?family=Lato:400,500,700');

body { margin: 0px; padding: 0px; font-family: 'Lato', sans-serif; border-top: #f3f3f3 10px solid; }
a {  transition: all .2s ease-in-out; text-decoration: none; }

#header #logo { display: block; float: left; width: 275px; height: 100px; background: url(../img/logo.jpg) no-repeat; background-size: cover; margin-top: 25px; }

#header #nav { float:right; margin-top: 10px; background: url(../img/navbg.png); }
#header #nav a { text-transform: capitalize; color: #000; text-decoration: none; margin-left: 5px; margin-right: 5px; }
#header #nav a:hover { color: #a6001b; }

#header #head-contact { margin-bottom: 10px; text-align: right; line-height: 30px; display:block; margin-top: 60px; float: right;}
#header #head-contact .search-jobs { padding: 7px 25px 7px 25px; background: #444444; color: #fff; text-decoration: none; font-size: 13px; margin-right: 20px; transition: all .2s ease-in-out;}
#header #head-contact .contact-tel { font-size: 25px; font-weight: bold; display: block; }
#header #head-contact .contact-email { font-size: 25px; font-weight: bold; display: block; }
#header #head-contact .fa { color: #a6001b; }
#header #head-right { float: right; margin-top: 40px; }

#top-bar { background: url(../img/grey-pattern-bg.png); }

.container { max-width: 1200px; padding-left: 50px; padding-right: 50px; margin: auto; }
.clr { clear: both; }

#navigation {  background: #a6001b; width: 100%; padding-top: 20px; padding-bottom: 20px; margin-top: 25px; text-align: center; border-bottom: #790014 10px solid; border-top: #f1f1f1 3px solid; }
#navigation a { color: #f1f1f1; margin-left: 20px; margin-right: 20px; font-size: 20px; font-weight: bold; text-shadow: 1px 1px #950004; padding: 10px 10px 15px 10px; }
#navigation a:hover { color: #fff; transform:scale(1.02); background: rgba(0,0,0,0.2); padding: 20px 10px 20px 10px; }

#headimg-thin { height: 150px; background-size: cover; padding-top: 50px; overflow: hidden; border-bottom: #f1f1f1 15px solid; border-top: #111 2px solid; }
#headimg-thin h1 { padding-top: 170px; color: #fff; font-weight: bold; font-size: 45px; margin: 0px; text-shadow: 1px 1px #000; padding: 20px; border-radius: 40px; text-align: center;}
#headimg-thin h2 { padding-top: 10px; color: #fff; font-weight: lighter; font-size: 25px; margin: 0px;  text-shadow: 1px 1px #000; }

#footer { background: #000; padding-top: 20px; padding-bottom: 20px; }
#footer-links a { color: #fff; text-transform: capitalize; text-decoration: none; margin-right: 15px; }
#footer-links a:hover { color: #a6001b; }
#footer-copyright { color: #fff; font-size: 11px; margin-top: 10px; float: left;}
#footer-copyright a { color: #ccc; }
#top { float: right; font-size: 25px; color: #333; }
#top:hover { color: #a6001b; }

#content { padding-top: 40px; padding-bottom: 40px; }

.home h1 { text-align: center; color: #a6001b; font-size: 26px; margin-bottom: 30px; }
.home p { text-align: center; width: 90%; margin: 15px auto; line-height: 35px; color: #000; font-size: 18px; font-weight: lighter; }

ul { line-height: 25px; color: #444444; }

#mobile_nav_icon { display: none ; }
#mobile_nav_close { display: none ; }

#mobile-contact-info { display: none; }
#mobile-contact-info { display: none; }

#header-video {  width: 100%; background: url(../img/headbg.jpg) no-repeat; background-size: cover; }
.header-overlay { background: rgba(0,0,0,0.6); width: 100%; height: 100%; padding-top: 100px; height: 300px; z-index: 0; color:#fff !important; }

#left-col { width: 20%; float: left; margin-right: 10%; }
.left-col-head { display: block; width: 100%; padding: 15px; padding-left: 0px; padding-right: 30px; color: #444444; font-weight: bold; text-decoration: none; border-bottom: #ccc 1px solid; }
.left-col-head:hover { color: #a6001b; }

.left-col-link { display: block; width: 100%; padding: 15px; color: #444444; font-weight: lighter; text-decoration: none; border-bottom: #fff 1px solid; background: #f1f1f1; }
.left-col-link:hover { background: #a6001b; color: #fff; }
.active { border-left: #a6001b 5px solid; }

#right-col { width: 70%; float: left; }

.contentbox h1 { color: #a6001b; text-transform: capitalize; font-weight: lighter; font-size: 30px; }
.contentbox p { line-height: 30px; color: #444444; font-weight: lighter; }
.contentbox ul { line-height: 30px; color: #444444; font-weight: lighter; }

.sector { width: 31%; float: left; background: #ccc; margin-right: 3.5%; padding-top: 200px; margin-bottom: 40px; transition: all .2s ease-in-out; box-shadow: 10px 10px 0px #f2f2f2; }

.sector-title { background: #a6001b; color: #fff; padding: 15px; font-size: 16px; font-weight: bold; text-transform: uppercase; -webkit-clip-path:polygon(0 0, 100% 0, 100% 93%, 0 100%);
  clip-path: polygon(0 0, 90% 0, 100% 100%, 0 100%); }
.sector-title:hover { background: #111; }

.sector:hover { transform:  scale(1.05);box-shadow: 10px 10px 0px #999;  }

.right { float: right !important; margin-right: 0px !important; }

#contact-details { padding: 30px; background: #f8f8f8; margin-bottom: 40px; margin-top: 20px; }
#contact-details #left { line-height: 100px; font-weight: bold; font-size: 26px; }
#contact-details #left strong { color: #000; font-weight: normal; }
#contact-details #left span { display: block; }

#contact-details #right { float: right; font-size: 26px; color: #a6001b; line-height:50px; margin-top: 10px; }
#contact-details #right strong { color: #000; font-weight: normal; }
#contact-details #right span { display: block; }

#contact-form { float: left; width: 45%; }
#contact-form input[type=text] { padding: 15px; width: 95%; margin-bottom: 15px; font-size: 14px; border: #e1e1e1 1px solid; }
#contact-form input[type=submit] { background: #a6001b; color: #fff; text-transform: uppercase; font-weight: bold; padding: 15px 25px 15px 25px; border: none; font-size: 18px; transition: all .2s ease-in-out; }
#contact-form input[type=submit]:hover { cursor: pointer; background: #538f10; }
#contact-form .textarea { padding: 15px; width: 95%; margin-bottom: 15px; font-size: 14px; resize: none; border: #e1e1e1 1px solid; }


.head-slider { color: #fff; text-align: center; max-width: 900px; margin: auto; margin-top: 30px; }
.head-slider h1 { font-size: 50px; margin-top: 10px; padding-top: 0px; margin-bottom: 20px; color: #a6001b; text-shadow: 1px 1px #000; } 
.head-slider h2 { font-weight: lighter; font-size: 26px; margin-bottom: 0px;  color: #fff; text-shadow: 1px 1px #000; }
.head-slider p { margin-top: 0px; padding-top: 0px; line-height: 25px;  color: #fff; text-shadow: 1px 1px #000; }

.left-col { width: 60%; margin-right: 5%; float: left; }
.right-col { width: 30%; float: right; padding: 20px; margin: 0px; margin-bottom: 40px; }
.left-col ul { line-height: 30px; }
.right-col h2 { color: #1f212e; text-transform: uppercase; margin-top: 0px; padding-top: 0px; }
.right-col .button { display: block; float: none !important; margin-left: 0px;  padding: 15px; color: #fff; background: #a6001b; text-transform: uppercase; text-decoration: none; transition: all .2s ease-in-out; margin-top: 20px; }
.right-col .button:hover { background: #000; }

#map { float: right; margin-bottom: 40px; width: 50%; }

.testimonial { margin-bottom: 40px; margin-top: 40px; padding: 20px; background: #fff; }
.testimonial p { margin-top: 0px; padding-top: 0px; line-height: 30px; }
.testimonial .author { margin-top: 0px; float: right; }
.testimonial img { float: left;  margin-right: 10px;}

.value { padding: 30px; background: url(../img/tri-bg.jpg) no-repeat; background-size: cover; color: #fff; width: 26.3%; margin-right: 3%; float: left; height: 190px; border-bottom: #720a0f 10px solid; }
.value p { line-height: 25px !important; }
.value h1 { margin-top: 0px; padding-top: 0px; }

#overlay { width: 100%; height: 100%; position: fixed; display: block; z-index: 10; background-color:rgba(0,0,0,0.7); display: none; }
#overlay .close { position: absolute; top: 0px; right: 10px; color: #ffffff; font-weight: 600; font-size: 36px; cursor: pointer; }
.overlayBox { z-index: 20; width: 940px; height: 240px; background: #ffffff; padding: 30px 30px 30px 30px; position: absolute; top: 50%; left: 50%; margin: -150px 0px 0px -500px; display: none; }

.file_extensions { font-size: 12px; text-align: left; margin-bottom: 15px; color: #333; }

#overlay { position: absolute; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index:9999;}

#overlay #bookcall { background: #f6f8fa ;  width: 500px; position: absolute; left: 50%; margin-left: -250px; top: 5%; text-align: center; padding: 25px 40px 40px 40px; box-shadow: 0px 0px 20px #000; box-sizing: border-box; }

#overlay #bookcall h1 { font-size: 35px; margin-top: 10px; margin-bottom: 10px; }
#overlay #bookcall h2 {  color: #555; font-weight: 400; font-size: 18px; margin-bottom: 30px; line-height: 27px; margin-top: 10px; padding-top: 0px; }
#overlay #bookcall input[type=text] { display: block; width: 100%; padding: 12px; box-sizing: border-box; font-size: 17px; color: #000; border: none; background: #ececec; margin-bottom: 10px; border-bottom: #ccc 2px solid; }
#overlay #bookcall input[type=submit] { display: block; width: 100%; padding: 12px; box-sizing: border-box; font-size: 18px; color: #fff; border: none; background: #a6001b; margin-bottom: 10px; font-weight: bold; transition: all .2s ease-in-out; cursor:pointer; -webkit-appearance: none;  }
#overlay #bookcall input[type=submit]:hover { background: #333;}
#overlay #bookcall .close { width: 25px; height: 25px; margin-top: 15px; margin-right: 5px; background: url(../img/close.png); display: block; float: right; text-decoration: none; background-size: contain; opacity: 0.5; transition: all .2s ease-in-out; }
#overlay #bookcall .close:hover { opacity:1.0; }
#overlay #bookcall  form .custom-file-input { margin-bottom: 15px; margin-top: 5px; float:left; }
#overlay #bookcall  form .custom-file-input::-webkit-file-upload-button { visibility: hidden; width: 100px; margin-bottom: 10px; }
#overlay #bookcall  form .custom-file-input::before { content: 'Upload File'; display: inline-block; background: #666; width: 100px; text-align: center; outline: none; white-space: nowrap; -webkit-user-select: none; cursor: pointer; font-weight: 400; font-size: 15px; height: 40px; line-height: 40px; color: #fff; float: left; }


.btn-blue { padding: 15px; line-height: 20px; margin-top: 0px;  transition: all .2s ease-in-out; background: #a6001b; color: #fff; text-transform: uppercase; font-size: 13px; text-decoration: none; font-weight: bold; margin-top: 25px; display: block; width: 130px; text-align: center; }
.btn-blue:hover { background: #000; }

.menu_overlay { display: none; }
.menu_overlay{display:none;width:100%;height:250%;min-height:500px;background:rgba(0,0,0,.95);position:absolute;left:0;z-index:99999;top:153px}.menu_overlay .menu_holder{margin:0 0 0 0;padding-top:30px}.menu_overlay .menu_holder a{font-size:22px;line-height:35px;color:#fff;text-align:center;display:block;font-weight:100;text-transform:capitalize;margin:0 0 0 0;text-decoration:none}.menu_overlay .menu_holder a:hover{color:#007eff}
#areas { margin: 0px; padding: 0px;}
#areas li { display: block; float: left; list-style: none; padding: 10px; background: #f1f1f1; margin: 5px; color: #000; }
#areas a { color: #333; font-weight: 400; }
#areas a:hover { color: #000; }

blockquote {
    font-size:16px; 
    padding:40px 40px 20px 40px;
    margin-left:3px; 
    margin-bottom:40px;
    background:#f2f1f6;
	border-bottom: #ccc;
	box-shadow: 10px 10px 0px #aeaeae;
	 transition: all .2s ease-in-out; 
}	

blockquote:before {
    color: #c73401;
    font-size: 40px;
    line-height: 0.5em;
    margin-right: 0.27em;
    content: "\f10d";
    font-family: FontAwesome;
    float:left;
	display: block;
	margin-bottom: 10px;
	margin-right: 40px;
}

blockquote:hover { transform: scale(1.05);}

blockquote p { font-size: 20px; }
blockquote strong { font-size: 25px; margin-top: -20px; margin-bottom: 30px; }


@media (max-width: 1000px) {
	
	#header { }
	#header #nav { margin-top: 20px !important; text-align: center; margin: auto; float: none !important; }
	#header #nav a { margin-left: 7px !important; margin-right: 7px !important; }
	
	#footer-links { text-align: center !important; }
	#footer-links a { margin-bottom: 20px !important; line-height: 25px;}
	#footer-copyright { text-align: center !important; }
	
	#header #head-contact { float: none !important; }
	#header #logo { float: none; margin: 10px auto; }
	#header #head-contact { display: none; }
	
	#mobile-contact-info { display: block; background: #edebeb; padding: 5px; text-align: center; }
	#mobile-contact-info i { color: #a6001b; font-size: 30px; margin-left: 20px; float: right; }
	#mobile-contact-info .search-jobs { padding: 7px 25px 7px 25px; background: #444444; color: #fff; text-decoration: none; font-size: 13px; margin-right: 20px; transition: all .2s ease-in-out; float: left; }
	
	#mobile-contact-info .search-jobs i { float: none !important; color: #fff !important; font-size: 12px !important; margin-left: 0px !important; }
	
	#mobile-contact-info .contact-tel { line-height: 30px; font-size: 20px; float: right; }
	#mobile-contact-info .contact-tel i { float: none; font-size: 30px; text-decoration: none; color: #000 }
	#mobile-contact-info .search-jobs:hover { background: #000; }
	
	.sector { width: 45%; }
	
	#contact-details #left { text-align: center !important; }
	#contact-details #right { float: none !important; line-height: 40px; margin-bottom: 40px; }
	#contact-details .email { display: block; text-align: center; }
	#contact-details .tel { display: block; text-align: center; }
	
	#map { float: none !important; width: 100%; margin-top: 40px !important; }
	#contact-form { float: none !important; width: 100%; }
	#contact-form input[type=text] { width: 90%; }
	#contact-form input[type=submit] { width: 100%; }
	#contact-form .textarea { width: 90%; }
	
	.vacancy { width: 47% !important; }
	.vacancy-left { float: none !important; text-align: center; width: 100%; }
	.vacancy-right { float: none !important; }
	.vacancy-right .link { width:90%; margin: auto; margin-bottom: 10px;}

	.value { width: 90% !important; float: none !important; margin-bottom: 30px !important; height: 150px;}
		
}

@media (max-width: 700px) {
	
	body { border-top: 0px; }
	
	#header #logo { float: left !important; margin-top: 0px; margin-bottom: 20px; width: 170px; height: 60px; }
	#header #navigation { display: none; }
	#header #nav { display: none !important; }
	#header { height: 25px; padding-top: 20px; padding-bottom: 20px; margin-bottom: 10px; }
	
	#mobile_nav_icon { font-size: 30px; display: block; float: right; color: #000; margin-top: 10px; }
	#mobile_nav_icon:hover { color: #a6001b; }
	
	#mobile_nav_close { font-size: 30px; display: none; float: right; color: #000; margin-top: 10px; }
	#mobile_nav_close :hover { color: #a6001b; }
	
	#headimg { height: 250px; background-repeat: none; }
	#headimg-thin { height: 100px; background-repeat: none; background-position: center !important; }
	#headimg-thin h1 { padding-top: 22px; color: #fff; font-weight: lighter; font-size: 45px; margin: 0px; }
	#headimg-thin h2 { padding-top: 10px; color: #fff; font-weight: lighter; font-size: 25px; margin: 0px; }

	#navigation { display: none; }
	
	.header-overlay { padding-top: 30px; padding-bottom: 50px; }
	.head-slider { height: auto; }
	.head-slider h1 { font-size: 30px; margin-top: 10px; padding-top: 0px; margin-bottom: 20px; color: #a6001b; text-shadow: 1px 1px #000; } 
	.head-slider h2 { font-weight: lighter; font-size: 20px; margin-bottom: 0px;  color: #fff; text-shadow: 1px 1px #000; }
	.head-slider p { margin-top: 0px; padding-top: 0px; line-height: 25px;  color: #fff; text-shadow: 1px 1px #000; }

	
	#headimg h1 { color: #fff; text-transform: uppercase; text-align: left; font-size: 30px; margin: 0px; font-weight: bold; padding-top: 70px; }
	#headimg h2 { color: #fff; text-align: left;  font-weight: lighter; line-height: 30px; font-size: 20px; padding-left: 0px !important; }
	
	.contentbox p { width: 100%; }
		
	#header .container { padding-left: 20px; padding-right: 20px; }
	
	.sector { width: 100%; margin-right: 0px; }
	#left-col { float: none !important; width: 90% !important; }
	#right-col { float: none !important; width: 100%; margin-top: 50px; }
	
	.case-study { width: 100%; }
	.case-study-image { height: 120px; }
	
	.vacancy { width: 100% !important; }
	.vacancy-left { float: none !important; text-align: center; width: 100%; }
	.vacancy-right { float: none !important; }
	.vacancy-right .link { width:90%; margin: auto; margin-bottom: 10px; }
	.vacancy-head { font-size: 13px; }
	
	#headimg-thin { padding-top: 30px; padding-bottom: 50px !important;  box-sizing: border-box; }
	#headimg-thin h1 { font-size: 35px; }
	
	.container p { width: 100%; }
	.container { padding-left: 10px; padding-right: 10px; }
	
	.jobsearch h1 { text-transform: uppercase; color: #fff; padding-top: 55px !important; font-weight: bold !important; font-size: 40px !important; }
	.jobsearch .field { float: none !important; width: 92%; margin-top: 15px; }
	.jobsearch .field h2 { text-transform: uppercase; color: #fff; font-weight: normal !important; display: none; }
	.jobsearch .field input[type=text] { padding: 15px; font-size: 16px; width: 100%; border: none; }
	.jobsearch input[type=submit] { padding: 15px; font-size: 16px; color: #fff; background: #363636; border: none; float: none; margin-top: 20px; width: 102%; }
	.jobsearch input[type=submit]:hover { cursor: pointer; background: #000; transition: all .2s ease-in-out; }
	.jobsearch select { width: 100%; height: 47px; font-size: 14px; border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px; }
	
	#vacancytitle { background: #1d3800; padding-top: 20px; padding-bottom: 20px; color: #fff; font-size: 25px; }
	#vacancytitle a { float: right!important; color: #fff; background: #a6001b; padding: 15px; font-size: 16px; margin-top: 15px; display: none; }
	#vacancytitle a:hover { background: #fff; color: #4c850e; }
	#vacancytitle span { display: block; margin-top: 10px; float: none!important; }

	.meet-team-staff { margin: 0px 0px 20px 0px; }
	.meet-team-staff .image { width: 200px; height: 200px; margin-right: 0px !important; float: none !important; background: #cccccc; margin: auto !important; margin-bottom: 40px !important; }
	.meet-team-staff .desc { width: 100%; float: none !important; }
	.meet-team-staff .desc .name { font-size: 16px; color: #171717; font-weight: 600; text-align: left !important; }
	.meet-team-staff .desc .text { font-size: 14px; font-weight: 300; margin: 15px 0px 0px 0px; line-height: 20px; }
	.meet-team-staff .desc .text p { font-size: 14px; }
	
	.value { width: 85% !important; float: none !important; margin-bottom: 30px !important; height: 200px; }
	
	#headimg-thin { height: 180px; }
	
}