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

* {
  margin: 0;
  padding: 0;
  box-sizing:border-box;
}


body {
  background: #fafafa;
  /* font-family: "Rajdhani", sans-serif;*/
  font-family: "Inter Tight", sans-serif;
  letter-spacing: 0.02em;
}

.g-recaptcha {
    transform:scale(0.9);
    transform-origin:0 0;
}

.g-recaptcha > div {
 margin-top: 1em;
 text-align: center;
 width: auto !important;
 height: auto !important;
}

a {
  transition: all 0.3s ease 0s;
  -webkit-transition: all 300ms ease-out;
}

a img {
  border: none;
}

img {
  display: block;
}

ul {
  list-style: none;
}

.button, div.form-modal .btn {
	background: #fafafa;
	  box-shadow: 0 0 0 5px transparent;
	  display: inline-block;
	  margin: 20px 0 0 0;
	  padding: 7px 20px;
	  border-radius: 50px;
	  color: #0b8eb4 !important;
	  font-size: 1em;
	  width: auto;
	  white-space: nowrap;
	  border: 7px solid #f0eeee;
	  transition: all 0.3s;
	  cursor:pointer;
	  white-space: wrap;
}

.button:hover, div.form-modal .btn:hover {
	background: #fafafa;
	box-shadow: 0 0 0 5px rgba(194, 195, 48, 0.51);
	border: 7px solid rgba(11, 142, 180, 0.54);
	transition: all 0.3s;
	color: #0b8eb4 !important;
	cursor:pointer;
}

.parallax-area .button:hover,
.main-image .button:hover {
  box-shadow: 0 0 0 5px rgba(194, 195, 48, 0.71);
  border: 7px solid rgba(11, 142, 180, 0.74);
  }
  
.button a:hover {
	color: #0b8eb4 !important;
}

strong {
	font-weight:600;
}

a{
	text-decoration:none;
	color: #0b8eb4;
}

a:hover {
	color: #b6bb09;
}

h1, h2, h3, h4 {
  color: #424b52;
  font-weight: normal;
}

h1 {
	font-size: 2.5em;
	font-weight: 700;
	margin-bottom: 10px;
}

h2 {
	font-size: 2em;
	font-weight: 700;
	margin-bottom: 10px;
}

h3 {
	font-size: 1.5em;
	font-weight: 700;
	margin-bottom: 10px;
}

h4 {
	font-size: 1.1em;
	font-weight: 700;
	margin-bottom: 10px;
}

p {
	font-size: 1em;
	font-weight: 400;
	line-height: 1.5em;
	color: #404b51;
	margin: 0 0 10px 0;
}

.inner p {
	margin-bottom: 20px;
}

hr {
	background: #0b8eb4;
	position: relative;
	width: 100%;
	height: 2px;
	margin: 60px auto;
	border:none;
	z-index: 1;
}

hr:before {
	content: '';
	background:#c2c330;
	height:2px;
	width: 33%;
	background-position: left;
	position: absolute;
	left: 0;
	z-index: 9;
}

hr:after {
	content: '';
	background:rgb(39, 70, 99);
	height:3px;
	width: 33%;
	background-position: right;
	position: absolute;
	right: 0;
	z-index: 9;
}

#main-header {
	width: 100%;
	position: fixed;
	height: 120px;
	z-index: 20;
	transition: all 0.3s;
}

#main-header .wrapper {
	position: relative;
	margin: 0 auto;
	height: auto;
	width: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
}

.tag-line {
	right: 0;
	height: auto;
   position: relative;
   display: flex;
   align-items: flex-end;
   justify-content: flex-end;
   padding: 10px 6%;
   width: 100%;
   background:#c2c330;
   transition: all 0.3s;
   top: 0;
}

.tag-line h3 {
	color: #f2f2f2;
    font-size: 0.9em;
    font-weight: 500;
	margin: 0 0 0 0;
	padding: 0 19px 0 0;
}

#main-header.nav-up .tag-line {
	top: -38px;
	transition: all 0.3s;
}

@media only screen and (max-width:540px){

	.tag-line h3 {
	  width: 50%;
	  text-align: right;
	  padding: 0;
	}
}

@media only screen and (max-width:360px){ 
	.tag-line h3 { 
		font-size: 0.8em;
	
	}
}


.max-width {
	max-width: 1200px;
	position: relative;
	margin: 0 auto;
	height: auto;
	width: 100%;
}

.max-width .content-area ul {
	background: #e9e9e9;
	padding: 30px;
	border-radius: 5px;
}

.max-width .content-area ul li {
	line-height: 21px!important;
	margin-bottom: 15px;
}

.max-width .content-area ul li:last-of-type {
	margin-bottom: 0;
}


#main-header .logo svg {
	width: 100%;
	  height: auto;
}

header#main-header.nav-up{
	transition: all 0.3s;
}


header#main-header a.logo{
	width: clamp(150px, 10vw, 300px);
	  top: 0;
	  left: 6%;
	  transition: all 0.3s;
	  display: flex;
	  align-items: center;
	  position: fixed;
	  background: #ffffff;
	  border-bottom-right-radius: 8px;
	  border-bottom-left-radius: 8px;
	padding: 20px;
	box-shadow: 0 0 11px #d7d7d9;
	z-index: 800;
	height: auto;
}


header#main-header a.logo .st0 {
	fill: #0b8eb4;
	transition: al 0.3s;
}




/* MAIN NAV */
div.blackout{
	background: rgba(4, 41, 60, 0.87);
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 901;
	transform:translateX(-100%);
	opacity:0;
	transition:opacity 0.3s;
}
div.blackout.reveal{
	opacity:1;
	transform:translateX(0);
}
nav#main-nav{
	position: relative;
	  transition: all 0.3s;
	  background: #0b8eb4;
	  width: 100%;
	  display: flex;
	  justify-content: flex-end;
	  padding: 0 6% 0 0;
	  top: 0;
}

.nav-up nav#main-nav {


}

nav#main-nav ul{
	display:flex;
	list-style:none;
}

nav#main-nav ul li{
	margin:0 5px;
	position:relative;
}

nav#main-nav ul li a{
	color: #fafafa;
	  height: 41px;
	  display: flex;
	  flex-direction: column;
	  justify-content: center;
	  padding: 7px 11px;
	  font-size: 1em;
	  font-weight: 400;
	  transition: all 0.3s;
	  position: relative;
	  box-shadow: 0 0 0 2px transparent;
}



nav#main-nav ul li:first-of-type a:hover{
	
	border-top-left-radius:3px;
	border-bottom-left-radius:3px;
}

nav#main-nav ul li:last-of-type a:hover{
	
	border-top-right-radius:3px;
	border-bottom-right-radius:3px;
}

nav#main-nav ul li a:hover {
	transition:all 0.3s;
	background: rgba(0,0,0,0.15);
}

nav#main-nav ul li a:hover { 
	background:rgb(15, 123, 165);
	transition:all 0.3s;
}


header#main-header.nav-up nav#main-nav ul li a {

}

header#main-header.nav-up nav#main-nav ul ul li a {
	color:	#fafafa;
}

/* sub level nav */

nav#main-nav ul ul{

	position:absolute;
	flex-direction:column;
	width: 280px;
	margin-top:30px;
	visibility:hidden;
	opacity:0;
	transition:all 0.3s;	
}

nav#main-nav li:hover ul{
	margin-top:5px;
	visibility:visible;
	opacity:1;
}

nav#main-nav ul li{
	margin:0;
}

nav#main-nav ul ul {

}

nav#main-nav ul ul li {
	margin-bottom: 5px;
}

nav#main-nav ul ul li a{
	height: 48px;
	  display: flex;
	  align-items: flex-start;
	  font-weight: 400;
	  font-size: 0.9em;
	  color: #fafafa;
	  box-shadow: none;
	  padding: 15px 18px;
	  justify-content: center;
	background: #c2c330;
	border-radius: 3px;
	transition: all 0.3s;
}

nav#main-nav ul ul li a:hover{
	box-shadow: none;
	background: #0b8eb4;
	transition: all 0.3s;
}

nav#main-nav ul ul li a:after{
	display:none;
}

/* MOBILE BURGER */

#mobile-burger {
	display: none;
	flex-direction: column;
	  width: 50px;
	  height: 50px;
	  position: fixed;
	  right: 6%;
	  top: 55px;
	  transform: translateY(-50%);
	  justify-content: center;
	  z-index: 900;
	  cursor: pointer;
	  background: #0b8eb4;
	  padding: 10px;
	  border-radius: 3px;
	  transition: all 0.3s;
}

#mobile-burger.nav-up {
	top: 40px;
    transition: all 0.3s;
}

#mobile-burger span{
	width: 100%;
	height: 4px;
	background:#fafafa;
	display: block;
	margin: 3px auto;
	transition: all 0.3s;
	border-radius:3px;
}

#mobile-burger:hover span{
}

#mobile-burger.opened span{
	background:#fafafa;
}

/* #mobile-burger.opened span:first-of-type{
	transform: translate(0, 10px) rotate(-45deg) scale(0.85);
}

#mobile-burger.opened span:nth-of-type(2){
	transform: scale(0.5);
	opacity:0;
}

#mobile-burger.opened span:last-of-type{
	transform: translate(0, -10px) rotate(45deg) scale(0.85);
} */


/* MOBILE NAV */

nav#mobile-nav{
	position: fixed;
	display: block;
	top: 30px;
	right: 0;
	width: 100%;
	height:90%;
	background:#08617b;
	z-index: 902;
	max-width: 375px;
	padding: 60px 0 60px;
	transform:translateX(101%);
	border-bottom-left-radius: 60px;
	border-top-left-radius: 60px;
	border-top: 5px solid #c2c330;
	  border-bottom: 5px solid #0b8eb4;
	transition:all 0.3s;
}

nav#mobile-nav.opened{
	transform:translateX(0);
}

nav#mobile-nav .close-nav {
	position: absolute;
	top: -2px;
	left: -2px;
	cursor: pointer;
}

nav#mobile-nav .close-nav:before {
	content:'\f00d';
	font-family: 'Font Awesome 5 Pro';
	font-size: 1.5em;
	color: #fafafa;
	background:#0b8eb4;
	border-radius: 50%;
	height: 40px;
	width: 40px;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all 0.3s;
}

nav#mobile-nav .close-nav:hover:before {
	background:#c2c330;
	transition: all 0.3s;
}

nav#mobile-nav ul{
	list-style:none;
}

nav#mobile-nav ul li{
	position: relative;
	  border-radius: 0;
	  border-bottom: 1px solid #15708a;
	  transition:all 0.3s;
}

nav#mobile-nav ul li:hover {
	background:  #065971;
	transition:all 0.3s;
}

nav#mobile-nav ul li a{
	color: #f2f2f2;
	  height: 48px;
	  line-height: 48px;
	  padding: 0 40px;
	  display: block;
	  transition: all 0.3s;
	 font-size: 1em;
	   font-weight: 400;
}

nav#mobile-nav ul li a:hover {
	color: #fff;
}

nav#mobile-nav ul li:hover > a{
}

/* expand stuff */

nav#mobile-nav ul li div.expand{
	display: flex;
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
	height: 48px;
	width: 48px;
	justify-content: center;
	align-items: center;
	transition:all 0.3s;
}

nav#mobile-nav ul li div.expand.opened .wrapper{
	transform:scaleY(-1);
}

nav#mobile-nav ul li div.expand:hover{
	background: var(--main-color);
}

nav#mobile-nav ul li div.expand .wrapper{
	position: relative;
	width: 48px;
	height: 48px;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	transition:all 0.3s;
	background: #0b8eb4;
}
nav#mobile-nav ul li div.expand .wrapper:before{
	content:'\f0dd';
	font-family:'Font Awesome 5 Pro';
	color:#fafafa;
	font-weight:700;
	font-size: 1.175em;
	position: relative;
	top: -3px;
}

/* Subnav */
nav#mobile-nav ul ul{
	width: 100%;
	height: 0;
	overflow: hidden;
	transition: all 0.3s;
	background: #057899;
}

nav#mobile-nav ul ul li{
	border-bottom:none;
}
nav#mobile-nav ul ul li a{
	height:40px;
	line-height:40px;
	font-size:0.875em;
}

nav#mobile-nav ul ul li:hover > a{
	background:#066e8c;
}

@media screen and (max-width:1050px){
	
	header#main-header nav#main-nav li a, 
	header#main-header nav#main-nav li{
		height:auto;
	}

	header#main-header nav#main-nav li li a, 
	header#main-header nav#main-nav li li{
		height:48px;
	}
	#mobile-burger{
		display:flex;
	}
	nav#main-nav{
		display:none;
	}
	nav#mobile-nav{
		display:block;
	}
}
/* END MENU CSS */

.hp-main-slide {
	min-height: 100vh;
	width: 100%;
	position: relative;
	margin: 0 auto;
	max-height: 100vh;
}

.inner-main-slide {
	min-height: 65vh;
	width: 100%;
	position: relative;
	margin: 0 auto;
	max-height: 65vh;
	padding-top:103px;
}

.slider-padding {
	padding-top: 130px!important;
}

.homepage .rsContent:after{
	content: '';
	width: 100%;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	background:rgba(255,255,255,0.8);
	z-index:10;
}

.rsContent {
	height: 100vh!important;
	position: absolute;
}

.inner .rsContent {
	height: 100%!important;
	position: absolute;
}


.rsABlock {
	position: absolute;
	transform: translate(-50%,-50%)!important;
	left: 50%;
	top: 50%;
	width: 100%;
	max-width: 600px;
	right: auto;
	text-align: center;
	padding: 0 4%;
	z-index: 11;
}

.rsABlock h3 {
	color: #404b51;
	font-weight: 600;
	font-size: 30px;
	margin-bottom: 10px;
}



.rsABlock p {
	color: #4f575e;
	font-weight:300;
	font-size: 16px;
	margin-bottom: 20px;
}

.rsABlock a {
	color: #f2f2f2;
	background:rgba(15,123,165,0.7);
	padding: 10px 20px;
	border-radius: 20px;
	display: inline-block;
}

.rsABlock a:hover {
	background:rgba(182, 186,9,0.7);
}

.section-one {
	background: #f2f2f2;
	position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
	padding: 140px 4%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.main-content {
	background: #f2f2f2;
	position: relative;
	width: 100%;
	height: 100%;
	padding: 90px 4%;
	border-bottom: 10px solid #0f7ba5;
}

.main-content:before {
	content: '';
	background:#c2c330;
	height:10px;
	width: 33%;
	background-position: left;
	position: absolute;
	bottom: -10px;
	left: 0;
	z-index: 9;
}

.main-content:after {
	content: '';
	background:rgb(22, 44, 65);
	height:10px;
	width: 33%;
	background-position: right;
	position: absolute;
	bottom: -10px;
	right: 0;
	z-index: 9;
}

.main-content .max-width {
	display: flex;
	flex-direction: row;
}



.inner .content-area ul li {
	font-size: 13px;
	font-weight: 400;
	line-height: 24px;
	color: #404b51;
}

.left-col ul li:before, .inner .content-area ul li:before, .right-col ul li:before {
	content: '\f138';
	font-family: 'Font Awesome 5 Pro';
	font-size: 16px;
	color: #c2c330;
	margin-right: 8px;
	top: 1px;
	position: relative;
}

.left-col .ccm-block-next-previous-header {
	
}

.right-col {
	position: relative;
	width: 39%;
	border-left: 1px solid #d7d7d7;
	border-radius: 3px;
	min-height: 100%;
	padding: 0 0 0 3%;
}


.content-area {
	max-width: 800px;
	width: 100%;
	position: relative;
	margin: 0 auto 50px;
}

/* Services Page List */

#pagelist .content-area {
	max-width: 1024px;
	
}

.news-list, .services-list, .projects-list {
	margin-top: 50px;
}

.services-list ul, .news-list ul, .projects-list ul {
	display: flex;
	flex-direction: row;
	width: 100%;
	flex-wrap:wrap;
	justify-content: center;
	background: none!important;
}

.services-list ul li:before, .news-list ul li:before, .projects-list ul li:before {
	display: none;
}

.services-list ul li {
	margin-bottom: 40px!important;
}

.news-list ul li, .projects-list ul li {
	margin-bottom: 20px!important;
}

.services-list ul li, .news-list ul li, .projects-list ul li {
	width: 31%;
	height: auto;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 0 1%;
}

.services-list-image, .news-list-image, .projects-list-image {
	width: 165px;
	height: 165px;
	border-radius:50%;
	overflow:hidden;
}

.services-list-image img, .news-list-image img, .projects-list-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter:brightness(0.6);
	transition: all 0.5s;
}

.services-list-image img:hover, .news-list-image img:hover, .projects-list-image img:hover {
	filter:brightness(1);
}

.services-list-content-wrapper, .news-list-content-wrapper {
	margin-top: 8px;
	width: 100%;
}

.right-col .news-list-content-wrapper {
	margin-top: 0;
}

.right-col .ccm-block-page-list-page-entry {
	text-indent: 0!important;
	padding: 10px 0!important;
}

.services-list-title {
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 5px;
}

.news-list-title {
	font-size: 16px;
	font-weight: 600;
}

.news-date {
	font-style: italic;
	font-size: 12px;
	margin-bottom: 5px;
	color:#a1a1a1;
}


.services-list-description, .news-list-description {
	font-size: 13px;
	line-height: 19px;
	width: 75%;
	position: relative;
	margin: 0 auto;
}

/* End Services Page List */

/* Right Col Page List */

.right-col-page-list {
	width: 100%;
	display: flex;
	flex-direction: column;
}

.right-col-page-list li {
	margin-bottom: 10px;
	position: relative;
	display:flex;
	flex-direction: row;
	border-radius: 3px;
	padding: 0 0 18px 0;
	border-bottom: 1px solid #d7d7d7;
}

.right-col-page-list li:last-of-type {
	border-bottom: none;
}

.right-col-page-list h4 {
	color: #0f7ba5;
	font-weight:500;
	margin-bottom: 3px;
}

.list-image {
	width: 100px;
	height: auto;
	overflow:hidden;
	border-radius: 3px;
	filter: grayscale(0.5);
	display: none;
}

.list-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.list-text {
	width:70%;
}

.list-text p {
	margin-bottom: 0;
	line-height: 20px;
}

.right-col .button {
	position: relative;
	display: inline-block;
	left: auto;
	top: auto;
	transform: none;
}

.right-col img {
	width: 100%;
	height: auto;
	border-radius:5px;
	border: solid #e6e6e6 3px;
}

.max-width-logo {
	max-width: 200px;
}

/* End Right Col Page List */
	
	

.ccm-block-next-previous-parent-link a  {
	background: #0f7ba5;
	border-radius: 20px;
	padding: 8px 15px;
	color: #fff!important;
	display: inline-block;
}


.ccm-block-next-previous-parent-link a:hover {
	color: #fff!important;
	background: #c2c330;
}

/* Projects Slider */
	.rule {
		border-top: 20px solid #0f7ba5;
		width: 100%;
		position: relative;

	}
	
	.rule:before {
		content: '';
		background: #c2c330;
		height: 20px;
		width: 33%;
		background-position: left;
		position: absolute;
		top: -20px;
		left: 0;
		z-index: 9;
	}
	
	.rule:after {
		content: '';
		background: rgb(39, 70, 99);
		height: 20px;
		width: 33%;
		background-position: right;
		position: absolute;
		top: -20px;
		right: 0;
		z-index: 9;
	}
	

	.projects-slider {
		margin: 0 0 0 0;
		overflow: hidden;
		text-align: center;
		background: rgb(38, 58, 77);
		padding: 40px 0 70px;
		position: relative;
	}
	
	.projects-slider h3 {
		color: #f2f2f2;
	}
	
	.projects-slider ul {
		margin-top: 40px;
	}

	.projects-slider ul li {
		filter:grayscale(1);
		width: 20%;
		max-width: 120px;
		background: #fff;
		margin: 0 2%;
		border: 1px solid #6a737e;
	}
	
	.projects-slider ul li.is-selected {
		filter:grayscale(0);
	}
	
	.projects-slider ul li img {
		width: 100%;
		height: auto;
	}


/* End Projects Slider */


/* right col testimonial  */

	.large-testimonial {
		width: 100%;
		height:auto;
		padding: 40px;
		background:#fff;
		border-radius: 5px;
		margin-top: 20px;
	}
	
	.large-testimonial:after {
		content:'';
		background:url('../images/speech.svg')no-repeat;
		position: absolute;
		background-size: cover;
		width:87px;
		height:80px;
	}
	
	.large-testimonial .testimonial-paragraph p {
		margin-bottom: 10px;
	}
	
	.large-testimonial .testimonial-name, .large-testimonial .testimonial-position, .large-testimonial .testimonial-paragraph p {
		color: #5a646e;
	}

/* END right col testimonial  */
.services ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.services ul li:before {
	display: none;
}

.services ul li {
	width: 16%;
	position: relative;
	margin: 15px 2%;
	padding-bottom: 30px;
	text-align: center;
}

.services-image {
	border-radius: 50%;
	overflow: hidden;
	position: relative;
	margin: 0 auto 20px;
}

.services ul li img {
	width: 100%;
	height:auto;
	display: block;
	filter:brightness(0.6);
	transition: all 0.5s;
}

.services ul li img:hover {
	filter:brightness(1);
}

.services-text h3 {
	font-size: 15px!important;
	margin:0 auto 10px;
	color: #32597a;
	font-weight: 500;
	letter-spacing: -0.01em
}

.section-two {
	background: #f2f2f2;
	position: relative;
	width: 100%;
	padding: 150px 4%;
	height: auto;
	border-top: 20px solid #0f7ba5;
}

.section-two:before {
	content: '';
	background:#c2c330;
	height:20px;
	width: 33%;
	background-position: left;
	position: absolute;
	top: -20px;
	left: 0;
	z-index: 9;
}

.section-two:after {
	content: '';
	background:rgb(39, 70, 99);
	height:20px;
	width: 33%;
	background-position: right;
	position: absolute;
	top: -20px;
	right: 0;
	z-index: 9;
}



.section-two-text {
	width: 50%;
}

.section-two-text p {
	margin-bottom: 10px
	}

.section-two h2 strong {
	font-weight: 900;
	color:#c3c302;
}

.section-two hr {
	margin: 20px 0;
}

.phone {
	position: absolute;
	right: 0%;
	top: -230px;
	width: 520px;
	height: auto;
	z-index: 10;
}

.phone img {
	width: 100%;
	height: auto;
}

.laptop {
	display: none;
}

.laptop img  {
	width: 100%;
	height: auto;
}

.top {
	margin-bottom:90px;
}

.connect ul {
	display: flex;
	justify-content:center;
	flex-wrap:wrap;
	
}

.connect li {
	margin: 7px;
	background:#005773;
	border-radius: 3px;
	text-align: center;
	width: 18%;
	min-width: 160px;
	height: auto;
	position: relative;
	padding: 20px 20px 50px;
	cursor: pointer;
	transition: all 0.5s;
}

.connect li:hover {
	background:#0b8eb4;
}

.connect li a {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
}

.connect ul li img {
	width: auto;
	height: 100px;
	max-width: 100%;
}

.connect li h4 {
	color: #fff;
	font-weight: 400;
	text-transform: uppercase;
	bottom: 15px;
	position: absolute;
	width: 100%;
	left: 0;
	font-size: 14px;
}

.connect li h4 strong {
	color: #c3c302;
	font-weight: 900;
}

.section-three {
	padding: 140px 4%;
	position:relative;
	width: 100%;
	height:100%; 
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	border-top: 20px solid #0f7ba5;
}

.section-three:before {
	content: '';
	background:#c2c330;
	height:20px;
	width: 33%;
	background-position: left;
	position: absolute;
	top: -20px;
	left: 0;
	z-index: 9;
}

.section-three:after {
	content: '';
	background:rgb(39, 70, 99);
	height:20px;
	width: 33%;
	background-position: right;
	position: absolute;
	top: -20px;
	right: 0;
	z-index: 9;
}

.projects ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.projects ul li {
	width: 16%;
	position: relative;
	margin: 20px 2.5%;
	padding-bottom: 30px;
}

.projects-image {
	border-radius: 50%;
	overflow: hidden;
	position: relative;
	margin: 0 auto 20px;
}

.projects ul li img {
	width: 100%;
	height:auto;
	display: block;
}

.projects-text h3 {
	font-size: 15px;
	margin:0 auto 10px;
	color: #32597a;
	font-weight: 500;
	letter-spacing: -0.01em
}

#footer {
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	position: relative;
	background: #fff;
	padding: 45px 6% 112px;
}

#footer .logo {
	max-width: 150px;
	display: flex;
	flex-direction: column;
	margin-bottom: 10px;
	align-items: flex-start;
}

#footer .logo img {
	width: 150px;
	display: inline-block;
}

#footer h3 {
	font-size: 1em;
	  color: #0b8eb4;
	  font-weight: 500;
}

#footer p {
	color: #424b52;
	font-size: 0.9em;
	font-weight: 500;
}

#footer span {
	color: #c3c302;
	margin: 0 10px;
}

.terms a {
	font-size: 0.9em;
	font-weight: 500;
}


#footer .contacts {
	margin-bottom: 40px;
	text-align: left;
}

#footer .terms {
	margin-bottom: 20px;
}

#footer .credit  {
	position: absolute;
	bottom: 95px;
	left: 0;
	background: #c2c330;
	padding: 10px 6%;
	width: 100%;
	display: flex;
	justify-content: flex-start;
}

#footer .credit a {
  color: #fafafa;
 }

#footer .credit p {
	font-size: 0.7em;
	  color: #fafafa;
	  font-weight: 500;
	  margin: 0;
}

#footer strong {
	font-weight: normal;
	color:#424b52;
}

.number {
	white-space: nowrap;
}

.number:before {
	content:'\f879';
	font-family: 'Font Awesome 5 Pro';
	font-size: 15px;
	margin-right: 7px;
	font-weight: 300;
	position: relative;
	top: 1px;
	color: #c2c330;
}

.mail:before {
	content:'\f0e0';
	font-family: 'Font Awesome 5 Pro';
	font-size: 15px;
	margin-right: 8px;
	position: relative;
	top: 1px;
	font-weight: 300;
	color: #c2c330;
}

.connect-list ul {
	display: flex;
	flex-direction:row;
	flex-wrap: wrap;
	background: none!important;
	justify-content: space-evenly;
	align-content: center;
	align-items: first baseline;
}

ul .connect-it {
	margin: 7px;
	background: #005773;
	border-radius: 3px;
	text-align: center;
	width: 18%;
	height: auto;
	position: relative;
	padding: 20px 20px 30px;
	cursor: pointer;
	transition: all 0.5s;
	min-width: 150px;
}

.connect-list ul li:hover {
	background:#0f7ba5;
}


.connect-list ul li:before {
	display: none;
}

.connect-list ul li img {
	width: 100%;
	height: auto;
}


.connect-title a {
	color: #fff;
	font-weight: 400;
	text-transform: uppercase;
	bottom: 15px;
	position: absolute;
	width: 100%;
	left: 0;
}

.connect-list ul li:last-of-type {
	margin: 7px!important;
}



/* form */

.formify-form {
	width: 100%;
	max-width: 100%!important;
	padding: 25px 4%;
	border-radius:3px;
}

fieldset {
	border: 0;
}

.formify-section {
	border: 0;
	display: flex!important;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: space-around;
}

.formify-field-container {
	width: 100%;
}

.formify-textbox input, .formify-phone input, .formify-email input {
	width: 100%!important;
}

.formify-form.with-style textarea, .formify-textbox input, .formify-phone input, .formify-email input{
	border:2px solid #e1e1e1 !important;
	padding: 5px;
	height: 50px;
	margin: 5px 5px;
}

#formify-field-container-4, #formify-field-container-5 {
	width: 100%;
}

.formify-checkboxes {
	width: 100%;
	display: block;
}

.enquiry {
	width: 100%;
}

.enquiry textarea {
	display: block!important;
	width: 100%!important;
}

.formify-form.with-style label {
	color: #404b51;
	font-weight: 300;
	font-size: 13px;
}

.formify-form.with-style textarea {
	width: 100%;
}

.formify-checkboxes {
}

.formify-legend {
	color: #404b51;
	font-size: 12px;
	width: 80%;
	position: relative;
	margin: 0 auto!important;
	line-height: 20px;
}

.formify-form.with-style .formify-field-container {
	margin: 10px 0;
}

.formify-form.with-style fieldset label span {
	background: #fff;
}

.formify-form.with-style fieldset label i {
	color:#1fa8e9;
}

.formify-form.with-style input[type="submit"] {
	background-color: #0f7ba5;
	transition: all 0.4s;
	cursor:pointer;
}

.formify-form.with-style input[type="submit"]:hover {
    background-color: #c2c330;
}

/* end form */

/* simple gallery */

.mfp-zoom-in.mfp-ready.mfp-bg {
	opacity: 0.95;
}

.mfp-arrow-right:before, .mfp-arrow-left:before{
	border: none;
}

.mfp-image-holder .mfp-content {
    max-width: 70%!important;
}

.sg {
	justify-content: center;
}

.sg-item:before {
	content: '';
	background: url('../images/logo-icon.svg') no-repeat;
    background-size: auto;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	background-size: 100%;
	height: 50px;
	width: 50px;
	background-position: center;
	background-position-x: center;
	background-position-y: center;
	z-index: 10;
	opacity: 0.4;
	filter: saturate(4);
}

.sg-item {
	margin: 2px 0.5% !important;
	overflow: hidden;
	width: 32.3%;
	height: 120px;
	position: relative;
}

.sg-item-overlay {
	background: rgba(0,0,0,0.6)!important;
}

.sg-item:hover:before {
	display: none;
}

.sg-item:hover .sg-item-overlay {
	background: rgba(0,0,0,0)!important;
}

/* end simple gallery */

/* Page Attribute */

/* End Page Attribute*/

.company-logo{
	width: 150px;
	height: 150px;
	position: absolute;
	display: flex;
	top: -180px;
	background: #fff;
	left: 0;
	border: 2px #d7d7d7 solid;
}

.company-logo img, .connect-icon img {
	display: block;
	width: 100%;
	height: auto;
	padding: 5px;
}

.connect-icon {
    background: #0f7ba5;
	width: 150px;
	height: 150px;
	position: absolute;
	display: flex;
	top: -180px;
	left: 0;
	border: 2px #f2f2f2 solid;
    padding: 8px;
}

.ccm-block-next-previous-next-link, .ccm-block-next-previous-previous-link {
	display: none!important;
}



@media screen and (max-width: 1048px) {
	.laptop {
		display: none;
		position: absolute;
		right: 0%;
		top: -100px;
		width: 520px;
		height: auto;
		z-index: 10;
	}
	
	.phone {
		display: none;
	}
	
	.section-two-text {
		width: 100%;
		max-width: 800px;
		text-align: center;
		position: relative;
		margin: 0 auto;
	}
	
	.section-two hr {
		margin: 20px auto;
	}
}




@media screen and (max-width: 1025px) {
	
	header {
		padding: 0;
	}
	
	header h3 {
		right: 4%;
	}
	
	.logo {
		left: 4%;
	}
	
	

	.services ul li {
		width: 25%;
		margin: 25px 4%;
	}
	
	.main-content .max-width {
		flex-direction: column;
	}
	
	.left-col {
		width: 100%;
		margin:0 0 30px 0;
	}
		
	.right-col {
		padding: 30px 0 0 0;
		border-left:none;
		width: 100%;
		border-top: 1px solid #d7d7d7;
	}
	
	.sg-item {
		width: 21%;
		height: 130px;
	}
		
}

@media screen and (max-width: 850px) {

	.projects ul li {
		width: 40%;
		margin: 25px 4%;	
	}
	
	.top {
    	margin-bottom: 50px;
	}	
	
	.testimonial-slider li {
		width:48%;
	}
	
}

@media screen and (max-width: 800px) {
	.services-list ul li, .news-list ul li, .projects-list ul li {
		width:48%;
	}
	

}
@media screen and (max-width: 700px) {

.sg-item {
		width:31%;
		height: 110px;
	}

	.projects-slider ul li {
		width: 33.33%;
	}

}

@media screen and (max-width: 600px) {

	.services ul li {
		width: 40%;
		margin: 25px 4%;
	}
	
	.formify-section {
		flex-direction: column;
	}
	
	.formify-field-container {
		width: 100%;
	}
		
}	

@media screen and (max-width: 550px) { 
	.services-list ul li, .news-list ul li, .projects-list ul li {
		width:100%;
		margin-bottom: 20px;
	}
	
	.projects-slider ul li {
		width: 45%;
	}	
}

@media screen and (max-width: 490px) {
	header h3 {
		font-size: 12px;
	}
	
	.section-one, .section-two, .section-three {
		padding: 90px 4%;
	}
	
	.contacts {
		margin-bottom: 40px!important;
	}
	
	.contacts span {
		display: none;
	}
	
	.number {
		display: block;
	}
	
	.testimonial-slider li {
		width:98%;
	}
}

@media screen and (max-width: 435px) {
	.sg-item {
		width:48%;
		height: 110px;
	}
 }
 
 
 
 
 
 @media screen and (max-width: 376px) {
	 
	 .max-width .content-area ul {
		 padding: 20px;
	 }
	 
	 ul .connect-it {
		 margin: 5px;
		 width: 135px;
		 min-width: auto;
	 }

 	.connect li {
	 	width: 150px;
	 	margin: 5px;
 	}

	 .projects-slider ul li {
			width: 98%;
		}
}


/* blog post */

.blog-post .title-block {
	position: relative;
	width: 100%;
	padding: 90px 6% 45px;
	height: auto;
	display: flex;
	justify-content: center;
}

.blog-post .title-block .max-width {
	width: 100%;
	max-width: 900px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

img.u-avatar {
	width: 40px;
	  height: 40px;
	  border-radius: 50%;
	  margin: 0 8px 0 0;
	  padding: 4px;
	  background: #fff;
	  border: 1px solid #f2f1f1;
	  filter: drop-shadow(0 0 3px #f4f4f4);
}

.title-block p.author {
	display: flex;
	  justify-content: center;
	  align-items: center;
	  font-size: 0.8rem;
}

.blog-content {
	width: 100%;
	position: relative;
	height: auto;
	padding: 0 6% 90px;
	display: flex;
	justify-content: center;
}
 
.blog-content .max-width {
	width: 100%;
	max-width: 900px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
}

.blog-content h3 {
	margin: 0 0 30px 0;
}

.blog-content h4 {
	margin: 0 0 20px 0;
}

.blog-content p {
	margin: 0 0 20px 0;
}

.blog-content ul{
	  list-style:none;
  }
  
.blog-content li {
	 font-size: 1em;
	   font-weight: 400;
	   line-height: 1.5em;
	   color: #404b51;
	   margin: 0 0 8px 0;
	  padding-left:28px;
	  position:relative;
  }
  
.blog-content li:before{
	 content: '\f111';
	   position: absolute;
	   top: 4px;
	   left: 0;
	   font-size: 0;
	   background: #0b8eb4;
	   border: 3px solid #c2c330;
	   border-radius: 50%;
	   height: 10px;
	   width: 10px;
	   opacity: 0.5;
  }
  
  @media screen and (max-width: 900px) {
	  .blog-post .title-block .max-width {
		  align-items: flex-start;
	  }
  }
 
/* news admin */

.admin-panel {
	position: relative;
	  padding: 30px 6%;
	  width: 100%;
}

.admin-panel .max-width {
	background: #fff;
	  border-radius: 10px;
	  padding: 40px 6%;
	  box-shadow: 0 0 10px #ecebeb;
}

.admin-panel .checkbox {
	margin: 20px 0;
	position: relative;
}

.admin-panel label {
	display: block;
	margin: 0 0 10px 0;
	color: #424b52;
}

.admin-panel .image-picker {
	margin: 20px 0;
}

.admin-panel .btn {
	background: #0b8eb4;
	  padding: 10px 20px;
	  border: none;
	  border-radius: 3px;
	  color: #fafafa;
	  font-size: 1em;
	  transition: all 0.3s;
}

.admin-panel .btn:hover {
	background: #c2c330;
	transition: all 0.3s;
}

.admin-panel .cke, .admin-panel .cke_inner, .admin-panel .cke_contents, .admin-panel .cke_source {
	min-height: 250px;
}

.admin-panel input[type=text],
.admin-panel textarea,
.admin-panel select {
	width: 100%;
  display: block;
  padding: 7px;
  border-radius: 3px;
  border: 1px solid #ccc;
  margin: 5px 0 15px 0;
  }
  
  /* FIXED FOOTER */
  section.fixed-footer{
	  position:fixed;
	  z-index:300;
	  bottom:0;
	  left:0;
	  width:100%;
	  background:rgba(255,255,255,0.95);
	  transform:translateY(100%);
	  transition:all 0.3s;
	  box-shadow:0 0 16px rgba(0,0,0,0.1);
  }
  section.fixed-footer.visible{
	  transform:translateY(0);
  }
  section.fixed-footer .row{
	  display:flex;
	  justify-content:center;
  }
  section.fixed-footer a.item{
	  margin: 15px 0;
	  text-align: center;
	  display: block;
	  border-right: 1px solid #ddd;
	  padding: 0 20px;
	  color:var(--dark-blue);
	  transition:all 0.3s;
  }
  section.fixed-footer a.item:hover{
	  color:var(--main-color);
  }
  section.fixed-footer a.item:last-of-type{
	  border:none;
  }
  section.fixed-footer a.item:hover p {
	  color:#c2c330;
	  transition: all 0.3s;
  }
  section.fixed-footer .item p{
	  margin: 0;
	  font-size: 0.9em;
	  font-weight: 600;
	  line-height:1.3em;
	  color: #0b8eb4;
	  transition: all 0.3s;
  }
  
  
  section.fixed-footer .item p.smaller{
	  font-size:0.75em;
	  font-weight: 400;
  }
  section.fixed-footer .icon{
	  margin-bottom:5px;
  }
  section.fixed-footer .icon i{
	  font-size:1.5em;
	  color: #c2c330;
  }
  
  @media screen and (max-width:600px){
	  section.fixed-footer a.item{
		  padding:0 12px;
		  width:33.3%;
	  }
  }
  /* FORM MODAL */
  div.form-modal{
	  position:fixed;
	  top:0;
	  left:0;
	  width:100%;
	  height:100%;
	  z-index:1000;
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  background:rgba(38, 52, 66,0.8);
	  display:none;
	  padding:0 10px;
  }
  div.form-modal.opened{
	  display:flex;
  }
  div.form-modal h2 {
	  text-align: center;
		color: #404b51;
		font-size: 1.5em;
  }
  div.form-modal .wrapper{
	  width: 100%;
	  max-width: 700px;
	  background: #fafafa;
	  padding: 28px;
	  border-radius:12px;
	  box-shadow: 0 0 32px rgba(0,0,0,0.5);
  }
  
  div.form-modal .ccm-dashboard-express-form{
	  display:flex;
	  justify-content:space-between;
  }
  div.form-modal .ccm-block-express-form fieldset{
	  width:~'calc(50% - 10px)';
	  margin:20px 0 0 0;
  }
  div.form-modal .ccm-block-express-form legend {
	  display: none;
  }
  
  div.form-modal .mb-3{
	  margin-bottom:20px;
  }
  
  div.form-modal .form-label {
	  color: #404b51;
	  font-weight: 400;
  }
  
  div.form-modal .form-control{
		width: 100%;
		padding: 8px;
		border: 1px solid #f0f0f0;
		border-radius: 4px;
		margin: 5px 0 0 0;
	}
	
	div.form-modal .form-control:focus-visible,  div.form-modal textarea:focus-visible {
		outline: 1px solid #c2c330;
	}
	
  div.form-modal textarea{
	  height:192px;
	  width: 100%;
	  border: 1px solid #f0f0f0;
	  border-radius: 4px;
  }
  
  div.form-modal span.small{
	  font-size:0.75em;
  }
  div.form-modal .form-actions{
	  text-align:right;
  }
  div.form-modal .form-group.captcha{
	  margin: 0;
	  transform: scale(0.7);
  }
  @media screen and (max-width:900px){
	  div.form-modal .wrapper{
		  overflow:auto;
		  max-height:80vh;
	  }
	  div.form-modal .ccm-dashboard-express-form{
		  flex-direction:column;
	  }
	  div.form-modal .ccm-block-express-form fieldset{
		  width:100%;
		  margin:20px 0 0 0;
	  }
  }