﻿/* css reset */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, input, button, textarea, p, blockquote, th, td { margin: 0; padding: 0; }
/*body { font-family: "Lantinghei SC", "Open Sans", Arial, "Hiragino Sans GB", "\5FAE\8F6F\96C5\9ED1", "Microsoft YaHei",  "STHeiti", "WenQuanYi Micro Hei", SimSun, sans-serif;font-size: 14px; background-color: #fff; }*/
body { font-family: "Microsoft YaHei";font-size: 14px; background-color: #fff;min-width: 1280px;}
input,select { font-size: 14px; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 100%; }
ol, ul,dl, li { list-style: none; }
em, th, i { font-style: normal; font-weight: normal; }
a { text-decoration: none; }
a:hover,a:focus{text-decoration: none!important;}
img { border: 0; }
textarea { resize: none; margin: 0; }
table { border-collapse: collapse; border-spacing: 0; }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: ""; clear: both; height: 0; }
.clearfix { *zoom: 1; }
.translateSelectLanguage{
    display: none;
}
/*input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color: #999}*/
/*input:-moz-placeholder, textarea:-moz-placeholder {color:#999}*/
/*input::-moz-placeholder, textarea::-moz-placeholder {color:#999}*/
/*input:-ms-input-placeholder, textarea:-ms-input-placeholder {color:#666}*/

/*定位*/
.m0a { margin: 0 auto; }
.tl { text-align: left; }
.tc { text-align: center; }
.tr { text-align: right; }
.fl { float: left; }
.fr { float: right; }
.cb { clear: both; }
.vm { vertical-align: middle; }
.pr { position: relative; }
.pa { position: absolute; }
.db { display: block; }
.dbi { display: inline-block; }
.dn { display: none; }
.oh { overflow: hidden; }

/*文字排版*/
.f12 { font-size: 12px; }
.f14 { font-size: 14px; }
.f18 { font-size: 18px; }
.f16 { font-size: 16px; }
.f20 { font-size: 20px; }
.f24 { font-size: 24px; }
.f28 { font-size: 28px; }

/*颜色*/
.c333 { color: #333; }
.cfff { color: #fff; }
.c666 { color: #666; }
.c999 { color: #999; }
.c000 { color: #000; }

/*背景色*/
.bgfff { background-color: #fff; }

/*宽度*/
.w1000 { width: 1000px; padding: 0 100px; }
.w1200 { width:1200px; }
.w900 { width: 900px; }
.padding30 { padding: 30px 0; }
.padding50 { padding: 50px 0; }

/*容器盒子兼容处理*/
.df {
    display: -webkit-flex;     /* 新版本语法 Chrome 21+ */
    display: flex;             /* 新版本语法 Opear 12.1 Firefox 22+ */
    display: -webkit-box;      /* 新版本语法 Safari， ios， Android browser, older Webkit browsers. */
    display: -moz-box;         /* 新版本语法 Firefox(buggy) */
    display: -ms-flexbox;      /* 新版本语法 IE 10 */
}

/* 首页升级提示弹窗 */
#modal-container {
    position: fixed;
    display: table;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 10;
}
#modal-container.one {
    transform: scaleY(0.01) scaleX(0);
    animation: unfoldIn 1s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-container.one .modal-background .modal {
    transform: scale(0);
    animation: zoomIn 0.5s 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-container.one.out {
    transform: scale(1);
    animation: unfoldOut 1s 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-container.one.out .modal-background .modal {
    animation: zoomOut 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#modal-container .modal-background {
    width: 100%;
    height: 100%;
    display: table-cell;
    background: rgba(0, 0, 0, 0.5);
    text-align: center;
    vertical-align: middle;
}
#modal-container .modal-background .modal {
    width: 450px;
    height: 500px;
    display: inline-block;
    border-radius: 3px;
    font-weight: 300;
    position: relative;
    background: url("../images/pages/overlay.png") no-repeat;
    background-size: contain;
}
#modal-container .modal-background .modal .close{
    cursor: pointer;
    top: -15px;
    right: -25px;
    width: 30px;
    height: 30px;
    background: url("../images/pages/close.png") no-repeat;
    background-size: contain;
}
@keyframes unfoldIn {
    0% {
        transform: scaleY(0.005) scaleX(0);
    }
    50% {
        transform: scaleY(0.005) scaleX(1);
    }
    100% {
        transform: scaleY(1) scaleX(1);
    }
}
@keyframes unfoldOut {
    0% {
        transform: scaleY(1) scaleX(1);
    }
    50% {
        transform: scaleY(0.005) scaleX(1);
    }
    100% {
        transform: scaleY(0.005) scaleX(0);
    }
}
@keyframes zoomIn {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes zoomOut {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(0);
    }
}
