@media (min-width: 1280px) {

    *{
        margin: 0;
        padding: 0;
        list-style-type: none;
    }
    body{
      overflow-x: hidden;
    }
 
     /* CUSTOMIZE THE NAVBAR     导航栏
     -------------------------------------------------- */
 
     .navbar-wrapper {
       /* position: absolute; */
       left: 0;
       right: 0;
       z-index: 10;
       height: 60px ;
       position: fixed;
     }
 
 
     .navbar .navbar-inner {
       border: 0;
       -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.25);
          -moz-box-shadow: 0 2px 10px rgba(0,0,0,.25);
               box-shadow: 0 2px 10px rgba(0,0,0,.25);
       -webkit-border-radius: 0px; 
       -moz-border-radius: 0px;
       border-radius: 0px;
     }
 
     .navbar .brand {
       padding: 14px 20px 16px;
       font-size: 16px;
       font-weight: bold;
       text-shadow: 0 -1px 0 rgba(0,0,0,.5);
     }
     .nav-collapse {   
       margin-left: auto;
       margin-right: auto;
       width: 1230px;
       /* background-color: rebeccapurple; */
       height: 60px;
     }
     .logo{
       background-image: url(../img/logo.png);
       background-repeat: no-repeat;
       position: absolute;
       top: 9px;
       width: 200px;
       height: 60px;
       z-index: 999;
     }
     .navbar .nav {
       text-align: center;
       font-size: 18px;
       margin-left: 530px;
       
     }
     .navbar .nav > li  {
       width: 168px;
       height: 57px;
     }
 
     .collapse {
       height: 120px !important;
     }
     .navbar .nav > li > a {
       padding: 5px;
       margin-top: 12px;
     }
 
     .navbar-inverse .nav .active > a, .navbar-inverse .nav .active > a:hover, .navbar-inverse .nav .active > a:focus {
         color: #ffffff;
           background-color: #1b1b1b;
           border: 2px solid rgba(255, 255, 255, 1);
           opacity: 0.5;
     }

     .bottom{
        height: 50px;
        width: 100%;
        margin:50px 0 0px 0;
        background-color: #25CDE3;
        position: relative;
        
      }
   
      .bottom_span{
        font-size: 18px;
          position: absolute;
          color: white;
          top: 15px;
          text-align: center;
          width: 100%;
      }
  
    }


    @media (max-width: 1279px) {

        *{
            margin: 0;
            padding: 0;
            list-style-type: none;
        }
        body{
          overflow-x: hidden;
        }
        
         /* CUSTOMIZE THE NAVBAR     导航栏
         -------------------------------------------------- */
        
         .navbar-wrapper {
           /* position: absolute; */
           left: 0;
           right: 0;
           z-index: 10;
           height: 60px ;
           position: fixed;
         }
        
        
         .navbar .navbar-inner {
           border: 0;
           -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.25);
              -moz-box-shadow: 0 2px 10px rgba(0,0,0,.25);
                   box-shadow: 0 2px 10px rgba(0,0,0,.25);
           -webkit-border-radius: 0px; 
           -moz-border-radius: 0px;
           border-radius: 0px;
         }
        
         .navbar .brand {
           padding: 14px 20px 16px;
           font-size: 16px;
           font-weight: bold;
           text-shadow: 0 -1px 0 rgba(0,0,0,.5);
         }
         .nav-collapse {   
           margin-left: auto;
           margin-right: auto;
           width: 1000px;
           /* background-color: rebeccapurple; */
           height: 60px;
         }
         .logo{
           background-image: url(../img/logo.png);
           background-repeat: no-repeat;
           position: absolute;
           top: 9px;
           width: 200px;
           height: 60px;
           z-index: 999;
         }
         .navbar .nav {
           text-align: center;
           font-size: 16px;
           margin-left: 385px;
           
         }
         .navbar .nav > li  {
           width: 150px;
           height: 57px;
         }
        
         .collapse {
           height: 120px !important;
         }
         .navbar .nav > li > a {
           padding: 5px;
           margin-top: 12px;
         }
        
         .navbar-inverse .nav .active > a, .navbar-inverse .nav .active > a:hover, .navbar-inverse .nav .active > a:focus {
             color: #ffffff;
               background-color: #1b1b1b;
               border: 2px solid rgba(255, 255, 255, 1);
               opacity: 0.5;
         }
        

         .bottom{
            height: 50px;
            width: 100%;
            margin:50px 0 0px 0;
            background-color: #25CDE3;
            position: relative;
            
          }
         
          .bottom_span{
            font-size: 16px;
              position: absolute;
              color: white;
              top: 15px;
              text-align: center;
              width: 100%;
          }
        }