html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
     margin: 0;
     padding: 0;
     border: 0;
     vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
     display: block;
    }
     #bk { 
        position: fixed; 
        top: 0; 
        left: 0; 
        width: 100%; 
        height: 100%; 
        overflow: hidden; 
        z-index: -1; 
    }
    video { display: block; width:70%; height: auto; }
    body {
        line-height: 1;
}
 body {
     line-height: 1;
}
 ol, ul {
     list-style: none;
}
 blockquote, q {
     quotes: none;
}
 blockquote:before, blockquote:after, q:before, q:after {
     content: '';
     content: none;
}
 table {
     border-collapse: collapse;
     border-spacing: 0;
}
 article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
     display: block;
}
 * {
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
}
 html, body {
     position: relative;
     overflow-x: hidden;
}

 body {
     width: 100%;
     background: url(../img/fon-top.jpg) center top/100% 1690px no-repeat, url(../img/fon-bottom.jpg) center bottom no-repeat;
     background-color: #0d0101;
     font-family: Candara,Calibri,Segoe,Segoe UI,Optima,Arial,sans-serif;
     font-size: 15px;
     color: #ffffff;
     min-height: 100vh;
}
    
       
 a {
     -webkit-transition: all 0.3s ease;
     transition: all 0.3s ease;
     text-decoration: none;
     color: #fde51d;
}
 a:hover {
     text-decoration: none;
}
 p {
     margin-bottom: 20px;
}
 h1, h2, h3 {
     color: #fde51d;
     margin-bottom: 20px;
     line-height: 1.2;
}
 h1 {
     font-size: 20px;
}
 h2 {
     font-size: 18px;
}
 h3 {
     font-size: 16px;
}
 table {
     width: 100%;
     margin-bottom: 15px;
}
 table td {
     border-collapse: collapse;
     padding: 5px 15px;
     border: 0px solid #4c0c0c;
}
 img {
     max-width: 100%;
}
 caption {
     margin-bottom: 15px;
}
 select {
     background: #200203;
     border: 1px solid #4c0c0c;
     min-width: 150px;
     color: #fff;
     margin-bottom: 15px;
     padding: 12px 40px 12px 20px;
     position: relative;
     -webkit-appearance: none;
     background-image: url(../img/arrow-v.png);
     background-position: right 10px center;
     background-repeat: no-repeat;
     -moz-appearance: none;
     text-indent: 0.01px;
     text-overflow: '';
     -ms-appearance: none;
     appearance: none !important;
     cursor: pointer;
}
 input, textarea {
     background: #200203;
     border: 1px solid #4c0c0c;
     color: #ff0000;
     padding: 15px;
     position: relative;
     text-align: center;
     font-size: 14px;
     width: 100%;
     max-width: 600px;
     font-family: Candara,Calibri,Segoe,Segoe UI,Optima,Arial,sans-serif;
}
 button, .button {
     -webkit-transition: all 0.3s ease;
     transition: all 0.3s ease;
     cursor: pointer;
     background: url(../img/button.png) top center no-repeat;
     height: 58px;
     width: 167px;
     border: none;
     color: #fff;
     text-shadow: 0px 3px 0px rgba(0, 0, 0, 0.5);
     font-size: 18px;
     position: relative;
     z-index: 1;
     text-align: center;
     text-transform: uppercase;
     font-family: Candara,Calibri,Segoe,Segoe UI,Optima,Arial,sans-serif;
     -webkit-box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.6);
     box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.6);
     -webkit-transition: 0.3s;
     transition: 0.3s;
}
 button:hover, .button:hover {
     background: url(../img/button.png) top -58px center no-repeat;
}
 .button {
     display: inline-block;
     text-decoration: none;
     line-height: 58px;
}
 .button-small {
     background: url(../img/button-small.png) top center no-repeat;
     width: 87px;
     height: 30px;
     line-height: 30px;
     font-size: 13px;
     text-transform: none;
}
 .button-small:hover {
     background: url(../img/button-small.png) top -30px center no-repeat;
}
 .button-medium {
     background: url(../img/button.png) top center no-repeat;
     background-size: 113px 78px;
     width: 113px;
     height: 39px;
     line-height: 40px;
     font-size: 14px;
     text-transform: none;
}
 .button-medium:hover {
     background: url(../img/button.png) top -78px center no-repeat;
}
 :focus {
     outline: none;
}
 ::-webkit-input-placeholder {
     color: #841b1c;
}
 ::-moz-placeholder {
     color: #841b1c;
}
 :-moz-placeholder {
     color: #841b1c;
}
 :-ms-input-placeholder {
     color: #841b1c;
}
 .wrapper_web {
     width: 100%;
     max-width: 1200px;
     margin: 0 auto;
     position: relative;
}
 .flex {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
}
 .flex-c {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
}
 .flex-s {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
}
 .flex-s-c {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
}
 .flex-c-c {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
}
 .bright:hover {
     -webkit-filter: brightness(120%);
     filter: brightness(120%);
}
 .topPanel {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     width: 100%;
     height: 80px;
     background: -webkit-gradient(linear, left top, right top, from(#f8d300), color-stop(rgba(197, 119, 79, 0.5)), to(#0d0101));
     background: linear-gradient(to right, #f8d300, rgba(197, 119, 79, 0.5), #0d0101);
     border-bottom: 1px solid #f8d3001;
     z-index: 20;
}
 .topPanel-wrapper {
     width: 100%;
     max-width: 1200px;
     margin: 0 auto;
     position: relative;
}
 .menu {
     position: relative;
}
 .menu li {
     padding: 0px 0px;
     display: inline-block;
     position: relative;
}
 .menu li a {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     height: 79px;
     padding: 0px 35px;
     font-size: 18px;
     font-weight: bold;
     color: #000000;
     text-transform: uppercase;
     position: relative;
}
 .menu li a:hover {
     color: #ffffff;
     background: rgba(100, 9, 7, 0.7);
     border-bottom: 1px solid #fff;
}
 .menu li.active a {
     color: #ffffff;
     background: rgba(100, 9, 7, 0.7);
     border-bottom: 1px solid #fff;
}
 .menu li .menu-a {
     position: relative;
     cursor: pointer;
}
 .menu li .menu-a.show {
     color: #ffffff;
     background: rgba(100, 9, 7, 0.7);
     border-bottom: 1px solid #fff;
}
 .menu li .menu-a:after {
     content: "";
     position: absolute;
     background: url(../img/row-icon.png) no-repeat;
     width: 12px;
     height: 8px;
     right: -5px;
     top: 50%;
     margin-top: -2px;
     opacity: 0.3;
     -webkit-transition: 0.3s;
     transition: 0.3s;
}
 .menu .dropDown-menu {
     display: none;
     position: absolute;
     left: 0;
     width: 100%;
     top: 100%;
     background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.9)), to(rgba(0, 0, 0, 0)));
     background: linear-gradient(to bottom, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0));
     padding: 20px 0px 70px 0px;
}
 .menu .dropDown-menu li {
     display: block;
     text-align: center;
}
 .menu .dropDown-menu li a {
     display: block;
     height: auto;
     padding: 20px 3px;
     color: #fff;
}
 .menu .dropDown-menu li a:hover {
     background: rgba(255, 255, 255, 0.1);
     border-bottom: none;
}
 header {
     height: 560px;
     position: relative;
}
 .logo {
     text-align: center;
     position: absolute;
     bottom: 0;
     left: 0;
     width: 100%;
     z-index: 3;
}
 .logo a:hover {
     -webkit-filter: brightness(120%);
     filter: brightness(120%);
}
 .container_web {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     position: relative;
     z-index: 8;
}
 .container_web aside {
     width: 300px;
     background: url(../img/aside-bg-bottom.jpg) bottom no-repeat, url(../img/aside-bg.jpg) repeat-y;
}
 .content {
     width: calc(100% - 600px);
     background: #250607;
     -webkit-box-shadow: inset 0px 0px 17px 0px rgba(0, 0, 0, 0.75);
     box-shadow: inset 0px 0px 17px 0px rgba(0, 0, 0, 0.75);
     position: relative;
     z-index: 3;
     padding: 35px;
     padding-top:10px !important;
    line-height: 1.4;
}
 .content .h1 {
     display: block;
     font-weight: bold;
     text-align: center;
     background: url(../img/border.png) center bottom no-repeat;
     padding-bottom: 30px;
     margin-bottom: 15px;
     color: #fde51d;
     font-size: 15px !important;
}
 .content a {
     text-decoration: ;
}
 .content a:hover {
     text-decoration: none;
}
 .content:after {
     content: "";
     width: 714px;
     height: 164px;
     background: url(../img/fon_new_bottom.png) center bottom no-repeat;
     position: absolute;
     left: 50%;
     margin-left: -357px;
     bottom: -100px;
}
 .swiper-container {
     margin-left: -35px;
     margin-top: -35px;
     margin-bottom: 35px;
     position: relative;
     width: calc(100% + 70px);
     height: 380px;
     -webkit-box-shadow: 0px 7px 10px 0px rgba(0, 0, 0, 0.3);
     box-shadow: 0px 7px 10px 0px rgba(0, 0, 0, 0.3);
}
 .swiper-slide {
     height: 380px;
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
}
 .swiper-button-next, .swiper-button-prev {
     width: 55px;
     height: 55px;
}
 .swiper-button-next {
     background: url(../img/slide-next.jpg) no-repeat;
     right: 0px;
}
 .swiper-button-next:after {
     display: none;
}
 .swiper-button-prev {
     background: url(../img/slide-prev.jpg) no-repeat;
     left: 0px;
}
 .swiper-button-prev:after {
     display: none;
}
 .swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
     bottom: 0px;
     height: 60px;
     background: rgba(39, 23, 11, 0.4);
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
}
 .slide-more {
     position: absolute;
     right: 35px;
     bottom: 90px;
}
 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
     background: #938b85;
     opacity: 1;
}
 .swiper-pagination-bullet-active {
     background: #ff0000 !important;
     -webkit-box-shadow: 0px 0px 10px 0px #ff0000;
     box-shadow: 0px 0px 10px 0px #ff0000;
}
 .download-button {
     width: 300px;
     height: 120px;
     position: relative;
     display: block;
     padding: 30px 0px 0px 110px;
}
 .download-button:before {
     content: "";
     background: url(../img/download-button.png) no-repeat;
     position: absolute;
     right: 0px;
     top: -15px;
     width: 368px;
     height: 136px;
}
 .download-button p {
     font-size: 30px;
     color: #fff;
     text-shadow: 0px 3px 4px rgba(0, 0, 0, 0.3);
     position: relative;
     z-index: 2;
     margin-bottom: 7px;
}
 .download-button span {
     position: relative;
     z-index: 2;
     font-size: 16px;
     color: #f4f7ac;
     text-shadow: 0px 3px 4px rgba(0, 0, 0, 0.3);
}
 .serverBlock {
     background: url(../img/server-bg.jpg) no-repeat;
     width: 300px;
     height: 120px;
}
 .serverBlock {
     padding-left: 110px;
}
 .serverBlock > div {
     width: 160px;
}
 .server-title {
     font-weight: bold;
     font-size: 18px;
     margin-bottom: 12px;
}
 .server-progress {
     background: rgba(30, 30, 30, 0.4);
     height: 9px;
     width: 100%;
     margin-bottom: 12px;
     padding: 3px;
}
 .server-progress span {
     display: block;
     background: #b3d148;
     height: 3px;
}
 .server-online {
     font-size: 14px;
}
 .server-online span {
     color: #d6f75f;
}
 .socBlock {
     background: url(../img/soc-block-bg.jpg) no-repeat;
     height: 140px;
     padding: 8px 0px;
}
 .socBlock a {
     width: 50%;
     color: #fde51d;
     font-size: 14px;
     padding-left: 17px;
}
 .socBlock a:hover {
     padding-left: 5px;
     color: #f63737;
}
 .socBlock .icon {
     margin-right: 10px;
}
 .icon {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     background: url(../img/soc-bg.png) no-repeat;
     width: 50px;
     height: 50px;
     -webkit-filter: drop-shadow(0px 7px 10px rgba(0, 0, 0, 0.7));
     filter: drop-shadow(0px 7px 10px rgba(0, 0, 0, 0.7));
     color: #9afa4c;
     font-size: 18px;
}
 .block {
     position: relative;
     min-height: 350px;
     background: url(../img/block-bg-top.jpg) center top no-repeat, url(../img/block-bg-bottom.jpg) center bottom no-repeat, url(../img/block-bg-repeat.jpg) center repeat-y;
     padding: 45px 0px 35px 0px;
}
 .block:before {
     content: "";
     background: url(../img/title-img.png) no-repeat;
     position: absolute;
     width: 79px;
     height: 121px;
     left: 0px;
     top: 6px;
}
 .blockTitle {
     position: relative;
     text-align: center;
     margin-bottom: 40px;
}
 .blockTitle p {
     color: #fde51d;
     font-weight: bold;
     font-size: 18px;
     margin-bottom: 8px;
}
 .blockTitle span {
     font-size: 13px;
}
 .tableBlock-thead {
     background: rgba(237, 31, 36, 0.1);
     margin: 0px 25px 20px 25px;
}
 .tableBlock-thead .tableBlock-td {
     color: #ff3939;
     font-weight: bold;
}
 .tableBlock-tr {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
}
 .tableBlock-td {
     position: relative;
     padding: 12px 10px;
     font-size: 14px;
}
 .tableBlock-td a {
     color: #fff;
}
 .table-top .tableBlock-td:nth-child(1) {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
}
 .table-top .tableBlock-td:nth-child(1) img {
     margin-left: 4px;
}
 .table-top .tableBlock-td:nth-child(2) {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
}
 .td-15 {
     width: 15%;
}
 .td-25 {
     width: 25%;
}
 .td-50 {
     width: 50%;
}
 .td-65 {
     width: 65%;
}
 .plvl {
     position: absolute;
     top: 5px;
     margin-left: 3px;
     color: #ff0000;
     font-size: 12px;
}
 .tableBlock-body .tableBlock-tr {
     margin: 0px 25px;
     -webkit-transition: 0.3s;
     transition: 0.3s;
}
 .tableBlock-body .tableBlock-tr:hover {
     margin: 0px;
     background: #0d0101;
     color: #fde51d;
     padding: 0px 35px 0px 15px;
     -webkit-box-shadow: 0px 4px 5px 0px rgba(255, 28, 1, 0.15);
     box-shadow: 0px 4px 5px 0px rgba(255, 28, 1, 0.15);
}
 .tableBlock-body .tableBlock-tr:hover a {
     color: #fde51d;
}
 .table-event .tableBlock-td {
     padding: 12px 3px;
}
 .table-event .tableBlock-td:first-child {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
}
 .table-event .tableBlock-td:last-child {
     text-align: right;
}
 .opened {
     color: #ff3939;
}
 .blockMore {
     height: 126px;
     position: relative;
     padding: 45px 0px 0px 45px;
     font-weight: bold;
     text-shadow: 0px 1px 2px #000;
     -webkit-transition: 0.3s;
     transition: 0.3s;
     margin-bottom: 1px;
     transition: 0.3s;
}
 .blockMore p {
     margin-bottom: 10px;
}
 .blockMore:hover {
     padding: 45px 0px 0px 60px;
}
 .blockMore:after {
     content: "";
     position: absolute;
     bottom: 0;
}
 .blockMore_1 {
     background: url(../img/block-bg_1.jpg) no-repeat;
}
 .blockMore_1:hover:after {
     right: -55px;
}
 .blockMore_1:after {
     background: url(../img/hero_1.png) no-repeat;
     width: 155px;
     height: 141px;
     right: -35px;
     -webkit-transition: 0.3s;
     transition: 0.3s;
}
 .blockMore_2 {
     background: url(../img/block-bg_2.jpg) no-repeat;
}
 .blockMore_2:hover:after {
     right: -40px;
}
 .blockMore_2:after {
     background: url(../img/hero_2.png) no-repeat;
     width: 129px;
     height: 133px;
     right: -20px;
     -webkit-transition: 0.3s;
     transition: 0.3s;
}
 .blockMore_3 {
     background: url(../img/block-bg_3.jpg) no-repeat;
}
 .blockMore_3:hover:after {
     right: -110px;
}
 .blockMore_3:after {
     background: url(../img/hero_3.png) no-repeat;
     width: 393px;
     height: 126px;
     right: -90px;
     -webkit-transition: 0.3s;
     transition: 0.3s;
}
 .fb-block {
     padding: 35px 30px;
}
 .news {
     margin-bottom: 50px;
     background: url(../img/border.png) center bottom no-repeat;
     padding-bottom: 30px;
}
 .news a {
     text-decoration: none;
}
 .news-title {
     margin-bottom: 20px;
}
 .news-title a {
     color: #fff;
     font-weight: bold;
     text-decoration: none;
}
 .news-img {
     margin-bottom: 20px;
}
 .news-content {
     line-height: 1.4;
     margin-bottom: 30px;
}
 .news-date {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     font-size: 14px;
}
 .news-date span {
     margin-right: 5px;
}
 .pagination .number {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     height: 25px;
     width: 25px;
     font-size: 14px;
     color: #c3b357;
     border: 1px solid rgba(255, 255, 255, 0);
     margin: 2px;
     border-radius: 50%;
}
 .pagination .number:hover {
     color: #fff;
}
 .pagination .number.active {
     color: #fdfdfd;
     border: 1px solid white;
}
 .pagination .pag-arrow {
     width: 22px;
     height: 21px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
}
 .pagination .pag-arrow:hover {
     -webkit-filter: brightness(120%);
     filter: brightness(120%);
}
 .pagination .pag-arrow.prev {
     background: url(../img/nav-back.png) no-repeat;
     margin-right: 20px;
}
 .pagination .pag-arrow.next {
     background: url(../img/nav-next.png) no-repeat;
     margin-left: 20px;
}
 .footer {
     padding: 65px 60px 25px 60px;
     min-height: 350px;
}
 .toTop {
     background: url(../img/top-button.png) no-repeat;
     width: 67px;
     height: 65px;
     margin: 0 auto;
     cursor: pointer;
     -webkit-transition: 0.3s;
     transition: 0.3s;
     margin-bottom: 40px;
}
 .toTop:hover {
     -webkit-filter: brightness(120%);
     filter: brightness(120%);
}
 .f-menu {
     margin-bottom: 20px;
}
 .f-menu li {
     padding: 10px 30px;
}
 .f-menu li.active a {
     color: #fff;
}
 .f-menu li a {
     text-transform: uppercase;
     color: #a08951;
     font-size: 16px;
}
 .f-menu li a:hover {
     color: #fff;
}
 .f-logo {
     margin-bottom: 15px;
}
 .f-logo a {
     display: block;
     margin: 0px 20px;
}
 .copy {
     text-align: center;
     color: #fff;
     font-size: 14px;
}
 .modal_div {
     max-width: 596px;
     background: url(../img/modal-bg.jpg) repeat-y;
     width: 100%;
     min-height: 400px;
     position: fixed;
     top: 15%;
     left: 50%;
     margin-left: -298px;
     margin-top: -50px;
     display: none;
     opacity: 0;
     z-index: 999;
     padding: 50px 60px 50px 60px;
     -webkit-box-shadow: 0px 10px 40px 0px rgba(0, 0, 0, 0.2);
     box-shadow: 0px 10px 40px 0px rgba(0, 0, 0, 0.2);
}
 .modal_div:before {
     content: "";
     background: url(../img/modal-bg-top.png) no-repeat;
     position: absolute;
     width: 714px;
     height: 232px;
     left: 50%;
     margin-left: -357px;
     top: -60px;
}
 .modal_div:after {
     content: "";
     background: url(../img/modal-bg-bottom.png) no-repeat;
     position: absolute;
     width: 714px;
     height: 204px;
     left: 50%;
     margin-left: -357px;
     bottom: -60px;
}
 .modal_div h1 {
     font-size: 20px;
     margin-bottom: 40px;
     position: relative;
     z-index: 10;
     text-transform: uppercase;
     text-align: center;
}
 .modal_div .modal_close {
     width: 15px;
     height: 15px;
     background: url(../img/close-icon.png) no-repeat;
     position: absolute;
     top: 20px;
     right: 40px;
     cursor: pointer;
     display: block;
}
 #overlay2 {
     z-index: 998;
     position: fixed;
     background-color: rgba(15, 13, 11, 0.8);
     opacity: 0.9;
     width: 100%;
     height: 100%;
     top: 0;
     left: 0;
     cursor: pointer;
     display: none;
}
 .modal-v {
     position: relative;
     z-index: 10;
}
 .modalForm {
     width: 100%;
     text-align: center;
}
 .formGroup {
     margin-bottom: 20px;
}
 .formGroup-name {
     display: block;
     font-size: 14px;
     margin-bottom: 15px;
}
 .smoke {
     position: absolute;
     left: 0;
     right: 0;
     top: 550px;
     height: 484px;
     width: 100%;
     background-image: url(../img/smoke.png);
     background-position: left top;
     background-repeat: repeat-x;
     -webkit-animation: smoke 20s linear infinite;
     animation: smoke 20s linear infinite;
     -webkit-animation-fill-mode: forwards;
     animation-fill-mode: forwards;
}
 @-webkit-keyframes smoke {
     0% {
         background-position: left -1920px top;
    }
     100% {
         background-position: left 1920px top;
    }
}
 @keyframes smoke {
     0% {
         background-position: left -1920px top;
    }
     100% {
         background-position: left 1920px top;
    }
}
 .sparks {
     position: absolute;
     width: 1200px;
     left: 50%;
     bottom: 10px;
     z-index: 1;
}
 .sparks > div {
     position: absolute;
}
 .sparks .spark_1 {
     background: url(../img/spark_1.png) no-repeat;
     width: 764px;
     height: 313px;
     right: 0;
     bottom: -320px;
     -webkit-transform: scale(0.6);
     transform: scale(0.6);
     -webkit-animation: spark-1 4s linear infinite;
     animation: spark-1 4s linear infinite;
     -webkit-animation-delay: 1s;
     animation-delay: 1s;
}
 .sparks .spark_2 {
     background: url(../img/spark_2.png) no-repeat;
     width: 179px;
     height: 335px;
     right: 230px;
     bottom: -320px;
     -webkit-transform: scale(0.6);
     transform: scale(0.6);
     -webkit-animation: spark-1 4s linear infinite;
     animation: spark-1 4s linear infinite;
     -webkit-animation-delay: 2s;
     animation-delay: 2s;
}
 .sparks .spark_3 {
     background: url(../img/spark_3.png) no-repeat;
     width: 128px;
     height: 165px;
     right: 280px;
     bottom: -140px;
     -webkit-transform: scale(0.6);
     transform: scale(0.6);
     -webkit-animation: spark-3 4s linear infinite;
     animation: spark-3 4s linear infinite;
     -webkit-animation-delay: 2s;
     animation-delay: 2s;
}
 .sparks .spark-big {
     background: url(../img/spark_4.png) no-repeat;
     width: 794px;
     height: 176px;
     right: 0;
     bottom: -180px;
     -webkit-transform: scale(0.6);
     transform: scale(0.6);
     -webkit-animation: spark-5 4s linear infinite;
     animation: spark-5 4s linear infinite;
}
 .sparks .spark_5 {
     -webkit-animation-delay: 2s;
     animation-delay: 2s;
     right: 40px;
}
 .sparks_1 {
     margin-left: -1200px;
}
 .sparks_1 .spark_1 {
     background: url(../img/spark_1.png) no-repeat;
     -webkit-animation-delay: 2s;
     animation-delay: 2s;
}
 .sparks_1 .spark_2 {
     background: url(../img/spark_2.png) no-repeat;
     -webkit-animation-delay: 3s;
     animation-delay: 3s;
}
 .sparks_1 .spark_3 {
     background: url(../img/spark_3.png) no-repeat;
     -webkit-animation-delay: 3s;
     animation-delay: 3s;
}
 .sparks_1 .spark-big {
     background: url(../img/spark_4.png) no-repeat;
}
 .sparks_1 .spark_5 {
     -webkit-animation-delay: 3s;
     animation-delay: 3s;
}
 .sparks_2 {
     margin-left: -400px;
}
 @-webkit-keyframes spark-1 {
     0% {
         bottom: -320px;
         -webkit-transform: scale(0.6);
         transform: scale(0.6);
         opacity: 0;
    }
     25% {
         bottom: -240px;
         -webkit-transform: scale(0.7);
         transform: scale(0.7);
         opacity: 1;
    }
     50% {
         bottom: -160px;
         -webkit-transform: scale(0.8);
         transform: scale(0.8);
         opacity: 1;
    }
     75% {
         bottom: -80px;
         -webkit-transform: scale(0.9);
         transform: scale(0.9);
         opacity: 0.5;
    }
     100% {
         bottom: 0px;
         -webkit-transform: scale(1);
         transform: scale(1);
         opacity: 0;
    }
}
 @keyframes spark-1 {
     0% {
         bottom: -320px;
         -webkit-transform: scale(0.6);
         transform: scale(0.6);
         opacity: 0;
    }
     25% {
         bottom: -240px;
         -webkit-transform: scale(0.7);
         transform: scale(0.7);
         opacity: 1;
    }
     50% {
         bottom: -160px;
         -webkit-transform: scale(0.8);
         transform: scale(0.8);
         opacity: 1;
    }
     75% {
         bottom: -80px;
         -webkit-transform: scale(0.9);
         transform: scale(0.9);
         opacity: 0.5;
    }
     100% {
         bottom: 0px;
         -webkit-transform: scale(1);
         transform: scale(1);
         opacity: 0;
    }
}
 @-webkit-keyframes spark-3 {
     0% {
         bottom: -140px;
         -webkit-transform: scale(0.6);
         transform: scale(0.6);
         opacity: 0;
    }
     25% {
         bottom: -80px;
         -webkit-transform: scale(0.7);
         transform: scale(0.7);
         opacity: 1;
    }
     50% {
         bottom: -20px;
         -webkit-transform: scale(0.8);
         transform: scale(0.8);
         opacity: 1;
    }
     75% {
         bottom: 40px;
         -webkit-transform: scale(0.9);
         transform: scale(0.9);
         opacity: 0.5;
    }
     100% {
         bottom: 100px;
         -webkit-transform: scale(1);
         transform: scale(1);
         opacity: 0;
    }
}
 @keyframes spark-3 {
     0% {
         bottom: -140px;
         -webkit-transform: scale(0.6);
         transform: scale(0.6);
         opacity: 0;
    }
     25% {
         bottom: -80px;
         -webkit-transform: scale(0.7);
         transform: scale(0.7);
         opacity: 1;
    }
     50% {
         bottom: -20px;
         -webkit-transform: scale(0.8);
         transform: scale(0.8);
         opacity: 1;
    }
     75% {
         bottom: 40px;
         -webkit-transform: scale(0.9);
         transform: scale(0.9);
         opacity: 0.5;
    }
     100% {
         bottom: 100px;
         -webkit-transform: scale(1);
         transform: scale(1);
         opacity: 0;
    }
}
 @-webkit-keyframes spark-5 {
     0% {
         bottom: -180px;
         -webkit-transform: scale(0.6);
         transform: scale(0.6);
         opacity: 0;
    }
     25% {
         bottom: -120px;
         -webkit-transform: scale(0.7);
         transform: scale(0.7);
         opacity: 1;
    }
     50% {
         bottom: -60px;
         -webkit-transform: scale(0.8);
         transform: scale(0.8);
         opacity: 1;
    }
     75% {
         bottom: 0px;
         -webkit-transform: scale(0.9);
         transform: scale(0.9);
         opacity: 0.5;
    }
     100% {
         bottom: 60px;
         -webkit-transform: scale(1);
         transform: scale(1);
         opacity: 0;
    }
}
 @keyframes spark-5 {
     0% {
         bottom: -180px;
         -webkit-transform: scale(0.6);
         transform: scale(0.6);
         opacity: 0;
    }
     25% {
         bottom: -120px;
         -webkit-transform: scale(0.7);
         transform: scale(0.7);
         opacity: 1;
    }
     50% {
         bottom: -60px;
         -webkit-transform: scale(0.8);
         transform: scale(0.8);
         opacity: 1;
    }
     75% {
         bottom: 0px;
         -webkit-transform: scale(0.9);
         transform: scale(0.9);
         opacity: 0.5;
    }
     100% {
         bottom: 60px;
         -webkit-transform: scale(1);
         transform: scale(1);
         opacity: 0;
    }
}
 .btn2 {
     display: none;
     -webkit-transition: 0.3s;
     transition: 0.3s;
     left: 20px;
}
 .btn2 span {
     width: 30px;
     height: 4px;
     display: block;
     margin: 6px 0px;
     background: #fff;
     -webkit-transition: 0.3s;
     transition: 0.3s;
     position: relative;
}
 @media (max-width: 1200px) {
     .menu li a {
         padding: 0px 20px;
         font-size: 16px;
    }
}
 @media (max-width: 993px) {
     .container_web {
         -ms-flex-wrap: wrap;
         flex-wrap: wrap;
         -webkit-box-pack: center;
         -ms-flex-pack: center;
         justify-content: center;
    }
     aside {
         width: 50%;
         -webkit-box-ordinal-group: 3;
         -ms-flex-order: 2;
         order: 2;
    }
     .content {
         width: 100%;
         -webkit-box-ordinal-group: 2;
         -ms-flex-order: 1;
         order: 1;
    }
     .news {
         text-align: center;
    }
     .menu li a {
         padding: 0px 10px;
         font-size: 14px;
    }
     .content:after {
         display: none;
    }
}
 @media (max-width: 769px) {
     .topMenu {
         display: block;
         position: fixed;
         width: 320px;
         height: 100%;
         top: 0;
         left: -320px;
         background: rgba(0, 0, 0, 0.9);
         z-index: 3;
         padding-top: 100px;
         -webkit-transition: 0.3s;
         transition: 0.3s;
    }
     .topMenu.active {
         left: 0px;
    }
     .menu {
         height: calc(100% - 50px);
         overflow-y: auto;
         display: block;
    }
     .menu li {
         display: block;
    }
     .menu li a {
         color: #fff;
         height: auto;
         line-height: 1;
         padding: 20px 25px;
         font-size: 18px;
    }
     .topPanel {
         height: 60px;
    }
     .btn2 {
         display: block;
         position: relative;
         z-index: 14;
    }
     .btn2.active {
         left: 250px;
    }
     .btn2.active span:nth-child(1) {
         -webkit-transform: rotate(45deg);
         transform: rotate(45deg);
         bottom: -9px;
    }
     .btn2.active span:nth-child(2) {
         display: none;
    }
     .btn2.active span:nth-child(3) {
         -webkit-transform: rotate(-45deg);
         transform: rotate(-45deg);
    }
     .header_web {
         height: 400px;
    }
}
 @media (max-width: 575px) {
     .content {
         padding: 10px;
    }
     .swiper-container {
         margin-left: -10px;
         margin-top: -10px;
         width: calc(100% + 20px);
         height: 300px;
    }
}
 .rank-list {
     display: none;
     animation: rank 0.4s ease;
}
 .rank-list li {
     -webkit-transition: 0.3s;
     transition: 0.3s;
    display: flex;
    width:100%;
    padding-left:25px;
    padding-top:10px;
    padding-bottom:10px;
}
 .rank-list li .rank-ava {
     margin: 0px 15px;
     border-radius: 50%;
     box-shadow: 2px 2px 10px 0px rgba(0, 0, 0, 0.2);
     transition: 0.5s;
}
 .rank-list li .rank-name {
     color: #ffafc0;
}
 .rank-list li .rank-name b {
     color: #fe95ad;
}
 .rank-list li a {
     display: block;
     width: 100%;
     color: #fff;
     margin-bottom: 4px;
}
 .rank-list li:hover {
     background: #0d0101;
     color: #fde51d;
     padding: 0px 35px 0px 15px;
     -webkit-box-shadow: 0px 4px 5px 0px rgba(255, 28, 1, 0.15);
     box-shadow: 0px 4px 5px 0px rgba(255, 28, 1, 0.15);
    width:100%;
    padding-top:10px;
    padding-bottom:10px;
}
 .rank-list li:hover .rank-ava {
     margin: 0px 25px 0px 15px;
}
 .rank-list li:before {
     display: none;
}
 .rank-list.active {
     display: block;
}
 @keyframes rank {
     0% {
         display: none;
         opacity: 0;
         transform: scale(0);
    }
     1% {
         display: block;
         opacity: 0;
         transform: scale(0);
    }
     100% {
         display: block;
         opacity: 1;
         transform: scale(1);
    }
}
 .top-block {
}
 .top-block span {
     display: block;
     padding-bottom: 1px;
}
 .top-block .top-number {
     width: 15px !important;
}
 .top-block .top-flag {
     width: 25px;
     padding-top: 2px;
}
 .top-block .top-name {
     width: 100px;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
}
 .top-block .top-event-name {
     width: 120px;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
}
 .top-block .top-drop-name {
     width: 200px;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
}
 .top-block .top-lvl {
     width: 55px;
}
 .top-block .top-lvl sup {
     font-size: 10px;
     color: #ff0000;
}
 .top-block .top-event-time {
     width: 100px;
}
 .countdown-block {
     position: absolute;
     bottom: 124px;
     left: 360px;
     text-align: center;
     width: 100%;
}
 .countdown-block h3 {
     color: #FFFF04;
     font-size: 14px;
     margin-bottom: 10px;
     font-weight: bold;
}
 .countdown li {
     margin: 0px 7px;
     position: relative;
     list-style-type: none;
}
 .countdown li:after {
     content: ":";
     position: absolute;
     right: -12px;
     top: 8px;
     font-size: 38px;
     color: #3b0c16;
}
 .countdown li:first-child:after {
     __display: none;
}
 .countdown li:last-child:after {
     display: none;
}
 .countdown span {
     display: block;
     background: rgba(255, 255, 4, 0.5);
     border-radius: 6px;
     height: 60px;
     width: 60px;
     font-size: 32px;
     color: #fff;
     text-align: center;
     line-height: 60px;
     margin-bottom: 7px;
}
 .countdown p {
     font-size: 12px;
     margin-bottom: 0px;
     font-weight: bold;
     color: #FFFF04;
     text-transform: uppercase;
}