@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400');

body, html{
	background-color:#57575d;
	font-family: 'Source Sans Pro', sans-serif;

	/*letter-spacing:0.25px;*/
}
.normal{
	font-family:sans-serif;
}
.seperator{
	width:1px;
	height:100%;
	border-left:1px solid #000;
}
.menu {
	display:none;
}
/*new menu*/
.menuContainer {
	display: flex;
	justify-content: center;
	width: 100%;
	margin-bottom:30px;
	height:10%;
}
.menuImageContainer {
	align-self: center;
	justify-content: center;
	max-width: 100%;
}
.menuImage {
	max-width: 230px;
}
.privacy-link a {
  color: inherit;
  font-size:12px;
  margin-top: 4px;
}
/*new menu*/
.currentPage{
	border-bottom:3px solid #1ec5b8;
}
#footer{
	border-top:2px solid #bcbcbe;
	font-size:10px;
	text-align:center;
	margin-top:15px;
	padding-top:10px;
	color:#fff;
}
#footer>p{
	margin:0 5px;
}
.item{
	position:relative;
	margin-bottom:5px;
	overflow:hidden;
	height:500px;
}
.item.resi, .item.resi>.smallimg{
	background:url(../images/1.jpg) no-repeat center center;
	background-size:cover;
}
.item.comm, .item.comm>.smallimg{
	background:url(../images/2.jpg) no-repeat center center;
	background-size:cover;
}
.item.it, .item.it>.smallimg{
	background:url(../images/3.jpg) no-repeat center center;
	background-size:cover;
}
.item.cons, .item.cons>.smallimg{
	background:url(../images/4.jpg) no-repeat center center;
	background-size:cover;
}

.smallimg{
	position:absolute;
	top:0;
	left:0;
	right:0;
	z-index:0;
}

.item>.heading{
	position: absolute;
	width: 100%;
	/*top: 0px;
	left: 0px;*/
	text-align: center;
	padding: 6px 0;
	font-size:16px;
	box-sizing:border-box;
	overflow:hidden;
	background-color:#37373c;
	z-index:10;
}
a{
	text-decoration:none;
}
.color-select, a.inline-link, a.inline-link:link, a.inline-link:visited {
	color:#1ec5b8;
}
.color-resi, a.color-resi:link, a.color-resi:visited{
	color:#11c8e7;
}
.color-comm, a.color-comm:link, a.color-comm:visited{
	color:#8053d3;
}
.color-it, a.color-it:link, a.color-it:visited{
	color:#66d238;
}
.color-cons, a.color-cons:link, a.color-cons:visited{
	color:#ff6817;
}
a.color-resi:hover, a.color-comm:hover, a.color-it:hover, a.color-cons:hover, a.inline-link:hover {
	color:#fff;
}
.item.resi>.heading{
	border-bottom:4px solid #11c8e7;
}
.item.comm>.heading{
	border-bottom:4px solid #8053d3;
}
.item.it>.heading{
	border-bottom:4px solid #66d238;
}
.item.cons>.heading{
	border-bottom:4px solid #ff6817;
}
.cursor{
	cursor:pointer;
}
.heading>div{
	top:0;
	bottom:0;
	left:0;
	right:0;
}
.heading>div>img{
	position: relative;
}

#content {
	position:relative;
	overflow:hidden;
}
.rot {
	display:none;
}
.item>.sector{
	display:none;
	max-width:none;
	margin-right:2%;
	z-index:1;
}
/*fix max-width bug in ie8*/
.item>.sector>img{
	max-width:none;
}
.item>.detail{
	position:absolute;
	display:none;
	padding:0 5%;
	left:0;
	right:0;
	bottom:0;
	background-color:#57575d;
	color:#fff;
}

.detail{
	font-size:14px;
}

.item>.sector{
	position:relative;
	float:right;
	/*margin:0 2%;*/
}
.item>.sector>img{
	width: 125px;
	height: 123px;
}
.item>.detail{
	text-align:justify;
}
.serviceHeader{
	background-image:url(../images/serviceHeader.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
	-ms-behavior: url(/js/backgroundsize.min.htc);
}
.serviceHeaderInfo{
	color:#fff;
	background-image:url(../images/serviceHeaderInfoBGPixel.png)
}
.serviceHeaderInfo>.infoHeader>h1{
	font-weight:100;
	margin:0;
	font-size:40px;
	line-height:1.1em;
}
.serviceHeaderInfo>.infoHeader>p{
	font-weight:100;
	line-height:1.3em;
	margin:0 0 18px 0;
	font-size:18px;
	width:210px;
}
.serviceHeaderInfo>.infoText{
	line-height:1.3em;
	font-size:14px;
}
.serviceHeaderInfo>img{
	margin-bottom:15px;
}
.underHeader{
	margin:18px 0 18px 0;
	width:100%;
	font-weight:300;
	font-size:17px;
}
.underHeader>p{
	margin: 0 30px;
}
.serviceKey{
	background-image:url(../images/serviceHeaderInfoKeyBGPixel.png);
	font-size:14px;
	color:#57575d;
}
.serviceKey>p{
	margin:0 0 15px 0;
}
.serviceKey>.keyItem{
	height:30px;
	margin-top:4px;
	line-height:30px;
	padding-left:15px;
}
.serviceKey>.keyItem.resi{
	border-left:4px solid #11c8e7;
}
.serviceKey>.keyItem.comm{
	border-left:4px solid #8053d3;
}
.serviceKey>.keyItem.it{
	border-left:4px solid #66d238;
}
.serviceKey>.keyItem.cons{
	border-left:4px solid #ff6817;
}
.serviceKey>.keyItem:hover{
	cursor:pointer;
}
.serviceKey>.keyItem.resi.sel, .serviceKey>.keyItem.resi:hover{
	color: #11c8e7;
}
.serviceKey>.keyItem.comm.sel, .serviceKey>.keyItem.comm:hover{
	color: #8053d3;
}
.serviceKey>.keyItem.it.sel, .serviceKey>.keyItem.it:hover{
	color: #66d238;
}
.serviceKey>.keyItem.cons.sel, .serviceKey>.keyItem.cons:hover{
	color: #ff6817;
}
.keyItem.sel{
	font-size:15px;
}
.service{
	height:72px;
	padding:15px;
}
.leftBorder{
		border-right:1px solid #7d7d7d;
}
.touch{
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-user-select: none;
	-webkit-touch-callout: none
}

.no-touch .service:hover, .service.hover_effect{
	cursor:pointer;
	background:#3f3f43;
}
.service>.checkbox{
	width:10px;
	height:10px;
	float:left;
	border:3px solid #fff;
	margin-top:2px;
	margin-right:10px;
}
.service.selected>.checkbox{
	background-color:#fff;
}
.service>.text{
	color:#fff;
	width:160px;
	float:left;
	line-height:1.2em;
	font-size:12px;
	margin-right:10px;
}
.fadeOut{
	filter:alpha(opacity=30);
	opacity:0.3;
}
.service>.sectors{
	float:left;
	margin-top:4px;
}
.service>.text>h4{
	margin:0 0 8px 0;
	font-size:13px;
}
.service>.sectors>.sect{
	width:12px;
	height:12px;
	margin-bottom:5px;
}
.service>.sectors>.sect.resi{
	background-color: #11c8e7;
}
.service>.sectors>.sect.comm{
	background-color: #8053d3;
}
.service>.sectors>.sect.it{
	background-color: #66d238;
}
.service>.sectors>.sect.cons{
	background-color: #ff6817;
}

.selection{
	width:100%;
	margin-top:15px;
	margin-bottom:15px;
	text-align:right;
	font-weight:300;
	vertical-align:middle;
	color:#1ec5b8;
}
.select{
	cursor:pointer;
	width:100%;
	float:right;
	margin:0;
	text-align:center;
}
.select>img{
	margin-right:5px;
	margin-bottom:3px;
	vertical-align:middle;
}
.selectedServiceHeader{
	position:relative;
	width:100%;
	font-weight:300;
	color:#fff;
	text-align:center;
}
.selectedServiceHeader>.text{
	font-size:36px;
	line-height:1em;
}
.selectedServiceHeader>.button{
	background-color:#1ec5b8;
	padding:8px 25px;
	font-weight:400;
	color:#57575d;
	margin-top:10px;
}

.selectedServiceHeader>.button:hover{
	color:#fff;
	cursor:pointer;
}

.selectedServiceContainer{
	position:relative;
	width:100%;
	background-color:#37373d;
	margin-top:15px;
	max-height:2000px;
}

.selectedServiceContainer>.info{
	float:left;
	width:100%;
	color:#fff;
	font-size:14px;
	font-weight:300;
	padding-bottom:25px;
	text-align: justify;
}
.selectedServiceContainer>.info>ul{
	color:#fff;
	margin:5px 0 0 0;
}
.selectedServiceContainer>.info>ul>li{
	margin:0 15px 0 20px;
}
.selectedServiceContainer>.info>h3{
	margin:0;
	font-weight:300;
	font-size:24px;
	margin:20px 20px 0px 20px;
}
.selectedServiceContainer>.info>p{
	margin:15px 20px 0px 20px;
}
.selectedServiceContainer>.image{
	position:relative;
	display:inline-block;
	float:right;
	height:250px;
	width:100%;
	/*background-color:#ccc;
	background:url('/images/loading.gif');*/
	background-size:cover;
	-ms-behavior:url(/js/backgroundsize.min.htc);
	background-position:center;
	overflow: hidden;
}
	.closeButton{
		background-color:#000;
		position:absolute;
		top:5px;
		right:5px;
		height:18px;
		width:18px;
		border:1px solid #fff;
		overflow: hidden;
		/*background-image:url(../images/closeButton.jpg);
		background-size:100%;*/
		cursor:pointer;
	}
.hiddenService{
	margin:0;
	max-height:0px;
	opacity:0;
}
#shareBox{
	/* must be initially hidden */
    display:none;

    /* place overlay on top of other elements */
    z-index:10000;

    /* styling */
    /*background-color:#333;*/
 	background-image:url(../images/shareBoxBGPixel.png);
    width:100%;
    /*min-height:200px;*/
}
#shareBox>.padder{
	padding:15px 25px 25px 25px;
}
#shareBox .heading{
	width:100%;
	font-size:32px;
	font-weight:300;
}

/*careers*/
.careers {
	color: #fff;
}
.job {
	overflow: hidden;
	margin-bottom: 60px;
}
.job .info {
	float: left;
    width: 100% !important;
    color: #fff;
    font-size: 14px;
    font-weight: 300;
    padding-bottom: 0px;
    text-align: left;  
    padding-top: 20px;
}
.job-list {
	list-style-type: disc;
    padding-right: 30px;
}
.job-list li {
	margin-bottom: 10px;
}
.job-subtitle {
	padding-left: 20px;
    font-weight: 400;
    font-size: 1.4em;
    padding-right: 20px;
}
.vacancies-title {
	font-weight: 300;
    font-size: 1.4em;
    margin-top: 40px;
}
.apply-callout {
	background-color: #1ec5b8;
    padding: 15px;
    font-size: 15px;
    font-weight: 400;
    text-align: center;
    margin-top: 60px;
    padding-bottom: 30px;
}

.job-header {
	margin-bottom: 50px !important;
}

.email a {
	 color: white;
    font-size: 23px;
    font-weight: 600;
}

.email a:hover {
	text-decoration: underline;
}




/*about*/
.pichead{
	height:250px;
	width:100%;
	margin-bottom:15px;
	background:url(../images/pichead.jpg) center center;
	background-size:cover;
}
.underPichead{
	height:50px;
	width:100%;
	line-height:50px;
	font-weight:300;
	font-size:38px;
	color:#fff;
	margin-bottom:35px;
	text-align:center;
	margin-top:15px;
}

.subHeading{
	font-size:28px;
	font-weight:300;
	margin-bottom:20px;
}

.abouttext, .privacy-text{
	color:#fff;
	font-size:14px;
	/*margin-bottom:30px;*/
	text-align:justify;
}
.underPichead.center{
	text-align:center;
}
.iptext{
	font-weight:300;
	color:#fff;
	font-size:28px;
	/*margin-bottom:30px;*/
	text-align:center;
}
.iptext>p>span{
	font-size:52px;
}
.abouttext>p, .privacy-text>p, .privacy-text>ul{
	margin:0 10px 15px 10px;
}
.abouttext>p:last-child, .privacy-text>p:last-child, .privacy-text>ul:last-child{
	margin-bottom:0;
}
.sidebar{
	display:none;
}
.sidebar .select{
	cursor:pointer;
	width:100%;
	float:left;
	margin-left:40px;
	text-align:left;
}
.sidebar .select>img{
	margin-right:5px;
	margin-bottom:3px;
	vertical-align:middle;
}
.contactHeader, .privacyHeader{
	margin-top:15px;
	padding-bottom:5px;
	padding-left:15px;
	border-bottom:1px solid #fff;
	margin-bottom:30px;
	font-weight:300;
	font-size:24px;
	color:#fff;
}
.contactinfo{
	color:#fff;
	font-weight:300;
}
.contactinfo>h4{
	font-weight:400;
	margin:0;
	padding-left:15px;
}
.contactinfo>p{
	margin-top:0;
	padding-left:15px;
}
a[href^=tel]{
    color:inherit;
    text-decoration:none;
}
.mapContainer{
	height:230px;
}
.wf-loading nav, .wf-loading p, .wf-loading .underPichead, .wf-loading .contactHeader, .wf-loading h1, .wf-loading .infoText, .wf-loading .text, .wf-loading .info {
    visibility: hidden;
  }
.contactinfo a{
	text-decoration:none;
	color:inherit;
}
/*.wf-active nav, .wf-active p, .wf-active .underPichead, .wf-active .contactHeader, .wf-active h1, .wf-active .infoText{
    visibility: visible;
}*/
/* General styles for all menus */
.cbp-spmenu {
	background: #3d3d3e;
	position: fixed;
}
.cbp-spmenu h3 {
	color: #fff;
	font-size: 1.9em;
	padding: 20px;
	margin: 0;
	font-weight: 300;
	background: #2b2c2c;
}
.cbp-spmenu a {
	display: block;
	color: #fff;
	font-size: 1.1em;
	font-weight: 300;
}
.cbp-spmenu a:hover {
	background: #258ecd;
}
.cbp-spmenu a:active {
	background: #afdefa;
	color: #47a3da;
}
/* Orientation-dependent styles for the content of the menu */
.cbp-spmenu-vertical {
	width: 240px;
	height: 100%;
	top: 0;
	z-index: 1000;
}
.cbp-spmenu-vertical a {
	border-bottom: 1px solid #fff;
	padding: 1em;
}
.cbp-spmenu-horizontal {
	width: 100%;
	height: 150px;
	left: 0;
	z-index: 1000;
	overflow: hidden;
}
.cbp-spmenu-horizontal h3 {
	height: 100%;
	width: 20%;
	float: left;
}
.cbp-spmenu-horizontal a {
	float: left;
	width: 20%;
	padding: 0.8em;
	border-left: 1px solid #258ecd;
}
/* Vertical menu that slides from the left or right */
.cbp-spmenu-left {
	left: -240px;
}
.cbp-spmenu-right {
	right: -240px;
}
.cbp-spmenu-left.cbp-spmenu-open {
	left: 0px;
}
.cbp-spmenu-right.cbp-spmenu-open {
	right: 0px;
}
/* Push classes applied to the body */
.cbp-spmenu-push {
	position: relative;
	left: 0;
}
.cbp-spmenu-push-toright {
	left: 240px;
}
.cbp-spmenu-push-toleft {
	left: -240px;
}
/* Transitions */
.anim,
.cbp-spmenu-push {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.shareText{
	position:relative;
}
.shareSelect{
	margin-top:15px;
	display:inline-block;
	width:49%;
}

.shareSelect .radio{
	display:inline-block;
	width:10px;
	height:10px;
	border: 4px solid #ccc;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	vertical-align:top;
}

.shareSelect .text{
	display:inline-block;
	vertical-align:top;
	width:80%;
	margin-left:2%;
	font-size:12px;
}

.shareSelect h4{
	margin-top:0;
	margin-bottom:0;
	font-size:14px;
}
.shareSelect p{
	margin-top:0;
}

.radio.selected{
	background-color:#ccc;
}
.shareSelect{
	cursor:pointer;
}
#shareBox .form{
	display:none;
}
.contactEmail{
	display:none;
}
#shareBox tr{
	margin-bottom:5px;
}

#shareBox tr.spacer{
	height:10px;
}

#shareBox .form table, table input, table TEXTAREA{
	width:99%;
}

input, TEXTAREA{
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #ccc;
}

input[type="text"]{
	height: 30px;
}

TEXTAREA{
	height:100px;
}

input[type="text"], TEXTAREA{
	font-family: 'Source Sans Pro';
  font-size:14px;
	padding:5px;
}
#shareBox .buttons{
	overflow:hidden;
}
#shareBox .button{
	float:right;
	margin-top:20px;
	display:inline-block;
	width:100px;
	height:35px;
	line-height:35px;
	color:#57575d;
	background-color:#1ec5b8;
	text-align:center;
	cursor:pointer;
}

#shareBox .button.grey{
	float:left;
	background-color:#ccc;
	margin-left:0.5%;
}

#shareBox .button:hover{
	color:#fff;
}

/*Client*/
.clientHeader{
	background-image:url(../images/clientHeader.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
	-ms-behavior: url(/js/backgroundsize.min.htc);
}
.clientOuter {
	background-color: #37373d;
}
.client.imageOuter {
	background-color: white;
}

.client.textInner {
	color:#fff;
	line-height:2vh;
	font-size:2vh;
	font-weight: 300;
}
/*Client*/

@media only screen and (min-width: 481px) {
	.item>.sector>img{
		width: 125px;
		height: 123px;
	}
	.menu {
		display:block;
		width:100%;
		margin:0 auto;
	}

	/*new menu*/
	.menuContainer {
		display: flex;
		justify-content: center;
		width: 100%;
		margin-top:40px;
		margin-bottom:30px;
		height:10%;
	}
	.menuImageContainer {
		align-self: center;
		justify-content: center;
		max-width: 35%;
		flex-grow: 1;
		min-width: 150px;
	}
	.menuTextContainer {
		align-self: center;
		display: flex;
		justify-content: flex-end;

		flex-grow: 1;
		flex-wrap: wrap;
		flex-direction: row;
	}
	.menuImage {
		padding-right: 3%;
	}
	.menuText {
		margin: 0 0 0 4%;
	}
	.menuImage>img{
		max-width:100%;
	}
	.menuText>a {
		display:inline;
		padding-bottom:5px
	}
	.menuText>a:visited, .menuText>a:link, .menuText>a{
		color:#fff;
	}
	.menuText>a:hover{
		color:#11c8e7;
	}
	/*new menu*/

	.underHeader>p{
		margin: 0;
	}
	.selectedServiceHeader{
		overflow:hidden;
		text-align:left;
	}
	.selectedServiceHeader>.text{
		text-align:left;
		float:left;
	}
	.selectedServiceHeader>.button{
		position:absolute;
		background-color:#1ec5b8;
		bottom:0;
		right:0;
		padding:8px 25px;
		font-weight:400;
		color:#57575d;
		display:block;
		margin-top:0;
	}
	.selectedServiceContainer>.info{
	}
	.selectedServiceContainer>.image{
	}
	.menu>h3{
		display:none;
	}
	.menuButton{
		display:none;
	}
	.select{
		margin-right:60px;
		text-align:right;
		width:200px;
	}
	#shareBox{
		width:70%;
	}
	.abouttext>p, .privacy-text>p, .privacy-text>ul{
		margin:0 0 15px 0;
	}
	.abouttext>p:last-child, .privacy-text>p:last-child{
		margin-bottom:0px;
	}
	.underPichead{
		margin-top:0;
		text-align:left;
		margin-bottom:20px;
	}
	.contactHeader{
		padding-left:0;
	}
	.contactinfo>h4{
		padding-left:0;
	}
	.contactinfo>p{
		padding-left:0;
	}
	.mapContainer{
		height:350px;
	}
}
@media only screen and (min-width: 769px) {
	.item>.heading{
		top:auto;
		bottom:0px;
	}
	#content{
		min-height:500px;
	}
	.item>.detail{
		float:left;
		margin-top:20px;
		padding:0 20px;
		bottom:auto;
		width:55%;
		background-color:transparent;
		background-image:url(../images/transHeadBack.png);
		font-size:13px;
	}
	.item>.detail>p{
		margin:15px 0;
	}
	.item > .heading{
		background-color:transparent;
		background-image:url(../images/HeadBack.png);
	}
	.item > .heading.dormant{
		background-image:url(../images/solidHeadBack.png);
	}
	.item.selected > .heading{
		background-image:url(../images/transHeadBack.png);
	}
	.item>.sector{
		float:left;
		margin-top:20px;
		margin-right:0;
	}
	.item>.sector>img{
		width: 125px;
		height: 123px;
	}
	.smallimg{
		display:none;
	}
	.menu>a {
		margin:0 4%;
	}
	#header>.logoContainer{
		display:inline-block;
		width:20%;
		margin:0 0 0 3%;
	}
	#header>.menuContainer{
		margin-left:10%;
	}
	.selectedServiceContainer>.image{
		height:350px;
	}
	.selectedServiceContainer>.info{
		width:40%;
	}
	.selectedServiceContainer>.image{
		display:block;
		width:60%;
		position:absolute;
		height:100%;
		right:0;
		top:0;
		background-color:#ccc;
	}
	.selectedServiceContainer.flip>.image{
		right:auto;
		left:0;
	}
	.selectedServiceContainer.flip>.info{
		float:right;
	}

	#shareBox{
		width:50%;
	}
	.sidebar{
		display:block;
	}
	.abouttext{
		text-align:left;
		border-right: 1px solid #898989;
	}
	.abouttext>p, .privacy-text>p, .privacy-text>ul{
		margin:0 40px 15px 0;
	}
	#footer>p{
		margin:0;
	}
	.abouttext, .privacy-text{
		margin-bottom:30px;
	}
}
@font-face {
    font-family: 'PT Sans';
    src: url('ptsans/PTS55F-webfont.eot');
    src: url('ptsans/PTS55F-webfont.eot?#iefix') format('embedded-opentype'),
         url('ptsans/PTS55F-webfont.woff') format('woff'),
         url('ptsans/PTS55F-webfont.ttf') format('truetype'),
         url('ptsans/PTS55F-webfont.svg#pt_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'font';
    src: url('font/fontlight-webfont.eot');
    src: url('font/fontlight-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/fontlight-webfont.woff') format('woff'),
         url('font/fontlight-webfont.ttf') format('truetype'),
         url('font/fontlight-webfont.svg#source_sans_prolight') format('svg');
    font-weight: 300;
    font-style: normal;

}
@font-face {
    font-family: 'font';
    src: url('font/fontreg-webfont.eot');
    src: url('font/fontreg-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/fontreg-webfont.woff') format('woff'),
         url('font/fontreg-webfont.ttf') format('truetype'),
         url('font/fontreg-webfont.svg#source_sans_proregular') format('svg');
    font-weight: 400;
    font-style: normal;

}