.mCustomScrollbar {
    touch-action: pinch-zoom;
}

.mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action {
    touch-action: auto;
}

.mCustomScrollBox {
    position: relative;
    overflow: hidden;
    height: 100%;
    max-width: 100%;
    outline: 0;
    direction: ltr;
}

.mCSB_container {
    overflow: hidden;
    width: auto;
    height: auto;
}

.mCSB_inside > .mCSB_container {
    margin-right: 30px;
}

.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-right: 0;
}

.mCS-dir-rtl > .mCSB_inside > .mCSB_container {
    margin-right: 0;
    margin-left: 30px;
}

.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-left: 0;
}

.mCSB_scrollTools {
    position: absolute;
    width: 16px;
    height: auto;
    left: auto;
    top: 0;
    right: 0;
    bottom: 0;
    opacity: 0.75;
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)";
}

.mCSB_outside + .mCSB_scrollTools {
    right: -26px;
}

.mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools, .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools {
    right: auto;
    left: 0;
}

.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools {
    left: -26px;
}

.mCSB_scrollTools .mCSB_draggerContainer {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: auto;
}

.mCSB_scrollTools a + .mCSB_draggerContainer {
    margin: 20px 0;
}

.mCSB_scrollTools .mCSB_draggerRail {
    width: 2px;
    height: 100%;
    margin: 0 auto;
    border-radius: 16px;
}

.mCSB_scrollTools .mCSB_dragger {
    cursor: pointer;
    width: 100%;
    height: 30px;
    z-index: 1;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    position: relative;
    width: 4px;
    height: 100%;
    margin: 0 auto;
    border-radius: 16px;
    text-align: center;
}

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    width: 12px;
}

.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    width: 8px;
}

.mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonUp {
    display: block;
    position: absolute;
    height: 20px;
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
    cursor: pointer;
}

.mCSB_scrollTools .mCSB_buttonDown {
    bottom: 0;
}

.mCSB_horizontal.mCSB_inside > .mCSB_container {
    margin-right: 0;
    margin-bottom: 30px;
}

.mCSB_horizontal.mCSB_outside > .mCSB_container {
    min-height: 100%;
}

.mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden {
    margin-bottom: 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    width: auto;
    height: 16px;
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
}

.mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    bottom: -26px;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer {
    margin: 0 20px;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 2px;
    margin: 7px 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 30px;
    height: 100%;
    left: 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 4px;
    margin: 6px auto;
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    height: 12px;
    margin: 2px auto;
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    height: 8px;
    margin: 4px 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft, .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
    display: block;
    position: absolute;
    width: 20px;
    height: 100%;
    overflow: hidden;
    margin: 0 auto;
    cursor: pointer;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft {
    left: 0;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
    right: 0;
}

.mCSB_container_wrapper {
    position: absolute;
    height: auto;
    width: auto;
    overflow: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin-right: 30px;
    margin-bottom: 30px;
}

.mCSB_container_wrapper > .mCSB_container {
    padding-right: 30px;
    padding-bottom: 30px;
    box-sizing: border-box;
}

.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical {
    bottom: 20px;
}

.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    right: 20px;
}

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical {
    bottom: 0;
}

.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    right: 0;
}

.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    left: 20px;
}

.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    left: 0;
}

.mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper {
    margin-right: 0;
    margin-left: 30px;
}

.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container {
    padding-right: 0;
}

.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container {
    padding-bottom: 0;
}

.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden {
    margin-right: 0;
    margin-left: 0;
}

.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden {
    margin-bottom: 0;
}

.mCSB_scrollTools, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight, .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar {
    transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools {
    opacity: 0;
    filter: "alpha(opacity=0)";
    -ms-filter: "alpha(opacity=0)";
}

.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools, .mCustomScrollBox:hover > .mCSB_scrollTools, .mCustomScrollBox:hover ~ .mCSB_scrollTools, .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag {
    opacity: 1;
    filter: "alpha(opacity=100)";
    -ms-filter: "alpha(opacity=100)";
}

.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.4);
    filter: "alpha(opacity=40)";
    -ms-filter: "alpha(opacity=40)";
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.75);
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)";
}

.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.85);
    filter: "alpha(opacity=85)";
    -ms-filter: "alpha(opacity=85)";
}

.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.9);
    filter: "alpha(opacity=90)";
    -ms-filter: "alpha(opacity=90)";
}

.mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight, .mCSB_scrollTools .mCSB_buttonUp { /*background-image:url(mCSB_buttons.png);*/
    background-repeat: no-repeat;
    opacity: 0.4;
    filter: "alpha(opacity=40)";
    -ms-filter: "alpha(opacity=40)";
}

.mCSB_scrollTools .mCSB_buttonUp {
    background-position: 0 0;
}

.mCSB_scrollTools .mCSB_buttonDown {
    background-position: 0 -20px;
}

.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: 0 -40px;
}

.mCSB_scrollTools .mCSB_buttonRight {
    background-position: 0 -56px;
}

.mCSB_scrollTools .mCSB_buttonDown:hover, .mCSB_scrollTools .mCSB_buttonLeft:hover, .mCSB_scrollTools .mCSB_buttonRight:hover, .mCSB_scrollTools .mCSB_buttonUp:hover {
    opacity: 0.75;
    filter: "alpha(opacity=75)";
    -ms-filter: "alpha(opacity=75)";
}

.mCSB_scrollTools .mCSB_buttonDown:active, .mCSB_scrollTools .mCSB_buttonLeft:active, .mCSB_scrollTools .mCSB_buttonRight:active, .mCSB_scrollTools .mCSB_buttonUp:active {
    opacity: 0.9;
    filter: "alpha(opacity=90)";
    -ms-filter: "alpha(opacity=90)";
}

.mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.15);
}

.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -80px 0;
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -80px -20px;
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -80px -40px;
}

.mCS-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -80px -56px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-light-2.mCSB_scrollTools .mCSB_draggerRail {
    width: 4px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 4px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 4px;
    margin: 6px auto;
}

.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.85);
}

.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.9);
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px 0;
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -20px;
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -40px;
}

.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -56px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
    border-radius: 1px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px 0;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -20px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -40px;
}

.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -56px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail, .mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail {
    width: 4px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 6px;
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.75);
    border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 4px;
    margin: 6px 0;
}

.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 6px;
    margin: 5px auto;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.85);
}

.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.9);
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -16px 0;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -16px -20px;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -20px -40px;
}

.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -20px -56px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
    border-radius: 2px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -96px 0;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -96px -20px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -100px -40px;
}

.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -100px -56px;
}

.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.1);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 2px;
}

.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
}

.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 2px;
    margin: 7px auto;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.15);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -80px 0;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -80px -20px;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -80px -40px;
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -80px -56px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.15);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger, .mCS-rounded.mCSB_scrollTools .mCSB_dragger {
    height: 14px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 14px;
    margin: 0 1px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 14px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    height: 14px;
    margin: 1px 0;
}

.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    width: 16px;
    height: 16px;
    margin: -1px 0;
}

.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    width: 4px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
    height: 16px;
    width: 16px;
    margin: 0 -1px;
}

.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    height: 4px;
    margin: 6px 0;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp {
    background-position: 0 -72px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown {
    background-position: 0 -92px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: 0 -112px;
}

.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight {
    background-position: 0 -128px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.15);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -80px -72px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -80px -92px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -80px -112px;
}

.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -80px -128px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail {
    width: 4px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    background-color: transparent;
    background-position: center;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==);
    background-repeat: repeat-y;
    opacity: 0.3;
    filter: "alpha(opacity=30)";
    -ms-filter: "alpha(opacity=30)";
}

.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    height: 4px;
    margin: 6px 0;
    background-repeat: repeat-x;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -16px -72px;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -16px -92px;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -20px -112px;
}

.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -20px -128px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=);
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -96px -72px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -96px -92px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -100px -112px;
}

.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -100px -128px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-repeat: repeat-y;
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    background-repeat: repeat-x;
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0, rgba(255, 255, 255, 0) 100%);
}

.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger {
    height: 70px;
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 70px;
}

.mCS-3d-dark.mCSB_scrollTools, .mCS-3d.mCSB_scrollTools {
    opacity: 1;
    filter: "alpha(opacity=30)";
    -ms-filter: "alpha(opacity=30)";
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_draggerRail {
    border-radius: 16px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d.mCSB_scrollTools .mCSB_draggerRail {
    width: 8px;
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.2);
    box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2);
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #555;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 8px;
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 8px;
    margin: 4px 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2);
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    width: 100%;
    height: 8px;
    margin: 4px auto;
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px;
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px;
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px;
}

.mCS-3d.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.1);
    box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}

.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px;
}

.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px;
}

.mCS-3d-thick-dark.mCSB_scrollTools, .mCS-3d-thick.mCSB_scrollTools {
    opacity: 1;
    filter: "alpha(opacity=30)";
    -ms-filter: "alpha(opacity=30)";
}

.mCS-3d-thick-dark.mCSB_scrollTools, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer, .mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
    border-radius: 7px;
}

.mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical, .mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical {
    right: 1px;
}

.mCS-3d-thick-dark.mCSB_scrollTools_vertical, .mCS-3d-thick.mCSB_scrollTools_vertical {
    box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5);
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal, .mCS-3d-thick.mCSB_scrollTools_horizontal {
    bottom: 1px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    border-radius: 5px;
    box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4);
    width: 12px;
    margin: 2px;
    position: absolute;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
    height: 12px;
    width: auto;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #555;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.05);
    box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail {
    background-color: transparent;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px;
}

.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px;
}

.mCS-3d-thick-dark.mCSB_scrollTools {
    box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4), inset -1px 0 0 rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.2);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #777;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
    background-color: #fff;
    background-color: rgba(0, 0, 0, 0.05);
    box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-minimal.mCSB_scrollTools .mCSB_draggerRail {
    background-color: transparent;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px;
}

.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px;
}

.mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical {
    right: 0;
    margin: 12px 0;
}

.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal {
    bottom: 0;
    margin: 0 12px;
}

.mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical, .mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical {
    left: 0;
    right: auto;
}

.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger {
    height: 50px;
}

.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger {
    width: 50px;
}

.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.2);
    filter: "alpha(opacity=20)";
    -ms-filter: "alpha(opacity=20)";
}

.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.5);
    filter: "alpha(opacity=50)";
    -ms-filter: "alpha(opacity=50)";
}

.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.2);
    filter: "alpha(opacity=20)";
    -ms-filter: "alpha(opacity=20)";
}

.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.5);
    filter: "alpha(opacity=50)";
    -ms-filter: "alpha(opacity=50)";
}

.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools .mCSB_draggerRail {
    width: 6px;
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.2);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 6px;
}

.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 6px;
    margin: 5px 0;
}

.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    width: 12px;
}

.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
    height: 12px;
    margin: 2px 0;
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px;
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px;
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px;
}

.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px;
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.1);
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px;
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px;
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px;
}

.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset.mCSB_scrollTools .mCSB_draggerRail {
    width: 12px;
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.2);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 6px;
    margin: 3px 5px;
    position: absolute;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    height: 6px;
    margin: 5px 3px;
    position: absolute;
    width: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail {
    width: 100%;
    height: 12px;
    margin: 2px 0;
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -32px -72px;
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -32px -92px;
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -40px -112px;
}

.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -40px -128px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.1);
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp {
    background-position: -112px -72px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown {
    background-position: -112px -92px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft {
    background-position: -120px -112px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight {
    background-position: -120px -128px;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail {
    background-color: transparent;
    border-width: 1px;
    border-style: solid;
    border-color: #fff;
    border-color: rgba(255, 255, 255, 0.2);
    box-sizing: border-box;
}

.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
    border-color: #000;
    border-color: rgba(0, 0, 0, 0.2);
}

.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.6);
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.6);
}

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.75);
}

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.85);
}

.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.9);
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.75);
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.85);
}

.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.9);
}

/**
 * Swiper 6.7.0
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2021 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: May 31, 2021
 */
@font-face {
    font-family: swiper-icons;
    src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
    font-weight: 400;
    font-style: normal;
}
:root {
    --swiper-theme-color:#007aff;
}

.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1;
}

.swiper-container-vertical > .swiper-wrapper {
    flex-direction: column;
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box;
}

.swiper-container-android .swiper-slide, .swiper-wrapper {
    transform: translate3d(0px, 0, 0);
}

.swiper-container-multirow > .swiper-wrapper {
    flex-wrap: wrap;
}

.swiper-container-multirow-column > .swiper-wrapper {
    flex-wrap: wrap;
    flex-direction: column;
}

.swiper-container-free-mode > .swiper-wrapper {
    transition-timing-function: ease-out;
    margin: 0 auto;
}

.swiper-container-pointer-events {
    touch-action: pan-y;
}

.swiper-container-pointer-events.swiper-container-vertical {
    touch-action: pan-x;
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform;
}

.swiper-slide-invisible-blank {
    visibility: hidden;
}

.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide {
    height: auto;
}

.swiper-container-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property: transform, height;
}

.swiper-container-3d {
    perspective: 1200px;
}

.swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper {
    transform-style: preserve-3d;
}

.swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10;
}

.swiper-container-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-css-mode > .swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
    display: none;
}

.swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: start start;
}

.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
    scroll-snap-type: x mandatory;
}

.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
    scroll-snap-type: y mandatory;
}

:root {
    --swiper-navigation-size:44px;
}

.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: calc(var(--swiper-navigation-size) / 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - var(--swiper-navigation-size) / 2);
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color, var(--swiper-theme-color));
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
    opacity: 0.35;
    cursor: auto;
    pointer-events: none;
}

.swiper-button-next:after, .swiper-button-prev:after {
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    text-transform: none;
    font-variant: initial;
    line-height: 1;
}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
    left: 10px;
    right: auto;
}

.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after {
    content: "prev";
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    right: 10px;
    left: auto;
}

.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after {
    content: "next";
}

.swiper-button-next.swiper-button-white, .swiper-button-prev.swiper-button-white {
    --swiper-navigation-color:#ffffff;
}

.swiper-button-next.swiper-button-black, .swiper-button-prev.swiper-button-black {
    --swiper-navigation-color:#000000;
}

.swiper-button-lock {
    display: none;
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: 0.3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0;
}

.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%;
}

.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transform: scale(0.33);
    position: relative;
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
    transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    transform: scale(1);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    transform: scale(0.33);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    transform: scale(0.66);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    transform: scale(0.33);
}

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 50%;
    background: #000;
    opacity: 0.2;
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer;
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
}

.swiper-container-vertical > .swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    transform: translate3d(0px, -50%, 0);
}

.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 6px 0;
    display: block;
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
}

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    transition: 0.2s transform, 0.2s top;
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 4px;
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: 0.2s transform, 0.2s left;
}

.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: 0.2s transform, 0.2s right;
}

.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, 0.25);
    position: absolute;
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top;
}

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    transform-origin: right top;
}

.swiper-container-horizontal > .swiper-pagination-progressbar, .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0;
}

.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-container-vertical > .swiper-pagination-progressbar {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0;
}

.swiper-pagination-white {
    --swiper-pagination-color:#ffffff;
}

.swiper-pagination-black {
    --swiper-pagination-color:#000000;
}

.swiper-pagination-lock {
    display: none;
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, 0.1);
}

.swiper-container-horizontal > .swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%;
}

.swiper-container-vertical > .swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%;
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    left: 0;
    top: 0;
}

.swiper-scrollbar-cursor-drag {
    cursor: move;
}

.swiper-scrollbar-lock {
    display: none;
}

.swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.swiper-zoom-container > canvas, .swiper-zoom-container > img, .swiper-zoom-container > svg {
    max-width: 100%;
    max-height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}

.swiper-slide-zoomed {
    cursor: move;
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    animation: swiper-preloader-spin 1s infinite linear;
    box-sizing: border-box;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-radius: 50%;
    border-top-color: transparent;
}

.swiper-lazy-preloader-white {
    --swiper-preloader-color:#fff;
}

.swiper-lazy-preloader-black {
    --swiper-preloader-color:#000;
}

@keyframes swiper-preloader-spin {
    100% {
        transform: rotate(360deg);
    }
}
.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000;
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    transition-timing-function: ease-out;
}

.swiper-container-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity;
}

.swiper-container-fade .swiper-slide .swiper-slide {
    pointer-events: none;
}

.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
}

.swiper-container-cube {
    overflow: visible;
}

.swiper-container-cube .swiper-slide {
    pointer-events: none;
    backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height: 100%;
}

.swiper-container-cube .swiper-slide .swiper-slide {
    pointer-events: none;
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
    transform-origin: 100% 0;
}

.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
}

.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next + .swiper-slide, .swiper-container-cube .swiper-slide-prev {
    pointer-events: auto;
    visibility: visible;
}

.swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top {
    z-index: 0;
    backface-visibility: hidden;
}

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.6;
    z-index: 0;
}

.swiper-container-cube .swiper-cube-shadow:before {
    content: "";
    background: #000;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    filter: blur(50px);
}

.swiper-container-flip {
    overflow: visible;
}

.swiper-container-flip .swiper-slide {
    pointer-events: none;
    backface-visibility: hidden;
    z-index: 1;
}

.swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none;
}

.swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
}

.swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top {
    z-index: 0;
    backface-visibility: hidden;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
    display: block;
}

audio,
canvas,
video {
    display: inline-block;
}

audio:not([controls]) {
    display: none;
}

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

sub,
sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

img {
    border: 0;
    -ms-interpolation-mode: bicubic;
}

form {
    margin: 0;
    padding: 0;
}

button,
input,
select,
textarea {
    margin: 0;
    font-size: 100%;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
}

button,
input {
    line-height: normal;
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer;
}

label,
select,
button,
input[type=button],
input[type=reset],
input[type=submit],
input[type=radio],
input[type=checkbox] {
    cursor: pointer;
}

fieldset {
    padding: 0;
    margin: 0;
    border: 0;
}

textarea {
    overflow: auto;
    vertical-align: top;
}

input::-ms-clear {
    display: none;
}

/* Slider */
.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.slick-list:focus {
    outline: none;
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
}

.slick-track:before,
.slick-track:after {
    display: table;
    content: "";
}

.slick-track:after {
    clear: both;
}

.slick-loading .slick-track {
    visibility: hidden;
}

.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}

[dir=rtl] .slick-slide {
    float: right;
}

.slick-slide img {
    display: block;
}

.slick-slide.slick-loading img {
    display: none;
}

.slick-slide.dragging img {
    pointer-events: none;
}

.slick-initialized .slick-slide {
    display: block;
}

.slick-loading .slick-slide {
    visibility: hidden;
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
    display: none;
}

@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-SemiBold.woff2") format("woff2"), url("../fonts/Gilroy-SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Medium.woff2") format("woff2"), url("../fonts/Gilroy-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Regular.woff2") format("woff2"), url("../fonts/Gilroy-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Bold.woff2") format("woff2"), url("../fonts/Gilroy-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Gilroy";
    src: url("../fonts/Gilroy-Heavy.woff2") format("woff2"), url("../fonts/Gilroy-Heavy.woff") format("woff");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
body, html {
    height: 100%;
    min-height: 100%;
    min-width: 320px;
    scroll-behavior: smooth;
}

body {
    padding: 0px;
    margin: 0px;
    color: #fff;
    line-height: 1.35;
    font-size: 18px;
    font-family: "Gilroy", Arial, Helvetica, sans-serif;
    background: #4a8d83;
    font-weight: 500;
    overflow-y: auto;
}

img {
    display: block;
    max-width: 100%;
    border-style: none;
}

*,
*:before,
*:after {
    box-sizing: border-box;
    touch-action: manipulation;
}

a:not(.button) {
    text-decoration: underline;
    color: inherit;
}

a:not(.button):hover {
    text-decoration: none;
}

ul, ol {
    margin: 0;
    padding: 0;
    list-style: none outside;
}

b {
    font-weight: 700;
}

p {
    margin: 0 0 0.5em;
}

p:last-child {
    margin-bottom: 0;
}

.center {
    text-align: center;
}

.nowrap {
    white-space: nowrap;
}

.hidden {
    display: none !important;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0 0 0 0);
    overflow: hidden;
}

.container {
    max-width: 1775px;
    width: 92%;
    margin: 0 auto;
}

@media (max-width: 1079.9px) {
    .container {
        width: 100%;
        padding-left: 28px;
        padding-right: 28px;
    }
}
.button {
    display: inline-flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    vertical-align: top;
    font-size: 20em;
    text-decoration: none;
    padding: 0.5em 1em;
    line-height: 1.2;
    height: 3.5em;
    text-align: center;
    border: 0 none;
    margin: 0;
    font-family: "Gilroy", Arial, Helvetica, sans-serif;
    font-weight: 600;
    border-radius: 0.8em;
    position: relative;
    width: auto;
    max-width: 100%;
    white-space: nowrap;
}

.button--100 {
    width: 100%;
}

.button[disabled] {
    pointer-events: none;
}

.button--violet {
    background: #6939CF;
    color: #fff;
    transition: background-color 0.15s ease;
}
.button--violet[disabled] {
    background-color: #c3c3c3;
    border-color: #c3c3c3;
}

@media (hover: hover) {
    .button--violet:hover {
        background: #7D4DE2;
    }
}
.button--white {
    background: #fff;
    color: #6939CF;
    transition: background-color 0.15s ease;
}
.button--white[disabled] {
    color: #c3c3c3;
}

@media (hover: hover) {
    .button--white:hover {
        background: #CECBF2;
    }
}
.button--border {
    background: #fff;
    color: #6939CF;
    border: 1px solid #6939CF;
    transition: background-color 0.15s ease;
}
.button--border[disabled] {
    border-color: #c3c3c3;
    color: #c3c3c3;
}

@media (hover: hover) {
    .button--border:hover {
        background: #CECBF2;
    }
}
.button--transparent {
    background: transparent;
    color: #fff;
    border: 1px solid #fff;
    transition: background-color 0.15s ease;
}

@media (hover: hover) {
    .button--transparent:hover {
        background: rgba(255, 255, 255, 0.2);
    }
}
.wrapper {
    height: 100vh;
    height: 100svh;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, rgba(199, 173, 255, 0.4) 100%), linear-gradient(0deg, #C87987 0%, #C87987 82.31%, #C87987 100%);
    display: flex;
    position: relative;
}

.outer {
    flex: 1 0 100%;
    width: 100%;
    height: 100%;
    max-height: 1080px;
    max-width: 1920px;
    margin: auto;
    position: relative;
    border-radius: 24em;
    overflow: hidden;
    font-size: min(1px, 0.0925vh);
}

@media (max-width: 1920px), (max-height: 1080px) {
    .outer {
        border-radius: 0;
    }
}
@media (max-width: 1079.9px) {
    .outer {
        border-radius: 0;
        max-height: none;
        height: auto;
        min-height: 100vh;
        min-height: 100svh;
        font-size: 0.625px;
    }
}
.header {
    position: absolute;
    top: 40em;
    left: 0;
    right: 0;
    z-index: 50;
}

.header__container {
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: center;
}

.header__points {
    color: #FE8101;
    font-weight: 700;
    line-height: 1;
    background: url(../img/points-star.svg) no-repeat left 12em top calc(50% - 2em)/38em 36em #fff;
    padding: 16em 16em 16em 60em;
    border-radius: 12em;
    white-space: nowrap;
    width: -moz-fit-content;
    width: fit-content;
}
.header__points span {
    font-size: 28em;
}

.menu {
    flex: 0 0 60em;
}

.menu__button {
    display: block;
    width: 60em;
    height: 60em;
    background: none no-repeat center center #fff;
    border: 0 none;
    padding: 0;
    margin: 0;
    border-radius: 12em;
    transition: background-color 0.15s ease;
    flex: 0 0 60em;
}
.menu__button.tg {
    background-image: url(../img/icon-message2.svg);
    background-size: 36em 36em;
}
.menu__button.help {
    background-image: url(../img/icon-help.svg);
    background-size: 16em 27em;
}
.menu__button.shr {
    background-image: url(../img/icon-shr.svg);
    background-size: 28em 34em;
}
.menu__button.exit {
    background-image: url(../img/icon-exit.svg);
    background-size: 28em 34em;
}
.menu__button.sound {
    margin-left: auto;
    margin-right: 8em;
    background-image: url("data:image/svg+xml,%3Csvg width='34' height='25' viewBox='0 0 34 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M22.3101 6.79486C23.7161 8.20132 24.506 10.1086 24.506 12.0974C24.506 14.0861 23.7161 15.9934 22.3101 17.3999M27.6047 1.5C30.4168 4.31292 31.9965 8.12754 31.9965 12.105C31.9965 16.0825 30.4168 19.8971 27.6047 22.71M15.5 1.60492L8 7.60492H2V16.6049H8L15.5 22.6049V1.60492Z' stroke='%236939CF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    background-size: 34em 25em;
}
.menu__button.sound.off {
    background-image: url("data:image/svg+xml,%3Csvg width='34' height='24' viewBox='0 0 34 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M32 7.5L23 16.5M23 7.5L32 16.5M15.5 1.5L8 7.5H2V16.5H8L15.5 22.5V1.5Z' stroke='%236939CF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    background-size: 34em 24em;
}

@media (hover: hover) {
    .menu__button:hover {
        background-color: #CECBF2;
    }
}
@media (max-width: 1079.9px) {
    .header {
        top: 24px;
    }
}
.white-block {
    border-radius: 24em;
    background: #fff;
    padding: 48em;
    color: #493B68;
}
.white-block--error {
    text-align: center;
}
.white-block--error:before {
    content: "";
    width: 64em;
    height: 64em;
    background: url(../img/auth/icon-error.svg) no-repeat center center/64em 64em transparent;
    display: block;
    margin: 0 auto 32em;
}
.white-block--error h2 {
    font-size: 40em;
    font-weight: 700;
    line-height: 1;
    margin: 0 auto 0.5em;
    max-width: 10em;
}
.white-block--error .text {
    font-size: 20em;
    margin: 0 auto;
    max-width: 20em;
}

.input-hld {
    position: relative;
}

.text-input {
    display: block;
    box-sizing: border-box;
    width: 100%;
    background: #fff;
    padding: 0.33em;
    font-size: 24em;
    line-height: 1.35;
    font-family: "Gilroy", Arial, Helvetica, sans-serif;
    font-weight: 500;
    color: #493B68;
    margin: 0;
    border: 0.042em solid rgba(105, 57, 206, 0.2);
    position: relative;
    height: 2.66em;
    border-radius: 0.66em;
    text-align: center;
}
.text-input--loading {
    background-image: url(../img/input-loader.svg);
    background-repeat: no-repeat;
    background-position: right 0.5em center;
    background-size: 1.33em 1.33em;
}
.text-input[disabled] {
    opacity: 1;
}

.text-input:focus,
.text-input:focus-visible {
    border-color: #6939CF;
    outline: none;
}

.text-input.error {
    border-color: #FE0066;
}

.text-input::-webkit-input-placeholder {
    color: rgba(73, 59, 104, 0.3);
}

.text-input:-moz-placeholder,
.text-input::-moz-placeholder {
    color: rgba(73, 59, 104, 0.3);
    opacity: 1;
}

.text-input:-ms-input-placeholder {
    color: rgba(73, 59, 104, 0.3);
}

.input-hld label.error {
    display: block;
    color: #FE0066;
    font-size: 12em;
    font-weight: 500;
    text-align: center;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
}

.error-hld {
    margin-top: 1em;
    color: #FE0066;
    font-size: 16em;
    font-weight: 500;
    text-align: center;
}

.checkbox {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    font-size: 16em;
    font-weight: 500;
    position: relative;
    padding-left: 2.5em;
}
.checkbox span::before {
    content: "";
    width: 1.5em;
    height: 1.5em;
    border-radius: 0.5em;
    border: 1px solid rgba(105, 57, 206, 0.2);
    background: none no-repeat center center/1em 1em #fff;
    position: absolute;
    top: -0.1em;
    left: 0;
}
.checkbox input:checked ~ span::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath stroke-linecap='round' stroke='%23FFFFFF' stroke-width='3' fill='none' d='M22.9 3.7l-15.2 16.6-6.6-7.1'%3E%3C/path%3E%3C/svg%3E");
    background-color: #6939CF;
    border-color: #6939CF;
}
.checkbox input:focus-visible ~ span::before {
    border-color: #6939CF;
}

@media (max-width: 1079.9px) {
    .error-hld {
        background: #fff;
        padding: 0.5em;
        border-radius: 0.5em;
        position: absolute;
        bottom: 55px;
        left: 28px;
        right: 28px;
        max-width: 320px;
        margin: 0 auto;
    }
}
.sounds {
    display: none;
}

@keyframes pulse {
    0%, 40%, 100% {
        transform: scale(1);
    }
    20% {
        transform: scale(1.01);
    }
}
@keyframes pulse2 {
    0%, 40%, 100% {
        transform: scale(1);
    }
    20% {
        transform: scale(1.03);
    }
}
.loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #66ABF5;
    z-index: 5000;
    font-size: min(1px, 0.0925vh);
}
.loader .logos {
    position: absolute;
    top: 60em;
    left: 50%;
    transform: translateX(-50%);
}

.loading-cat {
    font-size: 1px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60em;
    overflow: hidden;
    transition: opacity 0.15s ease;
}
.loading-cat:before {
    content: "";
    display: block;
    padding-bottom: 100%;
}

.overlay--loading .loading-cat {
    opacity: 1;
}

.loading-cat__head,
.loading-cat__tail,
.loading-cat__body {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    animation: rotating 2.79s cubic-bezier(0.65, 0.54, 0.12, 0.93) infinite;
}
.loading-cat__head:before,
.loading-cat__tail:before,
.loading-cat__body:before {
    content: "";
    position: absolute;
    width: 50%;
    height: 50%;
    background-size: 200%;
    background-repeat: no-repeat;
    background-image: url("../img/cat-loader.png");
}

.loading-cat__head::before {
    top: 0;
    right: 0;
    background-position: 100% 0%;
    transform-origin: 0% 100%;
    transform: rotate(90deg);
}

.loading-cat__tail {
    animation-delay: 0.2s;
}
.loading-cat__tail:before {
    left: 0;
    bottom: 0;
    background-position: 0% 100%;
    transform-origin: 100% 0%;
    transform: rotate(-30deg);
}

.loading-cat__body {
    animation-delay: 0.1s;
}
.loading-cat__body:nth-of-type(2) {
    animation-delay: 0.2s;
}
.loading-cat__body:before {
    right: 0;
    bottom: 0;
    background-position: 100% 100%;
    transform-origin: 0% 0%;
}

@keyframes rotating {
    from {
        transform: rotate(720deg);
    }
    to {
        transform: none;
    }
}
.confirm-loader {
    position: relative;
    min-height: 80em;
}
.confirm-loader .loading-cat {
    font-size: 1em;
}
.confirm-loader .loading-cat__head:before,
.confirm-loader .loading-cat__tail:before,
.confirm-loader .loading-cat__body:before {
    background-image: url("../img/cat-loader-white.png");
}

.popup {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    padding: 0 20em;
    z-index: 1000;
    overflow-y: auto;
    font-size: min(1px, 0.1vh);
}

@supports (backdrop-filter: blur(2px)) {
    .popup {
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }
}
.popup__inner {
    flex: 1 1 100%;
    margin: auto;
    max-width: 470em;
    padding: 20em 0;
}

.popup__body {
    background: #fff;
    border-radius: 24em;
    padding: 32em;
    color: #493B68;
    --goods-list-height: 555em;
}

.popup__title {
    font-size: 32em;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 0.75em;
}

.popup__text {
    font-size: 24em;
    text-align: center;
}
.popup__text--nobr br {
    display: none;
}

.popup__buttons {
    margin: 24em 0 0;
}
.popup__buttons--two {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 16em;
}
.popup__buttons--two-row {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 16em;
}
.popup__buttons .button {
    width: 100%;
}

@media (max-width: 1079.9px) {
    .popup {
        font-size: 0.77px;
        overflow-y: auto;
    }
    .popup__inner {
        max-width: 310px;
    }
    .popup__body {
        padding: 26em 20em;
    }
    .popup__title {
        font-size: 20px;
    }
    .popup__text {
        font-size: 14px;
    }
    .popup__buttons .button {
        font-size: 15px;
    }
}
.start {
    background: url(../img/auth/start-bg.png) no-repeat center center/cover #5ea0f9;
}

.start__heroes {
    position: absolute;
    width: 819em;
    height: 947em;
    bottom: 30em;
    left: 50%;
}
.start__heroes.noimg .start__heroes-img {
    display: none;
}

.start__heroes-img {
    width: 100%;
    height: 100%;
    background: url(../img/auth/start-heroes.png) no-repeat bottom center/contain transparent;
}

.start__heroes-canvas {
    width: 904em;
    height: 1046em;
    position: absolute;
    top: 0;
    left: -40em;
}
.start__heroes-canvas canvas {
    display: block;
    width: 100%;
    height: 100%;
}

.start__main {
    margin-top: 136em;
    position: relative;
}

.start__content {
    max-width: 788em;
    text-align: center;
}
.start__content h1 {
    display: block;
    margin: 0 0 -14em;
}
.start__content h1 img {
    display: block;
    max-width: 100%;
}
.start__content h2 {
    font-size: 56em;
    font-weight: 700;
    line-height: 1;
    margin: 0 0 0.42em;
}
.start__content .text {
    font-size: 24em;
}

.auth__block {
    margin-top: 32em;
}
.auth__block h3 {
    font-size: 24em;
    font-weight: 700;
    margin: 0 0 1em;
}

.auth__form {
    max-width: 640em;
    margin: 0 auto;
    display: flex;
}
.auth__form .input-hld {
    margin: 0 24em 0 0;
    flex: 1 1 auto;
}
.auth__form .text-input {
    background-color: #EEF4FF;
    height: 2.9em;
}
.auth__form .button-hld {
    flex: 0 0 300em;
}
.auth__form .button {
    font-size: 24em;
    height: 2.9em;
}

.start__rules {
    font-size: 16em;
    margin-top: 2em;
}

.loader__cat,
.loader__title {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.loader__title {
    display: none;
    background: url(../img/auth/start-bg.png) no-repeat right bottom -50px/1100px auto #5ea0f9;
}
.loader__title .start__heroes {
    height: min(100vh - 150px - 20px, 410px);
    width: 100%;
    left: 0;
    bottom: 20px;
    background-size: auto 100%;
    background-position: bottom center;
}
.loader__title .start__heroes-img {
    height: 90%;
}
.loader__title .start__heroes-canvas {
    height: 100%;
    width: min((100vh - 150px - 20px) * 0.8642447, 354.340327px);
    left: 50%;
    transform: translateX(-50%);
}
.loader__title h1 {
    width: 300px;
    position: absolute;
    top: 65px;
    left: calc(50% - 150px);
}
.loader__title h1 img {
    display: block;
    width: 100%;
}

.loader-progress {
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    width: min(100vw - 56px, 310px);
    margin: 0 auto;
    border-radius: 16px;
    border: 2px solid #fff;
    background: #fff;
    overflow: hidden;
}

@keyframes fakeLoad {
    0% {
        width: 0%;
    }
    15% {
        width: 30%;
    }
    35% {
        width: 30%;
    }
    55% {
        width: 73%;
    }
    75% {
        width: 73%;
    }
    100% {
        width: 100%;
    }
}
.loader-progress__bar {
    height: 26px;
    border-radius: 13px;
    background: #6939CF;
    animation: fakeLoad 5s linear 0s forwards;
}

@media (max-width: 1079.9px) {
    .loader__cat {
        display: none;
    }
    .loader__title {
        display: block;
        font-size: 0.625px;
    }
    .start {
        background: url(../img/castle/castle-mob.png) no-repeat bottom min(50px - 28vw, 0px) center/100% auto #5b9cfb;
    }
    .start .start__heroes {
        display: none;
    }
    .start .header__container {
        justify-content: center;
    }
    .start label.error {
        color: #fff;
    }
    .start .error-hld {
        font-size: 12px;
    }
    .start__main {
        margin-top: 75px;
        position: static;
        padding-bottom: 32vw;
    }
    .start__content {
        max-width: 500px;
        margin: 0 auto;
    }
    .start__content h1 {
        display: none;
    }
    .start__content .white-block {
        background: transparent;
        border-radius: 0;
        padding: 0;
        color: #fff;
    }
    .start__content h2 {
        font-size: 32px;
    }
    .start__content .text {
        font-size: 16px;
    }
    .auth__block {
        margin-top: 32px;
    }
    .auth__block h3 {
        font-size: 18px;
    }
    .auth__form {
        max-width: 320px;
        display: block;
    }
    .auth__form .input-hld {
        margin: 0 0 16px;
    }
    .auth__form .text-input,
    .auth__form .button {
        font-size: 16px;
    }
    .start__rules {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background: rgba(0, 0, 0, 0.65);
        padding: 16px;
        text-align: center;
        font-size: 12px;
    }
    @supports (backdrop-filter: blur(5px)) {
        .start__rules {
            background: rgba(0, 0, 0, 0.45);
            backdrop-filter: blur(5px);
        }
    }
}
.register {
    background: url(../img/castle/castle.png) no-repeat center center/cover #fff;
    position: relative;
    display: flex;
}
.register:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
}

@supports (backdrop-filter: blur(15px)) {
    .register:before {
        background: rgba(0, 0, 0, 0.45);
        backdrop-filter: blur(15px);
    }
}
@media (max-width: 1079.9px) {
    .register {
        background: url(../img/castle/castle-mob.png) no-repeat bottom min(50px - 28vw, 0px) center/100% auto #5b9cfb;
    }
    .register--no-overlay:before {
        opacity: 0;
    }
}
.register__main {
    flex: 1 1 100%;
    margin: auto;
    position: relative;
}

/* register form */
.register__form {
    max-width: 760em;
    margin: 0 auto;
    color: #fff;
    text-align: center;
}

.register__title {
    font-size: 56em;
    font-weight: 700;
    line-height: 1;
    margin: 0 0 0.36em;
}

.register__text {
    max-width: 13em;
    font-size: 32em;
    font-weight: 600;
    margin: 0 auto 1.5em;
}

.form__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 32em 24em;
}
.form__grid .note {
    font-size: 16em;
    text-align: center;
    margin-top: 1.5em;
}

.form__cell--wide {
    grid-column: 1/-1;
}

.petrovich-warning {
    display: none;
    text-align: left;
    padding: 1.875em 1em 1em 3.75em;
    border-radius: 0 0 12px 12px;
    background: url(../img/auth/icon-warning.svg) no-repeat top 1.75em left 0.625em/2.5em 2.5em #FC3;
    font-size: 16em;
    font-weight: 500;
    line-height: 1;
    margin-top: -0.875em;
}
.petrovich-warning b {
    display: block;
    margin-bottom: 0.25em;
}

@media (max-width: 1079.9px) {
    .register__main {
        padding-top: 32px;
        padding-bottom: 32px;
    }
    .register__title {
        font-size: 32px;
    }
    .register__text {
        font-size: 16px;
    }
    .register__block {
        max-width: 310px;
        margin: 0 auto;
        padding: 24px 16px;
    }
    .form__grid {
        grid-template-columns: 1fr;
    }
}
/* phone confirm */
.register__confirm {
    max-width: 750em;
    margin: 0 auto;
}
.register__confirm .text {
    font-size: 24em;
    font-weight: 600;
    margin: 0 0 1em;
    text-align: center;
}

.confirm__logo {
    width: 246em;
    margin: 0 auto 16em;
}

.deco-code {
    width: 312em;
    margin: 0 auto;
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 8em;
    height: 80em;
}

.deco-code__input {
    text-align: center;
    font-size: 32em;
    font-weight: 700;
    line-height: 1.2;
    height: 2.5em;
    padding: 0.25em;
    border-radius: 0.5em;
}

.register__buttons {
    margin-top: 32em;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 16em;
}

@media (max-width: 1079.9px) {
    .register__confirm {
        max-width: 310px;
    }
    .register__buttons {
        grid-template-columns: 1fr;
    }
}
/* bad email */
.register__bad-email {
    max-width: 750em;
    margin: 0 auto;
}
.register__bad-email .white-block img {
    display: block;
    margin: 0 auto 16em;
    width: 246em;
}

.register__error {
    max-width: 750em;
    margin: 0 auto;
}

.petrovich-success {
    border-radius: 1.2em;
    background: url(../img/auth/icon-success-white.svg) no-repeat center left 2.2em/3.2em 3.25em #45BD83;
    margin: 0 0 0.8em;
    padding: 2em 2em 2em 6.8em;
    color: #fff;
    font-size: 20em;
    font-weight: 600;
}
.petrovich-success img {
    display: block;
    width: 6.8em;
    margin: 0 0 0.4em;
}

.register__button {
    margin: 32em auto 0;
    max-width: 480em;
}

@media (max-width: 1079.9px) {
    .register__bad-email,
    .register__error {
        max-width: 310px;
    }
}
/* legend */
.legend {
    background: url(../img/auth/legend-bg.png) no-repeat center center/cover #fff;
    position: relative;
    display: flex;
}
.legend .container {
    flex: 1 1 92%;
    margin: auto;
}

.legend__main {
    max-width: 1052em;
    margin: 0 auto;
    position: relative;
}
.legend__main:before {
    content: "";
    width: 350em;
    height: 488em;
    background: url(../img/talking-cat.svg) no-repeat bottom right/contain transparent;
    position: absolute;
    bottom: -22em;
    left: -277em;
}
@media (max-width: 1460px) {
    .legend__main:before {
        display: none;
    }
}
.legend__main .white-block {
    padding: 16em;
}
.legend__main h2 {
    color: #fff;
    text-align: center;
    font-size: 56em;
    font-weight: 700;
    line-height: 1;
    margin: 0 0 0.15em;
}
.legend__main .text {
    color: #fff;
    text-align: center;
    font-size: 24em;
    font-weight: 500;
    margin: 0 0 1.33em;
}

.legend__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 8em;
}
.legend__grid .prizes {
    margin-top: 0;
    border-radius: 24em;
    padding: 16em 24em 24em;
}
.legend__grid .prizes p {
    font-size: 16em;
}
.legend__grid .prize__pretitle {
    font-size: 32em;
}
.legend__grid .prize__title {
    font-size: 24em;
}
.legend__grid .prize__grid {
    padding: 20em 24em 15em;
    grid-template-columns: 135em 35em 1fr;
    grid-gap: 24em;
}

.legend__button {
    max-width: 480em;
    margin: 32em auto 0;
}
.legend__button .button {
    font-size: 24em;
}

@media (max-width: 1079.9px) {
    .legend {
        padding-top: clamp(200px, 45vw + 32px, 500px);
        padding-bottom: 32px;
        background: url(../img/auth/legend-bg-m.jpg) no-repeat top center/100% auto #3d6601;
    }
    .legend .container {
        padding-bottom: 88px;
    }
    .legend__main {
        max-width: 620px;
        border-radius: 24em;
        background: #fff;
        padding: 24px;
    }
    .legend__main h2 {
        font-size: 16px;
        font-weight: 500;
        color: #493B68;
        text-align: left;
        margin: 0;
        line-height: 1.35;
    }
    .legend__main h2:after {
        content: ".";
    }
    .legend__main .text {
        font-size: 16px;
        font-weight: 500;
        color: #493B68;
        text-align: left;
        margin: 0;
    }
    .legend__main .white-block {
        padding: 0;
        border-radius: 0;
        margin-top: 24px;
    }
    .legend__main .legend__grid {
        grid-template-columns: 1fr;
    }
    .legend__main .legend__grid .prizes p {
        font-size: 14em;
    }
    .legend__button {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        max-width: none;
        margin-top: 32px;
    }
    .legend__button .button {
        font-size: 16px;
    }
}
.castle {
    background: url(../img/castle/castle.png) no-repeat center center/cover #fff;
}
.castle .header__container {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
}
.castle .header__cell {
    position: relative;
}
.castle .header__buttons {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: flex-start;
}

.logos {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: flex-start;
    width: -moz-fit-content;
    width: fit-content;
}

.logos__sep {
    width: 1px;
    background: rgba(255, 255, 255, 0.5);
    height: 55em;
    margin: 0 30em;
}

.logo--petrovich {
    width: 189em;
}

.logo--askona {
    width: 212em;
}

.castle__buttons {
    position: absolute;
    bottom: 40em;
    max-width: 745em;
    width: 92%;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 24em;
    padding: 24em 60em;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 32em;
}
.castle__buttons::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 24em;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.8) 0%, rgba(142, 203, 205, 0.8) 100%);
}

@supports (backdrop-filter: blur(16px)) {
    .castle__buttons:before {
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, rgba(142, 203, 205, 0.4) 100%);
        backdrop-filter: blur(16px);
    }
}
.castle__path {
    position: absolute;
    width: 673em;
    height: 383em;
    background: url(../img/castle/castle-path.svg) no-repeat center center/100% 100% transparent;
    left: calc(50% - 286em);
    top: calc(58.5% - 191.5em);
}

.castle__room {
    width: 144em;
    height: 144em;
    background: #E9E7FA;
    border-radius: 50%;
    position: absolute;
    box-shadow: 0 0 0em rgba(233, 231, 250, 0);
    transition: box-shadow 0.2s ease;
}
.castle__room[data-room="1"] {
    bottom: 0;
    left: 317em;
}
.castle__room[data-room="2"] {
    top: 140em;
    left: 17em;
}
.castle__room[data-room="3"] {
    top: 0;
    left: 224em;
}
.castle__room[data-room="4"] {
    top: 170em;
    right: 0;
}
.castle__room .circle-chart {
    display: block;
    width: 140em;
    height: 140em;
    transform-origin: center center;
    transform: rotate(-90deg);
}
.castle__room .progress {
    fill: none;
    stroke: #6939CF;
    stroke-width: 20;
    stroke-linecap: butt;
}
.castle__room.disabled .castle__button {
    background-image: url(../img/castle/room-button-disable.svg);
    cursor: default;
}

@media (hover: hover) {
    .castle__room:not(.disabled):hover {
        box-shadow: 0 0 50em rgba(233, 231, 250, 0.8);
    }
}
.castle__button {
    width: 100%;
    height: 100%;
    color: #fff;
    font-family: "Gilroy", Arial, Helvetica, sans-serif;
    font-size: 56em;
    font-weight: 900;
    line-height: 1;
    border: 0;
    padding: 0;
    margin: 0;
    text-align: center;
    background: url(../img/castle/room-button-stroke.svg) no-repeat center center/100% 100% transparent;
    position: absolute;
    top: 0;
    left: 0;
}

@media (max-width: 1079.9px) {
    .castle {
        height: 100vh;
        height: 100svh;
        min-height: 550px;
        background: url(../img/castle/castle-mob.png) no-repeat bottom -145px center #5b9cfb;
    }
    .castle .header__container {
        display: flex;
        justify-content: space-between;
    }
    .castle .header__cell:nth-child(1) {
        position: absolute;
        top: 42px;
        left: 28px;
    }
    .logos {
        font-size: 0.65em;
    }
    .logos__sep {
        margin: 0 20em;
    }
    .castle__path {
        font-size: 0.85em;
        top: auto;
        bottom: 250px;
    }
    .castle__buttons {
        bottom: 32px;
        max-width: 330px;
        padding: 12px;
        grid-template-columns: 1fr;
        grid-gap: 12px;
    }
}
@media (max-width: 1079.9px) and (min-width: 799.9px) and (max-height: 635px) {
    .castle {
        background-position: top -80px center;
    }
    .castle__path {
        bottom: auto;
        top: 170px;
    }
}
@media (max-width: 800px) {
    .castle {
        background-size: 800px auto;
        background-position: bottom center;
    }
    .castle__path {
        font-size: 0.65em;
        bottom: 290px;
    }
}
.petrovich-ask-card {
    position: absolute;
    top: 4.5em;
    right: 4%;
    font-family: inherit;
    color: #493B68;
    font-size: 24em;
    font-weight: 500;
    line-height: 1.35;
    border-radius: 0.5em;
    background: url(../img/auth/icon-warning.svg) no-repeat left 0.4em center/1.66em 1.66em #FC3;
    padding: 0.58em 0.66em 0.58em 2.5em;
    margin: 0;
    border: 0 none;
    white-space: nowrap;
    z-index: 45;
    text-align: center;
}

@media (max-width: 1079.9px) {
    .petrovich-ask-card {
        width: 92%;
        max-width: 330px;
        left: 0;
        right: 0;
        margin: 0 auto;
        font-size: 16px;
        text-align: left;
        border: 1px solid rgba(73, 59, 104, 0.2);
        background-color: #fff;
        background-size: 40px 40px;
        background-position: left 12px center;
        min-height: 60px;
        top: auto;
        bottom: 170px;
        padding-left: 60px;
    }
}
#castle-game-choice .popup__inner {
    max-width: 1008em;
}
#castle-game-choice .popup__title {
    font-size: 56em;
}
#castle-game-choice.onboarding .game-choice__item {
    opacity: 1;
    animation: pulse 1.5s infinite;
}
#castle-game-choice.onboarding .game-choice__item[disabled] {
    opacity: 0.6;
    pointer-events: none;
    animation: none;
}
#castle-game-choice.onboarding .popup-close {
    display: none;
}

.castle-popup {
    background: rgba(0, 0, 0, 0.6);
}
.castle-popup .popup__buttons {
    max-width: 300em;
    margin: 32em auto 0;
}

@supports (backdrop-filter: blur(16px)) {
    .castle-popup {
        background: rgba(0, 0, 0, 0.45);
        backdrop-filter: blur(16px);
    }
}
.game-choice {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 25em;
}

.game-choice__item {
    display: block;
    padding: 0;
    margin: 0;
    font-size: inherit;
    border-radius: 24em;
    border: 3em solid #FFF;
    overflow: hidden;
}
.game-choice__item img {
    display: block;
    max-width: 100%;
}

@media (hover: hover) {
    .game-choice__item {
        opacity: 0.6;
        transition: opacity 0.2s ease;
    }
    .game-choice__item:hover {
        opacity: 1;
    }
}
#castle-get-bonus .popup__inner {
    max-width: 485em;
}

.getbonus {
    width: 485em;
    height: 320em;
    text-align: center;
    padding-top: 60em;
    position: relative;
    color: #fff;
}
.getbonus::before {
    content: "";
    width: 630em;
    height: 373em;
    background: url(../img/castle/everyday-bg.svg) no-repeat top center/100% 100% transparent;
    position: absolute;
    top: -55em;
    left: -55em;
}

.getbonus__title {
    position: relative;
    text-shadow: 0.072em 0.109em 0 #741444;
    font-size: 55em;
    font-weight: 600;
    line-height: 1.5;
    text-transform: uppercase;
    margin: 0;
}
.getbonus__title span {
    display: block;
    font-size: 1.76em;
    font-weight: 1000;
    line-height: 1;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.25em;
}
.getbonus__title span::before {
    content: "";
    width: 1em;
    height: 1em;
    flex: 0 1 1em;
    margin-right: 0.24em;
    background: url(../img/castle/everyday-star.svg) no-repeat center center/contain transparent;
}

@media (max-width: 1079.9px) {
    .castle-popup .popup__inner {
        padding-bottom: calc(102px + 20em);
        min-height: 100%;
        display: flex;
        position: relative;
    }
    .castle-popup .popup__buttons {
        max-width: 280px;
        position: absolute;
        bottom: 40px;
        left: 0;
        right: 0;
        margin: 0 auto;
    }
    .castle-popup .popup__container,
    .castle-popup .getbonus {
        flex: 0 1 auto;
        margin: auto;
    }
    .getbonus {
        font-size: 0.66em;
    }
    #castle-game-choice .popup__title {
        font-size: 32px;
    }
    #castle-game-choice .button {
        border-color: #6939CF;
        background-color: #6939CF;
        color: #fff;
    }
    .game-choice {
        max-width: 320px;
        margin-left: 0;
        margin-right: 0;
        grid-gap: 10px;
    }
}
#petrovich-popup .popup__inner {
    max-width: 760em;
}
#petrovich-popup .popup__body {
    padding: 48em 56em;
}
#petrovich-popup .popup__title {
    padding-top: 2.25em;
    margin-bottom: 0.33em;
    background: url(../img/auth/icon-warning.svg) no-repeat top center/2em 2em transparent;
}

.petrovich__form .popup__text {
    margin-bottom: 1em;
}
.petrovich__form .button-hld {
    margin-top: 16em;
}

.petrovich__error .popup__text {
    padding-top: 3.33em;
    background: url(../img/auth/icon-error.svg) no-repeat top center/2.66em 2.66em transparent;
}

.petrovich__success .popup__text {
    padding-top: 3.33em;
    background: url(../img/auth/icon-success.svg) no-repeat top center/2.66em 2.66em transparent;
}

@media (max-width: 1079.9px) {
    #petrovich-popup .popup__inner {
        max-width: 310px;
    }
    #petrovich-popup .popup__body {
        padding: 24px 16px;
    }
    .petrovich__start .popup__buttons--two {
        grid-template-columns: 1fr;
    }
}
.popup--with-close .popup__inner {
    padding-top: 100em;
    max-width: 530em;
}
.popup--with-close .popup__body {
    position: relative;
    padding: 24em 16em;
}

.popup__close {
    display: block;
    width: 60em;
    height: 60em;
    background: url(../img/popup-close.svg) no-repeat center center/29em 29em #fff;
    margin: 0;
    padding: 0;
    border: 0 none;
    border-radius: 12em;
    position: absolute;
    bottom: calc(100% + 16em);
    right: 0;
    z-index: 5;
}

#telegram-popup .popup__title {
    margin-bottom: 0.5em;
}

.telegram__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 28em;
}

.telegram__link {
    border-radius: 28em;
    border: 2em solid rgba(73, 59, 104, 0.2);
    background: #fff;
    padding: 27em 27em 13em;
}
.telegram__link:before {
    content: "";
    display: block;
    width: 70em;
    height: 70em;
    background: url(../img/icon-tg-white.svg) no-repeat center center/36em 32em #6939CF;
    border-radius: 14em;
    margin: 0 auto 27em;
}
.telegram__link--vk:before {
    background-image: url(../img/icon-vk-white.svg);
    background-size: 40em 25em;
}

#all-rules-popup .popup__inner {
    max-width: 1720em;
}
#all-rules-popup .popup__body {
    padding: 32em;
}

.all-rules p, .all-rules h3 {
    font-size: 24em;
    line-height: 1.35;
    font-weight: 500;
}
.all-rules p {
    margin-bottom: 1em;
}
.all-rules h3 {
    margin: 1.33em 0 0.66em;
    font-weight: 700;
}
.all-rules h3:first-child {
    margin-top: 0;
}

.all-rules__link {
    font-size: 16em;
    margin-top: 2em;
    text-align: center;
}

.prizes-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 8em;
    font-size: min(1em, 0.05vw);
}
.prizes-grid .prizes {
    margin-top: 0;
}

@media (max-width: 1079.9px) {
    .popup--with-close {
        font-size: 0.66px;
    }
    .popup--with-close .popup__body {
        padding: 24px 16px;
    }
    #telegram-popup .popup__title {
        font-size: 16px;
        margin-left: auto;
        margin-right: auto;
        max-width: 15em;
    }
    .prizes-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 24px;
    }
    .all-rules__link {
        font-size: 12px;
    }
}
@media (max-width: 650px) {
    .prizes-grid {
        grid-template-columns: 1fr;
    }
}
.shr__block {
    border-radius: 16em;
    border: 1px solid rgba(73, 59, 104, 0.25);
    padding: 24em 16em 32em;
    text-align: center;
}

.shr__list {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
}
.shr__list li {
    margin: 0 8em;
}

.shr__link {
    display: block;
    width: 60em;
    height: 60em;
    background: none no-repeat center center #6939CF;
    border-radius: 18em;
    transition: background-color 0.15s ease;
}
.shr__link--vk {
    background-image: url(../img/shr-vk.svg);
    background-size: 36em 22em;
}
.shr__link--tg {
    background-image: url(../img/shr-tg.svg);
    background-size: 30em 27em;
}
.shr__link--vi {
    background-image: url(../img/shr-vi.svg);
    background-size: 34em 36em;
}
.shr__link--wa {
    background-image: url(../img/shr-wa.svg);
    background-size: 35em 36em;
}

@media (hover: hover) {
    .shr__link:hover {
        background-color: #7D4DE2;
    }
}
.room {
    flex: 1 0 100%;
    width: 100%;
    height: 100%;
    max-height: 804px;
    margin: auto;
    position: relative;
    font-size: min(1px, 0.0925vh);
}
.room .mCSB_container {
    height: 100%;
    margin: 0 !important;
}
.room .mCSB_scrollTools {
    position: static;
}
.room .mCSB_draggerContainer {
    display: none;
}

.room-header {
    position: absolute;
    bottom: calc(100% + 40em);
    left: 0;
    right: 0;
    z-index: 100;
}

.room-header__container {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
}

.room__main {
    height: 100%;
    overflow: hidden;
    border-radius: 24em;
    position: relative;
    max-width: 2008px;
    margin: 0 auto;
}

.room__scroll {
    height: 100%;
    position: relative;
    overflow-x: hidden;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overscroll-behavior: none;
}
.room__scroll.scroll {
    overflow-x: auto;
}

.room__scroll::-webkit-scrollbar {
    display: none;
}

.room__size {
    position: relative;
    height: 100%;
    overflow: hidden;
    max-width: 2008px;
    max-height: 804px;
    margin: 0 auto;
}

.room__area {
    width: 2008px;
    height: 804px;
    position: absolute;
    top: 0;
    left: 0;
    background: #fff;
    transform-origin: top left;
}
.room__area > * {
    position: absolute;
    background: none no-repeat 0 0 transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.room-item__price {
    position: absolute;
    text-align: center;
    white-space: nowrap;
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    border-radius: 44px;
    padding: 0;
    margin: 0;
    border: 2px solid transparent;
    background: transparent;
    z-index: 5;
}
.room-item__price span {
    display: block;
    position: relative;
    background: url(../img/points-star.svg) no-repeat left 14px center/27px auto transparent;
    padding: 14px 12px 14px 42px;
    min-width: 100px;
}
.room-item__price:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 2px solid #fff;
    background: url(../img/price-blink.svg) no-repeat left -70px top 0px #6939CF;
    border-radius: 44px;
    transform-origin: center center;
    transition: transform 0.5s linear;
}

@media (hover: hover) {
    .room-item__price:hover:before {
        transform: scale(1.15);
        background-position: left calc(100% + 45px) top 0px;
        transition: transform 0.5s linear, background-position 0.3s linear 0.1s;
    }
}
.room-item.new .room-item__price {
    display: none;
}

.room-buttons {
    position: absolute;
    top: calc(100% + 38em);
    left: 0;
    right: 0;
    z-index: 100;
}
.room-buttons .button {
    width: 100%;
}

.room-buttons__list {
    max-width: 812em;
    width: 92%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 32em;
}

@media (max-width: 2008px), (max-height: 804px) {
    .room__main {
        border-radius: 0;
    }
}
@media (max-height: 1079.9px) {
    .room-header {
        bottom: auto;
        top: -75em;
    }
    .room-buttons {
        top: auto;
        bottom: -85em;
    }
}
@media (max-height: 999.9px), (max-width: 1079.9px) {
    .room-header {
        bottom: auto;
        top: 0;
        border-radius: 0 0 16em 16em;
        padding: 24em 0;
    }
    .room-header::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(0deg, rgba(255, 255, 255, 0.4) 0%, rgba(199, 173, 255, 0.4) 100%), linear-gradient(180deg, #C87987 0%, #C87987 82.31%, rgba(200, 121, 135, 0) 100%);
        backdrop-filter: blur(3px);
        z-index: 100;
        border-radius: 0 0 16em 16em;
    }
    .room-header__container {
        position: relative;
    }
    .room-header__container > * {
        position: relative;
        z-index: 105;
    }
    .room-buttons {
        top: auto;
        bottom: 0;
        border-radius: 16em 16em 0 0;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, rgba(199, 173, 255, 0.4) 100%), linear-gradient(0deg, #C87987 0%, #C87987 85.21%, rgba(200, 121, 135, 0) 100%);
        backdrop-filter: blur(3px);
        padding: 24em 0;
    }
    .room {
        max-height: calc(804px + 93em + 90em);
    }
    .room__main {
        padding: 93em 0 90em;
    }
}
@media (max-width: 1079.9px) and (min-height: 1000px) {
    .room-header::before {
        background: linear-gradient(0deg, #d39fb7 0%, #d39fb7 60%, rgba(200, 121, 135, 0) 95%);
    }
    .room-buttons {
        background: linear-gradient(180deg, #d39fb7 0%, #d39fb7 60%, rgba(200, 121, 135, 0) 95%);
    }
}
@media (max-width: 1079.9px) {
    .room {
        font-size: 0.625px;
        max-height: 1017px;
    }
    .room__main {
        padding: 73px 0 140px;
    }
    .room-header {
        padding: 24px 0;
    }
    .room-buttons {
        padding: 24px 0;
    }
    .room-buttons .button {
        font-size: 15px;
    }
    .room-buttons__list {
        width: calc(100% - 56px);
        max-width: 400px;
        grid-template-columns: 1fr;
        grid-gap: 12px;
    }
}
@keyframes growCircle {
    0% {
        r: 0;
        opacity: 0.8;
    }
    100% {
        r: 1150px;
        opacity: 1;
    }
}
@keyframes growHole {
    0% {
        r: 0;
    }
    100% {
        r: 1150px;
    }
}
.room__change {
    width: 2100px;
    height: 2100px;
    position: absolute;
    top: 100%;
    left: calc(50% - 1050px);
}
.room__change svg {
    display: block;
}
.room__change.animate {
    top: calc(50% - 1050px);
}
.room__change.animate .mask-circle {
    animation: growCircle 1s cubic-bezier(0.42, 0, 0.58, 1) 0s forwards;
}
.room__change.animate .mask-hole {
    animation: growHole 1s cubic-bezier(0.42, 0, 0.58, 1) 1s forwards;
}

.room__star {
    position: absolute;
    width: 1400px;
    height: 924px;
    top: calc(50% - 427px);
    left: calc(50% - 700px);
    transform-origin: center center;
    display: flex;
}
.room__star canvas {
    display: block;
    margin: auto;
    flex: 0 1 auto;
}

/* scroll arrows */
.room .room__scroll .mCSB_buttonLeft,
.room .room__scroll .mCSB_buttonRight,
.room .mob-arrow {
    display: block;
    font-size: inherit;
    width: 40em;
    height: 40em;
    border: 0 none;
    padding: 0;
    margin: 0;
    z-index: 100;
    background: url("data:image/svg+xml,%3Csvg width='18' height='24' viewBox='0 0 18 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_581_30268)'%3E%3Cpath d='M16.9486 4.39402C16.8248 4.26917 16.6774 4.17007 16.515 4.10244C16.3526 4.03482 16.1785 4 16.0026 4C15.8267 4 15.6525 4.03482 15.4901 4.10244C15.3278 4.17007 15.1804 4.26917 15.0565 4.39402L8.39414 11.0542C8.26925 11.1781 8.17012 11.3254 8.10248 11.4877C8.03483 11.65 8 11.8242 8 12C8 12.1758 8.03483 12.35 8.10248 12.5123C8.17012 12.6746 8.26925 12.8219 8.39414 12.9458L15.0565 19.606C15.1804 19.7308 15.3278 19.8299 15.4901 19.8976C15.6525 19.9652 15.8267 20 16.0026 20C16.1785 20 16.3526 19.9652 16.515 19.8976C16.6774 19.8299 16.8248 19.7308 16.9486 19.606C17.0735 19.4822 17.1727 19.3348 17.2403 19.1725C17.3079 19.0102 17.3428 18.8361 17.3428 18.6602C17.3428 18.4844 17.3079 18.3103 17.2403 18.148C17.1727 17.9856 17.0735 17.8383 16.9486 17.7145L11.219 12L16.9486 6.28552C17.0735 6.16169 17.1727 6.01437 17.2403 5.85204C17.3079 5.68972 17.3428 5.51562 17.3428 5.33977C17.3428 5.16392 17.3079 4.98982 17.2403 4.8275C17.1727 4.66517 17.0735 4.51785 16.9486 4.39402ZM31.6059 11.0542L24.9435 4.39402C24.8192 4.26982 24.6718 4.1713 24.5094 4.10408C24.3471 4.03687 24.1731 4.00227 23.9974 4.00227C23.6426 4.00227 23.3023 4.14319 23.0514 4.39402C22.9271 4.51821 22.8286 4.66566 22.7613 4.82793C22.6941 4.9902 22.6595 5.16413 22.6595 5.33977C22.6595 5.6945 22.8005 6.03469 23.0514 6.28552L28.781 12L23.0514 17.7145C22.9265 17.8383 22.8273 17.9856 22.7597 18.148C22.6921 18.3103 22.6572 18.4844 22.6572 18.6602C22.6572 18.8361 22.6921 19.0102 22.7597 19.1725C22.8273 19.3348 22.9265 19.4822 23.0514 19.606C23.1752 19.7308 23.3226 19.8299 23.485 19.8976C23.6474 19.9652 23.8215 20 23.9974 20C24.1733 20 24.3475 19.9652 24.5099 19.8976C24.6722 19.8299 24.8196 19.7308 24.9435 19.606L31.6059 12.9458C31.7307 12.8219 31.8299 12.6746 31.8975 12.5123C31.9652 12.35 32 12.1758 32 12C32 11.8242 31.9652 11.65 31.8975 11.4877C31.8299 11.3254 31.7307 11.1781 31.6059 11.0542Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_581_30268'%3E%3Crect width='18' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A") no-repeat left 10% center/auto 80% transparent;
    opacity: 1;
    transform-origin: 50% 50%;
    position: absolute;
    top: calc(50% - 20em) !important;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

.room .room__scroll .mCSB_buttonLeft,
.room .mob-arrow--left {
    left: 10em;
}

.room .room__scroll .mCSB_buttonRight,
.room .mob-arrow--right {
    right: 10em;
    transform: scaleX(-1);
}

.room--1 .walls {
    top: 0;
    left: 0;
    right: 0;
    height: 764px;
    background-image: url(../img/room1/walls-old.jpg);
}
.room--1 .walls.new {
    background-image: url(../img/room1/walls-new.jpg);
}
.room--1 .walls.new ~ .walls-shadow {
    background-image: url(../img/room1/walls-shadow-new.png);
}
.room--1 .walls .room-item__price {
    top: 436px;
    right: 441px;
}
.room--1 .floor {
    bottom: 0;
    left: 0;
    right: 0;
    height: 98px;
    background-image: url(../img/room1/floor-old.png);
}
.room--1 .floor.new {
    background-image: url(../img/room1/floor-new.png);
}
.room--1 .floor .room-item__price {
    bottom: 44px;
    left: 380px;
}
.room--1 .ceiling {
    top: 0;
    height: 139px;
    left: 168px;
    width: 1682px;
    background-image: url(../img/room1/ceiling-old.png);
}
.room--1 .ceiling.new {
    background-image: url(../img/room1/ceiling-new.png);
}
.room--1 .ceiling .room-item__price {
    top: 62px;
    left: 600px;
}
.room--1 .plaster {
    top: 0;
    height: 756px;
    left: 0;
    right: 0;
    background-image: url(../img/room1/plaster-old.png);
    background-position: left 218px top 100%;
}
.room--1 .plaster::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 218px;
    background: url(../img/room1/plaster-left-old.png) no-repeat 0 0 transparent;
}
.room--1 .plaster::after {
    content: "";
    position: absolute;
    left: 1764px;
    top: 0;
    bottom: 0;
    width: 246px;
    background: url(../img/room1/plaster-right-old.png) no-repeat 0 0 transparent;
}
.room--1 .plaster.new {
    background-image: url(../img/room1/plaster-new.png);
}
.room--1 .plaster.new::before {
    background-image: url(../img/room1/plaster-left-new.png);
}
.room--1 .plaster.new::after {
    background-image: url(../img/room1/plaster-right-new.png);
}
.room--1 .plaster .room-item__price {
    top: 190px;
    left: 117px;
}
.room--1 .paintings {
    width: 177px;
    height: 188px;
    background-image: url(../img/room1/paintings-left-old.png);
    top: 246px;
    left: 467px;
}
.room--1 .paintings.new {
    width: 228px;
    height: 485px;
    left: 353px;
    top: 240px;
    background-image: url(../img/room1/paintings-left-new.png);
}
.room--1 .paintings.new ~ .paintings-two {
    background-image: url(../img/room1/paintings-right-new.png);
}
.room--1 .paintings.new ~ .paintings-decor {
    display: block;
}
.room--1 .paintings .room-item__price {
    top: 72px;
    left: 40px;
}
.room--1 .paintings-two {
    width: 132px;
    height: 156px;
    background-image: url(../img/room1/paintings-right-old.png);
    top: 248px;
    right: 478px;
}
.room--1 .walls-shadow {
    width: 1564px;
    height: 712px;
    background-image: url(../img/room1/walls-shadow-old.png);
    top: 0;
    left: 230px;
}
.room--1 .drapes {
    width: 579px;
    height: 569px;
    background-image: url(../img/room1/drapes-old.png);
    top: 138px;
    left: 724px;
}
.room--1 .drapes.new {
    background-image: url(../img/room1/drapes-new.png);
    width: 549px;
    height: 642px;
    top: 139px;
    left: 734px;
}
.room--1 .drapes .room-item__price {
    top: 187px;
    left: 20px;
}
.room--1 .furniture-shadow {
    width: 1148px;
    height: 29px;
    background-image: url(../img/room1/furniture-shadow-old.png);
    bottom: 25px;
    left: 423px;
}
.room--1 .paintings-decor {
    display: none;
    width: 100%;
}
.room--1 .paintings-decor::before, .room--1 .paintings-decor::after {
    content: "";
    position: absolute;
}
.room--1 .paintings-decor::before {
    width: 293px;
    height: 634px;
    background: url(../img/room1/paintings-decor-left.png) no-repeat 0 0 transparent;
    left: 0;
    top: 153px;
}
.room--1 .paintings-decor::after {
    width: 246px;
    height: 599px;
    background: url(../img/room1/paintings-decor-right.png) no-repeat 0 0 transparent;
    right: 210px;
    top: 150px;
}
.room--1 .chairs-back {
    width: 1108px;
    height: 340px;
    background-image: url(../img/room1/chairs-old.png);
    background-position: left bottom;
    bottom: 31px;
    left: 471px;
}
.room--1 .chairs-back.new {
    background-image: url(../img/room1/chairs-new.png);
    left: 510px;
}
.room--1 .chairs-back.new ~ .chairs {
    background-image: url(../img/room1/chair-new.png);
    left: 1042px;
    bottom: 27px;
}
.room--1 .table {
    width: 638px;
    height: 219px;
    background-image: url(../img/room1/table-old.png);
    background-position: left bottom;
    bottom: 29px;
    left: 690px;
}
.room--1 .table.new {
    background-image: url(../img/room1/table-new.png);
    bottom: 29px;
    left: 700px;
}
.room--1 .table .room-item__price {
    top: -9px;
    left: 92px;
}
.room--1 .dish {
    width: 521px;
    height: 253px;
    background-image: url(../img/room1/dish-old.png);
    top: 387px;
    left: 719px;
}
.room--1 .dish.new {
    background-image: url(../img/room1/dish-new.png);
    top: 442px;
    left: 732px;
}
.room--1 .dish .room-item__price {
    top: 101px;
    left: 253px;
}
.room--1 .table.new ~ .dish.new {
    top: 437px;
}
.room--1 .chairs {
    width: 229px;
    height: 341px;
    background-image: url(../img/room1/chair-old.png);
    background-position: left bottom;
    bottom: 30px;
    left: 947px;
}
.room--1 .chairs .room-item__price {
    top: 184px;
    left: 92px;
}
.room--1 .light {
    width: 203px;
    height: 297px;
    background-image: url(../img/room1/light-old.png);
    top: 0;
    left: 851px;
}
.room--1 .light.new {
    width: 277px;
    background-image: url(../img/room1/light-new.png);
    left: 868px;
}
.room--1 .light .room-item__price {
    top: 104px;
    left: 110px;
}

.room--2 .walls {
    top: 11px;
    left: 0;
    right: 0;
    height: 758px;
    background-image: url(../img/room2/walls-old.jpg);
}
.room--2 .walls.new {
    background-image: url(../img/room2/walls-new.jpg);
}
.room--2 .walls .room-item__price {
    top: 390px;
    right: 215px;
}
.room--2 .floor {
    bottom: 0;
    left: 0;
    right: 0;
    height: 78px;
    background-image: url(../img/room2/floor-old.png);
}
.room--2 .floor.new {
    background-image: url(../img/room2/floor-new.png);
}
.room--2 .floor .room-item__price {
    bottom: 35px;
    left: 285px;
}
.room--2 .ceiling {
    top: 0;
    height: 162px;
    left: 0;
    right: 0;
    background-image: url(../img/room2/ceiling-old.png);
}
.room--2 .ceiling.new {
    background-image: url(../img/room2/ceiling-new.png);
}
.room--2 .ceiling .room-item__price {
    top: 65px;
    left: 830px;
}
.room--2 .switcher {
    top: 550px;
    left: 1145px;
    width: 34px;
    height: 32px;
}
.room--2 .switcher.new {
    background-image: url(../img/room2/switcher-new.png);
}
.room--2 .switcher .room-item__price {
    top: -20px;
    left: -10px;
}
.room--2 .walls-shadow {
    top: 0;
    left: 0;
    right: 0;
    height: 752px;
    background-image: url(../img/room2/walls-shadow-old.png);
}
.room--2 .door {
    width: 234px;
    height: 491px;
    background-image: url(../img/room2/door-old.png);
    top: 250px;
    left: 1200px;
}
.room--2 .door.new {
    background-image: url(../img/room2/door-new.png);
    width: 297px;
    height: 538px;
    left: 1170px;
    top: 210px;
}
.room--2 .door .room-item__price {
    top: 160px;
    left: 75px;
}
.room--2 .light {
    width: 283px;
    height: 333px;
    background-image: url(../img/room2/light-old.png);
    top: 405px;
    left: 650px;
}
.room--2 .light.new {
    background-image: url(../img/room2/light-new.png);
    height: 419px;
    left: 715px;
    top: 317px;
}
.room--2 .light .room-item__price {
    top: 30px;
    left: 140px;
}
.room--2 .fireplace {
    width: 239px;
    height: 452px;
    background-image: url(../img/room2/fireplace-old.png);
    top: 336px;
    left: 1470px;
}
.room--2 .fireplace.new {
    background-image: url(../img/room2/fireplace-new.png);
    width: 608px;
    height: 624px;
    left: 1243px;
    top: 180px;
}
.room--2 .fireplace .room-item__price {
    top: 235px;
    left: 45px;
}
.room--2 .bed {
    width: 1224px;
    height: 597px;
    background-image: url(../img/room2/bed-old.png);
    top: 221px;
    left: 0px;
}
.room--2 .bed.new {
    background-image: url(../img/room2/bed-new.png);
    top: 194px;
}
.room--2 .bed .room-item__price {
    top: 355px;
    left: 660px;
}
.room--2 .mirror {
    width: 201px;
    height: 482px;
    background-image: url(../img/room2/mirror-old.png);
    top: 322px;
    left: 90px;
}
.room--2 .mirror.new {
    background-image: url(../img/room2/mirror-new.png);
    width: 217px;
    height: 485px;
    top: 275px;
    left: 65px;
}
.room--2 .mirror .room-item__price {
    top: 130px;
    left: 40px;
}
.room--2 .armchair {
    width: 297px;
    height: 651px;
    background-image: url(../img/room2/armchair-old.png);
    bottom: 0;
    right: 6px;
}
.room--2 .armchair.new {
    background-image: url(../img/room2/armchair-new.png);
    width: 301px;
    height: 318px;
    right: 0;
}
.room--2 .armchair .room-item__price {
    top: 425px;
    left: 90px;
}

.room--3 .walls {
    top: 20px;
    left: 0;
    right: 0;
    height: 743px;
    background-image: url(../img/room3/walls-old.jpg);
}
.room--3 .walls.new {
    top: 12px;
    background-image: url(../img/room3/walls-new.jpg);
}
.room--3 .walls .room-item__price {
    top: 364px;
    right: 320px;
}
.room--3 .ceiling {
    top: 0;
    height: 195px;
    left: 0;
    right: 0;
    background-image: url(../img/room3/ceiling-old.png);
}
.room--3 .floor {
    bottom: 0;
    left: 0;
    right: 0;
    height: 92px;
    background-image: url(../img/room3/floor-old.png);
}
.room--3 .floor.new {
    height: 93px;
    bottom: -2px;
    background-image: url(../img/room3/floor-new.png);
}
.room--3 .floor .room-item__price {
    bottom: 27px;
    left: 225px;
}
.room--3 .window {
    width: 1111px;
    height: 560px;
    background-image: url(../img/room3/window-old.png);
    top: 175px;
    left: 458px;
}
.room--3 .window.new {
    background-image: url(../img/room3/window-new.png);
    top: 189px;
    left: 464px;
}
.room--3 .window .room-item__price {
    top: 91px;
    left: 42px;
}
.room--3 .walls-shadow {
    top: 0;
    left: 0;
    right: 0;
    height: 719px;
    background-image: url(../img/room3/walls-shadow-old.png);
}
.room--3 .armchair {
    width: 220px;
    height: 244px;
    background-image: url(../img/room3/armchair-old.png);
    top: 532px;
    left: 1263px;
}
.room--3 .armchair.new {
    background-image: url(../img/room3/armchair-new.png);
    width: 305px;
    height: 328px;
    left: 1233px;
    top: 472px;
}
.room--3 .armchair .room-item__price {
    top: 52px;
    left: 90px;
}
.room--3 .sofa {
    width: 579px;
    height: 278px;
    background-image: url(../img/room3/sofa-old.png);
    top: 505px;
    left: 367px;
}
.room--3 .sofa.new {
    background-image: url(../img/room3/sofa-new.png);
    width: 595px;
    height: 250px;
    top: 545px;
    left: 360px;
}
.room--3 .sofa .room-item__price {
    top: 105px;
    left: 345px;
}
.room--3 .table {
    width: 235px;
    height: 105px;
    background-image: url(../img/room3/table-old.png);
    top: 675px;
    left: 962px;
}
.room--3 .table.new {
    background-image: url(../img/room3/table-new.png);
    width: 284px;
    height: 239px;
    top: 550px;
    left: 940px;
}
.room--3 .table .room-item__price {
    top: -25px;
    left: 115px;
}
.room--3 .tv {
    width: 428px;
    height: 556px;
    background-image: url(../img/room3/tv-old.png);
    top: 218px;
    left: 1497px;
}
.room--3 .tv.new {
    background-image: url(../img/room3/tv-new.png);
    width: 494px;
    height: 335px;
    top: 450px;
    left: 1490px;
}
.room--3 .tv .room-item__price {
    top: 100px;
    left: 285px;
}
.room--3 .mirror {
    width: 204px;
    height: 343px;
    background-image: url(../img/room3/mirror-old.png);
    top: 133px;
    left: 62px;
}
.room--3 .mirror.new {
    background-image: url(../img/room3/mirror-new.png);
    width: 165px;
    height: 524px;
    top: 182px;
    left: 63px;
}
.room--3 .mirror .room-item__price {
    top: 170px;
    left: 85px;
}
.room--3 .plants {
    top: 0;
    left: 0;
}
.room--3 .plants.new {
    background-image: url(../img/room3/plants-new.png);
    width: 394px;
    height: 366px;
    top: 418px;
    left: -55px;
}
.room--3 .plants .room-item__price {
    top: 577px;
    left: 260px;
}
.room--3 .light {
    width: 54px;
    height: 156px;
    background-image: url(../img/room3/light-old.png);
    top: 64px;
    left: 980px;
}
.room--3 .light.new {
    background-image: url(../img/room3/light-new.png);
    width: 455px;
    height: 160px;
    top: -10px;
    left: 775px;
}
.room--3 .light .room-item__price {
    top: 40px;
    left: -10px;
}

.room--4 .bg {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(../img/room4/bg.jpg);
}
.room--4 .drapes {
    top: 0;
    left: 0;
}
.room--4 .drapes.new {
    width: 663px;
    height: 668px;
    background-image: url(../img/room4/drapes-new.png);
}
.room--4 .drapes .room-item__price {
    top: 207px;
    left: 520px;
}
.room--4 .light {
    top: 0;
    left: 495px;
}
.room--4 .light.new {
    width: 1265px;
    height: 250px;
    background-image: url(../img/room4/light-new.png);
}
.room--4 .light .room-item__price {
    top: 120px;
    left: 475px;
}
.room--4 .lawn-mower {
    top: 395px;
    right: 0;
}
.room--4 .lawn-mower.new {
    width: 268px;
    height: 270px;
    background-image: url(../img/room4/lawn-mower-new.png);
}
.room--4 .lawn-mower .room-item__price {
    top: 182px;
    right: 105px;
}
.room--4 .watering-can {
    top: 475px;
    right: 255px;
}
.room--4 .watering-can.new {
    width: 288px;
    height: 187px;
    background-image: url(../img/room4/watering-can-new.png);
}
.room--4 .watering-can .room-item__price {
    top: 80px;
    right: 40px;
}
.room--4 .heater {
    top: 66px;
    left: 80px;
}
.room--4 .heater.new {
    width: 170px;
    height: 625px;
    background-image: url(../img/room4/heater-new.png);
}
.room--4 .heater .room-item__price {
    top: 216px;
    left: 35px;
}
.room--4 .furniture {
    top: 414px;
    left: 0;
    width: 1317px;
    height: 341px;
    background-image: url(../img/room4/furniture-old.png);
}
.room--4 .furniture.new {
    width: 1156px;
    height: 359px;
    top: 422px;
    left: 118px;
    background-image: url(../img/room4/furniture-new.png);
}
.room--4 .furniture .room-item__price {
    top: 180px;
    right: 165px;
}
.room--4 .pillows {
    top: 468px;
    left: 246px;
}
.room--4 .pillows.new {
    width: 285px;
    height: 126px;
    background-image: url(../img/room4/pillows-new.png);
}
.room--4 .pillows .room-item__price {
    top: 50px;
    left: 150px;
}
.room--4 .plants {
    top: 0;
    left: 1265px;
}
.room--4 .plants.new {
    width: 306px;
    height: 660px;
    background-image: url(../img/room4/plants-right-new.png);
}
.room--4 .plants .room-item__price {
    top: 520px;
    left: 50px;
}
.room--4 .plants-left {
    top: 531px;
    left: 0;
}
.room--4 .plants-left.new {
    width: 211px;
    height: 244px;
    background-image: url(../img/room4/plants-left-new.png);
}
.room--4 .basket {
    top: 610px;
    right: 360px;
}
.room--4 .basket.new {
    width: 274px;
    height: 185px;
    background-image: url(../img/room4/basket-new.png);
}
.room--4 .basket .room-item__price {
    top: 105px;
    right: 35px;
}
.room--4 .tablecloth {
    top: 532px;
    left: 652px;
}
.room--4 .tablecloth.new {
    width: 348px;
    height: 133px;
    background-image: url(../img/room4/tablecloth-new.png);
}
.room--4 .lantern {
    top: 372px;
    left: 854px;
}
.room--4 .lantern.new {
    width: 100px;
    height: 175px;
    background-image: url(../img/room4/lantern-new.png);
}
.room--4 .lantern .room-item__price {
    top: 80px;
    left: 10px;
}

#room-confirm .popup__title {
    margin-bottom: 0.3em;
}

p.room-goods__empty-text {
    margin: auto;
    font-size: 24em;
    line-height: 1.35;
    text-align: center;
}
p.room-goods__empty-text::before {
    content: "";
    font-size: 0.0625em;
    display: block;
    width: 64em;
    height: 64em;
    background: url(../img/no-goods-icon.svg) no-repeat center center/contain transparent;
    margin: 0 auto 24em;
}

.room-goods {
    max-height: var(--goods-list-height);
    overflow-y: auto;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    padding: 16em 0;
    scrollbar-width: thin;
    scrollbar-color: #E5DCF6 #F7F5FC;
}
.room-goods--empty {
    height: var(--goods-list-height);
    overflow: visible;
    display: flex;
}
.room-goods::-webkit-scrollbar {
    width: 10em;
}
.room-goods::-webkit-scrollbar-thumb {
    background: #E5DCF6;
    border-radius: 5em;
}
.room-goods::-webkit-scrollbar-track {
    background-color: #F7F5FC;
    border: 0 none;
}
.room-goods::-webkit-scrollbar-button {
    background-color: #E5DCF6;
    border-radius: 5em;
    display: none;
}

.room-good {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: flex-start;
    font-weight: 500;
    line-height: 1.2;
    padding-right: 16em;
}
.room-good + .room-good {
    margin-top: 16em;
}

.room-good__image {
    flex: 0 0 64em;
    width: 64em;
    height: 64em;
    -o-object-fit: cover;
    object-fit: cover;
    margin-right: 16em;
    border-radius: 18em;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.room-good__name {
    flex: 1 1 auto;
    margin: 0;
    font-size: 20em;
}

.room-good__buy {
    font-size: inherit;
    flex: 0 0 56em;
    width: 56em;
    height: 56em;
    background: url(../img/room-cart.svg) no-repeat center center/34em 31em #6939CF;
    border-radius: 50%;
    border: 0 none;
    margin: 0 0 0 16em;
    padding: 0;
    transition: background-color 0.15s ease;
}

@media (hover: hover) {
    .room-item__buy:hover {
        background-color: #7D4DE2;
    }
}
@media (max-width: 1079.9px) {
    #room-confirm .popup__title {
        font-size: 16px;
    }
    .room-good__image {
        border-radius: 12px;
    }
    .room-good__buy {
        font-size: 0.83em;
    }
    .room-goods {
        max-height: min(540em, 100svh - 115px);
        min-height: 80px;
    }
    .room-goods__empty-text {
        font-size: 16px;
    }
}
#room-done .popup__title {
    font-size: 32em;
    line-height: 1;
    margin-bottom: 0.25em;
}

.prizes {
    line-height: 1.35;
    background: linear-gradient(0deg, rgba(249, 255, 255, 0.2) -52.3%, rgba(232, 247, 252, 0.2) -29.99%, rgba(188, 227, 244, 0.2) 0.12%, rgba(125, 199, 234, 0.2) 39.48%, rgba(115, 187, 238, 0.2) 108.2%);
    border-radius: 8em;
    padding: 16em;
    margin-top: 24em;
}
.prizes p {
    margin: 0;
    font-size: 14em;
}
.prizes p + p {
    margin-top: 0.25em;
}
.prizes .prize__club {
    width: -moz-fit-content;
    width: fit-content;
    padding: 0.25em 0.5em;
    background: #F1F9FD;
    border-radius: 0.5em;
}

.prize + .prize {
    margin-top: 24em;
}

.prize__pretitle {
    font-size: 24em;
    font-weight: 700;
    margin: 0 0 0.35em;
    text-align: center;
}

.prize {
    background: #fff;
    border-radius: 8em;
    overflow: hidden;
}

.prize__title {
    padding: 0.125em;
    border-radius: 0.33em;
    background: #00B9BF;
    color: #fff;
    font-size: 20em;
    font-weight: 700;
    text-align: center;
    margin: 0;
}
.prize__title--petrovich {
    background: #ED1C24;
}

.prize__row {
    padding: 12em;
    text-align: center;
}

.prize__grid {
    padding: 16em;
    display: grid;
    grid-template-columns: 120em 30em 1fr;
    grid-gap: 15em;
    align-items: stretch;
}
.prize__grid .prize__row {
    padding: 0;
    text-align: left;
}

.prize__count {
    font-size: 1em;
    white-space: nowrap;
}
.prize__count span {
    font-size: 1.5em;
    padding-left: 1.55em;
    background: url(../img/prize-diamond.svg) no-repeat left center/1.2em auto transparent;
}

.prize__or {
    font-size: 16em;
    font-style: normal;
    line-height: 1;
    text-align: center;
    padding: 1.25em 0;
    position: relative;
    margin-top: 0.4em;
}
.prize__or:before, .prize__or:after {
    content: "";
    width: 0.0625em;
    height: 1em;
    background: rgba(73, 59, 104, 0.2);
    position: absolute;
    left: 50%;
}
.prize__or:before {
    top: 0;
}
.prize__or:after {
    bottom: 0;
}

@media (max-width: 1079.9px) {
    .prize__grid {
        grid-template-columns: 1fr !important;
        grid-gap: 0 !important;
    }
    .prize__grid .prize__row {
        text-align: center;
    }
    .prizes {
        font-size: 0.875px;
        padding: 16px !important;
    }
    .prizes .prize__club {
        margin-left: auto;
        margin-right: auto;
    }
    .prize__pretitle {
        font-size: 24px !important;
    }
    .prize__or {
        padding: 0;
        margin: 1em 0;
    }
    .prize__or:before, .prize__or:after {
        height: 1px;
        width: calc(50% - 1.5em);
        top: 50%;
        bottom: auto;
    }
    .prize__or:before {
        left: 0;
    }
    .prize__or:after {
        left: auto;
        right: 0;
    }
}
@media (max-width: 767.9px) {
    #room-done .popup__body {
        font-size: 1px;
    }
}
.game--cards {
    background: url(../img/game1/bg.png) no-repeat bottom center/cover #5a9bfb;
}
.game--catch {
    background: url(../img/game2/bg.jpg) no-repeat bottom center/cover #998bba;
}

.game-header {
    position: absolute;
    top: 40em;
    left: 0;
    right: 0;
    z-index: 50;
}

.game-header__container {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
}

.game-header__timer {
    padding: 16em 8em 16em 60em;
    color: #6939CF;
    text-align: left;
    width: 135em;
    border-radius: 12em;
    background: url(../img/icon-timer.svg) no-repeat left 12em center/32em 42em #fff;
}
.game-header__timer span {
    font-size: 28em;
    font-weight: 700;
    line-height: 1;
}

.game-header__counter {
    padding: 16em 12em 16em 65em;
    color: #6939CF;
    text-align: left;
    width: 160em;
    text-align: center;
    border-radius: 12em;
    background: url(../img/icon-counter.svg) no-repeat left 12em center/44em 42em #fff;
}
.game-header__counter span {
    font-size: 28em;
    font-weight: 700;
    line-height: 1;
}

.menu {
    position: relative;
}
.menu--opened .open-menu {
    background-image: url(../img/icon-top.svg);
    background-size: 31em 17em;
}
.menu--opened .menu__list {
    display: block;
}

.menu__list {
    display: none;
    padding-top: 8em;
    position: absolute;
    top: 100%;
    right: 0;
}
.menu__list li + li {
    margin-top: 8em;
}

.open-menu {
    background-image: url(../img/icon-menu.svg);
    background-size: 31em 20em;
}

.game__screen {
    position: absolute;
    top: 140em;
    height: calc(100% - 140em - 80em);
    left: 0;
    right: 0;
}

@media (max-width: 1079.9px) {
    .game--cards {
        background-size: min(1200px, 110vw) auto;
        background-position: bottom left max(-150px, -8vw);
    }
    .game--cards:before {
        content: "";
        position: absolute;
        bottom: -10px;
        left: 0;
        right: 0;
        background: url(../img/game1/bg-flowers.svg) no-repeat center center/contain transparent;
        height: min(58px, 16vw);
    }
    .game-header {
        top: 24px;
    }
    .game__screen {
        position: relative;
        height: auto;
        min-height: 100vh;
        min-height: 100svh;
        top: 0;
        padding-top: 90px;
        padding-bottom: 50px;
    }
    .game__screen.cards {
        padding-bottom: 190px;
    }
}
@keyframes gameClouds {
    to {
        background-position: -2155em 0;
    }
}
.game-cards__cloud {
    position: absolute;
    bottom: 50%;
    left: 0;
    right: 0;
    height: 623em;
    background: url(../img/game1/clouds.png) repeat-x 0 0/2155em 623em transparent;
    opacity: 1;
    transition: opacity 0.15s linear;
    animation: gameClouds 80s linear 0s infinite;
}
.game-cards__cloud.transparent {
    opacity: 0;
}

.cards__container {
    width: 92%;
    max-width: 1775px;
    padding: 0;
    height: 100%;
    font-size: min(0.052vw, 1em);
}

.cards__area {
    height: 100%;
    position: relative;
}

.cards__right {
    position: absolute;
    right: 0;
    bottom: 35em;
}

.cards__cat {
    width: 600em;
    padding-top: 133.3333%;
    position: relative;
}
.cards__cat canvas {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 20%;
    left: 0;
}

.cards__cat-img {
    position: absolute;
    width: 498em;
    height: 579em;
    right: 0;
    bottom: 0;
    background: url(../img/game1/speech-cat.png) no-repeat 0 0/contain transparent;
}

.cards__bubble {
    width: 459em;
    height: 316em;
    background: url(../img/game1/speech-bubble.svg) no-repeat 0 0/contain transparent;
    position: absolute;
    top: -30em;
    left: -260em;
    padding: 5em 70em 50em 45em;
    display: flex;
}
.cards__bubble p {
    margin: auto;
    text-align: center;
    color: #493B68;
    font-size: 32em;
    line-height: 1;
    flex: 0 1 auto;
}

.cards__left {
    width: 50%;
    height: 100%;
    display: flex;
}

.cards__grid {
    margin: auto 0;
    flex: 1 1 100%;
    max-width: 774em;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 16em;
}

.cards__cell {
    position: relative;
    perspective: 500px;
}
.cards__cell::before {
    content: "";
    display: block;
    padding-top: 143.66%;
}

.cards__item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: transform 0.3s linear;
    transform-style: preserve-3d;
    transform-origin: center center;
    transform: rotateY(0deg) translateZ(0);
    cursor: pointer;
    will-change: transform;
}

.cards__cell.flip .cards__item {
    transform: rotateY(180deg) translateZ(0);
}

.cards__front,
.cards__back {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    overflow: hidden;
    border-radius: 16em;
    transform-origin: center center;
}

.cards__front {
    background: #FFCC33;
}
.cards__front:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: none no-repeat 0 0 transparent;
    transform-origin: center center;
}

.cards__cell:nth-child(1) .cards__front:before,
.cards__cell:nth-child(5) .cards__front:before,
.cards__cell:nth-child(7) .cards__front:before,
.cards__cell:nth-child(9) .cards__front:before,
.cards__cell:nth-child(12) .cards__front:before,
.cards__cell:nth-child(15) .cards__front:before,
.cards__cell:nth-child(16) .cards__front:before {
    background-image: url(../img/game1/card-back2.png);
    background-size: 108em 121em;
    background-position: top left;
}

.cards__cell:nth-child(5) .cards__front:before,
.cards__cell:nth-child(15) .cards__front:before {
    transform: scale(-1);
}

.cards__cell:nth-child(7) .cards__front:before {
    transform: scaleX(-1);
}

.cards__cell:nth-child(9) .cards__front:before {
    transform: scaleY(-1);
}

.cards__cell:nth-child(3) .cards__front:before,
.cards__cell:nth-child(4) .cards__front:before,
.cards__cell:nth-child(6) .cards__front:before,
.cards__cell:nth-child(10) .cards__front:before,
.cards__cell:nth-child(11) .cards__front:before,
.cards__cell:nth-child(13) .cards__front:before,
.cards__cell:nth-child(14) .cards__front:before,
.cards__cell:nth-child(17) .cards__front:before,
.cards__cell:nth-child(18) .cards__front:before,
.cards__cell:nth-child(20) .cards__front:before {
    background-image: url(../img/game1/card-back1.png);
    background-size: 150em 240em;
    background-position: top center;
}

.cards__cell:nth-child(3) .cards__front:before,
.cards__cell:nth-child(13) .cards__front:before,
.cards__cell:nth-child(17) .cards__front:before {
    transform: scaleY(-1);
    background-position: top -34em center;
}

.cards__cell:nth-child(6) .cards__front:before,
.cards__cell:nth-child(11) .cards__front:before {
    background-position: top -34em center;
}

.cards__cell:nth-child(10) .cards__front:before,
.cards__cell:nth-child(18) .cards__front:before {
    transform: translateX(29em) rotate(-90deg);
}

.cards__cell:nth-child(2) .cards__front:before,
.cards__cell:nth-child(8) .cards__front:before,
.cards__cell:nth-child(19) .cards__front:before {
    background-image: url(../img/game1/card-back3.png);
    background-size: 55em 180em;
    background-position: center center;
}

.cards__back {
    background: url(../img/game1/item-paw.svg) no-repeat center center/143em 147em #fff;
    transform: rotateY(180deg) translateZ(1px);
    z-index: 1;
}
.cards__back:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: none no-repeat 0 0/500% 500% transparent;
    transform-origin: center center;
}

.cards__item--0 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--1 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--2 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--3 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--4 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--5 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--6 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--7 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--8 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--9 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--10 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--11 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--12 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--13 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--14 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--15 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--16 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--17 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--18 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--19 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--20 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--21 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--22 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--23 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--24 .cards__back:before {
    background-image: url(../img/game1/items1.png);
}

.cards__item--25 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--26 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--27 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--28 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--29 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--30 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--31 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--32 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--33 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--34 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--35 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--36 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--37 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--38 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--39 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--40 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--41 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--42 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--43 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--44 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--45 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--46 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--47 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--48 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--49 .cards__back:before {
    background-image: url(../img/game1/items2.png);
}

.cards__item--50 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--51 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--52 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--53 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--54 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--55 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--56 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--57 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--58 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--59 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--60 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--61 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--62 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--63 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--64 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--65 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--66 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--67 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--68 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--69 .cards__back:before {
    background-image: url(../img/game1/items3.png);
}

.cards__item--0 .cards__back:before,
.cards__item--25 .cards__back:before,
.cards__item--50 .cards__back:before {
    background-position: 0% 0;
}

.cards__item--1 .cards__back:before,
.cards__item--26 .cards__back:before,
.cards__item--51 .cards__back:before {
    background-position: 25% 0;
}

.cards__item--2 .cards__back:before,
.cards__item--27 .cards__back:before,
.cards__item--52 .cards__back:before {
    background-position: 50% 0;
}

.cards__item--3 .cards__back:before,
.cards__item--28 .cards__back:before,
.cards__item--53 .cards__back:before {
    background-position: 75% 0;
}

.cards__item--4 .cards__back:before,
.cards__item--29 .cards__back:before,
.cards__item--54 .cards__back:before {
    background-position: 100% 0;
}

.cards__item--5 .cards__back:before,
.cards__item--30 .cards__back:before,
.cards__item--55 .cards__back:before {
    background-position: 0% 25%;
}

.cards__item--6 .cards__back:before,
.cards__item--31 .cards__back:before,
.cards__item--56 .cards__back:before {
    background-position: 25% 25%;
}

.cards__item--7 .cards__back:before,
.cards__item--32 .cards__back:before,
.cards__item--57 .cards__back:before {
    background-position: 50% 25%;
}

.cards__item--8 .cards__back:before,
.cards__item--33 .cards__back:before,
.cards__item--58 .cards__back:before {
    background-position: 75% 25%;
}

.cards__item--9 .cards__back:before,
.cards__item--34 .cards__back:before,
.cards__item--59 .cards__back:before {
    background-position: 100% 25%;
}

.cards__item--10 .cards__back:before,
.cards__item--35 .cards__back:before,
.cards__item--60 .cards__back:before {
    background-position: 0% 50%;
}

.cards__item--11 .cards__back:before,
.cards__item--36 .cards__back:before,
.cards__item--61 .cards__back:before {
    background-position: 25% 50%;
}

.cards__item--12 .cards__back:before,
.cards__item--37 .cards__back:before,
.cards__item--62 .cards__back:before {
    background-position: 50% 50%;
}

.cards__item--13 .cards__back:before,
.cards__item--38 .cards__back:before,
.cards__item--63 .cards__back:before {
    background-position: 75% 50%;
}

.cards__item--14 .cards__back:before,
.cards__item--39 .cards__back:before,
.cards__item--64 .cards__back:before {
    background-position: 100% 50%;
}

.cards__item--15 .cards__back:before,
.cards__item--40 .cards__back:before,
.cards__item--65 .cards__back:before {
    background-position: 0% 75%;
}

.cards__item--16 .cards__back:before,
.cards__item--41 .cards__back:before,
.cards__item--66 .cards__back:before {
    background-position: 25% 75%;
}

.cards__item--17 .cards__back:before,
.cards__item--42 .cards__back:before,
.cards__item--67 .cards__back:before {
    background-position: 50% 75%;
}

.cards__item--18 .cards__back:before,
.cards__item--43 .cards__back:before,
.cards__item--68 .cards__back:before {
    background-position: 75% 75%;
}

.cards__item--19 .cards__back:before,
.cards__item--44 .cards__back:before,
.cards__item--69 .cards__back:before {
    background-position: 100% 75%;
}

.cards__item--20 .cards__back:before,
.cards__item--45 .cards__back:before {
    background-position: 0% 100%;
}

.cards__item--21 .cards__back:before,
.cards__item--46 .cards__back:before {
    background-position: 25% 100%;
}

.cards__item--22 .cards__back:before,
.cards__item--47 .cards__back:before {
    background-position: 50% 100%;
}

.cards__item--23 .cards__back:before,
.cards__item--48 .cards__back:before {
    background-position: 75% 100%;
}

.cards__item--24 .cards__back:before,
.cards__item--49 .cards__back:before {
    background-position: 100% 100%;
}

@media (max-width: 1079.9px) {
    .game-cards__cloud {
        display: none;
    }
    .cards__container {
        width: 100%;
        max-width: none;
        padding: 0 24px;
    }
    .cards__area {
        position: static;
    }
    .cards__left {
        width: auto;
        margin: auto;
        max-width: 448px;
        position: relative;
        z-index: 5;
    }
    .cards__grid {
        margin: auto;
        font-size: min((100vw - 48px) / 774, 0.5167px);
    }
    .cards__right {
        bottom: 16px;
        font-size: 0.27px;
        right: calc(50% - 460em);
    }
    .cards__bubble {
        top: 170em;
        left: -315em;
    }
}
.catch {
    top: 0;
    height: 100%;
    font-size: min(0.925vh, 10px);
}

.left-shelves,
.right-shelves {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
}

.shelf {
    position: absolute;
    width: 27%;
    top: 0;
    height: 44em;
    left: 0;
}

.shelf-string {
    position: absolute;
    width: 4px;
    height: 430px;
    background: #D65C13;
    right: 130px;
    bottom: 33px;
}
.shelf-string::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: -10px;
    width: 25px;
    height: clamp(40px, 5.6em, 56px);
    background: url(../img/game2/shelf-bubl.svg) no-repeat bottom center transparent;
    background-size: auto 100%;
}

.shelf-main ~ .shelf-string {
    bottom: 43px;
    margin-right: 30px;
}

.shelf-main {
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    background: url(../img/game2/shelf.svg) no-repeat right bottom transparent;
}

.bottom-shelf {
    top: 30em;
}

.right-shelves .shelf {
    left: auto;
    right: 0;
}
.right-shelves .shelf-main {
    transform-origin: bottom center;
    transform: scaleX(-1);
}
.right-shelves .shelf-string {
    right: auto;
    left: 130px;
}
.right-shelves .shelf-main ~ .shelf-string {
    margin-right: 0;
    margin-left: 30px;
}

.catch__boxes {
    position: absolute;
    bottom: 0;
    height: 33.7em;
    z-index: 25;
}
.catch__boxes--left {
    width: 421px;
    background: url(../img/game2/bg-boxes1.png) no-repeat bottom left/contain transparent;
    left: 0;
}
.catch__boxes--right {
    width: 522px;
    background: url(../img/game2/bg-boxes2.png) no-repeat bottom right/contain transparent;
    right: 0;
}

/* gamer */
.gamer {
    width: 74em;
    height: 77em;
    position: absolute;
    bottom: 10.4em;
}
.gamer:before, .gamer:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: none no-repeat 0 0 transparent;
    background-size: 200% 200%;
}
.gamer:before {
    background-image: url(../img/game2/hero.png);
}
.gamer:after {
    background-image: url(../img/game2/hero-front.png);
    z-index: 22;
}
.gamer.left {
    left: calc(27% - 3em);
}
.gamer.right {
    right: calc(27% - 3em);
}
.gamer.left.top:before, .gamer.left.top:after {
    background-position: 0 0;
}
.gamer.left.bottom:before, .gamer.left.bottom:after {
    background-position: 0 100%;
}
.gamer.right.top:before, .gamer.right.top:after {
    background-position: 100% 0;
}
.gamer.right.bottom:before, .gamer.right.bottom:after {
    background-position: 100% 100%;
}

/* box */
.box {
    width: 0px;
    height: 0px;
    position: absolute;
    bottom: 12px;
    margin-bottom: 0;
}
.box i {
    display: block;
    width: 28.1em;
    height: 21.2em;
    position: relative;
    left: -14.05em;
    top: -21.2em;
    overflow: hidden;
    opacity: 1;
}
.box i:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: none no-repeat 0 0 transparent;
    transform-origin: bottom center;
    transform: scale(0.85);
}
.box--good i:before {
    background-image: url(../img/game2/items-good.png);
    background-size: 199.6em 127.2em;
}
.box--bad i:before {
    background-image: url(../img/game2/items-bad.png);
    background-size: 199.6em 63.6em;
}

.box.box0 i:before {
    background-position: 28.7em 0;
}

.box.box1 i:before {
    background-position: 0em 0;
}

.box.box2 i:before {
    background-position: -28.7em 0;
}

.box.box3 i:before {
    background-position: -57.4em 0;
}

.box.box4 i:before {
    background-position: -86.1em 0;
}

.box.box5 i:before {
    background-position: -114.8em 0;
}

.box.box6 i:before {
    background-position: -143.5em 0;
}

.box.box7 i:before {
    background-position: -172.2em 0;
}

.box.box8 i:before {
    background-position: 0em -21.2em;
}

.box.box9 i:before {
    background-position: -28.7em -21.2em;
}

.box.box10 i:before {
    background-position: -57.4em -21.2em;
}

.box.box11 i:before {
    background-position: -86.1em -21.2em;
}

.box.box12 i:before {
    background-position: -114.8em -21.2em;
}

.box.box13 i:before {
    background-position: -143.5em -21.2em;
}

.box.box14 i:before {
    background-position: -172.2em -21.2em;
}

.box.box15 i:before {
    background-position: 0em -42.4em;
}

.box.box16 i:before {
    background-position: -28.7em -42.4em;
}

.box.box17 i:before {
    background-position: -57.4em -42.4em;
}

.box.box18 i:before {
    background-position: -86.1em -42.4em;
}

.box.box19 i:before {
    background-position: -114.8em -42.4em;
}

.box.box20 i:before {
    background-position: -143.5em -42.4em;
}

.box.box21 i:before {
    background-position: -172.2em -42.4em;
}

.box.box22 i:before {
    background-position: 0em -63.6em;
}

.box.box23 i:before {
    background-position: -28.7em -63.6em;
}

.box.box24 i:before {
    background-position: -57.4em -63.6em;
}

.box.box25 i:before {
    background-position: -86.1em -63.6em;
}

.box.box26 i:before {
    background-position: -114.8em -63.6em;
}

.box.box27 i:before {
    background-position: -143.5em -63.6em;
}

.box.box28 i:before {
    background-position: -172.2em -63.6em;
}

.box.box29 i:before {
    background-position: 0em -84.8em;
}

.box.box30 i:before {
    background-position: -28.7em -84.8em;
}

.box.box31 i:before {
    background-position: -57.4em -84.8em;
}

.box.box32 i:before {
    background-position: -86.1em -84.8em;
}

.box.box33 i:before {
    background-position: -114.8em -84.8em;
}

.box.box34 i:before {
    background-position: -143.5em -84.8em;
}

.box.box35 i:before {
    background-position: -172.2em -84.8em;
}

.box.box36 i:before {
    background-position: 0em -106em;
}

.box.box37 i:before {
    background-position: -28.7em -106em;
}

.box.box38 i:before {
    background-position: -57.4em -106em;
}

.box.box39 i:before {
    background-position: -86.1em -106em;
}

.box.box40 i:before {
    background-position: -114.8em -106em;
}

.box.box41 i:before {
    background-position: -143.5em -106em;
}

.box.box42 i:before {
    background-position: -172.2em -106em;
}

.box.fall {
    z-index: auto;
}
.box.fall i {
    opacity: 0;
    transition: opacity 0.25s linear 0.75s;
}

@keyframes fall_left {
    0% {
        left: 100%;
        transform: rotate(15deg);
        bottom: 12px;
    }
    100% {
        left: 150%;
        transform: rotate(80deg);
        bottom: -22em;
    }
}
@keyframes fall_right {
    0% {
        right: 100%;
        transform: rotate(-15deg);
        bottom: 12px;
    }
    100% {
        right: 150%;
        transform: rotate(-80deg);
        bottom: -22em;
    }
}
@keyframes fall_left_mob {
    0% {
        left: 100%;
        transform: rotate(15deg);
        bottom: 6px;
    }
    100% {
        left: 150%;
        transform: rotate(80deg);
        bottom: -22em;
    }
}
@keyframes fall_right_mob {
    0% {
        right: 100%;
        transform: rotate(-15deg);
        bottom: 6px;
    }
    100% {
        right: 150%;
        transform: rotate(-80deg);
        bottom: -22em;
    }
}
.left-shelves .box {
    transform-origin: bottom left;
    transform: rotate(15deg);
    left: calc(100% - 0em);
    margin-left: 0px;
}
.left-shelves .box.move {
    animation: move_left 0.3s linear 0s;
}
.left-shelves .box.fall {
    animation: fall_left 1s cubic-bezier(0.84, 0.44, 1, 1) 0s;
    animation-fill-mode: forwards;
}

.right-shelves .box {
    transform-origin: bottom right;
    transform: rotate(-15deg);
    right: calc(100% - 0em);
    margin-right: 0;
}
.right-shelves .box.move {
    animation: move_right 0.3s linear 0s;
}
.right-shelves .box.fall {
    animation: fall_right 1s cubic-bezier(0.84, 0.44, 1, 1) 0s;
    animation-fill-mode: forwards;
}

.box.done {
    z-index: 20;
}

@keyframes done_left {
    0% {
        margin-left: 0;
        bottom: 12px;
    }
    100% {
        margin-left: 13em;
        bottom: -11.5em;
    }
}
@keyframes done_right {
    0% {
        margin-right: 0;
        bottom: 12px;
    }
    100% {
        margin-right: 13em;
        bottom: -11.5em;
    }
}
@keyframes done_left_mob {
    0% {
        margin-left: 0;
        bottom: 6px;
    }
    100% {
        margin-left: 7em;
        bottom: -2em;
    }
}
@keyframes done_right_mob {
    0% {
        margin-right: 0;
        bottom: 6px;
    }
    100% {
        margin-right: 7em;
        bottom: -2em;
    }
}
.left-shelves .box.done {
    animation: done_left 0.25s cubic-bezier(0.84, 0.44, 1, 1) 0s;
    animation-fill-mode: forwards;
}
.left-shelves .box.done i {
    transition: transform 0.1s ease 0.15s, opacity 0.05s ease 0.2s;
    transform-origin: bottom center;
    transform: rotate(-15deg);
    opacity: 1;
}

.right-shelves .box.done {
    animation: done_right 0.25s cubic-bezier(0.84, 0.44, 1, 1) 0s;
    animation-fill-mode: forwards;
}
.right-shelves .box.done i {
    transition: transform 0.1s ease 0.15s, opacity 0.05s ease 0.2s;
    transform-origin: bottom center;
    transform: rotate(15deg);
    opacity: 1;
}

@keyframes puff {
    100% {
        background-position: -260em;
    }
}
.static-puff {
    width: 26em;
    height: 26em;
    background: url(../img/game2/puff.png) no-repeat 0 0/260em 26em transparent;
    position: absolute;
    bottom: -11.5em;
    margin-bottom: -6em;
    z-index: 25;
    animation: puff 0.15s steps(10);
}

.left-shelves .static-puff {
    left: calc(100% + 13em);
    margin-left: -14em;
}

.right-shelves .static-puff {
    right: calc(100% + 13em);
    margin-right: -14em;
}

#mobile_detect {
    position: absolute;
    width: 1px;
    height: 1px;
    top: 0;
    left: 0;
    display: none;
}

/* game buttons */
.game-buttons {
    position: absolute;
    bottom: 24px;
    left: 28px;
    right: 28px;
    min-height: 120px;
    height: 15vh;
    z-index: 40;
    display: none;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */ /* Konqueror */
    -moz-user-select: none; /* Firefox */ /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently */
}

.touch .game-buttons {
    display: block;
}

.game-button {
    display: block;
    width: 52px;
    height: 52px;
    background: #fff;
    border: 1px solid #BABAC0;
    border-radius: 50%;
    margin: 0;
    padding: 0;
    font-size: 0px;
    color: transparent;
    position: absolute;
}
.game-button:before {
    content: "";
    width: 14px;
    height: 14px;
    background: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 12.59L12.59 14L2 3.41V10H0V0H10V2H3.41L14 12.59Z' fill='%236939CF'/%3E%3C/svg%3E ") no-repeat 0 0 transparent;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -7px 0 0 -7px;
    transform-origin: center center;
}
.game-button.left {
    left: 0;
}
.game-button.right {
    right: 0;
}
.game-button.bottom {
    bottom: 0;
}
.game-button.top {
    top: 0;
}

.game-button.bottom.left:before {
    transform: scaleY(-1);
}

.game-button.top.right:before {
    transform: scaleX(-1);
}

.game-button.bottom.right:before {
    transform: scale(-1, -1);
}

/* signal */
@keyframes signal {
    0% {
        opacity: 0;
    }
    40% {
        opacity: 0.5;
    }
    60% {
        opacity: 0.5;
    }
    100% {
        opacity: 0;
    }
}
.game__signal {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
}
.game__signal--green {
    background: radial-gradient(88.89% 50% at 50% 50%, rgba(0, 202, 8, 0) 75.18%, #00CA08 100%);
}
.game__signal--red {
    background: radial-gradient(88.89% 50% at 50% 50%, rgba(202, 0, 0, 0) 75.18%, #CA0000 100%);
}
.game__signal--active {
    animation: signal 0.5s linear 0s;
}

@media (max-width: 1079.9px) {
    #mobile_detect {
        display: block;
    }
    .catch {
        font-size: 3.75px;
        --bottomIndent: calc(30% - 25px);
    }
    .left-shelves,
    .right-shelves {
        height: 360px;
        bottom: calc(var(--bottomIndent) + 20px);
        top: auto;
    }
    .shelf {
        width: 120px;
    }
    .bottom-shelf {
        top: 50em;
    }
    .shelf-main {
        background-size: auto 150px;
    }
    .shelf-string {
        display: none;
    }
    .static-puff {
        bottom: -5.5em;
    }
    .left-shelves .static-puff {
        margin-left: -18em;
    }
    .right-shelves .static-puff {
        margin-right: -18em;
    }
    .gamer {
        bottom: var(--bottomIndent);
    }
    .gamer.left {
        left: calc(120px - 10em);
    }
    .gamer.right {
        right: calc(120px - 10em);
    }
    .gamer:before {
        background-image: url(../img/game2/hero-m.png);
    }
    .gamer:after {
        background-image: url(../img/game2/hero-front-m.png);
        z-index: auto;
    }
    .box {
        bottom: 6px;
    }
    .left-shelves .box.fall {
        animation-name: fall_left_mob;
    }
    .left-shelves .box.done {
        animation-name: done_left_mob;
    }
    .right-shelves .box.fall {
        animation-name: fall_right_mob;
    }
    .right-shelves .box.done {
        animation-name: done_right_mob;
    }
    .catch__boxes {
        display: none;
    }
}
@media (max-width: 1079.9px) and (orientation: landscape) {
    .catch {
        --bottomIndent: max(50% - 144px, 50px);
    }
}
.game--catch .rules {
    background: rgba(0, 0, 0, 0.6);
    height: 100%;
    top: 0;
    padding: 140em 0 80em;
    z-index: 55;
}

@supports (backdrop-filter: blur(16px)) {
    .game--catch .rules {
        background: rgba(0, 0, 0, 0.45);
        backdrop-filter: blur(16px);
    }
}
.rules__title {
    text-align: center;
    font-size: 56em;
    font-weight: 700;
    line-height: 1;
    margin: 0 0 0.7em;
    padding-top: 0.18em;
    color: #fff;
}

.rules__width {
    max-width: 1112em;
    margin: 0 auto;
}

.rules__grid {
    margin: 0 -12em;
}
.rules__grid .swiper-wrapper {
    height: auto;
    align-items: stretch;
}
.rules__grid:not(.swiper-container-initialized) {
    margin: 0;
}
.rules__grid:not(.swiper-container-initialized) .swiper-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 24em;
}
.rules__grid .swiper-slide {
    height: auto;
    padding: 0 12em;
}
.rules__grid .swiper-pagination {
    position: static;
    display: flex;
    flex-flow: row nowrap;
    align-items: stretch;
    justify-content: center;
    margin: 16px auto 0;
    width: 56px;
    background: rgba(255, 255, 255, 0.25);
    border-radius: 3px;
}
.rules__grid .swiper-pagination-lock {
    display: none;
}
.rules__grid .swiper-pagination-bullet {
    flex: 1 1 50%;
    height: 6px;
    background: transparent;
    border-radius: 3px;
    opacity: 1;
    width: 50%;
    margin: 0 !important;
}
.rules__grid .swiper-pagination-bullet-active {
    background: #fff;
}

.rules__item {
    border-radius: 24em;
    border: 2em solid #FFF;
    background: #fff;
    overflow: hidden;
    height: 100%;
}

.rules__image {
    border-radius: 24em;
    overflow: hidden;
}
.rules__image img {
    display: block;
    width: 100%;
}
.rules__image--default {
    display: block;
}
.rules__image--touch {
    display: none;
}

.touch .rules__image--default {
    display: none;
}
.touch .rules__image--touch {
    display: block;
}

.rules__text {
    padding: 1.33em 1.66em 2em;
    text-align: center;
    color: #493B68;
    font-size: 24em;
}

.rules__button {
    margin-top: 64em;
    text-align: center;
}
.rules__button .button {
    width: 19em;
}

@media (min-width: 1080px) {
    .rules .button-next {
        display: none;
    }
}
@media (max-width: 1079.9px) {
    .rules__title {
        padding-top: 0;
        font-size: 32px;
    }
    .rules__grid {
        margin: 0 -24px;
    }
    .rules__grid .swiper-slide {
        padding: 0 24px;
    }
    .rules__item {
        max-width: 312px;
        margin: 0 auto;
    }
    .rules__button {
        margin-top: 32px;
    }
    .rules__button .button {
        width: 100%;
        max-width: 320px;
        font-size: 15px;
    }
    .rules__button .button-go {
        display: none;
    }
}
.popup--game .popup__inner {
    max-width: 577em;
}
.popup--game .popup__title {
    font-size: 56em;
    line-height: 1;
    margin-bottom: 0.2em;
}

.popup--with-cat .popup__inner {
    padding-top: 205em;
    position: relative;
}
.popup--with-cat .popup__cat {
    width: 400em;
    height: 240em;
    overflow: hidden;
    position: absolute;
    left: calc(50% - 200em);
    top: 10em;
    z-index: 1;
}
.popup--with-cat .popup__cat:before {
    content: "";
    width: 282em;
    height: 211em;
    background: url(../img/popup-cat1.png) no-repeat bottom center/contain transparent;
    position: absolute;
    bottom: 16em;
    left: calc(50% - 141em);
}
.popup--with-cat .popup__cat.noimg:before {
    display: none;
}
.popup--with-cat.sad-cat .popup__cat:before {
    width: 279em;
    height: 145em;
    background-image: url(../img/popup-cat2.png);
    top: 76em;
}
.popup--with-cat.sad-cat .popup__cat-canvas {
    top: 38em;
}
.popup--with-cat .popup__cat-canvas {
    padding-top: 150%;
    position: relative;
}
.popup--with-cat .popup__cat-canvas canvas {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.popup--with-cat .popup__body {
    padding-top: 48em;
    position: relative;
}

#game-exit .popup__inner {
    max-width: 470em;
}

@media (max-width: 1079.9px) {
    .popup--game .popup__inner {
        max-width: 310px;
    }
    .popup--game .popup__title {
        font-size: 32px;
    }
    .popup--with-cat .popup__inner {
        padding-top: 110px;
    }
    .popup--with-cat .popup__cat {
        width: 224px;
        height: 133px;
        left: calc(50% - 112px);
        top: 0;
    }
    .popup--with-cat .popup__cat:before {
        width: 153px;
        height: 115px;
        top: 10px;
        left: calc(50% - 78px);
    }
    .popup--with-cat .popup__body {
        padding-top: 32px;
    }
    .popup--with-cat.sad-cat .popup__cat:before {
        width: 182px;
        height: 93px;
        top: 34px;
    }
    .popup--with-cat.sad-cat .popup__cat-canvas {
        top: 23px;
    }
}
#onboarding-hello-popup .popup__inner {
    max-width: 570em;
}
#onboarding-hello-popup .popup__text {
    max-width: 17em;
    margin-left: auto;
    margin-right: auto;
}

#onboarding-games-done-popup .popup__inner {
    max-width: 800em;
}
#onboarding-games-done-popup .popup__title {
    font-size: 56em;
    margin-bottom: 0.45em;
}
#onboarding-games-done-popup .popup__body {
    max-width: 550em;
    margin: 32em auto 0;
}
#onboarding-games-done-popup .prizes {
    margin-top: 0;
}
#onboarding-games-done-popup .popup__buttons {
    margin-left: auto;
    margin-right: auto;
    max-width: 550em;
}

@media (max-width: 1079.9px) {
    #onboarding-hello-popup .popup__inner {
        max-width: 310px;
    }
    #onboarding-games-done-popup .popup__inner {
        max-width: 310px;
    }
    #onboarding-games-done-popup .popup__bg {
        padding: 26em 20em;
        background: #fff;
        border-radius: 24em;
        color: #493B68;
    }
    #onboarding-games-done-popup .popup__title {
        font-size: 32px;
        line-height: 1;
    }
    #onboarding-games-done-popup .popup__body {
        border-radius: 0;
        background: transparent;
        padding: 0;
    }
}
.header.onbording-bonuses {
    z-index: auto;
}
.header.onbording-bonuses .header__cell:nth-child(1) {
    z-index: 1500;
}

.room-header.onbording-bonuses {
    z-index: auto;
}
.room-header.onbording-bonuses .header__points {
    z-index: 1500;
}

.onboarding-overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 1000;
}

@supports (backdrop-filter: blur(2px)) {
    .onboarding-overlay {
        background: rgba(0, 0, 0, 0.35);
        backdrop-filter: blur(2px);
    }
}
.onboarding-overlay--transparent {
    background: transparent;
    backdrop-filter: none;
}

.onboarding-cat {
    width: 317em;
    height: 425em;
    background: url(../img/onboarding/talking-cat.svg) no-repeat 0 0/contain transparent;
    position: absolute;
    z-index: 1005;
}
.onboarding-cat.pos-1 {
    bottom: 24em;
    right: 60em;
    margin-right: -90em;
}
.onboarding-cat.pos-1 ~ .get-bonus {
    z-index: 1010;
    animation: pulse2 1.5s infinite;
}
.onboarding-cat.pos-2, .onboarding-cat.pos-3 {
    bottom: 24em;
    left: 60em;
}
.onboarding-cat.pos-2 ~ .play-games, .onboarding-cat.pos-3 ~ .play-games {
    z-index: 1010;
    animation: pulse2 1.5s infinite;
}
.onboarding-cat.pos-4 {
    left: calc(50% + 300em);
    bottom: 40em;
}
.onboarding-cat.pos-4 ~ .castle__path .castle__room[data-room="1"] {
    z-index: 1010;
    animation: pulse2 1.5s infinite;
}
.onboarding-cat.pos-5, .onboarding-cat.pos-6 {
    bottom: 0em;
    left: calc(50% + 400em);
}
.onboarding-cat.pos-7, .onboarding-cat.pos-8 {
    bottom: 0em;
    left: calc(50% - 115em);
}
.onboarding-cat.pos-6 ~ .onboarding-overlay {
    display: none;
}
.onboarding-cat.pos-8 {
    transform-origin: 115em 100%;
    transform: scaleX(-1);
}
.onboarding-cat.pos-8 .onboarding-cat__text p {
    transform: scaleX(-1);
}

@media (max-height: 999.9px) and (min-width: 1080px) {
    .onboarding-cat.pos-5,
    .onboarding-cat.pos-6,
    .onboarding-cat.pos-7,
    .onboarding-cat.pos-8 {
        bottom: 24em;
    }
}
@media (max-width: 1079.9px) {
    .onboarding-cat {
        font-size: 0.5px;
    }
    .onboarding-cat.pos-1 {
        right: auto;
        left: calc(50% - 30px);
        bottom: 100px;
    }
    .onboarding-cat.pos-2, .onboarding-cat.pos-3 {
        left: calc(50% - 30px);
        bottom: 45px;
    }
    .onboarding-cat.pos-4 {
        bottom: 10px;
        left: calc(50% - 70px);
    }
    .onboarding-cat.pos-5, .onboarding-cat.pos-6 {
        bottom: 10px;
        left: auto;
        right: 20px;
    }
    .onboarding-cat.pos-7, .onboarding-cat.pos-8 {
        bottom: 10px;
        left: calc(50% - 30px);
    }
}
.onboarding-cat__bubble {
    position: absolute;
    width: 343em;
    height: 236em;
    background: url(../img/onboarding/bubble.svg) no-repeat 0 0/100% 100% transparent;
    left: -205em;
    top: -188em;
}

.onboarding-cat__text {
    min-height: 100%;
    padding: 32em 22em 42em 22em;
    text-align: center;
    color: #493B68;
    display: flex;
}
.onboarding-cat__text p {
    margin: auto;
    font-size: 24em;
    line-height: 1.2;
    flex: 0 1 auto;
}
/*# sourceMappingURL=main.css.map */