* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, Helvetica, sans-serif;
}

body {
    position: relative;
}



/* Форма Написать представителю компании */

.write-w {
    width: 100%
}

.write-title {
    width: 100%;
    display: block;
    text-align: left;
    font-size: 22px;
    line-height: 30px;
    font-weight: bold;
}

.write-form {
    width: 100%;
    padding: 30px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.write-text {
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
}

.write-label-half {
    width: 48.7%;
    padding-bottom: 25px;
}

.write-label-full {
    width: 100%;
}

.write-name {
    width: 100%;
    height: 46px;
    display: block;
    padding: 10px;
    border: 1px solid rgb(189, 189, 189);
    margin-top: 3px;
    outline: 0!important;
    border: 1px solid rgb(189, 189, 189);
}

.write-email {
    width: 100%;
    height: 46px;
    display: block;
    padding: 10px;
    border: 1px solid rgb(189, 189, 189);
    margin-top: 3px;
    outline: 0!important;
    border: 1px solid rgb(189, 189, 189);
}

.write-input::-webkit-input-placeholder { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }
.write-input::-moz-placeholder          { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }
.write-input:-moz-placeholder           { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }
.write-input:-ms-input-placeholder      { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }

.write-message-w {
    position: relative;
    max-width: 1030px;
    background-color: #fff;
    padding: 50px;
    margin: 10% auto;
}

.write-message {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap;
}

.write-textarea {
    width: 100%;
    height: 146px;
    display: block;
    padding: 10px;
    outline: 0!important;
    border: 1px solid rgb(189, 189, 189);
    resize: vertical;
}

.write-btn {
    display: block;
    width: 215px;
    height: 50px;
    text-align: center;
    background: rgb(255, 199, 0);
    font-size: 16px;
    line-height: 46px;
    outline: 0!important;
    border: 0!important;
    font-weight: bold;
    cursor: pointer;
    margin-right: 0;
    margin-left: auto;
    transition: background-color .2s;
}

.write-btn:hover {
    background-color: rgb(255, 175, 0);
    transition: background-color .2s;
}

.write-form-success {
    max-width: 450px;
    padding: 30px;
    background-color: rgb(39,174,97);
    color: #fff;
    text-align: center;
    font-size: 16px;
    line-height: 20px;
}

.write-form-error {
    max-width: 450px;
    padding: 30px;
    background-color: rgb(235, 87, 87);
    color: #fff;
    text-align: center;
    font-size: 16px;
    line-height: 20px;
}

.write-form-title {
    font-weight: bold;
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 20px;
}

.form-close {
    position: absolute;
    top: -35px;
    right: -35px;
    width: 30px;
    height: 30px;
    background-image: url('/images/close.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    cursor: pointer;
}

@media only screen and (max-width: 1000px) {
    
    .write-message {
        padding: 0 20px;
    }
}

@media only screen and (max-width: 480px) {
    
    .write-label-half {
        width: 100%;
        padding-bottom: 15px;
    }

    .write-form {
        padding: 20px 0;
    }
}

/* Форма Написать представителю компании, конец */



/* Форма Написать представителю компании (всплывающая) */

.review-write-w {
    width: 100%
}

.review-write-title {
    width: 100%;
    display: block;
    text-align: left;
    font-size: 26px;
    line-height: 30px;
    font-weight: bold;
    margin-bottom: 10px
}

.review-write-p {
    width: 100%;
    text-align: left;

}

.review-write-form {
    width: 100%;
    padding: 30px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.review-write-text {
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
}

.review-write-label-half {
    width: 48.7%;
    padding-bottom: 25px;
}

.review-write-label-full {
    width: 100%;
}

.review-write-name {
    width: 100%;
    height: 46px;
    display: block;
    padding: 10px;
    border: 1px solid rgb(189, 189, 189);
    margin-top: 3px;
    outline: 0!important;
    border: 1px solid rgb(189, 189, 189);
}

.review-write-email {
    width: 100%;
    height: 46px;
    display: block;
    padding: 10px;
    border: 1px solid rgb(189, 189, 189);
    margin-top: 3px;
    outline: 0!important;
    border: 1px solid rgb(189, 189, 189);
}

.review-write-input::-webkit-input-placeholder { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }
.review-write-input::-moz-placeholder          { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }
.review-write-input:-moz-placeholder           { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }
.review-write-input:-ms-input-placeholder      { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }

.review-write-message-w {
    position: relative;
    max-width: 1030px;
    background-color: #fff;
    padding: 50px;
    margin: 10% auto;
}

.review-write-message {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap;
}

.review-write-textarea {
    width: 100%;
    height: 146px;
    display: block;
    padding: 10px;
    outline: 0!important;
    border: 1px solid rgb(189, 189, 189);
    resize: vertical;
}

.review-write-btn {
    display: block;
    width: 215px;
    height: 50px;
    text-align: center;
    background: rgb(255, 199, 0);
    font-size: 16px;
    line-height: 46px;
    outline: 0!important;
    border: 0!important;
    font-weight: bold;
    cursor: pointer;
    margin-right: 0;
    margin-left: auto;
    transition: background-color .2s;
}

.review-write-btn:hover {
    background-color: rgb(255,175,0);
    transition: background-color .2s;
}

.review-write-form-success {
    max-width: 450px;
    padding: 30px;
    background-color: rgb(39,174,97);
    color: #fff;
    text-align: center;
    font-size: 16px;
    line-height: 20px;
}

.review-write-form-error {
    max-width: 450px;
    padding: 30px;
    background-color: rgb(235, 87, 87);
    color: #fff;
    text-align: center;
    font-size: 16px;
    line-height: 20px;
}

.review-write-form-title {
    font-weight: bold;
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 20px;
}

.review-form-close {
    position: absolute;
    top: -35px;
    right: -35px;
    width: 30px;
    height: 30px;
    background-image: url('/images/close.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    cursor: pointer;
}

@media only screen and (max-width: 1000px) {
    
    .review-write-message {
        padding: 0 20px;
    }
}

@media only screen and (max-width: 480px) {
    
    .review-write-label-half {
        width: 100%;
        padding-bottom: 15px;
    }

    .review-write-form {
        padding: 20px 0;
    }
}

/* Форма Написать представителю компании (всплывающая), конец */


/* Форма Добавить отзыв */

.steps-step-3 {
    display: none;
    padding: 50px 0 30px 0;
    width: 100%;
    justify-content: center;
}

.stars-rating {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 540px;
    padding-left: 120px;
}

.stars-rating-item-w {
    width: 190px;
    margin-bottom: 20px
}

.stars-rating-item-form {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    overflow: hidden;
    width: 185px;
    margin-left: -5px;
}
.stars-rating-item-form:not(:checked) > input {
    display: none;
}
.stars-rating-item-form:not(:checked) > label {
    float: right;
    width: 42px;
    padding: 0;
    cursor: pointer;
    font-size: 32px;
    line-height: 42px;
    color: lightgrey;
}
.stars-rating-item-form:not(:checked) > label:before {
    content: '★';
}
.stars-rating-item-form > input:checked ~ label {
    color: gold;
}
.stars-rating-item-form:not(:checked) > label:hover,
.stars-rating-item-form:not(:checked) > label:hover ~ label {
    color: gold;
}
.stars-rating-item-form > input:checked + label:hover,
.stars-rating-item-form > input:checked + label:hover ~ label,
.stars-rating-item-form > input:checked ~ label:hover,
.stars-rating-item-form > input:checked ~ label:hover ~ label,
.stars-rating-item-form > label:hover ~ input:checked ~ label {
    color: gold;
}


.stars-rating-link {
    font-weight: bold;
    font-size: 16px;
    line-height: 20px;
}

.star-item {
    width: 20%;
    height: 35px;
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: center;
    background-image: url('/images/star.svg');
}

.star-item:hover {
    background-image: url('/images/star-gold.svg');
}

.star-item-active {
    background-image: url('/images/star-gold.svg');
}

.stars-choose {
    width: 210px;
    display: flex;
    justify-content: space-between;
    padding-top: 10px;
    margin-bottom: 20px;
}

.friends-recommendation {
    padding-left: 50px;
}

.stars-round {
    width: 20px;
    height: 20px;
    margin-left: 10px;
    border-radius: 100%;
    border: 1px solid rgb(193, 193, 193);
}

.stars-round-text {
    font-weight: bold;
    padding-left: 15px;
}

.stars-choose-inside {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: 2;
    background: transparent;
    display: flex;
    align-items: center;
}

.stars-round-yes.active {
    background-color: rgb(39, 174, 97);
    border: 0;
}

.stars-round-no.active {
    background-color: rgb(235, 87, 87);
    border: 0;
}

.stars-choose-item {
    position: relative;
    width: 95px;
    height: 35px;
    border: 1px solid rgb(216,216,216);
    cursor: pointer;
}

.steps-step-1 {
    width: 100%;
}

.steps-step-2 {
    display: none;
    width: 100%;
}

.steps-write-w {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.steps-write-title {
    width: 100%;
    display: block;
    text-align: left;
    font-size: 26px;
    line-height: 30px;
    font-weight: bold;
    margin-bottom: 10px
}

.steps-write-p {
    width: 100%;
    text-align: left;
    font-size: 16px;
    line-height: 22px;
}

.steps-write-form {
    width: 100%;
    padding: 30px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.steps-step-2-plus {
    margin-top: 20px
}

.steps-write-text {
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
}

.steps-write-label-half {
    width: 48.7%;
    padding-bottom: 25px;
}

.steps-write-label-full {
    width: 100%;
}

.steps-write-name {
    width: 100%;
    height: 46px;
    display: block;
    padding: 10px;
    border: 1px solid rgb(189, 189, 189);
    margin-top: 3px;
    outline: 0!important;
    border: 1px solid rgb(189, 189, 189);
    font-size: 16px;
    line-height:16px;
}

.steps-write-email {
    width: 100%;
    height: 46px;
    display: block;
    padding: 10px;
    border: 1px solid rgb(189, 189, 189);
    margin-top: 3px;
    outline: 0!important;
    border: 1px solid rgb(189, 189, 189);
    font-size: 16px;
    line-height:16px;
}

.steps-write-input::-webkit-input-placeholder { color: rgb(189, 189, 189); font-style: italic; font-size: 16px; line-height: 16px; }
.steps-write-input::-moz-placeholder          { color: rgb(189, 189, 189); font-style: italic; font-size: 16px; line-height: 16px; }
.steps-write-input:-moz-placeholder           { color: rgb(189, 189, 189); font-style: italic; font-size: 16px; line-height: 16px; }
.steps-write-input:-ms-input-placeholder      { color: rgb(189, 189, 189); font-style: italic; font-size: 16px; line-height: 16px; }

.steps-write-message-w {
    position: relative;
    max-width: 1030px;
    background-color: #fff;
    padding: 50px;
    margin: 10% auto;
}

.steps-write-message {
    width: 100%;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap;
}

.steps-write-textarea {
    width: 100%;
    height: 146px;
    display: block;
    padding: 10px;
    outline: 0!important;
    border: 1px solid rgb(189, 189, 189);
    resize: vertical;
    font-size: 16px;
    line-height:16px;
}

.steps-write-btn {
    display: block;
    width: 215px;
    height: 50px;
    text-align: center;
    background: rgb(255, 199, 0);
    font-size: 16px;
    line-height: 46px;
    outline: 0!important;
    border: 0!important;
    font-weight: bold;
    cursor: pointer;
    transition: background-color .2s;
}

.steps-write-btn:hover {
    background-color: rgb(255,175,0);
    transition: background-color .2s;
}

.steps-write-form-success {
    max-width: 450px;
    padding: 30px;
    background-color: rgb(39,174,97);
    color: #fff;
    text-align: center;
    font-size: 16px;
    line-height: 20px;
}

.steps-write-form-error {
    max-width: 450px;
    padding: 30px;
    background-color: rgb(235, 87, 87);
    color: #fff;
    text-align: center;
    font-size: 16px;
    line-height: 20px;
}

.steps-write-form-title {
    font-weight: bold;
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 20px;
}

.steps-form-close {
    position: absolute;
    top: -35px;
    right: -35px;
    width: 30px;
    height: 30px;
    background-image: url('/images/close.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    cursor: pointer;
}

.steps-form-plus-text {
    color: rgb(65,184,116);
    font-size: 16px;
    line-height: 20px;
    padding-bottom: 5px;
}

.steps-plus-minus-textarea {
    width: 100%;
    height: 100px;
    margin-bottom: 30px;
    display: block;
    padding: 10px;
    outline: 0!important;
    border: 1px solid rgb(189, 189, 189);
    resize: vertical;
}

.steps-plus-minus-textarea::-webkit-input-placeholder { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }
.steps-plus-minus-textarea::-moz-placeholder          { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }
.steps-plus-minus-textarea:-moz-placeholder           { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }
.steps-plus-minus-textarea:-ms-input-placeholder      { color: rgb(189, 189, 189); font-style: italic; font-size: 14px; line-height: 14px; }

.steps-form-minus-text {
    color: rgb(235,85,85);
    font-size: 16px;
    line-height: 20px;
    padding-bottom: 5px;
}

.steps-add-photo {
    position: relative;
    width: 200px;
    display: none;
    flex: 1;
    padding-left: 35px;
    background-image: url('/images/vector.svg');
    background-size: 25px;
    background-repeat: no-repeat;
    background-position: top left;
}

.steps-link {
    padding: 10px 0;
    text-decoration: underline;
    color: rgb(0, 66, 255);
    cursor: pointer;
}

.steps-counter {
    color: rgb(172,172,172);
    font-size: 16px;
    line-height: 20px;
    padding: 0 20px;
}

.steps-input__file {
    position: absolute;
    display: block;
    width: 200px;
    height: 40px;
    top: 0;
    bottom: 0;
    left: 0;
    visibility: hidden;
}

.steps-input__label {
    width: 200px;
    height: 40px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    cursor: pointer;
}

@media only screen and (max-width: 1150px) {
    
    .steps-write-message-w {
        padding: 25px;
        max-width: calc(100% - 40px);
    }

    .steps-form-close {
        right: 0;
        top: -40px;
    }

    .stars-rating {
        padding-left: 0;
        width: 420px;
    }
    
    .review-write-message-w {
        max-width: calc(100% - 80px);
        padding: 30px 20px;
    }
    
    .review-write-label-half {
        width:100%;
    }
    
    .review-write-message {
        padding:0;
    }
}

@media only screen and (max-width: 768px) {

    .steps-write-message-w {
        margin: 20% auto;
    }
    
    .steps-write-label-half {
        width: 100%;
    }

    .stars-rating {
        width: 100%;
        justify-content: center;
        margin-bottom: 25px
    }

    .stars-rating-item-w {
        margin-right: 20px;
    }

    .steps-step-3 {
        flex-wrap: wrap;
    }

    .friends-recommendation {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        padding-left: 0;
    }

    .stars-choose-block {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .stars-choose {
        width: 100%;
    }
}

@media only screen and (max-width: 480px) {

    .steps-write-btn {
        width: 170px;
    }
    .steps-counter {
        padding: 0 20px 0 0
    }

    .steps-write-w {
        flex-wrap: wrap;
    }

    .steps-add-photo {
        width: 100%;
        flex: auto;
        margin-bottom: 20px;
    }

    .steps-input__label {
        height: 30px;
    }

    .steps-input__file {
        width: 100%;
        height: 30px;
    }
    .steps-input__label {
        width: 100%;
    }

    .steps-step-3 {
        padding: 30px 0 30px 0;
    }

    .write-message {
        padding: 0;
    }
    .write-title {
        margin-top: 50px;
    }
}

/* Форма Добавить отзыв, конец */


.overlay {
    overflow: auto;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    min-height: 100%;
    background-color: rgba(0, 0, 0, .5);
    position: fixed;
    z-index: 5;
}

.steps-overlay {
    display: none;
    overflow: auto;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    min-height: 100%;
    background-color: rgba(0, 0, 0, .5);
    position: fixed;
    z-index: 5;
}

.scroll-locked {
    position: fixed;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}


.title-404 {
    font-size: 150px;
    line-height: 150px;
    color: rgb(122,122,122);
    text-align: center;
    margin-bottom: 100px;
    margin-top: 100px;
    font-weight: 400;
}

.text-404-text {
    font-size: 40px;
    line-height: 40px;
    font-weight: 100;
    color: rgb(122,122,122);
    text-align: center;
    margin-bottom: 100px;
}

.text-404-message {
    font-size: 25px;
    line-height: 25px;
    text-align: center;
}

.error-form-404 {
    display: block;
    max-width: 500px;
    margin: 0 auto 100px auto;
}

.error-form-div {
    margin-top: 25px;
}

.btn-404 {
    width: 220px;
    height: 50px;
    display: inline-block;
    font-size: 18px;
    line-height: 45px;
    font-weight: bold;
    text-align: center;
    border: none;
    outline: none;
    cursor: pointer;
    background-color: #ffc700;
    font-family: 'FontInterMedium';
    margin-top: 30px;
}

.btn-404-wrapper {
    text-align: right;
}

.text-input-404 {
    font-size: 16px;
    line-height: 24px;
}

.name-404 {
    display: block;
    height: 50px;
    width: 100%;
    border: 1px solid rgb(189,189,189);
    outline: 0!important;
    text-indent: 10px;
}

.text-404 {
    display: block;
    height: 80px;
    width: 100%;
    padding-top: 10px;
    border: 1px solid rgb(189,189,189);
    outline: 0!important;
    text-indent: 10px;
}

@media only screen and (max-width: 600px) {


    .title-404 {
        font-size: 100px;
        line-height: 100px;
        margin-bottom: 50px;
        margin-top: 50px;
    }
    .text-404-text {
        font-size: 30px;
        line-height: 30px;
        font-weight: 100;
        margin-bottom: 50px;
    }
    .error-form-div {
        margin-top: 20px;
    }

    .error-form-404 {
        padding: 0 20px
    }
}

.slide-img {
    background-size: cover;
    background-repeat:no-repeat;
}

.files-item {
    width: 100%;
    height: 30px;
    position: relative;

}

.files-item-w {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}