


.carousel-wrapper {
    overflow: hidden;
    position: relative;
    padding-top: 21px;
    padding-bottom: 18px;
}

html[dir="rtl"] .carousel-block {
    
    float: right;
    width: 475px;
    padding: 21px 14px 23px 19px;
    margin: 0 10px;
    position: relative;
    left: 305px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.07);
    border-radius: 15px;
}
html[dir="rtl"] .carousel-button-right {
    position: absolute;
    bottom: 0px;
    right: 0px;
}
.carousel-block {
    float: right;
    width: 475px;
    padding: 21px 14px 23px 19px;
    margin: 0 10px;
    position: relative;
    left: 305px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.07);
    border-radius: 15px;
}
        .carousel{
            position: relative;
            margin-top: -18px;
        }
.carousel-items {
   width: 10000px; /* óñòàíàâëèâàåì áîëüøóþ øèðèíó äëÿ íàáîðà ýëåìåíòîâ */
   position: relative; /* ïîçèöèîíèðóåì áëîê îòíîñèòåëüíî îñíîâíîé îáëàñòè êàðóñåëè */
}
.carousel-block {
    float: left;
    width: 475px;
    padding: 21px 14px 23px 19px;
    margin: 0 10px;
    position: relative;
    left: -790px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.07);
    border-radius: 15px;
}
.carousel-block img{
    display: block;
    border-radius: 53px;
}
.rew-h4{
    font-weight: 500;
    font-size: 18px;
}
.wrap-rew-h4{
    display: grid;
    grid-template-columns: 50px 1fr 106px;
    gap: 0px 10px;
}
.rew-p{
    margin: 0px !important;
}
.rew-avatar{
    grid-row: span 2;
}
.carousel-button-right img{
display: block;
position: relative;
transform: rotate(180deg);
}
        .carousel-button-left{
            position: absolute;
            bottom: 0px;
            left: 0;
        }
        .wrap-carusel-button{
            position: relative;
            z-index: 2;
            bottom: -18px;
        }

        .carousel-button-right {
    position: absolute;

    bottom: 0px;
            right:0px;
}
.carousel-button-left button, .carousel-button-right button{
   position: relative;
   
   cursor: pointer; 
   text-decoration:none;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 6px;
   padding: 6px 10px;
   background: transparent;
   border: none;
   font-family: inherit;
   font-size: 14px;
   color: #000;
   background-color: transparent;
}
.carousel-button-left button{
   float: left; 
}
.carousel-button-right button{
   float: right;
}

.carousel-button-left img,
.carousel-button-right img{
    width: 35px;
    height: 35px;
    display: block;
}

.carousel-button-left .nav-text,
.carousel-button-right .nav-text{
    white-space: nowrap;
}

.carousel-dots{
    text-align: center;
    margin-top: 20px;
    position: relative;
    top: -36px;
}

.carousel-dot{
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #D9D9D9;
	margin: 0 4px;
}

.carousel-dot.active{
	background: #ff4b6a;
}
@media (max-width: 1023px) {  
html[dir="rtl"] .carousel-block {
    float: right;
    width: 475px;
    padding: 21px 14px 23px 19px;
    margin: 0 10px;
    position: relative;
    left: 361px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.07);
    border-radius: 15px;
}
}
@media (max-width: 768px) { 
    .carousel-block {
    float: left;
    width: 330px;
    padding: 21px 14px 23px 19px;
    margin: 0 10px;
    position: relative;
    left: -697px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.07);
    border-radius: 15px;
}
 }
 @media (max-width: 720px) {
    html[dir="rtl"] .carousel-block {
        float: right;
        width: 475px;
        padding: 21px 14px 23px 19px;
        margin: 0 10px;
        position: relative;
        left: 466px;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.07);
        border-radius: 15px;
    }
}
@media (max-width: 565px) { 
    html[dir="rtl"] .carousel-block {
        float: right;
        width: 320px;
        padding: 21px 14px 23px 19px;
        margin: 0 10px;
        position: relative;
        left: 659px;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.07);
        border-radius: 15px;
    }
 }
 @media (max-width: 393px) {
    html[dir="rtl"] .carousel-block {
        float: right;
        width: 320px;
        padding: 21px 14px 23px 19px;
        margin: 0 10px;
        position: relative;
        left: 682px;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.07);
        border-radius: 15px;
    }
  }
 @media (max-width: 383px) { 
    .carousel-block {
        float: left;
        width: 312px;
 }
 .rew-h4 {
    font-weight: 500;
    font-size: 16px;
}
.rew-p {
    margin: 0px !important;
    font-size: 14px !important;
}
   .carousel-block {
        

        left: -661px;
  
    }
}


