* {
    margin: 0;
    padding: 0;
}

.page {
    display: grid;
    grid-template-columns: repeat(auto-fit , minmax(12rem , 1fr));
    background: ghostwhite;
    font-family: 'DM Mono', monospace;
}
.page-img img {
    width: 100%;
    height: 100%;
}
.page-img {
    z-index: 2;
    margin-bottom: 0;
}
.page-col3 {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 2rem;
    z-index: 2;
    background: #F8F8FF;
    height: 407px;
}
    .page-col3-main img{
        width: 2.1875rem;
    }
    
    .page-col3-main h2 {
        text-transform: uppercase;
    }

    .page-col3-main p {
        line-height: 1.5rem;
        font-size: 0.8rem;
    }
    .page-col3-main button {
        margin-top: 2rem;
        padding: 0.4rem 1.3rem;
        background: black;
        color: white;
        border: none;
        text-transform: uppercase;
        font-weight: 600;
        font-size: 0.8rem;
        transition: 1000ms;
        cursor: pointer;
    }
    .page-col3-main button:hover {
        background: #FFA500;
        color: black;
    }
.carousel {
    position: relative;
    width: 100%;
    height: 407px;
    background: wheat;
}
.side img {
    width: 2.1875rem;
}
.side {
    width: 100%;
}
.carousel__track-container {
    background: #F8F8FF;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.carousel__track {
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
    height: 100%;
    transition: transform 500ms ease-in;
}
.carousel__track-container .carousel__track .carousel__side {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.side1 {
    background:#F8F8FF
    width: 100%;
    height: 100%;
    z-index: 1;
}
.side2 {
    background: #F8F8FF
    width: 100%;
    height: 100%;
    z-index: 2;
}
.side3 {
    background:#F8F8FF;
    width: 100%;
    height: 100%;
    z-index: 3;
}

.carousel__button {
    position: absolute;
    bottom: 15%;
    left: 42% ;
    transform: translateY(-50%);
    background: transparent;
    border: 0;
    cursor: pointer;
    outline: none;
}

.carousel__button--right {
    left: 53%;
    z-index: 5;
}
.carousel__button--left {
    z-index: 5;
}
.carousel__button i{
  width: 16px;
}
.side {
    text-align: center;
    padding-top: 18%;
    line-height: 1.2rem;

}
.side p:nth-child(2){
    font-size: 0.8rem;
    margin-bottom: 1rem;
}
.side small{
    font-size: 0.7rem;
    color: #FFA500;
}
.page2 {
    background: black;
    padding-top: 2rem;
    padding-bottom: 2rem;
}
.glider figure {
    display: inline-block;
}
.glider {
    overflow-x: hidden;
}