/* Page :: Reviews */
.reviews__items {display: flex; flex-wrap: wrap; margin: -16px;}
.reviews__item {
    width: 50%; padding: 16px; position: relative; z-index: 2;
}
.reviews__item-box {
    padding: 32px 32px 46px 121px; position: relative;
    font-size: 16px; letter-spacing: 0.05em; color: #909CAA;
    background: #232235; z-index: 2;
}
.reviews__item-box:after {
    width: auto; height: auto; content: ' '; display: block;
    position: absolute; left: 0; right: 0; top: 0; bottom: 0;
    border:1px dashed #00FF66; z-index: -3;
}
.reviews__item-box:before {
    width: auto; height: auto; content: ' '; display: block;
    position: absolute; left: 0; right: 0; top: 0; bottom: 0;
    z-index: -2;
    background: linear-gradient(to right, rgba(24,26,29,0) 0%, rgb(35, 34, 53) 11%, rgb(35, 34, 53) 89%,rgba(24,26,29,0) 100%);
}
.reviews__item-border {
    width: auto; height: auto; content: ' '; display: block;
    position: absolute; left: 8px; right: 8px; top: 9px; bottom: 9px;
    border: 1px dashed #656565; z-index: -1;
}
.reviews__item-avatar {
    width: 64px; height: 64px; position: absolute; left: 32px; top: 32px; border: 1px solid #00FF66;
    background: no-repeat center center; background-size: cover;
}
.reviews__item-name {
    padding: 7px 0 12px 0;
    font-weight: 500; font-size: 18px; color: #fff; letter-spacing: 0.05em;
}

.reviews__bottom {
    display: flex; align-items:center; justify-content: space-between; margin: 31px 0 0 0;
}

.reviews__loadmore {min-width: 240px;}

.reviews__form {
    width: 512px; max-width: 100%; position: relative;
}
.reviews__form-input {
    width: 100%; height: 56px; padding: 0 56px 0 24px; border:0; margin: 0; box-shadow: none;
    font-size: 16px; color: #909CAA;
    background: #28263C;
}
.reviews__form-input:hover,
.reviews__form-input:focus {background: #28263C;}
.reviews__form-input::-webkit-input-placeholder { color:#87879E; -webkit-transition:color .1s linear;}
.reviews__form-input:focus::-webkit-input-placeholder { color:transparent;}
.reviews__form-input:-moz-placeholder { color:#87879E; -moz-transition:color .1s linear;}
.reviews__form-input:focus:-moz-placeholder { color:transparent;}
.reviews__form-input::-moz-placeholder { color:#87879E; -moz-transition:color .1s linear;}
.reviews__form-input:focus::-moz-placeholder { color:transparent;}
.reviews__form-input:-ms-input-placeholder { color:#87879E; }
.reviews__form-input:focus:-ms-input-placeholder { color:transparent;}
.reviews__form-btn {
    width: 56px; height: 56px; padding: 0;
    display: flex; align-items: center; justify-content: center;
    position: absolute; right: 0; top: 0; margin: 0;
    color: #909CAA;
    border:0; box-shadow: none;
    background: #28263C;
}
.reviews__form-btn svg {width: 20px; height: 20px;}
.reviews__form-btn:hover {background: #28263C;color: #00FF66;}

@media (max-width: 940px) {
    .reviews__items{
        flex-direction: column;
    }
    .reviews__item{
        width: 100%;
    }
}
@media (max-width: 860px) {
    .reviews__bottom{
        flex-direction: column-reverse;
    }
    .reviews__form{
        margin-top: 20px;
    }
}
@media (max-width: 600px) {
    .reviews__item-name {
        font-size: 14px;
        padding: 7px 0 6px 0;
    }
    .reviews__item-box{
        font-size: 13px;
    }
}
@media (max-width: 500px) {
    .reviews__item-box{
        padding: 32px;
        text-align: center;
    }
    .reviews__item-avatar {
        position: relative;
        display: inline-block;
        top: auto;
        left: auto;
    }
    .reviews__item-box{
        font-size: 13px;
    }
}


.support__header {
    padding: 24px; display: flex; align-items: center; position: relative; margin: -16px 0 32px 0; z-index: 2;
    background: no-repeat center center url(../images/bgs__support-header.jpg);
}
.support__header:after {
    width: auto; height: auto; content: ' '; display: block;
    position: absolute; left: 0; right: 0; top: 0; bottom: 0;
    border: 1px solid rgba(255, 255, 255, 0.1); z-index: -1;
}
.support__header-label {
    flex:1;
    font-weight: bold; font-size: 24px; letter-spacing: 0.02em; text-transform: uppercase;
}
.support__header-button {margin: 0 0 0 14px;}
.support__header-button .o-button {
    min-width:202px; height: 40px; padding-left: 24px; padding-right: 16px;
    justify-content: space-between; letter-spacing: 0.05em; font-size: 14px; text-transform: uppercase;
}

@media (max-width: 400px) {
    .support__header {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
}

@media (max-width: 992px) {
    .support__header-label{
        font-size: 20px;
    }
}

@media (max-width: 762px) {
    .support__header-label{
        font-size: 16px;
        margin-bottom: 15px;
    }
    .support__header {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
    .support__header-button .o-button{
        font-size: 12px;
        min-width: 182px;
    }
    .reviews__bottom .o-button{
        font-size: 13px;
        min-width: 180px;
    }
}





.support__container {display: flex; margin: 0 -16px;}
.support__faq,
.support__chat {flex:1; padding: 0 16px; }

.faq__list dl {margin: 0 0 8px 0;}
.faq__list dt {
    padding:15px 44px 14px 24px; position: relative;
    font-size: 16px; letter-spacing: 0.05em;
    background:#232235; cursor: pointer;
    border-radius: 10px;
    font-weight: bold;
}
.faq__list dt:after,
.faq__list dt:before {content: ''; display: block; position: absolute; top: 50%; transform: translateY(-50%); background: #fff;}
.faq__list dt:after {width:10px; height:2px; right: 24px;}
.faq__list dt:before {width:2px; height:10px; right: 28px;}

.faq__list dt:hover {color: #66FF9A;}
.faq__list dt:hover:after,
.faq__list dt:hover:before {background-color: #66FF9A;}
.faq__list dt.current {border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
.faq__list dt.current:before {opacity: 0;}

.faq__list dd {
    padding:24px 24px 24px; display: none;
    line-height: 1.54; font-size: 14px; letter-spacing: 0.02em; color: #909CAA;
    background: #24272A;
    border-radius: 10px;
    margin-top: -10px;
}

@media (max-width: 762px) {
    .faq__list dt{
        font-size: 14px;
    }
    .faq__list dd{
        font-size: 12px;
    }
}



.chat__block {
    padding: 0 0 52px 0; position: relative;
    background: #232235;
    border-radius: 10px;
}
.chat__block-header {
    padding: 12px 24px; display: flex; align-items: center;
    background: #343152;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.chat__block-header-avatar {
    width: 32px; height: 32px; border: 1px solid #FFF; margin: 0 16px 0 0;
    border-radius: 50%;
    background: no-repeat center center;
    background-size: cover;
}
.chat__block-header-label {flex:1;}
.chat__status {
    font-weight: bold; font-size: 10px; line-height: 12px; letter-spacing: 0.05em; text-transform: uppercase; color: #57D42B;
}
.chat__status:after {
    width: 8px; height: 8px; content: ' '; display: inline-block; vertical-align: top; margin: 1px 0 0 8px;
    background: #57D42B; box-shadow: 0 0 15px #57D42B; border-radius: 50%;
}
.chat__status.status--offline {color: #FF0000;}
.chat__status.status--offline:after {background: #FF0000; box-shadow: 0 0 15px #FF0000;}


.chat__block-content {overflow: hidden; overflow-y: auto; min-height: 332px; max-height: 500px;}
.chat__block-items {padding: 8px 10px;}
.chat__block-item {padding:0 6px;}
.chat__block-item-message {
    max-width:480px; padding: 10px; display: inline-block; vertical-align: top; position: relative; background: #28263C;
    line-height:1.54; font-size: 14px; letter-spacing: 0.02em;     color: #636970; text-align: left;
}
.chat__block-item-message:after {
    width: 0; height: 0; content: ' '; display: block;
    position: absolute; right: 100%; top: 50%; margin: -6px 0 0 0;
    border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right: 6px solid #28263C;
}
.chat__block-item-date {
    margin: 10px 0 0 0;
    font-size: 12px; letter-spacing: 0.02em; color: #545367;
}

.chat__block-item.item--manager {text-align: right;}
.chat__block-item.item--manager .chat__block-item-message:after {left:100%; right:auto; transform: scale(-1,1);}
.chat__block-item + .chat__block-item.item--manager {margin-top: 3px;}

.chat__block-form {
    width: auto; position: absolute; left: 15px; right: 15px; bottom: 15px;
}
.chat__block-form-input {
    width: 100%; height: 40px; padding: 0 54px 0 24px; border:0; margin: 0; box-shadow: none;
    font-size: 14px; letter-spacing: 0.02em; color: #FFF;
    background: #28263C;
}
.chat__block-form-input:hover,
.chat__block-form-input:focus {background: #28263C;}

.chat__block-form-input::-webkit-input-placeholder { color:#87879E; -webkit-transition:color .1s linear;}
.chat__block-form-input:focus::-webkit-input-placeholder { color:transparent;}
.chat__block-form-input:-moz-placeholder { color:#87879E; -moz-transition:color .1s linear;}
.chat__block-form-input:focus:-moz-placeholder { color:transparent;}
.chat__block-form-input::-moz-placeholder { color:#87879E; -moz-transition:color .1s linear;}
.chat__block-form-input:focus::-moz-placeholder { color:transparent;}
.chat__block-form-input:-ms-input-placeholder { color:#87879E; }
.chat__block-form-input:focus:-ms-input-placeholder { color:transparent;}


.chat__block-form-btn {
    width: 34px; height: 34px; padding: 0;
    display: flex; align-items: center; justify-content: center;
    position: absolute; right: 0; top: 50%; margin: -17px 0 0 0;
    color: #69697E;
    border:0; background: 0; box-shadow: none;
}
.chat__block-form-btn svg {width: 16px; height: 16px;}
.chat__block-form-btn:hover {color: #fff;}

.section__subtitle {
    margin: 38px 0;
    font-size: 18px; text-align: center; letter-spacing: 0.02em;     color: #636970;
}
.section__title + .section__subtitle {margin-top: -12px;}

@media (max-width: 940px) {
    .support__container{
        flex-direction: column-reverse;
    }
    .support__chat{
        margin-bottom: 45px;
    }

    .section__subtitle {
        font-size: 16px;
    }
}



.thing-item__inform.btn--sell{
    background: #7000FF;
    cursor: pointer;
}
.thing-item__inform.btn--take{
    background: #15a14d;
    cursor: pointer;
}
.thing-item__inform.btn--sell:hover,
.thing-item__inform.btn--take:hover{
    opacity: 0.7;
}

/* Modal - Bonus */
.modal-bonus {
    max-width: 382px; height: 448px;
    background: no-repeat center center url(../_img/modal-bonus/bgs.jpg);
}
.modal-bonus .remodal__close {right: 5px; top: 5px;}
.modal-bonus__inner {
    padding: 133px 28px 0 28px;
    -moz-transform:matrix(1,0,0,1,0,0);
    -webkit-transform:matrix(1,0,0,1,0,0);
    transform:matrix(1,0,0,1,0,0);
}

.modal-bonus__code-value,
.modal-bonus__button {display: block; padding: 0; margin: 0; border:0; background: 0;}

.modal-bonus__topay {min-height: 111px; display: flex; flex-direction: column; align-items: center; text-align: center;}
.modal-bonus__topay-value {
    height: 56px; line-height: 56px; padding: 0 25px; margin:0 0 6px 0;
    font-weight: bold; font-size: 30px; color: #17e372; text-align: center; text-transform: uppercase; letter-spacing: 1px;
    background: #1a1b29; border-radius: 6px;
}
.modal-bonus__topay-text {
    font-size: 19px; text-transform: lowercase; letter-spacing: 1px; cursor: default;
}
.modal-bonus__code-value {
    width: 100%; height: 50px;
    font:37px/50px 'Impact'; color: #fff; text-align: center;
    border: 2px solid #0da868; background: rgba(26, 27, 41, 0.73); border-radius: 12px;
}

.modal-bonus__control {margin:18px 0 0 0;}
.modal-bonus__button {
    width: 197px; height: 31px; margin: 0 auto; position: relative;
}
.modal-bonus__button::after {
    width: auto; height: auto; content: ' '; display: block;
    position: absolute; left: -18px; right: -18px; top: -19px; bottom: -19px;
    background: no-repeat 0 0 url(../_img/modal-bonus/modal-btn_copy.png);
    background-size: 100% 100%;
    transition: filter 0.3s ease;
    pointer-events: none;
    filter:brightness(1);
}
.modal-bonus__button:hover::after {
    filter:brightness(1.4);
}
.modal-bonus__button:active::after {
    filter:brightness(0.9);
}
.text-center{
    text-align: center;
}

/* END */
