 .carousel {
     position: relative;
     height: 530px;
     margin: 0 auto;
     max-width: 912px;
     margin-bottom: 3em;
     padding-bottom: 10px;
}
 @media (max-width: 1150px) {
     .carousel {
         width: 80%;
         height: 500px;
    }
}
 @media (max-width: 800px) {
     .carousel {
         width: 86%;
         height: 480px;
    }
}
 .carousel__image {
     height: 100%;
     width: 100%;
     object-fit: cover;
}
 .carousel__track-container {
     height: 100%;
     position: relative;
     overflow: hidden;
}
 .carousel__track {
     padding: 0;
     margin: 0 auto;
     list-style: none;
     position: relative;
     height: 100%;
     transition: transform 500ms ease-in;
     text-align: center;
}
 .carousel__slide {
     position: absolute;
     justify-content: space-around;
     align-items: center;
     top: 10px;
     bottom: 10px;
     width: 33.3333333%;
     padding-left: 2%;
     padding-bottom: 1%;
     padding-right: 2%;
     max-width: 395px;
}
 @media (max-width: 900px) {
     .carousel__slide {
         width: 50%;
    }
}
 @media (max-width: 600px) {
     .carousel__slide {
         width: 100%;
    }
}
 .carousel__button {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
}
 .carousel__button--left {
     left: -60px;
     width: 40px;
     height: 40px;
     background-image: url(../img/arrow-left.png);
     background-size: contain;
     background-repeat: no-repeat;
     cursor: pointer;
}
 @media (max-width: 800px) {
     .carousel__button--left {
         left: -40px;
    }
}
 @media (max-width: 600px) {
     .carousel__button--left {
         left: -28px;
    }
}
 .carousel__button--right {
     right: -80px;
     width: 40px;
     height: 40px;
     background-image: url(../img/arrow-right.png);
     background-size: contain;
     background-repeat: no-repeat;
     cursor: pointer;
}
 @media (max-width: 800px) {
     .carousel__button--right {
         right: -55px;
    }
}
 @media (max-width: 600px) {
     .carousel__button--right {
         right: -45px;
    }
}
 .carousel__nav {
     display: flex;
     justify-content: center;
     padding: 30px 0;
}
 .carousel__indicator {
     border: 0;
     border-radius: 50%;
     width: 11px;
     height: 11px;
     background: rgba(255,147,0, .3);
     margin: 0 8px;
     cursor: pointer;
}
 .carousel__indicator.current-slide {
     background: rgba(255,147,0, .95);
     cursor: pointer;
}
 .is-hidden {
     display: none;
}
 