@font-face {
	font-family: 'arialNarrowItalic';
	src: url('../fonts/arialNarrowItalic/arialNarrowItalic.eot');
	src: url('../fonts/arialNarrowItalic/arialNarrowItalic.woff') format('woff'), 
         url('../fonts/arialNarrowItalic/arialNarrowItalic.ttf') format('truetype'), 
         url('../fonts/arialNarrowItalic/arialNarrowItalic.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'calibriLight';
	src: url('../fonts/calibriLight/calibriLight.eot');
	src: url('../fonts/calibriLight/calibriLight.woff') format('woff'), 
         url('../fonts/calibriLight/calibriLight.ttf') format('truetype'), 
         url('../fonts/calibriLight/calibriLight.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-family: 'CenturyGothic';
    src: url('../fonts/CenturyGothic/CenturyGothic.eot');
    src: url('../fonts/CenturyGothic/CenturyGothic.eot') format('embedded-opentype'),
         url('../fonts/CenturyGothic/CenturyGothic.woff2') format('woff2'),
         url('../fonts/CenturyGothic/CenturyGothic.woff') format('woff'),
         url('../fonts/CenturyGothic/CenturyGothic.ttf') format('truetype'),
         url('../fonts/CenturyGothic/CenturyGothic.svg#CenturyGothic') format('svg');
}
@font-face {
    font-family: 'CenturyGothicBold';
    src: url('../fonts/CenturyGothicBold/CenturyGothicBold.eot');
    src: url('../fonts/CenturyGothicBold/CenturyGothicBold.eot') format('embedded-opentype'),
         url('../fonts/CenturyGothicBold/CenturyGothicBold.woff2') format('woff2'),
         url('../fonts/CenturyGothicBold/CenturyGothicBold.woff') format('woff'),
         url('../fonts/CenturyGothicBold/CenturyGothicBold.ttf') format('truetype'),
         url('../fonts/CenturyGothicBold/CenturyGothicBold.svg#CenturyGothicBold') format('svg');
}
body {
	margin: 0px;
	padding: 0px;
	font-family: 'CenturyGothic';
}
h1, h2, h3, h4, h5, h6 {
	font-style: normal;
	font-weight: normal;
	margin: 0px;
	padding: 0px;
}
h2{
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 56px;
    line-height: 1.2;
    color: #FFF;
    text-transform: uppercase; 
}
h3{
   font-family: "CenturyGothic";
    font-weight: 700;
    font-size: 48px;
    line-height: 1.2;
    color: #FFF;
    text-transform: uppercase; 
}
h4{
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 42px;
    line-height: 1.2;
    color: #FFF;
    text-transform: uppercase; 
}
h5{
   font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 28px;
    line-height: 1.2;
    color: #FFF;
    text-transform: uppercase; 
}
h5{
   font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 28px;
    line-height: 1.2;
    color: #FFF;
    text-transform: uppercase; 
}
h6{
   font-family: "CenturyGothic";
    font-weight: 700;
    font-size: 20px;
    line-height: 1.2;
    color: #FFF;
    text-transform: uppercase; 
}
p {
	font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 30px;
    line-height: 1.2;
    color: #FFF;
    margin: 0px;
	padding: 0px;
}
ul {
	background: none;
	margin: 0px;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
}
ul li {
	background: none;
	margin: 0px;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
}
a, a:hover, a:focus {
	text-decoration: none;
	outline: 0px none !important;
}
img, a img {
	max-width: 100%;
	margin: 0px;
	padding: 0px;
	border: none 0;
	outline: 0px none !important;
}
input:focus, textarea:focus, a:focus {
	outline: 0px none !important;
}
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
*:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/* Slider start*/
.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.slick-list:focus {
    outline: none;
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.slick-track:before,
.slick-track:after {
    display: table;
    content: '';
}

.slick-track:after {
    clear: both;
}

.slick-loading .slick-track {
    visibility: hidden;
}

.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}

[dir='rtl'] .slick-slide {
    float: right;
}

.slick-slide img {
    display: block;
}

.slick-slide.slick-loading img {
    display: none;
}

.slick-slide.dragging img {
    pointer-events: none;
}

.slick-initialized .slick-slide {
    display: block;
    outline: inherit;
}

.slick-loading .slick-slide {
    visibility: hidden;
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
    display: none;
}
.slick-arrow{
    position: absolute;
    top: 71%;
    background: none;
    border: none;
    outline: inherit;
    font-size: 0;
    cursor: pointer;
    z-index: 99;
}
.slick-arrow.slick-prev{
    left: 0;
}
.slick-arrow.slick-next{
    right: 0;
}
.slick-arrow.slick-prev:before,
.slick-arrow.slick-next:before{
    content: "";
    position: absolute;
    left: 1.5vw;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 40px 40px 40px 0;
    border-color: transparent #0499a7 transparent transparent;
    opacity: .6;
    -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in;
}
.slick-arrow.slick-next:before{
    left: inherit;
    right: 1.5vw;
    border-width: 40px 0 40px 40px;
    border-color: transparent transparent transparent #0499a7;
}
.slick-arrow.slick-prev:hover:before,
.slick-arrow.slick-next:hover:before{
    opacity: 1;
}
.slick-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 6%;
    margin: auto;
    text-align: center;
    z-index: 999;
}

.slick-dots li {
    display: inline-block;
    vertical-align: top;
    margin: 0 8px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    cursor: pointer;
    background: rgba(255,255,255,.6);
}

.slick-dots li.slick-active {
    background: #FFF;
}

.slick-dots li button {
    display: none;
}
/* Slider end*/
.display-mob{
    display: none;
}
.block {
	color: #FFF;
	text-align: center;
	height: 30px;
	margin: 5px 0;
	background: #030;
}

.container {
    width: 100%;
    position: relative;
}

.grid-left {
    width: 33.33%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9999;
}
.logo{
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    margin: 150px 0 50px;
    padding:0 4.5%;
    z-index: 9;
    width: 100%;
}
.slider-outer{
    text-align: center;
}
.slide-item{
    position: relative;
}
.slider-text{
    position: absolute;
    top: 70%;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    z-index: 9;
    font-family: 'CenturyGothic';
    font-size: 48px;
    line-height: 1.2;
    color: #FFF;
    max-width: 70%;
    opacity: .6;
}
.slider-text span{
    margin:50px 0 0;
    display: block;
    text-transform: uppercase;
    text-decoration: underline;
    font-size:24px;
    cursor: pointer;
}
.slider-image{
    width: 100%;
    height: 100vh;
}
.slider-image img{
    width: 100%;
    height: 100vh;
    object-fit: cover;
    /*-webkit-filter: grayscale(100%); 
    filter: grayscale(100%);*/
}
.home-btn{
    width: 415px;
    position: fixed;
    right: 2vw;
    bottom: 1.5vw;
    z-index: 999;
}
.home-btn img{
    width: 100%;
}

.grid-right {
    width: 66.67%;
    margin-left: auto;
    overflow: hidden;
    position: relative;
    height: 100vh;
    background: #000;
}
.top-logo{
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-justify-content: space-between; 
    -ms-flex-pack: space-between; 
    justify-content: space-between;
    padding:0 3vw;
    margin: 90px 0 0;
    position: relative;
    z-index: 999;
}
.top-logo img{
    max-height: 150px;
}
.cube{
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 32px;
    line-height: 1;
    color: #000;
    text-align: center;
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-box-align: center; 
    -moz-box-align: center; 
    -webkit-align-items: center; 
    -ms-flex-align: center; 
    align-items: center;
    -webkit-justify-content: center; 
    -ms-flex-pack: center; 
    justify-content: center;
    margin:5px;
    position: absolute;
    z-index: 99;
    width: 158px;
    height: 178px;
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in;
}
.cube:before{
    content: "";
    width: 100%;
    height: 100%;
    background: #FFF;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    display: none;
    /*clip-path: polygon(50% 6%, 94% 28%, 94% 71%, 50% 94%, 6% 71%, 6% 28%, 50% 6%, 50% 0%, 0% 25%, 0% 75%, 50% 100%, 100% 75%, 100% 25%, 50% 0%);*/
    clip-path: polygon(50% 4%, 96% 27%, 96% 73%, 50% 96%, 4% 73%, 4% 27%, 50% 4%, 50% 0%, 0% 25%, 0% 75%, 50% 100%, 100% 75%, 100% 25%, 50% 0%);
    -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in;
}
.cube:hover{
    opacity: 1;
}
.cube.bg{
    background: #FFF;    
}
.cube.bk{
    background: #000;
    position: relative;
    z-index: 999;
    -moz-transform: scale(2.1); 
    -webkit-transform: scale(2.1); 
    -o-transform: scale(2.1); 
    -ms-transform: scale(2.1); 
    transform: scale(2.1);
}
.cube.br:before{
    display: block;
}
.cube.bg.cyan{
    background: #068084;
}
.cube.br.cyan:before{
    background: #068084;
}
.cube.scroll{
    cursor: pointer;
}
.cube:hover img{
    opacity: 1;
    -webkit-filter: grayscale(0); 
    filter: grayscale(0);
}
.cube.pict:hover{
    background: none;    
}

.op-1{opacity: .1;}
.op-2{opacity: .2;}
.op-3{opacity: .3;}
.op-4{opacity: .4;}
.op-5{opacity: .5;}
.op-6{opacity: .6;}
.op-7{opacity: .7;}
.op-8{opacity: .8;}
.op-9{opacity: .9;}

.row-2{top: 97px;}
.row-3{top: 237px;}
.row-4{top: 376px;}
.row-5{top: 515px;}
.row-6{top: 655px;}
.row-7{top: 794px;}
.row-8{top: 934px;}
.row-9{top: 1073px;}
.row-10{top: 1212px;}

.col-2{left: 164px;}
.col-3{left: 329px;}
.col-4{left: 494px;}
.col-5{left: 659px;}
.col-6{left: 824px;}
.col-7{left: 989px;}
.col-8{left: 1154px;}
.col-9{left: 1319px;}

.e-col-3{left: 246px;}
.e-col-4{left: 411px;}
.e-col-5{left: 576px;}
.e-col-6{left: 741px;}
.e-col-7{left: 906px;}
.e-col-8{left: 1071px;}
.e-col-9{left: 1236px;}
.e-col-10{left: 1401px;}

.pict img{
     width: 158px;
     height: 178px;
     object-fit: cover;
    -webkit-filter: grayscale(100%); 
    filter: grayscale(100%);
    -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in;
}
.main-bg{
   background: url("../images/bg.png") no-repeat 0 0;
   background-repeat: repeat;
   background-size: 330px;
   position: absolute;
   overflow: hidden;
   width: 100%; 
   height: 100%; 
   left: 0;
   top: 0; 
   opacity: 0;
   visibility: hidden;
   -webkit-transition: all 600ms ease-in; 
   -moz-transition: all 600ms ease-in; 
   -ms-transition: all 600ms ease-in; 
   -o-transition: all 600ms ease-in; 
   transition: all 600ms ease-in;
    display: none;
}
.main-bg.active{
    display: block;
    visibility: visible;
    opacity: 1;
}
.team-text{
    font-family: 'CenturyGothic';
    font-size: 42px;
    line-height: 1.2;
    color: #FFF;
    padding:0 4vw;
    margin: 100px 0 0;
    position: relative;
    z-index: 999;
    text-align: center;
}
.links{    
    font-family: 'calibriLight';
    font-weight: 400;
    font-size: 48px;
    line-height: 1.2;
    color: #FFF;
    text-transform: uppercase;
    margin:100px 0 0;
    padding:0 60px 0 82px;
    position: relative;
    z-index: 999;    
}
.links ul{
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-justify-content: space-between; 
    -ms-flex-pack: space-between; 
    justify-content: space-between;
}
.links ul li.inactive{
    opacity: .4;
}
.links ul li.inactive.active{
    opacity: 1;
}
.links ul li:nth-child(2){
    text-align: center;
}
.links ul li a{
    color: #FFF;
    -webkit-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -ms-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    transition: all 200ms ease-in;
}
.links ul li a:hover{
    color: #068084;
}
.links ul li a:focus{
    color: #FFF;
}
.links ul li.inactive a:hover{
    color: #FFF;
}
.coming{
    text-align: center;
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 48px;
    line-height: 1.2;
    color: #FFF;
    text-transform: uppercase;
    margin:150px auto 0;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 999;
    width: 540px;
    padding-right: 80px;
    padding-top: 50px;
}
.cube.wt-text{
    color: #FFF;
}
.map-outer {	
    position: relative;
    z-index: 999;
    opacity: .97;
    padding: 20px;
    overflow: hidden;
    height: 550px;
}
.map-inner {
    position: relative;
    height: 100%;
    overflow: hidden;
}
.map-outer img{
    max-width: inherit;
    width: 1500px;
    position: absolute;
    left: 50%;
    top: 50%;
    -moz-transform: translateX(-50%) translateY(-50%); 
    -webkit-transform: translateX(-50%) translateY(-50%); 
    -o-transform: translateX(-50%) translateY(-50%); 
    -ms-transform: translateX(-50%) translateY(-50%); 
    transform: translateX(-50%) translateY(-50%);
}
#map-canvas {
	width: 100%;
	height: 100%;
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+ */
	filter: gray; /* IE6-9 */
	-webkit-filter: grayscale(99%); /* Chrome 19+ & Safari 6+ */
	-webkit-backface-visibility: hidden;  /* Fix for transition flickering */
}
.social-media ul{
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-justify-content: space-between; 
    -ms-flex-pack: space-between; 
    justify-content: space-between;
}
.social-media ul li{
    position: absolute;    
    background: #797778;
    font-size: 100px;    
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    /* -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in;
    -moz-transform: scale(); 
    -webkit-transform: scale(.88); 
    -o-transform: scale(.88); 
    -ms-transform: scale(.88); 
    transform: scale(.88); */
}
.social-media ul li a{
    color: #FFF;
    width: 100%;
    height: 100%;
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-box-align: center; 
    -moz-box-align: center; 
    -webkit-align-items: center; 
    -ms-flex-align: center; 
    align-items: center;    
    -webkit-justify-content: center; 
    -ms-flex-pack: center; 
    justify-content: center;
    -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in;
}
.social-media ul li:hover{
    background: #0b6769;
}
.direction{
    position: absolute;
    z-index: 999;
    top: 40px;
    left: 40px;
    font-family: 'arial';
    font-size: 56px;
    line-height: 1.2;
    color: #FFF;
    opacity: 0.5;
}
.address{
    position: relative;
    z-index: 999;
    text-align: center;
    margin: 90px 0 0;
}
.address a{
    color: #FFF;
}
.contact-list{
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-flex-wrap: wrap; 
    -ms-flex-wrap: wrap; 
    flex-wrap: wrap;
    padding:0 2vw;
    margin:100px 0 50px;
    position: relative;
    z-index: 999;
}
.contact-us{
    width: 33.33%;
    text-align: center;
}
.contact-us a{
    color: #FFF;
}
.contact-us span{
    display: block;
    color: #FFF;
}
.cube.bk.row-6{
    margin-top: -90px;
}
.animate .cube{
    -webkit-transition: all 600ms ease-in; 
    -moz-transition: all 600ms ease-in; 
    -ms-transition: all 600ms ease-in; 
    -o-transition: all 600ms ease-in; 
    transition: all 600ms ease-in;
}
.animate .cube{
    opacity: 0;
}
.animate .cube:hover{
    opacity: 1;
}
.animate .cube.tm.op-2{
    opacity: .2;
}
.animate .cube.tm.op-4{
    opacity: .4;
}
.animate .cube.tm.op-6{
    opacity: .6;
}
.animate .cube.tm.op-7{
    opacity: .7;
}
.animate .cube.tm.op-8{
    opacity: .8;
}
.animate .cube.step1.op-2{
    opacity: .2;
}
.animate .cube.step1.op-4{
    opacity: .4;
}
.animate .cube.step1.op-6{
    opacity: .6;
}
.animate .cube.step1.op-7{
    opacity: .7;
}
.animate .cube.step1.op-8{
    opacity: .8;
}
.animate .cube.step2.active.op-2{
    opacity: .2;
}
.animate .cube.step2.active.op-4{
    opacity: .4;
}
.animate .cube.step2.active.op-6{
    opacity: .6;
}
.animate .cube.step2.active.op-7{
    opacity: .7;
}
.animate .cube.step2.active.op-8{
    opacity: .8;
}
.animate .cube.step3.active.op-2{
    opacity: .2;
}
.animate .cube.step3.active.op-4{
    opacity: .4;
}
.animate .cube.step3.active.op-6{
    opacity: .6;
}
.animate .cube.step3.active.op-7{
    opacity: .7;
}
.animate .cube.step3.active.op-8{
    opacity: .8;
}
.animate .cube.tm.step1del{
    opacity: 0;
}
.animate .cube.step2del.remove{
    opacity: 0;
}
.animate .cube.step3del.remove,
.animate .cube.tm.step3del.remove:hover{
    opacity: 0;
}
.animate .cube.step1:hover,
.animate .cube.step2.active:hover,
.animate .cube.step3.active:hover{
    opacity: 1 !important;
}
.animate .cube.tm.op-6:hover{
    opacity: 1;
}
.animate .cube.bk{
    opacity: 1;
}
.cube.light{
    opacity: 1 !important;
}
.cube.light img{
    opacity: 1;
    -webkit-filter: grayscale(0); 
    filter: grayscale(0);
}
.cube.view{
    opacity: 1;
}
.cube.view img{
    opacity: 1;
    -webkit-filter: grayscale(0); 
    filter: grayscale(0);
}
.cube[data-fancybox]{
    cursor: pointer;
}
.projects-outer{
    width: 100%;
    height: 100vh;
    padding: 0;
    position: relative;
    overflow: hidden;    
}
.projects-outer .slick-arrow{
    top: 50%;
}
.projects-outer .slick-arrow.slick-prev::before, 
.projects-outer .slick-arrow.slick-next::before{
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
.projects-outer .slick-arrow.slick-prev::before{
    left: 15px;
}
.projects-outer .slick-arrow.slick-next::before{
    right: 15px;
}
.projects-outer .slide-item img{
    width: 100%;
    height: 100.1vh;
    object-fit: cover;
    object-position: center center;
}
.projects-outer .slick-slider{
    cursor: default;
}
.fancybox-slide--html{
    padding: 0;
}
.projects-outer .fancybox-close-small{
    background: rgba(0,0,0,.5);
}
.project-name {
    position: absolute;
    left: 1%;
    top: 4%;
    z-index: 9;
    font-family: "CenturyGothic";
}
.project-name h2{
    color: #FFF;
}

.project-description {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 1%;
    z-index: 9;
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 20px;
    line-height: 1.5;
    color: #FFF;
    background: rgba(0,0,0,.3); 
    min-height: 9%;
}

.project-details {
    position: absolute;
    right: 1%;
    top: 4%;
    z-index: 9;
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5;
    color: #FFF;
    width: 33%;
}
.project-details:before{    
    content: "";
    position: absolute;
    left: -2.5vw;    
    width: 2px;
    height: 100%;
    min-height: 5vw;
    background: #9f9e9c;
    opacity: .7;
}
.detail-list ul li{
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
}
.detail-list ul li div{
    width: 35%;
}
.detail-list ul li span{
    width: 65%;
    display: block;
    position: relative;
    padding-left: 8px;
}
.detail-list ul li span:before{
    content: "-";
    position: absolute;
    left: 0;
}
.project-name.black h2,
.project-name.black h5,
.project-details.black,
.left-list.black,
.left-list.black h6{
    color: #000;
}
.project-description.black{
    background: #000; 
}
.left-list{
    position: absolute;
    bottom: 15%;
    left: 0;
    max-width: 30%;
    padding: 1%;
    z-index: 9;
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5;
    color: #FFF;
}
.left-list ul{
    margin:20px 0 0;
}
.left-list ul li{
    position: relative;
    padding-left: 10px;
}
.left-list ul li:before{
    content: "-";
    position: absolute;
    left: 0;
}
.title-text {
    padding:5px;
    position: absolute;
    width: 332px;
    margin-top: 136px;
    text-align: center;
}

.cube.flip{
    cursor: pointer;
}
/*profile*/
.animate .cube.op-8.step1.flipped,
.animate .cube.step2.active.op-8.flipped,
.animate .cube.step3.active.flipped,
.flipped img{
    opacity: 1;
}

.flip-box-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;  
  -webkit-transform-style: preserve-3d;
   -ms-transform-style: preserve-3d;  
  transform-style: preserve-3d;
  -webkit-transition: all 600ms ease-in; 
  -moz-transition: all 600ms ease-in; 
  -ms-transition: all 600ms ease-in; 
  -o-transition: all 600ms ease-in; 
  transition: all 600ms ease-in;  
}
.cube.flipped .flip-box-inner {  
    -webkit-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.flip-box-front, .flip-box-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);    
}
.flip-box-back img{
    -webkit-filter: grayscale(0); 
    filter: grayscale(0);
}
.flip-box-back {
  background-color: #555;
  color: white;
  transform: rotateY(180deg);
}
.grid-left .slider-image{
    background: #000;
}
.grid-left .slider-image img{
    opacity: 0.7;
}
.contact-page .logo{
    display: none;
}
.contact-page .grid-left .slider-image img{
    opacity: 1;
}
.contact-page .slider-text{
    display: none;
}
.contact-page .slick-arrow{
    top: 50%;
}
.contact-page .slider-image img{
    -webkit-filter: grayscale(0); 
    filter: grayscale(0);
}
.grid-left .slick-dots{
    display: none !important;
}
.contact-page .slick-dots{
    display: block !important;
}
.contact-page .slick-arrow{
    display: none !important;
}
.animate .social-media .cube{
    opacity: 1;
}
.a1,.a2,.a3,.a4{
    opacity: 0.3;
    -webkit-transition: all 400ms ease-in; 
    -moz-transition: all 400ms ease-in; 
    -ms-transition: all 400ms ease-in; 
    -o-transition: all 400ms ease-in; 
    transition: all 400ms ease-in;
    -moz-transform: scale(1) translateY(20px);
-webkit-transform: scale(1) translateY(20px);
-o-transform: scale(1) translateY(20px);
-ms-transform: scale(1) translateY(20px);
transform: scale(1) translateY(20px);
}
.anim1 .a1,
.anim2 .a2,
.anim3 .a3,
.anim4 .a4{
    opacity: 1;
    -moz-transform: scale(1) translateY(0px);
-webkit-transform: scale(1) translateY(0px);
-o-transform: scale(1) translateY(0px);
-ms-transform: scale(1) translateY(0px);
transform: scale(1) translateY(0px);
}
.highlight{
    font-size: 18px;
    text-transform: uppercase;
    cursor: pointer;
}
.animate .cube.highlight.op-8.inactive,
.animate .cube.highlight.op-8.inactive:hover{
    opacity: .4 !important;
}
.animate .cube.highlight.op-8.link-active,
.animate .cube.highlight.op-8.link-active:hover{
    opacity: 1 !important;
}
.grid-left .slick-dots li {
    margin: 0 6px; 
    width: 18px; 
    height: 18px;
}
.animate .cube.op-2.step1{
    opacity: .2;
}
.animate .cube.op-4.step1{
    opacity: .4;
}
.animate .cube.op-6.step1{
    opacity: .6;
}
.animate .cube.op-8.step1{
    opacity: .8;
}
.animate.sec2 .cube.op-2.step2{
    opacity: .2;
}
.animate.sec2 .cube.op-4.step2{
    opacity: .4;
}
.animate.sec2 .cube.op-6.step2{
    opacity: .6;
}
.animate.sec2 .cube.op-8.step2{
    opacity: .8;
}
.animate.sec3 .cube.op-2.step3{
    opacity: .2;
}
.animate.sec3 .cube.op-4.step3{
    opacity: .4;
}
.animate.sec3 .cube.op-6.step3{
    opacity: .6;
}
.animate.sec3 .cube.op-8.step3{
    opacity: .8;
}
.slick-dots li:only-child {
    display: none;
}
.cube.no-bg{
    background: none;
}
.cube.reset{
    cursor: pointer;
}
.grid-left .slider-image img:nth-child(even){
    display: none;
}
.services-outer{
   background: url("../images/bg.png") no-repeat 0 0;
   background-repeat: repeat;
   background-size: 330px;
   width: 100%;
   padding: 0;
   position: absolute;
   height: 6758px;
   -webkit-transition: all 600ms ease-in; 
   -moz-transition: all 600ms ease-in; 
   -ms-transition: all 600ms ease-in; 
   -o-transition: all 600ms ease-in; 
   transition: all 600ms ease-in; 
    
}
.cube2x{
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 30px;
    line-height: 1.2;
    color: #000;
    text-align: center;
    text-transform: uppercase;
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-box-align: center; 
    -moz-box-align: center; 
    -webkit-align-items: center; 
    -ms-flex-align: center; 
    align-items: center;
    -webkit-justify-content: center; 
    -ms-flex-pack: center; 
    justify-content: center;
    margin:3px;
    position: absolute;
    z-index: 99;
    width: 325px;
    height: 368px;
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    -webkit-transition: all 600ms ease-in; 
    -moz-transition: all 600ms ease-in; 
    -ms-transition: all 600ms ease-in; 
    -o-transition: all 600ms ease-in; 
    transition: all 600ms ease-in;
}
.cube2x:before{
    content: "";
    width: 100%;
    height: 100%;
    background: #FFF;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    display: none;
    clip-path: polygon(50% 4%, 96.5% 27%, 96.5% 73%, 50% 96%, 3.5% 73%, 3.5% 27%, 50% 4%, 50% 0%, 0% 25%, 0% 75%, 50% 100%, 100% 75%, 100% 25%, 50% 0%);
    -webkit-transition: all 600ms ease-in; 
    -moz-transition: all 600ms ease-in; 
    -ms-transition: all 600ms ease-in; 
    -o-transition: all 600ms ease-in; 
    transition: all 600ms ease-in;
}
.cube2x.br:before{
    display: block;
}
.cube2x.br.cyan:before{
    background: #03989e;    
}
.cube2x.bg{
    background: #FFF;    
}
.cube2x.bg.cyan{
    background: #03989e;    
}
.cube2x.bg.gray{
    background: #b0b0b0;    
}
.services-logo {
    text-align: center;
    margin: 150px 0 0;
}
.services-logo img{
    max-width: 100%;
}
.xrow-6{
    top: 746px;
}
.xrow-8{
    top: 1025px;
}
.xrow-10{
    top: 1304px;
}
.xrow-12{
    top: 1583px;
}
.xrow-14{
    top: 1862px;
}
.xrow-16{
    top: 2141px;
}
.xrow-17{
    top: 2233px;
}
.xrow-19{
    top: 2512px;
}
.xrow-20{
    top: 2698px;
}
.xrow-21{
    top: 2791px;
}
.xrow-22{
    top: 2978px;
}
.xrow-24{
    top: 3258px;
}
.xrow-25{
    top: 3442px;
}
.xrow-26{
    top: 3538px;
}
.xrow-27{
    top: 3722px;
}
.xrow-28{
    top: 3818px;
}
.xrow-29{
    top: 4001px;
}
.xrow-35{
    top: 4932px;
}
.xrow-37{
    top: 5211px;
}
.xrow-39{
    top: 5490px;
}
.xrow-44{
    top: 6189px;
}
.xrow-46{
    top: 6468px;
}
.xrow-48{
    top: 6747px;
}
.xrow-50{
    top: 7026px;
}
.xrow-55{
    top: 7629px;
}
.xrow-57{
    top: 7908px;
}
.xrow-59{
    top: 8187px;
}
.white-text{
    color: #FFF;
}
.bg.bg-op-2{
    background: rgba(255,255,255,.2);
}
.bg.bg-op-3{
    background: rgba(255,255,255,.3);
}
.bg.bg-op-4{
    background: rgba(255,255,255,.4);
}
.bg.bg-op-5{
    background: rgba(255,255,255,.5);
}
.bg.bg-op-6{
    background: rgba(255,255,255,.6);
}
.bg.bg-op-7{
    background: rgba(255,255,255,.7);
}
.bg.bg-op-8{
    background: rgba(255,255,255,.8);
}
.bg.bg-op-2:hover,
.bg.bg-op-3:hover,
.bg.bg-op-4:hover,
.bg.bg-op-5:hover,
.bg.bg-op-6:hover,
.bg.bg-op-7:hover,
.bg.bg-op-8:hover,
.bg.bg-op-2.light,
.bg.bg-op-3.light,
.bg.bg-op-4.light,
.bg.bg-op-5.light,
.bg.bg-op-6.light,
.bg.bg-op-7.light,
.bg.bg-op-8.light{
    background: rgba(255,255,255,1);
    color: #000;
}
.bg.op-8:hover,
.bg.op-8.light{
    opacity: 1;
}

.bg.cyan.bg-op-2{
    background: rgba(3,152,158,.2);
}
.bg.cyan.bg-op-3{
    background: rgba(3,152,158,.3);
}
.bg.cyan.bg-op-4{
    background: rgba(3,152,158,.4);
}
.bg.cyan.bg-op-5{
    background: rgba(3,152,158,.5);
}
.bg.cyan.bg-op-6{
    background: rgba(3,152,158,.6);
}
.bg.cyan.bg-op-7{
    background: rgba(3,152,158,.7);
}
.bg.cyan.bg-op-8{
    background: rgba(3,152,158,.8);
}
.bg.cyan.bg-op-2:hover,
.bg.cyan.bg-op-3:hover,
.bg.cyan.bg-op-4:hover,
.bg.cyan.bg-op-5:hover,
.bg.cyan.bg-op-6:hover,
.bg.cyan.bg-op-7:hover,
.bg.cyan.bg-op-8:hover,
.bg.cyan.bg-op-2.light,
.bg.cyan.bg-op-3.light,
.bg.cyan.bg-op-4.light,
.bg.cyan.bg-op-5.light,
.bg.cyan.bg-op-6.light,
.bg.cyan.bg-op-7.light,
.bg.cyan.bg-op-8.light{
    background: rgba(3,152,158,1);
    color: #FFF;
}

.bg.gray.bg-op-2{
    background: rgba(176,176,176,.2);
}
.bg.gray.bg-op-3{
    background: rgba(176,176,176,.3);
}
.bg.gray.bg-op-4{
    background: rgba(176,176,176,.4);
}
.bg.gray.bg-op-5{
    background: rgba(176,176,176,.5);
}
.bg.gray.bg-op-6{
    background: rgba(176,176,176,.6);
}
.bg.gray.bg-op-7{
    background: rgba(176,176,176,.7);
}
.bg.gray.bg-op-8{
    background: rgba(176,176,176,.8);
}
.bg.gray.bg-op-2:hover,
.bg.gray.bg-op-3:hover,
.bg.gray.bg-op-4:hover,
.bg.gray.bg-op-5:hover,
.bg.gray.bg-op-6:hover,
.bg.gray.bg-op-7:hover,
.bg.gray.bg-op-8:hover,
.bg.gray.bg-op-2.light,
.bg.gray.bg-op-3.light,
.bg.gray.bg-op-4.light,
.bg.gray.bg-op-5.light,
.bg.gray.bg-op-6.light,
.bg.gray.bg-op-7.light,
.bg.gray.bg-op-8.light{
    background: rgba(176,176,176,1);
}

.br.bg-op-2:before{
    background: rgba(255,255,255,.2);
}
.br.bg-op-3:before{
    background: rgba(255,255,255,.3);
}
.br.bg-op-4:before{
    background: rgba(255,255,255,.4);
}
.br.bg-op-5:before{
    background: rgba(255,255,255,.5);
}
.br.bg-op-6:before{
    background: rgba(255,255,255,.6);
}
.br.bg-op-7:before{
    background: rgba(255,255,255,.7);
}
.br.bg-op-8:before{
    background: rgba(255,255,255,.8);
}
.br.bg-op-2:hover:before,
.br.bg-op-3:hover:before,
.br.bg-op-4:hover:before,
.br.bg-op-5:hover:before,
.br.bg-op-6:hover:before,
.br.bg-op-7:hover:before,
.br.bg-op-8:hover:before,
.br.bg-op-2.light:before,
.br.bg-op-3.light:before,
.br.bg-op-4.light:before,
.br.bg-op-5.light:before,
.br.bg-op-6.light:before,
.br.bg-op-7.light:before,
.br.bg-op-8.light:before{
    background: rgba(255,255,255,1);
}

.br.cyan.bg-op-2:before{
    background: rgba(3,152,158,.2);
}
.br.cyan.bg-op-3:before{
    background: rgba(3,152,158,.3);
}
.br.cyan.bg-op-4:before{
    background: rgba(3,152,158,.4);
}
.br.cyan.bg-op-5:before{
    background: rgba(3,152,158,.5);
}
.br.cyan.bg-op-6:before{
    background: rgba(3,152,158,.6);
}
.br.cyan.bg-op-7:before{
    background: rgba(3,152,158,.7);
}
.br.cyan.bg-op-8:before{
    background: rgba(3,152,158,.8);
}
.br.cyan.bg-op-2:hover:before,
.br.cyan.bg-op-3:hover:before,
.br.cyan.bg-op-4:hover:before,
.br.cyan.bg-op-5:hover:before,
.br.cyan.bg-op-6:hover:before,
.br.cyan.bg-op-7:hover:before,
.br.cyan.bg-op-8:hover:before,
.br.cyan.bg-op-2.light:before,
.br.cyan.bg-op-3.light:before,
.br.cyan.bg-op-4.light:before,
.br.cyan.bg-op-5.light:before,
.br.cyan.bg-op-6.light:before,
.br.cyan.bg-op-7.light:before,
.br.cyan.bg-op-8.light:before{
    background: rgba(3,152,158,1);
}
.logo-block {
    position: absolute;
    right: 150px;
    top: 490px;
    width: 38%;
}
.logo-text{
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 30px;
    line-height: 1.2;
    color: #FFF;
    text-align: justify;
    text-transform: uppercase;
    margin:30px 0 0;
}

.text-only {
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 23px;
    line-height: 1.2;
    color: #FFF;
    text-transform: uppercase;
    width: 27%;
    max-width: 460px;
    height: 368px;
    padding: 0 30px;
    position: absolute;
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-box-align: center; 
    -moz-box-align: center; 
    -webkit-align-items: center; 
    -ms-flex-align: center; 
    align-items: center;
    -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in;
    visibility: hidden;
    opacity: 0;
    text-align: justify;
}
.text-only.show-text{
    visibility: visible;
    opacity: 1;
}
.right-align{
    text-align: right;
    -webkit-justify-content: flex-end;  
    -ms-flex-pack: flex-end;  
    justify-content: flex-end;
}
.tx1{
    left: 30px;
}
.tx2{
    left: 1155px;
}
.tx3{
    left: 690px;
}

.services-offered {
    position: absolute;
    background: rgba(255,255,255,.2);
    font-family: "CenturyGothicBold";
    font-size: 52px;
    line-height: 1.2;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    width: 33%;
    padding: 10px 20px;
}

.ds1 {
    top: 610px;
    left: 270px;
}

.ds2 {
    width: 40%;
    top: 2560px;
    left: 953px;
    text-align: right;
}

.mgnt {
    left: 115px;
    top: 2440px;
}

.text-block-outer {
    position: absolute;
    left: 0;
    top: 4400px;
    width: 100%;
    z-index: 999;
}

.title-block {
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 90px;
    line-height: 1;
    color: #FFF;
    text-transform: uppercase;
    position: relative;
    min-height: inherit;
    padding:0 0 55px;
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-justify-content: space-between; 
    -ms-flex-pack: space-between; 
    justify-content: space-between;
}
.title-block span{
    width: 47%;
    position: relative;    
    text-align: right;
}
.title-block span:nth-child(even){
    text-align: left;
    top: -30px;
}
.text-block-inner{
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-justify-content: space-between; 
    -ms-flex-pack: space-between; 
    justify-content: space-between;
    -webkit-flex-wrap: wrap; 
    -ms-flex-wrap: wrap; 
    flex-wrap: wrap;
}
.text-block {
    width: 100%;
    text-align: left;
    font-family: "CenturyGothic";
    font-weight: 400;
    font-size: 30px;
    line-height: 1.3;
    color: #FFF;
    text-transform: uppercase;
    min-height: 140px;
    padding-left: 53%;
}
.text-block:nth-child(even){
    padding-left: 0;
    padding-right: 53%;
    text-align: right;
}
.single-1{
    top: 4562px;
}
.single-2{
    top: 4652px 
}
.single-3{
   top: 4842px 
}
.single-4{
   top: 5026px 
}
.single-5{
   top: 5400px 
}
.single-6{
   top: 5678px 
}
.single-7{
   top: 5770px 
}
.fancybox-slide--html .fancybox-close-small{
    color: #FFF;
}


.readmore {
    height: 8700px;
}

.rrow-4 {
    top: 371px;
}
.rrow-6 {
    top: 651px;
}
.rrow-8 {
    top: 931px;
}

.cp-1 {
    left: 35px;
}
.cp-2{
   left: 205px; 
}
.cp-3{
   left: 202px; 
}
.cp-4{
   left: 615px; 
}
.cp-5{
   left: 120px; 
}
.cp-6{
   left: 10px; 
}
.readmore h2{
    font-family: 'CenturyGothicBold';
    font-size: 120px;
    font-weight: 700;
    letter-spacing: 10px;
    line-height: 1;
    text-align: left;
}
.readmore p{
    line-height: 1.3;
    width: 90%;
    margin: 0;
    text-align: justify;
}
.more-title{
    position: absolute;
    text-align: center;
    top: 8000px;
}
.wh-1{
    width: 38%;
}
.wh-1 h2{
    font-size: 145px;
}
.wh-2{
    width: 53%;
}
.wh-3{
    width: 35%;
    max-width: 600px;
}
.wh-4{
    width: 50%;
}
.wh-5{
    width: 20%;
}
.wh-6{
    width: 42%;
}
.wh-7{
    width: 30%;
}
.wh-8{
    width: 34%;
}
.wh-9{
    width: 52%;
}
.wh-10{
    width: 24%;
}
.wh-11{
    width: 54%;
}
.wh-12{
   width: 33%; 
}
.tp-1{
    top: 90px;
    left: 180px;
}
.tp-2{
    top: 1430px;
    right: 60px;
}
.tp-4{
    top: 3095px;
    left: 90px;
}
.tp-6{
    top: 4600px;
    right: 30px;
}
.tp-9{
   top: 5980px;
   left: 140px; 
}
.tp-11{
   top: 7290px;
   right: 100px; 
}
.tp-4 h2,
.tp-6 h2,
.tp-11 h2{
    font-size: 90px;
    letter-spacing: 5px;
}
.tp-9 h2{
    font-size: 120px;
}
.quot-text{
    position: absolute;
    font-family: "CenturyGothicBold";
    font-size: 30px;
    line-height: 1.3;
    color: #03989e;
}
.quot-text:before{
    content: '"';
    position: absolute;
    left: -40px;
    top: -40px;
    font-size: 90px;
}
.qwh-1{
    width: 18%;
}
.qwh-2{
    width: 16%;
}
.qwh-3{
    width: 12%;
}
.qp-1{
    top: 1290px;
    left: 250px;
}
.qp-2{
    top: 3250px;
    right: 90px;
}
.qp-3{
    top: 5610px;
    right: 50px;
}
.sm-text{
    line-height: 1.5;
    font-size: 24px;
    text-transform:capitalize;
}
.center-align{
    text-align: center;
}
.sm-size-1{
    font-size: 18px;
}
.size-lg-1{
    font-size: 72px;
}
.cyan-text{
    color: #03989e;
}
.md-text-1{
    font-size: 42px;
}
.md-text-2{
    font-weight: 700;
    font-size: 42px;
}
.cube2x.bg.icon-1,
.cube2x.bg.icon-2,
.cube2x.bg.icon-3,
.cube2x.bg.icon-4,
.cube2x.bg.icon-5{
    background-size: cover;
    background-position: center center;
}
.cube2x.bg.icon-1{
    background-image: url("../images/icon1.jpg");
}
.cube2x.bg.icon-2{
    background-image: url("../images/icon2.jpg");
}
.cube2x.bg.icon-3{
    background-image: url("../images/icon3.jpg");
}
.cube2x.bg.icon-4{
    background-image: url("../images/icon4.jpg");
}
.cube2x.bg.icon-5{
    background-image: url("../images/icon5.jpg");
}
#section7.main-bg, #section8.main-bg{
    overflow: auto;
}
.nbx{
    cursor: pointer;
}
.near-box{
    width: 15px;
    height: 30px;
    margin-left: -18px;
    position: absolute;
    z-index: 99;
    cursor: pointer;
    margin-top: 170px; 
}
.near-box.rt{
   margin-left: 5px; 
}
.near-box:after{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 15px 15px 0;
    border-color: transparent rgba(3,152,158,1) transparent transparent;
    opacity: 1;
    -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in;
}
.near-box.rt:after{
    border-width: 15px 0 15px 15px;
    border-color: transparent transparent transparent rgba(3,152,158,1);
}
.home-logo {
    padding:30px 0;
    text-align: center;
}

.tsub{
    font-family: "CenturyGothic";
    font-size: 20px;
    color: #FFF;
    display: block;
    padding:0 0 15px;
}
.ss-btn {
    font-family: 'CenturyGothicBold';
    font-size: 48px;
    color: #FFF;
    padding: 10px 15px;
    position: relative;
    cursor: pointer;
}
.ss-btn:after{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,1);
    -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in;
}
.ss-btn:after{
  animation: btn-animation linear 2s;
  animation-iteration-count: infinite;
  transform-origin: 50% 50%;
  -webkit-animation: btn-animation linear 2s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: btn-animation linear 2s;
  -moz-animation-iteration-count: infinite;
  -moz-transform-origin: 50% 50%;
  -o-animation: btn-animation linear 2s;
  -o-animation-iteration-count: infinite;
  -o-transform-origin: 50% 50%;
  -ms-animation: btn-animation linear 2s;
  -ms-animation-iteration-count: infinite;
  -ms-transform-origin: 50% 50%;
}

@keyframes btn-animation{
  0% {
    width: 0;
    opacity: 1;  
  }
  25% {
    width: 100%;
    opacity: .4;  
  }
  75% {
    width: 100%;
    opacity: .4;   
  }
  100% {
    width: 0;
    opacity: 1;   
  }   
}

@-moz-keyframes btn-animation{
  0% {
    width: 0;
    opacity: 1;  
  }
  25% {
    width: 100%;
    opacity: .4;  
  }
  75% {
    width: 100%;
    opacity: .4;   
  }
  100% {
    width: 0;
    opacity: 1;   
  }  
}

@-webkit-keyframes btn-animation {
  0% {
    width: 0;
    opacity: 1;  
  }
  25% {
    width: 100%;
    opacity: .4;  
  }
  75% {
    width: 100%;
    opacity: .4;   
  }
  100% {
    width: 0;
    opacity: 1;   
  } 
}

@-o-keyframes btn-animation {
  0% {
    width: 0;
    opacity: 1;  
  }
  25% {
    width: 100%;
    opacity: .4;  
  }
  75% {
    width: 100%;
    opacity: .4;   
  }
  100% {
    width: 0;
    opacity: 1;   
  }   
}

/*
.text-only br{
    display: none;
}
.text-only{
    text-align: justify;
}
*/

.services-inner {
    position: absolute;
    left: 0;
    top: 558px;
    width: 100%;
}
.pbox{
    position: absolute;
    height: 188px;
}
.profile-box {
    overflow: hidden;
    position: absolute;
    width: 0;
    opacity: 0;
    right: 100%;
    z-index: 999;
    background: rgba(0,0,0,.5);
    margin-right: -3px;
    -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in;
    display: -webkit-box;       
    display: -moz-box;          
    display: -ms-flexbox;        
    display: -webkit-flex;       
    display: flex;
    -webkit-box-align: center; 
    -moz-box-align: center; 
    -webkit-align-items: center; 
    -ms-flex-align: center; 
    align-items: center; 
    height: auto;
    top: 50%;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    min-height: 88px;
}
.p-left{
    font-family: 'CenturyGothic';
    font-size: 60px;
    color: #FFF;
    width: 110px;
    text-align: center;
}
.p-right{
    width: calc(100% - 110px);
    font-family: 'CenturyGothic';
    font-size: 14px;
    line-height: 1.2;
    color: #FFF;
    text-align: justify;
    padding: 5px;
    padding-left: 0;
}
.p-right strong{
    font-family: 'CenturyGothicBold';
}
.profile-box.lt{
    left: 0;
    right: inherit;
}
.show .profile-box {
    width: 495px;
    opacity: 1;
}

/*.read-more {
    display: none;
}
.readmore-page .slider-image img{
    display: none;
    -webkit-filter: grayscale(0); 
    filter: grayscale(0);
}
.readmore-page .slider-image img.read-more{
    display: block;
}*/
.fancybox-slide--html .fancybox-close-small{
    padding: 0;
}
.browser{
    height: 100vh;
    width: 100%;    
    -webkit-box-align: center; 
    -moz-box-align: center; 
    -webkit-align-items: center; 
    -ms-flex-align: center; 
    align-items: center;
    -webkit-justify-content: center; 
    -ms-flex-pack: center; 
    justify-content: center;
    text-align: center;
    -webkit-flex-direction: column; 
    -ms-flex-direction: column; 
    flex-direction: column;
    font-size: 72px;
    color: #000;
    background: url("../images/exbg.jpg") repeat left top;
    padding:150px 0;
    display: none;    
}
.browser h1{
    font-family: 'CenturyGothic';
    font-size: 56px;
    padding: 0 0 30px;
}
.browser p{
    font-size: 20px;
    color: #000;
    line-height: 2;
    padding:0 0 50px;
}
.browsers {
    text-align: center;
}
.browsers a{
    display: inline-block;
    width: 72px;
    height: 72px;
    margin: 0 15px;
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center center;
}
.browsers a.edge{
    background-image: url("../images/edge.png");
}
.browsers a.chrome{
    background-image: url("../images/chrome.png");
}
.browsers a.firefox{
    background-image: url("../images/firefox.png");
}
.browsers a.safari{
    background-image: url("../images/safari.png");
}
.browsers a.opera{
    background-image: url("../images/opera.png");
}



.animate-from-left{
    opacity: 0;
    -moz-transform: translateX(-150px);
    -webkit-transform: translateX(-150px);
    -o-transform: translateX(-150px);
    -ms-transform: translateX(-150px);
    transform: translateX(-150px); 
}
.animate-from-right{
    opacity: 0;
    -moz-transform: translateX(150px);
    -webkit-transform: translateX(150px);
    -o-transform: translateX(150px);
    -ms-transform: translateX(150px);
    transform: translateX(150px);    
    
}
.animate-from-bottom{
    opacity: 0;
    -moz-transform: translateY(150px);
    -webkit-transform: translateY(150px);
    -o-transform: translateY(150px);
    -ms-transform: translateY(150px);
    transform: translateY(150px);   
}
.delay1{
    -webkit-transition: all 1000ms ease;
    -moz-transition: all 1000ms ease;
    -ms-transition: all 1000ms ease;
    -o-transition: all 1000ms ease;
    transition: all 1000ms ease;
}
.delay2{
    -webkit-transition: all 1200ms ease;
    -moz-transition: all 1200ms ease;
    -ms-transition: all 1200ms ease;
    -o-transition: all 1200ms ease;
    transition: all 1200ms ease;
}
.delay3{
    -webkit-transition: all 1400ms ease;
    -moz-transition: all 1400ms ease;
    -ms-transition: all 1400ms ease;
    -o-transition: all 1400ms ease;
    transition: all 1400ms ease;
}
.delay4{
    -webkit-transition: all 1600ms ease;
    -moz-transition: all 1600ms ease;
    -ms-transition: all 1600ms ease;
    -o-transition: all 1600ms ease;
    transition: all 1600ms ease;
}
.animate-from-left.enter,
.animate-from-right.enter{
    opacity: 1;
    -moz-transform: translateX(0);
    -webkit-transform: translateX(0);
    -o-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);    
}
.animate-from-bottom.enter{
    opacity: 1;
    -moz-transform: translateY(0);
    -webkit-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);  
}

#section7{
    overflow-x: hidden !important;
}


.main-bg{
    display: block;
    opacity: 0;
}
.startPoint{
    width: 0;
    height: 0;
    opacity: 0;
}
.hexagonAnimation{
    -webkit-transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
    transition: all 900ms ease;
}
.hexagonAnimation{
    -moz-transform: translateY(150px);
    -webkit-transform: translateY(150px);
    -o-transform: translateY(150px);
    -ms-transform: translateY(150px);
    transform: translateY(150px); 
    opacity: 0; 
}
.hexagonAnimation:hover,
.bg.op-2:hover, 
.bg.op-4:hover, 
.bg.op-4.light,
.bg.op-6:hover, 
.bg.op-6.light,
.bg.op-8:hover, 
.bg.op-8.light,
.cube:hover,
.cube:hover img{
    opacity: 0;
}
.hexagonAnimation.activated:hover,
.bg.op-2.activated:hover, 
.bg.op-2.light.activated,
.bg.op-4.activated:hover, 
.bg.op-4.light.activated,
.bg.op-6.activated:hover, 
.bg.op-6.light.activated,
.bg.op-8.activated:hover, 
.bg.op-8.light.activated,
.cube.activated:hover,
.cube.activated:hover img{
    opacity: 1;
}
.hexagonAnimation.activated{
    -moz-transform: translateY(0px);
    -webkit-transform: translateY(0px);
    -o-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
}
.op-2.activated{
    opacity: .2;
}
.op-4.activated{
    opacity: .4;
}
.op-6.activated{
    opacity: .6;
}
.op-8.activated{
    opacity: .8;
}

.childHexagon .hexagonAnimation{
    -webkit-transition: all 1000ms ease;
    -moz-transition: all 1000ms ease;
    -ms-transition: all 1000ms ease;
    -o-transition: all 1000ms ease;
    transition: all 1000ms ease;
}
.childHexagon .hexagonAnimation:nth-child(1){
    -moz-transform: translateY(150px);
    -webkit-transform: translateY(150px);
    -o-transform: translateY(150px);
    -ms-transform: translateY(150px);
    transform: translateY(150px);     
    opacity: 0;     
}
.childHexagon .hexagonAnimation:nth-child(2){
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    transform: translateY(200px); 
    opacity: 0; 
}
.childHexagon .hexagonAnimation:nth-child(3){
    -moz-transform: translateY(250px);
    -webkit-transform: translateY(250px);
    -o-transform: translateY(250px);
    -ms-transform: translateY(250px);
    transform: translateY(250px);  
    opacity: 0; 
}
.childHexagon .hexagonAnimation:nth-child(4){
    -moz-transform: translateY(300px);
    -webkit-transform: translateY(300px);
    -o-transform: translateY(300px);
    -ms-transform: translateY(300px);
    transform: translateY(300px); 
    opacity: 0; 
}
.childHexagon.activated .hexagonAnimation{
    -moz-transform: translateY(0px);
    -webkit-transform: translateY(0px);
    -o-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
}



.hexagonAnimation.deactivated{
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    transform: translateY(200px);  
    opacity: 0;
}


/* Custom Added Classes when converted to WP*/

.member-invisible{
    display: none;
}

.cube-text-space{
    padding: 0 15px !important;
}
.cube-text-space2{
    padding: 0 26px !important;
}
.cube-text-space3{
    padding: 0 25px !important;
}
.cube-text-space4{
    padding: 0 10px !important;
}
.cube-text-space5{
    padding: 0 30px !important;
}
/*.others-width{
    max-width: 49%;
    display: inline-block;
}
.others-width2{
    max-width: 60%;
    display: inline-block;
}
.others-width3{
    max-width: 35%;
    display: inline-block;
}
.excube-width{
    max-width: 55%;
    display: inline-block;   
}
.excube-width2{
    max-width: 60%;
    display: inline-block;   
}
.excube-width3{
    max-width: 60%;
    display: inline-block;   
}*/

.cube2x .cubetext-space-about{
    padding: 0 15px !important;
    font-family: "CenturyGothic";
    font-weight: bold;
}
.cube2x{
        padding: 15px !important;
}
.text-block div{
    width:62%;
}
.text-block div.right{
    float:right
}
/*.service-subtext1{*/
    /*width: width: 23% !important;*/
/*}*/
.project-description div{
    width: 30%;
}
@media only screen and (min-width: 1440px) and (max-width: 1919px){
    .tx1 {
        left: 34px !important;
    }
} 
.readmore p{
    font-family: "CenturyGothic";
}
.nbx:hover{
  opacity: 1 !important;
}
#section4 {
    font-family: "CenturyGothic";
}