/* ==========================================================================
   Base Styles and Bootstrap Modifications
   ========================================================================== */

   html,
   button,
   input,
   select,
   textarea {
       color: #222;
   }

   body {
       font-size: 1em;
       line-height: 1.4;
       background: #F4F8FA;
   }

   /*
    * Remove text-shadow in selection highlight: h5bp.com/i
    * These selection rule sets have to be separate.
    * Customize the background color to match your design.
    */
/*
   ::-moz-selection {
       background: #f2c2c9;
       color: #a4003a;
       text-shadow: none;
   }

   ::selection {
       background: #16a085;
       color: #a4003a;
       text-shadow: none;
   } */

   /*
    * A better looking default horizontal rule
    */

    hr {
       display: block;
       height: 1px;
       border: 0;
       border-top: 1px solid #ccc;
       margin: 1em 0;
       padding: 0;
   }

   /*
    * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
    */

    img {
       vertical-align: middle;
   }

   .copyrights{
     text-indent:-9999px;
     height:0;
     line-height:0;
     font-size:0;
     overflow:hidden;
   }

   /*
    * Allow only vertical resizing of textareas.
    */

    textarea {
       resize: vertical;
   }


   /* ==========================================================================
      General styles
      ========================================================================== */

   html,
   body {
       height: 100%;
   }

   body {
       font-family: "Lato";
       font-weight: 300;
       font-size: 16px;
       color: #555;

       -webkit-font-smoothing: antialiased;
       -webkit-overflow-scrolling: touch;
   }

   .col-md-4 {
     padding-bottom: 20px;
   }

   .row {
   margin-right: 0px;
   margin-left: -15px;
   }

   .modal-header {
     background: #3498db;
   }

   .modal-header h4 {
     color: white;
   }

   .modal-footer {
     background: #2b2b2b;
   }


   .navbar-default {
   border-color: transparent;
   background-color: #dadada;
   }


   .navbar-toggle {
   border-color: transparent;
   border: 0px solid transparent;
   }

   .navbar-default .navbar-nav > li > a:hover,
   .navbar-default .navbar-nav > li > a:focus {
     background-color: #16a085;
     color: white;
   }



   hr {
       position: relative;
       border: none;
   }

   hr:before {
       content: " ";
       position: absolute;
       top: 0;
       left: 25%;
       width: 50%;
       height: 2px;
       background: #ccc;
   }


   .odd a img {
       background: #f5f5f5;
   }

   /* Titles */
   h1, h2, h3, h4, h5, h6 {
       font-family: "Raleway";
       font-weight: 300;
       color: #333;
   }


   /* Paragraph & Typographic */
   p {
       line-height: 28px;
       margin-bottom: 25px;
   }

   .centered {
       text-align: center;
   }

   .paragraph-lead {
       font-size: 20px;
       color: #3498db;
   }

   strong {
       font-weight: 700;
   }

   em {
       font-weight: 300;
   }

   pre {
       background: #ebebeb;
       border: none;
       font-family: "Monaco";
       font-size: 16px;
       color: #666;
       padding: 20px;
       line-height: 28px;
   }

   small {
       font-size: 12px;
   }

   blockquote,
   blockquote p {
       line-height: 28px;
       color: #999;
       font-weight: 300;
       font-style: italic;
   }
   button,input,textarea{
     border: none;
     padding: 0;
     outline: none;
   }

   blockquote {
       position: relative;
       margin: 0 0 40px -30px;
       padding-left: 30px;
       border-left: 5px solid #3498db;
   }

   blockquote cite {
       position: absolute;
       bottom: -25px;
       right: 0;
       font-size: 12px;
       font-style: italic;
       color: #333;
       font-weight: 300;
   }

   blockquote cite:before {
       content: "-- "
   }

   /* Images */
   .overflow-image {
       margin-top: -65px;
   }

   /* Links */
   a {
       color: #3498db;
       word-wrap: break-word;

       -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
       -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
       -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
       -o-transition: color 0.1s ease-in, background 0.1s ease-in;
       transition: color 0.1s ease-in, background 0.1s ease-in;
   }

   a:hover,
   a:focus {
       text-decoration: none;
       outline: 0;
   }

   a:before,
   a:after {
       -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
       -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
       -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
       -o-transition: color 0.1s ease-in, background 0.1s ease-in;
       transition: color 0.1s ease-in, background 0.1s ease-in;
   }


   /* ==========================================================================
      Wrap Sections
      ========================================================================== */

   #headerwrap {
     position: relative;
     background: url(../img/bigimg.png) no-repeat center top;
     text-align:center;
     background-attachment: relative;
     background-position: center center;
     min-height: 500px;
     width: 100%;

       -webkit-background-size: 100%;
       -moz-background-size: 100%;
       -o-background-size: 100%;
       background-size: 100%;

       -webkit-background-size: cover;
       -moz-background-size: cover;
       -o-background-size: cover;
       background-size: cover;
   }
   .content_headerwarp{
    position: relative;
    background: url(../img/banner.png) no-repeat center top;
    text-align:center;
    background-attachment: relative;
    background-position: center center;
    min-height: 250px;
    width: 100%;

    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
   }
   #headerwrap2 {
    background-image: url(../img/head_img2.png);
   }
   #font1{
     text-align:center;
     font-size: 28px;
     color:#f5f5f5;
     /*font-family: Source Han Sans CN;*/
   }
   .line{
     border-bottom:1px double #D4DBDD;
     width: 90%;
     margin-left: 5%;
   }
   .font2{
     width: 100%;
     height: 10%;
   }
   #headerwrap img{
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%,-50%);
   }
   .content_headerwarp img{
     position: absolute;
     top: 66px;
     left: 50%;
     transform: translateX(-50%);
   }

   .ellipsis{
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
   }
   .ellipsis2{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
   }
   /* 通用详情页开始 */
   #export{
     background-color: #04A1E4;
   }
   .sidebar{
     float: left;
     padding: 20px 0;
     margin-top: -76px;
     height: 734px;
     width: 240px;
     background: url('../img/tab_bg.png')no-repeat;
     background-size: 100% 100%;
   }
   .sidebar_title{
     color: #fff;
     font-size: 28px;
     text-align: center;
     font-weight: bold;
   }
   .sidebar_nav{
     margin-top: 44px;
     padding: 0;
     padding-bottom: 10px;
     float: right;
     margin-right: 1px;
     width: 200px;
     background: linear-gradient(#04A1E4FF 0%,#0064BBFF 100%);
     list-style: none;
   }
   .sidebar_nav li{
     position: relative;
     height: 44px;
     line-height: 44px;
     border-bottom: 1px solid rgba(255, 255, 255, 0.4);
     cursor: pointer;
   }
   .sidebar_nav li p{
    line-height: 44px;
   }
   .sidebar_nav li::before{
     position: absolute;
     left: -13px;
     top: 0px;
     display: none;
     content: "";
     width: 14px;
     height: 44px;
     background: url('../img/nav_label.png')no-repeat;
     background-size: 100% 100%;
   }
   .sidebar_nav li:hover{
     background: #fff;
   }
   .sidebar_nav li:hover p{
     color: #20485A;
     font-weight: bold;
   }
   .sidebar_nav li:hover span{
     display: none;
   }
   .sidebar_nav li:hover img{
     display: block;
   }
   .sidebar_nav li:hover::before{
     display: block;
   }
   .sidebar_nav .active{
     background: #fff;
   }
   .sidebar_nav .active::before{
     display: block;
   }
   .sidebar_nav .active p{
     color: #20485A;
     font-weight: bold;
   }
   .sidebar_nav .active span{
     color: #20485A;
   }
   .sidebar_nav .active img{
     display: block;
   }
   .sidebar_nav li:last-child{
     border: none;
   }
   .sidebar_nav li p{
     margin: 0;
     color: #fff;
     font-size: 18px;
     text-align: center;
   }
   .sidebar_nav li span,.sidebar_nav li img{
     display: block;
     position: absolute;
     right: 10px;
     top: 50%;
     font-size: 12px;
     transform: translateY(-50%);
     color: #fff;
   }
   .sidebar_nav li img{
     display: none;
     width: 16px;
     height: 16px;
   }

   .content{
     margin-top: -16px;
     margin-bottom: 40px;
     float: left;
     width: calc(100% - 240px);
     background: #fff;
   }
   .content_title{
    position: relative;
    padding: 26px 0;
    text-align: center;
    color: #20485A;
    font-size: 26px;
    font-weight: bold;
    border-bottom: 1px solid #D4DBDD;
  }
  .content_title p{
    margin: 0 auto;
    width: 50%;
  }
   .backBtn{
     position: absolute;
     left: 0;
     top: 50%;
     transform: translateY(-50%);
     width: 90px;
     height: 36px;
     line-height: 36px;
     text-align: center;
     background: #EAF0F4;
     color: #0064BB;
     font-size: 14px;
     cursor: pointer;
   }
   .backBtn .iconBack{
     margin-right: 4px;
     font-size: 12px;
   }
   .backBtn:hover{
     background-color: #04A1E4;
     color: #fff;
   }
   .content_wap{
     min-height: 596px;
     padding: 22px 80px;
     font-size: 16px;
     color: #20485A;
     border-bottom: 1px solid #D4DBDD;
   }
   .content_wap img{
     max-width: 100%;
     height:auto;
   }
   .content_footer{
     padding: 24px 0;
     overflow: hidden;
   }
   .content_footer a:hover button{
    background: #0064BB;
    color: #fff;
   }
   .content_footer a:hover p{
     color: #0064BB;
   }
   .prev_page{
     float: left;
   }
   .next_page{
    float: right;
  }

   .prev_page button,.next_page button{
     display: inline-block;
     margin-right: 10px;
     width: 72px;
     height: 32px;
     line-height: 32px;
     text-align: center;
     background: #E2F0F2;
     color: #0E6EB8;
   }
   .next_page button{
    margin-left: 10px;
    margin-right: 0;
   }
   .prev_page p,.next_page p{
     margin-bottom: 0;
     display: inline-block;
     vertical-align: middle;
     color: #71767C;
     font-size: 16px;
   }

  /* 通用详情页结束 */
  /* 通用列表页开始 */
  .content_list_title{
    height: 78px;
    line-height: 78px;
    text-align: left;
    color: #20485A;
    font-size: 26px;
    font-weight: bold;
    border-bottom: 1px solid #D4DBDD;
  }
  .content_list_title span{
    display: inline-block;
    height: 100%;
    border-bottom: 4px solid #04A1E4;
  }
  .content_list{
    min-height: 596px;
    padding: 22px 0;
    font-size: 16px;
    color: #20485A;
  }

  /* 通用列表页结束 */

  /* 专家库开始 */
      .specia_list{
        padding: 0;
        list-style: none;
      }
      .specia_item{
        margin-bottom: 40px;
        padding: 0 10px;
        text-align: center;
      }
      .specia_item img{
        width: 165px;
        height: 220px;
      }
      .specia_item p{
        margin: 0;
      }
      .specia_item .specia_name{
        margin-top: 14px;
        color: #20485A;
        font-size: 20px;
        font-weight: bold;
      }
      .specia_text{
        color: #71767C;
        font-size: 16px;
      }
      .specia_item button{
        margin-top: 18px;
        width: 100px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        background: #EAF0F4;
        color: #8597A3;
        font-size: 14px;
        padding: 0;
        outline: none;
        border: none;
      }
      .specia_item a:hover .specia_name{
        color: #0064BB;
      }
      .specia_item a:hover button{
        background: #0E6EB8;
        color: #fff;
      }
      .specia_wap{
        padding-left: 32px;
        padding-right: 32px;
      }
  /* 专家库结束 */

  /* 会员单位开始 */
      .container_grid{
        list-style: none;
        padding: 0;
      }
      .container_grid li{
        margin-bottom: 20px;
        padding: 0;
      }
      .container_grid li:nth-child(2n-1){
        padding-right: 10px;
      }
      .container_grid li:nth-child(2n){
        padding-left: 10px;
      }
      .container_grid li a{
        display: block;
        padding: 30px 24px;
        height: 190px;
        background: url('../img/grid_bg.png')no-repeat;
        background-size: 100% 100%;
      }
      .container_grid li a:hover p{
        color: #20485A;
      }
      .container_grid li a:hover .grid_title{
        color: #0E6EB8;
      }
      .container_grid li .grid_title{
        margin-bottom: 20px;
        color: #20485A;
        font-size: 24px;
        font-weight: bold;
      }
  /* 会员单位结束 */

  /* 协会领导开始 */
      .container_leader{
        list-style: none;
        padding: 0 12px;
        border-bottom: 1px solid #D4DBDD;
      }
      .container_leader li{
        overflow: hidden;
        padding: 28px 0 48px;
        border-bottom: 1px solid #D4DBDD;
      }
      .container_leader li:last-child{
        border: none;
      }
      .leader_img{
        padding: 0;
        overflow: hidden;
      }
      .leader_img img{
        width: 100%;
        transition: all 0.3s;
      }
      .leader_img:hover img{
        transform: scale(1.2);
      }
      .leader_name{
        margin-right: 10px;
        margin-bottom: 22px;
        color: #0064BB;
        font-size: 24px;
        font-weight: bold;
      }
      .leader_content{
        font-size: 16px;
        color: #20485A;
        line-height: 32px;
      }
      .leader_name span{
        color: #71767C;
        font-size: 16px;
        font-weight: lighter;
      }
  /* 协会领导结束 */

  /* 联系我们开始 */
      #container {width:100%; height: 400px; }
      .about_info{
        border: none;
      }
      .about_info_item{
        overflow: hidden;
        margin-top: 20px;
        color: #20485A;
        font-size: 20px;
      }
      .about_info_title,.about_info_value{
        float: left;
      }
      .about_info_value p{
        margin: 0;
      }
      .amap-icon img{
        width: 26px;
        height: 34px;
      }

  /* 联系我们结束 */

   #label{
     background-color: #f5f5f5;
     width: 80%;
     height: 10%;
     margin-left: 20%;
     margin-right: 20%;
     margin-top: 20%;
     position: absolute;
   }
   #headerwrap h1 {
     color:#ffffff;
     margin-top: 90px;
     padding-bottom: 30px;
     letter-spacing: 8px;
     font-size: 100px;
     font-weight: bold;
     text-shadow: 2px 2px 2px #000;
   }
   #homepage{
     background-color: #f5f5f5;
     width: 60%;
     height: 80%;
     position: absolute;
     margin-left: 28%;
     margin-top: -2%;
   }
   #headerwrap p {
     color:#ffffff;
     font-size: 40px;
     font-weight: 400;
     text-align: center;
     line-height: 40px;
     letter-spacing: 3px;
     margin-left: 15px;
     text-shadow: 1px 1px 1px #000;
   }

   #greywrap {
     background: #f5f5f5;
     margin-top: 0px;
     padding-top: 40px;
     border-bottom: 1px solid #ddd;
   }

   #greywrap .callout {
     margin-bottom: 20px;
   }

   #greywrap p {
     margin-left: 30px;
     margin-right: 30px;
     letter-spacing: 1px;
     padding-top: 15px;
     padding-bottom: 15px;
   }

   #greywrap .icon {
     font-size: 60px;
     line-height: 30px;
     margin-bottom: 10px;
   }

   #footerwrap {
     background: #2b2b2b;
     margin-top: 0px;
     padding-top: 40px;
     padding-bottom: 20px;
     border-bottom: 1px solid #ddd;
     text-align: center;
   }

   #footerwrap h4 {
     color: white;
   }



   /* ==========================================================================
      MEDIA QUERIES
      ========================================================================== */

   @media screen and (min-width:1200px){

   }
   @media screen and (max-width:1050px), screen and (max-device-width:1050px){
     body .header{background-attachment: scroll;}
   }


   /*ipad portrait*/
   @media only screen and (min-device-width:768px) and (max-device-width : 1024px) and (orientation : portrait){
     .header{background-attachment: scroll;}
   }


   @media screen and (max-width:769px) {
    #headerwrap h1 {
      font-size: 80px;
    }
    #headerwrap p {
      font-size: 30px;
      line-height: 38px;
    }
    .sidebar{
      display: none;
    }
    .content{
      width: 100%;
    }
    .content_headerwarp img{
      width: 100%;
    }
    .container_grid li{
      padding: 0 !important;
    }
    .content_wap{
      padding:  10px;
    }
    .home-vip, .home-edu{
      padding: 0;
    }
    .home-vip{
      padding-right: 0 !important;
     padding-left: 50px !important;
    }
    .home_menu_warp_item{
      margin-right: 10px !important;
    }
  }