/* notification */
.notification-top {
    background-color: #fbebec;
    position: relative;
    z-index: 98;
    height: 40px;
}

.notification-wrap {
    padding: 10px 0px;
    line-height: 20px;
    text-align: center;
}

.notification-wrap h6 {
    margin-right: var(--font-size-20);
    line-height: 20px;
}

.notification-wrap .notification-right .swiper {
    width: 100%;
    height: 20px;
    overflow-y: hidden;
}

.notification-wrap .notification-swiper-slide {
    line-height: 20px;
}

.notification-wrap .notification-swiper-slide a {
    white-space: nowrap;
    color: inherit;
    overflow: hidden;
}

.notification-wrap .notification-swiper-slide span {
    font-size: var(--font-size-14);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.notification-wrap .notification-swiper-slide a:hover span{
    color: var(--font-color-primary);
    text-decoration: underline;
}

.notification-wrap .notification-swiper-slide a i {
    font-size: 12px;
    margin-left: .5em;
}

@media (max-width: 991px) {
    .notification-wrap .notification-swiper-slide a {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .notification-wrap .notification-swiper-slide i {
        flex: 1;
    }
}



.notification-top ul.notification-entry {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.notification-top ul.notification-entry li.notify-wrap {
    width: 100%;
    padding: 10px 0px;
}

.notification-top ul.notification-entry li.notify-wrap .richtext a,
.notification-top ul.notification-entry li.notify-wrap .richtext p {
    color: var(--font-color-body);
    font-size: var(--font-size-body);
}

.notification-top ul.notification-entry li.notify-wrap.notify-wrap-center .richtext {
    text-align: center;
}

/* newsletter-modal */
#index-modal.hide-important {
    display: none !important;
}

#index-modal {
    position: fixed;
    z-index: 100;
    bottom: 1em;
    left: 1em;
    width: clamp(18.75rem, 12.358rem + 18.94vw, 34.375rem);
    /*300-600*/
    max-width: 550px;
    font-size: var(--font-size-20);
    background: #fff;
    border-radius: var(--border-radius);
    overflow: hidden;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: 0.3s ease 0s;
    -moz-transition: 0.3s ease 0s;
    -ms-transition: 0.3s ease 0s;
    -o-transition: 0.3s ease 0s;
    transition: 0.3s ease 0s;
    opacity: 0;
}

#index-modal.show {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
}

#index-modal button.close {
    position: absolute;
    top: 0;
    right: 0;
    background: transparent;
    border: 0;
    width: 2rem;
    padding: 0;
    height: 2rem;
    opacity: 0.5;
    font-size: 1.3em;
    z-index: 100;
}

#index-modal button.close:hover {
    color: var(--font-color-primary);
}

#index-modal .newsletter-image img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

#index-modal.hide {
    -webkit-transform: translateY(100%) !important;
    -moz-transform: translateY(100%) !important;
    -ms-transform: translateY(100%) !important;
    -o-transform: translateY(100%) !important;
    transform: translateY(100%) !important;
}

@media (max-width:991px) {
    #index-modal {
        width: 60%;
    }
}

@media (max-width:767px) {
    #index-modal {
        width: 80%;
    }
}

@media (max-width:575px) {
    #index-modal {
        width: calc(100% - 2em);
    }
}

/* slider-content css */
.slider-content {
    position: relative;
    width: 100%;
    height: clamp(26.25rem, 21.648rem + 13.64vw, 37.5rem);
    /*420-600*/
    max-height: 680px;
    overflow: hidden;
}

.slider-content .parallax-img {
    position: absolute;
    width: 50%;
    height: 100%;
    z-index: 1;
}

.slider-content .parallax-img .parallax-img-1,
.slider-content .parallax-img .parallax-img-2,
.slider-content .parallax-img .parallax-img-3 {
    -webkit-transition: all .3s linear;
    -o-transition: all .3s linear;
    transition: all .3s linear;
}

.slider-content .parallax-img .parallax-img-1 {
    position: absolute;
    left: 50%;
    height: clamp(15rem, 13rem + 10vw, 25rem);
    bottom: 50%;
    transform: translateX(-50%) translateY(50%);
    object-fit: cover;
    transform-origin: 65% 65%;
    animation: bimg1 8s infinite linear alternate;
}

.slider-content .parallax-img .parallax-img-2 {
    position: absolute;
    height: clamp(6.25rem, 5rem + 6.25vw, 12.5rem);
    left: 0;
    filter: blur(1px);
    opacity: .5;
    transform-origin: 50% 50%;
    animation: bimg2 8s infinite linear alternate;
}

.slider-content .parallax-img .parallax-img-3 {
    position: absolute;
    height: clamp(5rem, 4rem + 5vw, 10rem);
    right: 0;
    bottom: 0;
    opacity: .5;
    transform-origin: 50% 50%;
    animation: bimg3 8s infinite linear alternate;

}

@keyframes bimg1 {
    0% {
        transform: translateX(-50%) translateY(50%) rotate(-20deg) scale(1);
    }

    100% {
        transform: translateX(-50%) translateY(50%) rotate(0deg) scale(1.3);
    }
}

@keyframes bimg2 {
    0% {
        transform: translateY(50%) rotate(0deg) scale(1);
    }

    100% {
        transform: translateY(50%) rotate(-45deg) scale(1.2);
    }
}

@keyframes bimg3 {
    0% {
        transform: translateY(-50%) rotate(0deg) scale(1);
    }

    100% {
        transform: translateY(-50%) rotate(-45deg) scale(1.2);
    }
}

.slider-content .home-slider {
    z-index: 3;
}

.slider-content .home-slider .slide-image {
    position: relative;
    height: clamp(26.25rem, 21.648rem + 13.64vw, 37.5rem);
    /*420-600*/
}

.slider-content .home-slider .slide-image .slider-info-content {
    position: absolute;
    z-index: 1;
    bottom: 50%;
    transform: translateY(50%);
    left: 0;
    right: 0;
}

@media (max-width: 767px) {
    .slider-content .parallax-img {
        width: 100%;
    }

    .slider-content .home-slider .slide-image a img.desk-img {
        height: 400px;
        object-fit: cover;
    }
}

/* slider-text transition css */
.slider-content .home-slider .swiper-slide-active .slide-image .slider-text-info h2,
.slider-content .home-slider .swiper-slide-active .slide-image .slider-text-info h3,
.slider-content .home-slider .swiper-slide-active .slide-image .slider-text-info p,
.slider-content .home-slider .swiper-slide-active .slide-image .slider-text-info .slider-btn {
    /* -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both; */
    transform: translateY(0);
    opacity: 1;
}

/* slider-text css */
.home-slider .slide-image .slider-text-info {
    text-align: center;
    max-width: 55%;
    margin: 0 auto;
}

.home-slider .slide-image .slider-text-info.slider1 {
    margin-left: 45%;
    text-align: left;
}

.slider-content .home-slider .slide-image .slider-text-info h2,
.slider-content .home-slider .slide-image .slider-text-info h3,
.slider-content .home-slider .slide-image .slider-text-info p,
.slider-content .home-slider .slide-image .slider-text-info .slider-btn {
    transition: all 1s linear;
    opacity: 0;
}

.slider-content .home-slider .slide-image .slider-text-info h2 {
    margin: .25em 0;
    line-height: 1.2;
    font-weight: 700;
    text-transform: capitalize;
    transform: translateY(60px);
}

.slider-content .home-slider .slide-image .slider-text-info h3 {
    font-size: var(--font-size-36);
    line-height: 1.2;
    transform: translateY(40px);
}

.slider-content .home-slider .slide-image .slider-text-info p {
    font-size: var(--font-size-20);
    transform: translateY(40px);
}

.slider-content .home-slider .slide-image .slider-text-info .slider-btn {
    transform: translateY(30px);
}

@media (max-width: 1599px) {
    /* .slider-content .home-slider .slide-image .slider-text-info h2{
        font-size: 80px;
    }
    .slider-content .home-slider .slide-image .slider-text-info a {
        margin-top: 30px;
    }  */
}

@media (max-width: 1499px) {
    /* .slider-content .home-slider .slide-image .slider-text-info h2 {
        font-size: 60px;
    } */
}

@media (max-width: 1199px) {
    /* .slider-content .home-slider .slide-image .slider-text-info h2 {
        font-size: var(--font-size-80);
    } */
}

@media (max-width: 991px) {
    /* .slider-content .home-slider .slide-image .slider-text-info h2 {
        font-size: 40px;
    }
    .slider-content .home-slider .slide-image .slider-text-info a {
        margin-top: 20px;
    } */
}

@media (max-width: 767px) {
    .slider-content .parallax-img {
        opacity: .4;
    }

    .home-slider .slide-image .slider-text-info {
        max-width: 100%;
    }

    .home-slider .slide-image .slider-text-info.slider1 {
        margin-left: 0
    }
}

@media (max-width: 479px) {}

/* slider-dot css */
.slider-content .home-slider .swiper-pagination {
    display: none;
    position: absolute;
    margin-top: 0px;
    line-height: 0;
}

.slider-content .home-slider .swiper-pagination .swiper-pagination-bullet {
    margin-right: 5px;
    width: 15px;
    height: 15px;
    background-color: transparent;
    border: 2px solid var(--font-color-body);
    opacity: 1;
    border-radius: 50%;
}

.slider-content .home-slider .swiper-pagination .swiper-pagination-bullet:last-child {
    margin-right: 0px;
}

.slider-content .home-slider .swiper-pagination .swiper-pagination-bullet-active {
    background-color: var(--font-color-primary);
    border: 2px solid var(--font-color-primary);
}

@media (min-width: 1199px) {
    .slider-content .home-slider .swiper-pagination {
        display: flex;
        position: absolute;
        top: 50% !important;
        right: 10px !important;
        left: auto !important;
        width: auto !important;
        margin-top: -52px;
        line-height: 0;
        flex-direction: column;
    }

    .slider-content .home-slider .swiper-pagination .swiper-pagination-bullet {
        margin: 10px;
    }
}

@media (max-width: 1199px) {
    .slider-content .home-slider .swiper-pagination {
        bottom: 30px;
    }
}

@media (max-width: 767px) {
    .slider-content .home-slider .swiper-pagination {
        left: 12px;
    }
}

/* index-about css */
.index-about .row {
    align-items: center;
}

.index-about .index-about-left {
    position: relative;
}

.index-about .index-about-left span.quote {
    position: absolute;
    color: var(--font-color-primary);
    font-size: var(--font-size-60);
    top: -1.5em;
    line-height: 1em;
}

.index-about .index-about-left span.quote i {
    font-size: var(--font-size-60);
}

.index-about .index-about-left .index-about-title {
    position: relative;
    padding: var(--font-size-20) 0;
    z-index: 1;
}

.index-about .index-about-left .index-about-title::before {
    position: absolute;
    content: "";
    z-index: -1;
    width: 100%;
    min-height: 100%;
    top: .5rem;
    opacity: .1;
    background-image: url(../image/logo/biointron.svg);
    background-repeat: no-repeat;
    background-size: 100%;
}

.index-about .index-about-left .index-about-title h3 {
    font-size: var(--font-size-48);
    padding: 1.2rem 0;
}

.index-about .index-about-left .index-about-info p {}

.index-about .index-about-left .index-about-button {
    position: relative;
    line-height: 0;
    white-space: nowrap;
    font-weight: 500;
    display: inline-block;
}

.index-about .index-about-left .index-about-button i {
    margin-left: 25px;
}

.index-about .index-about-left .index-about-button span {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    padding: 20px 21px;
    color: var(--font-color-body);
}

.index-about .index-about-left .index-about-button a {
    display: inline-block;
    position: relative;
    width: 42px;
    padding: 20px 21px;
    color: var(--font-color-white);
    white-space: nowrap;
    overflow: hidden;
    background-color: var(--font-color-primary);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

.index-about .index-about-left .index-about-button:hover a {
    cursor: pointer;
    width: 100%;
}


/* index-client */
.index-client {
    position: relative;
}

.index-client::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: calc(var(--font-size-50) * -1);
    width: calc(50% + calc(1540px / 6) - 1.25rem);
    height: calc(100% - var(--font-size-100));
    background-image: linear-gradient(to right, #fff 0%, var(--font-color-primary) 100%);
}

.index-client .index-client-slider {
    position: relative;
}

.index-client .index-client-slider .swiper {
    width: 100%;
    height: 765px;
    padding-right: 2.5rem;
    padding-top: 15px;
    overflow-y: hidden;
}

.index-client .index-client-slider .swiper-slide {
    text-align: center;
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    box-shadow: 0px 0px 15px rgba(184, 28, 43, 0.15);
    overflow: hidden;
}

.index-client .index-client-slider .swiper-slide-client {
    flex-direction: column;
    padding: clamp(1.25rem, 1rem + 1.25vw, 2.5rem);
    justify-content: space-between;

}

.index-client .index-client-slider .swiper-slide-client p {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.index-client .index-client-slider .swiper-slide-client .index-client-title {
    font-size: var(--font-size-24);
    font-weight: var(--font-w-600);
    line-height: 1.4em;
}

.index-client .index-client-slider .swiper-button-prev {
    display: none;
}

.index-client .index-client-slider .swiper-button-next {
    transform: translateY(100%) translateX(-50%);
    top: auto;
    right: auto;
    left: calc(50% - 1.25rem);
    bottom: calc(var(--font-size-20) * -1);
    color: #fff;
}

.index-client .index-client-slider .swiper-button-next:after,
.index-client .index-client-slider .swiper-button-prev:after {
    display: none;
}

.index-client .index-client-slider .swiper-button-next i {
    font-size: var(--font-size-36);
}

@media (max-width: 1680px) {
    .index-client::before {
        width: calc(50% + calc(84% / 6) - 1.25rem);
    }

    .index-client .index-client-slider .swiper {
        padding-right: 2.5rem;
    }
}

@media (max-width: 1399px) {
    .index-client::before {
        width: calc(50% + calc(88% / 6) - .75rem);
    }

    .index-client .index-client-slider .swiper {
        padding-right: 1.5rem;
    }

    .index-client .index-client-slider .swiper-button-next {
        left: calc(50% - 0.75rem);
    }
}

@media (max-width: 1199px) {
    .index-client::before {
        width: calc(50% + calc(92% / 6) - .75rem);
    }

    .index-client .index-client-slider .swiper {
        padding-right: 1.5rem;
    }
}

@media (max-width: 991px) {
    .index-client::before {
        width: 100%;
        height: 60%;
    }

    .index-client .index-client-slider .swiper {
        height: 490px;
        padding-right: 0;
    }

    .index-client .index-client-slider .swiper-slide-client {
        padding: 20px;
        box-shadow: 0px 0px 10px rgba(184, 28, 43, 0.15);
    }

    .index-client .index-client-slider .swiper-button-next {
        left: 50%;
    }

}

/* index-news */
.index-news .checkout-tab .nav-tabs-news {
    border-bottom: 0;
    justify-content: center;
}

.index-news .checkout-tab .nav-tabs-news .nav-item .nav-link {
    line-height: 2em;
    margin: 0 clamp(0.5rem, 0.35rem + 0.75vw, 1.25rem);
    color: var(--font-color-body);
    text-align: center;
    border: 2px solid transparent;
    padding: 0 1em;
    border-radius: 50px;
}

.index-news .checkout-tab .nav-tabs-news .nav-item .nav-link::after {
    display: block;
    content: attr(title);
    font-weight: bold;
    visibility: hidden;
    height: 1px;
    color: transparent;
    margin-bottom: -1px;
    overflow: hidden;
}

.index-news .checkout-tab .nav-tabs-news .nav-item .nav-link.active {
    color: var(--font-color-primary);
    border: 2px solid var(--font-color-primary);
    font-weight: bold;
}