@font-face {
    font-family: 'PT Sans Bold';
    src: url('../font/pt-sans-bold.ttf');
    font-weight: bold;
}

* {
    margin: 0;
    padding: 0;
    border: 0;
}
html {
    background: #040e10;
    font-family: PT Sans;
    color: #d0cea3;
    /*color: #c2d4d9;*/
    /*color: #FFF;*/
    font-size: 13px;
    height: 100%;
}
h1 {
  font-size: 24px;
}

input,
textarea,
select,
button,
a,
img {
    outline: none;
}
input {
    font: 18px/44px Arial, Helvetica, sans-serif;
    height: 44px;
    padding: 0 12px;
    color: #333;
    border: none;
    background: #fff;
    -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.4), inset 0 1px 0 #000000, inset 0 -1px 1px #6a7087;
    -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.4), inset 0 1px 0 #000000, inset 0 -1px 1px #6a7087;
    box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.4), inset 0 1px 0 #000000, inset 0 -1px 1px #6a7087;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 300px;
}
@font-face {
    font-family: 'PT Sans';
    src: url('../font/pts55f.eot');
    src: url('../font/pts55f.eot') format('embedded-opentype'), url('../font/pts55f.woff') format('woff'), url('../font/pts55f.ttf') format('truetype'), url('../font/pts55f.svg#PTSansRegular') format('svg');
}
.rz {
    clear: both;
}
.l-align {
    width: 1000px;
    margin: 0 auto;
}
a {
    color: #c9854a;
}
#paginator span a, #paginator .pagi_c span {
    padding: 0px 6px 0px 6px;
    border: 1px solid #484D47;
    text-decoration: none;
}
#paginator span a:hover {
    border: 1px solid #484D47;
    background: #525D4D;
}
#paginator {
    background: url(../img/pager-bg.png) repeat-x center;
    margin: 33px -15px 0px 9px;
    text-align: center;
    line-height: 36px;
}
#paginator .pagi_prev,
#paginator .pagi_next {
    display: none;
}
#paginator .pagi_c span {
    color: #fcc04a;
}
#paginator  a {
    color: #b4d0e3;
}
a:hover {
    text-decoration: none;
}
.l-footer {
    padding-top: 63px;
}
.bg0 {
    width: 745px;
    position: absolute;
    left: -12px;
    z-index: -1;
    background: url(../img/bg0.jpg) repeat-y;
    height: 100%; 
}
.bg1.ru {
    background: url(../img/lang/bg1_ru.jpg) 50% 0 no-repeat;
}
.bg1.ua {
    background: url(../img/lang/bg1_ua.jpg) 50% 0 no-repeat;
}
.bg1.en {
    background: url(../img/lang/bg1_en.jpg) 50% 0 no-repeat;
}
.bg1.es {
    background: url(../img/lang/bg1_es.jpg) 50% 0 no-repeat;
}
.bg1.cn {
    background: url(../img/lang/bg1_cn.jpg) 50% 0 no-repeat;
}
.bg1.tw {
    background: url(../img/lang/bg1_tw.jpg) 50% 0 no-repeat;
}
.bg2.ru {
    background: url(../img/lang/bg2_ru.jpg) 50% 750px no-repeat;
}
.bg2.ua {
    background: url(../img/lang/bg2_ua.jpg) 50% 750px no-repeat;
}
.bg2.en {
    background: url(../img/lang/bg2_en.jpg) 50% 750px no-repeat;
}
.bg2.es {
    background: url(../img/lang/bg2_es.jpg) 50% 750px no-repeat;
}
.bg2.cn {
    background: url(../img/lang/bg2_cn.jpg) 50% 750px no-repeat;
}
.bg2.tw {
    background: url(../img/lang/bg2_tw.jpg) 50% 750px no-repeat;
}
.bg3 {
    background: url(../img/bg3.jpg) 50% bottom no-repeat;
}
.l-header {
    width: 100%;
    height: 133px;
}
.l-top {
    padding-top: 24px;
}
.b-otherProject {
    background-color: rgba(2, 2, 2, 0.6);
    width: 168px;
    height: 28px;
    cursor: pointer;
    position: relative;
    float: left;
    z-index: 11;
    margin-left: -29px;
}
.b-otherProject .name {
    color: white;
    font-family: PT Sans Bold;
    font-weight: bold;
    padding: 5px 0px 0px 11px;
}
.b-otherProject .name:hover {
    color: #fee4c5;
}
.b-otherProject .arrow {
    background: url(../img/arrow.png);
    width: 11px;
    height: 6px;
    position: absolute;
    top: 10px;
    right: 6px;
}
.selectOtherProject {
    background-color: rgba(2, 2, 2, 1);
    width: 458px;
    height: 156px;
    position: absolute;
    display: none;
    top: 28px;
    padding: 10px 0px 0 12px;
}
.selectOtherProject a:hover {
    opacity: 0.5;
}
.selectOtherProject .project1 { /*epicl2.com*/
    float: left;
    width: 98px;
    height: 56px;
    background: url(../img/project.png);
}
.selectOtherProject .project2 { /*uwow.biz*/
    float: left;
    width: 98px;
    height: 56px;
    background: url(../img/project.png) -117px 0;
}
.selectOtherProject .project3 { /*cata.uwow.biz*/
    float: left;
    width: 98px;
    height: 58px;
    background: url(../img/project.png) -234px 0;
}
.selectOtherProject .project4 { /*lich.uwow.biz*/
    float: left;
    width: 98px;
    height: 58px;
    background: url(../img/project.png) -351px 0;
}
.selectOtherProject .project5 { /*panda.uwow.biz*/
    float: left;
    width: 98px;
    height: 58px;
    background: url(../img/project.png) -468px 0;
}
.selectOtherProject .project6 { /*legion.uwow.biz*/
    float: left;
    width: 98px;
    height: 58px;
    background: url(../img/project.png) 0px -76px;
}
.selectOtherProject .project7 { /*honepic.ru*/
    float: left;
    width: 98px;
    height: 58px;
    background: url(../img/project.png) -117px -76px;
}
.selectOtherProject .project8 { /*upwu.ru*/
    float: left;
    width: 98px;
    height: 58px;
    background: url(../img/project.png) -234px -76px;
}
.selectOtherProject .project9 { /*torrentu.biz*/
    float: left;
    width: 98px;
    height: 58px;
    background: url(../img/project.png) -351px -76px;
}
.selectOtherProject .project10 { /*uwowhead.ru*/
    float: left;
    width: 98px;
    height: 58px;
    background: url(../img/project.png) -468px -76px;
}
.selectOtherProject .project11 { /*immage.biz*/
    float: left;
    width: 98px;
    height: 58px;
    background: url(../img/project.png) -585px 0;
}
.selectOtherProject .dot {
    background: url(../img/dot.png);
    width: 2px;
    height: 68px;
    float: left;
    margin: 0 8px;
    position: relative;
    top: -8px;
}
.b-l2top {
    float: left;
    margin-left: 268px;
    opacity: 0.3;
    -webkit-transition: opacity 0.5s ease-out 0.5s;
    -moz-transition: opacity 0.5s ease-out 0.5s;
    -o-transition: opacity 0.5s ease-out 0.5s;
    transition: opacity 0.5s ease-out 0.5s;
}
.b-l2top:hover {
    opacity: 1;
}
.b-auth {
    float: right;
    height: 28px;
    background-color: rgba(2, 2, 2, 0.6);
    line-height: 28px;
    padding: 0 10px;
    color: #e8bdb2;
    margin-right: -27px;
}
.b-auth a {
    text-decoration: none;
    color: #e8bdb2;
    font-family: PT Sans Bold;
    font-weight: bold;
}
.b-auth a:hover {
    color: #fff;
}
.b-auth #reg {
    color: #c3988b;
    font-weight: normal;
}
.b-auth #reg:hover {
    color: #e8bdb2;
}
.b-menu {
    width: 100%;
    float: left;
    margin-top: 42px;
}
.b-menu a {
    float: left;
    color: white;
    font-family: PT Sans Bold;
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
    height: 11px;
}
.b-menu a:hover {
    color: #fee4c5;
}
.b-menu .link2 {
    margin-right: 200px;
}
.b-menu .dot {
    background: url(../img/dotMenu.png);
    width: 3px;
    height: 7px;
    float: left;
    margin: 7px 17px 0px 15px;
}
.b-menu.ru .dot {
    margin: 7px 22px 0px 22px;
}
.b-menu.ua .dot {
    margin: 7px 22px 0px 22px;
}
.b-menu.en .dot {
    margin: 7px 25px 0px 25px;
}
.b-menu.cn .dot {
    margin: 7px 32px 0px 32px;
}
.b-menu.tw .dot {
    margin: 7px 31px 0px 31px;
}
.l-middle {
    width: 100%;
    min-height: 1835px;
    position: relative;
}
.start {
    float: left;
    width: 315px;
    height: 102px;
    margin: 101px 0 0 190px;
    -webkit-transition: opacity 0.5s ease-out 0.5s;
    -moz-transition: opacity 0.5s ease-out 0.5s;
    -o-transition: opacity 0.5s ease-out 0.5s;
    transition: opacity 0.5s ease-out 0.5s;
    opacity: 0;
    position: relative;
    top: 1px;
    left: 9px;
}
.start.ru {
    background: url(../img/lang/start_ru.jpg);
    background-position1: 0.6em 0.1em;
    background-position1: 8px -101px;
    background-position: 0 -102px;
}
.start.ua {
    background: url(../img/lang/start_ua.jpg) 0 -102px;
}
.start.en {
    background: url(../img/lang/start_en.jpg) 0 -102px;
}
.start.es {
    background: url(../img/lang/start_es.jpg) 0 -102px;
}
.start.cn {
    background: url(../img/lang/start_cn.jpg) 0 -102px;
}
.start.tw {
    background: url(../img/lang/start_tw.jpg) 0 -102px;
}
.start:hover {
    opacity: 1;
}
.l-status {
    float: right;
    margin: 46px -40px 0 0;
    position: absolute;
    right: 10px;
}
.l-status #status {
    width: 352px;
    height: 80px;
    overflow: hidden;
}
#status a {
    text-align: center;
    display: inherit;
    position: relative;
    z-index: 1000;
    color: #fff;
    font-size: 16px;
    text-decoration: none;
}
.b-stat {
    height: 40px;
    width: 352px;
    background: url(../img/shadowStatus.png);
    font-family: Minion Pro;
    font-size: 20px;
    position: relative;
    z-index: 3;
}
.b-stat a {
    float: left;
    line-height: 40px;
    color: #ffdcdc;
    text-shadow: 1px 1px 1px black;
    text-decoration: none;
    width: 135px;
    overflow: hidden;
    margin-left: 40px;
}
.b-stat a:hover {
    text-decoration: underline;
}
.b-stat .on {
    background: url(../img/stat.png);
    width: 49px;
    height: 28px;
    float: left;
    position: relative;
    top: 4px;
}
.b-stat .off {
    background: url(../img/stat.png) 0 -42px;
    width: 49px;
    height: 28px;
    float: left;
    position: relative;
    top: 4px;
}
.b-stat .online {
    float: left;
    line-height: 40px;
    font-family: PT Sans Bold;
    font-weight: bold;
    color: #fee4c5;
    text-shadow: 1px 1px 1px black;
    margin-left: 20px;
}
.otherWorld {
    background: url(../img/bgOtherWorld.png);
    width: 408px;
    height: 441px;
    position: absolute;
    top: 40px;
    left: -38px;
    z-index: 2;
    display: none;
}
.openWorld {
    cursor: pointer;
    height: 25px;
    position: absolute;
    z-index: 10;
    top: 110px;
    background-position: 0 0 ;
    width: 350px;
    color: white;
    text-align: center;
}
.openWorld span {
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    padding: 5px 25px 5px 5px;
    background-color: rgba(2, 2, 2, 0.3);
}
.openWorld span:hover {
    color: #fee4c5;
}
.openWorld .arrow {
    background: url(../img/arrow.png);
    width: 11px;
    height: 6px;
    position: absolute;
    top: 6px;
    right: 118px
}
.l-left {
    width: 696px;
    padding-top: 15px;
    float: left;
    position: relative;
}
.b-newsItem {
    position: relative;
    margin-bottom: 10px;
    padding-left: 10px;
}
.b-newsItem .line {
    width: 765px;
    float: left;
    position: relative;
    left: -44px;
    bottom: -25px;
    margin-bottom: 15px;
}
.b-newsItem .line .img {
    float: left;
    width: 79px;
    height: 54px;
    position: relative;
    left: 18px;
    top: -10px;
    overflow: hidden;
}
.b-newsItem .line .titles {
    float: left;
    color: #ffb100;
    font-family: Minion Pro;
    font-size: 18px;
    text-shadow: 1px 1px 1px black;
    z-index: 3;
    position: relative;
}
.b-newsItem .line .titles a {
    color: #ffb100;
    text-decoration: none;
}
.b-newsItem .line .titles a:hover {
    text-decoration: underline;
}
.b-newsItem .line .links {
    float: right;
    background: url(../img/link.png);
    width: 10px;
    height: 11px;
    position: relative;
    top: 6px;
    margin-left: 5px;
    margin-right: 8px;
}
.b-newsItem .line .date {
    float: left;
    color: #678d76;
    font-size: 11px;
    text-shadow: 1px 1px 1px black;
    line-height: 25px;
    z-index: 3;
    position: relative;
}
.text span:first-letter {
    margin-left: 20px;
}
.b-newsItem .text {
    text-shadow: 1px 1px 1px black;
    margin-left: 10px;
    width: 680px;
    position: relative;
    z-index: 2;
    text-align: justify;
    line-height: 22px;
}
.b-newsItem .shadow {
    background: url(../img/shadowNews.png);
    position: absolute;
    bottom: -50px;
    width: 700px;
    height: 96px;
    z-index: 1;
}
.l-right {
    float: left;
    width: 290px;
}
.b-forum {
    margin: 148px 0px 0px 18px;
    text-align: center;
    width: 100%;
    height: 218px;
}
.b-forum a {
    color: #d0cea3;
    text-shadow: 1px 1px 1px black;
    font-size: 12px;
    text-transform: uppercase;
    margin-bottom: 22px;
    display: block;
}
.b-forum a .ico {
    background: url(../img/icoFor.png);
    width: 9px;
    height: 11px;
    display: inline-block;
    position: relative;
    top: 2px;
    right: 2px;
}
.b-social {
    margin: -36px 0 0 10px;
    display: inline-block;
}
.b-social a {
    -webkit-transition: opacity 0.2s ease-out 0.2s;
    -moz-transition: opacity 0.2s ease-out 0.2s;
    -o-transition: opacity 0.2s ease-out 0.2s;
    transition: opacity 0.2s ease-out 0.2s;
    opacity: 0.7;
}
.b-social a:hover {
    opacity: 1;
}
.b-social .telegram {
    width: 50px;
    height: 50px;
    float: left;
    margin-left: 20px;
    background: url(../img/button/telegram.png) no-repeat;
    background-size: 50px;
}
.b-social .vk {
    width: 50px;
    height: 50px;
    float: left;
    margin-left: 20px;
    background: url(../img/button/vk.png) no-repeat;
    background-size: 50px;
}
.b-social .tw {
    width: 31px;
    height: 31px;
    float: left;
    margin-left: 20px;
    background: url(../img/button/tw.png) no-repeat;
}
.b-social .youtube {
    width: 50px;
    height: 50px;
    float: left;
    margin-left: 20px;
    background: url(../img/button/youtube.png) no-repeat;
    background-size: 50px;
}
.b-social .discord {
    width: 50px;
    height: 50px;
    float: left;
    margin-left: 20px;
    background: url(../img/button/discord.png) no-repeat;
    background-size: 50px;
}
.playVideo {
    display: block;
    height: 37px;
    width: 37px;
    cursor: pointer;
    margin: 245px 0px 0px 167px;
    -webkit-transition: opacity 0.2s ease-out 0.2s;
    -moz-transition: opacity 0.2s ease-out 0.2s;
    -o-transition: opacity 0.2s ease-out 0.2s;
    transition: opacity 0.12s ease-out 0.2s;
    background: url(../img/play.png) 0 -37px;
    opacity: 0;
}
.playVideo:hover {
    opacity: 0.7;
}
.l-footer {
    position: relative;
}
.l-footer .copy {
    color: #677f8d;
    opacity: 0.5;
    padding-bottom: 91px;
}
.l-footer .copy #cop {
    color: #93a1a6;
}
.l-footer #banners {
    margin-top: -83px;
}
.l-footer #banners a {
    float: left;
    margin-top: 20px;
    margin-right: 12px;
    opacity: 0.5;
    -webkit-transition: opacity 0.5s ease-out 0.1s;
    -moz-transition: opacity 0.5s ease-out 0.1s;
    -o-transition: opacity 0.5s ease-out 0.1s;
    transition: opacity 0.5s ease-out 0.1s;
}
.l-footer #banners a:hover {
    opacity: 1;
}
.main-title-big {
    font: 100 32px "Adonis", "Times New Roman", Times, serif;
    text-align: center;
    margin: 0 0 20px 0;
    color: #badcf2;
    text-shadow: 1px 1px 1px #000;
    opacity: 0.99;
}
.btn {
    width: 184px;
    height: 46px;
    font: 20px/48px "Adonis", Arial;
    color: #e0ddf4;
    text-align: center;
    text-shadow: 1px 1px 2px #000;
    border: none;
    cursor: pointer;
    background: url(../img/button.png) no-repeat center;
    box-shadow: none;
    position: relative;
    right: 5px;
    bottom: 0px;
}
.forget {
    position: absolute;
    right: 19px;
    bottom: 14px;
    width: 30px;
    height: 30px;
    background: url(../img/forget.png);
    display: block;
    opacity: 0.5;
}
.forget:hover {
    opacity: 1;
}
#cp a {
    color: #fff;
}
.logo {
    width: 288px;
    height: 142px;
    position: relative;
    display: block;
    left: 600px;
    top: 20px;
}
#form-aut .field {
    width: 324px;
    margin: 10px auto 0 auto;
    display: block;
}
#form-aut .field input {
    width: 300px;
}
.form-password .forget {
    background: url(../images/forget.png) no-repeat center;
    width: 30px;
    height: 30px;
    position: absolute;
    right: 18px;
    top: 86px;
    opacity: 0.5;
    filter:alpha(opacity=50);
}
.form-captcha .captcha {
    position: absolute;
    top: 133px;
    right: 15px; 
}
.form-captcha .captcha img {
    height: 44px;
}
.form-submit {
    width: 190px;
    margin: 10px auto;
}
.form-register {
    text-align: center;
}
#form-aut .field select {
    width:324px !important;
}

#form-aut .cp-link {
    margin: 10px auto;
}
#form-aut .exit-link {
    margin: 0 auto;
    width: 46px;
    display: block;
}
#form-aut .admin-link {
    display: block;
    width: 120px;
    margin: 0 auto;
    text-align: center;
}
.popUp {
    color: #444;
    text-shadow: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 15px;
    width: 377px;
    height: 307px;
    background: url(../img/bgPopup.png);
}
.b-closes {
    background: url(../img/close.png);
    position: absolute;
    top: 22px;
    right: 22px;
    width: 18px;
    height: 18px;
    cursor: pointer;
    z-index: 1111;
}
.pagination {
    display: none;
    font-size: 0;
    text-align: center;
    width: 526px;
    height: 18px;
    overflow: hidden;
    margin-top: 40px;
}
.pagination span {
    text-decoration: none;
    color: #9898ee;
    font-size: 11px;
    border: none;
    line-height: 100px;
    font-size: 0;
    width: 18px;
    height: 18px;
    display: inline-block;
    background: url(../img/pagin.png);
    margin: 0 17px;
}
.pagination a {
    text-decoration: none;
    color: black;
    font-size: 11px;
    border: none;
    line-height: 100px;
    font-size: 0;
    text-indent: -999px;
    width: 18px;
    height: 18px;
    display: inline-block;
    margin: 0 17px;
    background: url(../img/pagin.png) 18px 0;
}
.nav_ext {
    border: none !important;
}
#form-aut {
    margin: 40px 0 0;
}
.form-password .forget {
    right: 46px;
    top: 61px;
}
.form-captcha .captcha {
    position: absolute;
    top: 273px;
    right: 88px;
    cursor:pointer;
}
.form-captcha .captcha2 {
    position: absolute;
    top: 160px;
    right: 42px;
    cursor: pointer;
}
#okAuth {
    display: none;
}
#noAuth {
    display: block;
}
#full-online a {
    text-decoration: none;
    font-weight: normal;
}
#full-online {
    position: absolute;
    top: 333px;
    left: -308px;
    font: 18px "Adonis", Georgia, Times, serif;
    color: #efe098;
    margin: 18px 0 0 568px;
}
#full-online > a {
    color: #efe098;
}
#full-online > a > span {
    color: #f4ffdb;
}
.popUp2 {
    width: 660px;
    height: 414px;
}
.b-closes {
    top: -18px;
    right: -18px;
}
#list-servers {
    margin: 10px 0 0;
}
#list-servers thead td {
    background: rgba(4,109,64,0.4);
    padding: 10px 4px 10px 0;
    color: #fff;
    font-family: PT Sans Bold;
    font-weight: bold;
}
#list-servers tbody td {
    background: rgba(4,109,64,0.2);
    padding: 4px 0;
}
#list-servers tbody:nth-child(2n+1) tr td {
    background: rgba(4,109,64,0.1);
}
#list-servers .type {
    padding-left: 4px;
}
#list-servers .status,
#list-servers .online,
#list-servers .max-online,
#list-servers .uptime,
#list-servers .pers {
    text-align: center;
}
#list-servers .online {
    font-family: PT Sans Bold;
    font-weight: bold;
    color: #c8e8c2;
    font-size: 13px;
}
#list-ladder {
    margin: 10px 0 0;
}
#list-ladder thead td {
    background: rgba(4,109,64,0.4);
    padding: 10px;
    color: #fff;
    font-family: PT Sans Bold;
    font-weight: bold;
}
#list-ladder tbody td {
    background: rgba(4,109,64,0.2);
    padding: 4px 8px;
}
#list-ladder a { color: #ffb100 }
#list-ladder a:hover { color: #FFF !important }
#list-ladder tbody:nth-child(2n+1) tr td {
    background: rgba(4,109,64,0.1);
}
#list-ladder .type {
    padding-left: 4px;
}
#list-ladder .status,
#list-ladder .win,
#list-ladder .loss,
#list-ladder .rating,
#list-ladder .realm {
    text-align: center;
}
#list-ladder .win {
    font-family: PT Sans Bold;
    font-weight: bold;
    color: #2dd300;
    font-size: 13px;
}
#list-ladder .loss {
    font-family: PT Sans Bold;
    font-weight: bold;
    color: #db0000;
    font-size: 13px;
}
#list-ladder .rating {
    color: #9E3403;
    font: bold 12px/100% "Arial Black", Arial, Verdana, sans-serif;
    font-weight:900;
}
#list-ladder.typehead {
    padding-left: 4px;
}
#list-ladder .status,
#list-ladder .winhead,
#list-ladder .losshead,
#list-ladder .ratinghead,
#list-ladder .realmhead {
    text-align: center;
}
#list-ladder .ratinghead {
    font-family: PT Sans Bold;
    font-weight: bold;
    color: #c8e8c2;
    font-size: 13px;
}
.streams-wrapper {
    display: none;
    padding-top: 15px;
}
.streams-titles {
    text-align: center;
    padding: 15px 0 0;
}
.streams-titles a {
    color: #FFB100;
    text-decoration: none;
    font-family: Minion Pro;
}
.streams-titles a:hover {
    text-decoration: underline;
}
.streams {
    padding: 20px 0 0 15px;
    text-align: center;
    margin-bottom: -10px;
}
.stream-item {
    display: inline-block;
    padding-right: 15px;
}
.b-lang-menu {
    margin-left: 309px;
    width: 130px;
    cursor: pointer;
    position: relative;
    float: left;
    z-index: 11;
    background-color: rgba(2, 2, 2, 0.6);
}
.b-lang-menu a {
    display: block;
    text-decoration: none;
    margin: 2px 0px 2px 0px;
}
.b-lang-menu a.select {
    margin-left: 13px;
}

.b-lang-menu a span:hover {
    color: #fee4c5;
}
.b-lang-menu a span {
    margin-left: 7px;
    color: white;
}
.b-lang-menu img {
    width: 24px;
    height: 24px;
    vertical-align: middle;
}
.b-lang-menu .arrow {
    background: url(../img/arrow.png);
    width: 11px;
    height: 6px;
    position: absolute;
    top: 10px;
    right: 6px;
}
.b-lang-menu-select {
    background-color: rgba(2, 2, 2, 1);
    width: 117px;
    position: absolute;
    display: none;
    padding: 0px 0px 6px 13px;
}
.spoller-head {
    cursor: pointer;
}
.spoller-content {
    display: none;
}




label {
    cursor: pointer;
    transition: all 250ms;
}
.container {
    display: none;
}
.container.cn, .container.tw {
    display: block;
}
.container h2 {
    margin-bottom: 20px;
}
.container a {
    text-align: center;
    display: block;
    color: #da513d;
}
.container .modal-content, .container .modal-background {
    visibility: hidden;
    width: 0;
    height: 0;
    opacity: 0;
    overflow: hidden;
    cursor: pointer;
}
.container .modal-background {
    transition: height 250ms;
}
.container .modal-content {
    transform: scale(0);
    transition: transform 500ms;
}
.container #modal {
    display: none;
}
.container #modal:checked ~ .modal-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000000;
    visibility: visible;
    opacity: 0.9;
    transition: height 250ms;
    z-index: 999;
}
.container #modal:checked ~ .modal-content {
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -10%;
    margin-left: -25%;
    width: 50vw;
    height: auto;
    padding: 40px;
    background-color: white;
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    cursor: auto;
    transform: scale(1);
    transition: transform 500ms;
    z-index: 1000;
    color: #da513d;
}
.container #modal:checked ~ .modal-content .modal-close {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 22px;
    color: rgba(51, 51, 51, 0.4);
    transition: color 200ms, transform 500ms;
}
.container #modal:checked ~ .modal-content .modal-close:hover, .container #modal:checked ~ .modal-content .modal-close:focus {
    color: #333;
    transform: rotate(360deg);
}
.container #modal:checked ~ .modal-content p {
    position: relative;
    margin: 0 0 20px 0;
    font-weight: 200;
    font-size: 14px;
    line-height: 1.6;
}
.container #modal:checked ~ .modal-content .modal-content-button {
    position: relative;
    float: right;
    margin: 0;
    padding: 10px 20px;
    color: white;
    font-weight: 100;
    background-color: #2980b9;
}
.container #modal:checked ~ .modal-content .modal-content-button:hover, .container #modal:checked ~ .modal-content .modal-content-button:focus {
    background-color: #409ad5;
}