﻿* {
 box-sizing:border-box
}
a {
 color:#333
}
.clearfix {
 clear:both;
 background:0 0!important
}
.description {
 position:absolute;
 top:50%;
 left:50%;
 -webkit-transform:translateY(-50%);
 -ms-transform:translateY(-50%);
 transform:translateY(-50%);
 -webkit-transform:translateX(-50%);
 -ms-transform:translateX(-50%);
 transform:translateX(-50%)
}
.menu-mobile {
 display:none;
 padding:15px
}
.menu-mobile:after {
 content:"\f394";
 font-family:ionicons;
 font-size:1.7rem;
 padding:0;
 padding-left:5px;
 float:right;
 position:relative;
 top:50%;
 -webkit-transform:translateY(-25%);
 -ms-transform:translateY(-25%);
 transform:translateY(-25%);
 padding-left:9px;
 color:#3c5a63
}
.menu-dropdown-icon:before {
 content:"\f489";
 font-family:ionicons;
 display:none;
 cursor:pointer;
 float:right;
 padding:1.2em 1.5em;
 color:#fff
}



.menu>ul {
 margin:0 auto;
 width:782px;
 list-style:none;
 padding:0;
 float:right;
 box-sizing:border-box;
 z-index:5000
}
.menu>ul:before,.menu>ul:after {
 content:"";
 display:table
}
.menu>ul:after {
 clear:both
}
.menu>ul>li {
 float:left;
 padding:0;
 margin:0
}
.menu>ul>li a {
 text-decoration:none;
 padding:1em 1.2em;
 display:block;
 color:#1c2f34;
 font-family:'<heebo',Arial;
 font-size:14px;
 letter-spacing:1px;
 text-transform:uppercase;
 font-weight:500
}
.menu>ul>li a:hover {
 color:#125b84;
 text-shadow:inherit
}
.menu>ul>li>ul {
 display:none;
 width:100%;
 padding:20px;
 position:absolute;
 z-index:99;
 left:0;
 margin:0;
 list-style:none;
 box-sizing:border-box;
 margin-top:6px;
 background-color:rgba(255,255,255,.8)
}
.menu>ul>li>ul:before,.menu>ul>li>ul:after {
 content:"";
 display:table
}
.menu>ul>li>ul:after {
 clear:both
}
.menu>ul>li>ul>li {
 margin:0;
 padding-bottom:0;
 list-style:none;
 width:100%;
 background:0 0;
 float:left;
 line-height:16px
}
.menu>ul>li>ul>li a {
 color:#1c2f34;
 padding:0;
 width:95%;
 display:block;
 font-family:'<heebo',Arial;
 font-size:14px;
 font-weight:400;
 text-transform:uppercase;
 font-weight:400;
 text-align:left
}
.menu>ul>li>ul>li a:hover {
 color:#6bb1bd
}
.menu>ul>li>ul>li>ul {
 display:block;
 padding:0;
 margin:10px 0 0;
 list-style:none;
 box-sizing:border-box
}
.menu>ul>li>ul>li>ul:before,.menu>ul>li>ul>li>ul:after {
 content:"";
 display:table
}
.menu>ul>li>ul>li>ul:after {
 clear:both
}
.menu>ul>li>ul>li>ul>li {
 float:left;
 width:100%;
 padding:6px 0;
 margin:0;
 font-size:.8em
}
.menu>ul>li>ul>li>ul>li a {
 border:0
}
.menu>ul>li>ul.normal-sub {
 width:300px;
 left:auto;
 padding:10px 20px
}
.menu>ul>li>ul.normal-sub>li {
 width:100%
}
.menu>ul>li>ul.normal-sub>li a {
 border:0;
 padding:1em 0
}




.right {
 width:50%;
 text-align:right;
 box-sizing:border-box;
 float:left;
 background-image:url(line.png);
 background-repeat:no-repeat;
 background-position:left center;
 padding-left:17px
}
.left {
 width:50%;
 text-align:left;
 box-sizing:border-box;
 float:left
}
.mediatop {
 margin-top:12px!important
}
.mediatop2 {
 margin-top:52px!important
}
.right_new {
 height:225px!important
}
.projects1 {
 width:280px;
 list-style:none;
 padding:0;
 position:relative;
 box-sizing:border-box;
 z-index:1000;
 float:right;
 margin-top:28px
}
.projects1 li {
 float:right;
 padding:0;
 margin:0;
 width:100%;
 text-align:right
}
.projects1 li a {
 text-decoration:none;
 padding:9px 10px!important;
 display:block;
 color:#9dcce6!important;
 font-family:<Heebo, "Arial !important";
 font-size:15px!important;
 letter-spacing:1px;
 text-transform:uppercase!important;
 text-shadow:inherit!important
}
.projects1 li:hover {
 color:#fff
}
.projects2 {
 width:280px;
 list-style:none;
 padding:0;
 position:relative;
 box-sizing:border-box;
 z-index:1000;
 float:left
}
.projects2 li {
 float:left;
 padding:0;
 margin:0;
 width:100%;
 text-align:left
}
.projects2 li a {
 text-decoration:none;
 padding:6px 10px!important;
 display:block;
 color:#fff!important;
 font-family:<Heebo, "Arial !important";
 font-size:14px!important;
 letter-spacing:1px;
 text-shadow:inherit!important
}
.projects2 li:hover {
 color:#fff
}
.status {
 font-weight:700!important
}
.marginstyle {
 margin-top:14px;
 !important
}
.projectstyle {
 font-weight:700!important;
 color:#fff!important;
 font-size:50px!important
}
.wrapper {
 display:block;
 position:absolute;
 top:50%;
 left:50%;
 -webkit-transform:translate(-50%,-50%)
}
h1 a {
 color:#fff;
 font-size:2em;
 text-decoration:none;
 display:inline-block;
 position:relative;
 font-family:dosis,sans-serif
}
a.effect-underline:after {
 content:'';
 position:absolute;
 left:0;
 display:inline-block;
 height:1em;
 width:100%;
 border-bottom:1px solid;
 margin-top:10px;
 opacity:0;
 -webkit-transition:opacity .35s,-webkit-transform .35s;
 transition:opacity .35s,transform .35s;
 -webkit-transform:scale(0,1);
 transform:scale(0,1)
}
a.effect-underline:hover:after {
 opacity:1;
 -webkit-transform:scale(1);
 transform:scale(1)
}
a.effect-box:after,a.effect-box:before {
 content:'';
 position:absolute;
 left:0;
 display:inline-block;
 height:1em;
 width:100%;
 margin-top:10px;
 opacity:0;
 -webkit-transition:opacity .35s,-webkit-transform .35s;
 transition:opacity .35s,transform .35s
}
a.effect-box:before {
 border-left:1px solid;
 border-right:1px solid;
 -webkit-transform:scale(1,0);
 transform:scale(1,0)
}
a.effect-box:after {
 border-bottom:1px solid;
 border-top:1px solid;
 -webkit-transform:scale(0,1);
 transform:scale(0,1)
}
a.effect-box:hover:after,a.effect-box:hover:before {
 opacity:1;
 -webkit-transform:scale(1);
 transform:scale(1)
}
a.effect-shine:hover {
 -webkit-mask-image:linear-gradient(-75deg,rgba(0,0,0,.6) 30%,#000 50%,rgba(0,0,0,.6) 70%);
 -webkit-mask-size:200%;
 animation:shine 2s infinite
}
@-webkit-keyframes shine {
 from {
  -webkit-mask-position:150%
 }
 to {
  -webkit-mask-position:-50%
 }
}
@media only screen and (max-width:1280px) {
 .menu-container {
  width:100%
 }
}
@media only screen and (max-width:960px) {
 .menu-container {
  width:100%;
  background:#none
 }
 .menu>ul {
  width:100%;
  float:left
 }
 .menu-mobile {
  display:block;
  color:#3c5a63!important;
  font-family:'<heebo',Arial;
  text-decoration:none;
  font-size:14px;
 }
 .menu-dropdown-icon:before {
  display:block
 }
 .menu>ul {
  display:none
 }
 .menu>ul>li {
  width:100%;
  float:none;
  display:block;
  text-align:left;
  background:rgba(60,90,99,.8)
 }
 .menu>ul>li a {
  padding:1.5em;
  width:100%;
  display:block;
  color:#fff
 }
 .menu>ul>li a:hover {
  color:#abc9d1!important
 }
 .menu>ul>li a:hover {
  color:orange
 }
 .menu>ul>li>ul {
  position:relative
 }
 .menu>ul>li>ul.normal-sub {
  width:100%;
  background:rgba(80,110,120,.8)
 }
 .menu>ul>li>ul>li {
  float:none;
  width:100%;
  margin-top:20px
 }
 .menu>ul>li>ul>li:first-child {
  margin:0
 }
 .menu>ul>li>ul>li>ul {
  position:relative
 }
 .menu>ul>li>ul>li>ul>li {
  float:none
 }
 .menu .show-on-mobile {
  display:block;
  z-index:6000
 }
 .menu>ul>li>ul>li a {
  color:#fff
 }
}
@media only screen and (max-width:960px) {
 .projects1 {
  width:100%
 }
 .projects2 {
  width:100%
 }
}




@media only screen and (max-width:768px) {
.menu-mobile {
    padding: 5px 21px 5px 15px;
}

}







@media only screen and (max-width:490px) {
 .projectstyle {
  font-size:17px!important
 }
}
