@font-face{font-family:'FontAwesome';src:url('/font/fontawesome-webfont.eot?v=3.2.1');src:url('/font/fontawesome-webfont.eot?#iefix&v=3.2.1') format('embedded-opentype'),url('/font/fontawesome-webfont.woff?v=3.2.1') format('woff'),url('/font/fontawesome-webfont.ttf?v=3.2.1') format('truetype'),url('/font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg');font-weight:normal;font-style:normal;}
html{
    position: relative;
    min-width: 100%;
    height: 100%;
}
body{
    position: relative;
    margin: 0;
    padding: 0;
    min-width: 100%;
    height: 100%;
    text-align: center;
    /*background-color: #f0f0f0;*/
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
}

/* header */
.m{
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    min-width: 100%;
    background-color: #1b1b1b;
    background-image: -moz-linear-gradient(top,#222222,#111111);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#222222),to(#111111));
    background-image: -webkit-linear-gradient(top,#222222,#111111);
    background-image: -o-linear-gradient(top,#222222,#111111);
    background-image: linear-gradient(to bottom,#222222,#111111);
    background-repeat: repeat-x;
    /*border-bottom: 1px solid #252525;*/
    -webkit-box-shadow: 0 1px 10px rgba(0,0,0,0.1);
    -moz-box-shadow: 0 1px 10px rgba(0,0,0,0.1);
    box-shadow: 0 1px 10px rgba(0,0,0,0.1);
}
#m{
    margin: auto;
    width: 90%;
    max-width: 1000px;
}
#m > div{
    position: relative;
    display: inline-block;
    vertical-align: top;
}
#m > div:nth-child(2){
    display: none;
    color: #fff;
}
#m > div:nth-child(3){
    display: none;
}
@media only screen and (max-width: 640px){
    #m > div:nth-child(n+3){
        display: none;
    }
    #m > div:nth-child(2){
        display: inline-block;
    }
    #m > div:nth-child(3){
        display: block;
    }
    #m > div:last-child{
        display: block;
    }
}
#m a{
    display: inline-block;
    padding: 10px 20px;
    color: #777;
    text-decoration: none;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
}
.acv{
    color: #fff !important;
}
#user > a{
    position: relative;
}
#user > a > img{
    position: absolute;
    top: 2px;
    left: 10px;
    /*height: 36px;*/
    height: 32px;
    border-radius: 1px;
}
.avimg{
    padding: 10px 20px 10px 50px !important;
}
.play{

}
.play > div:first-child{
    display: inline-block;
    margin: 9px 0 4px 6px;
    width: 16px;
    height: 18px;
    background: url(/img/play-pause-while.png) no-repeat;
    background-size: cover;
    cursor: pointer;
}
.play > div:nth-child(2){
    position: relative;
    display: inline-block;
    margin: 10px 0 0 10px;
    width: 100px;
    height: 16px;
    vertical-align: top;
    color: #fff;
    /*overflow: hidden;*/
    white-space: nowrap;
    cursor: pointer;
}
.play > div:nth-child(2) > div{
    position: absolute;
    height: 16px;
    white-space: nowrap;
    /*-webkit-animation: l1_animation 10s linear infinite;*/
    /*-moz-animation: l1_animation 10s linear infinite;*/
}
@-webkit-keyframes l1_animation {
    0%{left: 0;}
    100%{left: -100%;}
}
@-moz-keyframes l1_animation {
    0%{left: 0;}
    100%{left: -100%;}
}
.play > div:nth-child(2) > div > div:nth-child(2){
    display: none;
}
.play > div:nth-child(2) > div > div{
    position: relative;
    display: inline-block;
    padding: 0 10px 0 0;
    box-sizing: border-box;
}
#pl{
    position: absolute;
    left: 50%;
}
#pl > div{
    position: relative;
    left: -50%;
    padding: 10px;
    width: 400px;
    background: #fff;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    text-align: left;
    -webkit-box-shadow: 0 1px 10px rgba(0,0,0,0.1);
    -moz-box-shadow: 0 1px 10px rgba(0,0,0,0.1);
    box-shadow: 0 1px 10px rgba(0,0,0,0.1);
}
@media only screen and (max-width: 640px){
    #pl > div{
        width: 90%;
    }
}
#pl > div > div{
    white-space: nowrap;
}
.plst{
    margin: 1px 0;
}
.plst:hover{
    background-color: #f5f5f5;
    cursor: pointer;
}
.vlpl{
    /*display: inline-block;*/
    margin: 3px 0 0;
    padding: 4px 10px 4px 0;
    width: auto;
    cursor: pointer;
}
.vlpl > div{
    position: relative;
    width: 100px;
    height: 3px;
    background: #ececf0;
}
.vlpl > div > div{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #58294b;
}
#cprd{
    /*display: inline-block;*/
    width: 90%;
    margin: 3px 5px 0 0;
    padding: 4px 0;
    box-sizing: border-box;
}
#cprd > div{
    background: #ececf0;
    height: 3px;
    box-sizing: border-box;
}
#cprd > div canvas{
    position: absolute;
    /*width: 290px;*/
    height: 3px;
    cursor: pointer;
}
.nampl{
    background: #ececf0;
}
#ecvlz{
    position: absolute;
    z-index: -1;
    bottom: 80px;
    width: 100%;
}
/* equalize */
#ecvlz > canvas{    
    position: relative;
    width: 90%;
    margin: auto;
    max-width: 700px;
    height: 100px;
    /*-webkit-box-reflect: below 5px -webkit-linear-gradient(top, transparent, transparent 50%, rgba(255,255,255,0.2));*/
    -webkit-box-reflect: below 5px -webkit-linear-gradient(top, transparent, transparent 50%, rgba(255,255,255,0.4));
}

#h{
    position: relative;
    z-index: 10;
    padding: 40px 0;
    min-width: 100%;
    min-height: 200px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 3px rgba(0,0,0,.4),0 0 30px rgba(0,0,0,.075);
    background: #020031;
    background: -moz-linear-gradient(45deg,#020031 0%,#6d3353 100%);
    background: -webkit-gradient(linear,left bottom,right top,color-stop(0%,#020031),color-stop(100%,#6d3353));
    background: -webkit-linear-gradient(45deg,#020031 0%,#6d3353 100%);
    background: -o-linear-gradient(45deg,#020031 0%,#6d3353 100%);
    background: -ms-linear-gradient(45deg,#020031 0%,#6d3353 100%);
    background: linear-gradient(45deg,#020031 0%,#6d3353 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#020031',endColorstr='#6d3353',GradientType=1);
    -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2),inset 0 -3px 7px rgba(0,0,0,.2);
    -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2),inset 0 -3px 7px rgba(0,0,0,.2);
    box-shadow: inset 0 3px 7px rgba(0,0,0,.2),inset 0 -3px 7px rgba(0,0,0,.2);
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}
#h:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url(/img/bh.png) repeat center center;
    opacity: .4;
}
.h1{
    font-size: 60px;
}
.h2{
    font-family: inherit;
    color: inherit;
}
.pi{
    font-size: 25px;
}
.p2{
    font-size: 40px;
}
@media only screen and (max-width: 500px){
    .h1{
        font-size: 40px;
    }
    .pi{
        font-size: 18px;
    }
    .p2{
        font-size: 30px;
    }
}
a {
    color: #693152;
}

.flag{
    position: relative;
    overflow: visible;
}
.flag > img{
    margin: 7px 0 0;
    cursor: pointer;
}
/*.flag:hover .fs{
    display: block;
}*/
.fs{
    position: absolute;
    z-index: 999;
    display: none;
    top: 100%;
    left: 0;
    padding: 5px;
    background: #fff;
    text-align: left;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    -webkit-box-shadow: 0 1px 10px rgba(0,0,0,0.1);
    -moz-box-shadow: 0 1px 10px rgba(0,0,0,0.1);
    box-shadow: 0 1px 10px rgba(0,0,0,0.1);
}
.sfl{
    white-space: nowrap;
    cursor: pointer;
}
.sfl:hover{
    background: #f0f0f0;
}
.sfl > img{
    margin: 0 5px 0 0;
    padding: 0;
}
.sfl > span{
    display: inline-block;
    vertical-align: top;
    padding: 5px 0 0;
    font-size: 13px;
}
/* end header */

#p{
    margin: 0 auto;
    padding: 0;
    width: 90%;
    max-width: 1000px;
    min-height: 55%;
}
.pis{
    display: block;
    padding: 10px 0;
    text-align: center;
}
.pis > div{
    display: inline-block;
    margin: 0 auto;
    /*text-align: left;*/
    text-align: center;
    overflow: hidden;
    vertical-align: top;
}
.pis > div > div{
    display: inline-block;
    margin: 10px 15px;
    width: 90%;
    max-width: 260px;
    /*height: 200px;*/
}
.pis > div > div a{
    display: block;
}
.pis > div > div img{
    padding: 4px;
    width: 100%;
    background: #fff;
    box-sizing: border-box;
    border: 1px solid #ddd;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    box-shadow: 0 1px 3px rgba(0,0,0,0.055);
}

.slogo{
    display: table;
    margin: 10px 0 20px;
    width: 100%;
    box-sizing: border-box;
}
.slogo > div{
    display: table-cell;
    vertical-align: top;
}
.slogo > div:first-child{
    width: auto;
}
.slogo > div:first-child img{
    width: 200px;
}
.slogo > div:last-child{
    padding: 0 15px 0;
    width: 100%;
    text-align: left;
}
.psclk{
    padding-top: 20px;
    text-align: center;
}
.tb{
    display: table;
    width: 100%;
}
.tb > div{
    display: table-cell;
}

.tbif > div{
    display: inline-block;
    text-align: justify;
}
.frd{
    position: relative;
    display: inline-block;
    overflow: hidden;
}
.frd iframe{
    transform: scale(0.219);
    -webkit-transform: scale(0.219);
    -o-transform: scale(0.219);
    -ms-transform: scale(0.219);
    -moz-transform: scale(0.219);
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
    margin: 0;
    padding: 0;
    position: relative;
    background-color: #fff;
    border: 0;
}
#if1{
    position: absolute;
    margin: 0;
    padding: 0;
    width: 320px;
    height: 480px;
    top: 29px;
    left: 11px;
    border: 0;
    overflow-y: hidden;
}
#if2{
    position: absolute;
    margin: 0;
    padding: 0;
    width: 768px;
    height: 1024px;
    top: 30px;
    left: 37px;
    border: 0;
    overflow-y: hidden;
    transform: scale(0.230);
    -webkit-transform: scale(0.230);
    -o-transform: scale(0.230);
    -ms-transform: scale(0.230);
    -moz-transform: scale(0.230);
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
}
@media only screen and (max-width: 260px){
    #if2i{
        max-width: 160px;
    }
    #if2{
        top: 20px;
        left: 24px;
        transform: scale(0.149);
        -webkit-transform: scale(0.149);
        -o-transform: scale(0.149);
        -ms-transform: scale(0.149);
        -moz-transform: scale(0.149);
    }
}
#if3{
    position: absolute;
    margin: 0;
    padding: 0;
    width: 1280px;
    height: 800px;
    top: 16px;
    left: 59px;
    border: 0;
    transform: scale(0.279);
    -webkit-transform: scale(0.279);
    -o-transform: scale(0.279);
    -ms-transform: scale(0.279);
    -moz-transform: scale(0.279);
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
}
@media only screen and (max-width: 570px){
    #if3i{
        max-width: 250px;
    }
    #if3{
        top: 8px;
        left: 31px;
        transform: scale(0.146);
        -webkit-transform: scale(0.146);
        -o-transform: scale(0.146);
        -ms-transform: scale(0.146);
        -moz-transform: scale(0.146);
    }
}
@media only screen and (max-width: 260px){
    #if3i{
        max-width: 160px;
    }
    #if3{
        top: 5px;
        left: 20px;
        transform: scale(0.094);
        -webkit-transform: scale(0.094);
        -o-transform: scale(0.094);
        -ms-transform: scale(0.094);
        -moz-transform: scale(0.094);
    }
}
#if4{
    position: absolute;
    margin: 0;
    padding: 0;
    top: 26px;
    left: 28px;
    width: 1600px;
    height: 1000px;
    border: 0;
    transform: scale(0.3181);
    -webkit-transform: scale(0.3181);
    -o-transform: scale(0.3181);
    -ms-transform: scale(0.3181);
    -moz-transform: scale(0.3181);
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
}
@media only screen and (max-width: 570px){
    #if4i{
        max-width: 250px;
    }
    #if4{
        top: 11px;
        left: 12px;
        transform: scale(0.142);
        -webkit-transform: scale(0.142);
        -o-transform: scale(0.142);
        -ms-transform: scale(0.142);
        -moz-transform: scale(0.142);
    }
}
@media only screen and (max-width: 260px){
    #if4i{
        max-width: 160px;
    }
    #if4{
        top: 7px;
        left: 8px;
        transform: scale(0.092);
        -webkit-transform: scale(0.092);
        -o-transform: scale(0.092);
        -ms-transform: scale(0.092);
        -moz-transform: scale(0.092);
    }
}
[class^="icna"]:before, [class*=" icna"]:before {
    font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em;
    font-size: 60px;
}
.pd1:before{
    content:"\f10b";
    font-size: 50px;
}
.pd2:before{
    content:"\f10b";
}
.pd3:before{
    content:"\f10a";
}
.pd4:before{
    content: "\f109";
}
/*.pd5:before{
    content: "\f108";
}*/
.icna{
    color: #666;
}
.icna:hover{
    color: #131313 !important;
}
.actdv{
    color: #441f46 !important;
}
.icip > div{
    display: inline-block;
    padding: 5px 20px 10px;
}
.icip > div > a{
    text-decoration: none;
}
.inpad > div:first-child{
    display: inline-table;
    margin: 20px 0 10px;
    padding: 3px;
    width: 50%;
    background: #fff;
    border: 1px solid #ddd;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    box-shadow: 0 1px 3px rgba(0,0,0,0.055);
}
@media only screen and (max-width: 800px){
    .inpad > div:first-child{
        width: 70%;
    }
}
@media only screen and (max-width: 500px){
    .inpad > div:first-child{
        width: 90%;
    }
}
.inpad > div:first-child > div{
    display: table-cell;
    vertical-align: middle;
}
.inpad > div:first-child > div:first-child{
    padding: 0;
    font-size: 20px;
}
.inpad input{
    padding: 2px 10px 2px 10px;
    width: 100%;
    background: #fff;
    border: 0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    font-size: 20px;
    box-sizing: border-box;
    outline: none;
}
.inpad > div:first-child > div:first-child{
    /*color: #77278d;*/
    color: #666;
    font-weight: bold;
    font-style: italic;
}
.inpad > div:first-child > div:last-child{
    padding: 3px 0 0;
    cursor: pointer;
}
.inpad > div:first-child > div:last-child img{
    height: 25px;
}

/* page adaptive */
.notebook{
    position: relative;
    display: inline-block;
    padding: 0;
    margin: 7px 0 0 0;
}
.notebooki{
    max-width: 1000px;
}
.notebookf{
    position: absolute;
    top: 34px;
    left: 127px;
    right: 127px;
    bottom: 136px;
    margin: 0;
    padding: 0;
    border: 0;
}
.notebookf > iframe{
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    width: 1280px;
    height: 800px;
    border: 0;
    transform: scale(0.583);
    -webkit-transform: scale(0.583);
    -o-transform: scale(0.583);
    -ms-transform: scale(0.583);
    -moz-transform: scale(0.583);
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
}
@media only screen and (max-width: 1000px){
    .notebooki{
        max-width: 600px;
    }
    .notebookf{
        top: 21px;
        left: 77px;
        right: 77px;
        bottom: 83px;
    }
    .notebookf > iframe{
        transform: scale(0.349);
        -webkit-transform: scale(0.349);
        -o-transform: scale(0.349);
        -ms-transform: scale(0.349);
        -moz-transform: scale(0.349);
    }
}
@media only screen and (max-width: 650px){
    .notebooki{
        max-width: 420px;
    }
    .notebookf{
        top: 14px;
        left: 54px;
        right: 53px;
        bottom: 59px;
    }
    .notebookf > iframe{
        transform: scale(0.245);
        -webkit-transform: scale(0.245);
        -o-transform: scale(0.245);
        -ms-transform: scale(0.245);
        -moz-transform: scale(0.245);
    }
}
@media only screen and (max-width: 430px){
    .notebooki{
        max-width: 250px;
    }
    .notebookf{
        top: 8px;
        left: 32px;
        right: 32px;
        bottom: 37px;
    }
    .notebookf > iframe{
        transform: scale(0.146);
        -webkit-transform: scale(0.146);
        -o-transform: scale(0.146);
        -ms-transform: scale(0.146);
        -moz-transform: scale(0.146);
    }
}
@media only screen and (max-width: 260px){
    .notebooki{
        max-width: 160px;
    }
    .notebookf{
        top: 5px;
        left: 21px;
        right: 20px;
        bottom: 24px;
    }
    .notebookf > iframe{
        transform: scale(0.093);
        -webkit-transform: scale(0.093);
        -o-transform: scale(0.093);
        -ms-transform: scale(0.093);
        -moz-transform: scale(0.093);
    }
}
.iphone{
    position: relative;
    display: inline-block;
    padding: 0;
    margin: 0;
}
.iphonei{
    max-width: 1000px;
}
.iphonef{
    position: absolute;
    top: 115px;
    left: 24px;
    right: 23px;
    bottom: 127px;
    margin: 0;
    padding: 0;
    border: 0;
}
.iphonef > iframe{
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    width: 320px;
    height: 480px;
    border: 0;
    transform: scale(0.999);
    -webkit-transform: scale(0.999);
    -o-transform: scale(0.999);
    -ms-transform: scale(0.999);
    -moz-transform: scale(0.999);
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
}
@media only screen and (max-width: 390px){
    .iphonei{
        max-width: 250px;
    }
    .iphonef{
        top: 78px;
        left: 16px;
        right: 16px;
        bottom: 86px;
    }
    .iphonef > iframe{
        transform: scale(0.681);
        -webkit-transform: scale(0.681);
        -o-transform: scale(0.681);
        -ms-transform: scale(0.681);
        -moz-transform: scale(0.681);
    }
}
@media only screen and (max-width: 260px){
    .iphonei{
        max-width: 160px;
    }
    .iphonef{
        top: 50px;
        left: 10px;
        right: 10px;
        bottom: 56px;
    }
    .iphonef > iframe{
        transform: scale(0.437);
        -webkit-transform: scale(0.437);
        -o-transform: scale(0.437);
        -ms-transform: scale(0.437);
        -moz-transform: scale(0.437);
    }
}
.mobile{
    position: relative;
    display: inline-block;
    padding: 0;
    margin: 0;
}
.mobilei{
    max-width: 1000px;
}
.mobilef{
    position: absolute;
    top: 107px;
    left: 31px;
    right: 30px;
    bottom: 112px;
    margin: 0;
    padding: 0;
    border: 0;
}
.mobilef > iframe{
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    width: 240px;
    height: 320px;
    border: 0;
    transform: scale(0.999);
    -webkit-transform: scale(0.999);
    -o-transform: scale(0.999);
    -ms-transform: scale(0.999);
    -moz-transform: scale(0.999);
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
}
@media only screen and (max-width: 330px){
    .mobilei{
        max-width: 250px;
    }
    .mobilef{
        top: 87px;
        left: 27px;
        right: 26px;
        bottom: 92px;
        /*border: 1px solid red;*/
    }
    .mobilef > iframe{
        transform: scale(0.821);
        -webkit-transform: scale(0.821);
        -o-transform: scale(0.821);
        -ms-transform: scale(0.821);
        -moz-transform: scale(0.821);
    }
}
@media only screen and (max-width: 260px){
    .mobilei{
        max-width: 160px;
    }
    .mobilef{
        top: 56px;
        left: 17px;
        right: 17px;
        bottom: 60px;
    }
    .mobilef > iframe{
        transform: scale(0.526);
        -webkit-transform: scale(0.526);
        -o-transform: scale(0.526);
        -ms-transform: scale(0.526);
        -moz-transform: scale(0.526);
    }
}
.ipad{
    position: relative;
    display: inline-block;
    padding: 0;
    margin: 0;
}
.ipadi{
    max-width: 1000px;
}
.ipadf{
    position: absolute;
    top: 110px;
    left: 102px;
    right: 102px;
    bottom: 114px;
    margin: 0;
    padding: 0;
    border: 0;
}
.ipadf > iframe{
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    width: 768px;
    height: 1024px;
    border: 0;
    transform: scale(1);
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
}
@media only screen and (max-width: 1000px){
    .ipadi{
        max-width: 600px;
    }
    .ipadf{
        top: 67px;
        left: 62px;
        right: 62px;
        bottom: 69px;
    }
    .ipadf > iframe{
        transform: scale(0.617);
        -webkit-transform: scale(0.617);
        -o-transform: scale(0.617);
        -ms-transform: scale(0.617);
        -moz-transform: scale(0.617);
    }
}
@media only screen and (max-width: 650px){
    .ipadi{
        max-width: 320px;
    }
    .ipadf{
        top: 36px;
        left: 33px;
        right: 33px;
        bottom: 37px;
    }
    .ipadf > iframe{
        transform: scale(0.329);
        -webkit-transform: scale(0.329);
        -o-transform: scale(0.329);
        -ms-transform: scale(0.329);
        -moz-transform: scale(0.329);
    }
}
@media only screen and (max-width: 330px){
    .ipadi{
        max-width: 250px;
    }
    .ipadf{
        top: 28px;
        left: 26px;
        right: 26px;
        bottom: 30px;
    }
    .ipadf > iframe{
        transform: scale(0.257);
        -webkit-transform: scale(0.257);
        -o-transform: scale(0.257);
        -ms-transform: scale(0.257);
        -moz-transform: scale(0.257);
    }
}
@media only screen and (max-width: 260px){
    .ipadi{
        max-width: 160px;
    }
    .ipadf{
        top: 18px;
        left: 17px;
        right: 17px;
        bottom: 19px;
        /*border: 1px solid red;*/
    }
    .ipadf > iframe{
        transform: scale(0.165);
        -webkit-transform: scale(0.165);
        -o-transform: scale(0.165);
        -ms-transform: scale(0.165);
        -moz-transform: scale(0.165);
    }
}
/* end page adaptive */

/* index page */
.intxt{
    padding: 20px 0 0;
    text-align: left;
}
.demdp{
    display: table;
    margin: 40px auto;
}
.demdp > div{
    position: relative;
    display: table-cell;
    vertical-align: bottom;
    text-align: left;
}
.demdp > div:last-child{
    /*text-align: left;*/
}
.idmg{
    max-width: 350px;
}
.sdpd{
    padding: 0 0 0 25px;
}
.btps{
    position: absolute;
    top: 0;
    right: 0;
}

@media only screen and (max-width: 900px){
    .demdp{
        display: block;
    }
    .demdp > div{
        display: block;
    }
    .demdp > div:first-child{
        text-align: center;
    }
    .demdp .idmg{
        width: 90%;
    }
    .sdpd{
        padding: 0 15px;
    }
    .btps{
        position: relative;
        margin: 5px 10px;
    }
}

.butm{
    display: inline-block;
    padding: 4px 12px;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 20px;
    /* color: #333333; */
    text-align: center;
    text-shadow: 0 1px 1px rgba(255,255,255,0.75);
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    background-color: #f5f5f5;
    background-image: -moz-linear-gradient(top,#ffffff,#e6e6e6);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#ffffff),to(#e6e6e6));
    background-image: -webkit-linear-gradient(top,#ffffff,#e6e6e6);
    background-image: -o-linear-gradient(top,#ffffff,#e6e6e6);
    background-image: linear-gradient(to bottom,#ffffff,#e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #cccccc;
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
    border-bottom-color: #b3b3b3;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffe6e6e6',GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}

.tinu{
    display: inline-block;
    /*width: 210px;*/
    min-height: 18px;
    padding: 4px;
    margin-bottom: 9px;
    font-size: 14px;
    line-height: 18px;
    color: #555555;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    -webkit-transition: border linear 0.2s,box-shadow linear 0.2s;
    -moz-transition: border linear 0.2s,box-shadow linear 0.2s;
    -ms-transition: border linear 0.2s,box-shadow linear 0.2s;
    -o-transition: border linear 0.2s,box-shadow linear 0.2s;
    transition: border linear 0.2s,box-shadow linear 0.2s;
}
.ordpd{
    padding: 15px 0 0;
    text-align: center;
}
.bgtb{
    display: table;
    width: 100%;
}
.bgtb > div{
    display: table-cell;
    vertical-align: middle;
}
.bgtb > div:first-child{
    width: auto;
}
.bgtb > div:last-child{
    width: 100%;
}
@media only screen and (max-width: 500px){
    .bgtb{
        display: block;
        width: 100%;
    }
    .bgtb > div{
        display: block;
    }
}
.ordtb{
    display: inline-table;
    text-align: left;
}
.ordtb > div{
    display: table-row;
}
.ordtb > div > div{
    display: table-cell;
    white-space: nowrap;
}
.ordtb > div > div:last-child{
    padding-left: 15px;
}
.ordtxt{
    min-width: 90%;
    min-height: 162px;
    height: 96%;
}
.otzv{
    padding: 10px 0;
}
.cred{
    color: red;
}
.otzv{
    padding: 10px 0;
}
#vk_like{
    display: inline-block;
    padding-bottom: 20px;
    margin: auto;
}
#vk_comments{
    display: inline-block;
    margin: auto;
}

/* footer */
#f{
    min-width: 100%;
    margin-top: 60px;
    border-top: 1px solid #e5e5e5;
    background-color: #f5f5f5;
}
@media only screen and (max-width: 400px){
    #f{
        margin-top: 40px;
    }
}
#f > div{
    max-width: 1000px;
    text-align: right;
}
.fblc{
    display: table;
    margin: auto;
    width: 100%;
    height: 100px;
    min-height: 100px;
}
.fblc > div{
    display: table-cell;
    vertical-align: middle;
}
.fblc > div:first-child{
    text-align: left;
}
.fblc > div:last-child{
    text-align: right;
}
.fblc > div:nth-child(2){
    text-align: center;
}
.fblc > div:first-child, .fblc > div:last-child{
    width: 20%;
}
@media only screen and (max-width: 1000px){
    .fblc > div:first-child{
        padding-left: 10px;
    }
    .fblc > div:last-child{
        padding-right: 10px;
    }
}
@media only screen and (max-width: 350px){
    .fblc{
        display: block;
    }
    .fblc > div{
        display: block;
        padding: 5px 10px;
        text-align: center;
    }
    .fblc > div:first-child{
        text-align: center;
    }
    .fblc > div:last-child{
        text-align: center;
    }
    .fblc > div:first-child, .fblc > div:last-child{
        width: auto;
    }
    #fl{
        text-align: center;
    }
    #fl > div{
        margin: auto;
    }
}
#fl > div{
    display: inline-table;
}
#fl > div > div{
    display: table-cell;
    vertical-align: middle;
    text-align: left;
}
#fl > div > div:first-child{
    padding-right: 10px;
}
/* end footer */

/* canvas effect */
/*body {margin:0;padding:0;background: #000;overflow:hidden; -webkit-transform: translateZ(0)}*/
#cvsk2 {
    position: fixed;
    display: block;
    z-index: -60;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    -webkit-transform: translateZ(0);
    overflow: no-content;
}
#cvsk3, #Canvas4 {
    position: fixed;
    display: none;
    z-index: -60;
}
/*canvas {image-rendering: optimizeSpeed; image-rendering: -moz-crisp-edges; image-rendering: -webkit-optimize-contrast;  image-rendering: optimize-contrast; -ms-interpolation-mode: nearest-neighbor; }*/
/* end canvas effect */

.about{
    padding: 0;
    text-align: left;
}

/* draw */
#cpdrw {
    position: relative;
    width: 100%;
    height: 500px;
    border: 1px solid rgba(0,0,0,.2);
    background: #fff;
}
#tcd {
    position: absolute;
    left: 0px; right: 0;
    bottom: 0; top: 0;
    cursor: crosshair;
}
.clsd > div{
    display: inline-block;
    width: 10px;
    height: 10px;
}
.clerd{
    display: inline-block;
    padding: 1px 5px;
    border: 1px solid gray;
    cursor: pointer;
}
#cimg{
    display: inline-block;
    border: 1px solid rgba(0,0,0,.2);
    background: #fff;
}
/* end draw */

/* auth */
.auth{
    padding: 10px 0;
    text-align: center;
}
.auth form{
    display: inline-block;
    margin: 0 auto;
    text-align: left;
}
.autht{
    display: table;
    width: 100%;
}
.autht > div{
    display: table-row;
}
.autht > div > div{
    display: table-cell;
    padding: 5px 3px;
    vertical-align: middle;
}
.autht > div:first-child > div:first-child{
    min-width: 60px;
}
.auth input[type="submit"]{
    display: inline-block;
    padding: 2px 12px;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #693152;
    text-shadow: 0 1px 1px rgba(255,255,255,0.75);
    cursor: pointer;
    background-color: #f5f5f5;
    background-image: -moz-linear-gradient(top,#ffffff,#e6e6e6);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#ffffff),to(#e6e6e6));
    background-image: -webkit-linear-gradient(top,#ffffff,#e6e6e6);
    background-image: -o-linear-gradient(top,#ffffff,#e6e6e6);
    background-image: linear-gradient(to bottom,#ffffff,#e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #cccccc;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}
.auth input[type="text"]{
    padding: 2px 5px;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #cccccc;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}
.auth input[type="password"]{
    padding: 2px 5px;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #cccccc;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}
#rcaph{
    padding: 3px 0 5px;
}
#rcaphr{
    padding: 3px 0 5px;
}
#athotv, passtv, passtv2, #aremc, #apprvt{
    padding: 3px;
}
#recpt, #rcpaift{
    padding: 0 3px 8px;
}
.hrrgst{
    padding: 8px 5px 0;
}
/* end auth */

/* joke */
.joke{
    text-align: left;
}
.zglbn, #jvkv{
    text-transform: capitalize;
}
.jclr{
    color: #693152;
}
.jvka{
    display: inline-table;
}
.jvka > div{
    display: table-cell;
    vertical-align: middle;
}
.jvka > div:first-child img{
    margin-right: 18px;
    border: 4px solid #fff;
    border-radius: 5px;
}
.jdn, .jvkp{
    display: none;
}
.jtxt{
    display: inline-table;
    margin: 10px 15px 10px 0;
    /*padding: 3px 10px 3px 3px;*/
    padding: 0;
    background: #fff;
    border: 1px solid #ddd;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    box-shadow: 0 1px 3px rgba(0,0,0,0.055);
    white-space: nowrap;
}
.jtxt > div{
    display: table-cell;
    vertical-align: middle;
}
.jtxt > div:last-child{
    padding-right: 10px;
    color: #131313;
}
.jtxt input{
    margin: 3px 10px 3px 3px;
    padding: 2px 5px 2px 10px;
    /*width: 100%;*/
    background: #fff;
    border: 0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    font-size: 20px;
    box-sizing: border-box;
    outline: none;
}
.jslop:hover{
    background: #e5e5e5;
}
.jslop{
    padding: 0 5px;
    background: #fff;
    color: #693152;
    cursor: pointer;
    font-weight: bold;
}
.jsact{
    background: #693152 !important;
    color: #fff !important;
}
.jdsbm{
    padding-top: 10px;
    text-align: center;
}
.jdsbm a{
    margin: auto;
    padding: 10px 20px 7px !important;
    font-size: 17px !important;
    font-weight: bold !important;
}
.jred{
    padding-top: 10px;
    text-align: center;
    color: #cc0000;
}
/* end joke */

/* user */
#avahd{
    position: relative;
}
#avahd > input{
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
}
/* end user */

/* upload */
#upd{
    position: fixed;
    z-index: 9999;
    top: 10px;
    right: 20px;
}
#upd > div{
    padding: 3px 10px;
    background: rgba(0, 0, 0, 0.75);
    border-radius: 8px;
}
#upd > div .ps{
    width: 200px;
    height: 8px;
    text-align: left;
    background: #dedede;
    background: -moz-linear-gradient(top, #fff 0%, #dedede 100%);
    background: -webkit-linear-gradient(top, #fff 0%,#dedede 100%);
    background: -o-linear-gradient(top, #fff 0%,#dedede 100%);
    background: -ms-linear-gradient(top, #fff 0%,#dedede 100%);
    background: linear-gradient(top, #fff 0%,#dedede 100%);
    border-radius: 4px;
}
#upd > div .ps > div{
    width: 0%;
    height: 8px;
    background: #00ff18;
    background: -moz-linear-gradient(top, #00ff18 0%, #00b211 100%);
    background: -webkit-linear-gradient(top, #00ff18 0%,#00b211 100%);
    background: -o-linear-gradient(top, #00ff18 0%,#00b211 100%);
    background: -ms-linear-gradient(top, #00ff18 0%,#00b211 100%);
    background: linear-gradient(top, #00ff18 0%,#00b211 100%);
    border-radius: 4px;
}
.upfl{
    padding: 5px 0 15px;
}
/* end upload */
/* addnew */
.addnew{
    padding: 15px 0 0;
}
.adnwnm{
    text-align: left;
}
.adnwnm input{
    width: 100% !important;
    min-width: 200px !important;
}
.nmtxa{
    padding-bottom: 3px;
    text-align: left;
}
.txkk{
    width: 100%;
    min-height: 90px;
}
.txkd{
    width: 100%;
    min-height: 90px;
}
.txkaw{
    width: 100%;
    min-height: 150px;
}
.txkawf{
    width: 100%;
    min-height: 225px;
}
/* end addnew */

/* article */
.arts{
    padding: 20px 0 0;
    text-align: left;
}
.arts > div{
    margin: 0 0 10px;
    padding: 5px 8px;
    background: #fff;
    border-radius: 5px;
    /*border: 1px solid #eee;*/
    border: 1px solid #fff1f9;
}
.arts > div > div:first-child a{
    color: #131313;
    display: block;
    font-size: 22px;
    text-decoration: none;
}
.arts > div > div:first-child a:hover{
    color: #693152;
}
.arts > div > div:first-child{
    padding-bottom: 5px;
}
.arts > div > div:nth-child(2){

}
.arts > div > div:last-child{
    position: relative;
    padding-right: 110px;
    min-height: 38px;
    vertical-align: top;
}
.abtps{
    position: absolute;
    bottom: 0;
    right: 0;
}
.avartcs{
    display: inline-block;
    padding: 8px 8px 5px 0;
}
.avartcs img{
    max-width: 25px;
    max-height: 25px;
    border-radius: 1px;
}
.artdata{
    display: inline-block;
    padding: 2px 10px 0 0;
}
.imminiu{
    display: inline-block;
    padding: 5px;
    border: 3px;
}
.imminiu > img{
    max-width: 100px;
    max-height: 100px;
}
/* end article */

/* bbcode */
.butbb{
    display: inline-block;
    margin: 2px;
    padding: 3px;
    cursor: pointer;
}
.butbb > div:nth-child(2){
    position: absolute;
    display: none;
}
.bts{
    font-size: 14px;
    line-height: 20px;
    /* color: #333333; */
    text-align: center;
    text-shadow: 0 1px 1px rgba(255,255,255,0.75);
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    background-color: #f5f5f5;
    background-image: -moz-linear-gradient(top,#ffffff,#e6e6e6);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#ffffff),to(#e6e6e6));
    background-image: -webkit-linear-gradient(top,#ffffff,#e6e6e6);
    background-image: -o-linear-gradient(top,#ffffff,#e6e6e6);
    background-image: linear-gradient(to bottom,#ffffff,#e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #cccccc;
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
    border-bottom-color: #b3b3b3;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffe6e6e6',GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}
.smlbg{
    position: relative;
    display: inline-block;
}
.smlbg > div:first-child{
    display: inline-block;
    margin: 2px;
    padding: 3px;
    cursor: pointer;
}
.smlbg > div:nth-child(2){
    position: absolute;
    display: none;
    top: 100%;
    left: 0;
    width: 200px;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
    -webkit-transition: border linear 0.2s,box-shadow linear 0.2s;
    -moz-transition: border linear 0.2s,box-shadow linear 0.2s;
    -ms-transition: border linear 0.2s,box-shadow linear 0.2s;
    -o-transition: border linear 0.2s,box-shadow linear 0.2s;
    transition: border linear 0.2s,box-shadow linear 0.2s;
}
.bbsml{
    display: inline-block;
    margin: 2px;
    cursor: pointer;
}
.inpyou{
    padding: 5px 8px;
}
.cnimg{
    max-width: 100%;
}
.youtbv{
    position: relative;
    margin-top: 10px;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}
.youtbv > iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/* end bbcode */

video {
    width: 100%    !important;
    height: auto   !important;
}

/* categories */
.edct{
    padding: 20px 0 0;
    text-align: left;
}
.edct > div{
    margin: 0 0 10px;
    padding: 5px 8px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #fff1f9;
}
.edcat{
    display: inline-table;
    margin-right: 20px;
    margin-bottom: 10px;
    border-spacing: 5px 5px;
    border-collapse: separate;
    border: 1px solid #cccccc;
}
.edcat > div{
    display: table-cell;
    vertical-align: middle;
}
.edcat > div:first-child{
    padding: 3px 5px;
    font-size: 16px;
}
.edcat > div:nth-child(2){
    background: url(/img/edit.png) 100% 100% no-repeat;
    background-size: cover;
}
.edcat > div:nth-child(3){
    background: url(/img/delete.png) 100% 100% no-repeat;
    background-size: cover;
}
.edcat > div:nth-child(2), .edcat > div:nth-child(3){
    width: 25px;
    height: 25px;
    cursor: pointer;
}
/* end categories */