:root {
    --mossgreen: #044040;
    --offgreen: #3C8B8B;
    --textwhite:#F2F2F2;
    --textblack:#2D2D2D;
    --pricered: #D92526;
}

/* End of reset.css */
/* Start of gallery */
.container {
    margin-top: 74px;
    max-width: 800px;
    /* height: 40vh; */
    background-color: var(--textblack);

}

.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide img{
    width: 100%;
    height: 100%;
    display: block;
}

.swiper .swiper-button-next, .swiper .swiper-button-prev {
    color: var(--offgreen);
}

.swiper .swiper-pagination-bullet-active {
    background-color: var(--offgreen);
}

.swiper-slide, .swiper-zoom-container {
    width: 100%;
    height: 100%;
    background-color: var(--textblack);
    display: flex;
    justify-content: center;
    align-items: center;
}




/* End of gallery */
/* Start of product */
.product-info {
    margin-top: 20px;
    padding: 0 16px;
}

.product-info h1 {
    font-size: 20px;
    font-weight: 700;
    padding: 60px 0 20px 0;
}

.product-price-container {
    display: flex;
    align-items: baseline;
    /* margin-top: 10px; */
    color: var(--pricered);
    font-size: 16px;
    font-weight: 700;
}

.product-price {
    font-size: 32px;
    padding-left: 8px;
}
/* End of product */

/* Start of Checkout */

.checkout {
    margin: 32px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.checkoutButton {
    background-color: var(--mossgreen);
    color: var(--textwhite);
    border: none;
    padding: 10px 20px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    margin: 10px 0px;
    min-width: 120px;
}