#testomonials{

}

.basic__info{
    display:flex;
}

.testomonials__wrapper{
    display: grid; 
    grid-auto-columns: 1fr; 
    grid-auto-rows: 1fr; 
    grid-template-columns: 1fr 1fr 1fr 1fr; 
    gap: 45px 11.8px; 
}

.testomonial__element{
    color:var(--black-text);
    background:white;
    height:368px;
    padding:27.97px 27.31px 44px 40px;
    border-radius:32px;
}

.basic__info{
    justify-content: space-between;
}

.basic__info .photo img{
    width:83px;
    height:83px;
    object-fit: cover;
    border:8px solid white;
    box-shadow: 0px 16px 16px 0px #00000014;
    border-radius:50%;
}

.name__p{
    color:var(--black-text);
    font-size:24px;
    font-weight:400;
    text-align: right;
    margin:10px 0 0 0;
}

.rate{
    display:flex;
    margin-bottom:12px;
    justify-content: flex-end;
}

.rate img{
    transition:1s ease;
}

.rate:hover img{
    filter: brightness(1.2);
}

.testomonial__text p, .testomonial__text p span{
    color:var(--gray-text);
    margin:48px 0 0 0;
    font-size:var(--default-size);
}

.testomonials__mobile, .custom-nav{
    display:none !important;
}

.owl-nav {
    display: none;
}

@media screen and (max-width:1560px) {
    .testomonials__wrapper{
        grid-template-columns: 1fr 1fr 1fr; 
    }
}

@media screen and (max-width:1200px) {
    .testomonial__text p{
        margin: 24px 0 0 0;
    }
}

@media screen and (max-width:1120px) {
    .testomonial__element{
        padding: 20px;
    }
}

@media screen and (max-width:1030px) {
    .name__p{
        font-size: 19px;
    }

    .testomonial__text p{
        margin:12px 0 0 0;
    }
}

@media screen and (max-width:995px) {
    .testomonials__wrapper{
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (max-width:700px) {
    .custom-nav{
        display: flex !important;
        justify-content: center;
        margin-top:30px;
        gap:20px;
    }

    .custom-nav .prev, .custom-nav .next {
        cursor: pointer;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

    .custom-nav .prev img, .custom-nav .next img {
        width: 40px;
        height: 40px;
        opacity:.5;
        transition:.2s ease;
    }

    .custom-nav .prev:hover img, .custom-nav .next:hover img {
        opacity:1;
    }

    .item{
        display: flex;
        flex-direction: column;
        gap:32.74px;
    }

    .testomonials__wrapper{
        display: none;
    }

    .testomonials__mobile{
        display:block !important;
    }

    .testomonial__text p{
        margin:16px 0 0 0;
    }

    .custom-nav .prev img, .custom-nav .next img{
        width: 25px;
        height:25px;
    }
}