body {
    background: #fff;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 14px;
    /*line-height: 22px;*/
    color: #000;
    height:100%;
}

html {
    height: 100%;
}
form{
    height:100%;
}
h1 { font-size: 36px; font-style: normal; font-weight: 700; line-height: 40px; }
h2 { font-size: 32px; font-style: normal; font-weight: 600; line-height: 38px; }
h3 { font-size: 28px; font-style: normal; font-weight: 600; line-height: 32px; }
h4 { font-size: 22px; font-style: normal; font-weight: 500; line-height: 26px; }
h5 { font-size: 18px; font-style: normal; font-weight: 600; line-height: 18px; }
h6 { font-size: 16px; font-style: normal; font-weight: 600; line-height: 18px; }
.height-all{height:100%;}
.mt30{margin-top:30px;}
.page-header{color:rgb(20, 120, 240);}
/*************************
******* BG - color:before ******
**************************/
.bg-overlay-black-10:before {  background: rgba(0, 0, 0, 0.1); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-black-20:before {  background: rgba(0, 0, 0, 0.2); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-black-30:before {  background: rgba(0, 0, 0, 0.3); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-black-40:before {  background: rgba(0, 0, 0, 0.4); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-black-50:before {  background: rgba(0, 0, 0, 0.5); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-black-60:before {background: rgba(0, 0, 0, 0.6);content: "";height: 100%;left: 0;position: absolute;top: 0;width: 100%;z-index: 0;}
.bg-overlay-black-70:before {  background: rgba(0, 0, 0, 0.7); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-black-80:before {  background: rgba(0, 0, 0, 0.8); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-black-90:before {  background: rgba(0, 0, 0, 0.9); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-white-10:before {  background: rgba(255, 255, 255, 0.1); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-white-20:before {  background: rgba(255, 255, 255, 0.2); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-white-30:before {  background: rgba(255, 255, 255, 0.3); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-white-40:before {  background: rgba(255, 255, 255, 0.4); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-white-50:before {  background: rgba(255, 255, 255, 0.5); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-white-60:before {  background: rgba(255, 255, 255, 0.6); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-white-70:before {  background: rgba(255, 255, 255, 0.7); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-white-80:before {  background: rgba(255, 255, 255, 0.8); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }
.bg-overlay-white-90:before {  background: rgba(255, 255, 255, 0.9); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 0; }

/*************************
   BG - Images
*************************/
.parallax{
    background-size: cover !important;
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -ms-background-size: cover !important;
    position: relative;
    z-index: 0;
    background-origin: initial;
    background-position: center center !important;
    background-repeat: no-repeat;
}
/* --------Index Start-------- */

/*************************
******* Header ******
**************************/
.HBtn {
    -ms-flex-align: center;
    -ms-flex-pack: center;
    -o-transition: .4s;
    -webkit-box-align: center;
    -webkit-box-pack: center;
    -webkit-transition: .4s;
    align-items: center;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    letter-spacing: 1px;
    transition: .4s;
}

.HMenu {
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    line-height: 1.8;
}
.navbar-nav a {
    color: rgba(255, 255, 255, 0.8);
    font-size: 20px;
}

#header .navbar-nav >li a {
  padding: 20px;
  text-transform: uppercase;
  font-weight: 300;
  text-decoration: none;
}

#header .navbar-nav li ul.sub-menu li a{
  color: #ffffff;
  padding: 5px 0;
  font-size: 15px;
  display: block;
  text-transform: capitalize;
}

#header .navbar-nav li ul.sub-menu li a:hover,
#header .navbar-nav li ul.sub-menu li a:focus{
  color: #00aeef;
}

.fa-angle-down{
  padding-left: 5px; 
}

#header .navbar-nav li.active>a,
#header .navbar-nav li.active>a:focus,
#header .navbar-nav li>a:hover, 
#header .navbar-nav li>a:focus{
    background-color: inherit;
    border: 0;
    color: rgba(255, 255, 255, 1);
}

#header .navbar-nav li a:hover {
    color: rgba(255, 255, 255, 1);
}

.navbar {
    margin-bottom: 0;
    padding: 30px 0;
    -o-transition: .4s;
    -webkit-transition: .4s;
    transition: .4s;
    background-color:rgba(255, 255, 255, 0);
}

.navbar-scrollover{background-color:rgb(20, 120, 240);padding:0px;}

.navbar-header span {
    background: rgba(255, 255, 255, 0);
    color: rgba(255, 255, 255, 1);
    border-color: rgba(16, 41, 66, 1);
    border-width: 0;
    height: 36px;
    width: auto;
    font-size: 28px;
}

ul.navbar-nav {
    width: 600px;
}
/*************************
******* Footer ******
**************************/
#footer {
  padding-bottom: 10px;
  background-position: bottom;
  background-size: contain;
  background-color:rgb(20, 120, 240);
}
#footer ul.nav{float:none;display:inline-block;}
#footer .navbar-nav a{color:rgba(255, 255, 255, 1);}
#footer .nav>li>a:focus, #footer .nav>li>a:hover {
    text-decoration: none;
    background-color: inherit;
}
#footer .nav>li>a:hover {
    color:rgba(255, 255, 255, 0.8);
}

.clients-menu{
    overflow: hidden;
    margin-bottom: 10px;
}
.img-logo{
    margin: 30px 0 20px;
}
.copyright-text{
  color: rgba(255, 255, 255, 0.8);
  font-size: 16px;  
  padding-bottom: 15px;
}
/*************************
******* Index slide ******
**************************/
.swiper-container{
    height:100%;
}
.scr-section{
    overflow:hidden;
}
.swiper-slide .table-box {
    padding-bottom: 6%;
}

.swiper-slide .table-cell {
    position: relative;
}
.banner-bin{
    background: center no-repeat;
    background-size: cover;
}
.table-box {
    display: table;
    width: 100%;
    height: 100%;
}

.table-cell {
    display: table-cell;
    width: 100%;
    height: 100%;
    vertical-align: middle;
    text-align: center;
    padding: 60px 0;
}

.banner-absolute{position:absolute; width:100%; height:94%; top:0; left:0;}
.banner-write {position: relative;z-index: 992;word-break: break-all;padding: 0 10px;}
.banner-write * {max-width: 100%;}

.banner-write .w0 {text-align: left;display: inline-block;padding-left: 10px;transition: .3s .4s;-webkit-transition: .3s .4s;
-moz-transition: .3s .4s;-ms-transition: .3s .4s;-o-transition: .3s .4s;transform: translateX(150px);
-moz-transform: translateX(150px);-ms-transform: translateX(150px);-o-transform: translateX(150px);-webkit-transform: translateX(150px);opacity: 0;}
.banner-write .w0.cc {text-align: center;transform: translate(0);-moz-transform: translate(0);
-ms-transform: translate(0);-o-transform: translate(0);-webkit-transform: translate(0);opacity: 0;}
.banner-write .w0.lc{text-align:right;display:inline-block;padding:0 420px 0 0;width:768px;
transition:.3s .4s; -webkit-transition:.3s .4s; -moz-transition:.3s .4s; -ms-transition:.3s .4s; -o-transition:.3s .4s;
transform:translateX(-150px); -moz-transform:translateX(-150px); -ms-transform:translateX(-150px);
-o-transform:translateX(-150px); -webkit-transform:translateX(-150px); opacity:0;}
.swiper-slide.swiper-slide-active .banner-write .w0 {transform: translate(0);-moz-transform: translate(0);
-ms-transform: translate(0);-o-transform: translate(0);-webkit-transform: translate(0);opacity: 1;}
.banner-write .w0 .w01{color:#fff;font-size:36px;display:block;}
.banner-write .w0.cc .w01{transform:scale(1.2) translateY(-50px); -moz-transform:scale(1.2) translateY(-50px); -ms-transform:scale(1.2) translateY(-50px); -webkit-transform:scale(1.2) translateY(-50px); -o-transform:scale(1.2) translateY(-50px);
transition:.3s .4s; -webkit-transition:.3s .4s; -moz-transition:.3s .4s; -ms-transition:.3s .4s; -o-transition:.3s .4s;}
.swiper-slide.swiper-slide-active .banner-write .w0.cc .w01{transform:scale(1) translateY(0); -moz-transform:scale(1) translateY(0); -ms-transform:scale(1) translateY(0); -webkit-transform:scale(1) translateY(0); -o-transform:scale(1) translateY(0);}
.banner-write .w0.cc .w02{transform:translateY(100px); -moz-transform:translateY(100px); -ms-transform:translateY(100px);
transition:.3s .4s; -webkit-transition:.3s .4s; -moz-transition:.3s .4s; -ms-transition:.3s .4s; -o-transition:.3s .4s;
-o-transform:translateY(100px); -webkit-transform:translateY(100px);}
.banner-write .w0.cc .w03{transform:translateY(150px); -moz-transform:translateY(150px); -ms-transform:translateY(150px);
transition:.3s .4s; -webkit-transition:.3s .4s; -moz-transition:.3s .4s; -ms-transition:.3s .4s; -o-transition:.3s .4s;
-o-transform:translateY(150px); -webkit-transform:translateY(150px);}
.swiper-slide.swiper-slide-active .banner-write .w0.cc .w02,
.swiper-slide.swiper-slide-active .banner-write .w0.cc .w03{transform:translate(0); -moz-transform:translate(0); -ms-transform:translate(0);
-o-transform:translate(0); -webkit-transform:translate(0);}
.banner-write .w0 .w02{line-height:.9;letter-spacing:-5px;font-family:Helvetica;font-size:82px;color:#00dfb9;
display:inline-block;border-bottom:1px solid #00dfb9;margin:15px 0 10px 0;}
.banner-write .w0 .w03{color:#ccc;font-size:16px;display:block;}
.banner-write .w0 .w03 em{font-style:normal; color:#00dfb9;}

.banner-border{width:0;height:0;margin:-205px 0 0 -300px;left:50%;top:50%;position:absolute;z-index:994;
transition:.4s 1s; -webkit-transition:.4s 1s; -moz-transition:.4s 1s; -ms-transition:.4s 1s; -o-transition:.4s 1s;
border:2px dashed #00dfb9;z-index:993; visibility:hidden;}
.swiper-slide.swiper-slide-active .banner-border{width:600px;height:410px; visibility:visible;}

.banner-pager{position:absolute; height:3px; line-height:0; top:75%; bottom:auto !important; left:0; right:0; text-align:center;z-index:10;}
.banner-pager .swiper-pagination-bullet{width:40px; height:3px; position:relative; line-height:3px; border-radius:0; background:#fff; opacity:1;}
.banner-pager .swiper-pagination-bullet:before{position:absolute; width:40px; height:30px; content:''; left:0; top:-10px;}
.banner-pager .swiper-pagination-bullet-active{background:#00dfb9;}

.ctrl-box{opacity:.5;}
.ctrl-box:hover{opacity:1;}
.banner-ctrl .ctrl-box{position:absolute; color:#a8a8a8; width:80px; text-align:center; 
line-height:80px; font-size:50px; cursor:pointer;
transition:.3s; -webkit-transition:.3s; -moz-transition:.3s; -ms-transition:.3s; -o-transition:.3s;z-index:10;}
.banner-ctrl .ctrl-box:hover{color:#00dfb9;}
.banner-ctrl .ctrl-left{left:5%; top:45%; margin-top:-40px;}
.banner-ctrl .ctrl-right{right:5%; top:45%; margin-top:-40px;}

/*************************
******* Index business ******
**************************/
.feature-container{padding: 50px 0 70px 0;}
.feature-inner i{display: inline-block;font-size: 56px;width: 100px;height: 100px;line-height: 90px;margin: 30px;
 border: 5px solid #1478f0;border-radius: 50%;text-align: center;color: #1478f0;background: rgba(255,255,255,.1);}
.title{font-size:36px;color:rgba(31, 31, 31, 1)}
.title-sub{font-size:24px;color:rgba(31, 31, 31, 1)}
.title-company{
    color: rgba(153, 153, 153, 1);
    font-size: 18px;
    line-height: 1.8;}
.shape-component{
    width: 50px;
    height: 5px;
    background: rgba(20, 120, 240, 1);
    border-width: 0;
    border-radius: 0;
    border-style: solid;
}
.shape-common{margin: 50px auto 10px;}
.shape-aboutus {margin:50px 0;}
.margin-about-us{padding:20px 0 30px 60px;}

.sec-bg-c{background-color: rgba(250, 250, 250, 1)}
.item_icon{box-shadow: 0 0 10px rgba(79, 79, 79, 0.16);padding:0 0 20px;}
.item_icon:hover{box-shadow: 0 0 10px rgba(79, 79, 79, 0.25);transform: translateY(-10px);}
/*************************
******* Index Portfolio Default**
**************************/

.portfolio-single {
  position: relative;
}

.portfolio-thumb {
  position: relative;
}

.portfolio-thumb img {
  width: 100%;
}


.portfolio-single:hover .portfolio-view{
  display: block;
  -webkit-animation: fadeInUp 400ms;
  animation: fadeInUp 400ms;
}

#portfolio .row{
  margin-left: -10px;
  margin-right: -10px;
}

.portfolio-view {
  display: none;
  position: absolute;
  top: 0;
  height: 100%;
  background:rgba(20, 120, 240, 0.9);
  width: 100%;
  text-align: center;
}

.portfolio-view .nav-pills {
  padding: 0;
  display: inline-block;
  margin-top: -26px;
  top: 50%;
  position: relative;
}

.portfolio-view .nav-pills li {
  display: inline-block;
  margin: 0 5px;
}

.portfolio-view .nav-pills li a {
  color: #fff;
  border: 1px solid #fff;
  width: 40px;
  height: 40px;
  line-height: 38px;
  text-align: center;
  padding: 0;
  border-radius: 40px;
  -webkit-animation: scaleIn 400ms linear 100ms both;
  animation: scaleIn 400ms linear 100ms both;
  -webkit-transition: all 0.9s ease;
  transition: all 0.9s ease;
}

.portfolio-view .nav-pills li a:hover {
  color: #702340;
  border-color: #702340;
  -webkit-transition: all 0.9s ease;
  transition: all 0.9s ease;
}

.portfolio-info {
  overflow: hidden;
  margin-bottom: 30px;
}

.portfolio-info h2 {
  font-size: 18px;
  margin: 15px 0 0;
}
.portfolio-filter {
  margin: 40px 0;
  padding: 0;
}
.portfolio-items{
    min-height:620px;
}
.portfolio-filter li {
  display: inline-block;
  position: relative;
}

.portfolio-filter li a {
  border-radius: 0;
  color: #686868;
  font-size: 18px;
  font-weight: 300;
  padding: 0 25px;
  text-transform: capitalize;
  border: none;
}

.portfolio-filter li .active{
  background: transparent;
  box-shadow: none;
  -webkit-box-shadow: none;
}

.portfolio-filter li a:hover, 
.portfolio-filter li a:focus,
.portfolio-filter li a.active {
  background: transparent;
  box-shadow: none;
  -webkit-box-shadow: none;
}

.portfolio-filter li a.active:before{
  position: absolute;

  content: "";
  left: 0;
  width: 13px;
  height: 16px;
  background: url(../images/portfolio/icon.png);
  top: 5px;
}

.scaleIn {
  -webkit-animation-name: scaleIn;
  animation-name: scaleIn;
}

@-webkit-keyframes scaleIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes scaleIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  -ms-transition-duration: 0.8s;
  -o-transition-duration: 0.8s;
  transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
  -moz-transition-property: height, width;
  -ms-transition-property: height, width;
  -o-transition-property: height, width;
  transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
  -moz-transition-property: -moz-transform, opacity;
  -ms-transition-property: -ms-transform, opacity;
  -o-transition-property: -o-transform, opacity;
  transition-property: transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
  -moz-transition-duration: 0s;
  -ms-transition-duration: 0s;
  -o-transition-duration: 0s;
  transition-duration: 0s;
}

/*************************
******* Index Solution**
**************************/
.single-solution{
    overflow: hidden;
    padding-top: 65px;
    padding-bottom: 40px;
}
.single-solution .col-sm-6 {
  margin-top: 50px;
}

.single-solution:last-child {
  padding-bottom: 65px;
  padding-top: 0;
}

.single-solution h2{
  margin-bottom: 15px;
}

/* --------Index Start-------- */

/* --------Aboutus Start-------- */
#header-banner{min-height:300px;padding-top:200px;padding-bottom:150px;}
.title-banner p{font-size:24px;}
.title-banner{color:#fff;}
.text-content{
    color: #626262;
    font-size: 18px;
    line-height: 1.8;
    text-indent: 2em;
}
.advantages-inner i{
    display: inline-block;
    font-size: 56px;
    width: 100px;
    height: 100px;
    line-height: 90px;
    margin: 30px;
    border: 5px solid #1478f0;
    border-radius: 50%;
    text-align: center;
    color: #f5f5f5;
    background: rgb(20, 120, 240);
}
.advantages-inner p{font-size:18px;color:#626262;line-height: 1.8;}
.advantages-container{padding-top:50px;}

.results-container{padding-top:65px;}

/* --------Contactus Start-------- */
.baidumap{min-height:580px;margin-bottom: 60px;}
.single-contact{padding-top:80px;padding-bottom:50px;}
.single-contact i{color:rgb(20, 120, 240);}
.subtitle{font-size:18px;padding:20px 0}

/* --------EnergyPage-------- */
.tab-normal{padding:0;}
.tab-normal-line{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 16.66666667%;
    height: 2px;
    background-color: #00a4ff;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
}
.fun-menu li {
    padding-left:0;
    padding-right:0;
    font-size:18px;
}
.fun-menu>li>a{
    color:#666;
    text-align: center;
}
.fun-menu>li>a:focus,.fun-menu>li>a:hover{
    text-decoration: none;
    background-color: rgba(255, 255, 255, 0);
    color:#00a4ff;
}
.tab-product{
    background-color: #f7f8fa;
    padding: 20px 0;
    margin-bottom:30px;
}
.tab-product .product-list ul li{
    width:24%;
    display:inline-block;
    vertical-align: top;
}
.tab-product .product-list ul li a{
    text-decoration: none;
    color: #333;
    display: block;
    padding: 15px 30px;
    cursor: pointer;
}
.tab-product .product-list ul li a:hover{
    background-color:#fff;
    -webkit-box-shadow: 0 2px 4px 0 rgba(3,27,78,.06);
    -moz-box-shadow: 0 2px 4px 0 rgba(3,27,78,.06);
    box-shadow: 0 2px 4px 0 rgba(3,27,78,.06)
}