@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(/public/static/font/material.woff2) format('woff2');
}
#gray {
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.6);
  position: fixed;
  top: 0px;
  display: none;
  z-index: 1999;
}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  -moz-osx-font-smoothing: grayscale;
}

* {
  margin: 0px auto;
  padding: 0px;
}

.cotn_principal {
  position: absolute;
  width: 95%;
  height: 460px;
background: #aac4bc; 
background: -moz-linear-gradient(-45deg,  #aac4bc 0%, #eca8a8 100%, #eed5a9 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #aac4bc 0%,#eca8a8 100%,#eed5a9 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, #aac4bc 0%,#eca8a8 100%,#eed5a9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cfd8dc', endColorstr='#b0bec5',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}

.cont_centrar {
  position: relative;
  float: left;
   width: 100%;
      
}

.cont_login {
  position: relative;
  width: 640px;
left: 50%;
margin-left: -320px;
  
}

.cont_back_info {  
position: relative;
  float: left;
  width: 640px;
  height: 280px;
overflow: hidden;
  background-color: #fff;
  margin-top: 100px;
box-shadow: 1px 10px 30px -10px rgba(0,0,0,0.5);
}

.cont_forms {
  position: absolute;
  overflow: hidden;
  top:100px;
left: 0px;
  width: 320px;
  height: 280px;
  background-color: #eee;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

.cont_forms_active_login {
box-shadow: 1px 10px 30px -10px rgba(0,0,0,0.5);
  height: 420px;  
top:20px;
left: 0px;
  -webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;

}

.cont_forms_active_sign_up {
box-shadow: 1px 10px 30px -10px rgba(0,0,0,0.5);
  height: 420px;  
top:20px;
left:320px;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

.cont_img_back_grey {
  position: absolute;
  width: 950px;
top:-80px;
  left: -116px;
}

.cont_img_back_grey > img {
  width: 100%;
 -webkit-filter: grayscale(100%);     filter: grayscale(100%);
opacity: 0.2;
animation-name: animar_fondo;
  animation-duration: 20s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction: alternate;

}

.cont_img_back_ {
  position: absolute;
  width: 950px;
top:-80px;
  left: -116px;
}

.cont_img_back_ > img {
  width: 100%;
opacity: 0.3;
animation-name: animar_fondo;
animation-duration: 20s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction: alternate;
}

.cont_forms_active_login > .cont_img_back_ {
top:0px;  
  -webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

.cont_forms_active_sign_up > .cont_img_back_ {
top:0px;  
left: -435px;
  -webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}
 

.cont_info_log_sign_up {
position: absolute;
width: 640px;
height: 280px;
top: 80px;
z-index: 1;
} 

.col_md_login {
  text-align: center;
  position: relative;
  margin-top: 70px;
  float: left;
  width: 50%;
}

.col_md_login > h2 {
  font-weight: 400;
margin-top: 70px;
    color: #757575;
}

.col_md_login > p {
 font-weight: 400;
margin-top: 15px;
width: 80%;
color: #37474F;
}

.btn_login {
font-size: 16px;
font-weight: 600;
background-color: #1787fb;
border: none;
padding: 10px;
width: 200px;
border-radius:3px;
box-shadow: 1px 5px 20px -5px rgba(0,0,0,0.4);
color: #fff;
text-align: center;
margin-top:20px;
cursor: pointer;
}

.col_md_sign_up {
  position: relative;
  text-align: center;
  margin-top:70px;
  float: left;
  width: 50%;  
}

.cont_ba_opcitiy > h2 {
 font-size:24px;
  text-align: center;
  font-weight: 600;
  color: #fff;
}

.cont_ba_opcitiy > p {
 font-weight: 400;
margin-top: 15px;
 color: #fff;
}

.cont_ba_opcitiy {
    
  position: relative;
  background-color: rgba(187, 168, 170, 0.79);
  width: 80%;
  border-radius:3px ;
margin-top: 60px;
padding: 15px 0px;
margin:0px auto;
}

.btn_sign_up {
font-size: 16px;
font-weight: 600;
background-color: #f44336;
border: none;
padding: 10px;
width: 200px;
border-radius:3px;
box-shadow: 1px 5px 20px -5px rgba(0,0,0,0.4);
color: #fff;
margin-top: 20px;
cursor: pointer;
}
.cont_forms_active_sign_up {
z-index: 2;  
}


@-webkit-keyframes animar_fondo {
  from { -webkit-transform: scale(1) translate(0px);
-moz-transform: scale(1) translate(0px);
-ms-transform: scale(1) translate(0px);
-o-transform: scale(1) translate(0px);
transform: scale(1) translate(0px); }
  to { -webkit-transform: scale(1.5) translate(50px);
-moz-transform: scale(1.5) translate(50px);
-ms-transform: scale(1.5) translate(50px);
-o-transform: scale(1.5) translate(50px);
transform: scale(1.5) translate(50px); }
}
@-o-keyframes identifier {
  from { -webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
  to { -webkit-transform: scale(1.5);
-moz-transform: scale(1.5);
-ms-transform: scale(1.5);
-o-transform: scale(1.5);
transform: scale(1.5); }

}
@-moz-keyframes identifier {
  from { -webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
  to { -webkit-transform: scale(1.5);
-moz-transform: scale(1.5);
-ms-transform: scale(1.5);
-o-transform: scale(1.5);
transform: scale(1.5); }

}
@keyframes identifier {
  from { -webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1); }
  to { -webkit-transform: scale(1.5);
-moz-transform: scale(1.5);
-ms-transform: scale(1.5);
-o-transform: scale(1.5);
transform: scale(1.5); }
}
.cont_form_login {
margin:0 auto;
text-align: center;
  position: absolute;
  opacity: 0;
display: none;
  width: 320px;
  -webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

.cont_forms_active_login {
z-index: 2;  
}
.cont_forms_active_login  >.cont_form_login {
}

.cont_form_sign_up {
position: absolute;
width: 320px;
float: left;
opacity: 0;
text-align: center;
display: none;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}

  
.cont_form_sign_up > input {
text-align: left;
  padding: 15px 5px;
margin-left: 10px;
margin-top: 15px;
  width: 260px;
border: none;
    color: #757575;
}

.cont_form_sign_up > h2 {
 font-size:24px;
text-align: center;
margin-top: 50px; 
font-weight: 400;
color: #3f3f3f;
}


.cont_form_login > input {
font-size:14px;
padding: 15px 5px;
margin-left: 10px;
margin-top: 20px;
width: 260px;
border: none;
text-align: left;
color: #757575;
}

.cont_form_login > input[type="submit"] {
padding: 15px 5px;
margin-left: 10px;
margin-top: 20px;
width: 260px;
border: none;
text-align: center;
color: #fff;
}

.cont_form_login > h2 {
font-size:24px;
font-weight: 600;
text-align: center;
margin-top: 60px; 
font-weight: 400;
color: #161616;
}
.cont_form_login > a,.cont_form_sign_up > a  {
  color: #757575;
    position: relative;
    float: left;
    margin: 10px;
margin-left: 30px;
}
.bgPop{  display: none;  position: absolute;  z-index: 129;  left: 0;  top: 0;  width: 100%;  height: 100%;  background: rgba(0,0,0,.2);  }


/*登录*/
.form-control-box .icon, .login-wrap .form-group .form-control-error i, .login-content .login-form .msg-wrap .msg-icon, .login-wrap .item-coagent a i, .login-wrap .item-coagent a:hover i, .login-switch a, .login-mobile .default-state .qrcode-desc i { background: url(/public/static/index/login-regiser-icon.png) no-repeat;}
.login-wrap .item-coagent{margin:20px 0 0 50px; height: 43px; line-height: 43px; overflow: hidden; text-align:center;}
.login-wrap .item-coagent a{ float: left; width: 43px; height: 43px; position: relative; margin-right: 20px; margin-left: 25px; }
.login-wrap .item-coagent a i{ display: block; width: 43px; height: 43px; position: absolute; left: 0; top: 0; }
.login-wrap .item-coagent a i.qq{ background-position: -85px 0; }
.login-wrap .item-coagent a i.alipay{ background-position: -142px 0; }
.login-wrap .item-coagent a i.sina{ background-position: -199px 0; }
.login-wrap .item-coagent a i.weixin{ background-position: -254px 0; }
.login-wrap .item-coagent a:hover i.qq{ background-position: -85px -45px; }
.login-wrap .item-coagent a:hover i.alipay{ background-position: -142px -45px; }
.login-wrap .item-coagent a:hover i.sina{ background-position: -199px -45px; }
.login-wrap .item-coagent a:hover i.weixin{ background-position: -254px -45px; }
.login-wrap .item-coagent a.last{ margin-right: 0; }
.cont_form_login .login-wrap > input {
font-size:14px;
padding: 15px 5px;
margin-left: 10px;
margin-top: 20px;
width: 260px;
border: none;
text-align: left;
color: #757575;
}

.cont_form_login .login-wrap > input[type="submit"] {
padding: 15px 5px;
margin-left: 10px;
margin-top: 20px;
width: 260px;
border: none;
text-align: center;
color: #fff;
}
.cont_form_login .login-wrap > h2 {
font-size:24px;
font-weight: 600;
text-align: center;
margin-top: 60px; 
font-weight: 400;
color: #161616;
}

/*扫描登录*/
.login-mobile .default-state { width: 290px; margin-top: 44px; padding-bottom: 15px; text-align: center; position: relative;}
.login-mobile .default-state .qrcode-tit { padding: 0 60px 10px 0;color: #232323; font-size: 18px; font-weight:600; }
.login-mobile .default-state .qrcode-box{ position: relative; margin-top: 10px; height: 150px;}
.qrcode-box .qrcode { width: 150px; height: 150px; position: absolute; left: 70px; top: 0; z-index: 10000;}
.qrcode-box .qrcode img{ width: 150px; height: 150px; display: inline; }
 
.login-mobile .default-state .qrcode-desc { overflow: hidden; width: 170px; margin: 30px auto 0; text-align: center; }
.login-mobile .default-state .qrcode-desc i { width: 30px; height: 30px; background-position: -50px -90px; float: left; margin-right: 5px; margin-top: 3px;margin-left: 25px;  display: inline-block; }
.login-mobile .default-state .qrcode-desc p { width: 110px; line-height: 18px; color: #232323;  font-size: 16px; float: left; }
 
.login-links { margin-top: 25px; overflow: hidden; text-align: right;}
.login-links a { margin-right: 10px; color: #232323;}

/*二维码、PC端登录切换*/
.login-switch { width: 52px; height: 52px; position: absolute; right: 10px; top: 10px; }
.login-switch a { width: 52px; height: 52px; display: inline-block; cursor: pointer; }
.login-switch a.btn-qrcode{ background-position: -308px 0; }
.login-switch a.btn-login{ background-position: -308px -60px; }
.qb_ui_Site_nav{ width:1170px; }
.qb_ui_Site_nav ul { padding: 0 15px; }

header .btn_gp a.shopcar {
  line-height: 40px;
  width: 40px;
  height: 40px;
  float: left;
  text-align: center;
  margin-right: 20px;
  cursor: pointer;
}
header .btn_gp a.shopcar i {
  display: block;
  width: 100%;
  height: 100%;
  background: url('/public/static/new_images/shop/shop-car.png') no-repeat center;
}


.btn_gp a.shopcar:hover{background:#a21231;}
header.open .btn_gp a.shopcar:hover i,header:hover .btn_gp a.shopcar:hover i{background:url(/public/static/new_images/shop/shop-car.png) no-repeat center;}


.buttonBox{
  position:relative;
  float:left;
}

/*
button{
  width:200px;
  height:40px;
  position:relative;
  background:rgba(255, 255, 255, .27);
  text-transform:uppercase;
  color:white;
  font-weight:700;
  letter-spacing:1px;
  border:none;
  font-size:15px;
  outline:none;
  font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}
*/

.border{
    position:absolute;
    background:none;
    transition:all .5s ease-in-out;
}