.navbar-fixed-top {
   background: white;
   color: black;
   border-bottom: 1px solid #b6b3b3
}

.nav-box ul li a {
   color: #999999
}

.nav-box ul li .nav-active {
   background: rgba(52, 201, 251, 1);
   color: #ffffff
}

.nav-box ul li .nav-active:hover {
   color: #ffffff;
   background: rgba(52, 201, 251, 1);
}

.nav-box ul li a:hover {
   color: rgb(52, 201, 251);
   border-bottom-color: rgb(52, 201, 251);
   background-color: rgba(242, 242, 242, 0.8);
}

.infoTitle {
   height: 80px;
   box-shadow: 0px 0px 5px rgba(153, 153, 153, 0.2);
   position: relative;
   top: -40px;
   background: #ffffff
}

.infoTitle div {
   padding: 7px 40px;
}

.tfnINfo a {
   margin-left: 20px;
   color: #000;
}

.vertical.flip-container {
   position: relative;
}

.titleInfoLeft h3 {
   font-size: 13px
}

.tfnINfo .active {
   width: 90px;
   height: 30px;
   background: inherit;
   background-color: rgba(0, 121, 254, 1);
   display: inline-block;
   font-size: 13px;
   line-height: 28px;
   color: #ffffff;
   text-align: center;
   line-height: 33px;
}


/* =======================================
17.1 About Area Gr
=========================================*/

.gr-about-area,
.about-4 {
   padding: 95px 0 65px;
}

#about {
   padding-bottom: 65px;
}

.about-detail {
   padding-top: 30px;
   text-align: center;
}

.about-wrap ul {
   padding: 0;
   margin: 0;
   list-style: none;
}

.about-wrap {
   background-image: url("../images/divider.png");
   background-position: center top;
   background-repeat: no-repeat;
   margin: 0 auto;
   max-width: 845px;
   padding: 65px 0 0;
   position: relative;
   height: 1900px;
}

.about-wrap ul li {
   position: relative;
   padding-bottom: 60px;
   z-index: 1;
   background-image: url(../images/divide-icon.png);
   background-position: center top;
   background-repeat: no-repeat;
}

.ab-single img {
   height: 250px;
   margin-left: -8px;
   width: 360px;
}

.ab-content {
   margin-left: 43px;
}

.ab-single.clearfix:nth-child(2n+0) .ab-content {
   margin-left: 0;
   margin-right: 45px;
   text-align: right;
}

.ab-single.clearfix:nth-child(2n+0) .ab-content>p {
   font-size: 13.99px;
   line-height: 20.98px;
}

.ab-single.clearfix:nth-child(2n+0) img {
   margin-left: 45px;
}

/* =============================================
18. Donate Now Area
================================================*/

.donate-now {
   padding: 50px 0 45px;
   background: #e91e63;
}

.donate-txt {
   margin: 0 auto;
   max-width: 880px;
}

.donate-txt h3 {
   color: #fff;
   float: left;
   font-family: '微软雅黑';
   font-size: 24px;
   margin-top: 12px;
   text-transform: uppercase;
}

.donate-txt h3 span {
   color: #ddd;
}

.donate-now .gr-btn,
.donate-now .btn-filled {
   float: right;
   font-size: 18px;
   padding: 14px 40px;
}

.ab-content h3 {
   color: #26547c;
   font-size: 24px;
   line-height: 50px;
}

.ab-content h4 {
   color: #26547c;
   font-size: 18px;
   line-height: 36px;
}

.ab-content p {
   font-size: 18px;
   line-height: 36px;
}

.gr-body {
   color: #999;
}


.inner-title {
   background: #rgba(52, 201, 251, 1);
   padding: 30px 0;
}

.inner-title h2 {
   color: #fff;
}

.breadcrumbs ul {
   float: right;
   font-size: 13px;
   margin-top: 10px;
   font-weight: 500
}

.breadcrumbs ul li {
   display: inline-block;
   color: #fff !important;
   margin: 0 0 0 5px
}

.breadcrumbs ul li:after {
   content: "\f101";
   font-family: "FontAwesome";
   font-size: 12px;
   color: #fff;
   margin: 0 0 0 9px
}

.breadcrumbs ul li:last-child:after,
.breadcrumbs ul li:first-child:after {
   content: "";
   margin: 0
}

.breadcrumbs ul li:last-child a,
.breadcrumbs ul li a {
   color: #fff !important;
   font-weight: 600
}

.breadcrumbs ul li a:hover {
   color: #fff !important;
   text-decoration: underline;
}

.breadcrumbs ul li:first-child {
   padding-right: 0;
   margin-left: 0
}

.breadcrumbs ul li:first-child,
.breadcrumbs ul li:last-child {
   color: #fff;
   background: 0
}

.breadcrumbs ul li:last-child {
   padding: 0;
   background: 0
}

.about-details {
   padding: 15px 0;
   max-width: 90%;
   margin: 0 auto;
   text-align: left;
}

#aboutus .col-md-6 {
   margin-top: 15px
}

.content-wrapper {
   border-top: 1px solid white;
   background: #ffffff;
   padding-bottom: 80px;
}

.section-header {
   margin-top: 60px;
   margin-bottom: 60px;
}

.section-header h2 {
   font-size: 24px;
   display: inline;
   text-transform: uppercase;
   font-weight: normal;
}

.section-header span {
   margin-left: 10px;
}

@media screen and (max-width: 768px) {
   .section-header span {
      display: block;
      margin-left: 0;
   }
}

.box-content {
   background: #f3f6f8;
   padding: 25px;
   overflow: hidden;
}

.intro-header {
   margin-bottom: 30px;
}

.intro-header h2 {
   font-size: 24px;
   text-transform: uppercase;
   font-weight: normal;
}

.intro-header p {
   margin-top: 10px;
}

.overlay-b {
   opacity: 0;
   visibility: hidden;
   overflow: hidden;
   position: absolute;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.9);
   -webkit-transition: all 250ms ease-in-out;
   -moz-transition: all 250ms ease-in-out;
   transition: all 250ms ease-in-out;
   bottom: 0;
   left: 0;
}

.overlay-b .overlay-inner {
   position: relative;
   width: 100%;
   height: 100%;
}

.overlay-b .overlay-inner a {
   position: absolute;
   top: 50%;
   left: 50%;
   margin-left: -18px;
   margin-top: -18px;
   border: 1px solid #d5d5d5;
   width: 36px;
   height: 36px;
   display: block;
   text-align: center;
   line-height: 36px;
   color: white;
}

.overlay-b .overlay-inner a:hover {
   color: #f69730;
   border-color: #f69730;
}

h3.grid-heading {
   font-size: 20px;
   font-weight: normal;
   text-transform: uppercase;
   margin-bottom: 15px;
}

.service-item {
   overflow: hidden;
   margin-bottom: 30px;
}

.service-item.service-right .service-icon {
   float: left;
   text-align: left;
   margin-right: 30px;
}

.service-item.service-right .service-content {
   text-align: left;
}

.service-item.service-left .service-icon {
   float: right;
   text-align: right;
   margin-left: 30px;
}

.service-content {
   text-align: right;
   font-size: 14px;
}

.service-item .service-content {
   overflow: hidden;
}

.service-item .service-content h4 {
   font-size: 18px;
   margin-bottom: 10px;
   font-weight: normal;
   color: #26547c;
}

.service-item .service-icon {
   margin-top: 15px;
   width: 80px;
   height: 80px;
   display: block;
   -webkit-transform: rotate(0);
   -moz-transform: rotate(0);
   -ms-transform: rotate(0);
   -o-transform: rotate(0);
   transform: rotate(0);
   -webkit-transition: all 300ms ease-in-out;
   -moz-transition: all 300ms ease-in-out;
   transition: all 300ms ease-in-out;
}

.service-item .service-icon i {
   width: 80px;
   height: 80px;
   border: 2px solid #d5d5d5;
   border-radius: 40px;
   text-align: center;
   line-height: 80px;
   color: #2c2c2c;
   display: block;
   font-size: 1.89em;
}

.service-item:hover .service-icon {
   -webkit-transform: rotate(360deg);
   -moz-transform: rotate(360deg);
   -ms-transform: rotate(360deg);
   -o-transform: rotate(360deg);
   transform: rotate(360deg);
}

.service-item:hover .service-icon i {
   color: #f69730;
   border-color: #f69730;
}

@media screen and (max-width: 768px) {
   .service-item .service-icon {
      width: 60px;
      height: 60px;
      border-radius: 30px;
      line-height: 60px;
      font-size: 1.4em;
   }

   .service-item:hover .service-icon {
      -webkit-transform: rotate(0);
      -moz-transform: rotate(0);
      -ms-transform: rotate(0);
      -o-transform: rotate(0);
      transform: rotate(0);
   }

   .service-item.service-right .service-icon {
      float: none;
      margin: 0 auto 40px auto;
   }

   .service-item.service-right .service-content {
      text-align: center;
   }

   .service-item.service-left .service-icon {
      float: none;
      margin: 0 auto 40px auto;
   }

   .service-item.service-left .service-content {
      text-align: center;
   }
}

.team-member {
   margin-bottom: 40px;
   overflow: hidden;
}

.team-member img {
   width: 100%;
   display: block;
   -webkit-transition: opacity 200ms ease;
   -moz-transition: opacity 200ms ease;
   transition: opacity 200ms ease;
}

.team-member h4.member-name {
   display: inline-block;
   font-size: 18px;
   font-weight: normal;
   margin-bottom: 10px;
}

.team-member span {
   margin-left: 10px;
}

.team-member p {
   margin-bottom: 20px;
}

.team-member ul.social-network li {
   display: inline;
   margin-right: 15px;
}

.team-member ul.social-network li a {
   color: #2c2c2c;
}

.team-member ul.social-network li a:hover {
   color: #f69730;
}

.our-staff {
   margin-top: 40px;
   padding-top: 60px;
   border-top: 1px solid white;
}

.staff-member {
   margin-bottom: 30px;
   width: 100%;
   position: relative;
   overflow: hidden;
   display: inline-block;
}

.staff-member img {
   width: 100%;
}

.staff-member .overlay {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   background: rgba(0, 0, 0, 0.85);
   opacity: 0;
   visibility: 0;
   padding: 25px;
   -webkit-transition: all 200ms ease-in-out;
   -moz-transition: all 200ms ease-in-out;
   transition: all 200ms ease-in-out;
}

.staff-member .overlay .overlay-inner {
   position: relative;
   width: 100%;
   height: 100%;
}

.staff-member .overlay .overlay-inner .social-network {
   position: absolute;
   top: 0;
   right: 0;
}

.staff-member .overlay .overlay-inner .social-network li {
   display: inline;
   margin-left: 15px;
}

.staff-member .overlay .overlay-inner .social-network li a {
   color: white;
}

.staff-member .overlay .overlay-inner span {
   color: white;
   font-size: 1.3em;
   font-family: "Roboto Slab", serif;
   position: absolute;
   bottom: 0;
   left: 0;
}

.staff-member:hover .overlay {
   opacity: 1;
   visibility: visible;
}

@media screen and (max-width: 768px) {
   .projects-holder-2 .filter-categories {
      margin-bottom: 60px;
   }

   .projects-holder-2 .filter-categories ul li {
      display: inline-block;
      margin-right: 10px;
   }
}

.projects-holder-3 .filter-categories {
   margin-bottom: 60px;
}

.projects-holder-3 .filter-categories ul li {
   display: inline-block;
   margin-right: 10px;
}

.project-item {
   overflow: hidden;
   margin-bottom: 40px;
}

.project-item .project-detail h2 {
   font-size: 18px;
   font-weight: normal;
   margin: 0 0 10px 0;
   display: block;
}

.project-item .project-detail h2 a {
   color: #2c2c2c;
}

.project-item .project-detail h2 a:hover {
   color: #f69730;
}

.project-item:hover .overlay-b {
   opacity: 1;
   visibility: visible;
}

.filter-categories {
   text-align: left;
}

.filter-categories ul li {
   margin-bottom: 10px;
}

.filter-categories ul li span {
   cursor: pointer;
   background: white;
   display: inline-block;
   border-bottom: 1px solid #d5d5d5;
   padding: 8px 16px;
}

.filter-categories ul li.active span {
   background: #f69730;
   color: white;
   border-bottom: 1px solid #e97e0a;
}

.projects-holder .mix {
   display: none;
}

div.load-more {
   text-align: center;
   display: block;
}

div.load-more a.load-more {
   font-family: "Roboto", sans-serif;
   text-transform: uppercase;
   font-weight: 600;
   color: #2c2c2c;
   background: white;
   display: block;
   padding: 14px 20px;
   border-bottom: 1px solid #d5d5d5;
}

div.load-more a.load-more:active {
   border-bottom: 0;
}



.sectino-intro {
   margin: 0 auto 55px;
   text-align: center;
}

.section-heading {
   font-size: 25px;
   line-height: 28px;
   margin-bottom: 45px;
   position: relative;
   text-transform: uppercase;
   z-index: 1;
}

.section-heading::after {
   background-image: url("../images/gr-line-bg.png");
   background-position: center bottom;
   background-repeat: no-repeat;
   content: "";
   height: 100%;
   left: 0;
   position: absolute;
   top: 33px;
   width: 100%;
}

.sectino-intro>p {
   font-size: 16px;
   line-height: 26px;
   letter-spacing: 2px;
}

.grey-bg {
   background-color: #ffffff;
}

/* 分页 */
.fanye {

   text-align: center;
   margin: 50px 0 20px 0;

}

.fanye a {
   border: #bbb solid 1px;
   padding: 0px 15px;
   font-size: 14px;
   color: #666;
   line-height: 36px;
   display: inline-block;
   border-radius: 5px;
   margin: 0 1px;
}

.fanye span a {
   margin: 2px 2px;
   padding: 0 20px;
}

.fanye span .current {
   color: white;
   background-color: rgba(0, 121, 254, 1);
   border: rgba(0, 121, 254, 1) solid 1px;
}

.fanye a:hover {
   color: white;
   background-color: rgba(0, 121, 254, 1);
   border: rgba(0, 121, 254, 1) solid 1px;
}

.zy_xqtitle {
   margin-top: 40px;
}

/*左边菜单栏新闻  */
.seo-sidebar li {
   height: 50px;
   border-bottom: 1px solid rgba(228, 228, 228, 1);
   text-align: center;
   line-height: 50px;
   color: #999999;
}

.seo-sidebar li:first-child {
   height: 50px;
   border-top: 1px solid rgba(228, 228, 228, 1);
   text-align: center;
   line-height: 50px;
}

.wrapper li:hover {
   color: rgb(0, 121, 254);
   background-color: #f3f6f8
}

.wrapper li:hover a {
   color: rgb(0, 121, 254);
   background-color: #f3f6f8
}

.nav-box .action {
   color: rgb(0, 121, 254);
   background-color: #f3f6f8
}

.wrapper li:before {
   content: "● ";
   color: #999999;
   /* color: rgb(0, 121, 254); */
}

.wrapper li:before :hover {
   content: "● ";
   color: rgb(0, 121, 254);
}

.newsinfo-sidebar {
   /* height: 250px; */
   border-bottom: 1px solid rgba(228, 228, 228, 1);
   text-align: left;

   color: #999999;
}

.newsinfo-sidebar li {
   border-bottom: 1px solid rgba(228, 228, 228, 1);
   text-align: left;
   color: #999999;
}

.newsinfo-sidebar li:first-child {

   border-top: 1px solid rgba(228, 228, 228, 1);
   text-align: center;

}

.newsinfowrapper li:hover {
   color: rgb(0, 121, 254);
   background-color: #f3f6f8
}

.wrapper li:hover:before {
   content: "● ";
   color: rgb(0, 121, 254);
}



.newsinfowrapper li .newstitle {
   font-size: 18px;
   font-family: 微软雅黑;
   font-weight: 400;
   color: #333333;
   text-align: left;
   margin-top: 10px;
}

.newsinfowrapper li .newscontent {
   font-size: 14px;
   font-family: 微软雅黑;
   font-weight: 400;
   color: #999999;
   text-align: left;
   margin-top: 10px;
}

.newsinfowrapper li:hover .newscontent,
.newsinfowrapper li:hover .newstitle {
   color: rgb(0, 121, 254);
   background-color: #f3f6f8
}

.seo-sidebar .action {
   background-color: #f3f6f8;

}

.seo-sidebar .action:before {
   content: "● ";
   color: rgb(0, 121, 254);
}

.seo-sidebar .action a {
   color: rgb(0, 121, 254);
}

/*右边边菜单栏新闻  */
.our-news-area div {
   margin-bottom: 20px;
}

.pop-cat-date {
   width: 69px;
   height: 60px;
   border: 1px solid #ededed;
   text-align: center;
   float: left;
   margin-top: 20px;

}

.pop-cat-date .year {
   font-size: 20px;
   line-height: 28px
}

.pop-cat-date .year {
   padding-top: 25px;
   font-size: 20px;
   color: #666;
   font-weight: 400;
}

.pop-cat-date .date {
   font-size: 16px;
   color: #999;
   text-align: center;
   font-weight: 400;
}

.pop-cat-content {
   margin-top: 20px;
}

.pop-cat-content h4 {
   font-size: 16px;
   line-height: 28px;
}

.pop-cat-content span {
   font-size: 16px;
   margin-top: 0px;
   font-size: 13px;
}

.cause-news {
   height: 250px;
}

.cause-news img {
   height: 250px;
   width: 100%;
}

.news-cat-date {
   width: 90px;

   border: 1px solid #ededed;
   text-align: center;
   float: left;

}

.news-cat-date .bot {
   width: 88px;
   height: 40px;
   display: block;
   background: rgba(242, 242, 242, 1);
   margin-top: 5px;
   line-height: 40px;
}

.news-cat-date .year {

   font-size: 24px;
   color: #666;
   font-weight: 400;
}

.news-cat-date .date {
   font-size: 20px;
   color: #999;
   text-align: center;
   font-weight: 400;
}

.news-cat-date .date2 {
   font-size: 20px;
   color: #999;
   text-align: center;
   font-weight: 400;
}

.zy_xxjs h3 {
   font-size: 20px;
   font-weight: 700;
   font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';
   line-height: 60px;
   color: #666666;
   border-bottom: 1px solid rgba(228, 228, 228, 1);
}

.zy_content {
   margin-top: 20px;
}

.zy_content p {
   font-size: 14px;
   color: #999999;
   text-align: left;
   text-indent: 2em;
}

.our-newsinfo-area {}

.wrapper h2 {
   display: inline-block;
   font-size: 20px;
   color: #333;
   position: relative;
   line-height: 30px;
   padding-bottom: 6px;
}

.wrapper h2 i {
   position: absolute;
   left: 0;
   bottom: 0;
   width: 50%;
   height: 3px;
   background-color: #3385cc;
}

.botnext {
   width: 100%;
}

.botbot {
   width: 47%;
   float: left;
   background-color: rgba(242, 242, 242, 1);
   height: 100px;
   border-left: 5px solid rgba(228, 228, 228, 1)
}

.botop {
   width: 47%;
   float: right;
   background-color: rgba(242, 242, 242, 1);
   height: 100px;
   border-left: 5px solid rgba(228, 228, 228, 1)
}

.botnext div a {
   margin: 18px;
   display: block;
}

.botnext div a {
   margin: 18px;
   display: block;
}

.botnext p {
   font-size: 17px;
}

.botnext span {
   font-size: 22px;
}

.botbot:hover,
.botop:hover {
   background: #3385cc;

}

.botbot:hover a,
.botop:hover a {
   color: #ffffff;
   font-weight: 500
}

/* 典型案例 */
.products-div div h2 {
   line-height: 50px;
}

.products-div div h3 {
   line-height: 1.5;
}

.our-news-area div {
   margin-bottom: 10px;
}

.products-div {
   margin-top: 0;
}

.img-rounded-div img {
   height: 100%;
   width: 100%;
}

.img-rounded-div {
   height: 240px;
}

.nav-head {
   box-sizing: border-box;
   transform: rotateX(0deg);
   transform-origin: center bottom;
   transition: all 0.8s;

}

.nav-rotate {
   transform: rotateX(120deg);
   box-shadow: 0px 0px 0px rgba(153, 153, 153, 0.2);
}

.nav-rotate h3 {
   display: none;
   transition: all 0.8s;
}

.nav-head h1,
.nav-head h3 {
   color: #000;
}

.nav-left h3,
.nav-left h1 {
   color: #fff;
}

.tfnINfo a:hover {
   color: #3385cc;

}

.tfnINfo .active:hover {
   color: #ffffff;
}

.font28 {
   font-size: 28px;
}

.textleft {
   text-align: left;
   text-indent: 2em;
}

#video .case {
   margin: 0 auto;
   width: 100%;
}

#video .case li {
   display: inline-block;
   width: 25%;
   position: relative;
   padding-right: 15px;
   padding-left: 15px;
   box-sizing: border-box;
}

#video .case li .case_w {
   width: 100%;
   padding-left: 0;
   padding-right: 0;
   position: relative;
   overflow: hidden;
}

#video .case li .case_w .case_w-img {
   width: 100%;
   height: 150px;
   display: block;
}

#video .case li .case_w .fire {
   background: #000;
   opacity: 0;
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   bottom: 0;
   z-index: 1;
   text-align: center;
   transition: .2s;
   overflow: hidden;
}

#video .case li:hover .case_w .fire {
   opacity: .7;
}

#video .case li .case_w .x {
   width: 100px;
   height: 100px;
   position: absolute;
   top: 50%;
   left: 50%;
   margin-left: -50px;
   margin-top: -50px;
   z-index: 2;
   background: url(../images/zoom-icon.png);
}

.case_w-block2 {
   top: 390px;
}
.main50px {
   margin-top: 80px
}