/* ****** banner ********************************** */ 

.productdetailbanner {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: calc(100% - 2 * var(--main-margin)); /* Respect left and right margins */
    margin: 0 auto 64px; /* Center the container horizontally */
    height: auto;
    box-sizing: border-box;
    overflow: hidden; /* Prevent overflow */
}

.productdetailbanner img {
    margin-top: 64px;
    max-width: 100%; /* Ensure the image scales down to fit the container */
    height: auto; /* Maintain aspect ratio */
    object-fit: contain; /* Prevent cropping */
}

/* ****** Product detail ********************************** */

.productdetail {
    margin-top: -32px;
}

.productdetail .pagesection p {
    line-height: 32px;
    font-size: 24px;
    font-weight: normal;
    text-align: justify;
    margin-top: 64px;
}

.productdetail .pagesection li p {
    margin-top: 0;
    margin-bottom: 0;
}

.productdetail .pagesection .imagesone img {
    width: 75%;
}

.productdetail .pagesection .imagestwo img {
    width: 35%;
}
.productdetail .pagesection .imagesthree img {
    width: 25%;
}
.productdetail .pagesection .imagesfour img {
    width: 25%;
}

.productdetail .feature {
    display: flex;
    margin-left: auto;
    margin-right: auto;
    margin-top: 32px;
    margin-bottom: 32px;
    cursor: pointer;
}

.productdetail .shadow {
    border-radius: 16px;
    box-shadow: black 0px 0px 16px 0px;
}

/* ****** Gallery ********************************** */

.glider-contain {
    margin: 0 auto;
    max-width: 800px;
}
.glider {
    display: flex;
}
.glider img {
    max-width: 100%;
    cursor: pointer;
}

.glider-prev.glider-button {
    background: var(--main-background);
    color: var(--main-color);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    left: -54px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    box-shadow: black 0px 0px 16px 0px;
}
.glider-next.glider-button {
    background: var(--main-background);
    color: var(--main-color);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    right: -54px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    box-shadow: black 0px 0px 16px 0px;
}