123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162 |
- /*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;*/
- }
|