/* ----------------------------------------- [Master Stylesheet] Template Name: Suha - Multipurpose Ecommerce Mobile HTML Template Template Author: Designing World Template Author URL: https://themeforest.net/user/designing-world Version: 2.0 Last Updated: 23 July 2020 Created: 15 Dec 2019 [Table of Contents] * Google Fonts * Include Third Party CSS Library + Bootstrap CSS + Animate CSS + Owl Carousel CSS + Font Awesome CSS + Line Icon CSS * Template Mixins + Flex + Miscellaneous * Template Variables * Template Responsive * Main Styles + Reboot CSS + Shortcode CSS + Preloader CSS + Demo CSS + Header CSS + Hero CSS + Home CSS + Footer CSS + CTA CSS + Register CSS + Contact CSS + Dark Mode CSS # [font-family] 'Roboto', sans-serif; ----------------------------------------- */ /* Import Fonts & All CSS Files */ @import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"); @import url(css/bootstrap.min.css); @import url(css/animate.css); @import url(css/owl.carousel.min.css); @import url(css/font-awesome.min.css); @import url(css/default/lineicons.min.css); @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap'); // : Use a unique and descriptive class name // : Use a value from 300 to 800 .open-sans- { font-family: "Open Sans", sans-serif; font-optical-sizing: auto; font-weight: ; font-style: normal; font-variation-settings: "wdth" 100; } /* Reboot CSS */ * { margin: 0; padding: 0; } body, html { /*font-family: "Roboto", sans-serif;*/ font-family: "Open Sans", sans-serif; color: #747794; overflow-x: hidden; /*background-color: #e7eaf5;*/ background-image: url(https://www.techcanopus.in/satta2025//assets1/backgraund.png); overflow-y: auto; background-repeat: round; background-position-x: initial; height: 100vh; -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; } h1, h2, h3, h4, h5, h6 { color: #020310; line-height: 1.4; font-weight: 700; } p { color: #313131; font-size: 14px; } a, a:hover, a:focus { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; text-decoration: none; outline: 0 solid transparent; box-shadow: none; color: #0DD1B5; } .btn:focus { box-shadow: none; } ul { margin: 0; } ul li { list-style: none; text-decoration: none; } ul li:hover, ul li:focus { list-style: none; text-decoration: none; } ol { margin: 0; } img { max-width: 100%; height: auto; } /* Section Padding */ .section-padding-30 { padding-top: 30px; padding-bottom: 30px; } .section-padding-0-30 { padding-top: 0; padding-bottom: 30px; } .section-padding-30-0 { padding-top: 30px; padding-bottom: 0; } .section-padding-30-14 { padding-top: 30px; padding-bottom: 14px; } /* Scrollup */ #scrollUp { bottom: 30px; font-size: 16px; right: 30px; width: 30px; height: 30px; line-height: 30px; color: #ffffff; text-align: center; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.15); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.15); -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; border-radius: 6px; background-color: #020310; } #scrollUp:hover, #scrollUp:focus { background-color: #0DD1B5; } .jarallax { position: relative; z-index: 0; } .jarallax .jarallax-img { position: absolute; object-fit: cover; font-family: 'object-fit: cover;'; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; } input:required, textarea:required { box-shadow: none !important; } input:invalid, textarea:invalid { box-shadow: none !important; color: #7c0201; } .no-boxshadow { box-shadow: none !important; } @media only screen and (min-width: 1200px) { .container { max-width: 940px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .container { max-width: 800px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .container { max-width: 640px; } } @media only screen and (min-width: 480px) and (max-width: 767px) { .container { max-width: 400px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .container { max-width: 450px; } } /* Shortcodes CSS */ .h-100vh { height: 100vh !important; } .bg-img { background-size: cover; background-position: center center; background-repeat: no-repeat; } .bg-fixed { background-attachment: fixed; } .bg-overlay { position: relative; z-index: 1; } .bg-overlay::after { position: absolute; content: ""; background: #0DD1B5; background: -webkit-linear-gradient(to left, #0DD1B5, #083afb); background: linear-gradient(to left, #0DD1B5, #083afb); opacity: 0.85; top: 0; left: 0; height: 100%; width: 100%; z-index: -1; } .bg-gray { background-color: #f8f8ff; } .btn, .btn:hover, .btn:focus { font-weight: 700; box-shadow: none; } .btn { padding: .375rem 1rem; font-size: 0.85rem; border-radius: .4rem; } .btn:hover, .btn:focus { color: #ffffff; } .btn-group-lg > .btn, .btn-lg { padding: .75rem 1.25rem; font-size: 1rem; border-radius: .5rem; } .btn-group-sm > .btn, .btn-sm { padding: .25rem .75rem; font-size: .75rem; border-radius: .25rem; } .btn-warning { color: #020310; background-color: #ffaf00; border-color: #ffaf00; } .btn-warning:hover, .btn-warning:focus { color: #ffffff; background-color: #020310; border-color: #020310; } .btn-danger { background-image: linear-gradient(to right, #fffae5 , #fed067); border: none; padding: 11px; border-radius: 20px; width: 100%; margin: auto; color: #000; /*border-color: #ea4c62;*/ } .btn-danger:hover, .btn-danger:focus { background-color: #020310; border-color: #020310; } .btn-primary { background-color: #0DD1B5; border-color: #0DD1B5; } .btn-primary:hover, .btn-primary:focus { background-color: #020310; border-color: #020310; } .btn-success { background-color: #00b894; border-color: #00b894; } .btn-success:hover, .btn-success:focus { background-color: #020310; border-color: #020310; } .btn-info { background-color: #FFE53B; background-image: linear-gradient(147deg, #b0c5df 0%, #007bfe 74%); } .btn-info:hover, .btn-info:focus { background-color: #020310; border-color: #020310; } .bg-primary, .badge-primary { background-color: #0DD1B5 !important; } .bg-danger, .badge-danger { background-color: #ea4c62 !important; } .bg-warning, .badge-warning { background-color: #ffaf00 !important; color: #020310; } .bg-info, .badge-info { background-color: #FFE53B; background-image: linear-gradient(147deg, #FFE53B 0%, #FF2525 74%); } .bg-success, .badge-success { background-color: #00b894 !important; } .text-dark { color: #020310 !important; } .section-heading { position: relative; z-index: 1; margin-bottom: 1rem; } .section-heading h6 { margin-bottom: 0; color: #020310; } .section-heading p { margin-bottom: 0; } .card { border-color: transparent !important; border-radius: 0.75rem; box-shadow: 0 4px 5px 0px #cacaca; } .card .card-body { padding: 1rem; } .card-img-top { border-top-left-radius: calc(.75rem - 1px); border-top-right-radius: calc(.75rem - 1px); } .border, .border-left, .border-right, .border-bottom, .border-top, .list-group-item { border-color: #ebebeb !important; } .mfp-iframe-holder .mfp-content { max-width: 1100px; } .internet-connection-status { position: fixed; background-color: transparent; width: 100%; height: 26px; z-index: 99999; text-align: center; color: #ffffff; bottom: 58px !important; left: 0; right: 0; line-height: 26px; font-weight: 700; font-size: 12px; } /* Preloader CSS */ #preloader { position: fixed; width: 100%; height: 100%; z-index: 9999999; top: 0; left: 0; background-color: #f8f8ff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; overflow: hidden; } /* Animation CSS */ @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @keyframes spin { 0% { -webkit-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @-webkit-keyframes burst { 0% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } 90% { -webkit-transform: scale(1.5); transform: scale(1.5); opacity: 0; } } @keyframes burst { 0% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } 90% { -webkit-transform: scale(1.5); transform: scale(1.5); opacity: 0; } } @-webkit-keyframes flashing { 0%, 90% { opacity: 1; } 45% { opacity: 0; } } @keyframes flashing { 0%, 90% { opacity: 1; } 45% { opacity: 0; } } @-webkit-keyframes fade-left { 0% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } 75% { -webkit-transform: translateX(-20px); transform: translateX(-20px); opacity: 0; } } @keyframes fade-left { 0% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } 75% { -webkit-transform: translateX(-20px); transform: translateX(-20px); opacity: 0; } } @-webkit-keyframes fade-right { 0% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } 75% { -webkit-transform: translateX(20px); transform: translateX(20px); opacity: 0; } } @keyframes fade-right { 0% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } 75% { -webkit-transform: translateX(20px); transform: translateX(20px); opacity: 0; } } @-webkit-keyframes fade-up { 0% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } 75% { -webkit-transform: translateY(-20px); transform: translateY(-20px); opacity: 0; } } @keyframes fade-up { 0% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } 75% { -webkit-transform: translateY(-20px); transform: translateY(-20px); opacity: 0; } } @-webkit-keyframes fade-down { 0% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } 75% { -webkit-transform: translateY(20px); transform: translateY(20px); opacity: 0; } } @keyframes fade-down { 0% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } 75% { -webkit-transform: translateY(20px); transform: translateY(20px); opacity: 0; } } @-webkit-keyframes tada { from, to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(0.95, 0.95, 0.95) rotate3d(0, 0, 1, -10deg); transform: scale3d(0.95, 0.95, 0.95) rotate3d(0, 0, 1, -10deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 10deg); transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 10deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -10deg); transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -10deg); } } @keyframes tada { from, to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(0.95, 0.95, 0.95) rotate3d(0, 0, 1, -10deg); transform: scale3d(0.95, 0.95, 0.95) rotate3d(0, 0, 1, -10deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 10deg); transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 10deg); } 40%, 60%, 80% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } } .lni-spin-effect, .lni-spin-effect-hover:hover { -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite; } .lni-tada-effect, .lni-tada-effect-hover:hover { -webkit-animation: tada 1.5s ease infinite; animation: tada 1.5s ease infinite; } .lni-flashing-effect, .lni-flashing-effect-hover:hover { -webkit-animation: flashing 1.5s infinite linear; animation: flashing 1.5s infinite linear; } .lni-burst-effect, .lni-burst-effect-hover:hover { -webkit-animation: burst 1.5s infinite linear; animation: burst 1.5s infinite linear; } .lni-fade-up-effect, .lni-fade-up-effect-hover:hover { -webkit-animation: fade-up 1.5s infinite linear; animation: fade-up 1.5s infinite linear; } .lni-fade-down-effect, .lni-fade-down-effect-hover:hover { -webkit-animation: fade-down 1.5s infinite linear; animation: fade-down 1.5s infinite linear; } .lni-fade-left-effect, .lni-fade-left-effect-hover:hover { -webkit-animation: fade-left 1.5s infinite linear; animation: fade-left 1.5s infinite linear; } .lni-fade-right-effect, .lni-fade-right-effect-hover:hover { -webkit-animation: fade-right 1.5s infinite linear; animation: fade-right 1.5s infinite linear; } /* Demo CSS */ .preview-iframe-wrapper { position: relative; z-index: 1; } @media only screen and (min-width: 1200px) { .preview-iframe-wrapper .container.demo-container { max-width: 1140px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .preview-iframe-wrapper .container.demo-container { max-width: 960px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .preview-iframe-wrapper .container.demo-container { max-width: 720px; } } @media only screen and (min-width: 480px) and (max-width: 767px) { .preview-iframe-wrapper .container.demo-container { width: 100%; max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .preview-iframe-wrapper .container.demo-container { max-width: 540px; } } .preview-iframe-wrapper .preview-hero-area { position: relative; z-index: 1; width: 100%; padding-top: 100px; margin-bottom: -50px; } .preview-iframe-wrapper .preview-hero-area::after { position: absolute; content: ""; background-image: url(img/core-img/curve.png); bottom: 50px; width: 142px; height: 121px; background-repeat: no-repeat; right: 0; z-index: auto; } .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper { position: relative; z-index: 1; margin-bottom: 150px; } .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper .demo-title { font-size: 2.1rem; margin-bottom: 1rem; } @media only screen and (min-width: 992px) and (max-width: 1199px) { .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper .demo-title { font-size: 1.75rem; } } @media only screen and (max-width: 767px) { .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper .demo-title { font-size: 1.625rem; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper .demo-title { font-size: 2rem; } } .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper .demo-title span { color: #0DD1B5; } .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper .demo-desc { font-size: 18px; } .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper .qr-code-wrapper { position: relative; z-index: 1; background-color: #ffffff; text-align: center; max-width: 18rem; padding: 2rem; border-radius: .5rem; } .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper .qr-code-wrapper::after { position: absolute; width: 200px; height: 200px; background-image: url(img/core-img/dot-blue.png); background-repeat: repeat; bottom: -70px; left: -70px; z-index: -10; content: ""; border-radius: 50%; opacity: 0.15; } .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper .qr-code-wrapper h6 { font-size: 14px; } .preview-iframe-wrapper .preview-hero-area iframe { position: relative; z-index: 1; width: 395px; height: 758px; border: 10px solid #020310; border-radius: 1.25rem; box-shadow: 0 1px 2px 1px rgba(14, 14, 14, 0.125); margin-bottom: 150px; } @media only screen and (max-width: 767px) { .preview-iframe-wrapper .preview-hero-area iframe { display: none; } } .preview-iframe-wrapper .tech-img ul li { margin-right: 1rem; margin-top: 1rem; } .preview-iframe-wrapper .tech-img ul li:last-child { margin-right: 0rem; } .preview-iframe-wrapper .tech-img ul li img { max-height: 30px; } @media only screen and (min-width: 768px) and (max-width: 991px) { .preview-iframe-wrapper .tech-img ul li img { max-height: 22px; } } @media only screen and (max-width: 767px) { .preview-iframe-wrapper .tech-img ul li img { max-height: 22px; } } .preview-iframe-wrapper .features-area { position: relative; z-index: 1; padding: 100px 0; border-radius: 3rem 0 0 0; } .preview-iframe-wrapper .features-area ul li { position: relative; z-index: 1; padding-left: 1.5rem; margin-top: 1rem; } .preview-iframe-wrapper .features-area ul li.active { color: #020310; } .preview-iframe-wrapper .features-area ul li::before { position: absolute; content: "\f00c"; top: 0; left: 0; font-family: "FontAwesome"; font-size: 16px; color: #0DD1B5; z-index: 1; } .border-top.margin-100 { margin-top: 100px; } .tablet-wrap { position: relative; z-index: 1; margin-top: 95px; } .ipad-frame-wrap { position: relative; z-index: 1; padding-left: 15px; padding-right: 15px; text-align: center; } .ipad-frame-wrap iframe { width: 768px; height: 1024px; border: 10px solid #d7def4; border-radius: 1.5rem; } @media only screen and (min-width: 768px) and (max-width: 991px) { .ipad-frame-wrap iframe { width: 100%; } } @media only screen and (max-width: 767px) { .ipad-frame-wrap iframe { display: none; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .ipad-frame-wrap iframe { width: 100%; height: 800px; } } .preview-footer-area { position: relative; z-index: 1; width: 100%; height: 100px; } .preview-footer-area .footer-nav a { margin-left: 1rem; font-size: 14px; color: #747794; font-weight: 700; } .preview-footer-area .footer-nav a:hover, .preview-footer-area .footer-nav a:focus { color: #0DD1B5; } .preview-footer-area .footer-logo img { max-height: 50px; } /* Header CSS */ .header-area { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; background-color: #666666; width: 100%; height: 55px; position: fixed; top: 0; left: 0; right: 0; z-index: 1000; box-shadow: 0 6px 12px rgba(15, 15, 15, 0.15); } .header-area.header-out { top: -100px; } .top-search-form { position: relative; z-index: 1; } .top-search-form form { position: relative; z-index: 1; } .top-search-form form .form-control { max-width: 190px; background-color: #ffffff; height: 32px; font-size: 12px; padding: 10px 15px; padding-left: 35px; border: 1px solid #ebebeb; color: #747794; } @media only screen and (min-width: 480px) and (max-width: 767px) { .top-search-form form .form-control { max-width: 240px; width: 240px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .top-search-form form .form-control { max-width: 280px; width: 280px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .top-search-form form .form-control { max-width: 280px; width: 280px; } } @media only screen and (min-width: 1200px) { .top-search-form form .form-control { max-width: 350px; width: 350px; } } .top-search-form form button { background-color: transparent; position: absolute; top: 1px; left: 10px; width: 18px; height: 30px; border: 0; z-index: 10; color: #747794; } .top-search-form form button:focus { outline: none; } .suha-navbar-toggler { position: relative; z-index: 1; width: 43px; cursor: pointer; padding: 1.5rem 0; top: -20px; } .suha-navbar-toggler span { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; -webkit-box-flex: 0; -ms-flex: 0 0 22px; flex: 0 0 22px; min-width: 22px; width: 22px; height: 2px; background-color: #fff; margin-bottom: 4px; } .suha-navbar-toggler span:nth-child(2) { -webkit-box-flex: 0; -ms-flex: 0 0 12px; flex: 0 0 12px; min-width: 12px; width: 12px; } .suha-navbar-toggler span:last-child { margin-bottom: 0; -webkit-box-flex: 0; -ms-flex: 0 0 17px; flex: 0 0 17px; min-width: 17px; width: 17px; } .suha-navbar-toggler:hover span, .suha-navbar-toggler:focus span { -webkit-box-flex: 0; -ms-flex: 0 0 22px; flex: 0 0 22px; min-width: 22px; width: 22px; } .filter-option { position: relative; z-index: 1; cursor: pointer; text-align: right; width: 30px; height: 30px; line-height: 30px; font-size: 20px; } .back-button a { color: #747794; font-weight: 500; font-size: 14px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .back-button a i { font-size: 1.25rem; margin-right: 0.25rem; } .back-button a:hover, .back-button a:focus { color: #0DD1B5; } .page-heading h6 { color: #747794; font-size: 14px; } .logo-wrapper a { display: block; } /* Hero CSS */ .intro-wrapper { position: relative; width: 100%; height: 100vh; background: #0DD1B5; background: -webkit-linear-gradient(to left, #0DD1B5, #0d3bd1); background: linear-gradient(to left, #0DD1B5, #0d3bd1); z-index: 1; } .intro-wrapper .background-shape { position: absolute; width: 320px; height: 320px; border-radius: 50%; background-color: #ffffff; opacity: 0.175; z-index: -1; top: -130px; right: -85px; } .get-started-btn { position: fixed; z-index: 100; bottom: 40px; width: 280px; left: 50%; margin-left: -140px; } /* Core CSS */ .page-content-wrapper { position: relative; z-index: 1; margin-top: 50px; margin-bottom: 58px; } .suha-sidenav-wrapper { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; position: fixed; width: 100%; z-index: 999999; top: 0; left: -250px; height: 100%; background-color: #ffffff; /*background-image: linear-gradient(147deg, #b0c5df 0%, #007bfe 74%);*/ overflow-y: auto; width: 240px; } .suha-sidenav-wrapper .go-home-btn { -webkit-transition-duration: 400ms; -o-transition-duration: 400ms; transition-duration: 400ms; position: fixed; bottom: 30px; left: 53px; width: 140px; /*background-color: #00b894; height: 40px; border-radius: 50%;*/ text-align: center; color: #000; line-height: 42px; z-index: 10; cursor: pointer; visibility: hidden; opacity: 0; font-size: 1.25rem; } .suha-sidenav-wrapper .go-home-btn:hover, .suha-sidenav-wrapper .go-home-btn:focus { background-color: #020310; } .suha-sidenav-wrapper.nav-active { left: 0; } .suha-sidenav-wrapper.nav-active .go-home-btn { visibility: visible; opacity: 1; } .suha-sidenav-wrapper.filter-nav { background: #f8f8ff; } .sidenav-black-overlay { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; width: 100%; position: fixed; height: 100%; top: 0; left: 0; background-color: rgba(2, 3, 16, 0.3); z-index: 9999; opacity: 0; visibility: hidden; } .sidenav-black-overlay.active { opacity: 1; visibility: visible; } .sidenav-profile { position: relative; z-index: 1; } .sidenav-profile .user-profile { position: relative; z-index: 1; width: 60px; height: 60px; border-radius: 50%; margin: 3rem auto 0.5rem; } .sidenav-profile .user-profile::before { position: absolute; width: 60px; height: 60px; top: -15px; left: -15px; background-image: url(assets1/upload/dot.png); content: ""; z-index: -10; opacity: 0.2; border-radius: 50%; } .sidenav-profile .user-profile img { border-radius: 50%; } .sidenav-profile .user-profile .user-designation { position: absolute; z-index: 1; height: 46px; width: 46px; font-size: 12px; border: 3px solid #ffffff; background-color: #0DD1B5; display: inline-block; border-radius: 50%; color: #ffffff; line-height: 40px; text-align: center; font-weight: 700; top: 0; right: 0; } .sidenav-profile .user-info { position: relative; z-index: 1; text-align: left; } .sidenav-profile .user-info h6, .sidenav-profile .user-info p { color: #ffffff; } .sidenav-profile .user-info .available-balance { margin-bottom: 0; display: block; font-size: 14px; font-weight: 700; color: #ffffff; } .sidenav-nav { margin: 0rem 1rem; position: relative; z-index: 1; } .sidenav-nav li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #656668; padding-top: 0.75rem; padding-bottom: 0.10rem; padding-right: 0.25rem; padding-left: 0.25rem; font-size: 14px; font-weight: normal; border-radius: 0.375rem; } .sidenav-nav li a i { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; display: inline-block; margin-right: 0.5rem; font-size: 1rem; color: #ffffff; background: #7b0406; padding: 10px 0 0 11px; border-radius: 50%; height: 35px; width: 35px; } .sidenav-nav li a:hover, .sidenav-nav li a:focus { background-color: rgba(15, 15, 15, 0.1); font-weight: 700; } .sidenav-nav li:last-child a { margin-bottom: 0; } li.suha-dropdown-menu { position: relative; z-index: 1; } li.suha-dropdown-menu ul { display: none; padding-left: 1rem; } li.suha-dropdown-menu ul li a { font-size: 13px; padding-top: 0.5rem; padding-bottom: 0.5rem; } li.suha-dropdown-menu .dropdown-trigger-btn { height: 45px; line-height: 45px; color: #ffffff; font-size: 12px; width: 100%; position: absolute; top: 0; right: 0; z-index: 10; text-align: right; padding-right: 1rem; border-radius: 0.375rem; cursor: pointer; } li.suha-dropdown-menu .dropdown-trigger-btn i { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; } li.suha-dropdown-menu .dropdown-trigger-btn:hover, li.suha-dropdown-menu .dropdown-trigger-btn:focus { background-color: rgba(15, 15, 15, 0.1); } li.suha-dropdown-menu .dropdown-trigger-btn.active { background-color: rgba(15, 15, 15, 0.1); } li.suha-dropdown-menu .dropdown-trigger-btn.active i { -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); } .page-nav { position: relative; z-index: 1; } .page-nav li a { color: #020310; display: block; padding: 0.75rem 1rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 0.5rem; border-radius: 0.75rem; background-color: #ffffff; font-size: 14px; font-weight: 500; } .page-nav li a i { font-size: 1rem; margin-left: auto; } .page-nav li a:hover, .page-nav li a:focus { color: #0DD1B5; background-color: #f8f8ff; } .page-nav li:last-child a { margin-bottom: 0; } .hero-slides { position: relative; z-index: 1; } .hero-slides .owl-prev, .hero-slides .owl-next { position: absolute; top: 50%; background-color: rgba(255, 255, 255, 0.11); width: 30px; height: 30px; text-align: center; line-height: 30px; left: 0; margin-top: -15px; color: #ffffff; display: none; } .hero-slides .owl-next { left: auto; right: 0; } .hero-slides .owl-dots { position: absolute; width: 100%; bottom: 15px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .hero-slides .owl-dots .owl-dot { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; position: relative; z-index: 1; margin: 0 5px; width: 8px; height: 8px; -webkit-box-flex: 0; -ms-flex: 0 0 8px; flex: 0 0 8px; max-width: 8px; background-color: #ebebeb; border-radius: 50%; } .hero-slides .owl-dots .owl-dot.active { background-color: #ffaf00; } .hero-slides .owl-dots .owl-dot.active::after { position: absolute; width: calc(100% + 8px); height: calc(100% + 8px); z-index: 1; content: ""; border: 2px solid #ffaf00; left: -4px; top: -4px; border-radius: 50%; } .single-hero-slide { position: relative; z-index: 1; width: 100%; height: 200px; background-position: center center; background-size: cover; } @media only screen and (min-width: 480px) and (max-width: 767px) { .single-hero-slide { height: 220px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .single-hero-slide { height: 240px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .single-hero-slide { height: 300px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .single-hero-slide { height: 320px; } } @media only screen and (min-width: 1200px) { .single-hero-slide { height: 450px; } } .single-hero-slide .slide-content { position: absolute; width: 100%; top: 0; left: 0; z-index: 10; } @media only screen and (min-width: 768px) and (max-width: 991px) { .single-hero-slide .slide-content h4 { font-size: 2rem; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .single-hero-slide .slide-content h4 { font-size: 2rem; } } @media only screen and (min-width: 1200px) { .single-hero-slide .slide-content h4 { font-size: 2.5rem; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .single-hero-slide .slide-content p { font-size: 1.125rem; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .single-hero-slide .slide-content p { font-size: 1.125rem; } } @media only screen and (min-width: 1200px) { .single-hero-slide .slide-content p { font-size: 1.25rem; } } .catagory-card { position: relative; z-index: 1; text-align: center; border-radius: 0.75rem; } .catagory-card a { display: block; padding-top: 0.25rem; padding-bottom: 0.25rem; } .catagory-card i { margin-bottom: 0.75rem; font-size: 1.75rem; display: block; color: #0DD1B5; } .catagory-card span { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; display: block; font-size: 12px; font-weight: 700; line-height: 1; color: #747794; } .catagory-card:hover span, .catagory-card:focus span { color: #0DD1B5; } .flash-sale-slide.owl-carousel { width: 130% !important; } @media only screen and (min-width: 768px) and (max-width: 991px) { .flash-sale-slide.owl-carousel { width: 100% !important; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .flash-sale-slide.owl-carousel { width: 100% !important; } } @media only screen and (min-width: 1200px) { .flash-sale-slide.owl-carousel { width: 100% !important; } } .flash-sale-card { position: relative; z-index: 1; } .flash-sale-card img { margin-bottom: 0.5rem; } .flash-sale-card .product-title { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; color: #020310; font-size: 14px; font-weight: 500; display: block; line-height: 1.2; margin-bottom: 0.25rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .flash-sale-card .sale-price { font-size: 14px; font-weight: 700; color: #0DD1B5; margin-bottom: 0; } .flash-sale-card .real-price { display: inline-block; margin-left: 5px; font-size: 12px; text-decoration: line-through; margin-bottom: 0.25rem; } .flash-sale-card .progress { height: 0.25rem; } .flash-sale-card .progress-title { color: #747794; font-size: 12px; display: block; } .flash-sale-card:hover .product-title, .flash-sale-card:focus .product-title { color: #0DD1B5; } .top-product-card { position: relative; z-index: 1; } .top-product-card .badge { position: absolute; top: 1rem; left: 1rem; z-index: 10; } .top-product-card .wishlist-btn { position: absolute; top: 1rem; right: 1rem; z-index: 10; color: #ea4c62; font-size: 1.25rem; line-height: 1; } .top-product-card .product-thumbnail { text-align: center; } .top-product-card .product-thumbnail img { width: 100%; } .top-product-card .delete-btn { position: absolute; top: 1rem; right: 1rem; z-index: 10; color: #747794; font-size: 1.25rem; line-height: 1; } .top-product-card .product-title { font-size: 14px; font-weight: 700; margin-bottom: 0.25rem; color: #020310; } .top-product-card .sale-price { margin-bottom: 0.25rem; color: #00b894; font-weight: 700; } .top-product-card .sale-price span { color: #747794; margin-left: 5px; text-decoration: line-through; font-size: 14px; } .top-product-card .product-rating { font-size: 10px; color: #ffaf00; } .top-product-card .product-rating i { margin: 0 1px; } .top-product-card .btn { padding: 0; border-radius: 50%; width: 30px; height: 30px; text-align: center; line-height: 30px; position: absolute; right: 12px; bottom: 12px; font-size: 1rem; z-index: 9; } .top-product-card:hover .product-title, .top-product-card:focus .product-title { color: #0DD1B5; } .weekly-product-card { position: relative; z-index: 1; } .weekly-product-card .product-thumbnail-side { position: relative; z-index: 1; -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; width: 50%; padding-right: 1rem; } .weekly-product-card .product-thumbnail-side .product-thumbnail { position: relative; z-index: 1; } .weekly-product-card .product-thumbnail-side .product-thumbnail img { max-height: 150px; } .weekly-product-card .product-thumbnail-side .badge { position: absolute; z-index: 2; top: 0.5rem; left: 0.5rem; } .weekly-product-card .product-thumbnail-side .wishlist-btn { position: absolute; bottom: 0.5rem; left: 0.5rem; color: #ea4c62; line-height: 1; z-index: 11; font-size: 1.25rem; } .weekly-product-card .product-thumbnail-side .delete-btn { position: absolute; bottom: 0.5rem; left: 0.5rem; color: #747794; line-height: 1; z-index: 11; } .weekly-product-card .product-description { position: relative; z-index: 1; -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; width: 50%; } .weekly-product-card .product-description .product-title { margin-bottom: 0.5rem; font-weight: 700; font-size: 14px; color: #020310; } .weekly-product-card .product-description .sale-price { margin-bottom: 0.5rem; font-size: 14px; font-weight: 700; color: #020310; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .weekly-product-card .product-description .sale-price i { -webkit-box-flex: 0; -ms-flex: 0 0 22px; flex: 0 0 22px; max-width: 22px; width: 22px; height: 22px; line-height: 23px; border-radius: 50%; color: #ffffff; background-color: #0DD1B5; font-size: 10px; text-align: center; margin-right: 0.25rem; } .weekly-product-card .product-description .sale-price span { text-decoration: line-through; color: #ea4c62; margin-left: 0.25rem; } .weekly-product-card .product-description .product-rating { font-size: 14px; font-weight: 700; margin-bottom: 0.5rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .weekly-product-card .product-description .product-rating i { -webkit-box-flex: 0; -ms-flex: 0 0 22px; flex: 0 0 22px; max-width: 22px; width: 22px; height: 22px; line-height: 23px; border-radius: 50%; color: #ffffff; background-color: #ffaf00; font-size: 10px; text-align: center; margin-right: 0.25rem; padding-left: 1px; } .weekly-product-card .product-description .btn i { font-size: 14px; } .weekly-product-card:hover .product-title, .weekly-product-card:focus .product-title { color: #0DD1B5; } .featured-product-card { position: relative; z-index: 1; } .featured-product-card .custom-badge { position: absolute; left: 1rem; top: -1px; z-index: 100; height: 22px; border-radius: 0; padding: 0 0 0 .75rem; line-height: 22px; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .featured-product-card .custom-badge::before { border-color: #ffaf00 transparent #ffaf00 #ffaf00; border-style: solid; border-width: 11px 8px; content: ""; height: 22px; position: absolute; right: -17px; top: 0; width: 17px; z-index: 1; } .featured-product-card .product-thumbnail-side { position: relative; z-index: 1; margin-bottom: 0.5rem; } .featured-product-card .product-thumbnail-side .product-thumbnail { position: relative; z-index: 1; text-align: center; } .featured-product-card .product-thumbnail-side .product-thumbnail img { max-height: 150px; } .featured-product-card .product-thumbnail-side .wishlist-btn { position: absolute; top: 0rem; right: 0rem; color: #ea4c62; line-height: 1; z-index: 11; font-size: 1.25rem; } .featured-product-card .product-description { position: relative; z-index: 1; } .featured-product-card .product-description .product-title { margin-bottom: 0.25rem; font-weight: 700; font-size: 14px; color: #020310; } .featured-product-card .product-description .product-title:hover, .featured-product-card .product-description .product-title:focus { color: #0DD1B5; } .featured-product-card .product-description .sale-price { margin-bottom: 0; font-size: 14px; font-weight: 700; color: #00b894; } .catagory-sidebar-area { position: relative; z-index: 1; padding: 3rem 2rem; } .widget .widget-title { display: block; } .widget .form-check-label { font-size: 14px; } .notification-area { position: relative; z-index: 1; } .notification-area .list-group-item { border-color: #ebebeb; margin-bottom: 0.5rem; border-radius: 0.5rem; } .notification-area .list-group-item .noti-icon { position: relative; z-index: 1; display: inline-block; width: 30px; height: 30px; -webkit-box-flex: 0; -ms-flex: 0 0 30px; flex: 0 0 30px; max-width: 30px; background: #0DD1B5; background: -webkit-linear-gradient(to left, #0DD1B5, #0d3bd1); background: linear-gradient(to left, #0DD1B5, #0d3bd1); color: #ffffff; text-align: center; font-size: 1rem; margin-right: .75rem; border-radius: 50%; } .notification-area .list-group-item .noti-icon i { line-height: 30px; } .notification-area .list-group-item .noti-icon::before { position: absolute; width: 10px; height: 10px; background-color: #ffaf00; content: ""; top: -2px; right: -2px; border-radius: 50%; z-index: 1; } .notification-area .list-group-item h6 { font-size: 14px; -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; color: #020310; } .notification-area .list-group-item p { margin-bottom: 0.5rem; } .notification-area .list-group-item a { font-size: 14px; } .notification-area .list-group-item span { font-size: 12px; display: block; color: #747794; } .notification-area .list-group-item:first-child { border-top-left-radius: .5rem; border-top-right-radius: .5rem; } .notification-area .list-group-item:last-child { border-bottom-right-radius: .5rem; border-bottom-left-radius: .5rem; } .notification-area .list-group-item.readed { background-color: #f8f8ff; } .notification-area .list-group-item.readed .noti-icon { background: #00b894; } .notification-area .list-group-item.readed .noti-icon::before { display: none; } .notification-area .list-group-item.readed h6 { color: #747794; } .notification-area .list-group-item:hover h6, .notification-area .list-group-item:focus h6 { color: #0DD1B5; } .notification-area .unread-notifications { position: relative; z-index: 1; } .layout-options { position: relative; z-index: 1; } .layout-options a { display: inline-block; width: 36px; height: 30px; background-color: #ffffff; border-radius: 0.25rem; margin-left: .5rem; text-align: center; font-size: 1rem; color: #747794; } .layout-options a i { line-height: 30px; } .layout-options a:hover, .layout-options a:focus, .layout-options a.active { color: #ffffff; background-color: #ea4c62; } .settings-card { margin-bottom: 0.5rem; border-radius: 0.75rem; } .settings-card .card-body { padding: 0.75rem 1rem; } .settings-card:last-child { margin-bottom: 0; } .single-settings { position: relative; z-index: 1; } .single-settings .title { font-size: 14px; } .single-settings .title i { width: 22px; height: 22px; display: inline-block; background-color: #8A4821; text-align: center; color: #ffffff; line-height: 22px; border-radius: .25rem; margin-right: .5rem; font-size: 14px; } .single-settings .title span span { font-size: 10px; margin-left: 0.5rem; } .single-settings .data-content { font-size: 13px; font-weight: 700; } .single-settings .data-content a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .single-settings .data-content i { margin-left: 0.25rem; } .single-settings .toggle-button-cover { position: relative; z-index: 1; } .single-settings .knobs, .single-settings .layer { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .single-settings .button.r { position: relative; width: 45px; height: 21px; overflow: hidden; border: 1px solid #ebebeb; } .single-settings .button.r, .single-settings .button.r .layer { border-radius: 100px; } .single-settings .checkbox { position: relative; width: 100%; height: 100%; padding: 0; margin: 0; opacity: 0; cursor: pointer; z-index: 3; } .single-settings .knobs { z-index: 2; } .single-settings .layer { width: 100%; background-color: transparent; transition: 0.3s ease all; z-index: 1; } .single-settings .knobs:before { content: ''; position: absolute; top: 2px; left: 2px; width: 15px; height: 15px; background-color: #ea4c62; border-radius: 50%; transition: 0.3s ease all, left 0.3s cubic-bezier(0.18, 0.89, 0.35, 1.15); } .single-settings .checkbox:active + .knobs:before { width: 45px; border-radius: 100px; } .single-settings .checkbox:checked:active + .knobs:before { margin-left: -26px; } .single-settings .checkbox:checked + .knobs:before { content: ''; left: 24px; background-color: #0DD1B5; } .single-settings .checkbox:checked ~ .layer { background-color: #f8f8ff; } .language-area-wrapper, .shipping-method-choose { position: relative; } .language-area-wrapper ul, .shipping-method-choose ul { list-style: none; margin: 0; padding: 0; } .language-area-wrapper ul li, .shipping-method-choose ul li { display: block; position: relative; z-index: 1; width: 100%; } .language-area-wrapper ul li input[type=radio], .shipping-method-choose ul li input[type=radio] { position: absolute; visibility: hidden; } .language-area-wrapper ul li label, .shipping-method-choose ul li label { display: block; position: relative; padding: 10px 10px 10px 45px; z-index: 9; cursor: pointer; transition: all 0.25s linear; margin-bottom: 0; border-radius: 0.4rem; font-size: 14px; font-weight: 700; } .language-area-wrapper ul li label span, .shipping-method-choose ul li label span { font-size: 11px; margin-left: 0.5rem; } .language-area-wrapper ul li .check, .shipping-method-choose ul li .check { display: block; position: absolute; border: 4px solid #00b894; border-radius: 100%; height: 20px; width: 20px; top: 50%; margin-top: -10px; left: 15px; z-index: 5; transition: all .25s linear; } .language-area-wrapper ul li .check::before, .shipping-method-choose ul li .check::before { display: block; position: absolute; content: ''; border-radius: 100%; height: 8px; width: 8px; top: 50%; left: 50%; margin: -4px; transition: background 0.25s linear; } .language-area-wrapper input[type=radio]:checked ~ .check, .shipping-method-choose input[type=radio]:checked ~ .check { border-color: #0DD1B5; } .language-area-wrapper input[type=radio]:checked ~ .check::before, .shipping-method-choose input[type=radio]:checked ~ .check::before { background: #0DD1B5; } .language-area-wrapper input[type=radio]:checked ~ label, .shipping-method-choose input[type=radio]:checked ~ label { color: #0DD1B5; background-color: rgba(16, 13, 209, 0.103); } .user-info-card { position: relative; z-index: 1; background-color: #924706; background-image: linear-gradient(147deg, #b0c5df 0%, #007bfe 74%); border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .user-info-card .user-profile { position: relative; z-index: 1; width: 80px; height: 80px; border-radius: 50%; } .user-info-card .user-profile img { border-radius: 50%; } .single-profile-data { position: relative; z-index: 1; margin-bottom: 1.25rem; } .single-profile-data:last-child { margin-bottom: 0; } .single-profile-data .title { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; width: 50%; max-width: 50%; font-size: 12px; color: #020310; } .single-profile-data .title i { width: 22px; height: 22px; display: inline-block; background-color: #8A4821; text-align: center; color: #ffffff; line-height: 23px; border-radius: .25rem; margin-right: .4rem; font-size: 12px; } .single-profile-data .title span { line-height: 1; } .single-profile-data .data-content { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; width: 50%; max-width: 50%; font-size: 13px; text-align: right; color: #747794; } .user-data-card { position: relative; z-index: 1; border-color: #ffffff; border-top-left-radius: 0; border-top-right-radius: 0; } .user-data-card .card-body { padding: 1.25rem; } .user-data-card .title { font-size: 13px; color: #020310; font-weight: 500; margin-bottom: 0; } .user-data-card .title i { width: 24px; height: 24px; display: inline-block; background-color: #00b894; text-align: center; color: #ffffff; line-height: 24px; border-radius: .25rem; margin-right: .4rem; font-size: 14px; } .user-data-card .form-control { height: 36px; padding: 0 15px; color: #747794; font-size: 13px; } .user-data-card textarea.form-control { height: auto; padding: 15px; } .change-user-thumb { position: absolute; z-index: 1; width: 30px; height: 30px; bottom: 0; right: 0; } .change-user-thumb input { position: absolute; width: 100%; height: 100%; top: 0; right: 0; z-index: 10; opacity: 0; } .change-user-thumb button { width: 100%; height: 100%; background-color: #f8f8ff; border: none; border-radius: 50%; position: absolute; top: 0; right: 0; font-size: 14px; z-index: 1; border: 1px solid #ebebeb; } .support-wrapper .faq-heading { background: #0DD1B5; background: -webkit-linear-gradient(to right, #0DD1B5, #00b894); background: linear-gradient(to right, #0DD1B5, #00b894); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: 800; } .accordian-card { position: relative; z-index: 1; } .accordian-card .card-body { padding: 1.25rem; } .accordian-card p { padding-left: 35px; } .accordian-card p:last-child { margin-bottom: 0; } .accordian-card .accordian-header.collapse { display: block; } .accordian-card .accordian-header button { color: #0DD1B5; text-align: left; padding-left: 0; padding-right: 0; } .accordian-card .accordian-header button span i { width: 30px; height: 30px; border-radius: 50%; background-color: #0DD1B5; display: inline-block; text-align: center; line-height: 30px; color: #ffffff; margin-right: 0.5rem; font-size: 1rem; } .accordian-card .accordian-header button > i { color: #747794; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } .accordian-card .accordian-header button:hover, .accordian-card .accordian-header button:focus { color: #0DD1B5; } .accordian-card .accordian-header button.collapsed > span { color: #020310; } .accordian-card .accordian-header button.collapsed > i { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); } .accordian-card.seller-card .accordian-header button span i { background-color: #ea4c62; } .accordian-card.others-card .accordian-header button span i { background-color: #00b894; } .single-product-slide, .blog-details-post-thumbnail { position: relative; z-index: 1; width: 100%; height: 380px; background-position: center center; background-size: cover; } @media only screen and (min-width: 480px) and (max-width: 767px) { .single-product-slide, .blog-details-post-thumbnail { height: 450px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .single-product-slide, .blog-details-post-thumbnail { height: 500px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .single-product-slide, .blog-details-post-thumbnail { height: 520px; } } @media only screen and (min-width: 1200px) { .single-product-slide, .blog-details-post-thumbnail { height: 600px; } } .catagory-single-img { position: relative; z-index: 1; width: 100%; height: 180px; background-position: center center; background-size: cover; } @media only screen and (min-width: 576px) and (max-width: 767px) { .catagory-single-img { height: 210px; } } @media only screen and (min-width: 768px) and (max-width: 991px) { .catagory-single-img { height: 240px; } } @media only screen and (min-width: 992px) and (max-width: 1199px) { .catagory-single-img { height: 270px; } } @media only screen and (min-width: 1200px) { .catagory-single-img { height: 310px; } } .faq-search-form { position: relative; z-index: 1; } .faq-search-form input { border-radius: 60px; padding-left: 40px; font-weight: 700; } .faq-search-form input:focus { border-color: transparent; } .faq-search-form button { position: absolute; width: 50px; height: 50px; border: 0; background-color: transparent; text-align: center; top: 0; left: 0; z-index: 10; outline: none !important; } .live-chat-intro { margin-top: 55px; position: relative; z-index: 1; background-color: #000; /*background-image: linear-gradient(147deg, #b0c5df 0%, #007bfe 74%); padding: 2rem 0; text-align: center; border-radius: 0 0 3rem 3rem;*/ } .live-chat-intro p { color: #ffffff; margin-bottom: 0.5rem; } /* .live-chat-intro img { width: 50px; height: 50px; border-radius: 50%; margin: 0 auto .5rem; display: block; }*/ .live-chat-intro .status { position: relative; z-index: 1; color: #ffffff; font-size: 14px; display: inline-block; } .live-chat-intro .status.online { padding-left: 15px; } .live-chat-intro .status.online::after { position: absolute; width: 10px; height: 10px; background-color: #00b894; border-radius: 50%; content: ""; margin-top: -5px; top: 50%; left: 0; z-index: 10; } .agent-message-content { position: relative; z-index: 1; margin-bottom: 1rem; } .agent-message-content .agent-thumbnail { -webkit-box-flex: 0; -ms-flex: 0 0 30px; flex: 0 0 30px; max-width: 30px; width: 30px; } .agent-message-content .agent-thumbnail img { width: 30px; height: 30px; border-radius: 50%; box-shadow: 0 1px 3px 0 rgba(15, 15, 15, 0.175); background-color: #ffffff; padding: 2px; } .agent-message-content .agent-message-text { position: relative; z-index: 1; } .agent-message-content .agent-message-text span { font-size: 12px; color: #747794; margin-left: 0.5rem; margin-top: 0.25rem; display: block; } .agent-message-content .agent-message-text p { display: inline-block; margin-bottom: 0; background-color: #ffffff; padding: .75rem 1rem .65rem; border-radius: 1rem 1rem 1rem 0.25rem; } .user-message-content { position: relative; z-index: 1; text-align: right; margin-bottom: 1rem; } .user-message-content .user-message-text { padding-left: 3rem; } .user-message-content .user-message-text p { display: inline-block; margin-bottom: 0; padding: .75rem 1rem .65rem; background-color: #0DD1B5; color: #ffffff; border-radius: 1rem 1rem 0.25rem 1rem; } .user-message-content .user-message-text span { font-size: 12px; display: block; color: #747794; margin-right: 0.5rem; margin-top: 0.25rem; } .type-text-form { position: fixed; width: 100%; height: 55px; bottom: 0; left: 0; background-color: #ffffff; z-index: 99999; } .type-text-form .form-control { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; width: 100%; height: 55px; border-color: transparent; color: #747794; font-size: 13px; padding-top: 17px; padding-bottom: 17px; padding-left: 40px; } .type-text-form .form-control:focus { border-color: transparent; } .type-text-form button[type="submit"] { position: absolute; width: 40px; height: 55px; top: 0; right: 0; z-index: 30; border: 0; background-color: #ffffff; font-size: 1rem; color: #020310; outline: none !important; } .type-text-form .file-upload { position: absolute; width: 40px; height: 55px; top: 0; left: 0; z-index: 20; } .type-text-form .file-upload input { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 200; opacity: 0; } .type-text-form .file-upload span { position: absolute; top: 0; left: 0; background-color: #ffffff; height: 100%; width: 100%; z-index: 50; text-align: center; line-height: 55px; } .single-order-status { position: relative; z-index: 1; margin-bottom: 1rem; } .single-order-status:last-child { margin-bottom: 0; } .single-order-status .card-body { padding: 0.75rem 1rem; } .single-order-status .order-icon { color: #020310; margin-right: .5rem; } .single-order-status .order-icon i { font-size: 1.125rem; } .single-order-status .order-status { color: #020310; font-size: 14px; font-weight: 700; } .single-order-status .order-status .order-date { font-size: 10px; color: #020310; margin-left: 0.5rem; } .cart-table { position: relative; z-index: 1; } .cart-table table { max-width: 100%; } .cart-table table tbody tr { background-color: #ffffff; border-bottom: 2px dashed #ebebeb; } .cart-table table tbody tr:last-child { border-bottom: 0; } .cart-table table a { color: #020310; font-weight: 700; } .cart-table table a.remove-product { color: #ffffff; width: 24px; height: 24px; background-color: #ea4c62; display: inline-block; text-align: center; line-height: 25px; border-radius: 50%; font-size: 10px; } .cart-table table a.remove-product:hover, .cart-table table a.remove-product:focus { color: #ffffff; background-color: #020310; } .cart-table table a span { display: block; color: #747794; } .cart-table table a:hover, .cart-table table a:focus { color: #0DD1B5; } .cart-table .table td, .cart-table .table th { vertical-align: middle; color: #747794; font-size: 12px; padding: 1rem .5rem; border: 0; } .cart-table img { max-width: 2.5rem; border: 1px solid #ebebeb; } .cart-table .qty-text { border: 2px solid #ebebeb; width: 2.5rem; text-align: center; height: 2rem; border-radius: .25rem; -webkit-transition-duration: 300ms; -o-transition-duration: 300ms; transition-duration: 300ms; font-weight: 700; } .cart-table .qty-text:focus { border-color: #0DD1B5; } .coupon-card .card-body { padding: 1.25rem; } .cart-amount-area .card-body { padding: .75rem 1.25rem; } .apply-coupon { position: relative; z-index: 1; } .apply-coupon p { font-size: 12px; } .coupon-form { position: relative; z-index: 1; } .coupon-form .form-control { height: 34.4px; padding: 5px 15px; font-size: 12px; border-radius: .4rem; } .coupon-form button { position: absolute; top: 0; right: 0; z-index: 10; } .billing-information-card { position: relative; z-index: 1; } .billing-information-title-card { border-radius: 1rem 1rem 0 0; border-color: #ea4c62; } .shipping-method-choose-title-card { border-radius: 1rem 1rem 0 0; border-color: #00b894; } .shipping-method-choose-card { border-radius: 0 0 1rem 1rem; border-color: #ffffff; } .single-payment-method a { display: block; position: relative; z-index: 1; background-color: #ffffff; text-align: center; padding: 3rem 1rem; border-radius: 0.75rem; } .single-payment-method a i { font-size: 3rem; margin-bottom: .5rem; display: block; } .single-payment-method a h6 { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; margin-bottom: 0; } .single-payment-method a:hover, .single-payment-method a:focus { box-shadow: 0 5px 11px rgba(15, 15, 15, 0.175); } .single-payment-method a:hover h6, .single-payment-method a:focus h6 { color: #0DD1B5; } .credit-card-info-wrapper img { margin: 0 auto; max-width: 300px; } .pay-credit-card-form { position: relative; z-index: 1; } .pay-credit-card-form label { font-size: 12px; font-weight: 700; margin-left: 0.25rem; text-transform: uppercase; } .pay-credit-card-form small { font-size: 11px; } .pay-credit-card-form .form-control { height: 44px; padding-top: 5px; padding-bottom: 5px; box-shadow: 0 1px 1px 0px #d7def4; } .bank-ac-info .list-group-item { font-size: 14px; } .order-success-wrapper { position: relative; width: 100%; background: #0DD1B5; background: -webkit-linear-gradient(to left, #0DD1B5, #0d3bd1); background: linear-gradient(to left, #0DD1B5, #0d3bd1); height: 100vh; top: 0; left: 0; z-index: 2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; padding: 1rem 3rem; } .order-success-wrapper i { display: inline-block; font-size: 3rem; margin-bottom: 1rem; color: #ffffff; } .order-success-wrapper h5 { color: #ffffff; } .order-success-wrapper p { margin-bottom: 0; font-size: 13px; color: #ffffff; } .product-slides { position: relative; z-index: 1; margin-bottom: -40px; } .product-slides .owl-prev, .product-slides .owl-next { position: absolute; width: 30px; height: 30px; background-color: transparent; text-align: center; line-height: 30px; z-index: 10; top: 50%; margin-top: -15px; left: 15px; font-size: 20px; color: #0DD1B5; } .product-slides .owl-prev.disabled, .product-slides .owl-next.disabled { opacity: 0; visibility: hidden; } .product-slides .owl-next { left: auto; right: 15px; } .product-slides .owl-dots { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: absolute; width: 100%; left: 0; bottom: 1rem; z-index: 10; } .product-slides .owl-dots .owl-dot { -webkit-transition-duration: 300ms; -o-transition-duration: 300ms; transition-duration: 300ms; -webkit-box-flex: 0; -ms-flex: 0 0 12px; flex: 0 0 12px; width: 12px; max-width: 12px; height: 2px; background-color: #ebebeb; margin: 0 5px; } .product-slides .owl-dots .owl-dot.active { -webkit-box-flex: 0; -ms-flex: 0 0 24px; flex: 0 0 24px; width: 24px; max-width: 24px; background-color: #ffaf00; } .product-title-meta-data { border-top-left-radius: 3rem; padding-top: 1.5rem !important; } .product-title-meta-data::after { position: absolute; content: ""; background-image: url(img/core-img/curve.png); top: -121px; width: 142px; height: 121px; background-repeat: no-repeat; right: 0; z-index: auto; } .product-title-meta-data .p-wishlist-share { -webkit-box-flex: 0; -ms-flex: 0 0 80px; flex: 0 0 80px; width: 80px; max-width: 80px; text-align: right; } .product-description { position: relative; z-index: 1; } .product-description .sale-price { font-size: 18px; font-weight: 700; margin-bottom: 0.5rem; color: #ea4c62; } .product-description .sale-price span { margin-left: 0.5rem; color: #747794; text-decoration: line-through; font-size: 1rem; } .product-description .ratings i { color: #ffaf00; font-size: 12px; margin-right: 3px; } .product-description .ratings span { font-size: 12px; color: #747794; } .product-description .total-result-of-ratings span:first-child { background-color: #00b894; padding: 3px 6px; color: #ffffff; display: inline-block; border-radius: .25rem; font-size: 12px; margin-right: 0.25rem; font-weight: 700; } .product-description .total-result-of-ratings span:last-child { color: #00b894; font-size: 12px; font-weight: 700; } .cart-form { position: relative; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; } .cart-form .form-control { max-width: 50px; height: 35px; margin-right: 0.5rem; margin-left: 0.5rem; text-align: center; font-weight: 700; padding: 0.375rem 0.5rem; } .cart-form .quantity-button-handler { width: 35px; height: 35px; background-color: #f8f8ff; border: 1px solid #ebebeb; color: #020310; line-height: 33px; font-size: 1.25rem; text-align: center; border-radius: 0.25rem; cursor: pointer; -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; } .cart-form .quantity-button-handler:hover { color: #0DD1B5; } .p-wishlist-share a { display: inline-block; color: #ea4c62; font-size: 1.5rem; } .choose-color-radio .form-check-input { border: 0; background-color: #f8f8ff; } .choose-color-radio .form-check-input.blue { background-color: #0DD1B5; } .choose-color-radio .form-check-input.yellow { background-color: #ffaf00; } .choose-color-radio .form-check-input.green { background-color: #00b894; } .choose-color-radio .form-check-input.purple { background-color: #ea4c62; } .choose-color-radio .form-check-input:checked { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"); } .choose-size-radio { position: relative; z-index: 1; text-align: right; } .choose-size-radio .form-check-input { background-color: #f8f8ff; border-radius: 0.25rem; } .choose-size-radio .form-check-input:checked { background-color: #ea4c62; border-color: #ea4c62; background-image: none; } .choose-size-radio .form-check-label { font-size: 12px; font-weight: 700; } .p-specification { position: relative; z-index: 1; } .p-specification li { font-size: 14px; } .single-user-review { position: relative; z-index: 1; border-bottom: 2px dashed #ebebeb; margin-bottom: 1rem; padding-bottom: 1rem; } .single-user-review:last-child { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; } .single-user-review .user-thumbnail { margin-top: 0.5rem; -webkit-box-flex: 0; -ms-flex: 0 0 40px; flex: 0 0 40px; width: 40px; max-width: 40px; margin-right: .5rem; } .single-user-review .user-thumbnail img { border-radius: 50%; } .single-user-review .rating { font-size: 12px; color: #ffaf00; } .single-user-review .name-date { display: block; font-size: 11px; } .ratings-submit-form { position: relative; z-index: 1; } .ratings-submit-form textarea.form-control { height: 80px; font-size: 14px; } .ratings-submit-form .stars { background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAABaCAYAAACv+ebYAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNXG14zYAAAAWdEVYdENyZWF0aW9uIFRpbWUAMDcvMDMvMTNJ3Rb7AAACnklEQVRoge2XwW3bMBSGPxa9NxtIGzTAW8DdRL7o3A0qb+BrdNIm9QAm0G7gbJBMwB5MoVJNUSRFIXGqHwhkmXr68hOPNH9ljOEt9OlNqBs4RlrrSmtdpdZ/Ti0EGnvtUoqTHFunBVCkuk6d6mbi83rggdteSa5THDeB3+UDO9z2inatXFum1roESuAReAB29vp15n2/gRfgZK+/gIuIXLxgrfUO+Bnzn0fom4ic+pvRVNuB/QrQ/RB6A7bwLjN8b985krO5MsKd0ElwJvgk1AteCPdCYWI5/SutddQxRUTU3DOzG4hd01EKqQnZuaLBITUh4F0CeLYm5CDw6PjuFTjaz9+BLwE1I8VO9StwAEoRaUSkseMHO+aqcWq2qwcdfQCOIvIy8dwDV/c/YL6zvWDbnQ3QuH5hltQEreM1dH/n6g28gT8eWLVUqqVKrb+vtGidFkCR6vp+0uLAba8k1/eRFh1ue0W7dv4sqpaSjGnR1Fy8YNWyY8W0aGpO/c1oqu3AKmlxCL0BW3iXGb637xzJ2VwZ4U7oJDgTfBLqBS+Ee6EQeMpULVFHUVOzPC3aNR2lkJotLbr0vtKiqWlMTcNaaXHQ0QfgaGqcaVG1jNLibGcbYyb/eDIlT6bjyZS+51JqtrS4gTfw/wzWqkKrKrU8fQPR6gKAmDKlPM3x1WkBFKmu0xxf3fZR5jnFdbzjv257JbmOdzx22yvadZzjW7e9ol27HWtVkjEtIubiB2u1Y8W0iJhTfzOe6uvAKmlxCL0FX+FdZvjevnMkd3Plgzuh0+A88EmoH7wM7oVC6AaiVdwuI2Z5WrRrOk4BNVtadOl9pUXENIhpWCstDjr6ABwR40yLaDVKi7Od7U1/Z0pzpjNngtNiaM2WFj8++A+motm0NTqjmwAAAABJRU5ErkJggg==") repeat-x 0 0; width: 150px; } .ratings-submit-form .stars:before, .ratings-submit-form .stars:after { display: table; content: ""; } .ratings-submit-form .stars:after { clear: both; } .ratings-submit-form .stars input[type="radio"] { position: absolute; opacity: 0; } .ratings-submit-form .stars input[type="radio"].star-5:checked ~ span { width: 100%; } .ratings-submit-form .stars input[type="radio"].star-4:checked ~ span { width: 80%; } .ratings-submit-form .stars input[type="radio"].star-3:checked ~ span { width: 60%; } .ratings-submit-form .stars input[type="radio"].star-2:checked ~ span { width: 40%; } .ratings-submit-form .stars input[type="radio"].star-1:checked ~ span { width: 20%; } .ratings-submit-form .stars label { display: block; width: 30px; height: 30px; margin: 0 !important; padding: 0 !important; text-indent: -99999rem; float: left; position: relative; z-index: 10; background: transparent !important; cursor: pointer; } .ratings-submit-form .stars label:hover ~ span { background-position: 0 -30px; } .ratings-submit-form .stars label.star-5:hover ~ span { width: 100% !important; } .ratings-submit-form .stars label.star-4:hover ~ span { width: 80% !important; } .ratings-submit-form .stars label.star-3:hover ~ span { width: 60% !important; } .ratings-submit-form .stars label.star-2:hover ~ span { width: 40% !important; } .ratings-submit-form .stars label.star-2:hover ~ span { width: 20% !important; } .ratings-submit-form .stars span { display: block; width: 0; position: relative; top: 0; left: 0; height: 30px; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAABaCAYAAACv+ebYAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNXG14zYAAAAWdEVYdENyZWF0aW9uIFRpbWUAMDcvMDMvMTNJ3Rb7AAACnklEQVRoge2XwW3bMBSGPxa9NxtIGzTAW8DdRL7o3A0qb+BrdNIm9QAm0G7gbJBMwB5MoVJNUSRFIXGqHwhkmXr68hOPNH9ljOEt9OlNqBs4RlrrSmtdpdZ/Ti0EGnvtUoqTHFunBVCkuk6d6mbi83rggdteSa5THDeB3+UDO9z2inatXFum1roESuAReAB29vp15n2/gRfgZK+/gIuIXLxgrfUO+Bnzn0fom4ic+pvRVNuB/QrQ/RB6A7bwLjN8b985krO5MsKd0ElwJvgk1AteCPdCYWI5/SutddQxRUTU3DOzG4hd01EKqQnZuaLBITUh4F0CeLYm5CDw6PjuFTjaz9+BLwE1I8VO9StwAEoRaUSkseMHO+aqcWq2qwcdfQCOIvIy8dwDV/c/YL6zvWDbnQ3QuH5hltQEreM1dH/n6g28gT8eWLVUqqVKrb+vtGidFkCR6vp+0uLAba8k1/eRFh1ue0W7dv4sqpaSjGnR1Fy8YNWyY8W0aGpO/c1oqu3AKmlxCL0BW3iXGb637xzJ2VwZ4U7oJDgTfBLqBS+Ee6EQeMpULVFHUVOzPC3aNR2lkJotLbr0vtKiqWlMTcNaaXHQ0QfgaGqcaVG1jNLibGcbYyb/eDIlT6bjyZS+51JqtrS4gTfw/wzWqkKrKrU8fQPR6gKAmDKlPM3x1WkBFKmu0xxf3fZR5jnFdbzjv257JbmOdzx22yvadZzjW7e9ol27HWtVkjEtIubiB2u1Y8W0iJhTfzOe6uvAKmlxCL0FX+FdZvjevnMkd3Plgzuh0+A88EmoH7wM7oVC6AaiVdwuI2Z5WrRrOk4BNVtadOl9pUXENIhpWCstDjr6ABwR40yLaDVKi7Od7U1/Z0pzpjNngtNiaM2WFj8++A+motm0NTqjmwAAAABJRU5ErkJggg==") repeat-x 0 -60px; -webkit-transition: width 0.5s; -o-transition: width 0.5s; transition: width 0.5s; } .add2cart-notification { position: fixed; bottom: 58px; width: 100%; height: 30px; background-color: #00b894; z-index: 1000; color: #ffffff; text-align: center; font-size: 12px; line-height: 30px; font-weight: 700; } .discount-coupon-card { position: relative; z-index: 1; background-color: #ea4c62 !important; } .discount-coupon-card .coupon-text-wrap h5 { border-right: 1px solid rgba(255, 255, 255, 0.75); } .offline-area-wrapper { position: relative; z-index: 1; width: 100%; height: calc(100vh - 108px); } .offline-area-wrapper i { font-size: 3rem; display: block; margin-bottom: 1rem; } .sales-offer-content { position: relative; z-index: 1; } .sales-offer-content .sales-end { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; width: 60%; } .sales-offer-content .sales-volume { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; width: 40%; } .sales-offer-content .sales-end-timer li { line-height: 1; margin-left: 0.5rem; color: #ea4c62; font-weight: 700; font-size: 13px; } .sales-offer-content .sales-end-timer li:first-child { margin-left: 0; } .sales-offer-content .sales-end-timer li span { margin-right: 0.125rem; color: #ea4c62; } .sales-offer-content .sales-volume .progress { border-radius: 100px; } /* Footer CSS */ .footer-nav-area { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; background-color: #333331; width: 100%; height: 58px; position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000; box-shadow: 0 -6px 12px rgba(15, 15, 15, 0.15); } .footer-nav-area.footer-out { bottom: -100px; } .suha-footer-nav ul { width: 100%; } .suha-footer-nav ul li { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; width: 20%; position: relative; z-index: 1; } .suha-footer-nav ul li a { position: relative; display: block; font-size: 12px; text-align: center; font-weight: normal; text-transform: capitalize; line-height: 1; color: #959595; z-index: 1; } .suha-footer-nav ul li a i { display: block; font-size: 18px; margin-bottom: 4px; } .suha-footer-nav ul li a:hover, .suha-footer-nav ul li a:focus { color: #dcb156; } .suha-footer-nav ul li a img { max-height: 1.5rem; margin: 0 auto .25rem; display: block; } .suha-footer-nav ul li.active a { color: #0DD1B5; } /* Cta Area */ .cta-area { position: relative; z-index: 2; } .cta-area .cta-text { position: relative; z-index: 1; border-radius: 0.75rem; background-size: cover; background-position: center top; } .cta-area .cta-text p, .cta-area .cta-text h4 { color: #ffffff; } .cta-area .cta-text::after { width: 100%; height: 100%; top: 0; left: 0; position: absolute; content: ""; background: #0DD1B5; background: -webkit-linear-gradient(to left, #0DD1B5, #0d3bd1); background: linear-gradient(to left, #0DD1B5, #0d3bd1); z-index: -10; border-radius: 0.75rem; opacity: .75; } /* Register CSS */ .login-wrapper { position: relative; width: 100%; min-height: 100vh; background-image: url(backgraund.png); /*background: #0cc5b7;*/ /*background: -webkit-linear-gradient(to left, #0cc5b7, #0d9bbf);*/ /*background: linear-gradient(to left, #0cc5b7, #0d9bbf);*/ /*background-image: linear-gradient(to right, #b82a29 , #262020);*/ z-index: 10; overflow-y: auto; background-repeat: round; background-position-x: initial; padding-top: 1rem; padding-bottom: 1rem; overflow-x: hidden; } .login-wrapper .background-shape { position: absolute; width: 320px; height: 320px; border-radius: 50%; background-color: #ffffff; opacity: 0.175; z-index: -1; top: -130px; right: -85px; } .login-wrapper .success-check { color: #ffffff; margin: 0 auto; } .login-wrapper .success-check i { font-size: 3rem; } .register-form { position: relative; background: #000000; border-radius: 30px 30px 0 0; height: 73vh; z-index: 1; } .register-form .form-group { position: relative; z-index: 1; } .register-form span { color: #ffffff; font-size: 12px; display: block; } .register-form form > .form-group > label { position: absolute; text-align: center; z-index: 100; border-radius: 50%; left: 10px; font-size: 19px; margin-bottom: 0; color: #ffffff; top: 12px; } .register-form .form-control { background: #4b4b4b; border-radius: 12px; border: 0; color: #fff; font-size: 13px; /*background-color: transparent;*/ height: 50px; padding: 8px 8px 8px 22px; /*box-shadow: 12px 12px 32px rgba(13, 39, 80, 0.25), -10px -10px 15px white !important; border-bottom: 1px solid rgba(255, 255, 255, 0.15);*/ } .register-form .form-control::placeholder { color: #262020; background: #4b4b4b; } .register-form .progress { width: 100%; height: 5px; margin-top: 1rem; border-radius: 0.75rem; margin-bottom: 0.25rem; } .register-form .password-score { font-size: 14px; font-weight: 700; color: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; } .register-form .password-score span { font-size: 18px; margin-left: 1rem; } .register-form .password-recommendation { display: none !important; } .register-form #password-recommendation-heading { font-weight: 700; color: #00b894; font-size: 16px; } .view-as-guest .btn { color: #fed068; opacity: 0.65; text-transform: none;; font-size: 12px; letter-spacing: 1px; } .view-as-guest .btn:hover, .view-as-guest .btn:focus { opacity: 1; } .login-meta-data a { font-size: 14px; color: #ffffff; font-weight: 500; } .login-meta-data a:hover, .login-meta-data a:focus { color: #ffaf00; } .login-meta-data p { color: #cac6c6; } .login-meta-data p a { color: #fed169; font-weight: bold; } .login-meta-data p a:hover, .login-meta-data p a:focus { color: #ffaf00; } .go-back-btn { -webkit-transition-duration: 400ms; -o-transition-duration: 400ms; transition-duration: 400ms; position: fixed; top: 30px; right: 30px; background-color: #ea4c62; width: 40px; height: 40px; border-radius: 50%; text-align: center; color: #ffffff; line-height: 42px; z-index: 10; cursor: pointer; } .go-back-btn:hover, .go-back-btn:focus { background-color: #0DD1B5; color: #ffffff; } .otp-form { position: relative; z-index: 1; } .otp-form .form-control { padding: 0.5rem 0.75rem; border: 0; font-size: 14px; background-color: rgba(255, 255, 255, 0.25); font-weight: 700; color: #ffffff; border-radius: 0.5rem; } .otp-form .form-control::placeholder { color: #262020; opacity: 0.5; } .otp-form select.form-select { padding: 0.5rem 0.75rem; height: 50px; border: 0; font-size: 14px; background-color: rgba(255, 255, 255, 0.25); font-weight: 700; color: #ffffff; border-radius: 0.5rem; border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; -webkit-box-flex: 0; -ms-flex: 0 0 80px; flex: 0 0 80px; max-width: 80px; width: 80px; } .otp-form select.form-select:focus { box-shadow: none !important; } .otp-form select option { background-color: #0DD1B5; } .otp-form input.form-control { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; } .otp-verify-form { position: relative; z-index: 1; } .otp-verify-form .form-control { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; -webkit-box-flex: 0; -ms-flex: 0 0 50px; flex: 0 0 50px; max-width: 50px; width: 50px; padding: 12px; border: 0; text-align: center; font-size: 1.25rem; background-color: rgba(255, 255, 255, 0.25); color: #ffffff; font-weight: 700; } .otp-verify-form .form-control::placeholder { color: #262020; opacity: 0.5; } .otp-verify-form .form-control:focus { background-color: #ffaf00; color: #020310; } .otp-sec { font-weight: 500; } .contact-wrap { position: relative; width: 100%; min-height: 100vh; z-index: 10; overflow-y: auto; padding-top: 1rem; padding-bottom: 1rem; overflow-x: hidden; background-color: #e7eaf5; } .contact-form { position: relative; z-index: 1; } .contact-form .form-group { position: relative; z-index: 1; } .contact-form form > .form-group > label { position: absolute; text-align: center; z-index: 100; border-radius: 50%; left: 10px; font-size: 16px; margin-bottom: 0; color: #747794; top: 11px; } .contact-form .form-control { border-radius: 0.5rem; border: 0; color: #747794; font-size: 13px; background-color: #ffffff; height: 46px; padding: 0.75rem 1.25rem; } .contact-form .form-control::placeholder { color: #262020; opacity: 1; } .contact-form textarea.form-control { height: 120px; } .google-maps-wrap { position: relative; z-index: 1; } .google-maps-wrap iframe { width: 100%; height: 300px; border: 0; } /* Contact CSS */ .form-control { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; border-color: #ebebeb; height: 50px; padding: 0.375rem 1rem; font-size: 14px; } .form-control:focus { box-shadow: none; } /* Blog CSS */ .post-bookmark-wrap { position: relative; z-index: 1; } .blog-card { position: relative; z-index: 1; border: 0; } .blog-card .post-img { position: relative; z-index: 1; border-radius: 0.75rem; } .blog-card .post-img img { border-radius: 0.75rem; } .blog-card .post-img::after { position: absolute; width: 100%; height: 100%; top: 0; left: 0; content: ""; background-color: #020310; opacity: 0.3; z-index: 1; border-radius: 0.75rem; } .blog-card .post-bookmark { position: absolute; z-index: 100; color: #ffffff; top: .5rem; right: .5rem; width: 30px; height: 30px; border-radius: 50%; background-color: transparent; text-align: center; } .blog-card .post-bookmark i { line-height: 30px; } .blog-card .post-bookmark:hover, .blog-card .post-bookmark:focus { background-color: rgba(255, 255, 255, 0.2); } .blog-card .post-content { position: absolute !important; width: calc(100% - 1rem); bottom: .5rem; left: .5rem; z-index: 100; border-radius: .5rem; background-color: #ffffff; padding: .75rem; overflow: hidden; } .blog-card .post-content .bg-shapes .circle1 { width: 30px; height: 30px; position: absolute; border-radius: 50%; top: -15px; right: -15px; background-color: transparent; border: 1px solid #ebebeb; z-index: -1; } .blog-card .post-content .bg-shapes .circle2 { width: 50px; height: 50px; position: absolute; border-radius: 50%; top: -25px; right: -25px; background-color: transparent; border: 1px solid #ebebeb; z-index: -1; } .blog-card .post-content .bg-shapes .circle3 { width: 70px; height: 70px; position: absolute; border-radius: 50%; top: -35px; right: -35px; background-color: transparent; border: 1px solid #ebebeb; z-index: -1; } .blog-card .post-content .bg-shapes .circle4 { width: 90px; height: 90px; position: absolute; border-radius: 50%; top: -45px; right: -45px; background-color: transparent; border: 1px solid #ebebeb; z-index: -1; } .blog-card .post-content .post-catagory { font-size: 11px; text-transform: uppercase; font-weight: 700; color: #ea4c62; margin-bottom: 0.125rem; letter-spacing: .5px; } .blog-card .post-content .post-title { font-size: 14px; font-weight: 700; line-height: 1.3; color: #020310; margin-bottom: .5rem; overflow: hidden; height: 38px; } .blog-card .post-content .post-title:hover, .blog-card .post-content .post-title:focus { color: #0DD1B5; } .blog-card .post-content .post-meta { position: relative; z-index: 1; } .blog-card .post-content .post-meta a { font-size: 10px; line-height: 1; color: #747794; } .blog-card .post-content .post-meta a:hover, .blog-card .post-content .post-meta a:focus { color: #0DD1B5; } .blog-card .post-content .post-meta a i { margin-right: 0.25rem; } .blog-card .post-content .post-meta span { font-size: 10px; line-height: 1; color: #747794; } .blog-card .post-content .post-meta span i { margin-right: 0.25rem; } .blog-card.list-card .post-content { width: calc(50% - 1rem); bottom: .75rem; left: .75rem; } .blog-card.list-card .post-bookmark { top: .75rem; right: .75rem; } .blog-card.list-card .read-more-btn { position: absolute; min-width: 100px; right: .75rem; bottom: .75rem; z-index: 99; } .blog-catagory-card { position: relative; z-index: 1; } .blog-catagory-card a { display: block; } .blog-catagory-card a i { color: #0DD1B5; font-size: 2rem; margin-bottom: 1rem; display: block; } .blog-catagory-card a span { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; color: #747794; text-transform: uppercase; font-size: 12px; font-weight: 700; letter-spacing: .5px; } .blog-catagory-card a:hover span, .blog-catagory-card a:focus span { color: #0DD1B5; } .blog-details-post-thumbnail { position: relative; z-index: 1; margin-bottom: -40px; } .blog-details-post-thumbnail .post-bookmark { width: 35px; height: 35px; border-radius: 50%; background-color: #ea4c62; text-align: center; position: absolute; top: 1rem; left: 0; z-index: 100; color: #ffffff; } .blog-details-post-thumbnail .post-bookmark i { line-height: 35px; } .blog-details-post-thumbnail .post-bookmark:hover, .blog-details-post-thumbnail .post-bookmark:focus { background-color: #0DD1B5; color: #ffffff; } .product-title-meta-data { position: relative; z-index: 1; } .product-title-meta-data .post-catagory { text-transform: uppercase; font-size: 12px; letter-spacing: .5px; color: #ea4c62; font-weight: 700; } .post-meta-data a { color: #747794; font-size: 12px; } .post-meta-data a img { width: 24px; height: 24px; border-radius: 50%; margin-right: 0.25rem; } .post-meta-data a span { -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; padding: 3px 8px; border: 1px solid #0DD1B5; border-radius: .25rem; margin-left: 0.5rem; color: #0DD1B5; } .post-meta-data a:hover span, .post-meta-data a:focus span { border-color: #0DD1B5; color: #ffffff; background-color: #0DD1B5; } .post-meta-data span { color: #747794; font-size: 12px; } .post-meta-data span i { margin-right: 0.25rem; } .post-content p:last-child { margin-bottom: 0; } /* Night Mode */ #previewPage[data-theme="dark"] { background-color: #e7eaf5; } #previewPage[data-theme="dark"] body { background-color: #e7eaf5; } #previewPage[data-theme="dark"] .preview-iframe-wrapper .preview-hero-area .preview-content-wrapper .demo-title { color: #020310; } #previewPage[data-theme="dark"] h1, #previewPage[data-theme="dark"] h2, #previewPage[data-theme="dark"] h3, #previewPage[data-theme="dark"] h4, #previewPage[data-theme="dark"] h5, #previewPage[data-theme="dark"] h6 { color: #020310; } [data-theme="dark"] { background-color: #0C153B; } [data-theme="dark"] #preloader { background-color: #0C153B; } [data-theme="dark"] body { background-color: #0C153B; } [data-theme="dark"] a, [data-theme="dark"] a:hover, [data-theme="dark"] a:focus { color: #ffffff; } [data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3, [data-theme="dark"] h4, [data-theme="dark"] h5, [data-theme="dark"] h6 { color: var(--bs-green); } [data-theme="dark"] .header-area { background-color: #0C153B; box-shadow: 0 3px 12px rgba(255, 255, 255, 0.175); } [data-theme="dark"] .footer-nav-area { background-color: #0C153B; box-shadow: 0 -3px 12px rgba(255, 255, 255, 0.175); } [data-theme="dark"] .card { border-color: #242644; background-color: #242644; box-shadow: none; } [data-theme="dark"] .suha-footer-nav ul li a { color: rgba(255, 255, 255, 0.8); } [data-theme="dark"] .suha-footer-nav ul li.active a { color: #ffaf00; } [data-theme="dark"] .suha-footer-nav ul li a:hover, [data-theme="dark"] .suha-footer-nav ul li a:focus { color: #ffaf00; } [data-theme="dark"] .top-search-form form .form-control { background-color: transparent; border-color: rgba(255, 255, 255, 0.125); } [data-theme="dark"] .btn-warning:hover, [data-theme="dark"] .btn-warning:focus { color: #ffffff; background-color: #282958; border-color: #282958; } [data-theme="dark"] .btn-danger:hover, [data-theme="dark"] .btn-danger:focus { background-color: #282958; border-color: #282958; } [data-theme="dark"] .btn-primary:hover, [data-theme="dark"] .btn-primary:focus { background-color: #282958; border-color: #282958; } [data-theme="dark"] .btn-success:hover, [data-theme="dark"] .btn-success:focus { background-color: #282958; border-color: #282958; } [data-theme="dark"] .btn-info:hover, [data-theme="dark"] .btn-info:focus { background-color: #282958; border-color: #282958; } [data-theme="dark"] .catagory-card span { color: #ffffff; } [data-theme="dark"] .catagory-card:hover span, [data-theme="dark"] .catagory-card:focus span { color: #ffaf00; } [data-theme="dark"] .flash-sale-card .product-title { color: #ffffff; } [data-theme="dark"] .flash-sale-card:hover .product-title, [data-theme="dark"] .flash-sale-card:focus .product-title { color: #ffaf00; } [data-theme="dark"] .flash-sale-card .sale-price { color: #ffffff; } [data-theme="dark"] .flash-sale-card .progress-title { color: rgba(255, 255, 255, 0.7); } [data-theme="dark"] .top-product-card .product-title { color: #ffffff; } [data-theme="dark"] .top-product-card:hover .product-title, [data-theme="dark"] .top-product-card:focus .product-title { color: #ffaf00; } [data-theme="dark"] .top-product-card .btn:hover, [data-theme="dark"] .top-product-card .btn:focus { background-color: #ea4c62; border-color: #ea4c62; } [data-theme="dark"] .weekly-product-card .product-description .product-title { color: #ffffff; } [data-theme="dark"] .weekly-product-card:hover .product-title, [data-theme="dark"] .weekly-product-card:focus .product-title { color: #ffaf00; } [data-theme="dark"] .weekly-product-card .product-description .sale-price { color: #ffaf00; } [data-theme="dark"] .page-nav li a { background-color: #332858; color: #ffffff; } [data-theme="dark"] .page-nav li a:hover, [data-theme="dark"] .page-nav li a:focus { color: #ffaf00; } [data-theme="dark"] .cart-table table tbody tr { background-color: transparent; } [data-theme="dark"] .cart-table table a { color: #ffffff; } [data-theme="dark"] .cart-table table a:hover, [data-theme="dark"] .cart-table table a:focus { color: #ffaf00; } [data-theme="dark"] .cart-table img { border-color: rgba(255, 255, 255, 0.2); } [data-theme="dark"] .back-button a { color: #ffffff; } [data-theme="dark"] .back-button a:hover, [data-theme="dark"] .back-button a:focus { color: #ffaf00; } [data-theme="dark"] .filter-option { color: #ffaf00; } [data-theme="dark"] .catagory-sidebar-area, [data-theme="dark"] .type-text-form { background-color: #0C153B; } [data-theme="dark"] .type-text-form { box-shadow: 0 -3px 12px rgba(255, 255, 255, 0.175); } [data-theme="dark"] .type-text-form .form-control, [data-theme="dark"] .type-text-form .file-upload span, [data-theme="dark"] .type-text-form button[type="submit"] { background-color: #0C153B; } [data-theme="dark"] .type-text-form button[type="submit"] { color: #ffffff; outline: none; } [data-theme="dark"] .user-info-card { background-color: #ffaf00; border-color: #ffaf00; } [data-theme="dark"] .user-info-card h5 { color: #ffffff; } [data-theme="dark"] .user-data-card .title { color: #ffffff; } [data-theme="dark"] .cart-table table tbody tr { border-color: rgba(255, 255, 255, 0.2); } [data-theme="dark"] .pay-credit-card-form small a { color: #ffffff; } [data-theme="dark"] .pay-credit-card-form small a:hover, [data-theme="dark"] .pay-credit-card-form small a:focus { color: #ffaf00; } [data-theme="dark"] .single-payment-method a { background-color: #ea4c62; } [data-theme="dark"] .single-payment-method a h6 { color: #ffffff; } [data-theme="dark"] .single-payment-method a:hover h6, [data-theme="dark"] .single-payment-method a:focus h6 { color: #0DD1B5; } [data-theme="dark"] .billing-information-title-card { border-color: transparent; } [data-theme="dark"] .shipping-method-choose-title-card { border-color: transparent; } [data-theme="dark"] .language-area-wrapper input[type="radio"]:checked ~ label, [data-theme="dark"] .shipping-method-choose input[type="radio"]:checked ~ label { color: #ffffff; background-color: rgba(16, 13, 209, 0.7); } [data-theme="dark"] .language-area-wrapper input[type="radio"]:checked ~ .check::before, [data-theme="dark"] .shipping-method-choose input[type="radio"]:checked ~ .check::before { background: #ffffff; } [data-theme="dark"] .language-area-wrapper input[type="radio"]:checked ~ .check, [data-theme="dark"] .shipping-method-choose input[type="radio"]:checked ~ .check { border-color: #ffffff; } [data-theme="dark"] .list-group-item { background-color: #242644; border-color: #242644 !important; } [data-theme="dark"] .notification-area .list-group-item h6 { color: #ffffff; } [data-theme="dark"] .notification-area .list-group-item:hover h6, [data-theme="dark"] .notification-area .list-group-item:focus h6 { color: #ffaf00; } [data-theme="dark"] .notification-area .list-group-item.readed { background-color: #0C153B; } [data-theme="dark"] .single-settings .button.r { border-color: rgba(255, 255, 255, 0.15); } [data-theme="dark"] .single-settings .data-content a:hover, [data-theme="dark"] .single-settings .data-content a:focus { color: #ffaf00; } [data-theme="dark"] .layout-options a { background-color: #242644; } [data-theme="dark"] .layout-options a:hover, [data-theme="dark"] .layout-options a:focus, [data-theme="dark"] .layout-options a.active { background-color: #ea4c62; } [data-theme="dark"] .post-content, [data-theme="dark"] .selection-panel.bg-white, [data-theme="dark"] .product-title-meta-data.bg-white, [data-theme="dark"] .cart-form-wrapper.bg-white, [data-theme="dark"] .p-specification.bg-white, [data-theme="dark"] .rating-and-review-wrapper.bg-white, [data-theme="dark"] .ratings-submit-form.bg-white { background-color: #242644 !important; } [data-theme="dark"] .p-wishlist-share a { color: #ea4c62; } [data-theme="dark"] .p-wishlist-share a:last-child { color: #ffaf00; } [data-theme="dark"] .single-user-review { border-color: rgba(255, 255, 255, 0.2); } [data-theme="dark"] .accordian-card .accordian-header button { color: #ffaf00; } [data-theme="dark"] .accordian-card .accordian-header button.collapsed > span { color: #ffffff; } [data-theme="dark"] .faq-search-form input { border-color: transparent; } [data-theme="dark"] .top-product-card .delete-btn, [data-theme="dark"] .weekly-product-card .product-thumbnail-side .delete-btn { color: #020310; } [data-theme="dark"] .product-title-meta-data::after { background-image: url(img/core-img/curve2.png); } [data-theme="dark"] .top-product-card .wishlist-btn { color: #ea4c62; } [data-theme="dark"] .catagory-card i { color: #ffaf00; } [data-theme="dark"] .blog-catagory-card a i { color: #ffaf00; } [data-theme="dark"] .blog-catagory-card a span { color: #ffffff; } [data-theme="dark"] .blog-catagory-card a span:hover, [data-theme="dark"] .blog-catagory-card a span:focus { color: #ffaf00; } [data-theme="dark"] .post-meta-data a span { border-color: rgba(255, 255, 255, 0.7); color: rgba(255, 255, 255, 0.7); } [data-theme="dark"] .post-meta-data a span:hover, [data-theme="dark"] .post-meta-data a span:focus { border-color: #ffaf00; color: #ffaf00; } [data-theme="dark"] .ratings-submit-form textarea.form-control { border-color: rgba(255, 255, 255, 0.2); background-color: rgba(255, 255, 255, 0.2); color: #ffffff !important; } [data-theme="dark"] .blog-card .post-content .post-title { color: #ffffff; } [data-theme="dark"] .blog-card .post-content .post-title:hover, [data-theme="dark"] .blog-card .post-content .post-title:focus { color: #ffaf00; } [data-theme="dark"] .blog-card .post-content .post-meta a, [data-theme="dark"] .blog-card .post-content .post-meta span { color: rgba(255, 255, 255, 0.7); } [data-theme="dark"] .blog-card .post-content .post-meta a:hover, [data-theme="dark"] .blog-card .post-content .post-meta a:focus, [data-theme="dark"] .blog-card .post-content .post-meta span:hover, [data-theme="dark"] .blog-card .post-content .post-meta span:focus { color: #ffffff; } [data-theme="dark"] .blog-card .post-content .bg-shapes .circle1, [data-theme="dark"] .blog-card .post-content .bg-shapes .circle2, [data-theme="dark"] .blog-card .post-content .bg-shapes .circle3, [data-theme="dark"] .blog-card .post-content .bg-shapes .circle4 { border-color: rgba(255, 255, 255, 0.1); } [data-theme="dark"] .featured-product-card .product-description .product-title { color: #ffffff; } [data-theme="dark"] .featured-product-card .product-description .product-title:hover, [data-theme="dark"] .featured-product-card .product-description .product-title:focus { color: #ffaf00; } [data-theme="dark"] .cart-table .qty-text, [data-theme="dark"] .form-control { border-color: rgba(255, 255, 255, 0.2); background-color: rgba(255, 255, 255, 0.2); color: #ffffff !important; box-shadow: none !important; } [data-theme="dark"] .cart-table .qty-text::placeholder, [data-theme="dark"] .form-control::placeholder { color: #262020; opacity: 1; } [data-theme="dark"] .cart-table .qty-text option, [data-theme="dark"] .form-control option { border-color: transparent !important; background-color: #0C153B; color: #ffffff !important; } [data-theme="dark"] .register-form .form-control { background-color: transparent !important; } [data-theme="dark"] .register-form .form-control::placeholder { color: #262020; opacity: 0.7; } [data-theme="dark"] .agent-message-content .agent-message-text p { background-color: rgba(255, 255, 255, 0.2); color: #ffffff; } [data-theme="dark"] .faq-search-form button { color: #ffffff; } [data-theme="dark"] .form-check-input { background-color: #332858; } [data-theme="dark"] .cart-form .quantity-button-handler { border: transparent; background-color: #332858; color: #ffffff; } [data-theme="dark"] .flash-sale-panel { background-color: #242644 !important; } [data-theme="dark"] .btn-warning { color: #020310; } .viewTabs { padding: 0; clear: both; } .viewTabs li { display: inline; } .viewTabs li a { background: #FFF; margin: 0 5px 0 0; padding: 10px; float: left; border: 1px solid #DDD; border-bottom: none; text-decoration: none; color: #000; font-weight: bold; font-size: 12px; } .viewTabs li.active a { background: #15acdb; color: #FFF; } .content { float: left; clear: both; border: 1px solid #DDD; background: #fff; padding: 1% 2%; width: 100%; } .notification-img { height: 200px; } } .whatsappWidget { height: 2.7em; width: 2.7em; border-radius: 50%; z-index: 16; color: #fff; text-align: center; display: table; z-index: 100; transition-property: top; transition-duration: 0.3s; transition-timing-function: ease-in-out; } .widgetPosition-Bottom-Right { position: fixed; bottom: 20px; right: 15px; } .whatsappWidget .whatsappIcon { width: 100%; } .faaa { color: #790103; }