.grid {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin: -50px -50px 0 0;
    padding-top: 75px;
}

.grid__item {
    position: relative;
    z-index: 300;
    width: 50%;
    margin-top: 50px;
}

.empty {
    z-index: 1;
}

.grid__mr {
    height: 100%;
    margin-right: 50px;
}

.w-fix {
    width: 100%;
    max-width: 460px;
}

.w-flex {
    width: 10%;
    flex: 1 1;
}

@media(max-width: 1700px) {
    .grid, .grid.grid--cols {
        margin: -30px -30px 0 0;
        padding-top: 65px;
    }
    .pt-2, .grid.grid--cols.pt-2 {
        padding-top: 50px;
    }
    .grid__item, .grid--cols .grid__item {
        margin-top: 30px;
    }
    .grid__mr, .grid--cols .grid__mr {
        margin-right: 30px;
    }
}

@media(max-width: 1470px) {
    .grid {
        margin: -20px -20px 0 0;
        padding-top: 60px;
    }
    .grid__item {
        margin-top: 20px;
    }
    .grid__mr {
        margin-right: 20px;
    }
    .pt-2, .grid.grid--cols.pt-2 {
        padding-top: 45px;
    }
}

@media(max-width: 1260px) {
    .grid {
        padding-top: 50px;
    }
}

@media(max-width: 991px) {
    .w-fix, .w-flex {
        width: 100%;
        max-width: none;
        flex: none;
    }
    .pt-2, .grid.grid--cols.pt-2 {
        padding-top: 32px;
    }
}

@media(max-width: 767px) {
    .grid__item {
        width: 100%;
        max-width: 490px;
    }
    .grid {
        justify-content: center;
    }
    .empty {
        display: none;
    }
}

.review {
    position: relative;
    height: 475px;
    background-color: #f6f3ec;
    border-radius: 20px;
    padding: 45px;
    overflow: hidden;
}

.youtube {
    position: relative;
}

.youtube img {
    height: 45px;
}

@media(max-width: 1700px) {
    .review {
        padding: 30px;
    }
    .youtube img {
        height: 38px;
    }
}

@media(max-width: 1600px) {
    .review {
        height: 400px;
    }
}

@media(max-width: 1470px) {
    .review {
        height: 330px;
    }
    .youtube img {
        height: 30px;
    }
}

@media(max-width: 1260px) {
    .review {
        height: 300px;
        padding: 15px;
    }
    .youtube {
        display: inline-block;
        position: absolute;
        right: 15px;
        top: 15px;
        background-color: rgba(255,255,255,0.5);
        border-radius: 10px;
        padding: 10px 13px;
    }
    .youtube img {
        height: 23px;
    }
}

.youtube, .review-name {
    z-index: 300;
}

.review-name {
    width: 100%;
    max-width: 430px;
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: #5f5743;
    border-top-left-radius: 20px;
    text-align: center;
    padding: 30px;
    transition: .2s;
}
/*
.grid__item:hover .review-name {
    background-color: #353024;
    transition: .2s;
}*/

@media(max-width: 1700px) {
    .review-name {
        max-width: 400px;
        padding: 22px 20px;
    }
}

@media(max-width: 1470px) {
    .review-name {
        max-width: 370px;
        border-top-left-radius: 15px;
        padding: 18px 15px;
    }
}

@media(max-width: 1260px) {
    .review-name {
        max-width: 320px;
    }
}

@media(max-width: 991px) {
    .review-name {
        max-width: 100%;
        border-radius: 0;
    }
}

.review-photo {
    max-width: none;
    min-height: 102%;
    position: absolute;
    z-index: 1;
    left: 50%;
    transform: translateX(-50%) scale(1);
    bottom: -1px;
    transition: .2s;
}

.grid__item:hover .review-photo {
    transform: translateX(-50%) scale(1.12); 
    transition: .2s;
}

@media(max-width: 1600px) {
    .review-photo {
        max-height: 102%;
    }
}

.reviews .youtube img {
    transform: scale(1);
    transform-origin: 0 0; 
    transition: .2s;
}

@media(max-width: 991px) {
    .reviews .youtube img {
        transform-origin: 50% 50%;
    }
}

.reviews .grid__item:hover .youtube img {
    transform: scale(1.12);
    transition: .2s;
}