:root { --green006: #006937; --green8CC: #8CC648; --dark24: #242424; --whiteEBF: #EBF3EF; --whiteFFF: #FFFFFF; --grey6E6: #6E6E6E; --grey666: #666666; --linear-gradient-40deg-animate: 40deg, rgba(251, 193, 22, 1) 15%, rgba(30, 194, 74, 1) 50%, rgba(0, 105, 55, 1) 85%; } /*************************************************************/ /* General */ html, body{overflow-x:hidden; font-family:'Roboto', sans-serif;} *{padding:0;margin:0;} .custom-container {max-width: 90%; margin: 0 auto; overflow: hidden;} .nav-container {background: #F7F6F5; padding: 0 5.7%;} .icon-close {font-size: 25px; font-weight: 600; color: white; position: absolute; top: 6px; right: 50px; background: transparent; border: none; } .hidden-news {display: none!important;} .row {margin: 0;} /* color */ .hide-color {color: transparent!important;} .bg-dark24 {background: var(--dark24);} .bg-yellowFBA {background: #FBA716;} .bg-orangeF23 {background: #F2362F;} .bg-green095 {background: #095330;} .bg-green98D {background: #98DBA0;} .bg-blue70C {background: #70CDE6;} /* button */ .btn-transparent {border: 1px solid var(--whiteFFF); border-radius: 50px; font-size: 18px; font-weight: bold; line-height: 22px; color: var(--whiteFFF); padding: 15px 30px; text-transform: uppercase;} .btn-transparent:hover {border: 1px solid white; background: white; color: var(--green006);} .btn-green {background: var(--green006); border: 1px solid var(--green006); border-radius: 50px; font-size: 18px; font-weight: bold; line-height: 22px; color: var(--whiteFFF); padding: 15px 5rem; text-transform: uppercase;} .btn-green:hover {background: white; color: var(--green006);} .btn-white {background: var(--whiteFFF); border: 1px solid var(--green006); border-radius: 50px; font-size: 18px; font-weight: bold; line-height: 22px; color: var(--green006); padding: 15px 5rem; text-transform: uppercase;} .btn-white:hover {background: var(--green006); color: var(--whiteFFF);} .btn-cucumber {background: var(--whiteEBF); border: 1px solid var(--whiteEBF); border-radius: 50px; font-size: 18px; font-weight: bold; line-height: 22px; color: var(--green006); padding: 15px 5rem; text-transform: uppercase;} .btn-cucumber:hover {background: var(--whiteFFF); color: var(--green006); border: 1px solid var(--green006);} .btn-peach {background: #F6E9DE; border: 1px solid #F6E9DE; border-radius: 50px; font-size: 18px; font-weight: bold; line-height: 22px; color: #F2672F; padding: 15px 5rem; text-transform: uppercase;} .btn-peach:hover {background: #F2672F; color: var(--whiteFFF); border: 1px solid #F2672F;} .btn-grey {background: #e5e4e3; border: 1px solid #e5e4e3; border-radius: 50px; font-size: 18px; font-weight: bold; line-height: 22px; color: var(--grey666); padding: 15px 5rem; text-transform: uppercase;} .btn-grey:hover {background: var(--grey666); color: #e5e4e3; border: 1px solid var(--grey666);} /* Mouse Cursor */ .cursor-box {position: absolute; pointer-events: none;} .cursor-box:nth-child(1) {z-index: 99;} .cursor-box:nth-child(2) {z-index: 98;} .cursor-box:nth-child(3) {z-index: 97;} .cursor-box:nth-child(4) {z-index: 96;} .cursor-box:nth-child(5) {z-index: 95;} .cursor-box:nth-child(6) {z-index: 94;} /* Mouse Cursor Main Image */ .main-cursor {width: 50px; height: 50px; top: -22px; left: -22px; pointer-events: none; border-radius: 50%; transition-duration: 200ms; transition-timing-function: ease-out; background: url(../images/cursor/mouse_logo.svg); background-repeat: no-repeat; background-size:contain;} .main-cursor::after {width: 90px; height: 90px; position: absolute; top: -20px; left: -20px; border-radius: 50%; content: ""; background: url(../images/cursor/mouse_text_logo.svg); background-size: contain; background-repeat: no-repeat; opacity: 1; animation: cursorAnim2 5s infinite alternate;} @keyframes cursorAnim2 { from {transform: rotate(0deg);} to {transform: rotate(360deg);} } /* Mouse Cursor Particle Image */ .cursor-box img {transform: translate(-50%, -50%); object-fit: cover;} .cursor-box .cursor-image-2 {width: 40px; height: 40px;} .cursor-box .cursor-image-3 {width: 35px; height: 35px;} .cursor-box .cursor-image-4 {width: 30px; height: 30px;} .cursor-box .cursor-image-5 {width: 25px; height: 25px;} .cursor-box .cursor-image-6 {width: 20px; height: 20px;} /* Header Desktop */ .ltr .header-search .header-search-lg .search-input {background: none; border-radius: unset; height: 52px;} .ltr .header-search .header-search-lg .btn-search, .ltr .header-column-right .header-column-right-item {margin-right: 10px;} .header-search .header-search-lg {background: white; border-radius: 50px; width: 60%; margin: 0 auto;} .header-search .header-search-lg .btn-search {background: #EBF3EF; color: var(--green006); height: 35px; width: 35px; border-radius: 50px;} .header-search-select span.current {font-weight: bold; line-height: 12px; color: var(--dark24);} .header-search .header-search-lg .btn-search>i {font-size: 25px;} .header-login {margin-right: 0;} .header-column-right .header-column-right-item>span {color: var(--grey666); font-size: 14px; font-weight: 400; line-height: 17px; margin-right: 10px;} .header-wrap-inner.sticky {padding: 10px 0;} .header-search .nice-select .list {display: none;} /* Footer */ footer {background: var(--green006); color: white;} .footer-line-image {width: 100.1%}; /* footer - 5 icon list & line image */ .features-wrap {background: #F7F6F5; margin-top: 5%; padding: 30px 0;} .features-wrap:hover {background: #D9D9D9; transition: all 0.5s;} .features-wrap .features {padding: 15px 0; border: unset; border-radius: unset;} .features-wrap .single-feature {margin-top: unset;} .features-wrap .single-feature:after {background: unset;} .single-feature {align-items: center;} .feature-details h6 {font-size: 16px; font-weight: bold; line-height: 19px; word-break: break-word; color: var(--green006);} /* footer - left part */ .footer-top .row {justify-content: center;} .footer-top .title {margin: 25px 0; font-size: 16px; font-weight: bold; line-height: 19px; color: white; text-transform: uppercase;} .footer-text-wrap p {font-size: 12px; font-weight: 400; line-height: 18px; color: var(--whiteFFF); margin-bottom: 3rem; padding-right: 30px;} .ltr .footer-top .social-links {margin: 0 auto;} footer .social-links li a {font-size: 40px; color: white;} /* footer - middle product */ .footer-middle {text-align: center; padding: 30px 0;} .footer-links:not(.footer-tags) .list-inline li a {color: unset;} /* footer - circle arrow button */ .footer-btn-arrow {border-radius: 50px; border: none; width: 60px; height: 60px; display: inline-block; background: #0000004f; padding: 15px; transition: all 0.5s} .footer-btn-arrow:hover {background: black;} .footer-btn-arrow i {font-size: 25px; color: white;} /* footer - part right info */ .footer .footer-logo {padding: 10px;} .footer-info p, .footer-info a {font-size: 12px; font-weight: 400; line-height: 30px; color: var(--whiteFFF);} .footer-payment {display: unset;} .footer-payment .title {margin-bottom: 15px;} .footer-payment>img {max-height: 100px;} /* footer - bottem copyright */ .footer-bottom {margin-top: unset; padding: 30px 0; border-top: 1px solid var(--whiteFFF);} .footer-text {font-size: 12px; font-weight: 400; line-height: 14px; color: unset; width: 100%; text-align: center;} .footer-text-wrap p, .footer-links:not(.footer-tags) .list-inline li a, .footer-info p, .footer-info a, .footer-bottom {opacity: 0.6;} /* Mobile Nav Footer */ .mobile-nav-footer {display: none;} .mobile-nav-footer {position: fixed; bottom: 0; width: 100%;} .mobile-nav-footer ul {display: flex; align-items: center; background: white; text-align: center;} .mobile-nav-footer li {position: relative; width: 20%; border: 1px solid #D8D8D8; transition: all 0.5s;} .mobile-nav-footer li:hover {background: var(--green006); border: 1px solid var(--green006);} .mobile-nav-footer li:hover i {color: white;} .mobile-nav-footer li:hover p {color: white;} .mobile-nav-footer a {width: 100%; display: block; padding: 15px;} .mobile-nav-footer i {font-size: 40px; color: grey;} .mobile-nav-footer p {font-size: 16px; font-weight: bold; line-height: 20px; color: grey; padding: 5px 0;} .mobile-nav-footer .count {position: absolute; top: 1.2rem; right: 2.8rem; background: #8CC648; width: 25px; height: 25px; border-radius: 50px; text-align: center; font-size: 12px; font-weight: 400; color: white; display: flex; align-items: center; justify-content: center;} /* Product Card */ .product-badge .badge {border-radius: 50px; padding: 5px 15px;} .product-badge .badge.badge-danger {background: var(--grey6E6);} .product-card {margin: 10px; background: var(--whiteFFF); border: 1px solid #D9D9D9;} .product-card .product-image .image-placeholder {width: 100%; height: auto; object-fit: scale-down;} .product-card .product-card-actions .btn {height: 50px; width: 50px; border-radius: 50px;} .product-card .product-card-actions .btn>i {font-size: 30px; color: var(--green006);} .product-card .product-card-actions .btn-compare, .product-card .product-rating {display: none;} .product-card .product-card-middle {width: 280px;} .product-card .product-name h6 {font-size: 18px; font-weight: 500; color: var(--dark24);} .product-price {font-size: 20px; font-weight: bold; color: var(--green006);} .product-card .btn-add-to-cart {background: rgb(251, 193, 22); background: linear-gradient(var(--linear-gradient-40deg-animate)); border-radius: 50px; font-size: 15px; bottom: 15px; padding: 10px 0 10px;} .product-card .btn-add-to-cart:hover {background: linear-gradient(var(--linear-gradient-40deg-animate)); background-size: 600%; -webkit-animation: gradient_anime 16s linear infinite; animation: gradient_anime 16s linear infinite;} .product-card .product-card-bottom {padding: 15px;} .list-view-products .btn-add-to-cart {background: rgb(251, 193, 22); background: linear-gradient(var(--linear-gradient-40deg-animate)); border-radius: 50px; font-size: 15px; padding: 10px 20px;} .list-view-products .btn-add-to-cart:hover {background: linear-gradient(var(--linear-gradient-40deg-animate)); background-size: 600%; -webkit-animation: gradient_anime 16s linear infinite; animation: gradient_anime 16s linear infinite;} .list-product-card-inner .product-card-actions {float: right;} .ltr .list-product-card-inner .product-card-actions .btn-wishlist {margin-right: 0;} .list-view-products .product-card-actions .btn {height: 50px; width: 50px; border-radius: 50px;} .list-view-products .product-card-actions .btn>i {font-size: 30px; color: var(--green006);} /* divide price */ .divided-price-wrap {display: inline-flex; justify-content: space-between; align-items: flex-start; width: 100%;} .divided-price { padding: 4px 5px;} .atome-image {background: url(../images/atome.png); background-position: center; background-size: contain; background-repeat: no-repeat; width: 100px; height: 30px;} /* pagination product */ #pagination-controls{text-align: right; padding: 10px;} .pagination-button {margin: 5px; padding: 5px 10px; background-color: var(--green006); color: white; border: none; border-radius: 8px; cursor: pointer;} .pagination-button:hover {background-color: var(--green8CC);} /* Slider */ .slick-dots {bottom: -30px;} .slick-dots li button:before {background: var(--green006);} /* side left nav */ .sidebar-menu-wrap .sidebar-menu-header {background: var(--green006);} /* Form & Referrel Link & Review Form */ form .form-control, .referral-link .form-control {font-size: 16px; line-height: 23px; color: var(--dark24); background: #F7F6F5; border-color: #D9D9D9; border-radius: 10px; height: 60px; padding: 10px 30px;} form .form-control::placeholder, .referral-link .form-control::placeholder {color: #9B9B9B;} form .form-control:focus, .referral-link .form-control:focus {border-color: var(--green006);} .referral-link {width: 100%; display: flex; align-items: center; border-radius: unset; padding: 35px 30px 40px;} .referral-link #copy_text_id {width: 60%; border-radius: unset; -webkit-border-top-left-radius: 50px; -webkit-border-bottom-left-radius: 50px; -moz-border-radius-topleft: 50px; -moz-border-radius-bottomleft: 50px; border-top-left-radius: 50px; border-bottom-left-radius: 50px;} .referral-link .btn-green {width: 40%; padding: 18px 5rem; border-radius: unset; -webkit-border-top-right-radius: 50px; -webkit-border-bottom-right-radius: 50px; -moz-border-radius-topright: 50px; -moz-border-radius-bottomright: 50px; border-top-right-radius: 50px; border-bottom-right-radius: 50px;} #reviews form .form-control {height: unset;} /* Form - Mark True */ .ltr .form-check input[type=checkbox]:checked+label, .ltr .form-check input[type=checkbox]:not(:checked)+label {padding-left: 35px;} .form-check input[type=checkbox]:checked+label:before, .form-check input[type=checkbox]:not(:checked)+label:before {top: 0px; width: 23px; height: 23px; background: white;} .form-check input[type=checkbox]:checked+label:after, .form-check input[type=checkbox]:not(:checked)+label:after {height: 7px; width: 15px;} .form-check-label>a {color: var(--green006);} /* Top Nav - Gradient Row */ .gradient-wrap, .gradient-row {text-align: center; width: 100%; height: 50px; border: none; border-radius: unset; background: linear-gradient(var(--linear-gradient-40deg-animate)); background-size: 600%; -webkit-animation: gradient_anime 16s linear infinite; animation: gradient_anime 16s linear infinite;} .gradient-row {position: absolute; margin-top: -70px; z-index: -1; filter: blur(30px); opacity: 0.8;} .gradient-text {font-size: 14px; font-weight: 400; line-height: 14px; color: white; padding: 18px;} @-webkit-keyframes gradient_anime { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } /* Top Nav - Text */ .top-nav-wrap {background: #F7F6F5; border-bottom: unset;} .top-nav {padding: 20px 15px;} @keyframes gradient_anime { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } /* alert */ .ltr .alert {position: absolute; top: 10rem; bottom: unset; z-index: 999;} .custom-empty-message {text-align: center; padding: 30px;} .custom-empty-message i {font-size: 50px;} /* all section margin default */ #section_slide_ads, #section_monthly_promotion, .five-product-list, #section_embrace, #section_related_product, #section_product_bottom_part {margin: 5rem auto;} /*********************************************************/ /* ----- Login Page ----- */ .form-wrap {margin-top: unset; padding: unset;} #section_login img {width: 100%;} #section_login h2 {font-size: 30px; line-height: 36px; color: var(--dark24); text-align: left;} #section_login ul {display: flex; align-items: center; align-content: center; width: 100%; padding-top: 30px;} #section_login li {padding-right: 15px;} .login-banner-short {display: block; padding: 0;} .login-banner-long {display: none; padding: 0;} /* ----- Register Page ----- */ #section_register {margin-top: 3rem;} #section_register .form-wrap-inner {width: 60%;} #section_register h2 {font-size: 45px; line-height: 54px; color: var(--dark24);} #section_register p {background: #EBF3EF; width: 100%; text-align: center; padding: 20px; border-radius: 10px; font-size: 20px; line-height: 22px; color: var(--green006);} #section_register ul {display: flex; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center;} #section_register li {width: 50%;} #section_register li:nth-child(1), #section_register li:nth-child(3), #section_register li:nth-child(5), #section_register li:nth-child(7) {padding-right: .5rem;} #section_register li:nth-child(2), #section_register li:nth-child(4), #section_register li:nth-child(6), #section_register li:nth-child(8) {padding-left: .5rem;} #section_register button {display: block; margin: 3rem auto;} #section_register .form-wrap-inner .have-an-account {margin: 3rem auto; font-size: 20px; font-weight: 500; line-height: 22px; color: var(--dark24);} /* ----- Forgot Password Page ----- */ .custom-forgot-body {margin: 5rem auto;} .custom-forgot-body > h2 {margin-bottom: 15px;} .custom-forgot-body > p {text-align: center;} .custom-forgot-body button {background: var(--green006);} /* ----- Home Page ----- */ /* Category Nav */ .navigation-inner {border: none; justify-content: center;} .horizontal-megamenu>.nav-item>.nav-link {font-size: 14px; font-weight: bold; line-height: 17px; color: var(--dark24);} .horizontal-megamenu>.nav-item>.nav-link:hover {font-weight: bold;} /* One Banner */ .home-banner .container {padding-left: 0; padding-right: 0;} .home-banner .container .banner {border-radius: unset;} /* Section Best Seller */ #section_best_selling {margin-top: 5%;} /* Best Seller - title, image, link */ .head-content-wrap {display: flex; align-items: center; margin: 2% auto; position: relative;} .head-content-wrap .side-icon img {width: 70px; height: 70px;} .head-content-wrap .side-title {padding: 0 30px; width: 80%;} .head-content-wrap .side-title h2 {font-size: 50px; font-weight: 500; line-height: 60px; color: var(--dark24);} .head-content-wrap .side-link {position: absolute; right: 0;} .head-content-wrap .side-link a, .head-content-wrap .side-link i {font-size: 14px; font-weight: bold; line-height: 17px; color: var(--dark24);} .head-content-wrap .side-link a:hover, .head-content-wrap .side-link a:hover>i {color: var(--green006);} /* Best Seller - Product */ #section_best_selling_product .featured-categories-wrap .featured-categories-header {display: none;} #section_best_selling_product .featured-categories-wrap { margin-top: unset;} #section_best_selling_product .featured-categories-wrap .container {max-width: 90%; margin: 0 auto; padding-left: 0; padding-right: 0;} #section_best_selling_product .slick-dots li button:before {background: var(--green006);} /* Section Monthly Promotion */ #section_monthly_promotion {background: #EBF3EF; padding: 50px 0 100px 0;} #section_monthly_promotion .body-content-wrap {display: grid; grid-template-columns: auto auto auto auto;} #section_monthly_promotion .body-content-wrap .product-card {margin: 0 20px 20px 0;} #section_monthly_promotion .body-content-wrap .product-card .product-image {padding-bottom: 70%;} /* Section Slide Ads */ #section_slide_ads .slick-dotted.slick-slider {margin-bottom: 30px;} /* Section Five Product */ .five-product-list ul {display: flex;} .five-product-list li {padding: 50px; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center; align-content: center; width: 20%;} .five-product-list h2 {font-size: 30px; font-weight: 500; line-height: 36px; color: white;} .five-product-list img {padding: 30px 0; max-height: 300px;} .tab-products-header {display: none;} /* Section Embrace - left part */ #section_embrace .content-wrap {display: flex; flex-direction: column; flex-wrap: wrap; align-items: flex-start; align-content: center; justify-content: center; min-height: 500px;} #section_embrace .text-wrap {margin: 2rem auto;} #section_embrace .text-wrap h2 {font-size: 30px; font-weight: bold; line-height: 30px; color: var(--whiteFFF);} #section_embrace .text-wrap p {font-size: 14px; font-weight: 400; line-height: 20px; color: var(--whiteFFF); opacity: 0.6; margin: 1rem auto 3rem auto;} /* Section Embrace - right part */ #section_embrace .col-lg-9:nth-child(2):hover:before {animation: effect-height .7s ease-in; animation-fill-mode: forwards} #section_embrace .col-lg-9:nth-child(2):hover:after {animation: effect-width .7s ease-in; animation-fill-mode: forwards} #section_embrace .col-lg-9:nth-child(2):hover>img {transform: scale(1.02); border-radius: 10px;} #section_embrace .col-lg-9:nth-child(2)>img {width: 100%; transform: scale(1); transition: .8s ease;} /* Section Health Tips */ #section_health_tips {height: 800px;} #section_health_tips .head-content-wrap {margin: 2% auto 4% auto;} #section_health_tips .side-title p {font-size: 16px; font-weight: 400; line-height: 25px; color: #757575;} /* Health Tips - text wrap */ #section_health_tips .text-wrap {margin-top: 2rem;} #section_health_tips .text-wrap span {font-size: 12px; font-weight: 400; font-style: italic; line-height: 20px; color: var(--grey666);} #section_health_tips .text-wrap h5 {font-weight: 500; line-height: 22px; color: var(--dark24); margin: 10px auto;} #section_health_tips .text-wrap p {font-size: 14px; font-weight: 400; line-height: 20px; color: var(--grey666); padding-right: 5rem;} /* Health Tips - news wrap */ #section_health_tips .news-content-wrap {display: flex;} #section_health_tips .news-content-wrap .part-left, #section_health_tips .news-content-wrap .part-right .article-wrap {width: 50%; margin: 0 5px;} #section_health_tips .news-content-wrap .part-right {display: flex; width: 50%;} /* Health Tips - article */ #section_health_tips .article-card img {width: 100%;} #section_health_tips .article-card {position: relative; transition: transform 0.3s ease;} #section_health_tips .article-card:hover {transform: translateY(-10px);} #section_health_tips .article-card:hover .text-wrap a {display: block;} #section_health_tips .text-wrap a {display: none; background: rgb(251, 193, 22); background: linear-gradient(var(--linear-gradient-40deg-animate)); border-radius: 50px; font-size: 16px; font-weight: bold; line-height: 19px; color: white; text-align: center; margin-top: 5%; padding: 15px; width: 50%;} #section_health_tips .text-wrap a:hover {background: linear-gradient(var(--linear-gradient-40deg-animate)); background-size: 600%; -webkit-animation: gradient_anime 16s linear infinite; animation: gradient_anime 16s linear infinite;} /* Health Tips - article details */ .article-banner-video-wrap {margin-bottom: 5%;} .article-banner-video-wrap>img {width: 100%;} /* ----- Products Page ----- */ .product-search-wrap {margin-top: unset;} .product-search-right {padding: 0 20px;} /* Banner Top */ .banner-desktop>img, .banner-mobile>img {width: 100%;} .banner-mobile {display: none;} /* Ads */ .product-search-right #section_slide_ads {margin: unset; margin-bottom: 5%;} #section_slide_ads a img {width: 100%;} /* Side Nav */ .ltr .product-search-left {margin: -5px 30px 0 0;} .section-title:after {border-bottom: 3px solid #0068e1; border-bottom: 3px solid var(--green006);} .side-filter-prize-wrap .filter-price {padding: 10px;} .side-filter-prize-wrap .filter-price .price-input .form-control {background: #F7F6F5; border: none; border-radius: 50px; line-height: 20px; color: #9B9B9B;} .side-filter-prize-wrap h4 {font-weight: bold; line-height: 24px; color: var(--dark24); padding-top: 5px;} .side-filter-prize-wrap .browse-categories li a {font-size: 16px; font-weight: 400; line-height: 25px; color: var(--grey666);} .side-filter-prize-wrap .browse-categories li a:hover { color: var(--color-primary);} .side-filter-prize-wrap .browse-categories li.active>a {color: var(--green006);} .side-filter-prize-wrap h6 {font-weight: bold; line-height: 20px; color: var(--dark24);} /* Product Grid Nav */ .grid-content-wrap .content-left h4 {font-size: 30px; font-weight: 500; line-height: 36px; color: var(--dark24);} .grid-content-wrap .nice-select.form-control {background-color: #F7F6F5; border: 1px solid #D9D9D9; border-radius: 50px; font-size: 12px; color: #757575; width: 100%; height: 35px; padding: 6px 50px 6px 20px;} /* ----- Categories Product Page ----- */ .categories-banner {transition: .8s ease; margin-bottom: 5%;} .categories-banner>img {width: 100%;} .categories-banner-mobile {display: none!important;} /* ----- Product Details Page ----- */ #section_related_product h1, #section_review_product h1 {font-size: 40px; line-height: 48px; color: var(--dark24); margin: 2rem auto;} /* Product Details - Left Part Gallery & Slide */ .ltr .gallery-thumbnail-slide.slick-slide {float: unset;} .ltr .slick-list .slick-track {float: unset; margin: unset;} .product-gallery-thumbnail {float: left; width: 15%;} .product-gallery-preview-wrap {float: left; width: 85%;} .product-gallery-thumbnail .gallery-thumbnail-item {margin: 0 10px 10px 0; padding-bottom: 0%; width: 70px; height: 70px;} /* Product Details - Right Part Content */ #section_product_content .details-info-middle .divided-price-wrap {padding-bottom: 20px; justify-content: unset;} /* text */ #section_product_content h1 {font-size: 40px; line-height: 48px; color: var(--dark24);} #section_product_content p {font-size: 14px; font-weight: 400; line-height: 17px; color: var(--grey666);} #section_product_content p a {color: var(--green006);} #section_product_content h5, #section_product_content form label, #section_product_content .social-share label {font-size: 16px; font-weight: bold; line-height: 19px; color: var(--dark24);} #section_product_content form .form-radio label {font-size: 14px; font-weight: 400; line-height: 23px; color: var(--grey666);} #section_product_content h5 {padding-bottom: 10px;} /* social share */ .product-details-info .social-share {display: unset;} .product-details-info .social-share label {margin: 10px 0;} .ltr .product-details-info .social-share .social-links {margin: 0;} .ltr .social-links li {margin-right: 15px;} #section_product_content .social-links i {font-size: 40px; color: var(--green006);} #section_product_content .social-links i:hover {color: var(--green8CC);} /* quantity, add, wishlist */ #section_product_content .number-picker-lg {display: block;} #section_product_content .info-group-quantity {margin: 20px 0;} #section_product_content .input-group-quantity input, #section_product_content .input-group-quantity .btn-wrapper button {border-radius: unset!important;} .ltr .product-details-info .number-picker-lg .input-group-quantity {margin-left: unset!important;} .details-info-middle-actions .btn-wrap button {margin: 0 20px;} .details-info-middle-actions .btn-wrap a {padding: 15px 4rem;} .details-info-middle-actions .btn-wrap button, .details-info-middle-actions .btn-wrap a {text-transform: uppercase;} .details-info-middle-actions .btn-wrap button i, .details-info-middle-actions .btn-wrap a i{margin-right: 10px;} /* Product Details - Bottom Part*/ /* Might Like */ #section_product_bottom_part .vertical-products-slider .product-rating {display: none;} #section_product_bottom_part .vertical-products-slider .product-image {margin: 0;} #section_product_bottom_part .vertical-products-slider .product-info {display: flex; justify-content: center; flex-direction: column;} #section_product_bottom_part .vertical-products-slider .product-info h6 {font-size: 16px;font-weight: 500; line-height: 19px; color: var(--dark24);} #section_product_bottom_part .vertical-products-slider .product-price {font-size: 14px; line-height: 17px;} #section_product_bottom_part h4, .product-details-tab > .tabs .nav-link {font-size: 20px; font-weight: bold; line-height: 24px; color: var(--dark24);} .tabs:not(.featured-categories-tabs) .tab-item:before, .nav-tabs .nav-link:before, .tabs:not(.featured-categories-tabs) .tab-item:after, .nav-tabs .nav-link:after {background: var(--green006);} /* Content Editor - Description */ #section_product_bottom_part .product-details-tab > .tabs, #section_product_bottom_part #description {width: 85%; margin: 0 auto;} #section_product_bottom_part #reviews {width: 30%; margin: 0 auto;} .review-form .btn-submit {padding: 15px 5rem;} .tab-description-left-content, .tab-description-right-content {margin-top: 2rem;} .tab-description-left-content h5 {font-size: 16px; font-weight: bold; line-height: 28px; color: var(--grey666); margin: 0;} .tab-description-left-content p {font-size: 16px; font-weight: 400; line-height: 28px; color: var(--grey666);} .tab-description-right-content h5 {font-size: 18px; font-weight: bold; line-height: 23px; color: var(--grey666); margin: 1rem 0;} .tab-description-right-content table {border-collapse: collapse; width: 100%; } .tab-description-right-content td, .tab-description-right-content th {border: 1px solid #D1D1D1; text-align: left; padding: 10px; width: 50%; font-size: 16px; font-weight: 400; line-height: 20px; color: var(--grey666);} .tab-description-right-content tr:nth-child(odd) {background-color: #EAEAEA;} /* Product Details - Custom Bottom Part*/ /* Review Content */ .user-review:nth-child(n+5) {display: block!important;} #section_review_product {background: #EBF3EE; height: 600px; padding: 30px 0;} .review-card {position: relative; display: flex; height: auto; margin: 0 10px; padding: 20px; flex-direction: column; overflow: hidden; background: var(--whiteFFF); border: 1px solid #D9D9D9; border-radius: 8px; transition: 200ms ease-in-out; word-break: break-word;} .review-message {height: auto; min-height: 200px; font-size: 16px; font-weight: 400; line-height: 25px; color: var(--dark24);} .review-profile {display: flex; align-items: center;} .review-name {font-size: 16px; line-height: 19px; color: var(--dark24);} .review-age {font-size: 12px; font-weight: 400; line-height: 14px; color: var(--grey666);} .review-verify span {font-size: 12px; font-weight: bold; line-height: 14px; color: var(--green006); display: flex; align-items: center; justify-content: flex-end;} .review-verify span i {font-size: 25px; padding-right: 5px;} /* ----- Account - Dashboard Page ----- */ /* Card */ .dashboard-card-2 {margin: 1.5rem 0 3rem 0;} .dashboard-card-1 ul, .dashboard-card-2 ul {display: flex; align-items: center;} .dashboard-card-1 li, .dashboard-card-2 li {display: flex; align-items: center; justify-content: space-between; padding: 20px; background: #EBF3EF; border: 1px solid #EBF3EF; border-radius: 10px; width: 100%; min-height: 180px;} .dashboard-card-1 li:nth-child(2) {margin: 0 20px;} .dashboard-card-2 li:nth-child(2) {margin-left: 20px;} .dashboard-card-1 li:hover, .dashboard-card-2 li:hover {background: #25A267; color: var(--whiteFFF);} .dashboard-card-1 li:hover > .text-wrap p, .dashboard-card-1 li:hover > .text-wrap h1, .dashboard-card-2 li:hover > .text-wrap p, .dashboard-card-2 li:hover > .text-wrap h1 {color: var(--whiteFFF);} .dashboard-card-1 .text-wrap, .dashboard-card-2 .text-wrap {padding: 0 30px;} .dashboard-card-1 .text-wrap p, .dashboard-card-2 .text-wrap p {font-size: 16px; font-weight: 500; line-height: 20px; color: var(--dark24); margin: 5px 0;} .dashboard-card-1 .text-wrap h1, .dashboard-card-2 .text-wrap h1 {font-size: 50px; font-weight: bold; font-style: italic; line-height: 50px; color: var(--green006);} .dashboard-card-1 i, .dashboard-card-2 i {font-size: 100px; color: #B7DABB;} .dashboard-card-1 .i-wrap, .dashboard-card-2 .i-wrap {padding-right: 20px;} /* Custom Panel Body - table */ .custom-panel-body table tbody tr:hover {background: #F7F6F5;} .custom-panel-body table th {font-size: 14px; font-weight: bold; line-height: 20px; color: var(--dark24); text-transform: uppercase;} .custom-panel-body table td, .custom-panel-body td .product-price {font-size: 14px; font-weight: 400; line-height: 20px; color: var(--grey666);} .my-orders-table tbody td:first-child {font-weight: 400;} .my-orders-table tbody td:nth-child(4) {font-weight: bold;} .custom-panel-body table .btn-cucumber {font-size: 14px; line-height: 20px; padding: 10px 30px; min-width: 150px; text-align: center;} .custom-panel-body ul.list-inline {display: flex; align-items: center; flex-wrap: wrap; width: 50%;} .custom-panel-body .user-info li {font-size: 20px; font-weight: 500; line-height: 20px; color: var(--grey666); align-items: center; width: 50%; padding: 10px 3rem 10px 0;} .custom-panel-body .user-info i {font-size: 30px; color: var(--grey666);} .ltr .custom-panel-body .user-info li > i {margin-right: 15px;} .custom-panel-body .btn-grey {font-size: 14px; line-height: 20px; padding: 10px 30px; min-width: 150px; text-align: center;} /* Custom Panel Body - address */ .custom-panel-body .address-card-wrap .address-card {border-radius: unset; padding: 20px 30px;} .custom-panel-body .address-card-wrap .address-card.active {border: 2px solid var(--green006);} .ltr .custom-panel-body .address-card-wrap .address-card .badge {top: 25px; right: 35px; background: var(--green006); padding: 5px 10px;} .custom-panel-body .address-card-wrap .address-card .address-card-data {margin: 10px 0;} .custom-panel-body .address-card-wrap .address-card .address-card-data h4 {font-weight: bold; line-height: 20px; color: var(--dark24);} .custom-panel-body .address-card-wrap .address-card .address-card-data span {font-size: 16px; line-height: 25px; color: var(--grey666);} .custom-panel-body .my-addresses .address-card-wrap .address-card-actions .btn {font-size: 14px; font-weight: bold; line-height: 35px; color: var(--green006); padding: 0 10px;} .custom-panel-body .my-addresses .address-card-wrap .address-card-actions .btn:nth-child(2) {color: var(--grey666);} .custom-panel-body .my-addresses .address-card-wrap .address-card-actions .btn:hover, .custom-panel-body .my-addresses .address-card-wrap .address-card-actions .btn:nth-child(2):hover {color: var(--color-primary);} .custom-panel-body .my-addresses form span {margin-bottom: 2rem; width: 100%; display: block; font-size: 16px; font-weight: 400; font-style: italic; line-height: 23px; color: var(--grey666);} .ltr .custom-panel-body .arrow-black {background: #F7F6F5 url(http://[::1]:5173/Themes/Storefront/resources/assets/public/images/arrow-black.png) no-repeat right 0px center;} .ltr .custom-panel-body select.arrow-black {background-position: right 10px center;} /* ----- Order View Page ----- */ #section_order_view .custom-order-view-panel {display: grid; grid-template-columns: auto auto auto; padding: 30px 0;} #section_order_view .custom-order-view-panel .custom-order-view-body {padding: 0 30px;} #section_order_view .section-title {font-size: 30px; font-weight: bold; line-height: 20px; color: var(--dark24); border-bottom: unset;} #section_order_view .section-title:after {border-bottom: unset;} #section_order_view .custom-order-view-panel h4 {font-size: 16px; line-height: 20px; color: var(--dark24); text-transform: uppercase;} #section_order_view .custom-order-view-panel .custom-order-view-body .order-information .order-information-list li {margin-bottom: 0;} #section_order_view .custom-order-view-panel label {font-size: 14px; font-weight: bold; line-height: 30px; color: var(--grey666);} #section_order_view .custom-order-view-panel span {font-size: 14px; font-weight: 400; line-height: 30px; color: var(--grey666);} #section_order_view .custom-order-view-panel address span {width: 80%; margin-bottom: 0;} #section_order_view .custom-panel-body th {color: var(--grey666);} #section_order_view .custom-panel-body .product-price {font-weight: bold;} .custom-order-summary-list label {font-size: 20px; font-weight: 400; line-height: 20px color: var(--dark24);} .custom-order-summary-list span {font-size: 20px; font-weight: bold!important; line-height: 20px; color: var(--dark24);} .custom-order-summary-total label, .custom-order-summary-total span {font-size: 30px; font-weight: bold; line-height: 20px; color: var(--dark24);} .custom-order-summary-total {padding-top: 30px;} /* sidebar cart */ .custom-cart {width: 30%;} .custom-cart .sidebar-cart-top {padding: 30px;} .custom-cart .sidebar-cart-top .title {font-size: 30px; font-weight: 500; line-height: 30px;} .custom-cart .sidebar-cart-top .sidebar-cart-close > i {font-size: 30px;} .custom-cart .sidebar-cart-middle {top: 90px; bottom: unset; height: 70%;} .custom-cart .sidebar-cart-middle .cart-item {align-items: center;} .custom-cart .sidebar-cart-middle .sidebar-cart-item .remove-cart-item {top: unset;} .custom-cart .sidebar-cart-middle .cart-item .product-image {height: 50px; width: 50px; min-width: 50px;} .custom-cart .sidebar-cart-middle .cart-item .product-image .image-placeholder {height: 50px; width: 50px;} .custom-cart .sidebar-cart-middle .cart-item .product-info a.product-name {font-size: 20px; line-height: 20px; color: var(--dark24); margin: 0 25px 5px 0;} .custom-cart .sidebar-cart-middle .cart-item .product-info .product-price {font-size: 16px; font-weight: 400; line-height: 20px; color: var(--grey666);} .custom-cart .sidebar-cart-bottom h5 {font-size: 25px; line-height: 20px; color: var(--dark24); padding: 30px 0;} .custom-cart .sidebar-cart-bottom .sidebar-cart-subtotal > span {font-weight: bold; color: var(--green006);} .custom-cart .sidebar-cart-actions {padding: 30px 25px;} .custom-cart .sidebar-cart-actions .btn-cucumber {border: 1px solid var(--green006);} .custom-cart .sidebar-cart-actions a {padding: 15px 3rem;} /* shopping cart */ #section_shopping_cart .custom-panel-body .table tbody tr td, #section_shopping_cart .custom-panel-body .table tbody tr td .product-price {font-size: 16px;} #section_shopping_cart .custom-panel-body .table tbody tr:first-child td {color: var(--dark24);} #section_shopping_cart .custom-panel-body .table tbody tr td .product-price {font-weight: bold;} #section_shopping_cart .custom-panel-body tbody .number-picker button, #section_shopping_cart .custom-panel-body tbody .number-picker input {background: transparent;} #section_shopping_cart .order-summary-bottom {margin: 10% auto 5% auto;} #section_shopping_cart .order-summary-bottom .btn-green {padding: 15px 2rem;} #section_shopping_cart .custom-coupon {display: flex;} #section_shopping_cart .custom-coupon > div:nth-child(1), #section_shopping_cart .custom-coupon > div:nth-child(2) {width: 30%; padding-right: 30px;} #section_shopping_cart .divided-price-wrap .atome-image, #section_checkout .divided-price-wrap .atome-image {background-position: left center;} #section_checkout .divided-price-wrap {background-position: left center; padding-bottom: 20px;} /* checkout */ #section_checkout .add-new-address-wrap, #section_checkout .add-new-address-form {margin: 5% auto;} #section_checkout .checkout-form h4 {font-size: 25px; font-weight: bold; line-height: 30px; color: var(--dark24);} #section_checkout .checkout-form .order-notes {margin-top: 5%;} #section_checkout .checkout-form .order-notes label {font-size: 20px; font-weight: bold; line-height: 23px; color: var(--dark24);} #section_checkout .checkout-form .order-notes #order-note {height: 150px; padding: 30px;} #section_checkout .order-summary {padding: 30px;} /* order summary */ .ltr #section_checkout .order-summary .form-check {padding-left: unset!important;} #section_checkout .order-summary h3 {font-size: 25px; font-weight: bold; line-height: 20px; color: var(--dark24);} #section_checkout .order-summary-top .custom-product a:hover {color: var(--green006);} #section_checkout .order-summary-middle {padding: 0;} #section_checkout .order-summary-middle ul li label, #section_checkout .order-summary-middle ul li span {font-size: 16px; font-weight: 400; line-height: 30px; color: var(--grey666);} #section_checkout .order-summary-middle .order-summary-total {border: unset; padding: 0; padding-bottom: 10px; font-size: 20px; font-weight: bold; line-height: 20px; color: var(--dark24);} #section_checkout .order-summary-middle ul li span {font-weight: bold; color: var(--dark24);} #section_checkout .order-summary-middle ul li .custom-bold {font-weight: bold; line-height: 20px;} #section_checkout .order-summary .order-summary-bottom, #section_checkout .order-summary .order-summary-bottom .checkout-terms-and-conditions {text-align: unset;} #section_checkout .custom-product {display: flex; align-items: center;} #section_checkout .cart-item .product-info {margin-left: unset;} #section_checkout .cart-item .product-info .product-name, #section_checkout .cart-item .product-info .custom-product p {margin: unset; font-size: 16px; font-weight: 400; line-height: 30px; color: var(--grey666);} #section_checkout .cart-item .product-info .custom-product span {padding: 0 5px;} #section_checkout .cart-item .product-info .custom-product .product-price {position: absolute; right: 0; font-size: 16px; font-weight: bold; line-height: 30px; color: var(--dark24);} /* coupon */ .custom-coupon .form-control {background: #F7F6F5; height: 60px;} .custom-coupon {margin: 2rem auto;} .custom-coupon h5 {font-size: 20px; font-weight: bold; line-height: 20px; color: var(--dark24); margin: 5% auto;} .custom-coupon input.form-control {line-height: 19px; border-radius: unset; border-top-left-radius: 10px; border-bottom-left-radius: 10px;} .custom-coupon button.btn-green {font-size: 16px; line-height: 19px; padding: 15px 2rem; border-radius: unset; border-top-right-radius: 10px; border-bottom-right-radius: 10px;} /* ----- Contact Page ----- */ #section_contact .contact-card {display: flex;} #section_contact .contact-card .contact-card-body {margin-top: 2rem;} #section_contact .contact-card .contact-left {border-right: 1px solid #D9D9D9;} #section_contact .contact-card .contact-left, #section_contact .contact-card .contact-right {padding: 40px;} #section_contact .contact-card .contact-card-text-1, #section_contact .contact-card .contact-card-text-2, #section_contact .contact-card .contact-card-text-3 {margin-bottom: 1.5rem;} #section_contact .contact-card .contact-left {width: 40%;} #section_contact .contact-card .contact-right {width: 60%;} #section_contact .contact-card h5 {font-size: 16px; font-weight: bold; line-height: 23px; color: var(--dark24);} #section_contact .contact-card p {font-size: 16px; font-weight: 400; line-height: 23px; color: var(--grey666);} #section_contact .contact-card ul {display: grid; grid-template-columns: auto auto;} #section_contact .contact-card ul li:nth-child(1), #section_contact .contact-card ul li:nth-child(3), #section_contact .contact-card ul li:nth-child(5) {padding-right: 15px; padding-bottom: 15px;} #section_contact .contact-card ul li .form-group {margin-bottom: 0;} #section_contact .contact-message-wrap {padding-bottom: 20px;} #section_contact .contact-card textarea {height: auto;} /* ----- Faq / Member Benefits / Policy Page ----- */ #section_faq, #section_member_benefits, #section_policy {margin-top: 5rem; padding: 0 15px;} #section_faq .part-general, #section_faq .part-product, #section_member_benefits .member-benefits-wrap, #section_policy .policy-wrap {display: flex; margin: 4rem auto;} #section_faq #accordion_1, #section_faq #accordion_2, #section_member_benefits .part-content, #section_policy .part-content {width: 70%;} /* side title */ #section_faq .part-title, #section_member_benefits .part-title, #section_policy .part-title {width: 30%;} #section_faq .side-title h2, #section_member_benefits .side-title h2, #section_policy .side-title {margin: 0;} #section_faq .part-title h2, #section_member_benefits .part-title h2, #section_policy .part-title h2 {font-size: 40px; font-weight: bold; line-height: 50px; color: var(--green006);} /* font settings */ .part-content h3, .part-content h5 {font-size: 20px; font-weight: 500; line-height: 60px; color: var(--dark24); margin: 0;} .part-content p, .part-content span, #section_policy .part-content ul li, .part-content a {font-size: 20px; font-weight: 400; line-height: 30px; color: var(--grey666);} .part-content span {font-style: italic;} /* collapse panel- faq */ .collapse-panel-default {border-bottom: 1px solid #BDBDBD; padding: 15px 10px 0;} .collapse-panel-default .collapse-panel-title a {font-size: 20px; font-weight: bold; line-height: 50px; color: #131B24; width: 100%; display: block; transition: all 0.5s;} .collapse-panel-default .collapse-panel-title a:before {content: "\276F"; float: right; transition: all 0.5s;} .collapse-panel-default .collapse-panel-title a:hover {color: var(--green006); padding-left: 15px;} .collapse-panel-default .collapse-panel-title a[aria-expanded="true"]:before {-webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); transform: rotate(90deg);} .collapse-panel-default .collapse-panel-body {font-size: 16px; font-weight: 400; line-height: 30px; color: #131B24; padding-bottom: 30px;} /* default card - member benefits */ .img-side {min-height: 200px;} .mb-card-default {margin-bottom: 5%;} .mb-card-body {width: 100%; display: inline-grid; grid-template-columns: auto auto; margin: 3% auto;} .mb-card {display: flex; flex-direction: column; justify-content: center; border: 1px solid #D9D9D9; padding: 30px; margin-right: 10px; transition: all 0.5s;} .mb-card:hover {border: 1px solid var(--green006);} .mb-card h5 {font-weight: bold; line-height: 30px;} /* custom card margin */ .mb-card-custom-1 .mb-card-body {margin: 0;} .mb-card-custom-2 .mb-card-body, .mb-card-custom-3 {margin: 3% auto;} /* point usage - member benefits */ .mb-card-custom-2 {border: 1px solid #D9D9D9; padding: 30px;} .mb-card-custom-2 .mb-card {display: block;} .mb-card-custom-2 .mb-card:nth-child(1) {border: unset; margin: 0; padding: 0 30px 30px 0; border-right: 1px solid #D9D9D9; width: 100%;} .mb-card-custom-2 .mb-card:nth-child(2) {border: unset; margin: 0; padding: 0 0 30px 30px;} .mb-card-custom-2 ul {padding: 0; display: inline-grid; grid-template-columns: auto auto;} .mb-card-custom-2 ul .btn-cucumber, .mb-card-custom-2 ul .btn-peach {font-size: 14px; font-weight: 500; line-height: 15px; padding: 15px 20px; text-transform: unset; text-align: center; margin: 10px 10px 10px 0;} /* slide benefits - member benefits */ .mb-card-custom-3 .mb-card {justify-content: flex-start; height: 180px;} /* birthday month - member benefits */ .mb-card-custom-4 {grid-template-columns: auto auto auto;} /* content - policy */ #section_policy h3 {font-size: 30px; font-weight: bold;} #section_policy h3, #section_policy h5 {line-height: 50px;} #section_policy .part-content a {color: var(--green006);} #section_policy .part-content a:hover {color: var(--green8CC);} .policy-content-default {padding: 2rem 0;} .policy-content-default ul {padding: 0 20px; list-style-type: disc;} .policy-content-default .policy-head, .policy-content-default .policy-body, .policy-content-default .policy-footer {padding-bottom: 30px;} .custom-policy-content-default {padding: 0; padding-bottom: 2rem;} .policy-content-default .custom-policy-head {padding-bottom: 0;} /* ----- Why Biobay ----- */ #section_why_biobay .about-content-right img {width: 100%;} .about-content-wrap {margin-bottom: 8rem;} /* background color */ .about-background-1 {position: absolute; background: #F6E9DE; width: 80%; min-height: 1000px;} .about-background-2 {position: absolute; right: 0; background: #EBF3EF; width: 80%; min-height: 750px;} /* font settings */ .about-content-wrap h1, .awards-content-wrap h1 {font-size: 60px; line-height: 72px; color: var(--dark24);} .about-content-wrap h2, .awards-content-wrap h2 {font-size: 30px; line-height: 36px; color: var(--dark24);} .about-content-wrap p, .awards-content-wrap p {font-size: 16px; font-weight: 400; line-height: 23px; color: var(--grey666);} .about-footer .font-weight-bold {color: var(--dark24); padding: 15px 0;} /* default content */ .about-content-default {display: flex; align-items: flex-start; justify-content: center; position: relative;} .about-content-left, .about-content-right {width: 45%; padding: 50px;} .about-head, .about-head img, .about-body {padding-bottom: 20px;} /* content 1 */ .custom-about-content-1 .about-content-default {padding: 4rem 0;} /* content 2 */ .custom-about-content-2 .about-content-default {padding-top: 4rem;} /* content 3 */ .custom-about-content-3 .about-content-default {background: #F7F6F5; align-items: center; justify-content: space-between;} .custom-about-content-3 .about-content-left, .custom-about-content-3 .about-content-right {padding: 0;} .custom-about-content-3 .about-content-left {display: flex; flex-direction: column; justify-content: center; margin-left: 6rem;} .custom-about-content-3 .about-content-right {text-align: right; padding: 0;} .custom-about-content-3 .mission-vision {padding: 30px 0;} .custom-about-content-3 .mission-vision h2 {font-style: italic; border-left: 5px solid #FBC116; margin: 30px 0; padding: 30px;} /* content 4 */ .awards-content-wrap .text-wrap p {width: 70%;} .awards-content-wrap ul {display: grid; grid-template-columns: auto auto auto auto auto; align-items: start; padding: 30px;} .awards-content-wrap li {display: flex; flex-direction: column; align-items: center; text-align: center; overflow: hidden; padding: 30px; pointer-events: all; border: 1px solid transparent; border-radius: 10px;} .awards-content-wrap li p {font-size: 14px; line-height: 20px; padding: 0 20px;} .awards-content-wrap li:hover {transition: all 0.5s; border: 1px solid #D9D9D9; border-radius: 10px;} /* ----- Health Tips Page ----- */ #section_filter_content .filter_article {width: 100%; max-width: 24%; float: left; background: var(--whiteFFF); border: 1px solid #D8D8D8; border-radius: 10px; flex-direction: column; align-items: center; margin:0px 10px 20px 0px; min-height: 500px;} #section_filter_content .filter_article:hover {border: 1px solid var(--green006); border-radius: 10px;} #section_filter_content .filter_article img {border: none; border-top-left-radius: 10px; border-top-right-radius: 10px; object-fit: cover; width: 100%; max-height:350px; height: auto;} #section_filter_content .filter_article iframe {background: black; border: none; border-top-left-radius: 10px; border-top-right-radius: 10px;} #section_filter_content .filter_article span {font-size:12px; font-weight: bold; line-height: 12px; color: var(--whiteFFF); text-transform: capitalize;} #section_filter_content .filter_article span.badgeVideo {background: #F2672F; padding: 10px 20px; border: none; border-radius: 10px; position: absolute; margin: 10px;} #section_filter_content .filter_article span.badgeArticle {background: #FBC116; padding: 10px 20px; border: none; border-radius: 10px; position: absolute; margin: 10px;} #section_filter_content .filter_article span.badgeMulti {background: rgb(251,193,22); background: linear-gradient(90deg, rgba(251,193,22,1) 40%, rgba(242,103,47,1) 100%); padding: 10px 20px; border: none; border-radius: 10px; position: absolute; margin: 10px;} #section_filter_content .filter_article span.italic-date{ color:var(--grey666); font-weight: 400; font-style: italic; line-height: 20px; display:block; width: 100%; padding: 10px 30px;} #section_filter_content .filter_article h4 {font-size: 18px; font-weight: 500; line-height: 22px; color: var(--dark24); width: 100%; padding: 0 30px;} #section_filter_content .filter_article p {font-size: 14px; font-weight: 400; line-height: 20px; color: var(--grey666); width: 100%; padding: 10px 30px;} #section_filter_content .w-100 button {margin: 2% auto; width: 100%; max-width:max-content;} /* ----- Health Tips Details Page ----- */ #section_news_details .detail-card {margin-bottom: 2rem;} /* font settings */ #section_news_details h1 {font-size: 40px; font-weight: bold; line-height: 48px; color: var(--dark24); width: 80%;} #section_news_details h5 {font-size: 18px; font-weight: bold; line-height: 20px; color: var(--dark24); padding: 10px 0;} #section_news_details p {font-size: 14px; font-weight: 400; line-height: 22px; color: var(--grey666);} #section_news_details span.italic-date {font-size: 14px; font-weight: 400; line-height: 20px; color: var(--grey666); font-style: italic; display: block; padding: 15px 0;} /* image */ #section_news_details .detail-card .detail-img {padding: 50px 0;} #section_news_details .detail-card img {display: block; width: 100%;} /* ul li */ #section_news_details .detail-card ul li {padding-bottom: 15px;} /* detail head */ #section_news_details .detail-head p {font-style: italic; margin: 15px auto; padding: 30px; border-left: 3px solid #EBF3EF; word-break: break-word;} #section_news_details .detail-head p:hover {border-left: 3px solid var(--green006); transition: all 0.5s;} /* social share */ .btn-share-wrap {position: absolute; right: 10rem; padding: 10px;} .btn-share-wrap .btn-cucumber {padding: 15px; line-height: 0;} .btn-share-wrap .btn-cucumber i {font-size: 40px;} /* ----- Reward Wallet Page ----- */ .custom-reward-table tbody td {font-size: 14px; font-weight: 400; line-height: 20px; color: var(--grey666);} .custom-reward-table tbody .btn-cucumber {font-size: 14px; line-height: 20px; padding: 10px 30px; min-width: 150px; text-align: center;} .custom-reward-table tbody .btn-cucumber i {font-size: 20px; position: relative; top: 2px; line-height: 0; padding-right: 5px;} .custom-reward-table tbody tr:hover {background: #F7F6F5;} /* point bar */ .points-bar {background: #EBF3EF; display: flex; align-items: center; padding: 30px; border-radius: 10px;} .points-bar .points-bar-left, .points-bar .points-bar-right {width: 50%;} .points-bar .points-bar-left {display: flex; align-items: center;} .points-bar .points-bar-left i {font-size: 70px; padding-right: 15px; color: #B7DABB;} .points-bar .points-bar-left p {font-size: 20px; font-weight: 500; line-height: 20px; color: var(--dark24); padding-bottom: 10px;} .points-bar .points-bar-left span, .points-bar .points-bar-right h1 span {font-size: 16px; font-weight: 400; font-style: normal;line-height: 20px; color: var(--grey666);} .points-bar .points-bar-right {text-align: right;} .points-bar .points-bar-right h1 {font-size: 50px; font-weight: bold; font-style: italic; line-height: 50px; color: var(--green006);} /* ----- Redemption Details Page ----- */ #section_reward_redeem_details .availability {padding: 5px 0;} #section_reward_redeem_details .part-details {padding: 30px 0;} #section_reward_redeem_details .detail-content-body {display: flex;} #section_reward_redeem_details .part-left {width: 30%} #section_reward_redeem_details .part-right {width: 70%;} #section_reward_redeem_details .detail-content-head, #section_reward_redeem_details .detail-content-body {padding-bottom: 30px;} #section_reward_redeem_details .detail-content-head ul {background: var(--whiteEBF); display: flex; align-items: center; margin-top: 10px; padding: 30px; border-radius: 10px;} #section_reward_redeem_details .detail-content-head ul li {padding-right: 20px;} #section_reward_redeem_details .part-details h4 {font-weight: bold; line-height: 40px; text-transform: capitalize; color: var(--dark24);} #section_reward_redeem_details .part-details h5 {font-size: 16px; font-weight: 600; line-height: 28px; color: var(--dark24); margin: 0;} #section_reward_redeem_details .part-details p {font-size: 14px; font-weight: 400; line-height: 28px; color: var(--grey666);} #section_reward_redeem_details .sidebar-redeem-bottom .btn-green {margin-right: 10px;} /* ----- Checkout Failed Page ----- */ .order-fail {display: flex; align-items: center; padding: 30px;} .order-fail .fail-left img {width: 60%;} .order-fail .fail-left {width: 50%; text-align: right; padding: 0 30px;} .order-fail .fail-right {width: 50%; text-align: left; padding: 0 30px;} .order-fail .fail-bottom {margin: 30px 0; padding: 10px 0;} /* all product text limit setting */ .product-card-middle .product-name h6.product-title-truncate {display: inline-block; max-width: 90%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} /* 1024-tablet */ @media only screen and (min-device-width : 768px) and (max-device-width : 1180px) and (orientation : landscape) { /* public */ .custom-container {max-width: 90%;} #section_product_bottom_part .product-details-tab > .tabs, #section_product_bottom_part #description, #section_product_bottom_part #reviews, .referral-link, #section_health_tips .news-content-wrap .part-left {width: 100%;} .footer-logo, .footer-text-wrap, #section_health_tips .row, .about-content-left, .awards-content-wrap .text-wrap, #section_health_tips .news-content-wrap .part-left {text-align: center;} #section_slide_ads, #section_monthly_promotion, .five-product-list, #section_embrace, #section_related_product, #section_product_bottom_part {margin: 4rem auto;} #section_health_tips .row, #section_health_tips .article-card .text-wrap a, .footer-logo, #section_faq .part-general, #section_faq .part-product, #section_member_benefits .member-benefits-wrap, #section_policy .policy-wrap, #section_product_bottom_part .product-details-bottom {display: block;} .custom-select-option, #section_health_tips .col-lg-5, #section_member_benefits h2 br, #section_faq h2 br, #section_health_tips .news-content-wrap .part-right {display: none!important;} .header-search .header-search-lg, #section_login .form-wrap-inner, .awards-content-wrap .text-wrap p, .about-background-1, .about-background-2, .about-content-left, #section_faq .part-title, #section_member_benefits .part-title, #section_policy .part-title, #section_faq #accordion_1, #section_faq #accordion_2, #section_member_benefits .part-content, #section_policy .part-content {width: 100%;} /* top nav & header */ .top-nav {padding: 20px 0px;} .top-nav .top-nav-right-list > li {padding: 0 10px;} .header-logo, .header-column-right {padding: 0;} .header-search-wrap {padding: 0 20px;} /* footer */ .ltr .single-feature .feature-icon {margin-right: 0;} .features-wrap {margin-top: 7rem;} .features-wrap .single-feature {margin-top: unset; display: flex; flex-direction: column; flex: unset; max-width: unset;} .features-wrap .single-feature .feature-icon img {width: 50px; height: 50px;} .feature-details h6 {font-size: 11px; margin-top: 5px;} .footer-top .col-lg-6 {flex: 0 0 100%; max-width: 100%; padding: 0 100px 30px;} .footer-top .col-lg-2 {flex: 0 0 19.11111111%; max-width: 19.11111111%;} .footer-top .col-lg-4 {padding: 0; padding-right: 15px;} .footer-top .footer-text-wrap p {padding: 0; margin-bottom: 1rem;} .footer-awards .title {margin: 25px 0 10px 0;} .footer-social-awards-wrap {display: flex; justify-content: space-evenly;} /* nav link */ .nav-container {padding: 0 50px;} /* banner top */ .banner-desktop>img {width: 150%; position: relative; left: 50%; transform: translateX(-50%);} /* home */ .banner-wrap {margin-top: 30px;} .product-card {margin: 5px; padding: 10px 15px 0;} .head-content-wrap .side-icon img {width: 50px; height: 50px;} .head-content-wrap .side-title h2 {font-size: 40px;} .head-content-wrap .side-link {top: 0; right: 0;} #section_monthly_promotion .body-content-wrap .product-card {margin: 0 10px 10px 0;} #section_five_product .five-product-list h2 {font-size: 24px;} #section_five_product .five-product-list li {padding: 30px 10px;} #section_five_product .five-product-list img {padding: 10px 30px; max-height: 150px;} #section_five_product .btn-transparent {font-size: 14px; line-height: 18px; padding: 10px; width: 80%; text-align: center;} #section_embrace .content-wrap {padding: 50px; min-height: unset;} #section_embrace .content-wrap img {width: 30%;} #section_embrace .col-lg-9:nth-child(2) {display: flex; align-items: center; justify-content: center;} #section_embrace .col-lg-9:nth-child(2)>img {width: 85%;} #section_health_tips .text-wrap a {margin: 5% auto;} #section_health_tips .text-wrap p {padding-right: 10px;} /* login */ #section_login .col-lg-9 {padding: 0;} #section_login .form-wrap-inner {padding: 0 35px;} #section_login .btn-green {font-size: 14px; padding: 10px 3rem;} #section_login .btn-cucumber {font-size: 14px; padding: 13px 3rem;} /* register */ #section_register .form-wrap-inner {width: 85%;} /* contact */ #section_contact .contact-card .contact-left {padding: 20px;} #section_contact .contact-card .contact-right {padding: 20px 0 20px 40px;} /* health tip detail */ #section_filter_content {margin-top: 3rem;} #section_filter_content .filter_article {max-width:47%; margin:10px;} #section_news_details .btn-share-wrap {right: 3rem;} #section_news_details .btn-share-wrap .btn-cucumber {padding: 10px;} #section_news_details .btn-share-wrap .btn-cucumber i {font-size: 35px;} /* member benefits */ .part-content p, .part-content span, #section_policy .part-content ul li, .part-content a {font-size: 16px; line-height: 25px;} /* policy */ #section_policy h3 {font-size: 25px;} #section_policy h5 {line-height: 30px; padding-bottom: 10px;} .policy-content-default {padding: 1rem 0;} .policy-content-default .policy-head, .policy-content-default .policy-body, .policy-content-default .policy-footer {padding-bottom: 10px;} #section_faq, #section_member_benefits, #section_policy {padding: 0;} /* why biobay */ .custom-about-content-1 .about-content-default, .custom-about-content-2 .about-content-default {display: block; padding: 4rem;} /* content 1 */ .custom-about-content-1 {margin-bottom: 0;} .custom-about-content-1 .about-content-left {padding: 0;} .custom-about-content-1 .about-content-right {position: relative; left: 50%; transform: translateX(-50%); width: 60%;} /* content 2 */ .custom-about-content-2 {margin-bottom: 5rem; height: 1000px;} .custom-about-content-2 .about-content-left {position: relative; top: 0; padding: 0;} .custom-about-content-2 .about-content-right {position: absolute; top: 30rem; left: 50%; transform: translateX(-50%); width: 50%;} /* content 3 */ .custom-about-content-3 {margin-bottom: 5rem;} .custom-about-content-3 .about-content-default {display: grid; grid-template-columns: auto;} .custom-about-content-3 .about-content-left {display: unset; margin: 0; padding: 50px;} .custom-about-content-3 .about-content-right {position: relative; left: 50%; transform: translateX(-50%); text-align: unset;} .custom-about-content-3 .mission-vision h2 {border: unset; margin: 0; padding: 20px;} /* content 4 */ .about-content-wrap h1, .awards-content-wrap h1 {font-size: 50px;} .awards-content-wrap ul {grid-template-columns: auto auto auto;} .awards-content-wrap .text-wrap {padding: 0 30px;} /* account - dashboard */ .ltr .account-wrap .account-right {width: 70%;} .custom-panel-body ul.user-info {display: grid; grid-template-columns: auto auto; width: 100%;} .custom-panel-body .user-info li {padding: 10px 0; width: 100%;} .dashboard-card-1 li {display: flex; flex-direction: column; text-align: center;} .dashboard-card-1 .i-wrap, .dashboard-card-2 .i-wrap {padding-right: 0; position: relative;} .dashboard-card-1 .text-wrap h1, .dashboard-card-2 .text-wrap h1 {font-size: 35px;} .dashboard-card-1 i, .dashboard-card-2 i {font-size: 80px;} /* categories product */ .categories-banner>img {width: 150%; position: relative; left: 50%; transform: translateX(-50%);} .product-search-right #section_slide_ads {width: 100%;} .product-search-right .grid-content-wrap {margin-top: 3rem;} /* product grid view - category & redemption */ .grid-view-products {grid-template-columns: auto auto auto;} .product-card .product-card-middle {width: 150px; height: 100px; padding: 10px 5px;} .product-card .product-card-bottom {padding: 15px 5px;} .product-card .product-name h6 {font-size: 16px;} .product-price {font-size: 18px;} /* product list view - category & redemption */ .list-view-products .product-badge {top: 0px;} /* product details */ .product-details-wrap .container {width: 90%;} .flex-lg-nowrap {display: block; flex-wrap: unset!important;} /* image part */ #section_product_gallery.product-gallery {width: 100%; min-width: 100%;} #section_product_gallery .product-gallery-thumbnail {width: 10%;} #section_product_gallery .product-gallery-preview-wrap {width: 50%; height: 50%;} /* content, button part */ #section_product_content.product-details-info {display: inline-block; width: 100%; margin-top: 3rem;} #section_product_content .details-info-middle-actions .btn-wrap button {padding: 15px 3rem;} #section_product_content .details-info-middle-actions .btn-wrap a {padding: 15px 2.5rem;} #section_product_content .number-picker-lg {padding-right: 5rem;} .review-message {min-height: 250px;} /* ads, might like part */ #section_product_bottom_part .left-sidebar {display: flex; width: 100%; padding: 0 20px;} #section_product_bottom_part .left-sidebar .vertical-products, #section_product_bottom_part .left-sidebar .row {width: 50%;} #section_product_bottom_part .product-details-bottom-inner {width: 100%; margin-top: 3rem; padding: 0;} aside.left-sidebar #section_slide_ads {margin: 1rem auto; width: 80%!important;} /* divice price */ .ltr .product-card .atome-image-clone {bottom: -18px; right: -70px;} } /* 768px-tablet */ @media only screen and (min-device-width : 768px) and (max-device-width : 1180px) and (orientation : portrait) { /* public */ .custom-container, #section_best_selling_product .featured-categories-wrap .container {max-width: 90%;} video, .five-product-list li, .footer .footer-logo, .about-background-1, .about-background-2, .awards-content-wrap .text-wrap p, #section_faq .part-title, #section_member_benefits .part-title, #section_policy .part-title, #section_faq #accordion_1, #section_faq #accordion_2, #section_member_benefits .part-content, #section_policy .part-content, #section_contact .contact-card .contact-left, #section_contact .contact-card .contact-right, .custom-panel-body ul.list-inline, .referral-link, #section_product_bottom_part .product-details-tab > .tabs, #section_product_bottom_part #description, #section_health_tips .news-content-wrap .part-left {width: 100%;} .top-nav-wrap .custom-container, .ltr .header-column-right .header-column-right-item, #section_health_tips .news-content-wrap .part-right, .footer-top .col-lg-2, .footer-top .footer-info, #section_faq .part-title br, #section_member_benefits .part-title br, #section_policy .part-title br, .categories-banner-desktop {display: none!important;} .footer .footer-logo, .footer-text-wrap, .footer-top .col-lg-4, .about-content-default, .awards-content-wrap, #section_contact .contact-card, #section_product_bottom_part #description, #section_health_tips .news-content-wrap .part-left {text-align: center;} .footer .footer-logo, #section_contact .contact-card, .mobile-nav-footer, #section_health_tips .article-card .text-wrap a, .categories-banner-mobile {display: block!important;} /* top nav */ .gradient-text {padding: 18px 50px; text-align: left; font-size: 13px;} /* header */ .header-wrap-inner {padding: 25px 0;} .header-column-right, .header-logo, .footer .footer-logo, .footer-top .col-lg-4 {padding: 0;} .header-search .header-search-sm {background: #EBF3EF; color: var(--green006); height: 40px; width: 40px; border-radius: 50px; text-align: center;} .header-search .header-search-sm > i {color: var(--green006);} .header-search-sm-form.active {width: 100%; left: 0; right: 0; border: 1px solid #D9D9D9; border-radius: 10px;} /* feature */ .features-wrap {margin-top: 6rem;} .features-wrap .single-feature {flex: 0 0 33.33%; max-width: 33.33%; padding: 10px 25px;} .feature-icon img {width: 50px; height: 50px;} .feature-details h6 {font-size: 12px;} /* footer */ .footer {margin-bottom: 7.5rem;} .footer-top .col-lg-6 {flex: 0 0 100%; max-width: 100%; padding: 20px 30px 30px;} .footer-top .col-lg-2 {flex: 0 0 19.11111111%; max-width: 19.11111111%;} .footer-top .title {margin: 15px 0;} .footer-top .footer-text-wrap p {padding: 0; margin-bottom: 1rem; font-size: 14px; line-height: 22px;} .footer-social-awards-wrap {display: flex; justify-content: space-evenly;} .footer-middle {padding: 50px 0;} /* nav link */ .custom-page-wrap {margin-top: 0;} .nav-container {padding: 0 5%;} .nav-container .breadcrumb {margin: 0; padding: 30px 0;} /* side nav cart */ .custom-cart {width: 70%;} /* home */ .banner-wrap {margin-top: 0;} .head-content-wrap .side-icon img {width: 45px; height: 45px;} .head-content-wrap .side-title {width: 75%;} .head-content-wrap .side-title h2 {font-size: 35px; line-height: 40px;} .head-content-wrap .side-link {right: 3rem;} #section_monthly_promotion .body-content-wrap {grid-template-columns: auto auto auto; margin-top: 3rem;} .five-product-list ul {overflow-x: scroll;} .five-product-list .btn-transparent {font-size: 16px; line-height: 20px; width: 100%; text-align: center;} #section_embrace .content-wrap {min-height: 450px;} #section_health_tips {height: 800px;} #section_health_tips .text-wrap a {margin: 5% auto;} #section_health_tips .text-wrap p {padding-right: 10px;} /* login */ .login-banner-short {display: none;} .login-banner-long {display: block;} #section_login .col-lg-9:nth-child(1), #section_login .col-lg-9:nth-child(2), #section_login .col-lg-9:nth-child(3) {padding: 0;} #section_login .col-lg-9:nth-child(3) .form-wrap-inner {width: 700px; margin: 4rem auto; padding: 30px;} /* register */ #section_register .form-wrap-inner {width: 95%;} /* banner top */ .banner-desktop {display: none;} .banner-mobile {display: block;} /* why biobay content */ .custom-about-content-1 .about-content-default, .custom-about-content-2 .about-content-default {display: block; margin-bottom: 5rem; padding: 5rem 2.5rem;} /* content 1 */ .custom-about-content-1 {margin-bottom: 0;} .custom-about-content-1 .about-content-left {padding: 0; text-align: center; width: 100%;} .custom-about-content-1 .about-content-right {position: relative; left: 50%; transform: translateX(-50%); width: 80%;} /* content 2 */ .custom-about-content-2 {margin-bottom: 5rem; height: 1000px;} .custom-about-content-2 .about-content-left {position: relative; top: 0; padding: 0; width: 100%;} .custom-about-content-2 .about-content-right {position: absolute; top: 33rem; left: 50%; transform: translateX(-50%); width: 70%;} /* content 3 */ .custom-about-content-3 {margin-top: 10rem; margin-bottom: 5rem;} .custom-about-content-3 .about-content-default {display: grid; grid-template-columns: auto;} .custom-about-content-3 .about-content-left {display: unset; margin: 0; padding: 50px; width: 100%;} .custom-about-content-3 .about-content-right {position: relative; left: 50%; transform: translateX(-50%); text-align: unset;} .custom-about-content-3 .mission-vision h2 {border: unset; margin: 0; padding: 20px;} /* content 4 */ .about-content-wrap h1, .awards-content-wrap h1 {font-size: 50px;} .awards-content-wrap ul {grid-template-columns: auto auto auto; padding: 30px 0;} .awards-content-wrap li {padding: 10px;} .awards-content-wrap .text-wrap {padding: 0 30px;} /* health tips */ #newsList {display: grid; grid-template-columns: auto;} #section_filter_content {margin-top: 3rem;} #section_filter_content .filter_article {max-width: 80%; margin: 10px auto;} /* news detail */ .btn-share-wrap {right: 2rem;} /* member benefits */ #section_member_benefits .custom-container {max-width: 100%;} #section_faq, #section_member_benefits, #section_policy {margin-top: 3rem; padding: 0;} #section_faq .part-general, #section_faq .part-product, #section_member_benefits .member-benefits-wrap, #section_policy .policy-wrap {display: block; margin: 2.5rem auto;} .mb-card-body {grid-template-columns: auto;} .mb-card {margin: 10px 0;} .mb-card-custom-2 .mb-card:nth-child(1) {border-right: unset; margin: 20px 0; padding: 0;} .mb-card-custom-2 .mb-card:nth-child(1) ul {grid-template-columns: auto auto auto;} .mb-card-custom-2 .mb-card:nth-child(2) {padding: 0;} .part-content p, .part-content span, #section_policy .part-content ul li, .part-content a {font-size: 18px;} /* faqs */ .collapse-panel-default {padding: 20px 0;} /* contact */ #section_contact .contact-card .contact-left {border-right: unset;} #section_contact .contact-card .contact-left, #section_contact .contact-card .contact-right {padding: 40px 0 0;} /* account - dashboard */ .account-wrap > .container {padding: 0 30px;} .account-wrap-inner .account-left ul {display: flex; overflow-x: scroll; text-align: center; align-items: center;} .account-wrap-inner .account-left li {padding: 20px;} .ltr .account-sidebar li a {padding: 0; width: max-content; display: flex; align-items: center;} .ltr .account-sidebar li a > i {margin: 0 10px;} .account-sidebar li a > i {font-size: 50px;} .dashboard-card-1 li {flex-wrap: wrap;} .dashboard-card-2 {margin: 1.5rem 0 5rem 0;} /* account - order details */ #section_order_view .custom-order-view-panel {grid-template-columns: auto;} /* account - custom scroll */ .account-wrap .account-left ul::-webkit-scrollbar, .account-wrap .table-responsive::-webkit-scrollbar {height: 3px;} .account-wrap .account-left ul::-webkit-scrollbar-thumb, .account-wrap .table-responsive::-webkit-scrollbar-thumb {background: var(--green006); border-radius: 10px;} /* categories product */ .categories-banner>img {width: 100%; position: relative; left: 50%; transform: translateX(-50%);} .product-search-right {padding: 0;} .product-search-right #section_slide_ads {width: 100%;} .product-search-right .grid-content-wrap {margin-top: 3rem;} .filter-section-wrap .filter-section-header {background: var(--green006);} /* product grid view - category & redemption */ .grid-view-products {grid-template-columns: auto auto auto;} .product-card .product-card-middle {width: 150px; padding: 0 5px;} .product-card .product-card-bottom {padding: 15px 5px;} .product-card .product-name h6 {font-size: 16px;} .product-price {font-size: 18px;} /* product list view - category & redemption */ .list-view-products .product-badge {top: 0px;} /* product details */ .product-details-wrap .container {width: 97%;} .flex-lg-nowrap {display: block; flex-wrap: unset!important;} /* image part */ #section_product_gallery.product-gallery {width: 100%; min-width: 100%;} #section_product_gallery .product-gallery-thumbnail {width: 15%;} #section_product_gallery .product-gallery-preview-wrap {width: 70%; height: 70%;} /* content, button part */ #section_product_content.product-details-info {display: inline-block; width: 100%; margin-top: 3rem;} #section_product_content .details-info-middle-actions .btn-wrap {display: flex; flex-direction: column;} #section_product_content .details-info-middle-actions .btn-wrap button {padding: 15px 3rem; width: 100%; margin: 10px 0;} #section_product_content .details-info-middle-actions .btn-wrap a {padding: 15px 2.5rem; width: 100%; margin: 10px 0;} #section_product_content .number-picker-lg {padding-right: 5rem;} .review-message {min-height: 250px;} /* ads, might like part */ #section_product_bottom_part #reviews {width: 95%;} #section_product_bottom_part {margin: 0 auto;} #section_product_bottom_part .left-sidebar {display: flex; width: 100%; margin: 3rem auto; padding: 0 20px;} #section_product_bottom_part .left-sidebar .vertical-products, #section_product_bottom_part .left-sidebar .row {width: 50%;} #section_product_bottom_part .product-details-bottom-inner {width: 100%; margin-top: 3rem; padding: 0;} #section_product_bottom_part #reviews {padding-bottom: 30px;} .tab-description-left-content, .tab-description-right-content {margin-bottom: 2rem;} aside.left-sidebar #section_slide_ads {margin: 2.5rem auto;} /* checkout */ .ltr .checkout-left .col-md-18 {padding: 0;} .ltr .checkout-left, .ltr .checkout-right, .ltr .order-summary-wrap {padding: 0 15px;} .custom-coupon h5 {margin: 3% auto;} } /* mobile */ @media screen and (max-width: 480px) { /* public */ .custom-container, #section_best_selling_product .featured-categories-wrap .container {max-width: 90%;} video, .five-product-list li, .footer .footer-logo, .about-background-1, .about-background-2, .awards-content-wrap .text-wrap p, #section_faq .part-title, #section_member_benefits .part-title, #section_policy .part-title, #section_faq #accordion_1, #section_faq #accordion_2, #section_member_benefits .part-content, #section_policy .part-content, #section_contact .contact-card .contact-left, #section_contact .contact-card .contact-right, .custom-panel-body ul.list-inline, .referral-link, #section_product_bottom_part .product-details-tab > .tabs, #section_product_bottom_part #description, #section_product_bottom_part #reviews, #section_register li, #section_news_details h1, .order-details-bottom .order-summary-list, .order-details-bottom .order-summary-total, .points-bar .points-bar-left, .points-bar .points-bar-right, #section_reward_redeem_details .part-left, #section_reward_redeem_details .part-right, #section_health_tips .news-content-wrap .part-left {width: 100%;} .top-nav-wrap .custom-container, .ltr .header-column-right .header-column-right-item, #section_health_tips .news-content-wrap .part-right, .footer-top .col-lg-2, .footer-top .footer-info, #section_faq .part-title br, #section_member_benefits .part-title br, #section_policy .part-title br, .banner-desktop, .login-banner-short, .categories-banner-desktop {display: none!important;} .footer .footer-logo, .footer-text-wrap, .footer-top .col-lg-4, .about-content-default, .awards-content-wrap, #section_contact .contact-card, #section_product_bottom_part #description, #section_health_tips .text-wrap, #section_health_tips .news-content-wrap .part-left, .points-bar .points-bar-right, .custom-panel-body .address-card-wrap .col-md-18, .my-addresses .add-new-address-form .col-md-18 {text-align: center;} .footer .footer-logo, #section_contact .contact-card, .mobile-nav-footer, .banner-mobile, .login-banner-long, #section_health_tips .article-card .text-wrap a, .categories-banner-mobile {display: block!important;} .custom-page-wrap, .banner-wrap, .grid-products-wrap, #section_health_tips .text-wrap {margin-top: 0;} .five-product-list img, #section_health_tips .text-wrap p, .awards-content-wrap li p, .mb-card-custom-2 .mb-card:nth-child(2) {padding: 0;} .custom-about-content-3 .about-content-default, #section_filter_content .head-content-wrap, #newsList, #section_filter_content .head-content-wrap, #section_member_benefits .head-content-wrap, #section_faq .head-content-wrap, #section_policy .head-content-wrap, #section_contact .contact-card ul {display: grid; grid-template-columns: auto;} .mb-card-body, .mb-card-custom-2 .mb-card:nth-child(1) ul, .mb-card-custom-2 ul {grid-template-columns: auto;} /* mouse cursor */ .main-cursor {width: 50px; height: 50px; top: -25px; left: -30px;} .main-cursor::after {width: 90px; height: 90px; top: -19.5px; left: -20px;} .cursor-box .cursor-image-2 {width: 45px; height: 45px;} .cursor-box .cursor-image-3 {width: 40px; height: 40px;} .cursor-box .cursor-image-4 {width: 35px; height: 35px;} .cursor-box .cursor-image-5 {width: 30px; height: 30px;} .cursor-box .cursor-image-6 {width: 25px; height: 25px;} /* all font */ .about-content-wrap h1, .awards-content-wrap h1, #section_news_details h1, #section_member_benefits .part-title h2, #section_faq .part-title h2, #section_policy .part-title h2, .dashboard-card-1 .text-wrap h1, .dashboard-card-2 .text-wrap h1, #section_order_view .section-title, .grid-content-wrap .content-left h4, #section_product_content h1, #section_review_product h1, .landscape-products-wrap .section-title, #section_checkout .order-summary h3 {font-size: 25px; line-height: 30px;} .head-content-wrap .side-title h2, #section_login h2, #section_register h2, #section_register .form-wrap-inner .have-an-account, #section_policy h3, .custom-order-summary-total label, .custom-order-summary-total span, #section_reward_redeem_details .part-details p, #section_reward_redeem_details .detail-content-body .part-right h1, .product-search-left .vertical-products .section-title, .product-details-info .product-price, #section_product_bottom_part h4, .custom-cart .sidebar-cart-top .title, .landscape-products-wrap .section-title, .order-summary-top .section-title, #section_checkout .checkout-form .order-notes label, #section_checkout .order-summary-middle .order-summary-total {font-size: 18px; line-height: 22px;} .about-content-wrap h2, #section_news_details .detail-head p, .part-content h5, #section_policy h5, .ltr .order-summary-list label, .order-summary-list li > span, .points-bar .points-bar-left p, .custom-panel-body .address-card-wrap .address-card .address-card-data h4, #section_reward_redeem_details .part-details h5, .product-card .product-price, .vertical-product-card .product-price, #section_product_content h5, #section_product_content form label, .product-details-tab > .tabs .nav-link, .tab-description-left-content h5, .tab-description-right-content h5, #section_product_bottom_part .vertical-products-slider .product-price, .custom-cart .sidebar-cart-bottom h5, .address-card-wrap .address-card .address-card-data > span:not(:first-child), .custom-coupon h5, #section_checkout .order-summary-middle ul li:first-child label {font-size: 16px; line-height: 20px;} .five-product-list h2, #section_embrace .text-wrap h2, #section_order_view .custom-order-view-panel h4 {font-size: 14px; line-height: 12px;} .footer-top .title, #section_health_tips .text-wrap h5, #section_news_details h5, #section_filter_content .filter_article h4, .part-content p, .part-content span, .collapse-panel-default .collapse-panel-title a, #section_policy .part-content ul li, .part-content a, .panel .panel-header > h4, .panel .panel-header > a, .points-bar .points-bar-left span, .points-bar .points-bar-right h1 span, .custom-panel-body .address-card-wrap .address-card .address-card-data span, .custom-panel-body .my-addresses form span, .product-card .product-name h6, .vertical-product-card .product-name h6, .tab-description-left-content p, .tab-description-right-content td, #section_product_bottom_part .vertical-products-slider .product-info h6, .review-message, .review-name, .custom-cart .sidebar-cart-middle .cart-item .product-info a.product-name, .shopping-cart-table .product-name, #section_checkout .checkout-form h4, .address-card-wrap .address-card .address-card-data > span:first-child, #section_checkout .cart-item .product-info .custom-product .product-price, #section_checkout .order-summary-middle ul li span, #section_checkout .order-summary-middle ul li .custom-bold {font-size: 14px; line-height: 20px;} .btn-transparent, .btn-green, .btn-cucumber, #section_health_tips .article-card .text-wrap a, .dashboard-card-1 .text-wrap p, .dashboard-card-2 .text-wrap p, .my-orders-table .badge, .my-wishlist-table .badge {font-size: 12px; line-height: 10px;} #section_health_tips .side-title p, #section_register p, #section_news_details span.italic-date, .breadcrumb ul > li, .account-sidebar li a, .custom-panel-body table th, .custom-panel-body table td, .my-orders-table thead th, .custom-reward-table tbody td, .custom-reward-table tbody td p, .my-wishlist-table .product-name {font-size: 12px; line-height: 14px;} #section_register .form-check-label>a, .about-content-wrap p, .awards-content-wrap p, .awards-content-wrap li p, #section_news_details p, .collapse-panel-default .collapse-panel-body, .custom-panel-body .user-info li, #section_order_view .custom-order-view-panel label, #section_order_view .custom-order-view-panel span, .custom-panel-body td .product-price, .order-details-table td > label, #section_product_content p, #section_product_content form .form-radio label, .review-age, .ltr .shopping-cart-table td > label, #section_checkout .cart-item .product-info .product-name, #section_checkout .cart-item .product-info .custom-product span, #section_checkout .cart-item .product-info .custom-product p, #section_checkout .order-summary-middle ul li:not(:first-child) label {font-size: 12px; line-height: 20px;} .gradient-text, .mobile-nav-footer .count, .feature-details h6, .product-badge .badge, #section_health_tips .text-wrap p, .footer-top .footer-text-wrap p, .awards-content-wrap li p span {font-size: 10px; line-height: 11px;} .head-content-wrap .side-link a, .head-content-wrap .side-link i {font-size: 10px; line-height: 0;} /* all button */ .btn-transparent, .btn-green, .btn-cucumber, .btn-grey, #section_health_tips .article-card .text-wrap a {padding: 10px 20px!important; font-size: 12px!important; line-height: 10px!important; min-width: unset!important;} /* top nav */ .gradient-text {padding: 10px 20px; text-align: left; width: 80%;} .icon-close {right: 15px;} /* header */ .header-wrap-inner {padding: 5px 0;} .header-column-right, .header-logo, .footer .footer-logo, .footer-top .col-lg-4 {padding: 0;} .header-logo img {max-width: 60%;} .header-search .header-search-sm {background: #EBF3EF; color: var(--green006); height: 30px; width: 30px; border-radius: 50px; text-align: center;} .header-search .header-search-sm > i {font-size: 20px; line-height: 30px; color: var(--green006);} .header-search-sm-form.active {width: 100%; left: 0; right: 0; border: 1px solid #D9D9D9; border-radius: 10px;} .ltr .sidebar-menu-icon-wrap {padding-left: 0;} .sidebar-menu-icon-wrap .sidebar-menu-icon {align-items: flex-end;} /* feature */ .features-wrap {margin-top: 4rem; padding: 10px 0} .features-wrap .single-feature {flex: 0 0 33.33%; max-width: 33.33%; padding: 6px;} .ltr .single-feature .feature-icon {margin-right: 10px;} .feature-icon img {width: 30px; height: 30px;} /* nav link */ .nav-container .breadcrumb {margin: 0; padding: 10px 3px;} /* side nav cart */ .custom-cart {width: 85%;} .custom-cart .sidebar-cart-top {padding: 20px;} .custom-cart .sidebar-cart-top .sidebar-cart-close > i {font-size: 20px;} /* product */ .product-card {padding: 12px 12px 0;} .product-badge .badge {padding: 5px 15px;} .product-card .product-image {padding-bottom: 70%;} .product-card .product-card-middle {height: 30px;} .product-card .product-card-bottom {padding: 8px 0;} .ltr .tab-content .slick-list {padding: 10px 0;} .tab-content .slick-dots {margin-top: 3.5rem;} /* form */ form .form-control {font-size: 14px; line-height: 20px; height: 50px; padding: 10px 30px;} .form-group {margin-bottom: 12px;} .ltr .form-check input[type=checkbox] {width: 30px; height: 30px;} .ltr .form-check input[type=checkbox]:checked+label, .ltr .form-check input[type=checkbox]:not(:checked)+label {font-size: 12px; line-height: 10px; padding: 5px 5px 5px 30px;} .form-check input[type=checkbox]:checked+label:before, .form-check input[type=checkbox]:not(:checked)+label:before {width: 20px; height: 20px;} .ltr .captcha-field > input {width: 100%;} /* mobile nav footer */ .mobile-nav-footer {z-index: 1;} .mobile-nav-footer .count {top: 10px; right: 18px; width: 15px; height: 15px;} .mobile-nav-footer a {padding: 10px 0;} .mobile-nav-footer i {font-size: 25px;} .mobile-nav-footer p {font-size: 10px; padding: 0;} /* footer */ .footer-line-image {width: 200%;} .footer {margin-bottom: 4.3rem; padding-top: 30px;} .footer .footer-logo img {max-width: 35%;} .footer-top .col-lg-6 {flex: 0 0 100%; max-width: 100%; padding: 5px 20px;} .footer-top .col-lg-2 {flex: 0 0 19.11111111%; max-width: 19.11111111%;} .footer-top .footer-text-wrap p {padding: 0; margin-bottom: 1rem;} .footer-social-awards-wrap {display: flex; justify-content: center; flex-direction: column; align-items: center; text-align: center;} .footer-btn-arrow {width: 50px; height: 50px; padding: 10px;} .footer-middle {padding: 30px 0;} .footer-bottom {padding: 15px 0;} /* home */ .head-content-wrap .side-icon img {width: 30px; height: 30px;} .head-content-wrap .side-title {width: 100%; padding: 0 10px;} #section_health_tips .side-title p {padding: 5px 0;} .head-content-wrap .side-link {top: -5px; right: 0;} #section_monthly_promotion {padding: 30px 0 40px 0;} #section_monthly_promotion .body-content-wrap {grid-template-columns: auto auto; margin-top: 2rem;} #section_monthly_promotion .body-content-wrap .product-card {margin: 5px;} .five-product-list ul {overflow-x: scroll;} .five-product-list li {padding: 20px;} .five-product-list img {max-height: 140px;} #section_embrace .content-wrap {min-height: unset; padding: 30px 15px 20px;} #section_embrace .content-wrap img {max-width: 30%; margin: 0 auto;} #section_embrace .text-wrap {margin: 1rem auto; text-align: center;} #section_health_tips {height: unset; margin: 3rem auto;} #section_health_tips video {margin: 20px auto; height: 250px;} #section_health_tips .article-card .text-wrap a {margin: 5% auto;} #section_health_tips .text-wrap p {padding-right: 10px;} #section_embrace .text-wrap p {font-size: 11px; line-height: 14px; margin: 1rem auto 2rem auto;} #section_slide_ads, #section_monthly_promotion, .five-product-list, #section_embrace, #section_related_product, #section_product_bottom_part {margin: 2rem auto;} /* login */ #section_login .col-lg-9:nth-child(1), #section_login .col-lg-9:nth-child(2), #section_login .col-lg-9:nth-child(3) {padding: 0;} #section_login .col-lg-9:nth-child(3) .form-wrap-inner {width: 100%; margin: 5% auto auto auto; padding: 20px;} #section_login h2 {margin-bottom: 20px;} .login-wrap .remember-me {text-align: left; margin-top: 10px; float: left!important;} .login-wrap .forgot-password {margin-top: 18px; font-size: 11px; line-height: 10px; float: right !important} /* register */ #section_register {margin-top: 1rem;} #section_register .form-wrap-inner {width: 95%;} #section_register h2 {margin-bottom: 15px;} #section_register p {padding: 15px;} #section_register li:nth-child(1), #section_register li:nth-child(3), #section_register li:nth-child(5), #section_register li:nth-child(7) {padding-right: 0;} #section_register li:nth-child(2), #section_register li:nth-child(4), #section_register li:nth-child(6), #section_register li:nth-child(8) {padding-left: 0;} #section_register .form-check input[type=checkbox]:checked+label:before, #section_register .form-check input[type=checkbox]:not(:checked)+label:before {top: 5px} #section_register button {margin: 0 auto;} #section_register hr {margin: 2rem auto;} #section_register .form-wrap-inner .have-an-account {margin: 0 auto 1.5rem auto;} /* why biobay content */ .about-head img {width: 50%;} .custom-about-content-1 .about-content-default, .custom-about-content-2 .about-content-default {display: block; margin-bottom: 0; padding: 3rem 20px;} /* content 1 */ .custom-about-content-1 {margin-bottom: 0;} .custom-about-content-1 .about-content-left {padding: 0; text-align: center; width: 100%;} .custom-about-content-1 .about-content-right {position: relative; left: 50%; transform: translateX(-50%); width: 100%; padding: 30px 0;} /* content 2 */ .custom-about-content-2 {margin-bottom: 0; height: 800px;} .custom-about-content-2 .about-content-left {position: relative; top: 0; padding: 0; width: 100%;} .custom-about-content-2 .about-content-right {position: absolute; top: 35rem; left: 50%; transform: translateX(-50%); width: 100%; padding: 0 30px;} /* content 3 */ .custom-about-content-3 {margin-top: 10rem; margin-bottom: 3rem;} .custom-about-content-3 .about-content-left {display: unset; margin: 0; padding: 30px; width: 100%;} .custom-about-content-3 .about-content-right {position: relative; left: 50%; transform: translateX(-50%); text-align: center;} .custom-about-content-3 .mission-vision {padding: 10px 0;} .custom-about-content-3 .mission-vision h2 {border: unset; margin: 0; padding: 10px 0;} /* content 4 */ .awards-content-wrap img {width: 100%;} .awards-content-wrap ul {grid-template-columns: auto auto; padding: 30px 0;} .awards-content-wrap li {padding: 10px;} .awards-content-wrap .text-wrap {padding: 0 30px;} /* health tips */ #section_filter_content {margin-top: 2rem; text-align: center; min-height: auto;} #section_filter_content .head-content-wrap .side-title {padding: 10px;} #section_filter_content .filter_article {min-height: 350px; max-width:100%; margin:0 0 15px 0;} #section_filter_content .filter_article iframe {height: 200px;} #section_filter_content .filter_article img {max-height: 200px;} #section_filter_content .filter_article span.italic-date {font-size: 8px; line-height: 14px;} #section_filter_content .filter_article p {font-size: 10px; line-height: 14px;} /* news detail */ .btn-share-wrap {top: -20px; right: 0rem;} .btn-share-wrap .btn-cucumber {padding: 10px; line-height: 0;} .btn-share-wrap .btn-cucumber i {font-size: 20px;} #section_news_details {text-align: center; position: relative; margin-top: 2rem;} .article-banner-video-wrap iframe {height: 250px;} #section_news_details .detail-head p {padding: 20px;} /* member benefits */ #section_member_benefits .custom-container {max-width: 100%;} #section_faq, #section_member_benefits, #section_policy {margin-top: 1rem; padding: 0; text-align: center;} .part-content h5 {padding: 8px;} #section_member_benefits .head-content-wrap .side-title {padding: 10px;} .mb-card {background: white!important; margin: 10px 0; padding: 0 20px; min-height: 120px;} .mb-card-custom-2 {border: 1px solid #D9D9D9; padding: 20px;} .mb-card-custom-2 .mb-card:nth-child(1) {border-right: unset; margin: 10px 0; padding: 0;} #section_member_benefits .mb-card-custom-3 .mb-card {height: auto; display: inline-flex; justify-content: center; align-items: center;} #section_member_benefits .slick-dotted.slick-slider {height: 200px;} #section_member_benefits .slick-dots {bottom: 40px;} /* faqs */ #section_faq .custom-container {max-width: 100%;} #section_faq .head-content-wrap .side-title {padding: 10px;} .collapse-panel-default {padding: 20px 0;} .collapse-panel-default .collapse-panel-body {padding: 15px 0;} .collapse-panel-default .collapse-panel-title a:hover {padding: 0;} .collapse-panel-default .collapse-panel-title a:before {padding: 0 5px;} /* privacy policy */ #section_policy .custom-container {max-width: 100%;} #section_policy .head-content-wrap .side-title {padding: 10px;} .policy-content-default .policy-head, .policy-content-default .policy-body, .policy-content-default .policy-footer {padding-bottom: 15px;} .custom-policy-content-default {padding: 0; padding-bottom: 0;} #section_policy h3, #section_policy ul li {padding: 5px 0;} /* faqs, member, policy */ #section_faq .part-general, #section_faq .part-product, #section_member_benefits .member-benefits-wrap, #section_policy .policy-wrap {display: block; margin: 0; padding: 20px 0;} /* contact */ #section_contact .contact-card .contact-left {border-right: unset;} #section_contact .contact-card h5 {margin: 1rem 0} #section_contact .contact-card .contact-left, #section_contact .contact-card .contact-right {padding: 20px 0 0;} #section_contact .contact-card .contact-card-body {margin-top: 0;} #section_contact .contact-card ul li:nth-child(1), #section_contact .contact-card ul li:nth-child(3), #section_contact .contact-card ul li:nth-child(5) {padding: 15px 0;} #section_contact .contact-message-wrap {padding-top: 15px; padding-bottom: 15px;} #section_contact .btn-green {width: 100%; padding: 15px!important;} /* account - nav */ .account-wrap > .container {padding: 0 20px;} .account-wrap-inner .account-left ul {display: flex; overflow-x: scroll; text-align: center; align-items: center;} .account-wrap-inner .account-left li {padding: 10px;} .ltr .account-sidebar li a {padding: 0; width: max-content; display: flex; align-items: center;} .ltr .account-sidebar li a > i {margin: 0 10px;} .account-sidebar li a > i {font-size: 30px;} .account-sidebar li.active a:after {top: 8px;} /* account - dashboard */ .dashboard-card-1 .text-wrap, .dashboard-card-2 .text-wrap {padding: 0;} .dashboard-card-1 .i-wrap, .dashboard-card-2 .i-wrap {padding-right: 0; position: absolute; top: 15px; right: 10px; opacity: 0.4;} .dashboard-card-1 ul {display: flex; flex-wrap: wrap;} .dashboard-card-1 li {padding: 15px; min-height: unset; position: relative; width: 48%;} .dashboard-card-1 li:nth-child(2) {margin: 0; margin-left: 10px;} .dashboard-card-1 li:nth-child(3) {margin-top: 10px; width: 100%;} .dashboard-card-1 i, .dashboard-card-2 i {font-size: 50px;} .dashboard-card-2 { margin: 10px 0 3rem 0;} .dashboard-card-2 li {padding: 15px; min-height: unset; position: relative;} .dashboard-card-2 li:nth-child(2) {margin-left: 10px;} /* account - table */ .panel .panel-header, .custom-panel-body table th, .my-orders-table thead th, .table td {padding: 15px;} .my-orders-table .badge {margin-top: -10px; padding: 13px 30px; min-width: unset;} .my-wishlist-table .badge {padding: 13px 30px; min-width: unset;} .custom-panel-body .user-info {padding: 15px!important;} .custom-panel-body .user-info li {padding: 5px 0; width: 100%;} .table tbody tr:first-child td {margin-top: 0;} .custom-reward-table tbody tr td:last-child {padding-top: 25px;} /* account - order details */ .order-details-wrap {margin-top: 20px;} .order-details-bottom {flex-direction: column;} #section_order_view .custom-order-view-panel {grid-template-columns: auto;} #section_order_view .section-title {margin: 0;} #section_order_view .custom-order-view-panel .custom-order-view-body {padding: 0 15px;} /* account - reward wallet */ .points-bar {padding: 20px 15px; flex-direction: column;} .points-bar .points-bar-left p {padding-bottom: 0;} /* account - redemption details */ #section_reward_redeem_details .detail-content-head ul {padding: 20px 0; flex-direction: column; text-align: center;} #section_reward_redeem_details .detail-content-head ul li {padding-right: 0; padding: 5px;} #section_reward_redeem_details .detail-content-body {flex-direction: column; text-align: center;} #section_reward_redeem_details .detail-content-body .part-right .product-price {justify-content: center; padding: 5px 0;} #section_reward_redeem_details .detail-content-body .part-right h5 {padding-bottom: 5px;} /* account - my address */ .my-addresses {padding: 20px 0;} .ltr .custom-panel-body .address-card-wrap .address-card .badge {top: 13px; right: 15px;} .custom-panel-body .address-card-wrap .address-card {padding: 15px;} .custom-panel-body .my-addresses form span {margin-bottom: 1.5rem; padding: 0 15px;} .my-addresses .address-card-wrap .btn-add-new-address {width: unset;} .my-addresses .add-new-address-form .btn-cancel, .my-addresses .add-new-address-form .btn-save-address {width: 50%;} /* account - profile */ .my-profile {padding: 20px 5px;} .my-profile .btn-save-changes {width: unset;} .my-profile form br {display: none;} .my-profile form {text-align: center;} .referral-link {padding: 30px 15px;} .referral-link .form-control {font-size: 14px; line-height: 20px; height: 32px; padding: 15px;} /* account - custom scroll */ .account-wrap .account-left ul::-webkit-scrollbar, .account-wrap .table-responsive::-webkit-scrollbar {height: 3px;} .account-wrap .account-left ul::-webkit-scrollbar-thumb, .account-wrap .table-responsive::-webkit-scrollbar-thumb {background: var(--green006); border-radius: 10px;} /* product grid view - category & redemption */ .grid-view-products {grid-template-columns: auto auto; margin: auto;} .grid-view-products .col, .grid-view-products .grid-view-products-item {padding: 5px;} .grid-view-products .product-card .product-card-middle {height: 50px; width: 100px;} /* product list view - category & redemption */ .list-view-products .product-badge {top: 0px;} /* categories product */ .categories-banner>img {width: 100%; position: relative; left: 50%; transform: translateX(-50%);} .product-search-right {padding: 0;} .product-search-right #section_slide_ads {width: 100%;} .product-search-right .grid-content-wrap {margin-top: 3rem;} .filter-section-wrap .filter-section-header {background: var(--green006);} /* category product details */ .product-details-wrap .container {width: 100%;} .flex-lg-nowrap {display: block; flex-wrap: unset!important;} /* all product text character limit */ .product-card-middle .product-name h6.product-title-truncate {max-width: 50%;} /* image part */ #section_product_gallery.product-gallery {width: 100%; min-width: 100%;} #section_product_gallery .product-gallery-thumbnail {width: 30%;} #section_product_gallery .product-gallery-preview-wrap {width: 70%; height: 70%;} /* content, button part */ #section_product_content.product-details-info {display: inline-block; width: 100%; margin-top: 1rem;} .product-details-info .details-info-middle-actions {flex-direction: row;} .product-details-info .number-picker-lg .input-group-quantity .btn-wrapper .btn-minus {top: 25px;} .product-details-info .number-picker-lg .input-group-quantity .btn-wrapper .btn-plus, .product-details-info .number-picker-lg .input-group-quantity .btn-wrapper .btn-minus {height: 25px;} .product-details-info .number-picker-lg .input-group-quantity .btn-wrapper .btn-number {width: 25px;} #section_product_content .details-info-middle-actions .btn-wrap {display: flex; flex-direction: column;} #section_product_content .details-info-middle-actions .btn-wrap button {padding: 15px 3rem; width: 100%; margin: 10px 0;} #section_product_content .details-info-middle-actions .btn-wrap a {padding: 15px 2.5rem; width: 100%; margin: 10px 0;} #section_product_content .number-picker-lg {padding-right: 2rem;} #description iframe {height: 250px;} .tab-description-left-content {margin-bottom: 2rem;} /* reviews */ #reviews {padding-bottom: 30px;} .review-message {min-height: 200px; padding: 10px 0;} .review-card {margin: 0;} .review-form .btn-submit {margin: 15px 0; padding: 15px 3rem!important;} /* checkout */ .ltr .checkout-left .col-md-18 {padding: 0;} .ltr .checkout-left, .ltr .checkout-right {padding: 0 5px;} /* view cart */ .shopping-cart-table tbody td > label {width: 75px; min-width: 75px;} .shopping-cart-table tbody td:nth-child(2) {padding: 30px 0 11px;} .shopping-cart-table tbody td:nth-child(5) {padding: 2px 0 30px;} .shopping-cart-table tbody td:last-child {padding: 30px 15px;} .custom-border {position: relative;} .custom-border::after {content: ''; position: absolute; bottom: 0; left: 5%; width: 90%; border-bottom: 1px solid #D8D8D8;} #section_shopping_cart .order-summary-bottom .btn-green {width: 100%; display: block; padding: 15px !important;} /* shopping cart */ .ltr #section_checkout .order-summary-wrap {padding: 5px;} .address-card-wrap .address-card .address-card-data > span:first-child {font-weight: bold;} #section_checkout .checkout-form .order-notes #order-note {padding: 20px;} .checkout-right .payment-method .payment-method-form {padding: 25px 20px 4px;} .custom-coupon .form-control {height: 55px; padding: 10px 20px;} .custom-coupon h5 {margin: 5% auto;} #stripe-card-element {padding: 20px;} #section_checkout .order-summary {padding: 25px 20px;} #section_checkout .add-new-address-wrap {margin: 5% auto 2rem auto;} #section_checkout .btn-green, #section_checkout .btn-cucumber {width: 100%; padding: 15px!important;} }