Team:BIT-China/css/page/homeTemp0929

@import url(http://cdn.bootcss.com/font-awesome/4.6.3/css/font-awesome.min.css);

/*************************************/

@font-face {

   font-family: 'Roboto';
   font-style: normal;
   font-weight: 100;
   src: local('Roboto Thin'), local('Roboto-Thin'),
   url(http://fonts.gstatic.com/s/roboto/v15/vzIUHo9z-oJ4WgkpPOtg13YhjbSpvc47ee6xR_80Hnw.woff) format('woff');

}

.page-title{

   font-family: 'Roboto',san-serif;
   font-size: 50px;color: white;
   display: block;
   height: 200px;
   line-height: 200px;
   background: rgba(20,41,60,0.7);
   position:absolute;text-align: center;left: 0;

}

.top-title{

   font-size:48px;
   font-weight: bold;
   color:#141d3d;

}

.panel-title a{

   display:block;
   padding:20px 20px 20px 20px;
   color:#FFF !important;
   font-size:18px;
   font-weight:500;

}

.accordion-light .panel-title a{

   display:block;
   padding:20px 20px 20px 20px;
   color:#666 !important;
   font-size:18px;
   font-weight:500;

}

/**************************************************/

.home-nav-wrapper{

   padding: 60px 0 30px 0;

}

.home-services-2, .home-services-3{

   margin-bottom:40px;
   overflow-x: hidden;

}

.bottom-title{

   color:#5c6873 !important;
   font-size:16px;
   margin-bottom:40px;
   /*font-family: 'Raleway', sans-serif !important;*/

} .bottom-title b, .bottom-title-white b, .post-bottom-title-white b, .post-bottom-title b {

   font-family: 'Raleway', sans-serif !important;
   font-weight: 700;

}

.margin-bottom-10{

   margin-bottom:10px !important;

}

.hs3-link{

   font-size:17px;
   color:#68C3A3;

}

.hs3-link:hover{

   color:#eb5d68 !important;

}

.hs3-link i{

   margin-left:10px;

}

.homepg-icon, .homepg-icon-2, .homepg-icon-3{

   margin-right:10px;
   /*color:#68C3A3;*/
   /*color: #141d3d;*/
   color:rgb(237,111,0);

}

.homepg-icon-2{

   font-size:40px !important;

}

.header-xsmall, .header-xsmall a {

   font-size:22px;
   font-weight:bold;

}

/************************************************************************/

/*---------------------------------*/ /* 23. COUNTER STYLES */ /*---------------------------------*/

.bg-overlay-dark {

   background: rgba(51,51,51,0.8);

} .bg-overlay {

   overflow: hidden;
   height: 100%;
   z-index: 2;
   padding: 70px 0;

}

.text-white-center{

   color:#FFF !important;
   text-align:center !important;

}

.counter-wrapper{

   margin:10px auto 10px auto;
   width:200px;
   height:200px;
   border-radius:100px;
   -moz-border-radius: 100px;
   -webkit-border-radius: 100px;
   border:6px solid #EEE;
   color:#EEE;
   font-size:45px;
   text-align:center;
   line-height:190px;

}

.counter-wrapper-gray{

   border:3px solid #666;
   color:#666 !important;

}

.counter-wrapper-green{

   border:4px solid #68C3A3;

}

.counter-wrapper-green-2{

   border:4px solid #68C3A3;
   color:#666;

}

.counter-wrapper-red{

   border:4px solid #eb5d68 ;

}

.counter-wrapper-blue{

   border:4px solid #3498DB ;

}

.counter-wrapper-bg-dark{

   background-color:#666;

}

.counter-wrapper-bg-green{

   background-color:#68C3A3;
   color:#FFF;

}

.counter-wrapper-bg-blue{

   background-color:#3498DB;
   color:#FFF;

}

.counter-wrapper-bg-red{

   background-color:#eb5d68;
   color:#FFF;

}

.counter-header{

   margin-bottom:50px;

}

.counter-text-white{

   font-family: 'Raleway', sans-serif;
   text-align:center;
   color:#EEE;
   padding:0 40px 0 40px;

}

.counter-text-2{

   text-align:center;
   padding:0 40px 0 40px;

}

/*---------------------------------------------*/ /* 30. CONTACT PAGE & CONTACT FOOTER STYLES */ /*---------------------------------------------*/

.contact, .contact2, .contact3{

   background-color:#FFF;
   border:1px solid #E5E5E5;
   padding:20px 15px;
   margin-left:auto;
   margin-right:auto;

}

.contact-header-bg{

   background-color:#666;
   color:#FFF;
   padding:8px 15px 8px 15px;
   display:inline-block;
   font-size:16px;
   margin:0 0 10px 0;

}

.contact hr, .contact2 hr, .contact3 hr{

   margin-top:10px;

}

.contact h4, .contact2 h4, .contact3 h4{

   margin-top:20px;

}

.contact-map-area{

   width:100%;
   margin-bottom:20px;
   overflow:hidden;
   height:250px;
   border:1px solid #E5E5E5;

}

.contact-map-area2, .contact-map-area3{

   width:100%;
   margin-bottom:20px;
   overflow:hidden;
   height:350px;
   border:1px solid #E5E5E5;

}

.contact-info ul{

   margin:20px 0 0 0;
   padding:0;

}

.contact-info ul li{

   list-style:none;
   margin-bottom:15px;

}

.contact-info ul li i{

   margin-right:20px;
   font-size:18px;
   color:#666;

}

.contact-form-area{

   background-color:#F5F5F5;
   padding:45px 10px;
   border:1px solid #DDD;

}

.contact-form-area2, .contact-form-area3{

   background-color:#F5F5F5;
   padding:20px 10px;
   border:1px solid #DDD;

}

.contact-form3{

   margin-top:40px;

}

.contact-onepage-light{

   background-color:#F7F7F7 !important;

}

.contact-onepage-light h3{

   color:#3f444a !important;

}

.contact-onepage-light p, .contact-onepage-light a{

   color:#5c6873 !important;

}

.contact-onepage p, .contact-onepage li, .contact-onepage a{

   color:#888 !important;
   font-size:16px;

}

.contact-onepage{

   padding:80px 0 !important;

}

.contact-onepage i{

   color:#AAA !important;

}

.contact-one-page-form-area button{

   margin-top:20px;

}

.contact-one-page-form-area input, .contact-one-page-form-area textarea{

   background-color:#333;
   border:1px solid #444;
   color:#DDD;

}

.onepage-footer{

   padding:40px 0 25px 0;
   background-color:#282828;

}

.onepage-footer p{

   color:#777;

}

.op-contact-social{

   float:right;

}

.op-contact-social li{

   display:inline-block;
   list-style:none;
   padding:10px;
   background-color:#333;
   margin-left:10px;
   width:40px;
   height:40px;
   text-align:center;
   -moz-transition: all 0.3s;
   -webkit-transition: all 0.3s;
   -ms-transition: all 0.3s;
   -o-transition: all 0.3s;

}

.op-contact-social li:hover{

   background-color:#555;

}

.op-contact-social li a{

   font-size:18px;
   color:#666;
   -moz-transition: all 0.3s;
   -webkit-transition: all 0.3s;
   -ms-transition: all 0.3s;
   -o-transition: all 0.3s;

}

.op-contact-social li:hover a{

   color:#FFF;

}

.btn1-md{

   font-size:14px;
   padding:6px 20px;
   line-height:25px;

} .btn1-default, .btn1-blue, .btn1-red, .btn1-orange, .btn1-dark, .btn1-white{

   font-size:14px;
   color:#FFF;
   text-align:center;
   padding:5px 20px;
   border:none;
   margin:5px 0 5px 0;
   -moz-transition: all 0.3s;
   -webkit-transition: all 0.3s;
   -ms-transition: all 0.3s;
   -o-transition: all 0.3s;
   line-height:25px;
   border-radius:2px;

}

.contact-page{

   padding-top: 20px;
   /*padding-bottom: 20px;*/

}

/****************/ /******导航栏样式*********/ /*** Header and header elements

• • • /

.header {

   /*box-shadow: 0 5px 7px #CA01F9;*/

   box-shadow: 0 5px 7px #620053;
   /*background: #fff;*/
   border-radius: 0;
   /*margin-bottom: 23px;*/
   /*z-index: 999;*/
   position: relative;
   -webkit-transition: all ease-in-out 0.2s;
   -moz-transition: all ease-in-out 0.2s;
   -ms-transition: all ease-in-out 0.2s;
   -o-transition: all ease-in-out 0.2s;
   transition: all ease-in-out 0.2s;

}

.roll-nav{

   z-index: 3;
   padding: 0;
   position: fixed;
   background: url();
   /*background:  url(../img/top_bg.jpg);*/
   margin-top: -10px;

   -webkit-transition: all ease-in-out 0.2s;
   -moz-transition: all ease-in-out 0.2s;
   -ms-transition: all ease-in-out 0.2s;
   -o-transition: all ease-in-out 0.2s;
   transition: all ease-in-out 0.2s;

   -webkit-box-shadow: -4px 3px 0px 0px rgba(0, 0, 0, 0.2);
   -moz-box-shadow: -4px 3px 0px 0px rgba(0, 0, 0, 0.2);
   box-shadow: -4px 3px 0px 0px rgba(0, 0, 0, 0.2);

}

.roll-nav-hide{

   -webkit-transform: translateY(-500px);
   -moz-transform: translateY(-500px);
   -ms-transform: translateY(-500px);
   -o-transform: translateY(-500px);
   transform: translateY(-500px);

}

.home-img{

   padding-left: 200px;padding-right: 200px;

}

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

   .home-img{
       padding-left: 100px;padding-right: 100px;
   }

}

.site-logo{

   float: left;
   padding-left: 10px;

}

/* 导航栏 */ .header-navigation {

   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-size: 18px;
   font-weight: bold;
   margin: 0 10px 0 0;
   padding: 0;
   float: left;
   /*text-transform: uppercase;*/

   /*background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(216,209,183, 0.2)), to(rgba(237,111,0, 0.2)));*/
   /*background-image: -webkit-linear-gradient(top, rgba(216,209,183, 0.2), rgba(237,111,0, 0.2));*/
   /*background-image:    -moz-linear-gradient(top, rgba(216,209,183, 0.2), rgba(237,111,0, 0.2));*/
   /*background-image:      -o-linear-gradient(top, rgba(216,209,183, 0.2), rgba(237,111,0, 0.2));*/
   /*background-image:         linear-gradient(to bottom, rgba(216,209,183, 0.2), rgba(237,111,0, 0.2));*/

} .header-navigation ul {

   margin: 0;
   padding: 0;
   list-style: none;

} .header-navigation > ul > li {

   float: left;
   padding:0 10px;
   /*box-shadow: 5px 0 rgba(216,209,183, 0.2);*/

}

.header-navigation > ul > li:last-child{

   box-shadow: none;

}

.header-navigation > ul > li > a {

   /*color: #333;*/
   user-select: none;
   -ms-user-select: none;
   -moz-user-select: none;
   -webkit-user-select: none;

   /*color: rgb(136, 41, 129);*/
   color: #FFFFFF;
   height:86px;
   display: block;
   padding: 29px 0.5em 30px;
   font-size: 14px;
   /*padding: 2em 1em 2em;*/

}

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

   .header-navigation > ul > li{
       padding: 0;
   }

}

/*.header-navigation > ul >li >a:after{*/

   /*content: '\e828';*/
   /*position: absolute;*/
   /*right: 10px;*/
   /*top: 50%;*/

/*}*/

.header-navigation ul > li.active > a, .header-navigation ul > li > a:hover, .header-navigation ul > li > a:focus, .header-navigation ul > li.open > a, .header-navigation ul > li.open > a:hover, .header-navigation ul > li.open > a:focus {

   /*color: rgb(136, 41, 129);*/
   color: #FFFFFF;
   text-decoration: none;
   display: block;
   background:rgba(20,41,60,0.3);

} .header-navigation ul > li.active > a {

   background: rgba(47,47,47,0.3);
   border-bottom: 2px solid #e64f00;

}

/* 下拉菜单*/ .header-navigation .tabdown-menu {

   left: auto;
   top: 80px;
   padding: 0;
   position: absolute;
   border: none;
   text-transform: none;
   letter-spacing: 0;
   border-radius: 0;

   z-index: 5;

   /*perspective*/
   -webkit-perspective: 400px;
   -moz-perspective: 400px;
   -ms-perspective: 400px;
   -o-perspective: 400px;
   perspective: 400px;

}

.header-navigation .tabdown-menu:before, .header-navigation .tabdown-menu:after {

   display: none !important;

} .header-navigation > ul > li > .tabdown-menu {

   /*border-top: solid 3px transparent;*/
   /*z-index: 1001;*/
   /*background: url(../img/footer_bg.jpg);*/
   background: url();

}

/*/!*hover产生的小三角形效果*!/*/ /*.header-navigation > ul > li.tabdown:hover > a:after ,.header-navigation > ul > li.tabdown:focus > a:after {*/

   /*/!*bottom: 0;*!/*/

   /*top: 80px;*/
   /*width: 0;*/
   /*height: 0;*/
   /*z-index: 1002;*/
   /*content: " ";*/
   /*display: block !important;*/
   /*position: absolute;*/
   /*border-bottom: 8px solid #e6400c;*/
   /*border-right: 8px solid transparent;*/
   /*border-left: 8px solid transparent;*/

   /*/!*延迟动画*!/*/
   /*-webkit-transition: opacity .4s, -webkit-transform .5s;*/
   /*-moz-transition: opacity .4s, -moz-transform .5s;*/
   /*-ms-transition: opacity .4s, -ms-transform .5s;*/
   /*-o-transition: opacity .4s, -o-transform .5s;*/
   /*transition: opacity .4s, transform .5s;*/

/*}*/

/*首个选项顶部红色*/ .header-navigation .tabdown-menu > li:first-child {

   border-top: solid 2px #692117;

}

/*离开页面*/ .tabdown > .tabdown-menu{

   -webkit-transform: translateX(1000%);
   -moz-transform: translateX(1000%);
   -ms-transform: translateX(1000%);
   -o-transform: translateX(1000%);
   transform: translateX(1000%);
   /*display: none;*/

} .tabdown:focus > .tabdown-menu,.tabdown:hover > .tabdown-menu{

   /*display: block;*/
   -webkit-transform: translateX(0);
   -moz-transform: translateX(0);
   -ms-transform: translateX(0);
   -o-transform: translateX(0);
   transform: translateX(0);

}

.header-navigation .tabdown-menu li {

   padding: 0;
   margin: 0;
   border-bottom: solid 2px #efefef;
   position: relative;
   display:block;
   float: none;

   /*初始状态*/
   opacity: 0;

   -webkit-transform: rotateY(90deg);
   -moz-transform: rotateY(90deg);
   -ms-transform: rotateY(90deg);
   -o-transform: rotateY(90deg);
   transform: rotateY(90deg);

   -webkit-transition: opacity .4s, -webkit-transform 0.3s;
   -moz-transition: opacity .4s, -moz-transform 0.3s;
   -ms-transition: opacity .4s, -ms-transform 0.3s;
   -o-transition: opacity .4s, -o-transform 0.3s;
   transition: opacity .4s, transform 0.3s;

}

.header-navigation > ul >li:hover .tabdown-menu li,.header-navigation > ul >li:focus .tabdown-menu li{

   /*显示各个子菜单*/
   opacity: 1;

   -webkit-transform: none;
   -moz-transform: none;
   -ms-transform: none;
   -o-transform: none;
   transform: none;

}

.header-navigation .tabdown-menu li:last-child {

   border: none;

} .header-navigation .tabdown-menu li > a {

   padding: 10px 20px;
   display: block;
   font-weight: 400;
   /*color: #767f88;*/

   /*background: #fff;*/
   color:#eeeeee;
   text-shadow: 1px 2px 5px #692117;
   /*background: #333f50;*/
   box-shadow: 2px 2px rgba(20, 29, 61, 0.3);

}

/*二级菜单a标签hover效果*/ .header-navigation .tabdown-menu > li > a:hover, .header-navigation .tabdown-menu > li.active > a, .header-navigation .header-navigation-content .header-navigation-col li > a:hover, .header-navigation .header-navigation-content .header-navigation-col li.active > a {

   /*background: #e6400c;*/
   /*background-color: rgb(20, 29, 61);*/
   color: #fff;

}

/* 特殊导航 多分栏 —————————— 暂时弃用*/ .header-navigation-content {

   padding: 20px 30px;
   min-width: 600px;

} .header-navigation-content .header-navigation-col {

   padding: 0;

} .header-navigation-content h4, .ecommerce .header-navigation-content h4 {

   font: bold 15px 'Open Sans', Arial, sans-serif;
   margin: 0 0 6px;
   padding: 10px 10px 5px;
   border-bottom: solid 1px #f0f0f0;

} .header-navigation-content ul {

   padding: 0;
   margin: 0 0 10px;
   list-style: none;

} .header-navigation-content li {

   padding: 0;
   border: none !important;

} .header-navigation-content li > a {

   display: block;

}

/*菜单渐显和渐隐效果*/ /****************************************/ .header-navigation > ul >li:hover .tabdown-menu li:nth-child(1), .header-navigation > ul >li:focus .tabdown-menu li:nth-child(1) {

   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -ms-transition-delay: 0s;
   -o-transition-delay: 0s;
   transition-delay: 0s;

} .header-navigation > ul >li:hover .tabdown-menu li:nth-child(2), .header-navigation > ul >li:focus .tabdown-menu li:nth-child(2) {

   -webkit-transition-delay: 50ms;
   -moz-transition-delay: 50ms;
   -ms-transition-delay: 50ms;
   -o-transition-delay: 50ms;
   transition-delay: 50ms;

} .header-navigation > ul >li:hover .tabdown-menu li:nth-child(3), .header-navigation > ul >li:focus .tabdown-menu li:nth-child(3) {

   -webkit-transition-delay: 100ms;
   -moz-transition-delay: 100ms;
   -ms-transition-delay: 100ms;
   -o-transition-delay: 100ms;
   transition-delay: 100ms;

} .header-navigation > ul >li:hover .tabdown-menu li:nth-child(4), .header-navigation > ul >li:focus .tabdown-menu li:nth-child(4) {

   -webkit-transition-delay: 150ms;
   -moz-transition-delay: 150ms;
   -ms-transition-delay: 150ms;
   -o-transition-delay: 150ms;
   transition-delay: 150ms;

} .header-navigation > ul >li:hover .tabdown-menu li:nth-child(5), .header-navigation > ul >li:focus .tabdown-menu li:nth-child(5) {

   -webkit-transition-delay: 200ms;
   -moz-transition-delay: 200ms;
   -ms-transition-delay: 200ms;
   -o-transition-delay: 200ms;
   transition-delay: 200ms;

} .header-navigation > ul >li:hover .tabdown-menu li:nth-child(6), .header-navigation > ul >li:focus .tabdown-menu li:nth-child(6) {

   -webkit-transition-delay: 250ms;
   -moz-transition-delay: 250ms;
   -ms-transition-delay: 250ms;
   -o-transition-delay: 250ms;
   transition-delay: 250ms;

} .header-navigation > ul >li:hover .tabdown-menu li:nth-child(7), .header-navigation > ul >li:focus .tabdown-menu li:nth-child(7) {

   -webkit-transition-delay: 300ms;
   -moz-transition-delay: 300ms;
   -ms-transition-delay: 300ms;
   -o-transition-delay: 300ms;
   transition-delay: 300ms;

} .header-navigation > ul >li:hover .tabdown-menu li:nth-child(8), .header-navigation > ul >li:focus .tabdown-menu li:nth-child(8) {

   -webkit-transition-delay: 350ms;
   -moz-transition-delay: 350ms;
   -ms-transition-delay: 350ms;
   -o-transition-delay: 350ms;
   transition-delay: 350ms;

}

.tabdown-menu li:nth-child(1) {

   -webkit-transition-delay: 350ms;
   -moz-transition-delay: 350ms;
   -ms-transition-delay: 350ms;
   -o-transition-delay: 350ms;
   transition-delay: 350ms;

} .tabdown-menu li:nth-child(2) {

   -webkit-transition-delay: 300ms;
   -moz-transition-delay: 300ms;
   -ms-transition-delay: 300ms;
   -o-transition-delay: 300ms;
   transition-delay: 300ms;

} .tabdown-menu li:nth-child(3) {

   -webkit-transition-delay: 250ms;
   -moz-transition-delay: 250ms;
   -ms-transition-delay: 250ms;
   -o-transition-delay: 250ms;
   transition-delay: 250ms;

} .tabdown-menu li:nth-child(4){

   -webkit-transition-delay: 200ms;
   -moz-transition-delay: 200ms;
   -ms-transition-delay: 200ms;
   -o-transition-delay: 200ms;
   transition-delay: 200ms;

} .tabdown-menu li:nth-child(5) {

   -webkit-transition-delay: 150ms;
   -moz-transition-delay: 150ms;
   -ms-transition-delay: 150ms;
   -o-transition-delay: 150ms;
   transition-delay: 150ms;

} .tabdown-menu li:nth-child(6) {

   -webkit-transition-delay: 100ms;
   -moz-transition-delay: 100ms;
   -ms-transition-delay: 100ms;
   -o-transition-delay: 100ms;
   transition-delay: 100ms;

} .tabdown-menu li:nth-child(7){

   -webkit-transition-delay: 50ms;
   -moz-transition-delay: 50ms;
   -ms-transition-delay: 50ms;
   -o-transition-delay: 50ms;
   transition-delay: 50ms;

} .tabdown-menu li:nth-child(8){

   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -ms-transition-delay: 0s;
   -o-transition-delay: 0s;
   transition-delay: 0s;

}

/*顶部子导航*/

.sub-top-nav{

   -webkit-transition: all ease-in-out 0.2s;
   -moz-transition: all ease-in-out 0.2s;
   -ms-transition: all ease-in-out 0.2s;
   -o-transition: all ease-in-out 0.2s;
   transition: all ease-in-out 0.2s;

}

.sub-top-hide{

   -webkit-transform: translateX(-100%);
   -moz-transform: translateX(-100%);
   -ms-transform: translateX(-100%);
   -o-transform: translateX(-100%);
   transform: translateX(-100%);

}

.sub-top-nav-left{

   margin: 5px;
   padding: 2px;
   color: white;
   display: table;

}

.sub-top-nav-left span{

   font-size: 18px;
   display: table-cell;
   vertical-align: middle;

}

.sub-top-nav-right {

   color: white;
   margin: 5px;
   padding: 2px;
   display: table;
   font-size: 12px;

}

.sub-top-nav-right span{

   display: table-cell;
   vertical-align: middle;

}

1. sub-top-nav-right .nav-divider{

   display: inline-block;
   position: relative;
   margin: 0 0.85em 0 1.1em;
   vertical-align: top;
   text-align: center;

}