:root {
    --theme-colour: #0054a4;
    --common-colour: #0054a4;
    --secondary-colour: #FFDC01;
    --tertiary-colour: #EC1C24;
    --primary-font: "Sour Gummy";
    --secondary-font: "Sour Gummy";
}

body { background-image: url('../images/shapes/website-bg.jpg'); background-position: top center; background-size: 100% 100%; background-repeat: no-repeat; }

.gap { padding-top: 60px; padding-bottom: 60px; }
.gap-bottom { padding-bottom: 60px; }
.logo img { display: block; }
.res-log { display: inline-block; }
.logo p, .res-log p { font-size: 12px; text-align: right; color: var(--common-colour); font-weight: 400; display: block; padding-right: 3px; }
.preloader { background-color: var(--common-colour); }
#progress-value { color: var(--common-colour); }
.loader .dot { background-color: #fff; }
.top-wrapper { background-color: rgba(0,0,0,0.2); border-bottom: 1px solid rgba(255,255,255,0.4); }
.top-bar { justify-content: center; }

.navbar-links { align-items: center; }
header.two .navbar-links li > a { color: #fff; }
.navbar-links li > a { border-bottom: 3px solid transparent; padding-top: 10px; color: #fff; }
.navbar-links li:hover > a { border-bottom: 3px solid var(--secondary-colour); }
.navbar-links li.active > a { border-bottom: 3px solid var(--secondary-colour); } 
.navbar-links li.active:hover > a { border-bottom: 3px solid var(--secondary-colour); }
.navbar-dropdown > a { position: relative; }
.navbar-dropdown:has(div.dropdown) > a { padding-right: 20px; }
.navbar-dropdown:has(div.dropdown) > a::after { display: inline-block; position: absolute; content: "\f078"; right: 0; top: 17px; font: var(--fa-font-solid); font-size: 10px; }

.social-btn { margin-left: 30px; }

.navbar-links li:nth-child(3) { padding-right: 0; }
.nav-logo { margin-left: 30px; margin-right: 30px; }

ul.social-media a { display: inline-block; padding-top: 4px; text-align: center; width: 34px; height: 34px; }
.collnumber a { padding-left: 0; }
.phone-area { margin-right: 15px; position: relative; }


header { background-color: transparent; position: fixed !important; left: 0; top: 0; z-index: 999; }
header .clip-con { -webkit-clip-path: url(#clip-header); clip-path: url(#clip-header); position: absolute; top: auto; bottom: 0; left: 0; width: 100%; overflow: hidden; height: 104%; transition: all .25s ease-out; }
header .clip-con .bg { position: absolute; height: auto; width: 100%; }
header.two .bar-menu i { color: #fff; margin-right: 0; }
header.two .bar-menu { margin-right: 30px; }
header.two .bottom-bar { border: 0 !important; padding-bottom: 30px; }

.hero-section-three .hero-clip-con { z-index: 998; -webkit-clip-path: url(#clip-hero); clip-path: url(#clip-hero); position: absolute; bottom: 0; left: 0; width: 100%; overflow: hidden; height: 55px; transition: all .25s ease-out; }
.hero-section-three .hero-clip-con .bg { position: absolute; height: auto; width: 100%; }


.slider-hero .product-layers {
    position: relative;
    width: auto;
    height: 0;
    padding-bottom: 70%; 
}

.slider-hero .product-layers img {
    position: absolute;
    max-width: 100%;
}

.slider-hero .product-layers .layer1 { z-index: 5; bottom: 0; left: 50px; } 
.slider-hero .product-layers .layer2 { z-index: 6; bottom: 0; left: 180px; }
.slider-hero .product-layers .layer3 { z-index: 6; bottom: 0; left: 340px; }
.slider-hero .product-layers .layer4 { z-index: 2; bottom: 20px; left: 0; transition: 1s ease all; }
.slider-hero .product-layers .layer5 { z-index: 3; bottom: 20px; left: 150px; transition: 1s ease all; }
.slider-hero .product-layers .layer6 { z-index: 1; bottom: 30px; left: 300px; transition: 1s ease all; }

.slider-hero .product-layers:hover .layer1 { animation-name: bounce; animation-duration: 1s; } 
.slider-hero .product-layers:hover .layer2 { animation-name: swing; animation-duration: 1s; } 
.slider-hero .product-layers:hover .layer3 { animation-name: swing; animation-duration: 1s; } 
.slider-hero .product-layers:hover .layer4 { transform: rotate(-10deg); } 
.slider-hero .product-layers:hover .layer5 { transform: scale(1.03); } 
.slider-hero .product-layers:hover .layer6 { transform: rotate(10deg);} 

@media (max-width: 768px) {
    .slider-hero .product-layers { padding-bottom: 50%; }
    .slider-hero .product-layers .layer1 { left: 17%; bottom:12%; max-width:25%; }
    .slider-hero .product-layers .layer2 { left: 37%; bottom:12%; max-width:25%; }
    .slider-hero .product-layers .layer3 { left: 57%; bottom:12%; max-width:25%; }
    .slider-hero .product-layers .layer4 { left: 17%; bottom:12%; max-width:25%; }
    .slider-hero .product-layers .layer5 { left: 37%; bottom:12%; max-width:25%; }
    .slider-hero .product-layers .layer6 { left: 57%; bottom:12%; max-width:25%; }
    .hero-text .btn { margin-top: 20px; }
}


.box-shadow { box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px; }
.box-shadow-alt { box-shadow: rgba(0, 0, 0, 0.30) 0px 22px 70px 4px; }
.box-shadow-gap { box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 20px -10px; }
.box-shadow-45 { box-shadow: rgba(0, 0, 0, 0.2) 0px 18px 50px -10px; }
.box-shadow-88 { box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px; }
.box-shadow-82 { box-shadow: rgba(0, 0, 0, 0.40) 0px 22px 70px 4px; }
.box-shadow-prd { box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px; }
.box-shadow-feature { box-shadow: none; }

.mobile-nav { background-color: #fff; }
.mobile-nav a#res-cross::before { color: var(--common-colour); }
.mobile-nav > ul > li > a { color: var(--common-colour); font-weight: 700; }
.mobile-nav > ul > li > a:hover, .mobile-nav > ul > li > a:focus { color: var(--theme-colour) }
.mobile-nav > ul li > a { color: var(--common-colour); font-size: 16px; font-weight: 700; }
.mobile-nav > ul > li.menu-item-has-children.active > ul.sub-menu li:before { background-color: var(--common-colour); }
.mobile-nav > ul > li.menu-item-has-children:before { color: var(--common-colour); }
.mobile-nav > ul > li.menu-item-has-children.active:before { color: var(--secondary-colour); }

.top-bar { padding: 10px 0; }
.two-bar { border-radius: 0 !important; padding: 10px 0 10px 0; justify-content: center; }
.phone-icon { height: 25px; }
.package-icon { height: 30px; }

.shop-header .btn { animation: shadow-pulse-theme 4s infinite; font-size: 16px; background-color: var(--common-colour); color: #fff; line-height: 22px; font-weight: 400; border-radius: 30px; padding: 12px 30px; }
.shop-header .btn:hover { color: #000; }
.shop-header .btn::before { background-color: var(--theme-colour); }

.btn { font-weight: 600; font-family: var(--secondary-font); font-size: 18px; background-color: var(--theme-colour); color: #fff; line-height: 14px; padding-bottom: auto; padding: 15px 40px; border-radius: 21px;  }
.btn i { font-size: 12px; padding-right: 0; }
.btn::before { background-color: var(--secondary-colour); }
.btn:hover { color: #222; }

.hero-section.three { padding-top: 12rem; padding-bottom: 0; }
.hero-section .hero-text { margin-bottom: 100px; }
.hero-section h2 { font-size: 80px; font-family: var(--secondary-font); font-weight: 900; color: var(--common-colour); margin-bottom: 30px; }
.hero-section.three:before { opacity: 0; }
.hero-text p { color: #fff; font-family: var(--secondary-font); font-size: 24px; font-weight: 400; text-shadow: 1px 2px #666; }
.hero-section-three .slider-hero .owl-dots { bottom: 10%; left: auto; width: 100%; text-align: center; }
.hero-section-three .slider-hero button.owl-dot { border: 3px solid var(--common-colour); }
.hero-section-three .slider-hero button.owl-dot:not(.active) { border: 3px solid var(--common-colour); background-color: #e3eefd; }

.title-logo { height: 80px; }
.perks { margin-bottom: 10px; }
.perks img { display: inline-block; max-height: 25px; }
.perks .perk-title { display: inline-block; font-family: var(--secondary-font); font-weight: 400; font-size: 18px; color: var(--common-colour); padding-top: 0px; line-height: 25px; }
.about-btn { margin-top: 30px; font-weight: 400; box-shadow: none !important; }
.about-btn:hover { background-color: var(--secondary-colour) !important; color: #222 !important; }

.visual-key .image img { border-radius: 100%; padding: 0; border: 5px solid rgba(71, 118, 40,0.9); }
.visual-key .image { padding: 50px; position: relative; background-color: rgba(236, 28, 36,0.2); border-top-left-radius: 50%; border-top-right-radius: 100%; border-bottom-left-radius: 100%; border-bottom-right-radius: 50%; }
/*.visual-key .image::after { background-image: url(../custom/key-left.png); background-size: cover; position: absolute; left: 50px; top: 50px; content: ""; display: block; width: 214px; height: 162px; }*/
/*.visual-key .image::before { background-image: url(../custom/key-right.png); background-size: cover; position: absolute; right: 50px; bottom: 50px; content: ""; display: block; width: 214px; height: 162px; }*/

.claim-your { padding: 0; height: 400px; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; }
.claim-your .claim-your-text {  margin-left: 0; width: 40%; display: flex; flex-direction: column; align-items: flex-start; margin-top: -65px; padding-right: 30px; }
.claim-your .claim-your-text h4 { font-family: var(--secondary-font); text-shadow: 1px 2px #888; }

footer.three:before { opacity: 0.8; }
footer.three .oba-copyright p { font-family: var(--secondary-font); color: #fff; font-size: 20px; font-weight: 700; width: 100%; margin-bottom: 0; }
footer.three .oba-copyright img { margin: 0 0 0 0; padding: 0; max-width: 40px; }
footer.three { padding-top: 0; background-position: top center; background-size: 100% 100%; background-repeat: no-repeat; }
footer.three .widget-title h3 { color: #fff; font-size: 24px; font-weight: 700; }
footer.three .widget-title p { margin-bottom: 0; color: #fff; margin-top: 40px; }
footer.three .widget-title ul.social-media a { background-color: var(--common-colour); }
footer.three .widget-title ul.social-media a i {  color: #fff; }
footer.three .widget-title > ul.links li a:hover { color: var(--common-colour); }
footer.three .widget-title > ul.links li a { color: #fff !important; font-size: 18px; }
footer.three .widget-title img { margin-bottom: 0 !important; margin-right: 15px; }
footer.three { padding-top: 200px; }

/* .footer-clip-con { transform: rotate(180deg); z-index: 999; -webkit-clip-path: url(#clip-footer); clip-path: url(#clip-footer); position: absolute; top: 0; left: 0; width: 100%; overflow: hidden; height: 52px; transition: all .25s ease-out; } */
.footer-clip-con { -webkit-clip-path: url(#clip-footer); clip-path: url(#clip-footer); position: absolute; top: 0; left: 0; width: 100%; overflow: hidden; height: 100%; transition: all .25s ease-out; }
.footer-clip-con .bg { position: absolute; height: 100%; width: 100%; }
footer.three::before { display: none !important; }

footer.three .widget-title > ul.links li i { color: #fff; }
footer.three .footer-bottom { margin-top: 20px; padding: 10px 0; background-color: #072A54; }
.footer-bottom-text p { color: #fff; font-size: 15px; display: block; margin-bottom: 0; }
.footer-bottom-text a { color: #fff; font-size: 15px; }
.footer-bottom-text ul li a:hover { color: var(--secondary-colour); }
.footer-bottom-text a:hover { color: var(--secondary-colour); }
.footer-bottom-text ul li:not(:last-child):before { top: 4px; background-color: #fff; }
.footer-bottom-text p a { color: #fff; font-weight: 400; }

.fast-contact li { position: relative; padding-left: 0; line-height: 30px; margin-bottom: 20px; }
.fast-contact li, .fast-contact li a { font-size: 18px; font-weight: 400; color: #fff;  }
.fast-contact li i { font-size: 11px; position: absolute;left: 0; top: 3px; display: inline-block; width: 27px; height: 27px; background-color: var(--common-colour); text-align: center; border-radius: 100%; color: #fff; padding-top: 8px; }

.products-needs { margin-bottom: 15px; }
.products-needs-text { width: 50%; left: 30px; top: 30px; transform: none; text-align: left; }
.products-needs-text p { margin-top: 5px; font-size: 16px; }
.products-needs-text h3 { font-family: var(--secondary-font); font-weight: 400; font-size: 30px; text-align: left; color: #fff; }
.products-needs-text h3 a { font-family: var(--secondary-font); font-weight: 400; font-size: 30px; text-align: left; color: #fff; }
.products-needs:before { background-color: #222; opacity: 0.4; }
.products-needs .btn-outline { font-family: var(--primary-font); font-weight: 500; width: 45%; }
.products-needs:hover .btn-outline { background-color: var(--theme-colour); color: #fff; border-color: #fff; }
.products-needs:hover img { transform: scale(1.03); }

.section-medicen-need { padding-top: 60px; }
.section-medicen-need.inner { padding-top: 80px; }
.section-medicen-need .heading { text-align: center; }
.section-medicen-need .heading img { max-height: 60px; padding-bottom: 10px; margin: auto; }
.section-medicen-need .heading.two h2 { margin-bottom: 30px; text-align: center; color: var(--common-colour); font-family: var(--secondary-font); }
.section-medicen-need { background-image: url('../custom/background-section-1.jpg'); background-size: cover; background-position: top center; background-repeat: no-repeat; }
.section-medicen-need.no-image { background-image: none; }
.section-medicen-need.inner .products-needs { margin-bottom: 10px; }

.trending-carousel { position: relative;  overflow: hidden;  }
.trending-carousel .heading h2 { font-family: var(--secondary-font); color: var(--common-colour); font-weight: 900; font-size: 48px; }
.trending-carousel .heading p { margin: auto; }

.trending-products-img { padding: 10px; }
.trending-products a.add-to-cart { background-color: var(--common-colour); color: #fff; font-family: "Noto Serif"; font-weight: 400; }
.trending-products-text { text-align: center; background-color: var(--common-colour); }
.trending-products-text a { font-family: var(--secondary-font); font-weight: 400; color: #fff; font-size: 19px; }

.trending-products:hover img { transform: scale(1.05); }

.trending.inner { padding-bottom: 50px; }
.trending.inner .item { margin-bottom: 30px; }
.trending.inner .trending-products { width: 100%; }

.trending-carousel .trending-slider { overflow: hidden; padding-bottom: 70px; }
.trending-carousel .owl-dots { bottom: 10%; left: auto; width: 100%; text-align: center; }
.trending-carousel button.owl-dot { border: 3px solid var(--common-colour); }
.trending-carousel button.owl-dot:not(.active) { border: 3px solid var(--common-colour); background-color: #e3eefd; }

.trending-carousel .item .product-image { position: relative; margin-top: 10%; }
.trending-carousel .item .product-image figure img { max-width: 100%; }
.trending-carousel .item .product-image .product-bottle {  position: absolute; transform: translate3d(-50%, -50%, 0) rotate(4deg); top: 50%; left: 50%;  }
.trending-carousel .item .product-image .product-bottle img { max-width: 90%; }
.trending-carousel .item .product-image:hover .product-bottle img { animation-name: swing; animation-duration: 1s; }

.trending-carousel .item .product-info h3 { font-size: 36px; font-weight: 700; color: var(--common-colour); }
.trending-carousel .item .product-info h3 a { color: var(--common-colour); }
.trending-carousel .item .product-info h3 a:hover { color: var(--tertiary-colour); }

.trending-carousel .item .product-info .spot p {  font-size: 20px; font-weight: 600; color: var(--common-colour);}
.trending-carousel .item .product-info .description p {  font-size: 20px; font-weight: 400; color: var(--common-colour);}

.trending-carousel .section-shape {  position: absolute; top: 0; left: 0; height: calc(100% - 6.5rem); width: 100vw; mix-blend-mode: multiply; }

.trending-carousel.listing .product-image { max-width: 65%; margin-bottom: 40px; }

.product-gap { padding-top: 200px; }

.article.default .article-info .article-title {  }
.article.default .article-info .article-content p { font-size: 24px; font-weight: 400;  line-height: 42px;color: var(--common-colour); }

.article-wrapper { position: relative; overflow: hidden; margin-top: 100px; margin-top: 50px; margin-bottom: 100px; }
.article-wrapper .section-shape { position: absolute; top: 0; left: 0; height: 100%; width: 60vw; mix-blend-mode: multiply; }
.article-wrapper .section-shape-reversed { position: absolute; top: 0; right: 0; height: 100%; width: 60vw; mix-blend-mode: multiply; transform: scaleX(-1); }

.ekatalog .relative {  position: relative; min-height: 860px; }
.catalog-overlay { padding: 3rem 3rem 2rem 2rem; position: absolute; top: 1rem; left: 0; width: 100%; }
.catalog-overlay .catalog-info { position: relative; z-index: 9; }
.catalog-overlay svg { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; }
.ekatalog h4 { font-size: 48px; font-weight: 900; color: var(--common-colour); }
.ekatalog p { font-size: 24px; font-weight: 500; color: var(--common-colour); }

.product-category { position: relative; padding-top: 120px; padding-bottom: 120px; }
.product-category .subpage-image {}
.product-category .subpage-info {}
.product-category .subpage-info .subpage-title a { font-size: 49px; font-weight: 900; font-family: var(--primary-font); color: var(--common-colour); }
.product-category .subpage-info .subpage-content,
.product-category .subpage-info .subpage-content p { font-size: 24px; font-weight: 400; font-family: var(--primary-font); color: var(--common-colour); line-height: 42px; }
.product-category .section-shape { position: absolute; top: 0; left: 0; height: 100%; width: 60vw; mix-blend-mode: multiply; }
.product-category .section-shape-reversed { position: absolute; top: 0; right: 0; height: 100%; width: 60vw; mix-blend-mode: multiply; transform: scaleX(-1); }

.pageheader { position: relative; margin-bottom: 1rem; height: calc(100vh - 7rem); overflow: hidden; -webkit-clip-path: url(#clip-pageheader); clip-path: url(#clip-pageheader); }
.pageheader .overlay-text { position: absolute; z-index: 9; bottom: 3rem; left: 0; width: 100%; }
.pageheader .shade { position: absolute; z-index: 1; background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, .8)); -webkit-clip-path: url(#clip-pageheader); clip-path: url(#clip-pageheader); }
.pageheader img.pageheader-bg { object-fit: cover; width: 100%; height: 100%; }
.pageheader .pageheader-img img { max-height: 40vh;}
.pageheader h1 { font-size: 60px; color: var(--common-colour); margin-top: 30px; font-weight: 900;  text-align: center; }

.pageheader.product .pageheader-img { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.pageheader.product .pageheader-img img { max-height: 60vh;  }
.pageheader.product .pageheader-img img:hover { animation-name: swing; animation-duration: 1s; }
.pageheader.product .overlay-text { position: absolute; z-index: 9; top: 40%; left: 10%; width: auto; }
.pageheader.product .pageheader-bg { width: 100%; }
.pageheader.product h1 { max-width: 480px; text-align: center; }

.pageheader.default { height: 350px; position: relative; }
.pageheader.default h1 { margin-top: 0; }
.pageheader.default .overlay-text {  bottom: 20%; }


/* .trending-slider .owl-nav { position: absolute; left: 50%; bottom: 50px; margin-left: 15px; }
button.owl-next:before { background-color: var(--common-colour); }
button.owl-next:after { background-color: var(--common-colour); }
button.owl-prev:before { background-color: var(--common-colour); }
button.owl-prev:after { background-color: var(--common-colour); } */

.trending .item { padding-bottom: 15px; }

.breadcrumb a { text-decoration: none; }
.breadcrumb .active { color: var(--secondary-colour) }

.bannr-section { padding-top: 0; padding-bottom: 0; background-position: top center; position: relative; }
.bannr-section.overlay::before { display: block; position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); content: ""; }
.bannr-section .bannr-text { padding-top: 240px; padding-bottom: 90px; }
.bannr-text h1 { color: #fff; font-size: 46px; line-height: 46px; font-family: var(--secondary-font); padding-bottom: 15px; text-transform: capitalize; font-weight: 400; }

.product-image-wrapper .product-image { border: 1px solid #dfdfdf; }
.product-title h2 { color: var(--common-colour); font-family: var(--secondary-font); font-size: 32px; font-weight: 400; line-height: 32px; text-align: center; display: block; margin-bottom: 30px; }
.product h3 { position: relative; font-size: 20px; font-weight: 400; font-family: var(--secondary-font); color: var(--common-colour); margin-bottom: 20px; text-align: left; }
.product .widget p { margin-bottom: 0; }

.product-details-title h2 { color: var(--common-colour); font-size: 48px; font-weight: 900; text-align: left; display: block; margin-bottom: 30px; }
.product-contents .spot-text p { color: var(--common-colour); font-size: 26px; font-weight: 500; margin-bottom: 30px; }
.product-contents .typography p { color: var(--common-colour); font-size: 20px; font-weight: 400; }

.trending-carousel.listing.details .product-image { max-width: 90%; margin-bottom: 30px; }
.trending-carousel.listing.details .product-image .product-bottle img { max-width: 95%; }

.product .product-features { margin-bottom: 15px; }
.product .product-features .feature { background-color: rgba(236, 28, 36,0.2); display: flex; justify-content: center; align-items: center; border-radius: 10px; margin-bottom: 10px; padding: 8px 15px; }
.product .product-features .feature .feature-icon img { max-width: 60px; max-height: 80px; }
.product .product-features .feature .feature-text { padding-left: 0; text-align: center; }

.product .product-usage { margin-bottom: 15px; }
.product .product-usage .usage { position: relative; background-color: rgba(22, 124, 207, 0.2); display: flex; justify-content: flex-start; align-items: center; border-radius: 10px; margin-bottom: 10px; padding: 25px 15px; }
.product .product-usage .usage .usage-text { text-align: center; width: 100%; }

.product .product-warnings { margin-bottom: 0; }
.product .product-warnings .warnings { position: relative; background-color: rgba(255, 197, 60, 0.1); display: flex; justify-content: flex-start; align-items: center; border-radius: 10px; margin-bottom: 10px; padding: 25px 5px; }
.product .product-warnings .warnings::before { display: inline-block; position: absolute; content: "\f071"; font: var(--fa-font-solid); font-size: 80px; right: 20px; top: 20px; color: rgba(255, 197, 60, 0.8); }

.product .visual-key { padding-top: 50px; }

.product-order { margin-top: 40px; margin-bottom: 0px; }

.tab-style .nav-link { font-family: var(--secondary-font); font-weight: 400; transition: 0.2s ease all; border-bottom: 3px solid transparent; }

.tab-content .tab-pane h3 { font-size: 22px; line-height: 22px; font-family: var(--secondary-font); margin-bottom: 15px; background-color: var(--common-colour); color: #fff; padding: 7px 15px; }

.showcase-slider .owl-nav { position: absolute; top: 50%; margin-top: -44px; left: 0; margin-left: 0; right: auto; bottom: auto; width: 100%; }
.showcase-slider .owl-nav .owl-prev { position: absolute; left: 10px; right: auto; box-shadow: rgba(0, 0, 0, 0.24) 0px 0px 8px; background-color: #fff !important; border-color: transparent !important; text-align: center; }
.showcase-slider .owl-nav .owl-next { position: absolute; right: 10px; left: auto; box-shadow: rgba(0, 0, 0, 0.24) 0px 0px 8px; background-color: #fff !important; border-color: transparent !important; text-align: center }
.showcase-slider .owl-nav .owl-prev::before { background-color: var(--common-colour); display: none !important; }
.showcase-slider .owl-nav .owl-next::before { background-color: var(--common-colour); display: none !important; }
.showcase-slider .owl-nav .owl-prev::after { background-color: transparent; clip-path: none; font: var(--fa-font-solid); content: "\f060"; color: var(--common-colour); position: relative; top: auto; right: auto; left: auto; bottom: auto; }
.showcase-slider .owl-nav .owl-next::after { background-color: transparent; clip-path: none; font: var(--fa-font-solid); content: "\f061"; color: var(--common-colour); position: relative; top: auto; right: auto; left: auto; bottom: auto;  }

.page-content { padding-bottom: 30px; }

.box { background-color: #f5f5f5; text-align: center; padding: 20px 15px; }
.box .box-image img { max-height: 45px; }
.box h3 { font-size: 22px; font-weight: 400; font-family: var(--secondary-font); color: var(--common-colour); margin-bottom: 20px; margin-top: 20px; }
.box .fa { font-size: 12px; padding-right: 0 !important; }
.box .btn-small { padding: 5px 17px; font-size: 14px; background-color: var(--common-colour); color: #fff; font-family: var(--secondary-font); border-radius: 10px !important; }
.box .btn-small:hover { background-color: var(--theme-colour); color: #222; }
.box .btn-small:before { background-color: var(--theme-colour); }

.quality { padding: 60px 0; }
.heading-default { text-align: center; margin-bottom: 50px; margin-top: 50px; }
.heading-default.narrow {  margin-bottom: 30px; margin-top: 0; }
.heading-default h2 { font-family: var(--secondary-font); color: var(--common-colour); font-size: 36px; font-weight: 400; margin-bottom: 15px; }
.heading-default h3 { font-family: var(--secondary-font); color: var(--common-colour); font-size: 32px; font-weight: 400; margin-bottom: 15px; }
.heading-default img { max-height: 60px; padding-bottom: 10px; }
.heading-default p { margin: auto; }

.faq { margin-top: 60px; margin-bottom: 0; padding-bottom: 60px;  }
.faq-icon { max-height: 40px !important; }

.content p { font-size: 16px; font-weight: 400; color: #555; }
.accordion .accordion-item { box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 5px; }
.accordion-item .content { padding: 5px 28px 15px 28px; }
.accordion-item .title { border-bottom: 2px solid var(--theme-colour); text-transform: none; font-family: var(--secondary-font); font-weight: 600; color: #222; }

.contact-page .single-contact { border: 0; box-shadow: none !important; color: var(--common-colour); font-size: 24px; border-radius: 10px; padding: 20px 0; margin-bottom: 15px; display: flex; align-items: center; gap: 15px; position: relative; }
.contact-page .single-contact a {color: var(--common-colour); font-size: 24px;  }
.contact-page .single-contact .head { display: block; }

.heading-contact { text-align: center; margin-bottom: 30px; margin-top: 0; }
.heading-contact h3 { font-family: var(--secondary-font); color: var(--common-colour); font-size: 38px; font-weight:  700; text-align: left; }

.form-grp { margin-bottom: 15px; }

.contact-frm .form-control { box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 20px -10px; }
.map iframe { box-shadow: rgba(0, 0, 0, 0.2) 0px 18px 50px 0px; }
.map { margin-top: 0; }

#popupModal .modal-body { padding: 0; }
#popupModal .modal-footer { justify-content: center; }
#popupModal .modal-title { font-weight: 700; font-family: var(--secondary-font); color: var(--common-colour); }

.form-check-label a { font-weight: 700; }
.btn.disabled { background-color: #666; }

.opacity-mask { height: 100%; }
.banner .banner-text h3 { font-size: 36px; font-family: var(--secondary-font); color: #fff; margin-bottom: 20px; font-weight: 700; text-shadow: 1px 2px #444; }
.banner .banner-text p { font-size: 20px; font-family: var(--secondary-font); color: #fff; font-weight: 400; text-shadow: 1px 1px #444; }

.differnce-products { background-color: #fff; border: 3px solid var(--common-colour); border-bottom-right-radius: 30px; }
.values .item { padding: 30px; }
.values .item .image { padding: 15px; background-color: var(--common-colour); border-radius: 100%; }
.values .item h4 { font-size: 18px; font-family: var(--secondary-font); font-weight: 700; color: var(--common-colour); margin-bottom: 15px; }
.values .item p { font-size: 15px; font-family: var(--secondary-font); font-weight: 400; color: var(--common-colour); width: 100% !important;  }
.values .item .item-wrapper { padding-left: 30px;  }

.product-order .btn { display: block; }

.page-link { color: var(--common-colour); }
.page-link:hover, .page-link:focus, .page-link:active { color: var(--common-colour); }
.active>.page-link, .page-link.active { background-color: var(--common-colour); border-color: var(--common-colour); }
.pagination { margin-left: 0; }

.language-bar li:first-child { margin-left: 15px; }
.language-bar li a { font-family: var(--secondary-font); font-weight: 400; font-size: 15px; }
.language-bar li.active a { color: var(--theme-colour); }

.gallery-area { position: relative; }
.gallery-area .item { padding: 20px 35px; }
.product.gallery { position: relative; overflow: hidden; }
.product.gallery h2 { color: var(--common-colour); }
.product.gallery .section-shape {  position: absolute; top: 0; left: 0; height: calc(100% - 6.5rem); width: 100vw; mix-blend-mode: multiply; }
.product.gallery .gallery-area img:hover { animation-name: swing; animation-duration: 1s; } 


.ingredients { padding-top: 60px; padding-bottom: 140px;}
.ingredients h3 { color: var(--common-colour); font-size: 48px; font-weight: 900;  }
.ingredients .ingredients-details p { font-size: 20px; color: var(--common-colour); }

.variety { padding-top: 50px; padding-bottom: 140px; }
.variety .tab-content .tab-pane h3 { background-color: transparent; color: var(--common-colour); font-size: 32px; font-weight: 900; line-height: 32px; }
.variety ul.specification li { background-color: transparent; }
.variety ul.specification li h6 { background-color: transparent; border: none; font-size: 16px; color: var(--common-colour); }


/* rev */
#progress { display: none !important; }
#progress #progress-value { display: none !important; }
button.owl-next:before { display: none !important; }
button.owl-prev:before { display: none !important; }
button.owl-next:after { width: 20px; height: 20px; right: 3px; top: 11px; background-color: #fff; }
button.owl-prev:after { width: 18px; height: 18px; right: 18px; top: 12px; background-color: #fff; }
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev { background-color: var(--common-colour); border: 0 !important; }
.owl-carousel .owl-nav button.owl-next:hover, .owl-carousel .owl-nav button.owl-prev:hover { background-color: var(--secondary-colour) !important; }

.fancy-image { display: block; transition: 1s ease all; }
.fancy-image:hover { cursor: pointer; }

.nav-pills .nav-link { color: #222; font-weight: 400; font-size: 18px; }
.nav-pills .nav-link.active { font-weight: 400; color: var(--common-colour); }
ul.specification li { font-size: 16px; font-weight: 400; }
ul.specification li h6 { border: 1px solid #f5f5f5; padding: 10px 20px; font-size: 16px; font-weight: 700; }

.mobile-nav > ul > li:not(:last-child) { border-bottom: 1px solid #dedede; }

.typography table { width: 100%; max-width: 100%; font-size: 14px; margin-bottom: 1rem; background-color: transparent; border-collapse: collapse; display: table; box-sizing: border-box; text-indent: initial; unicode-bidi: isolate; border-spacing: 2px; border-color: gray; }
.typography table thead { background-color: var(--common-colour); color: #fff; }
.typography table thead p { color: #fff; }
.typography table p { margin-bottom: 0; font-size: 15px;  }
.typography table td, .typography .table th { padding: .3rem; vertical-align: top; border-top: 1px solid #f5f5f5;  }
.typography table tbody tr:nth-of-type(odd) {  background-color: rgba(0, 0, 0, .05); }
.typography ul { margin-bottom: 15px; }
.typography ul li { font-weight: normal !important; position: relative; padding-left: 25px; margin-bottom: 8px; color: #555; margin-left: 20px; }
.typography ul li:last-child { margin-bottom: 0;}
.typography ul li:after { position: absolute; left: 0; top: 4px; font: var(--fa-font-solid); content: "\f061"; color: var(--common-colour);  }
.typography strong { font-weight: 700 !important; }
.typography p { margin-bottom: 15px; }
.typography .overflow-table { overflow-x: auto; }
.typography .overflow-table p { font-size: 15px; }
.typography h2,
.typography h3, 
.typography h4,
.typography h5,
.typography h6 { font-family: var(--secondary-font); color: var(--common-colour); font-weight: 700; margin-bottom: 15px; }
.typography h2 { font-size: 36px; }
.typography h3 { font-size: 32px; }
.typography h4 { font-size: 28px; }
.typography h5 { font-size: 24px; }
.typography h6 { font-size: 20px; }

.modal-body.typography table tr { background-color: #fff !important; }
.modal-body.typography table * { font-size: 13px; }

.nav-pills .nav-link { padding: 5px 10px; font-size: 14px; }

@media (min-width: 1200px) {
    .hero-section.three { min-height: 100vh; background-repeat: no-repeat; background-position: top center; background-size: cover; }
    header .socials { position: absolute; right: 0; }
header .language { font-size: 20px; color: #fff; margin-left: 30px; }
}

@media (min-width: 1600px) {
    .hero-section.three { padding-top: 18rem;}
}

@media (min-width: 2048px) {
    .hero-section.three { min-height: 100vh;  }
}

@media (max-width: 1200px) {
  .hero-section.three { min-height: 100vh; }
}

@media (max-width: 991px) {
    .product-title h2 { margin-top: 40px; }
    .cta-67472fd4336365ea920000a5 { height: 140px !important; }
    .hero-text { width: 100%; }
    .hero-section.three { padding-top: 150px; padding-bottom: 30px; min-height: 100vh; }
    header.two .bottom-bar { background-color: transparent; }
    .two-bar { justify-content: space-between; }
    .bannr-section .bannr-text { padding-top: 150px; }
    .hero-section-three .slider-hero .owl-dots { bottom: 10%; }
    .hero-section.three:before { opacity: 0; }
    .trending-slider .item { max-width: 636px; display: inline-block; }
    .trending-slider .owl-item { text-align: center; }
    .products-needs-text p { display: block !important; }
    .nav-pills .nav-link { font-size: 15px; font-weight: 500 !important; font-family: var(--primary-font); }

    .hero-section h2 { font-size: 50px; text-shadow: none; margin-bottom: 5px; }

    .slider-hero .product-layers img {
      position: absolute;
      bottom: 0;
      left: 0;
      max-width: 50%;
      height: auto;
    }

    .trending-carousel.listing.details .item { text-align: center; }

    .pageheader { height: calc(100vh - 15rem); }
    .pageheader .pageheader-img img { max-height: 300px; }
    .pageheader .overlay-text { bottom: 8rem; }
    .pageheader h1 { margin-top: 30px; font-size: 38px; }

    .pageheader.product .pageheader-bg { width: auto; }
    .pageheader.product .overlay-text { left: auto; width: 100%; top: 25% }
    .pageheader.product .pageheader-img { text-align: center; }
    .pageheader.product .pageheader-img img { max-width: 50%; }
    .pageheader.product h1 { font-size: 38px; }

    .pageheader.default h1 { margin-top: 0; font-size: 60px; }

    header .lang-bar { margin-top: 40px; border-top: 1px dashed #dedede; border-bottom: 1px dashed #dedede; text-align: center;  }
    header .language { font-size: 20px; color: var(--common-colour) !important; display: inline-block;  }


}

@media (max-width: 768px) {
    .btn { font-size: 16px; font-weight: 500; }
    .shop-header .btn { font-size: 14px; padding: 7px 10px; }
    .hero-section h2 { font-size: 30px; text-shadow: none; }
    .hero-text p { font-size: 18px; text-shadow: none; }

    .hero-section.three {min-height: 80vh; }
   
    .title-logo { height: 65px; }
    .claim-your { /*align-items: center;*/ }
    .claim-your .claim-your-text { width: 90%; align-items: center;  text-align: center; }
    .claim-your .claim-your-text p { text-align: center; }
    .claim-your::before { position: absolute; content: ""; width: 100%; height: 100%; top: 0; left: 0; background-color: #000; opacity: .6; }
    .provide-high-text { margin-top: 15px; }
    .heading.two h2 img { margin-bottom: 0; }
    .section-provide-high .heading.two h2 img { margin-bottom: 0 !important; }
    .products-needs-text h3 a { font-size: 28px; line-height: 28px; }
    .products-needs-text h3 { line-height: 28px; }
    .products-needs-text { width: 50%; top: 15px; left: 20px; }
    .products-needs .btn-outline { width: 200px; left: 3%; bottom: 7%; padding: 5px 10px; }
    .section-medicen-need .heading img { max-height: 40px; }
    .trending .heading img { max-height: 40px; }
    .section-medicen-need .heading.two h2 { font-size: 34px; }
    .section-medicen-need { background-position: 90% 50%; }
    .bannr-text h1 { font-size: 26px; line-height: 26px; }
    .product.gap { padding-top: 20px; }
    .typography table { width: 100%; overflow-x: hidden; overflow-y: hidden; }
    .product .visual-key { padding-top: 30px; }
    .visual-key .image { border-top-left-radius: 50%; border-top-right-radius: 100%; border-bottom-left-radius: 100%; border-bottom-right-radius: 50%; }
    .visual-key .image::after { left: 0; top: 0;}
    .visual-key .image::before { right: 0; bottom: 0;}
    .accordion-item .title { padding-right: 50px; }
    .cta-67472fd4336365ea920000a5 { height: 100px !important; }
    .cta-67472fd4336365ea920000a5 h3 { font-size: 36px !important; }
    .product .product-warnings .warnings::before { color: rgba(255, 197, 60, 0.3); }
    .products-needs-text p { display: none !important; }

    .ekatalog .relative {  position: relative; min-height: 660px; }

    .catalog-info p { font-size: 18px; }

    .article-wrapper { margin-bottom: 50px; }

    .footer-logo { text-align: center; }

    .widget-title ul.social-media { justify-content: center; }
    .widget-title p { width: 100%; }

    footer.three { padding-top: 120px; }

    .social-btn { margin-left: 100px; } 
    .social-btn img { max-width: 70%; }
    .bar-menu:hover { cursor: pointer; }

    .product-category {  padding-top: 80px; padding-bottom: 80px; }

    /*.pageheader { max-height: 70vw; }*/

    

    .product-gap { padding-top: 0; } 
    .trending-carousel.listing .product-image { margin-bottom: 0; }

    .variety .nav-pills .nav-link { font-size: 18px; padding: 7px 13px; }

}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 680px;
        margin-right: auto;
        margin-left: auto;
    }
}

@keyframes shadow-pulse{
    0% {
        box-shadow: 0 0 0 0px rgb(255 255 255);
    }
    20% {
        box-shadow: 0 0 0 0px rgb(255 255 255);
    }
    100% {
        box-shadow: 0 0 0 15px rgba(0, 0, 0, 0);
    }
}

@keyframes shadow-pulse-theme{
    0% {
        box-shadow: 0 0 0 0px var(--common-colour);
    }
    20% {
        box-shadow: 0 0 0 0px var(--common-colour);
    }
    100% {
        box-shadow: 0 0 0 15px rgba(0, 0, 0, 0);
    }
}

.bubbles { overflow: hidden; position: absolute; width: 100%; height: 765px; top: 0; left: 0; }

.bubble{
    position: absolute;
    bottom: 0;
    background-image: url(../images/bubble.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    border-radius: 50%;
    opacity: 0;
    animation: flying 10s infinite ease-in;
    z-index: 9999;
  }
  
  .bubble:nth-child(1){
    width: 40px;
    height: 40px;
    left: 10%;
    animation-duration: 8s;
  }
  
  .bubble:nth-child(2){
    width: 20px;
    height: 20px;
    left: 20%;
    animation-duration: 5s;
    animation-delay: 1s;
  }
  
  .bubble:nth-child(3){
    width: 50px;
    height: 50px;
    left: 35%;
    animation-duration: 10s;
    animation-delay: 2s;
  }
  
  .bubble:nth-child(4){
    width: 35px;
    height: 35px;
    left: 50%;
    animation-duration: 7s;
    animation-delay: 0s;
  }
  
  .bubble:nth-child(5){
    width: 35px;
    height: 35px;
    left: 55%;
    animation-duration: 6s;
    animation-delay: 1s;
  }
  
  .bubble:nth-child(6){
    width: 45px;
    height: 45px;
    left: 65%;
    animation-duration: 8s;
    animation-delay: 3s;
  }
  
  .bubble:nth-child(7){
    width: 25px;
    height: 25px;
    left: 75%;
    animation-duration: 7s;
    animation-delay: 2s;
  }
  
  .bubble:nth-child(8){
    width: 25px;
    height: 25px;
    left: 80%;
    animation-duration: 6s;
    animation-delay: 1s;
  }
  
  .bubble:nth-child(9){
    width: 15px;
    height: 15px;
    left: 70%;
    animation-duration: 9s;
    animation-delay: 0s;
  }
  
  .bubble:nth-child(10){
    width: 50px;
    height: 50px;
    left: 85%;
    animation-duration: 5s;
    animation-delay: 3s;
  }
  
  @keyframes flying {
    0%{
      bottom: -100px;
      transform: translateX(0);
      opacity: 0;
    }
    25% {
        opacity: 0.25;
    }
    50%{
      transform: translateX(100px);
      opacity: 0.50;
    }
    100%{
      bottom: 1080px;
      transform: translateX(-200px);
      opacity: 1;
    }
  }


@media (max-width: 1200px) {
    .gallery-area .item { max-width: 33.3333%; flex-basis: 31%; }
}
@media (max-width: 900px) {
    .gallery-area .item { max-width: 48%; flex-basis: 48%; }
}
@media (max-width: 600px) {
    .gallery-area .item { max-width: 100%; flex-basis: 100%; }
}