html{height:100%;}
body{
    margin:0;
    padding:0;
    height:100%;
    color:#bea786;
    font:14px/16px 'hermes', georgia, arial, serif;
    background:#fff;
    min-width:1280px;
}
img{
    border-style:none;
    vertical-align:bottom;
}
a{
    color:#348bce;
    outline:none;
    text-decoration:underline;
}
a:hover{text-decoration:none}
*{outline:none;}
header,
nav,
section,
article,
aside,
footer,
figure,
menu,
dialog{
    display:block;
}
#wrapper{
    max-width:1920px;
    min-width:1280px;
    margin:0 auto;
    height:100%;
    min-height:830px;
    position:relative;
    overflow:hidden;
}
.char-holder{
    position:absolute;
    bottom:114px;
    left:133px;
    width:975px;
    margin:0;
}
.char-holder:after{
    display:table;
    content:'';
    clear:both;
}
.char-holder .rasa{
    position:relative;
    float:left;
    width:486px;
    height:592px;
}
.char-holder .flag{
    position:absolute;
    bottom:100%;
    left:50%;
    width:231px;
    height:163px;
    margin:0 0 -45px -100px;
    overflow:hidden;
}
.char-holder .flag.flag2{margin:0 0 -47px -92px;}
/*.char-holder .rasa:hover .flag img{
	margin:-163px 0 0;
}*/
.char-holder .rasa.active .flag img{margin:-163px 0 0;}
.char{
    position:absolute;
    text-align:center;
}
.char-holder .description{
    position:absolute;
    top:100%;
    left:-9999px;
    opacity:0;
    -webkit-transition:opacity linear .5s;
    -o-transition:opacity linear .5s;
    transition:opacity linear .5s;
    width:590px;
    text-align:center;
    font-size:18px;
    color:#bea768;
    padding:30px 10px 33px;
    z-index:50;
    margin:-10px 0 0;
}
.char-holder .description.human{background:url(../images/desc-gnome.png) no-repeat;}
.char-holder .description.gnome{background:url(../images/desc-gnome.png) no-repeat;}
.char-holder .rasa:hover .description{
    opacity:1;
    left:-59px;
}
/*.char-holder .rasa.active .description{
	opacity:0;
	left:-9999px;
}*/
.description p{margin:0;}
.char .img-holder{overflow:hidden;}
.char1{
    top:0px;
    left:0;
}
.char1 .img-holder{
    width:243px;
    height:602px;
}
.char1:hover img,
.char1.active img{
    margin:-596px 0 0;
}
.char2{
    top:13px;
    left:207px;
}
.char2 .img-holder{
    width:294px;
    height:579px;
}
.char2:hover img,
.char2.active img{
    margin:-579px 0 0;
}
.char3{
    top:66px;
    left:-10px;
}
.char3 .img-holder{
    width:274px;
    height:535px;
}
.char3:hover img,
.char3.active img{
    margin:-535px 0 0;
}
.char4{
    top:62px;
    left:226px;
}
.char4 .img-holder{
    width:310px;
    height:535px;
}
.char4:hover img,
.char4.active img{
    margin:-525px 0 0;
}
.main-block{
    position:absolute;
    top:50%;
    right:226px;
    width:310px;
    height:570px;
    margin:-285px 0 0;
}
.logo, .logo-en{
    display:block;
    width:310px;
    height:137px;
    margin:0 0 17px;
}
.logo a, .logo-en a{
    display:block;
    text-indent:-9999px;
    height:100%;
    margin-top: -15px;
    background:url(../images/logo.png) no-repeat;
}
.logo-en a{
    background:url(../images/en/logo.png) no-repeat;
}
.form-default{
    margin:0;
    padding:0;
    margin:0 auto;
    width:234px;
}
.form-default fieldset{
    margin:0;
    padding:0;
    border:none;
}
.form-default .row{position:relative;}
.form-default input[type="text"],
.form-default input[type="email"],
.form-default input[type="number"],
.form-default input[type="password"]{
    font-size:18px;
    line-height:28px;
    color:#cbc0ac;
    background:url(../images/input-bg.png) no-repeat;
    border:none;
    height:48px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    padding:0 15px 8px 45px;
    position:relative;
    width:100%;
    font-family:'hermes';
}
.form-default input:focus::-webkit-input-placeholder,
.form-default textarea:focus::-webkit-input-placeholder{
    color:transparent;
}
.form-default input:focus:-moz-placeholder,
.form-default textarea:focus:-moz-placeholder{
    color:transparent;
}
.form-default input:focus:-ms-input-placeholder,
.form-default textarea:focus:-ms-input-placeholder{
    color:transparent;
}
.form-default input:focus::-moz-placeholder,
.form-default textarea:focus::-moz-placeholder{
    color:transparent;
}
.form-default input::-webkit-input-placeholder,
.form-default textarea::-webkit-input-placeholder{
    color:#87785e;
    opacity:1;
}
.form-default input:-moz-placeholder,
.form-default textarea:-moz-placeholder{
    color:#87785e;
    opacity:1;
}
.form-default input::-moz-placeholder,
.form-default textarea::-moz-placeholder{
    color:#87785e;
    opacity:1;
}
.form-default input:-ms-input-placeholder,
.form-default textarea:-ms-input-placeholder{
    color:#87785e;
    opacity:1;
}
.form-default .input-holder{position:relative;}
.form-default .input-holder:after{
    position:absolute;
    content:'';
    top:2px;
    left:5px;
    width:34px;
    height:34px;
}
.form-default .input-holder.email:after{background:url(../images/email-icon.png) no-repeat;}
.form-default .input-holder.nickname:after{background:url(../images/nickname-icon.png) no-repeat;}
.form-default .input-holder.password1:after{background:url(../images/password1-icon.png) no-repeat;}
.form-default .input-holder.password2:after{background:url(../images/password2-icon.png) no-repeat;}
.form-default .error-msg{
    position:absolute;
    right:264px;
    top:0;
    -webkit-box-shadow:-3px 3px 2px 0 rgba(0,0,0,0.34);
    box-shadow:-3px 3px 2px 0 rgba(0,0,0,0.34);
    background:url(../images/error-bg.jpg) repeat-x;
    font-size:15px;
    color:#a40a01;
    font-weight:bold;
    height:38px;
    line-height:38px;
    text-align:right;
    white-space:nowrap;
    /*max-width:300px;*/
}
.form-default .error-msg:after,
.form-default .error-msg:before{
    position:absolute;
    content:'';
    top:0;
    bottom:0;
}
.form-default .error-msg:after{
    background:url(../images/error-left.png) no-repeat;
    right:100%;
    width:15px;
}
.form-default .error-msg:before{
    width:34px;
    background:url(../images/error-right.png) no-repeat;
    left:100%;
}
.form-default .row.error .error-msg{display:block;}
.form-default .holder{
    background:url(../images/form-bg.png);
    border-radius:5px;
    -webkit-border-radius:5px;
    overflow:hidden;
    text-align:center;
    padding:15px 5px;
    margin:0 3px 0 12px;
}
.form-default .social-block{margin:0 0 23px;}
.form-default .title{
    display:block;
    font-size:14px;
    line-height:16px;
    color:#cbc0ac;
    margin:0 0 9px;
    font-weight:normal;
}
.social-list{
    padding:0;
    margin:0 -5px;
    list-style:none;
    letter-spacing:-4px;
    text-align: center;
}
.social-list li{
    letter-spacing:normal;
    display:inline-block;
    vertical-align:top;
    width:54px;
    height:44px;
    overflow:hidden;
    padding:5px 5px;
}
.social-list a{
    display:block;
    height:100%;
    width:100%;
    text-indent:-9999px;
    background-repeat:no-repeat;
}
.social-list a.gl{background-image:url(../images/gl.png);}
.social-list a.ya{background-image:url(../images/ya.png);}
.social-list a.vk{background-image:url(../images/vk.png);}
.social-list a.fb{background-image:url(../images/fb.png);}
.social-list a.ok{background-image:url(../images/ok.png);}
.social-list a.mail{background-image:url(../images/mail.png);}
.social-list a:hover{background-position:0 -44px;}
.social-list a:active{background-position:0 -88px;}
.form-default input[type="submit"]{
    cursor:pointer;
    border:none;
    display:block;
    width:209px;
    height:57px;
    margin:0 auto 8px;
    text-indent:-9999px;
}
.form-default input[type="submit"].green{background:url(../images/btn-green.png) no-repeat;}
.form-default input[type="submit"].green-en{background:url(../images/en/btn-green.png) no-repeat;}
.form-default input[type="submit"].blue{background:url(../images/btn-blue.png) no-repeat;}
.form-default input[type="submit"].red{background:url(../images/btn-red.png) no-repeat;}
.form-default input[type="submit"].orange{background:url(../images/btn-orange.png) no-repeat;}
.form-default input[type="submit"]:hover{
    background-position:0 -56px;
}
.form-default input[type="submit"]:active{
    background-position:0 -112px;
}

.form-default input[type="button"].green{
    cursor:pointer;
    border:none;
    display:block;
    width:209px;
    height:57px;
    margin:0 auto 8px;
    text-indent:-9999px;
    background:url(../images/btn-green.png) no-repeat;
    background-position:0 -168px;
}


.form-default .msg{
    color:#8b7b5e;
    display:block;
    font-family:'tahoma', sans-serif;
    font-size:11px;
    line-height:13px;
    padding:0 6px;
}
.form-default .msg a{
    display:inline-block;
    color:#8b7b5e;
}
.bg1{
    position:absolute;
    bottom:0;
    left:0;
    margin:0 0 -67px -243px;
    height:1080px;
    width:2429px;
    background:url(../images/bg1-1920.png) no-repeat;
}
.bg2{
    position:absolute;
    bottom:0;
    right:-113px;
    width:692px;
    height:1080px;
    background:url(../images/bg2-1920.png) no-repeat;
}
.bg3{
    position:absolute;
    bottom:0;
    left:50%;
    margin:0 0 0 -600px;
    width:1272px;
    height:116px;
    background:url(../images/bg3-1920.png) no-repeat;
}
.bg4{
    position:absolute;
    top:-50px;
    left:-325px;
    width:2429px;
    height:1080px;
    background:url(../images/bg.jpg) no-repeat;
}
@media only screen and (max-width:1722px){
    .main-block{right:70px;}
    .char-holder{bottom:119px;}
}
@media only screen and (max-width:1600px){
    .bg4{
        background-image:url(../images/bg-1600.jpg);
        height:1200px;
        width:2000px;
        left:-492px;
        top:-60px;
    }
}
@media only screen and (max-height:900px){
    .bg4{
        background-image:url(../images/bg-1600-2.jpg) !important;
        height:900px;
        left:-103px;
        top:-75px;
    }
}
@media only screen and (max-width:1500px){
    .bg1{margin-left:-293px;}
    .char-holder{left:83px;}
}
@media only screen and (max-width:1450px){
    .main-block{right:20px;}
    .char-holder .rasa:hover .description,
    .char-holder .rasa.active .description{
        left:10px;
    }
}
@media only screen and (max-width:1440px){
    .bg4{
        background-image:url(../images/bg-1440.jpg);
        width:1562px;
        left:-160px;
        height:900px;
    }
}
@media only screen and (max-width:1400px){
    .bg1{margin-left:-343px;}
    .char-holder{left:33px;}
}
@media only screen and (max-width:1366px){
    .bg4{
        background-image:url(../images/bg-1366.jpg);
        width:1626px;
        height:768px;
        left:-251px;
    }
    .bg1{margin-left:-323px;}
    .char-holder{left:13px;}
}
@media only screen and (max-width:1280px){
    .bg4{
        background-image:url(../images/bg-1280.jpg);
        width:1626px;
        height:1024px;
        left:-330px;
        top:-67px;
    }
}

/*For popup reg error*/
.form-register .error .ico-valide{background-position: 0 -60px;}
.popup-reg-error{
    position: absolute;
    left: -9999px;
    top: -9999px;
    z-index: 200;
    width: 320px;
    height: 176px;
    background: url("/img/reg/bg-popup-reg-error.png") no-repeat;
}
.popup-reg-error .holder{
    padding: 25px;
}
.popup-reg-error .txt{
    text-align: center;
    color: #442c01;
    font:16px Arial, Helvetica, sans-serif;
    height: 100px;
    width: 100%;
    text-align: center;
    display: table;
}
.popup-reg-error .txt .frame{
    display: table-cell;
    vertical-align: middle;
}
.popup-reg-error p{
    margin: 0 0 5px;
    font: bold 14px/17px "times new roman", times, serif;
    letter-spacing: 1px;
}
.popup-reg-error .btn-close{
    width: 52px;
    height: 28px;
    display: block;
    background: url("/img/reg/btn-ok-popup.png") no-repeat;
    overflow: hidden;
    text-indent: -9999px;
    margin: 0 auto;
}
/*END For popup reg error*/

@font-face {
    font-family: 'Hermes';
    font-style: normal;
    font-weight: 400;
    src: local('Hermes'), local('Hermes-Normal'),
    url(../fonts/hermes_a2288fa8f94700c7bf9bc86252bb9823.woff) format('woff'),
    url(../fonts/hermes_a2288fa8f94700c7bf9bc86252bb9823.ttf) format('truetype');
}

/* Для выбора языка НАЧАЛО*/
.lang-list{
    margin: 0;
    padding: 0;
    list-style: none;
    position: absolute;
    right: 172px;
    top: 100px;
    overflow: hidden;
}
.lang-list li{
    float: left;
    padding-left: 3px;
}
.lang-list li a{
    display: block;
    overflow: hidden;
    text-indent: -9999px;
    width: 48px;
    height: 35px;
    background: url("/img/new_main/lang.png") no-repeat;
}
.lang-list li a.ru{
    background-position: 0 -122px;
}
.lang-list li a.ru:hover{
    background-position: 0 -81px;
    #background-position: 0 -1px;
}
.lang-list li.active a.ru{
    background-position: 0 -41px;
}
.lang-list li a.eng{
    background-position: 0 -293px;
}
.lang-list li a.eng:hover{
    #background-position: 0 -172px;
    background-position: 0 -252px;
}
.lang-list li.active a.eng{
    background-position: 0 -212px;
}
/* Для выбора языка КОНЕЦ*/


/* cookies */
.cookies-panel {
    position: fixed;
    left: 20%;
    right: 0;
    bottom: 0;
    z-index: 999999;
    transform: translateY(100%);
    width: 60%;
}

.cookies-panel__content {
    font-family: "Fira Sans";
    background-color: rgba(44, 44, 44, .9);
    border-radius: 2px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 20px 20px;
}

.cookies-panel__body {
    flex: 1;
    padding-right: 16px;
    font-size: 12px;
    line-height: 1.6;
    color: #fff;
}

.cookies-panel__link {
    display: block;
    color: rgba(23, 185, 200, 1);
    transition: all 0.25s;
}

.cookies-panel__link:hover {
    color: rgba(23, 185, 200, 0.8);
}

.cookies-panel__link:active {
    color: rgba(23, 185, 200, 0.6);
}

.cookies__side {
    display: flex;
    justify-content: center;
    margin-top: 10px;
    margin-right: 14px;
}

.cookies-panel__button {
    font-family: "Fira Sans";
    background-color: rgba(23, 185, 200, 0.8);
    display: inline-flex;
    align-items: center;
    position: relative;
    text-align: center;
    cursor: pointer;
    border: 0px none;
    font-weight: 700;
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 3px;
    transition: all 0.25s;
    height: 40px;
    padding: 12px 20px;
}

.cookies-panel__button:hover {
    background-color: rgba(23, 185, 200, 0.8);
}

.cookies-panel__button:active {
    background-color: rgba(23, 185, 200, 0.8);
}

.cookies-panel--open {
    animation: open 1.3s 1;
    animation-fill-mode: forwards;
}

.cookies-panel--close {
    animation: close 1s 1;
    animation-fill-mode: forwards;
}

@media screen and (max-width: 768px) {
    .cookies-panel {
        padding: 10px 16px 16px;
        margin-top: 8px;
        flex-direction: column;
    }
}

@media screen and (min-width: 769px) {
    .cookies-panel__body {
        font-size: 13px;
        line-height: 1.38;
    }
    .cookies-panel__link {
        display: inline;
    }
    .cookies__side {
        margin-top: 0;
        width: 112px;
        min-width: 112px;
    }
}

@keyframes open {
    0% {
        transform: translateY(100%);
    }
    100% {
        transform: translateY(0%);
    }
}

@keyframes close {
    0% {
        transform: translateY(0%);
    }
    100% {
        transform: translateY(100%);
    }
}
/* end cookies */