/* Synergetics CSS */

/* Colours

Text on white: #333;

Backgrounds
Orange: #ff5d1d
Orange shadow: #a23b12
Blue: #3a84df
Blue shadow: #26606e

Light grey text: #9d9d9d

Strong blue: #00a1f1

Dark grey menu highlight: #080808
grey menu: #222222
Light grey backdrop : #3a3a3a
*/

/* Fonts and text */
body {
	background-color: #bdccde;
	font-size: small;
	font-weight: 400;
	font-family: 'Droid Sans', Helvetica, Arial, sans-serif;
	line-height: 1.5;
	color: #333;
	margin-top: 50px;
	padding:0;
	background: #fff; /* Old browsers */
	background-image: url('/images/dotg.png');
	background-repeat: repeat;
}

#tinymce{
	background-color: #fff;
}

.mask {
/* 	color: #fff; 
	background-image: url('/images/doth.png');
	background-repeat: repeat;*/
}

.content-wrap {
	background-color: #fff;
	/*padding-bottom: 20px;*/
}

.content-pad {
	padding: 10px 20px 10px 20px;
}

.footer-wrap {
	padding: 0px 20px 15px 20px;
	margin-bottom:0;
	background-color: #222;
	background-color: rgba(22,22,22,0.85);
	
}

.sans {
	font-weight: 400;
	font-family: 'Droid Sans', Helvetica, Arial, sans-serif;
	line-height: 1.5;
}

.serif {
	font-weight: 400;
	font-family: 'Droid Sans', Helvetica, Arial, sans-serif;
	line-height: 1.5;
}

.small {
	font-height: 1em;
}

.tiny {
	font-height: 0.83em;
}

/** article content **/
.item-page p {
	text-align: justify;
}

.fig {
	display:table;
 	margin-left: auto;
	margin-right:auto; 
	margin-top:1em;
	margin-bottom:1em;
	width: 1%;
}

div.fig {
width: 100%;
}

.fig img {
  	display:block;
	margin-top: 1em;
	margin-bottom:1em;
	margin-left: auto;
	margin-right:auto;
	max-width: 627px;
	height: auto;
}

.fig p {
/* 	display:block; */
	display:block; 
	font-weight: 600;
}

.portrait img {
	margin-right: 10px;
	margin-bottom: 10px;
}

.half-span {
	width: 295px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 0px;
	margin-right: 10px;
}

.full-span{
	width: 100%;
	padding: 10px;
	margin: 10px auto 10px auto;
}

.centre{
	display: table;
	margin-right:auto;
	margin-left: auto;
}

.inline {
display:inline;
}

.inline-block {
display:inline-block;
}

.block {
	display:block;
}
.case-square {
	display:inline-block;
	background-color: #3a84df;
	padding:10px;
	vertical-align: top;
}

.case-square h3 {
	color: #fff;
	margin-top: 10px;
	margin-bottom:  10px;
}

.case-square div {
	padding: 10px;
	background-color: #fff;
}

.case-square p {
	color: #000;
}

.case-square img {

	margin: 5px;
}



h1 {
	font-family: 'Roboto','Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
	font-weight: normal;
	font-size: 36px;
}

h2 {
	font-family: 'Roboto','Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
	font-weight: bold;
	font-size: 2em;
}

h3 {
	font-family: 'Roboto','Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
	font-weight: bold;
	font-size: 1.2em;
}

h4 {
	font-family: 'Roboto','Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
	font-weight: bold;
	font-size: 1em;
}

h1 a, h2 a, h3 a {
	text-decoration: none;
}

h1 a:visited, h2 a:visited, h3 a:visited {
	color: #333;
}

a {
	color: #3a84df;
	text-decoration: none;
	/*padding: 0;
	margin: 0;*/
}

a:hover {
	color: #3a84df;
	text-decoration: underline;
}

a:visited {
	color: #9d9d9d;
}

li {
	color: #333;
}

/************* Layout **************/

/* General */

.line {
display:block;
clear: both;
background-color: #fff;
height: 1px;
width: auto;
}

.col-line {
display:block;
clear: both;
height: 1px;
width: auto;
padding-top: 25px;
margin-bottom: 15px;
border-bottom: 1px solid #eee;
}

.pad {
	padding: 15px;
}

.pad-left {
	padding-left: 15px;
}

.pad-right {
	padding-right: 15px;
}
.pad-top {
	padding-top: 15px;
}

.pad-bottom {
	padding-bottom: 15px;
}

.pad-horz {
	padding-left: 15px;
	padding-right: 15px;
}

.pad-vert {
	padding-top: 15px;
	padding-bottom: 15px;
}

#logo {
	padding-top: 1px;
}

/*Social media buttons */
.button {
	padding: 0;
	margin: 0;
	margin-top: 4px;
	margin-bottom: 4px;
 	max-height: 20px; 
}

.button .div {
	margin: 0;
	padding: 0;
}

/* Nav bar */

.navbar {
font-family: 'Roboto', 'Helvetica Neue', 'Helvetica', 'sans serif';
font-size: 1em;
}

.navbar-inverse {
background-color: #222;
background-color: rgba(22,22,22,0.85);
/*background: #3a84df; /* Old browsers */
/*background: -moz-linear-gradient(left, #3a84df 0%, #5bffa8 100%); /* FF3.6+ */
/*background: -webkit-gradient(linear, left top, right top, color-stop(0%,#3a84df), color-stop(100%,#5bffa8)); /* Chrome,Safari4+ */
/*background: -webkit-linear-gradient(left, #3a84df 0%,#5bffa8 100%); /* Chrome10+,Safari5.1+ */
/*background: -o-linear-gradient(left, #3a84df 0%,#5bffa8 100%); /* Opera 11.10+ */
/*background: -ms-linear-gradient(left, #3a84df 0%,#5bffa8 100%); /* IE10+ */
/*background: linear-gradient(to right, #3a84df 0%,#5bffa8 100%); /* W3C */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a84df', endColorstr='#5bffa8',GradientType=1 ); /* IE6-9 */
}

.dropdown-menu .sub-menu {
    left: 100%;
    position: absolute;
    top: 0;
    visibility: hidden;
    margin-top: -1px;
} 

.dropdown-menu li:hover .sub-menu {
    visibility: visible;
}

.dropdown:hover .dropdown-menu {
    display: block;
}

.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
    margin-top: 0;
}

.navbar .sub-menu:before {
    border-bottom: 7px solid transparent;
    border-left: none;
    border-right: 7px solid rgba(0, 0, 0, 0.2);
    border-top: 7px solid transparent;
    left: -7px;
    top: 10px;
}
.navbar .sub-menu:after {
    border-top: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #fff;
    border-bottom: 6px solid transparent;
    left: 10px;
    top: 11px;
    left: -6px;
}

.navbar-inverse .container .navbar-nav>li>a {
color: #EDEDED;
}

.navbar-inverse .container .navbar-nav>li>a:focus {
color: #fff;
}
.navbar-inverse .container .navbar-nav>li>a:hover {
color: #fff;
}
/* Main */


/* Banner */

.tight {
padding: 0;
margin: 0;
}

/* Slide headings */
div.bannerhead {
	display: block;
	margin-bottom: 1em;
}

.content {
	margin-top: 90px;
	width: 450px;
	padding: 20px 25px 25px 25px;
	float:right;
	background: #191615;
	background: rgba(26, 23, 24, 0.9);
}

.bannerhead span {
	font-size: 36px;
	line-height: 47px;
	padding: 3px 0 3px 0;
	margin: 0;
}

.bannerhead a, .bannerhead a:visited, .bannerhead a:hover {
	color:#fff;
}

/* Slide text */
.bannertext span {
	font-size: 16px;
	line-height: 23px;
	font-family: 'Roboto', 'sans serif';
	padding: 3px 0 3px 0;
	margin: 0;
	font-weight:400;
}

.bannertext span strong {
font-family: 'Roboto', 'sans serif';
	font-size: 17px;
}

.bx-wrapper {
background: #3a84df; /* Old browsers */
background: -moz-linear-gradient(left,  rgba(58,132,223,0.6) 0%, rgba(91,255,168,0.6) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(58,132,223,0.6)), color-stop(100%,rgba(91,255,168,0.6))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  rgba(58,132,223,0.6) 0%,rgba(91,255,168,0.6) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  rgba(58,132,223,0.6) 0%,rgba(91,255,168,0.6) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  rgba(58,132,223,0.6) 0%,rgba(91,255,168,0.6) 100%); /* IE10+ */
background: linear-gradient(to right,  rgba(58,132,223,0.6) 0%,rgba(91,255,168,0.6) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#993a84df', endColorstr='#995bffa8',GradientType=1 ); /* IE6-9 */

}

#attitude-frame > li {background-size:cover;}
#attitude-frame > li .container  {height: 500px;}

/*
.frame3 .container {
	height: 500px;
	background-repeat: no-repeat;
	background-position: left; 
	width: 60%;
}
.frame3 {
	background-color: none; 
	background-image: url('../images/banners/mhf-bg4.jpg');
	background-size:cover;

}
.frame2 .container {
	height: 500px;
	background-repeat: no-repeat;
	background-position: left;
	width: 50%;
}
.frame2 {
	background-color: none; 
	background-image: url('../images/banners/cfd-bg.jpg');
	background-size:cover;
}

.frame1 .container {
	height: 500px;
	background-repeat: no-repeat;
	background-position: left; 
}

.frame1 {
 	background-image: url('../images/banners/plant-scape-bg.jpg');
	background-size:cover;
}

.frame5 .container {
	height: 500px;
	width:75%;
	background-image: url('../images/banners/copra_trans.png');
	background-repeat: no-repeat;
	background-position: left; 
}
.frame5 {
	background-image: url('../images/banners/bg-copra-heat-ex.jpg');
	background-size:cover;
}
*/

#attitude-frame {
	height: 500px;
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

#attitude-frame li {
	color: #ffffff;
	height: 500px;
}

.slide {
	margin-top: 100px;
	float: left;
}

.slideback {
	margin-top: 100px;
	float: left;
}

/* Portfolio */
.portfolio {
	background-color: none;
	
/* background-color: rgba(58, 132, 233, 0.5); 
background: #3a84df; 
background: -moz-linear-gradient(left, #3a84df 0%, #5bffa8 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#3a84df), color-stop(100%,#5bffa8)); 
background: -webkit-linear-gradient(left, #3a84df 0%,#5bffa8 100%); 
background: -o-linear-gradient(left, #3a84df 0%,#5bffa8 100%);
background: -ms-linear-gradient(left, #3a84df 0%,#5bffa8 100%);
background: linear-gradient(to right, #3a84df 0%,#5bffa8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a84df', endColorstr='#5bffa8',GradientType=1 );  */

}

.portfolio-wrap {
	padding: 20px 35px 15px 0px;
	padding-left: 35px;
	background-color: #fff;
/* 	background: #419cd4; 
background: -moz-linear-gradient(left,  #419cd4 0%, #55e7b4 100%); 
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#419cd4), color-stop(100%,#55e7b4)); 
background: -webkit-linear-gradient(left,  #419cd4 0%,#55e7b4 100%);
background: -o-linear-gradient(left,  #419cd4 0%,#55e7b4 100%); 
background: -ms-linear-gradient(left,  #419cd4 0%,#55e7b4 100%);
background: linear-gradient(to right,  #419cd4 0%,#55e7b4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#419cd4', endColorstr='#55e7b4',GradientType=1 );
 */
}

.porthead {
	margin-top: 10px;
	margin-bottom: 10px;
	margin-right: 20px;
	padding-top: 6px;
	padding-bottom: 8px;
	padding-left: 10px;
/* 	background: #191615;
	background: rgba(26, 23, 24, 0.8); */
}

.portfolio h2 {
 /* 	color: #fff;  */
	margin: 0;
	padding: 0;
/* 	font-weight: normal; */

}
.portfolio ul {
	margin-left: 10px;
}
.portfolio > div >div > ul > li {
/*  	color: #fff;  */
	list-style: square;
	list-style-position: inside;
/*	font-family: 'Droid Sans',"Helvetica Neue",Helvetica,'Droid Sans',Arial, sans-serif;*/
	font-weight: 400;
	font-size: 1.2em;
	line-height: 1.7;
}

.portfolio a {
padding: 0;
margin: 0;
}

.collage {
margin: 10px;
display: inline-block;

}

.collage img{
margin:2px;
padding:0;
border: 0;
float: left;
vertical-align: top;
}
.textbox{
	padding: 11px 13px 11px 13px;
	background: #191615;
	background: rgba(26, 23, 24, 0.85);
}

.casebox {
	width: 250px;
	height: 250px;
 	display: inline-block; 
	vertical-align: top;
	margin: 0 2px 2px 0;
	float: left;

 	/* -webkit-box-shadow: 0 0 3px 3px rgba(10, 10, 10, 0.6); 
	-moz-box-shadow: 	0 0 3px 3px rgba(10, 10, 10, 0.6);
	box-shadow: 	 	0 0 3px 3px rgba(10, 10, 10, 0.6); */  
}
	
.casebox .textbox > p {
	padding-left: 0;
}

.curtain {
 	padding: 15px 15px 15px 15px;
	background-color: none;
/* 	background-color: rgba(79, 212, 187, 0.4);
	background-color: rgba(22, 22, 22, 0.4); */
	width: 250px;
	height: 250px;
	border: solid 5px transparent; 
}

.curtain:hover {
 	padding: 15px 15px 15px 15px;
/* 	background-color: none;
	background-color: rgba(58, 132, 223, 0); */
 	border: solid 5px rgba(58, 132, 223, 0.5); 
}

/* header backdrop */
.casebox  span{
	color: #fff;
 	font-size: 20px;
	line-height: 23px; 	
	font-family: 'Roboto',"Helvetica Neue",Helvetica, sans-serif;
 	font-weight: 400;
	box-decoration-break: clone; 
}

.casebox a, .casebox a:visited {
	color: #fff;
}

.casebox a:hover,.casebox span:hover{
	text-decoration: underline;
}
.casebox ul {
	padding-top: 10px;
	padding-left: 0;
}
.casebox li {
	color: #fff;
	list-style: square;
	list-style-position: inside;
/* 	font-family: 'Droid Sans',"Helvetica Neue",Helvetica,'Droid Sans',Arial, sans-serif;*/
	font-weight: 400;
	font-size: 1em;
	line-height: 1.5; 
}

.casemin{
	min-width: 270px;
}

.casemin ul{
	padding-left: 0;
}
.case1 {
	background-image: url("../images/case/transport.jpg");
}

.case2 {
		background-image: url("../images/case/building.jpg");

}
.case3 {
	background-image: url("../images/case/plume.jpg");
}
.case4 {
	background-image: url("../images/case/mhf.jpg");
}

/* Tags */

.tags {
margin-bottom: 15px;
}
.tags span {
margin-right: 5px;
}
.tags .label {
background-color: #3a84df;
color: #fff;
}

.tags .label:hover {
background-color: #72a3df;
color: #fff;
}

/************** Sidebar  ***************/
/* Articles */
.main {
}

.sidebar {
	display: block;
	padding-left: 3em;
	min-width: 200px;
	background-color: #fff;
}

@media (max-width: 600px) {
    .sidebar {
	display: block;
	padding:0;
	margin: 0;
	min-width: 200px;
	background-color: #fff;
}


@media (max-width: 600px) {

}
}


.sidebar > h3{
/* padding-top: 3em; */
}

.container::after,.container::before{
height: 0px;
}

.category-module {
	display: inline;
	padding-left: 3em;
	margin-left: 0px;	
}

.category-module li{
	list-style: square;
	list-style-position: inside;
}
/* Tags */


/* Contact block */

.contact-block {
clear: both;
background-color: #3a84df;
color: #fff;
width: 100%;
margin: 10px 0 10px 0;
padding: 10px;
background-color: #3a84df;
}

@media (max-width: 600px) {
    .contact-block {
clear: both;
background-color: #3a84df;
color: #fff;
width: 100%;
margin: 10px 0 10px 0;
padding: 10px;
background-color: #3a84df;
}
}

.contact-block address {
padding-bottom: 0;
}

.contact-block a {
color: #fff;
text-decoration: none;
}

.contact-block a:hover {
color: #fff;
text-decoration: underline;
}

/************* Email box **************/

.mod_sef {
	font-family: 'Droid Sans', 'Helvetica', 'Arial';
	padding: 20px;
}

.mod_sef_tr td, .mod_sef_tr th {
	padding-bottom: 10px;
}

/************** Footer  ***************/

.footer {
/*  	display: table; */
/*	background: #222222; */
	padding-top: 6em;
	padding-bottom: 1em;
	font-size: small;
/* 	position: fixed; */
/* 	right: 0px;
	left: 0px; */
}

.footerleft {
/* 	display: inline-block; */
	min-width: 400px;
}

.footerleft a {
color: #fff;
	text-decoration: none;
}

.footerleft a:hover {
	text-decoration: none;
	color: #fff;
/* 	background: #080808; */
}

.footerright {
/* 	display: inline-block; */
	float: right;
}

.footerright a {
	color: #9d9d9d;
	padding-top: 1em;
	padding-bottom: 1em;
}

.footerright a:hover {
	color: #9d9d9d;
	text-decoration: none;
}

.footlinks {
	margin: 0;
	padding: 0;
}

.footlinks li {
	float: left;
	list-style: none;
}

.footlinks li a {
	padding-right: 1em;
	padding-left: 1em;
	padding-top: 1em;
	padding-bottom: 1em;
	color: #9d9d9d;
}

.footlinks li a:visited {
	color: #9d9d9d;
}


/************* Menus **************/

/* Nav menu */

div > .navmenu {
	padding: 0;
}


/* Contact us -small */
#contact-frame-small {
/* 	height: 460px; */
	/*background-color: #e1e2cd;*/
	background-color: #FFFFFF;
}

.contactbox{
	padding: 10px 20px 10px 20px;
	background-color: #fff;
}

.contact-overlay-small {
	width: 440px;
	float: right;
}

.box400px {
	display: inline-block;
	width: 400px;
	vertical-align: top;
}

address-small {
	font-style: normal;
	font-size: 12px;
}

/** CUSTOM ADDED FOR BOOTSTRAP **/

h4 {
	margin-top: 25px;
}

.row {
	margin-bottom: 20px;
}

.row .row {
	margin-top: 10px;
	margin-bottom: 0;
}

hr {
	/*
	margin-top: 40px;
	margin-bottom: 40px;
	*/
}


/** Equal height columns **/
/*
 * Row with equal height columns
 * --------------------------------------------------
 */
.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
}

/* Preflight Nov 2016 */
#syn-phonelink a {background:url(/images/icon_phone_small.png) no-repeat 9px 17px;padding-left:29px;}
#mobile_phone_link {padding: 6px 5px 2px;}

#syn-snapshots > div {text-align:center}
#syn-snapshots .casebox {float:none;}
#syn-snapshots .textbox {text-align:left;}

#syn-client-carousel button {display:none !important}



/* ### MEDIA QUERIES ########################################## */

@media (max-width: 990px) {
#syn-phonelink {display:none;}
img, iframe {max-width:100% !important}
}

@media (max-width: 500px) {
.bx-wrapper .content {width:auto;float:none;margin:20px}
}