.elementor-3432 .elementor-element.elementor-element-c8890f8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}/* Start custom CSS for html, class: .elementor-element-d71731f */.feature-section {
    text-align: center;
    padding: 60px 20px;
    position: relative;
    overflow-x: hidden;
    overflow-y: hidden;
}

.feature-container {
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    width: 100%;
    height: auto;
}

/* Rotating Image Circles */
.dashed-circle,
.dashed-circle-2 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
    pointer-events: none;
}


.dashed-circle {
    width: 85%;
    height: auto;
}

.dashed-circle-2 {
    width: 80%;
    height: auto;
}

.dashed-circle img,
.dashed-circle-2 img {
    width: 100%;
    height: auto;
    display: block;
    animation: rotateCircle 25s linear infinite;
    transform-origin: center center;
}

.dashed-circle-2 img {
    animation: rotateCircleReverse 40s linear infinite;
}

/* Rotate Animations */
@keyframes rotateCircle {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes rotateCircleReverse {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}

.pomegranate .btn-link {
    margin-top: -6px !important;
}

.beetroot .btn-link {
    margin-top: -6px;
}


/* Product Image */
.product-image {
    position: relative;
    z-index: 2;
    text-align: center;
    WIDTH: 100%;
}

.product-image img {
    width: 52%;
    height: auto;
}

/* Labels */
.label-div {
    position: absolute;
    display: flex;
    gap: 10px;
    font-size: 14px;
    font-weight: 500;
    color: #000;
    z-index: 3;
}

.label-div a {
    font-size: 18px;
    font-weight: 500;
    color: #000;
    text-decoration: none;
}

/* Line Images */
.img-div img {
    width: 95%;
}

/* LEFT LABELS */
.label-div.pomegranate {
    top: 0%;
    left: -8%;
}

.label-div.citrulline {
    top: 50%;
    left: 0%;
}

.label-div.vitamin {
    bottom: 0%;
    left: -8%;
    align-items: end;
}

/* RIGHT LABELS */
.label-div.beetroot {
    top: 0%;
    right: -8%;
}

.label-div.nitric {
    top: 50%;
    right: 1%;
}

.label-div.taurine {
    bottom: 0%;
    right: -6%;
    align-items: end;
}


.pomegranate {
    width: 50%;
}

.citrulline {
    width: 50%;
    align-items: center;
}

.vitamin {
    width: 50%;
}

.beetroot {
    width: 50%;
}

.nitric {
    width: 50%;
    align-items: center;
}

.taurine {
    width: 50%;
}

.pomegranate,
.citrulline,
.vitamin {
    justify-content: start !important;
}

.beetroot,
.nitric,
.taurine {
    justify-content: end !important;
}


@media screen and (max-width: 1366px) {
    .feature-container {
        max-width: 960px;
    }

    .label-div.citrulline {
        left: -5%;
    }

    .pomegranate {
        width: 40%;
    }

    .citrulline {
        width: 40%;
    }

    .vitamin {
        width: 40%;
    }

    .beetroot {
        width: 40%;
    }

    .nitric {
        width: 40%;
    }

    .taurine {
        width: 40%;
    }

    .vitamin .img-div {
        width: 70%;
    }

    .beetroot .img-div {
        width: 70%;
    }

    .taurine .img-div {
        width: 70%;
    }

    .pomegranate .img-div {
        width: 70%;
    }

    .citrulline .img-div {
        width: 50%;
    }

    .nitric .img-div {
        width: 50%;
    }

}

@media screen and (max-width: 1280px) {

    .product-image img {
        width: 45%;
    }

    .dashed-circle {
        width: 75%;
    }

    .dashed-circle-2 {
        width: 70%;
    }

    .label-div.pomegranate {
        left: -4%;
    }

    .pomegranate .img-div {
        width: 65%;
    }

    .label-div a {
        font-size: 16px;
    }

    .vitamin .img-div {
        width: 65%;
    }

    .label-div.vitamin {
        left: -1%;
    }

    .citrulline .img-div {
        width: 45%;
    }

    .label-div.citrulline {
        left: 0%;
    }

    .label-div.beetroot {
        right: -1%;
    }

    .beetroot .img-div {
        width: 65%;
    }

    .nitric .img-div {
        width: 45%;
    }

    .label-div.nitric {
        right: 4%;
    }

    .taurine .img-div {
        width: 65%;
    }

    .label-div.taurine {
        right: 1%;
    }
}

@media screen and (max-width: 1024px) {
    .feature-container {
        max-width: 720px;
    }

    .product-image img {
        width: 35%;
    }

    .dashed-circle {
        width: 65%;
    }

    .dashed-circle-2 {
        width: 60%;
    }

    .label-div.pomegranate {
        left: 0%;
    }

    .pomegranate .img-div {
        width: 55%;
    }

    .citrulline .img-div {
        width: 35%;
    }

    .label-div.citrulline {
        left: 4%;
        top: 45%;
    }

    .vitamin .img-div {
        width: 55%;
    }

    .label-div.vitamin {
        left: 4%;
    }

    .label-div.beetroot {
        right: 4%;
    }

    .beetroot .img-div {
        width: 55%;
    }

    .nitric .img-div {
        width: 35%;
    }

    .label-div.nitric {
        right: 8%;
        top: 45%;
    }

    .taurine .img-div {
        width: 55%;
    }

    .label-div.taurine {
        right: 6%;
    }

    .label-div a {
        font-size: 14px;
    }

}

@media screen and (max-width: 768px) {
    .feature-container {
        max-width: 540px;
    }

    .product-image img {
        width: 30%;
    }

    .dashed-circle {
        width: 55%;
    }

    .dashed-circle-2 {
        width: 50%;
    }

    .pomegranate .img-div {
        width: 45%;
    }

    .vitamin .img-div {
        width: 45%;
    }

    .citrulline .img-div {
        width: 25%;
    }

    .beetroot .img-div {
        width: 45%;
    }

    .nitric .img-div {
        width: 25%;
    }

    .taurine .img-div {
        width: 45%;
    }

    .label-div.pomegranate {
        left: 3%;
    }

    .label-div.citrulline {
        left: 7%;
    }

    .label-div.vitamin {
        left: 7%;
    }

    .label-div.beetroot {
        right: 7%;
    }

    .label-div.nitric {
        right: 12%;
    }

    .label-div.taurine {
        right: 10%;
    }
}

@media screen and (max-width: 540px) {
    .feature-container {
        max-width: 400px;
    }

    .product-image img {
        width: 20%;
    }

    .dashed-circle {
        width: 45%;
    }

    .dashed-circle-2 {
        width: 40%;
    }

    .pomegranate .img-div {
        width: 35%;
    }

    .citrulline .img-div {
        width: 15%;
    }

    .vitamin .img-div {
        width: 35%;
    }

    .beetroot .img-div {
        width: 35%;
    }

    .nitric .img-div {
        width: 15%;
    }

    .taurine .img-div {
        width: 35%;
    }

    .label-div.pomegranate {
        left: 5%;
    }

    .label-div.citrulline {
        left: 8%;
        top: 35%;
    }

    .label-div.vitamin {
        left: 11%;
    }

    .label-div.beetroot {
        right: 10%;
    }

    .label-div.nitric {
        right: 15%;
        top: 35%;
    }

    .label-div.taurine {
        right: 14%;
    }

    .label-div a {
        font-size: 10px;
    }

    .pomegranate .btn-link {
        margin-top: -10px !important;
    }

    .beetroot .btn-link {
        margin-top: -10px !important;
    }

}


@media screen and (max-width: 480px) {
    .label-div.pomegranate {
        left: 10%;
    }

    .label-div.citrulline {
        left: 14%;
        top: 30%;
    }

    .label-div.vitamin {
        left: 14%;
    }

        .label-div.beetroot {
        right: 14%;
    }
    .label-div.nitric {
        right: 18%;
        top: 30%;
    }
        .label-div.taurine {
        right: 17%;
    }
}

@media screen and (max-width: 400px) {
        .label-div.pomegranate {
        left: 8%;
    }
    .label-div.citrulline {
        left: 12%;
    }
    .label-div.vitamin {
        left: 12%;
    }
        .label-div.beetroot {
        right: 11%;
    }
        .label-div.nitric {
        right: 17%;
    }
        .label-div.taurine {
        right: 16%;
    }
}/* End custom CSS */