|
|
|
/*reset*/
|
|
html{-webkit-text-size-adjust:none; /*解决chrome浏览器下字体不能小于12px*/}
|
|
body{ color:#000000; font-family:Verdana, Arial, Helvetica, sans-serif;}
|
|
a{outline:none; text-decoration:none;} a:hover{ text-decoration:underline;}
|
|
html{zoom:1;}html *{outline:0;zoom:1;} html button::-moz-focus-inner{border-color:transparent!important;}
|
|
body{overflow-x: hidden; font-size:12px;} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;} table{/*border-collapse:collapse;border-spacing:0;*/} fieldset,a img{border:0;} address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;} li{list-style:none;} caption,th{text-align:left;} h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;} q:before,q:after{content:'';}
|
|
input[type="submit"], input[type="reset"], input[type="button"], button { -webkit-appearance: none; /*去掉苹果的默认UI来渲染按钮*/} em,i{ font-style:normal;}
|
|
|
|
|
|
|
|
/*common*/
|
|
.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden; }.clearfix {display:block;}.clear{ clear:both;}
|
|
.colwrapper { overflow:hidden; zoom:1 /*for ie*/; margin:5px auto; }
|
|
.strong{ font-weight: bold;} .left{ float: left;} .right{ float: right;} .center{ margin:0 auto; text-align:center;}
|
|
.show{ display:block; visibility:visible;}.hide{ display: none; visibility:hidden;}
|
|
.block{ display:block;} .inline{ display:inline;}
|
|
.break{ word-wrap:break-word;overflow:hidden; /*word-break:break-all;*/}
|
|
|
|
.tal{ text-align:left} .tar{ text-align:right;}
|
|
|
|
/*文字两侧对齐*/
|
|
.justify {
|
|
text-align:justify;
|
|
text-justify:distribute-all-lines;/*ie6-8*/
|
|
text-align-last:justify;/* ie9*/
|
|
-moz-text-align-last:justify;/*ff*/
|
|
-webkit-text-align-last:justify;/*chrome 20+*/
|
|
}
|
|
|
|
.toe{
|
|
/*超出省略号*/
|
|
word-break:keep-all;
|
|
white-space:nowrap;
|
|
overflow:hidden;
|
|
text-overflow:ellipsis;
|
|
}
|
|
@media screen and (-webkit-min-device-pixel-ratio:0){/* chrome*/
|
|
.justify:after{
|
|
content:".";
|
|
display: inline-block;
|
|
width:100%;
|
|
overflow:hidden;
|
|
height:0;
|
|
}
|
|
}
|
|
|
|
a{ color:inherit; text-decoration: none;}
|
|
a:hover{ color:#3e6ed4; text-decoration: none;}
|
|
|
|
body{font-family: "Microsoft YaHei",sans-serif;}
|
|
|
|
.css3{
|
|
/*transition: all 0.3s ease-in-out 0s;*/
|
|
|
|
-webkit-transform:translate3d(0, -20px, 0);
|
|
-ms-transform:translate3d(0, -20px, 0);
|
|
transform:translate3d(0, -20px, 0);
|
|
|
|
-webkit-transition-property:opacity, -webkit-transform;
|
|
transition-property:opacity, transform;
|
|
-webkit-transition-duration:1000ms;
|
|
transition-duration:1000ms;
|
|
-webkit-transition-timing-function:cubic-bezier(0.25, 0.46, 0.33, 0.98);
|
|
transition-timing-function:cubic-bezier(0.25, 0.46, 0.33, 0.98);
|
|
|
|
-webkit-transition-delay:800ms;
|
|
transition-delay:800ms
|
|
}
|
|
.css3.animated{
|
|
-webkit-transform:translate3d(0, 0, 0);
|
|
-ms-transform:translate3d(0, 0, 0);
|
|
transform:translate3d(0, 0, 0);
|
|
}
|
|
@media screen and (max-width: 650px) {
|
|
|
|
}
|
|
|
|
@media screen and (max-width: 480px) {
|
|
|
|
}
|
|
|
|
|
|
/*手机下汉堡菜单*/
|
|
.gh {
|
|
|
|
height:34px;
|
|
width:34px;
|
|
margin-right:30px;
|
|
position:absolute;
|
|
right: 0; top: 20px;
|
|
transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
|
|
-webkit-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
|
|
-ms-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
|
|
cursor:pointer;
|
|
display: none;
|
|
}
|
|
.gh span {
|
|
background-color: #fff;
|
|
display: block;
|
|
height: 2px;
|
|
margin-top: -2px;
|
|
position: relative;
|
|
top: 50%;
|
|
transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
|
|
-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
|
|
-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
|
|
width: 100%;
|
|
}
|
|
|
|
.gh span:after, .gh span:before {
|
|
background-color: #fff;
|
|
content: "";
|
|
display: block;
|
|
height: 2px;
|
|
left: 0;
|
|
position: absolute;
|
|
transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
|
|
-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
|
|
-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
|
|
width:100%;
|
|
}
|
|
.gh span:after {
|
|
top:10px;
|
|
}
|
|
.gh span:before {
|
|
top:-10px;
|
|
}
|
|
#mobile-menu-toggle{
|
|
display: none;
|
|
}
|
|
#mobile-menu-toggle:checked + .gh span:after,
|
|
#mobile-menu-toggle:checked + .gh span:before {
|
|
top: 0;
|
|
}
|
|
#mobile-menu-toggle:checked + .gh span:before {
|
|
transform: translateY(0px) rotate(-45deg);
|
|
-webkit-transform: translateY(0px) rotate(-45deg);
|
|
-ms-transform: translateY(0px) rotate(-45deg);
|
|
}
|
|
#mobile-menu-toggle:checked + .gh span:after {
|
|
transform: translateY(0px) rotate(45deg);
|
|
-webkit-transform: translateY(0px) rotate(45deg);
|
|
-ms-transform: translateY(0px) rotate(45deg);
|
|
}
|
|
#mobile-menu-toggle:checked + .gh span {
|
|
background-color: transparent !important;
|
|
}
|
|
#mobile-menu-toggle:checked + .gh + .nav{
|
|
max-height: 1000px;
|
|
}
|
|
.nav{
|
|
|
|
}
|
|
|
|
.gh+ .nav{
|
|
/*height: auto;
|
|
background: #2f6ea2;
|
|
overflow: hidden;
|
|
transition: 0.4s;
|
|
padding: 0; max-height: 0;*/
|
|
}
|