/** Shopify CDN: Minification failed

Line 129:14 Expected identifier but found whitespace
Line 129:15 Unexpected "600"
Line 3578:0 Unexpected "<"
Line 3608:0 Unexpected "<"

**/
/*-----------------------------------------------------------------------------------

    Template Name: Mimart Premium Ecommerce HTML Template
    Description: This is html5 template
    Author: Power-boosts
    Version: 1.0

-----------------------------------------------------------------------------------
    
    CSS INDEX
    ===================
	
    1. Default CSS
    2. Header Area
        2.1 Header Top Area
        2.2 Features Area
        2.3 Header Middle Area
        2.4 Mainmenu Area
    3. Slider Area
    4. Product Tab Area
    5. Banner Area
    6. Best Sell Product Area
        6.1 Best Product Slider
        6.2 Count Product Slider
    7. Newsletter Area
    8. Tab Style Two
    9. Blog Brand Area
    10. Footer Area
    11. Homepage Two
    12. Homepage Three
    13. Homepage Four
    14. Shop Page
        14.1 Shop Grid
        14.2 Shop List
    15. Product Details Page
    16. Cart Page
    17. Checkout Page
    18. Contact Page
    19. About Page
    20. Wishlist Page
    21. Blog Details Page
    22. Error Page
    23. Other CSS
        23.1 Login Modal
        23.2 Newsletter Modal
-----------------------------------------------------------------------------------*/

/*----------------------------------------*/
/*  1. Default CSS
/*----------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Lato:400,400i,600,600i,700|Open+Sans:300,400');
html, body {height: 100%; background: #fff;}
body {
	color: #959595;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
    font-family: 'Lato', sans-serif;
}
.clear{clear:both}
.fix {overflow: hidden}
.block {display: block}
.img{
    max-width: 100%;
    -webkit-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
	height:auto
}
h1, h2, h3, h4, h5, h6 {font-weight: 500; margin: 0; padding: 0; color: #303030}
a{
    -webkit-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}
a:focus{
    text-decoration: none;
    outline:0px solid;
}
a:focus,
a:hover {color: #303030; text-decoration: none;}
a:active, a:hover {outline: 0 none;}
a,
button,
input {
    outline: medium none;
    color: #383838;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s
}
button{border: 0}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a{color: inherit}
label {
    font-size: 15px;
    font-weight: 400;
    color: #606060;
}
*::-moz-selection {
    background: #b3d4fc;
    color: #fff;
    text-shadow: none;
}
::-moz-selection {
    color: #fff;
    background: #b3d4fc;
    text-shadow: none;
}
::selection {
    background: #b3d4fc;
    text-shadow: none;
    color: #fff;
}
.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}
.mark, mark {
    background: #4fc1f0 none repeat scroll 0 0;
    color: #ffffff;
}	font-weight: 600;
}
.f-left {float: left}
.f-right {float: right}
p {line-height: 18px;}
ul{
	list-style: outside none none;
	margin: 0;
	padding: 0
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */color: #969696;}
::-moz-placeholder { /* Firefox 19+ */
    color: #969696;
    opacity:1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
:-ms-input-placeholder { /* IE 10+ */color: #969696;}
:-moz-placeholder { /* Firefox 18- */color: #969696;}
.default-btn {
    background: #232323 none repeat scroll 0 0;
    border-radius: 30px;
    color: #ffffff;
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    line-height: 37px;
    padding: 0 26px;
    position: relative;
    text-align: center;
    text-transform: none;
    transition: all 0.5s ease 0s;
}
.default-btn:hover, .default-btn:focus, .default-btn:active {
    background: #1CADD9; 
    color: #fff
}
.default-btn span {z-index: 2; position: relative}
.border-white {border-color: #fff; background: transparent}
.border-white:hover, .border-white:focus, .border-white:active {background: #fff;}
.shadow {box-shadow: 0px 0px 8px 0px rgba(255, 255, 255, 0.31)}
input,
select,
textarea {
    -webkit-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}
img {max-width: 100%}
input, textarea {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #c1c1c1;
    box-shadow: none;
    color: #666666;
    font-size: 12px;
    height: 35px;
    padding-left: 10px;
    width: 100%;
}
input::-moz-placeholder, textarea::-moz-placeholder {color: #666666;} 
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color: #666666;}
select {
    width: 100%;
    background: #eceff8;
    border: 2px solid #eceff8;
    height: 45px;
    padding-left: 10px;
    box-shadow: none;
    font-size: 14px;
    color: #626262;
}
option {
    background: #fff;
    border: 0px solid #626262;
    padding-left: 10px;
    font-size: 14px;
}
input:focus, textarea:focus {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border-color: #c1c1c1;
}
textarea {
    height: 100px;
    padding: 12px 17px;
    resize: vertical;
    width: 100%;
}
textarea:focus {box-shadow: none; outline: 0}
/*************************
    Scrollup
*************************/
#scrollUp {
    background: #222;
    bottom: 30px;
    color: #ffffff;
    font-size: 20px;
    height: 46px;
    line-height: 46px;
    margin: 0;
    position: fixed;
    right: 15px;
    text-align: center;
    transition: all 0.5s ease-in-out 0s;
    width: 46px;
    z-index: 999;
}
#scrollUp:hover {background: #1CADD9;}
/*************************
    Margin top
*************************/
.mt-10 { margin-top: 10px }
.mt-20 { margin-top: 20px }
.mt-30 { margin-top: 30px }
.mt-40 { margin-top: 40px }
.mt-50 { margin-top: 50px }
.mt-60 { margin-top: 60px }
.mt-70 { margin-top: 70px }
.mt-80 { margin-top: 80px }
.mt-90 { margin-top: 90px }
.mt-100 { margin-top: 100px }
.mt-105 { margin-top: 105px }
.mt-110 { margin-top: 110px }
.mt-115 { margin-top: 115px }
.mt-120 { margin-top: 120px }
.mt-125 { margin-top: 125px }
.mt-130 { margin-top: 130px }
.mt-135 { margin-top: 135px }
.mt-140 { margin-top: 140px }
.mt-145 { margin-top: 145px }
.mt-150 { margin-top: 150px }
/*************************
    Margin bottom
*************************/
.mb-10 { margin-bottom: 10px }
.mb-20 { margin-bottom: 20px }
.mb-30 { margin-bottom: 30px }
.mb-40 { margin-bottom: 40px }
.mb-50 { margin-bottom: 50px }
.mb-60 { margin-bottom: 60px }
.mb-70 { margin-bottom: 70px }
.mb-80 { margin-bottom: 80px }
.mb-90 { margin-bottom: 90px }
.mb-100 { margin-bottom: 100px }
.mb-105 { margin-bottom: 105px }
.mb-110 { margin-bottom: 110px }
.mb-115 { margin-bottom: 115px }
.mb-120 { margin-bottom: 120px }
.mb-125 { margin-bottom: 125px }
.mb-130 { margin-bottom: 130px }
.mb-135 { margin-bottom: 135px }
.mb-140 { margin-bottom: 140px }
.mb-145 { margin-bottom: 145px }
.mb-150 { margin-bottom: 150px }
/*************************
    Margin left
*************************/
.ml-100 { margin-left: 100px }
.ml-110 { margin-left: 110px }
.ml-120 { margin-left: 120px }
.ml-130 { margin-left: 130px }
.ml-140 { margin-left: 140px }
.ml-150 { margin-left: 150px }
/*************************
    Padding top
*************************/
.pt-10 { padding-top: 10px }
.pt-15 { padding-top: 15px }
.pt-20 { padding-top: 20px }
.pt-25 { padding-top: 25px }
.pt-30 { padding-top: 30px }
.pt-35 { padding-top: 35px }
.pt-40 { padding-top: 40px }
.pt-45 { padding-top: 45px }
.pt-50 { padding-top: 50px }
.pt-55 { padding-top: 55px }
.pt-60 { padding-top: 60px }
.pt-70 { padding-top: 70px }
.pt-75 { padding-top: 75px }
.pt-80 { padding-top: 80px }
.pt-85 { padding-top: 85px }
.pt-90 { padding-top: 90px }
.pt-95 { padding-top: 95px }
.pt-100 { padding-top: 100px }
.pt-105 { padding-top: 105px }
.pt-110 { padding-top: 110px }
.pt-115 { padding-top: 115px }
.pt-120 { padding-top: 120px }
.pt-125 { padding-top: 125px }
.pt-130 { padding-top: 130px }
.pt-135 { padding-top: 135px }
.pt-140 { padding-top: 140px }
.pt-145 { padding-top: 145px }
.pt-150 { padding-top: 150px }
.pt-160 { padding-top: 160px }
.pt-165 { padding-top: 165px }
.pt-170 { padding-top: 170px }
.pt-175 { padding-top: 175px }
.pt-180 { padding-top: 180px }
.pt-185 { padding-top: 185px }
.pt-190 { padding-top: 190px }
/*************************
    Padding right
*************************/
.pr-100 { padding-right: 100px }
.pr-110 { padding-right: 110px }
.pr-120 { padding-right: 120px }
.pr-130 { padding-right: 130px }
.pr-140 { padding-right: 140px }
/*************************
    Padding bottom
*************************/
.pb-10 { padding-bottom: 10px }
.pb-15 { padding-bottom: 15px }
.pb-20 { padding-bottom: 20px }
.pb-25 { padding-bottom: 25px }
.pb-30 { padding-bottom: 30px }
.pb-35 { padding-bottom: 35px }
.pb-40 { padding-bottom: 40px }
.pb-45 { padding-bottom: 45px }
.pb-50 { padding-bottom: 50px }
.pb-55 { padding-bottom: 55px }
.pb-60 { padding-bottom: 60px }
.pb-65 { padding-bottom: 65px }
.pb-70 { padding-bottom: 70px }
.pb-75 { padding-bottom: 75px }
.pb-80 { padding-bottom: 80px }
.pb-85 { padding-bottom: 85px }
.pb-90 { padding-bottom: 90px }
.pb-95 { padding-bottom: 95px }
.pb-100 { padding-bottom: 100px }
.pb-105 { padding-bottom: 105px }
.pb-110 { padding-bottom: 110px }
.pb-115 { padding-bottom: 115px }
.pb-120 { padding-bottom: 120px }
.pb-125 { padding-bottom: 125px }
.pb-130 { padding-bottom: 130px }
.pb-135 { padding-bottom: 135px }
.pb-140 { padding-bottom: 140px }
.pb-145 { padding-bottom: 145px }
.pb-150 { padding-bottom: 150px }
.pb-155 { padding-bottom: 155px }
.pb-160 { padding-bottom: 160px }
.pb-165 { padding-bottom: 165px }
.pb-170 { padding-bottom: 170px }
.pb-175 { padding-bottom: 175px }
.pb-180 { padding-bottom: 180px }
.pb-185 { padding-bottom: 185px }
.pb-190 { padding-bottom: 190px }
/*************************
    Padding left
*************************/
.pl-5 { padding-left: 5px }
.pl-10 { padding-left: 10px }
.pl-20 { padding-left: 20px }
.pl-30 { padding-left: 30px }
.pl-40 { padding-left: 40px }
.pl-50 { padding-left: 50px }
.pl-60 { padding-left: 60px }
.pl-70 { padding-left: 70px }
.pl-80 { padding-left: 80px }
.pl-90 { padding-left: 90px }
.pl-100 { padding-left: 100px }
.pl-110 { padding-left: 110px }
.pl-120 { padding-left: 120px }
.pl-130 { padding-left: 130px }
.pl-140 { padding-left: 140px }
.pl-150 { padding-left: 150px }
/***************************
    Page section padding 
****************************/
.ptb-70 {padding: 70px 0;}
.ptb-80 { padding: 80px 0 }
.ptb-90 { padding: 90px 0 }
.ptb-100 { padding: 100px 0 }
.ptb-110 { padding: 110px 0 }
.ptb-120 { padding: 120px 0 }
.ptb-130 { padding: 130px 0 }
.ptb-140 { padding: 140px 0 }
.ptb-150 { padding: 150px 0 }
.ptb-160 { padding: 160px 0 }
.ptb-170 { padding: 170px 0 }
.ptb-180 { padding: 180px 0 }
.ptb-190 { padding: 190px 0 }
/****************************
    Background variation set 
*****************************/
.bg-white { background: #fff }
.bg-light { background: #F6F6F6 }
.bg-dark { background: #333333}
.bg-dark-2 { background: #062E43}
.transparent-bg { background: transparent }
.bg-1, .bg-2, .bg-3, .bg-4, .bg-5 {
    background-attachment: scroll; 
	background-clip: initial; 
	background-color: rgba(0, 0, 0, 0); 
	background-origin: initial; 
	background-position: center center; 
	background-repeat: no-repeat; 
	background-size: cover; 
	position: relative; 
}
.bg-1 { background-image: url(../img/bg/1.jpg);}
.bg-2 { background-image: url("../img/bg/2.jpg");}
.bg-3 { background-image: url("../img/bg/3.jpg");}
.bg-4 { background-image: url("../img/bg/4.jpg");}
.bg-5 { background-image: url("../img/bg/5.jpg");}
.image-3 { 
    background-image: url("img/slider/3.jpg");
    background-position: center top
}
.overlay-blue:before, .overlay-blue-2:before{
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
}
.overlay-blue:before{background: rgba(86, 144, 207, 0.88) none repeat scroll 0 0;}
.overlay-blue-2:before{background: rgba(86, 144, 207, 0.92) none repeat scroll 0 0;}
/***********************
    Section Title
************************/
.section-title {margin: 0 25px 43px 0;}
.section-title > h2 {font-size: 28px; font-weight: 600; margin-bottom: 8px;}
.section-title.two {margin: 0 48px 36px;}
.section-title.two h2 {margin-bottom: 12px;}
.section-title.white, .section-title.white h2 {color: #ffffff;}
/*----------------------------------------*/
/*  2. Header Area
/*----------------------------------------*/
.header-area {z-index: 999; position: relative;}
/*----------------------------------------*/
/*  2.1 Header Top Area
/*----------------------------------------*/
.ht-header-top-menu {padding: 16px 0;}
.ht-header-top-menu li {
    display: inline-block;
    margin-right: 15px;
    padding-right: 24px;
    position: relative;
}
.ht-header-top-menu li:last-child {margin: 0; padding: 0}
.ht-header-top-menu li::before, .ht-header-top-menu li::after {
    background: #707070 none repeat scroll 0 0;
    content: "";
    height: 13px;
    position: absolute;
    right: 0;
    top: 3px;
    width: 1px;
}
.ht-header-top-menu li::after {background: #222222 none repeat scroll 0 0; right: -1px;}
.ht-header-top-menu li:last-child::before, .ht-header-top-menu li:last-child::after {display: none;}
.ht-header-top-menu li a {color: #898989; font-size: 13px;}
.ht-header-top-menu li a:hover {color: #1cadd9;}
.header-top .dropdown-toggle {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #898989;
    font-size: 12px;
    line-height: 49px;
    padding: 0 15px 0 18px;
}
.header-top .btn-group {
    background: #464646 none repeat scroll 0 0;
    display: block;
    float: left;
}
.header-top-right {float: right;}
.btn-group.open .dropdown-toggle {box-shadow: none;}
.btn-group.open .dropdown-toggle {color: #1cadd9;}
.header-top .btn-group i {padding-left: 4px;}
.header-top {background: #333333 none repeat scroll 0 0; border-bottom: 1px solid #464646;}
.header-top .dropdown-menu {
    border: 1px solid #e8e8e8;
    border-radius: 0;
    box-shadow: none;
    font-size: 12px;
    margin-top: 1px;
    min-width: 68px;
    padding: 0;
    width: 68px;
}
.dropdown-menu > li {border-bottom: 1px solid #e8e8e8;}
.dropdown-menu > li:last-child {border: 0 none;}
.header-top .dropdown-menu > li > a {color: #333333; line-height: 15px;}
.header-top .btn-group:last-child .dropdown-menu {left: auto; right: 0; width: 90px;}
/*----------------------------------------*/
/*  2.2 Features Area
/*----------------------------------------*/
.ht-h-features {
    border-right: 1px solid #ebebeb;
    float: left;
    padding: 18px 0 30px;
    text-align: center;
    transition: all 0.3s ease 0s;
    width: 25%;
}
.h-f-icon {display: inline-block;}
.ht-h-features h5 {
    color: #959595;
    display: inline-block;
    font-size: 13px;
    line-height: 19px;
    padding-left: 9px;
    position: relative;
    text-align: left;
    text-transform: none;
    top: 11px;
    transition: all 0.3s ease 0s;
}
.h-f-icon > img {filter: brightness(0) invert(58%);}
.ht-features {border-bottom: 1px solid #ebebeb;}
.ht-h-features:last-child {border: 0 none;}
.ht-h-features:hover h5 {color: #1cadd9;}
.ht-h-features:hover .h-f-icon > img {filter: brightness(1) invert(0);}
/*----------------------------------------*/
/*  2.3 Header Middle Area
/*----------------------------------------*/
.logo {padding: 30px 0 34px; text-align: left;}
.logo a {display: inline-block}
.logo img {
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    width: 100%;
}
form.cat-search-wrapper {
    border: 1px solid #e2e2e2;
    border-radius: 30px;
    height: 46px;
    margin: 43px 5px 44px 0;
}
.ht-categories button {
    background: #ffffff none repeat scroll 0 0;
    border-radius: 30px 0 0 30px;
    color: #222222;
    font-size: 13px;
    line-height: 44px;
    padding: 0 9px 0 18px;
    position: relative;
    width: 100%;
    z-index: 10;
}
.search-form input {
    border: 0 none;
    color: rgb(0, 0, 0);   /* Black text */
    font-size: 20px;
    font-weight: bold;      /* Make text bold */
    height: 100%;
    padding: 0 22px;
}

.search-form input::-moz-placeholder {color: #c2c2c2;}
.search-form input::-webkit-input-placeholder {color: #c2c2c2;}
.ht-categories {float: left; height: 100%; position: relative; width: 151px;}
.ht-categories button i {padding-left: 7px;}
.ht-categories .btn-group {display: block;}
.ht-categories::after {
    background: #ebebeb none repeat scroll 0 0;
    content: "";
    height: 26px;
    position: absolute;
    right: -1px;
    top: 8px;
    width: 1px;
}
.ht-categories .dropdown-menu {
    border: 1px solid #e2e2e2;
    border-radius: 0;
    box-shadow: none;
    left: -1px;
    min-width: 150px;
    padding-bottom: 0;
    padding-top: 24px;
    top: 16px;
    z-index: 9;
}
.ht-categories .dropdown-menu li a {color: #7d7d7d; font-size: 13px; padding: 3px 23px;}
.ht-categories .dropdown-menu li a:hover {background: #1cadd9 none repeat scroll 0 0; color: #ffffff;}
.ht-categories .dropdown-menu > li {border: 0 none;}
.search-form {
    float: left;
    height: 100%;
    position: relative;
    width: calc(100% - 151px);
}
.search-form > button {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    height: 100%;
    padding: 0 22px;
    position: absolute;
    right: 0;
}
.search-form > button img {filter: brightness(0) invert(20%); transition: all 0.3s ease 0s;}
.search-form > button:hover img {filter: brightness(1) invert(0);}
.ht-cart-box {
    background: #222222 none repeat scroll 0 0;
    border-radius: 30px;
    color: #ffffff;
    display: block;
    font-size: 14px;
    height: 47px;
    line-height: 47px;
    margin: 43px 0;
    position: relative;
    text-align: center;
    z-index: 10;
}
.ht-cart-box > img {padding-right: 6px; position: relative; top: -2px;}
.ht-cart-box:hover {color: #fff}
.ht-cart-details {
    background: #ffffff none repeat scroll 0 0;
    border-bottom: 1px solid #e8e8e8;
    border-left: 1px solid #e8e8e8;
    border-right: 1px solid #e8e8e8;
    left: -1px;
    opacity: 0;
    padding: 38px 20px 21px 17px;
    position: absolute;
    top: 24px;
    transition: all 0.3s ease 0s;
    visibility: hidden;
    width: calc(100% + 2px);
    z-index: 9;
}
.ht-cart-wrapper {position: relative;}
.ht-cart-details p {color: #113C5D; font-size: 13px; line-height: 15px;}
.ht-cart-details > span {
    color: #1cadd9;
    display: block;
    font-size: 13px;
    margin-bottom: 4px;
    position: relative;
    text-align: right;
}
.ht-cart-details > span::after {
    background: #ebebeb none repeat scroll 0 0;
    content: "";
    height: 1px;
    left: -3px;
    position: absolute;
    top: 12px;
    width: 44px;
}
.ht-cart-wrapper:hover .ht-cart-details {opacity: 1; visibility: visible;}
.ht-cart-content {margin: 9px 0 18px; overflow: hidden;}
.s-cart-img {
    border: 1px solid #ececec;
    float: left;
    margin-right: 10px;
    width: 50px;
}
.s-cart-text {overflow: hidden;}
.s-cart-img > a {display: block; position: relative;}
.s-cart-text > h4 {font-size: 14px; margin-bottom: 8px;}
.s-cart-text a:hover {color: #1cadd9;}
.s-cart-img a::after {
    background: rgba(0, 0, 0, 0.1) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: all 0.3s ease 0s;
    width: 100%;
}
.ht-cart-content:hover .s-cart-img a::after {opacity: 1;}
.s-cart-amount {
    color: #888888;
    display: block;
    float: left;
    margin-right: 5px;
}
.s-cart-cancel {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #888888;
    float: left;
    padding: 0 3px;
}
.s-cart-cancel:hover {color: #333}
.ht-cart-details .default-btn {
    font-size: 12px;
    line-height: 30px;
    margin-top: 10px;
    padding: 0;
    width: 100%;
}
/*----------------------------------------*/
/*  2.4 Mainmenu Area
/*----------------------------------------*/
.mainmenu-area {background:#BFA970 none repeat scroll 0 0;}
.main-menu {display: block; z-index: 1; position: relative;}
.main-menu > nav > ul {text-align: left;}
.main-menu > nav > ul > li {display: inline-block; margin-right: 26px; position: relative;}
.main-menu > nav > ul > li:last-child {margin-right: 0}
.main-menu > nav > ul > li a {
    color: #ffffff;
    display: inline-block;
    font-size: 14px;
    line-height: 14px;
    padding: 29px 0 26px;
    position: relative;
    transition: all 0.4s ease 0s;
    text-transform: none;
}
.main-menu > nav > ul > li > a {text-transform: capitalize} 
.main-menu > nav > ul > li a i {font-size: 14px;padding-left: 12px;}
.main-menu > nav > ul > li:hover > a, .main-menu > nav > ul > li.active > a {color: #1cadd9}
.main-menu > nav > ul > li > ul {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #1cadd9;
    left: 0;
    opacity: 0;
    padding: 23px 15px;
    position: absolute;
    text-align: left;
    top: 100%;
    transition: all 0.3s ease 0s;
    visibility: hidden;
    width: 178px;
    z-index: 999;
}
.main-menu > nav > ul > li:hover > ul {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
    visibility: visible;
}
.main-menu ul li ul li a {}
.main-menu > nav > ul > li > ul > li {display: block; margin: 0; padding: 0;}
.main-menu > nav > ul > li > ul > li a {
    color: #7d7d7d;
    display: block;
    font-size: 12px;
    line-height: 30px;
    padding: 0;
    position: relative;
}
.ht-p-tag {
    display: block;
    height: 22px;
    line-height: 20px;
    position: absolute;
    right: 0;
    text-align: center;
    top: -8px;
    width: 50px;
    color: #fff
}
.pink {background: #fd3179 none repeat scroll 0 0;}
.blue {background: #1cadd9 none repeat scroll 0 0;}
.yellow {background: #F7B40E none repeat scroll 0 0;}
.main-menu li a:hover span.ht-p-tag {color: #ffffff;}
span.ht-p-tag::after {
    border-bottom: 7px solid rgba(0, 0, 0, 0);
    border-right: 6px solid rgba(0, 0, 0, 0);
    border-top: 0 none;
    bottom: -7px;
    content: "";
    height: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    width: 0;
}
span.ht-p-tag.pink::after {border-right: 6px solid #fd3179;}
span.ht-p-tag.blue::after {border-right: 6px solid #1cadd9;}
span.ht-p-tag.yellow::after {border-right: 6px solid #F7B40E;}
.main-menu ul li ul.megamenu {
    border: 1px solid #1cadd9;
    padding: 27px 0 35px 35px;
    right: auto;
    white-space: nowrap;
    width: auto;
}
.main-menu ul li ul.megamenu > li {
    display: inline-block;
    overflow: hidden;
    padding-right: 57px;
    text-transform: none;
    vertical-align: top;
    width: 190px;
}
.main-menu .megamenu > li > a {color: #222222; font-size: 14px; font-weight: 700; margin-bottom: 22px;}
.main-menu .megamenu > li > a:hover {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #222222;
    padding: 0;
}
.main-menu > nav > ul ul li a:hover {
    background: #1cadd9 none repeat scroll 0 0;
    color: #ffffff;
    padding-left: 9px;
}
.main-menu > nav > ul ul li a::after {
    border-left: 2px solid #2c2d2d;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: all 0.4s ease 0s;
    width: 2px;
}
.main-menu > nav > ul ul li a:hover::after {opacity: 1;}
.megamenu > li > a::before {
    background: #2a2a2a none repeat scroll 0 0;
    bottom: -11px;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    width: 9px;
}
.main-menu > nav > ul > li > ul.megamenu > li > a:after {display: none;}
.main-menu ul li ul.megamenu > li:last-child {padding: 0 28px 0 0; width: 160px;}
.mobile-menu {position: relative; z-index: 2;}
.mobile-menu-area, .mean-container .mean-bar:after {display: none}
.mean-container .mean-bar {background: transparent none repeat scroll 0 0;}
.mean-container a.meanmenu-reveal {
    border: 0 none;
    color: #00ADE5;
    margin-top: 14px;
    padding: 2px 0;
    position: absolute;
}
.mean-container a.meanmenu-reveal span {background-color: #00ADE5;}
.mean-container .mean-nav {margin-top: 46px; position: absolute;}
.mean-container .mean-bar::before {
    color: #ffffff;
    content: "MENU";
    font-size: 17px;
    font-weight: 600;
    left: 0;
    position: absolute;
    top: 14px;
}
.header-sticky.sticky {
    animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    background: #BFA970 none repeat scroll 0 0;
    box-shadow: 0 0 9.9px 0.1px rgba(91, 91, 91, 0.2);
    left: 0;
    padding: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
}
.sticky .main-menu > nav > ul > li {padding: 0;}
.sticky .logo {padding: 23px 0;}
.sticky .main-menu {background: rgba(0, 0, 0, 0) none repeat scroll 0 0; margin-bottom: 0;}
.sticky .header-btn {padding: 14px 0;}
.mainmenu-area .sticky {
    background: rgba(255, 255, 255, 0.8) none repeat scroll 0 0;
    box-shadow: 0 1px 3px rgba(50, 50, 50, 0.4)
}
.sticky .ht-p-tag {display: none;}
.sticky .main-menu > nav > ul > li > a {}
.mobile-menu-area {
    background-color: #fff;
    display: block;
    height: 100%;
    left: 0;
    overflow-y: scroll;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999999;
}
.mobile-menu-area .menu-close {
    background-color: transparent;
    border: 2px solid #fff;
    border-radius: 50%;
    color: #858585;
    height: 40px;
    padding: 0;
    width: 40px;
	margin-bottom:30px;
}
.mobile-menu-area .menu-close:hover {color: #433a8b; border-color: #433a8b;}
.mobile-menu-area .menu-close i {
    display: block;
    font-size: 30px;
    line-height: 30px;
    padding-right: 2px;
}
.mean-container .mean-bar ul li a {color: #252525; font-size: 12px; line-height: 15px;}
.mean-container .mean-nav ul li a:hover {color: #00ADE5;}
.mean-nav ul li a i {display: none;}
.mean-container .mean-nav ul li a.mean-expand {font-weight: 400;}
.fixed {position: absolute; left: 0; width: 100%; z-index: 7}
.call-number > span {
    color: #1cadd9;
    display: inline-block;
    font-size: 16px;
    position: relative;
    top: 1px;
}
.call-number > img {padding-right: 8px;}
.call-number {padding: 22px 0; text-align: right}
/*----------------------------------------*/
/*  3. Slider Area
/*----------------------------------------*/
.slider-area {height: 530px;}
.banner-content, .single-slide, .owl-item, .owl-stage, .slider-wrapper, .owl-stage-outer, .banner-content .container, .banner-content .row, .banner-content .col-lg-5, .banner-content .col-md-12, .banner-content .col-lg-7, .banner-content .col-lg-6, .banner-content .text-content-wrapper, .banner-content .text-content, .banner-content .display-table, .banner-content .display-table-cell {
    height: 100%;
}
.text-content-wrapper {display: table; position: relative; width: 100%;}
.banner-content .text-content {
    display: table-cell;
    height: auto;
    position: relative;
    vertical-align: middle;
    z-index: 2;
}
.slider-area .single-slide, .slider-two-area .single-slide, .slider-three-area .single-slide {
    background-position: center center; 
    background-size: cover;
}
.slider-area, .slider-two-area, .slider-three-area {position: relative; border-bottom: 1px solid #ECECEC}
.text-content-wrapper h1 {
    animation-delay: 1s;
    animation-duration: 1s;
    animation-fill-mode: both;
    animation-name: fadeOut;
    color: #fd3179;
    font-size: 60px;
    font-weight: 700;
    margin-bottom: 10px;
}
.slider-area .text-content > h3 {
    animation-delay: 1.5s;
    animation-duration: 1s;
    animation-fill-mode: both;
    animation-name: fadeOut;
    font-size: 69px;
    font-weight: 700;
    margin-bottom: 35px;
}
.slider-area .text-content > h1 span {color: #1cadd9}
.slider-area .single-slide img {width: auto;}
.slider-image-2 {float: left;}
.slider-image {float: left; padding-right: 40px; margin-top: 50px; position: relative}
.slider-image-wrapper {float: right;}
.slider-p-price {
    background: rgba(237, 28, 36, 0.8) none repeat scroll 0 0;
    border-radius: 50%;
    color: #f8f8f8;
    display: block;
    font-size: 18px;
    height: 117px;
    left: -103px;
    padding: 28px 0 0 22px;
    position: absolute;
    top: 38px;
    width: 117px;
}
.slider-p-price span {display: block; font-size: 30px; font-weight: 700; line-height: 29px;}
.slider-p-price::after {
    background: rgba(237, 28, 36, 0.7) none repeat scroll 0 0;
    border-radius: 0 0 7px 8px;
    bottom: 20px;
    content: "";
    height: 7px;
    position: absolute;
    right: 6px;
    transform: skewX(-58deg);
    width: 9px;
}
.slider-area .text-content > h2 {
    color: #1cadd9;
    float: left;
    font-size: 76px;
    font-weight: 300;
    line-height: 70px;
}
.slider-btn {
    background: #ececec none repeat scroll 0 0;
    color: #333333;
    display: inline-block;
    font-size: 13px;
    line-height: 33px;
    padding: 0 24px;
    text-transform: none;
}
.banner-btn {
    animation-delay: 2s;
    animation-duration: 1s;
    animation-fill-mode: both;
    animation-name: fadeOut;
    line-height: 31px;
    position: relative;
}
.slider-btn:first-child {margin-right: 7px;}
.slider-btn:hover {background: #1cadd9 none repeat scroll 0 0; color: #ffffff;}
.owl-item.active .slider-image > img {animation: 1.5s ease-in-out 0.5s normal backwards 1 running fadeInDown;}
.owl-item.active .slider-image-2 > img {animation: 2.5s ease-in-out 0.5s normal backwards 1 running fadeInRight;}
.owl-item.active .slider-p-price {animation: 3.5s ease-in-out 0.5s normal backwards 1 running bounceInDown;}
.slide-two-wrap {
    margin-right: 164px;
    padding-top: 159px;
    position: relative;
    text-align: right;
}
.slide-two .slider-p-price {
    background: rgba(253, 49, 121, 0.5) none repeat scroll 0 0;
    color: rgb(246, 248, 247);
    display: block;
    font-size: 30px;
    font-weight: 700;
    height: 143px;
    left: auto;
    line-height: 35px;
    padding: 36px 0;
    right: -10px;
    text-align: center;
    text-transform: none;
    top: 81px;
    width: 143px;
}
.slide-two-wrap > h1 {
    color: rgb(175, 101, 61);
    font-size: 60px;
    margin-bottom: 8px;
    padding-right: 164px;
}
.slide-two-wrap > h2 {
    color: #60aedc;
    font-size: 60px;
    font-weight: 700;
    text-transform: none;
    animation-delay: 2s;
    animation-duration: 1s;
    animation-fill-mode: both;
    animation-name: fadeOut;
}
.slide-two-wrap > h2 span {color: #253043; font-weight: 300;}
.slide-two .slider-p-price::after {display: none}
.owl-item.active .slide-two .slider-p-price {
    animation: 1.5s ease-in-out 1s normal backwards 1 running bounceInRight;
}
.slide-three-wrap > h1 {color: #222222; font-size: 72px;}
.owl-item.active .banner-content h1, 
.slider-area .owl-item.active .text-content h3,
.owl-item.active .banner-btn,
.owl-item.active .slide-two-wrap > h2 {
    -webkit-animation-name: fadeInUp;
            animation-name: fadeInUp
}
.slider-area .owl-dots, .slider-two-area .owl-dots, .slider-three-area .owl-dots {
    bottom: 13px;
    height: 20px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    text-align: center;
    width: 51px;
}
.slider-area .owl-dots::after, .slider-two-area .owl-dots::after, .slider-three-area .owl-dots::after {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #fcf5f4;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 100%;
}
.slider-area .owl-dot, .slider-two-area .owl-dot, .slider-three-area .owl-dot {
    background: #424242 none repeat scroll 0 0;
    border: 1px solid #ffffff;
    display: inline-block;
    height: 7px;
    margin: 0 2.5px;
    position: relative;
    width: 7px;
    z-index: 1;
}
.slider-area .owl-dot.active, .slider-two-area .owl-dot.active, .slider-three-area .owl-dot.active {
    background: #1cadd9 none repeat scroll 0 0;
}
/*----------------------------------------*/
/*  4. Product Tab Area
/*----------------------------------------*/
.ht-p-tab-container {position: relative;}
.ht-product-tab {padding-bottom: 37px;}
.carousel-style-1 .owl-nav, .carousel-style-2 .owl-nav {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #ececec;
    color: #c0c0c0;
    height: 19px;
    overflow: hidden;
    position: absolute;
    right: 15px;
    top: -49px;
    width: 48px;
}
.carousel-style-1 .owl-nav::after, .carousel-style-2 .owl-nav::after {
    background: #ececec none repeat scroll 0 0;
    content: "";
    height: 100%;
    position: absolute;
    right: 22px;
    top: 0;
    transform: skewX(-15deg);
    width: 1px;
}
.carousel-style-1 .owl-nav div, .carousel-style-2 .owl-nav div {
    float: left;
    height: 100%;
    line-height: 15px;
    position: relative;
    text-align: center;
    width: 50%;
    z-index: 1;
}
.carousel-style-1 .owl-nav .owl-next::after, .carousel-style-1 .owl-nav .owl-prev::after {
    background: #222222 none repeat scroll 0 0;
    content: "";
    height: 100%;
    opacity: 0;
    position: absolute;
    right: -3px;
    top: 0;
    transform: skewX(-15deg);
    transition: all 0.3s ease 0s;
    width: 27px;
}
.carousel-style-1 .owl-nav .owl-next:hover:after {opacity: 1}
.carousel-style-1 .owl-nav .owl-prev::after {left: -3px; right: auto; width: 27px;}
.carousel-style-1 .owl-nav .owl-prev:hover:after {opacity: 1}
.carousel-style-1 .owl-nav div i, .carousel-style-2 .owl-nav div i { z-index: 2; position: relative;}
.ht-single-product {
    border: 1px solid #ebebeb;
    margin-top: 11px;
    position: relative;
    text-align: center;
}
.product-slide-wrapper .owl-item .img-popup img {width: auto;}
.ht-product-tab .nav-tabs li a {
    border: 0 none;
    border-radius: 0;
    color: #7d7d7d;
    font-size: 20px;
    font-weight: 400;
    margin: 0;
    padding: 0;
    text-transform: none;
    line-height: 17px
}
.ht-product-tab .nav-tabs li.active a {color: #333333;}
.ht-product-tab .nav-tabs {border: 0 none; overflow: hidden; position: relative;}
.ht-product-tab .nav-tabs::after {
    border-bottom: 1px solid #ebebeb;
    bottom: 1px;
    content: "";
    height: 1px;
    position: absolute;
    right: 0;
    width: 100%;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li > a:hover, .nav-tabs > li.active > a:hover {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
}
.ht-product-tab .nav-tabs > li {
    background: #ffffff none repeat scroll 0 0;
    line-height: 16px;
    padding-right: 44px;
    position: relative;
    z-index: 1;
}
.ht-product-tab .nav-tabs > li::after {
    content: "\\";
    font-size: 20px;
    position: absolute;
    right: 19px;
    top: 0;
}
.ht-product-tab .nav-tabs > li:last-child::after {display: none;}
.ht-product-tab .nav-tabs > li:last-child {padding-right: 6px;}
.ht-single-product .ht-p-tag {left: 23px; right: auto; top: -11px; z-index: 2;}
.ht-product-button {
    bottom: 0;
    height: 44px;
    left: 0;
    margin: auto;
    opacity: 0;
    position: absolute;
    top: 0;
    transform: scaleY(0.5);
    transition: all 0.3s ease 0s;
    width: 100%;
}
.ht-single-product:hover .ht-product-button {opacity: 1; transform: scaleY(1);}
.ht-product-button > button, .ht-product-button > a {
    background: #ffffff none repeat scroll 0 0;
    border-radius: 50%;
    display: inline-block;
    height: 44px;
    line-height: 44px;
    margin: 0 3px;
    padding: 0;
    position: relative;
    text-align: center;
    vertical-align: top;
    width: 44px;
}
.ht-product-image > a {display: block; position: relative;}
.ht-product-image > a::after {
    background: #000000 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: all 0.3s ease 0s;
    width: 100%;
}
.ht-product-image {position: relative;}
.ht-single-product:hover .ht-product-image > a::after {opacity: 0.09;}
.ht-single-product .ht-product-button img {
    bottom: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
}
.ht-product-button button:hover, .ht-product-button a:hover {background: #1cadd9 none repeat scroll 0 0;}
.ht-product-button button:hover img, .ht-product-button a:hover img {filter: brightness(100) invert(0);}
.ht-product-text h3 {
    background: #1cadd9 none repeat scroll 0 0;
    color: #ffffff;
    font-size: 23px;
    padding: 13px 0;
}
.ht-product-text span.rhs_span {
    display: inline-block;
    font-size: 14px;
    padding-left: 14px;
    position: relative;
    text-decoration: line-through;
    top: -1px;
}
.ht-product-text span.rhs_span::after {content: "/"; left: 2px; position: absolute; top: 0;}
.ht-product-text > h5 a {color: #464646; text-transform: none;}
.ht-product-text h5 a:hover {color: #1cadd9;}
.ht-product-text > h5 {font-size: 13px; padding: 15px 0;}
.cart_btn {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #f0f0f0;
    border-radius: 30px;
    color: #898989;
    font-size: 13px;
    padding: 10px 21px;
    text-transform: none;
}
.ratings i {background: rgba(0, 0, 0, 0) none repeat scroll 0 0; color: #d7d7d7; font-size: 14px;}
.ratings {padding-bottom: 20px; padding-top: 12px;}
.cart_btn:hover {
    background: #222222 none repeat scroll 0 0;
    border-color: #222222;
    color: #ffffff;
}
.ratings i.yellow {color: #f7b40e;}
.hover-effect {display: block; overflow: hidden; position: relative;}
.hover-effect::before, .hover-effect:after {
    background: rgba(0, 0, 0, 0.1) none repeat scroll 0 0;
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: all 0.5s ease-out 0s;
    z-index: 1;
}
.hover-effect::after {left: 50%; opacity: 1; right: 50%;}
.hover-effect:hover:after {left: 0; opacity: 0; right: 0;}
.hover-effect:before {bottom: 50%; opacity: 1; top: 50%;}
.hover-effect:hover:before {bottom: 0; opacity: 0; top: 0;}
.ht-banner-image a {display: block;}
/*----------------------------------------*/
/*  5. Banner Area
/*----------------------------------------*/
.ht-banner-content {margin-left: -15px; margin-right: -15px; overflow: hidden; padding-top: 30px;}
.ht-banner-content > div {float: left; padding-left: 15px; padding-right: 15px; width: 40%;}
.ht-banner-content .img-left:first-child {width: 60%;}
/*----------------------------------------*/
/*  6. Best Sell Product Area
/*----------------------------------------*/
/*----------------------------------------*/
/*  6.1 Best Product Slider
/*----------------------------------------*/
.best-sell-wrapper {position: relative;}
.sub-title {margin-bottom: 47px; position: relative;}
.sub-title h3 {
    background: #ffffff none repeat scroll 0 0;
    color: #222222;
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    line-height: 16px;
    padding-right: 12px;
    position: relative;
    z-index: 1;
    text-transform: none;
}
.sub-title::after {
    border-bottom: 1px solid #ebebeb;
    bottom: 3px;
    content: "";
    height: 1px;
    position: absolute;
    right: 54px;
    width: 86%;
}
.ht-best-p-wrapper.carousel-style-1 .owl-nav {top: -67px;}
.ht-best-p-wrapper .ht-single-best-p img {width: auto;}
.ht-single-best-p > a {border: 1px solid #ececec; float: left; position: relative;}
.ht-single-best-text {overflow: hidden; padding-left: 28px;}
.ht-single-best-p {margin-bottom: 29px; overflow: hidden;}
.ht-single-best-p > a::after {
    background: #000000 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: all 0.5s ease 0s;
    width: 100%;
}
.ht-single-best-p:hover > a::after {opacity: 0.1;}
.ht-single-best-p:last-child {margin: 0;}
.ht-single-best-text h4 {font-size: 13px; line-height: 12px; text-transform: none;}
.ht-single-best-text h4 a {color: #222222;}
.ht-single-best-text h4 a:hover {color: #00ade5;}
.ht-single-best-text .ratings i {font-size: 13px;}
.ht-single-best-p .ratings {padding-bottom: 6px; padding-top: 9px;}
.ht-single-best-p .price {color: #00ade5; display: block; font-size: 14px;}
/*----------------------------------------*/
/*  6.2 Count Product Slider
/*----------------------------------------*/
.coundown-item {border: 1px solid #00ade5; position: relative;}
.coundown-item {border: 1px solid #00ade5; margin-left: 5px; margin-top: 5px; position: relative;}
.ht-title-tag {
    background-color: #00ade5;
    border-bottom: 1px solid #018db8;
    color: #ffffff;
    font-size: 18px;
    height: 38px;
    left: -24px;
    line-height: 38px;
    opacity: 0;
    position: absolute;
    text-align: center;
    text-transform: none;
    top: 71px;
    transform: rotate(-46deg);
    transform-origin: left bottom 0;
    transition: all 0.3s ease 0s;
    width: 191px;
    z-index: 1;
}
.owl-item.active .ht-title-tag {opacity: 1;}
.ht-title-tag::after, .ht-title-tag::before {
    border-bottom: 7px solid rgba(0, 0, 0, 0);
    border-left: 7px solid #018db8;
    content: "";
    height: 0;
    position: absolute;
    right: 32px;
    top: 38px;
    transform: rotate(90deg);
    width: 0;
    z-index: 1;
}
.ht-title-tag::before {left: 27px; right: auto; top: 37px transform: rotate(0deg);}
.ht-countdown-container .sub-title {margin-bottom: 42px;}
.ht-countdown-slider.carousel-style-1 .owl-nav {right: 0; top: -62px;}
.timer-container {padding-bottom: 24px; padding-top: 23px; position: relative; text-align: center;}
.timer-container .timer-p-img > img {margin: auto; width: auto;}
.timer-p-information > h5 {color: #222222; font-weight: 400; text-transform: none;}
.timer-p-information > h5 a:hover {color: #00ade5;}
.timer-p-information {background: #ffffff none repeat scroll 0 0; padding-right: 10px; padding-top: 44px;}
.timer-grid {
    background: rgba(253, 49, 121, 0.9) none repeat scroll 0 0;
    border-radius: 8px;
    left: 0;
    margin: 0 22px;
    padding: 15px 0 13px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 105px;
}
.timer-grid::after {
    border-bottom: 9px solid rgba(253, 49, 121, 0.9);
    border-left: 6px solid rgba(0, 0, 0, 0);
    border-right: 6px solid rgba(0, 0, 0, 0);
    bottom: -8px;
    content: "";
    height: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    transform: rotate(-182deg);
    width: 0;
    z-index: 1;
}
.timer-grid .cdown {
    background: transparent;
    border-right: 1px solid rgba(255, 255, 255, .5);
    color: #fff;
    display: block;
    float: left;
    width: 25%;
    font-size: 13px;
    height: 33px;
    margin: 0;
    padding: 0;
    text-align: center;
}
.timer-grid .cdown:last-child {border: 0}
.timer-grid > div span {display: block; line-height: 12px; font-size: 17px; padding-bottom: 9px}
.time-p-price {color: #00ade5; display: block; font-size: 20px; padding-bottom: 6px;}
.time-p-price span {color: #c2c2c2; font-size: 14px;}
.timer-p-information > p {color: #959595; font-size: 13px; line-height: 16px;}
.timer-p-information .ratings {padding-bottom: 6px; padding-top: 8px;}
.timer-button .cart_btn {margin-right: 12px; padding: 13px 29px;}
.s-btn {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border-radius: 50%;
    display: inline-block;
    height: 44px;
    padding: 0;
    text-align: center;
    vertical-align: bottom;
    width: 31px;
}
.timer-button .s-btn > img {margin: auto; width: auto;}
.s-btn:hover > img {filter: brightness(120) invert(80%);}
.timer-button {padding-top: 9px;}
/*----------------------------------------*/
/*  7. Newsletter Area
/*----------------------------------------*/
.newsletter-area h4 { color: #464646; letter-spacing: 1.5px; line-height: 13px; margin-bottom: 24px;}
.newsletter-area p {color: #959595; font-size: 15px; line-height: 18px; margin-bottom: 35px; padding: 0 70px;}
.mc-form {
    background: #ffffff none repeat scroll 0 0;
    border-radius: 30px;
    height: 49px;
    margin: auto;
    position: relative;
    width: 473px;
}
.mc-news {left: -5000px; position: absolute;}
.email {border: 0 none; color: #aeaeae; font-size: 13px; height: 100%; padding-left: 30px;}
#mc_embed_signup_scroll > button {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #7d7d7d;
    height: 100%;
    padding: 0 22px;
    position: absolute;
    right: 0;
    text-transform: none;
    top: 0;
}
#mc_embed_signup_scroll > button::after {
    background: #c2c2c2 none repeat scroll 0 0;
    content: "";
    height: 20px;
    left: 0;
    position: absolute;
    top: 15px;
    width: 1px;
}
.social-links > a {
    border-radius: 50%;
    color: #7d7d7d;
    display: inline-block;
    font-size: 16px;
    height: 27px;
    line-height: 27px;
    text-align: center;
    width: 27px;
}
.social-links > a:hover {background: #464646 none repeat scroll 0 0; color: #ffffff;}
.social-links {padding-top: 37px;}
#mc_embed_signup_scroll > button:hover {color: #333333;}
/*----------------------------------------*/
/*  8. Tab Style Two
/*----------------------------------------*/
.tab-style-2 .ht-p-tab-container .sub-title {margin-bottom: 30px;}
.tab-style-2 .ht-product-tab .nav-tabs::after {display: none;}
.tab-style-2 .sub-title > h3 {color: #333333; font-weight: 400; text-transform: none;}
.tab-style-2 .ht-product-tab .nav-tabs li a {font-size: 13px;}
.tab-style-2 .ht-product-tab .nav-tabs li.active a {color: #1cadd9;}
.tab-style-2 .ht-product-tab .nav-tabs > li::after {font-size: 13px; right: 13px;}
.tab-style-2 .ht-product-tab .nav-tabs > li {padding-right: 35px;}
.tab-style-2 .sub-title::after {right: 47px;}
.tab-style-2 .sub-title::before {
    background: #ebebeb none repeat scroll 0 0;
    border-radius: 50%;
    bottom: 0;
    content: "";
    height: 7px;
    left: 140px;
    position: absolute;
    width: 7px;
    z-index: 1;
}
.tab-style-2 .carousel-style-1 .owl-nav {top: -97px;}
/*----------------------------------------*/
/*  9. Blog Brand Area
/*----------------------------------------*/
.ht-blog-container, .ht-brand-container {position: relative;}
.ht-blog-image > a {display: block; position: relative;}
.post-date {
    background: #464646 none repeat scroll 0 0;
    bottom: -26px;
    color: #ffffff;
    display: block;
    font-size: 13px;
    height: 53px;
    line-height: 27px;
    position: absolute;
    text-align: center;
    width: 41px;
    z-index: 1;
}
.post-date > span {
    background: #1cadd9 none repeat scroll 0 0;
    bottom: 0;
    display: block;
    font-size: 16px;
    height: 26px;
    position: absolute;
    width: 100%;
}
.ht-blog-text > h5 {color: #333333; font-size: 13px; margin-bottom: 8px; text-transform: none;}
.ht-blog-text h5 a:hover {color: #1cadd9;}
.ht-blog-image {margin-bottom: 42px;}
.ht-blog-text > p {color: #898989; font-size: 14px; line-height: 22px; margin-bottom: 10px;}
.ht-blog-text > a {color: #1cadd9; font-size: 14px;}
.ht-blog-text > a:hover {color: #222222;}
.ht-blog-image > a:hover::after {opacity: 1;}
.ht-blog-image > a::after {
    background: #ececec none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: all 0.3s ease 0s;
    width: 100%;
}
.ht-blog-container .sub-title::after, .ht-brand-container .sub-title::after {right: 36px;}
.ht-blog-container .sub-title > h3, .ht-brand-container .sub-title > h3 {
    color: #333333;
    font-weight: 400;
    text-transform: none;
}
.ht-single-brand .table-cell > img {margin: auto; width: auto;}
.ht-single-brand a {
    background: #ececec none repeat scroll 0 0;
    display: inline-table;
    height: 135px;
    text-align: center;
    width: 100%;
}
.ht-single-brand {margin-bottom: 30px;}
.table-cell {display: table-cell; vertical-align: middle;}
.ht-single-brand:hover > a {background: #cccccc none repeat scroll 0 0;}
.col-xs-12 .ht-single-brand:last-child {margin: 0;}
.ht-blog-carousel.carousel-style-1 .owl-nav, .ht-brand-carousel.carousel-style-1 .owl-nav {top: -60px;}
/*----------------------------------------*/
/*  10. Footer Area
/*----------------------------------------*/
.ht-single-footer-widget > h4 {
    color: #464646;
    font-size: 16px;
    line-height: 15px;
    margin-bottom: 20px;
    text-transform: none;
}
.ht-footer-list > li a {color: #898989; position: relative;}
.ht-footer-list > li {display: block; font-size: 13px; line-height: 27px;}
.ht-footer-list > li a:hover {color: #1cadd9; margin-left: 12px;}
.ht-footer-list li a::after {
    background: #1cadd9 none repeat scroll 0 0;
    bottom: 1px;
    content: "";
    height: 1px;
    left: 0;
    opacity: 0;
    position: absolute;
    transition: all 0.3s ease 0s;
    width: 100%;
}
.ht-footer-list li a:hover::after {opacity: 1;}
.ht-footer-list li a::before {
    background: #1cadd9 none repeat scroll 0 0;
    border-radius: 50%;
    content: "";
    height: 4px;
    left: -12px;
    opacity: 0;
    position: absolute;
    top: 6px;
    transition: all 0.3s ease 0s;
    width: 4px;
}
.ht-footer-list li a:hover::before {opacity: 1;}
.ht-tag-list a {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #898989;
    display: block;
    font-size: 13px;
    margin-bottom: 3px;
    margin-right: 4px;
    padding: 4px 8px;
}
.ht-tag-list li {display: inline-block;}
.ht-tag-list a:hover {color: #ffffff;}
.ht-tag-list a:hover {background: #1cadd9 none repeat scroll 0 0;}
.footer-border {border-top: 1px solid #e1e1e1; padding: 19px 0;}
.copyright {color: #7d7d7d; line-height: 23px;}
.copyright a {color: #1cadd9;}
.copyright a:hover {border-bottom: 1px solid #1cadd9;}
.payment {text-align: right;}
/*----------------------------------------*/
/*  11. Homepage Two
/*----------------------------------------*/
.header-two-area .ht-header-top-menu li::before, .header-two-area .ht-header-top-menu li::after {display: none;}
.header-two-area .ht-header-top-menu li {margin: 0; padding-right: 22px;}
.header-two-area .header-top .dropdown-toggle {padding: 0 4px 0 18px;}
.header-two-area .header-top .btn-group i {padding-left: 6px;}
.header-two-area .header-top .btn-group, .header-three-area .header-top .btn-group, .header-four-area .header-top .btn-group {background: rgba(0, 0, 0, 0) none repeat scroll 0 0;}
.header-two-area .call-number > span, .header-three-area .call-number > span {
    color: #00ade5;
    font-size: 14px;
    letter-spacing: 1.2px;
}
.header-two-area .call-number > img {padding-right: 6px;}
.header-two-area .call-number {float: left; margin-left: 8px; padding: 12px 0; text-align: left;}
.header-two-area .logo {padding: 34px 0 37px;}
.header-two-area .cat-search-wrapper {
    border-color: #ebebeb;
    border-radius: 7px;
    height: 43px;
    margin: 45px 0 49px;
}
.header-two-area .ht-categories button {color: #7d7d7d; line-height: 41px;}
.header-two-area .search-form > input {color: #7d7d7d;}
.header-two-area .search-form > input::-moz-placeholder {color: #7d7d7d;}
.header-two-area .search-form > input::-webkit-input-placeholder {color: #7d7d7d;}
.header-two-area .ht-cart-box {
    background: #00ade5 none repeat scroll 0 0;
    border-radius: 7px;
    height: 45px;
    margin: 45px 0 50px;
}
.header-two-area .mainmenu-area {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border-bottom: 1px solid #ececec;
    border-top: 1px solid #ececec;
}
.header-two-area .main-menu > nav > ul > li > a {
    color: #222222;
    font-size: 16px;
    line-height: 51px;
    padding: 0 18px 0 22px;
}
.header-two-area .main-menu > nav > ul > li {
    border-left: 1px solid #ececec;
    display: block;
    float: left;
    margin: 0;
}
.header-two-area .main-menu > nav > ul > li > a:hover,
.header-two-area .main-menu > nav > ul > li.active > a {
    background: #ececec none repeat scroll 0 0;
}
.header-two-area .main-menu > nav > ul > li:first-child {border: 0 none;}
.header-two-area .ht-p-tag {top: -22px;}
.header-two-area .mean-container .mean-bar::before {color: #00ade5;}
.header-two-area .mainmenu-area.header-sticky.sticky {background: #ffffff none repeat scroll 0 0;}
.slider-two-area {height: 520px;}
.slider-two-area .banner-content h3, .slider-three-area .banner-content h3, .sin-slider-text h3 {
    animation-delay: 0.8s;
    animation-duration: 1s;
    animation-fill-mode: both;
    animation-name: fadeOut;
    background: #00ade5 none repeat scroll 0 0;
    color: #ffffff;
    display: inline-block;
    letter-spacing: 1px;
    line-height: 38px;
    margin-bottom: 7px;
    padding: 0 13px;
    text-transform: none;
}
.slider-two-area .text-content > h1, .slider-three-area .text-content > h1, .sin-slider-text h1 {
    animation-delay: 1.3s;
    animation-duration: 1s;
    animation-fill-mode: both;
    animation-name: fadeOut;
    color: #503527;
    font-size: 69px;
    line-height: 97px;
    margin-bottom: 5px;
    text-transform: capitalize;
}
.slider-two-area .slider-wrapper, .slider-three-area .slider-wrapper {z-index: 0;}
.slider-two-area .text-content > h1 span, .slider-three-area .text-content > h1 span {color: #00ade5;}
.slider-two-area .text-content > p, .slider-three-area .text-content > p, .sin-slider-text p {
    animation-delay: 1.8s;
    animation-duration: 1s;
    animation-fill-mode: both;
    animation-name: fadeOut;
    color: #7d7d7d;
    font-size: 14px;
    line-height: 19px;
    padding: 0 25px;
}
.slider-two-area .banner-btn, .slider-three-area .banner-btn, .sin-slider-text .banner-btn {
    margin-top: 23px;
    animation-delay: 2.3s;
    animation-duration: 1s;
    animation-fill-mode: both;
    animation-name: fadeOut;
}
.slider-two-area .owl-item.active .banner-content h3, .slider-two-area .owl-item.active .banner-content h1, .slider-two-area .owl-item.active .banner-content p, .slider-two-area .owl-item.active .banner-content .banner-btn, .slider-three-area .owl-item.active .banner-content h3, .slider-three-area .owl-item.active .banner-content h1, .slider-three-area .owl-item.active .banner-content p, .slider-three-area .owl-item.active .banner-content .banner-btn, .slick-current .sin-slider-text h1, .slick-current .sin-slider-text h3, .slick-current .sin-slider-text p, .slick-current .sin-slider-text .banner-btn {
    -webkit-animation-name: fadeInUp;
            animation-name: fadeInUp
}
.ht-single-product-content {border: 1px solid #ebebeb; margin-top: 11px; position: relative;}
.ht-p-text > h4 {
    color: #333333;
    font-size: 13px;
    font-weight: 400;
    text-transform: none;
    transition: all 0.3s ease 0s;
}
.ht-single-product-content .ratings i {font-size: 13px; transition: all 0.3s ease 0s;}
.ht-single-product-content .ratings {padding: 7px 0 6px;}
.p-t-price {color: #00ade5; display: block; float: left; font-size: 16px; line-height: 20px;}
.p-t-price > span {color: #c2c2c2; font-size: 12px; text-decoration: line-through;}
.price-cart-container > button {background: rgba(0, 0, 0, 0) none repeat scroll 0 0; float: right;}
.price-cart-container {overflow: hidden;}
.ht-p-text {
    background: #ffffff none repeat scroll 0 0;
    padding: 14px 9px 15px 20px;
    transition: all 0.3s ease 0s;
}
.price-cart-container > button img {filter: brightness(0) invert(71%);}
.ht-p-text > h4 a:hover {color: #00ade5;}
.ht-single-product-content:hover .ht-p-text {background: #333333 none repeat scroll 0 0;}
.ht-single-product-content:hover .ht-p-text > h4 {color: #ffffff;}
.ht-single-product-content:hover .ratings i {color: #c2c2c2;}
.ht-single-product-content .ratings i.yellow {color: #f7b40e;}
.ht-single-product-content:hover .price-cart-container > button img {filter: brightness(1) invert(0);}
.ht-p-image {position: relative; overflow: hidden;}
.ht-p-button > button, .ht-p-button a {
    background: #333333 none repeat scroll 0 0;
    border-bottom: 1px solid #ffffff;
    bottom: 0;
    display: block;
    height: 39px;
    position: absolute;
    right: -100%;
    transition: all 0.5s ease 0.3s;
    width: 39px;
}
.ht-p-image .ht-p-button > button img, .ht-p-image .ht-p-button > a img {
    filter: brightness(3) invert(0);
    margin: auto;
    width: auto;
}
.ht-p-image .ht-p-button > a img {bottom: 0; left: 0; position: absolute; right: 0; top: 0;}
.ht-p-button > button:hover, .ht-p-button > a:hover {background: #00ade5 none repeat scroll 0 0;}
.ht-p-button > button:nth-of-type(2) {bottom: 39px; transition-delay: 0.2s;}
.ht-p-button > button:nth-of-type(1) {bottom: 78px; transition-delay: 0.1s;}
.ht-single-product-content:hover .ht-p-button button, .ht-single-product-content:hover .ht-p-button a {right: 0;}
.ht-single-product-content .ht-p-tag {left: 24px; right: auto; top: -11px; z-index: 20;}
.ht-single-product-content:first-child {margin-bottom: 44px;}
.product-two-wrapper {position: relative;}
.sub-title-two {
    border: 2px solid #333333;
    color: #333333;
    display: inline-block;
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 42px;
    padding: 0 11px;
    text-transform: none;
}
.carousel-style-2 .owl-nav {border: 0 none; font-size: 22px; width: 59px; background: transparent;}
.carousel-style-2 .owl-nav::after {
    background: #dddddd none repeat scroll 0 0;
    height: 26px;
    right: 29px;
}
.carousel-style-2 .owl-nav .owl-next:hover, .carousel-style-2 .owl-nav .owl-prev:hover {color: #333333;}
.carousel-style-2 .owl-nav .owl-next, .carousel-style-2 .owl-nav .owl-prev {
    color: #dddddd;
    transition: all 0.3s ease 0s;
}
.carousel-style-2 .owl-nav {height: 26px;}
.product-two-area .carousel-style-2 .owl-nav {top: -77px;}
.newsletter-container {position: relative;}
.newsletter-container::after {
    border: 3px solid #ffffff;
    bottom: 14px;
    content: "";
    left: 14px;
    position: absolute;
    right: 14px;
    top: 14px;
}
.newsletter-container .col-md-6 {z-index: 1;}
.ht-brand-carousel-two .ht-single-brand a {background: rgba(0, 0, 0, 0) none repeat scroll 0 0; height: 69px;}
.ht-brand-carousel-two .ht-single-brand:hover .table-cell > img {filter: brightness(0) invert(33%);}
.ht-brand-carousel-two .ht-single-brand .table-cell > img {transition: all 0.3s ease 0s;}
.ht-brand-carousel-two .owl-prev, .ht-brand-carousel-two .owl-next {
    color: #dddddd;
    font-size: 22px;
    left: -85px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s ease 0s;
    width: 20px;
}
.ht-brand-carousel-two .owl-nav .owl-next {left: auto; right: -85px;}
.ht-brand-carousel-two .owl-prev:hover, .ht-brand-carousel-two .owl-next:hover {color: #333333;}
.ht-blog-container-two {position: relative;}
.ht-blog-carousel-two.carousel-style-2 .owl-nav {top: -74px;}
.ht-best-p-wrapper-two .ht-single-best-text a {color: #333333; font-size: 14px; text-transform: capitalize;}
.ht-best-p-wrapper-two .ht-single-best-text .ratings i {font-size: 14px;}
.feature-two {border-bottom: 0 none; border-top: 1px solid #ececec;}
.feature-two .ht-h-features {border-color: #ececec;}
.ht-best-p-wrapper-two.carousel-style-2 .owl-nav {top: -76px;}
.footer-two-area .ht-single-footer-widget > h4 {color: #ffffff;}
/*----------------------------------------*/
/*  12. Homepage Three
/*----------------------------------------*/
.header-three-area .call-number {float: left; margin-left: 8px; padding: 12px 0; text-align: left;}
.header-three-area .call-number > img {padding-right: 11px}
.header-three-area .call-number > span {font-size: 16px; letter-spacing: 0; top: 3px;}
.header-three-area .call-number {margin-left: 25px; padding: 16px 0;}
.header-three-area .header-top .dropdown-toggle, .header-four-area .header-top .dropdown-toggle {
    color: #ffffff;
    line-height: 57px;
    padding: 0 0 0 14px;
}
.header-three-area .header-top .btn-group i, .header-four-area .header-top .btn-group i {padding-left: 2px;}
.header-three-area .header-top {border-bottom: 1px solid #222222;}
.header-three-area .ht-header-top-menu {padding: 20px 0;}
.header-three-area .logo {
    background: #31bbe9 none repeat scroll 0 0;
    padding: 29px 0 49px;
    position: relative;
    z-index: 1;
    text-align: center;
}
.header-three-bg {background: rgba(51, 51, 51, 0.8) none repeat scroll 0 0; position: relative;}
.header-three-area .mainmenu-area {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    position: relative;
    z-index: 99;
}
.header-three-area .main-menu > nav > ul > li a i {padding-left: 9px;}
.header-three-area .main-menu > nav > ul > li {margin-right: 30px;}
.header-three-area .sticky .header-form-wrapper {display: none;}
.header-three-area .sticky .logo {padding: 7px 0 13px;}
.header-three-area .sticky .logo img {width: 73%;}
.header-three-bg::after {
    background: rgba(34, 34, 34, 0.25) none repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 73px;
    left: 0;
    position: absolute;
    width: 100%;
}
.header-three-area .form-bg-three {float: left; margin: 0; padding-right: 15px; width: 75%;}
.header-three-area form.cat-search-wrapper {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #ebebeb;
    border-radius: 8px;
    margin: 0;
    position: relative;
    z-index: 1;
}
.header-three-area .ht-cart-wrapper {float: left; padding-left: 15px; width: 25%;}
.header-three-area .ht-cart-box {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    display: inline-block;
    margin: 0;
    padding: 0 14px;
}
.header-form-wrapper {padding-top: 18px;}
.header-three-area .ht-cart-details {
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 23px;
    top: 100%;
}
.header-three-area .ht-cart-wrapper:hover > a {color: #31bbe9;}
.header-three-area .main-menu ul li ul.megamenu > li {padding-right: 8px; width: 140px;}
.slider-three-area {height: 700px;}
.slider-three-area .owl-dots {bottom: 85px;}
.slider-three-area .owl-dot {border: 0 none; margin: 0 3.5px;}
.slider-three-area .owl-dots::after {background: #ffffff none repeat scroll 0 0;}
.slider-three-area .banner-content h3 {margin-top: 65px;}
.slider-three-area .text-content > p {padding: 0 40px 0 0;}
.slider-three-area .text-content h1 {font-size: 67px; position: relative;}
.feature-three {border: 0 none;}
.ht-features-wrapper {
    background: #ffffff none repeat scroll 0 0;
    border-bottom: 1px solid #ebebeb;
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.04);
    margin-top: -73px;
    overflow: hidden;
    position: relative;
    z-index: 9;
}
.feature-three .ht-h-features {padding: 43px 0 45px;}
.tab-style-3 .tab-three > .nav-tabs > li > a {
    border: 2px solid rgba(0, 0, 0, 0);
    color: #333333;
    font-size: 20px;
    line-height: 31px;
    padding: 0 12px;
}
.tab-three .nav-tabs li.active a {border-color: #333333;}
.tab-style-3 .nav-tabs::after {display: none;}
.tab-style-3 .tab-three .nav-tabs li {margin-bottom: 0; padding-right: 19px;}
.tab-three .nav-tabs > li::after {display: none;}
.tab-style-3 .nav-tabs li a {font-size: 13px;}
.tab-style-3 .nav-tabs li.active a {color: #00ade5;}
.tab-three > .nav-tabs > li.active a {color: #333333;}
.tab-style-3 .nav-tabs > li {padding-right: 35px;}
.tab-style-3 .nav-tabs > li::after {right: 13px;}
.tab-three {padding-bottom: 24px;}
.tab-style-3 .product-slide-wrapper .owl-nav {top: -113px;}
.tab-style-3 .tab-three {top: 0;}
.tab-style-3 .ht-single-product-content:first-child {margin-bottom: 0;}
.blog-brand-area-three .sub-title > h3 {font-weight: 700;}
.blog-brand-area-three .ht-blog-container .sub-title::after, .blog-brand-area-three .ht-brand-container .sub-title::after {
    display: none;
}
.blog-brand-area-three .carousel-style-2 .owl-nav {top: -68px;}
/*----------------------------------------*/
/*  13. Homepage Four
/*----------------------------------------*/
.header-four-area {background: #333333 none repeat scroll 0 0;}
.header-four-area .header-top {border-color: #222222;}
.header-four-area .call-number {float: left; margin-left: 25px; padding: 16px 0;}
.header-four-area .logo {padding: 24px 0 30px; text-align: center}
.header-four-area .cat-search-wrapper {
    background: #ffffff none repeat scroll 0 0;
    border-radius: 7px;
    margin: 38px 0;
}
.header-four-area .ht-categories button {border-radius: 7px;}
.header-four-area .ht-cart-box {
    background: #00ade5 none repeat scroll 0 0;
    border-radius: 7px;
    height: 46px;
    margin: 38px 0;
}
.header-four-area .ht-cart-details {left: 0; width: 100%;}
.header-four-area .main-menu > nav > ul > li > a {border-right: 1px solid #363636; padding: 29px 17px 26px 21px;}
.header-four-area .main-menu > nav > ul > li {float: left; margin-right: 0;}
.header-four-area .main-menu ul li ul.megamenu > li {padding-right: 20px; width: 141px;}
.header-four-area .main-menu {z-index: 8;}
.category-menu {margin-top: -70px;}
.cat-menu > li {
    background: #00ade5 none repeat scroll 0 0;
    border-bottom: 1px solid #0083ad;
    display: block;
}
.cat-menu > li:last-child {border: 0}
.cat-menu > li a {
    color: #ffffff;
    display: block;
    padding: 17px 0 17px 72px;
    position: relative;
    transition: all 0.3s ease 0s;
}
.cat-title > li a img {filter: brightness(42) invert(0);}
.cat-menu > li a img {
    bottom: 0;
    filter: brightness(9) invert(0);
    left: 31px;
    margin: auto;
    position: absolute;
    top: 0;
    transition: all 0.3s ease 0s;
}
.cat-menu > li a:hover {background: #ececec none repeat scroll 0 0; color: #222222;}
.cat-menu > li.cat-title {display: block; font-size: 22px; height: 70px; text-transform: none;}
.cat-menu > li.cat-title a {
    background: rgba(0, 0, 0, 0) -moz-linear-gradient(105deg, #2FB1E2 , #0185B6) repeat scroll 0 0;
    color: #ffffff;
    padding: 21px 32px 22px;
}
.cat-menu > li.cat-title a img {margin-right: 16px; position: relative; top: -2px; left: auto;}
.cat-menu > li a:hover img {filter: brightness(0) invert(0);}
.cat-menu > li.cat-title a:hover img {filter: brightness(9) invert(0);}

.image-slider {float: left; width: 76.9%; overflow: hidden; margin-top: 30px}
.nav-image-slider {width: 23.1%; float: left; margin-top: 30px}
.sin-image {cursor: pointer; width: 100%;}
.nav-image-slider .slick-list {padding: 0 !important;}
.nav-image-slider .sin-image img {width: 100%;}
.nav-image-slider .sin-image {border: 1px solid #ffffff; position: relative;}
.nav-image-slider .sin-image.slick-current {border-color: #00ade5;}
.slick-arrow {
    background: #c0c0c0 none repeat scroll 0 0;
    bottom: 0px;
    font-size: 0;
    height: 38px;
    left: -8px;
    padding: 0;
    position: absolute;
    text-align: center;
    width: 46px;
    z-index: 2;
    transition: all 0.3s ease 0s
}
.slick-prev {transform: skewX(-13deg); z-index: 3; border-right: 1px solid #fff;}
.slick-arrow::after {
    color: #ffffff;
    content: "";
    font-family: FontAwesome;
    font-size: 24px;
    height: 100%;
    left: 4px;
    line-height: 38px;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
}
.slick-prev::after {content: ""; transform: skewX(13deg);}
.slick-next {left: 29px;}
.slick-next:after{content: "\f101";}
.slick-arrow:hover {background: #00ADE5}
.image-slider .slick-slide {position: relative;}
.image-slider .sin-slider-text {
    height: 100%;
    left: 0;
    padding-left: 35px;
    padding-top: 98px;
    position: absolute;
    top: 0;
    width: 76%;
    z-index: 1;
}
.sin-slider-text h1 {color: #222222; font-size: 76px; font-weight: 700; margin-bottom: 10px;}
.sin-slider-text h1 span {color: #1cadd9;}
.sin-slider-text > p {color: #959595; font-size: 13px; font-style: normal; padding: 0;}
.sin-slider-text .slider-btn {
    border: 1px solid #959595;
    color: #222222;
    line-height: 28px;
    padding: 0 12px;
}
.sin-slider-text .slider-btn:hover {
    background: #00ade5 none repeat scroll 0 0;
    border-color: #00ade5;
    color: #ffffff;
}
.sin-slider-text .banner-btn {margin-top: 26px;}
.image-slider .slide-two .sin-slider-text, .image-slider .slide-three .sin-slider-text {
    left: 10%;
    margin: auto;
    padding-left: 0;
    padding-top: 192px;
    width: 80%;
}
.slide-three .sin-slider-text h3 {margin-bottom: 0px}
.slide-two .sin-slider-text h1, .slide-three .sin-slider-text h1 {color: #ffffff; font-size: 66px;}
.slide-two .sin-slider-text h1 span, .slide-three .sin-slider-text h1 span {color: #1cadd9;}
.slide-two .sin-slider-text > p, .slide-three .sin-slider-text > p {color: #222222; padding: 0 30px;}
.slide-two .sin-slider-text .slider-btn, .slide-three .sin-slider-text .slider-btn {
    background: #1cadd9 none repeat scroll 0 0;
    border-color: #1cadd9;
    color: #ffffff;
}
.slide-two .sin-slider-text .slider-btn:hover, .slide-three .sin-slider-text .slider-btn:hover {
    background: #222222 none repeat scroll 0 0;
    border-color: #222222;
    color: #ffffff;
}
.slide-two .sin-slider-text > h3 {margin-bottom: 0px;}
.slide-three .sin-slider-text .banner-btn {margin-top: 5px;}
.tab-style-2 .sub-title.bold > h3 {font-weight: 700;}
.product-tab-four-area .carousel-style-1 .owl-nav, .carousel-style-2 .owl-nav {top: -2px;}
.product-tab-four-area .ht-single-product-content:first-child {margin-bottom: 0;}
.blog-brand-area-four .ht-blog-container .sub-title > h3 {font-weight: 700;}
.blog-brand-area-four .carousel-style-1 .owl-nav {top: -3px;}
.slider-main-area .image-slider img {width: 100%;}
.product-tab-four-area .product-slide-wrapper .owl-nav {top: -105px;}
.blog-brand-area-four .carousel-style-1 .owl-nav {top: -69px;}
/*----------------------------------------*/
/*  14. Shop Page
/*----------------------------------------*/
/*----------------------------------------*/
/*  14.1 Shop Grid
/*----------------------------------------*/
.breadcrumb {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    margin: 0;
    padding: 37px 0 52px;
}
.breadcrumb li {color: #00ade5;}
.breadcrumb li a {color: #222222;}
.breadcrumb li a:hover {color: #00ade5;}
.breadcrumb > li + li::before {color: #00ade5; content: ">";}
.breadcrumb-2 .breadcrumb {border-bottom: 1px solid #ebebeb; margin-bottom: 80px; padding: 16px 0 15px;}
.ht-sidebar-widget-wrapper h2 {
    background: #ffffff none repeat scroll 0 0;
    bottom: -2px;
    color: #00ade5;
    display: inline-block;
    font-size: 30px;
    font-weight: 700;
    line-height: 23px;
    padding-right: 8px;
    position: relative;
    text-transform: none;
    z-index: 1;
}
.sidebar-main-title {margin-bottom: 47px; position: relative;}
.sidebar-main-title::after {
    border-bottom: 1px solid #00ade5;
    bottom: 1px;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    width: 100%;
}
.ht-sidebar-widget {border: 1px solid #ededed; margin-bottom: 22px; padding: 21px 24px 27px;}
.sidebar-title {color: #222222; line-height: 16px; margin-bottom: 30px; text-transform: none;}
.category-widget a {color: #222222; display: block;}
.category-widget > li {display: block; margin-bottom: 11px;}
.category-widget > li:last-child {margin: 0;}
.ht-sidebar-widget:last-child {margin: 0;}
.ht-sidebar-widget-wrapper {margin-bottom: 49px;}
.ht-sidebar-widget-wrapper:last-child {margin: 0;}
.category-widget a span {color: #00ade5; transition: all 0.3s ease 0s;}
.category-widget a:hover {color: #00ade5;}
.ht-sidebar-widget.blue-color {background: #00ade5 none repeat scroll 0 0; padding: 0;}
.blue-color ul.category-widget li a {color: #ffffff;}
.blue-color ul.category-widget li a span {color: #222222;}
.blue-color ul.category-widget li a:hover {color: #222222;}
.blue-color .sidebar-title {
    background: rgba(0, 0, 0, 0) -moz-linear-gradient(105deg, #139FD4, #007BA5) repeat scroll 0 0;
    color: #ffffff;
    margin: 0;
    padding: 20px 24px 18px;
}
.blue-color .category-widget {padding: 14px 24px 17px;}
.range {color: #363636; display: block; margin-bottom: 22px;}
.ui-widget-content {
    background: #dbdbdb none repeat scroll 0 0;
    border: 0 none;
    border-radius: 0;
    height: 2px;
    margin-bottom: 10px;
}
.ui-slider-range {background: #000 none repeat scroll 0 0;}
.slider-values > input {
    border: 0 none;
    color: #000000;
    font-size: 14px;
    height: auto;
    margin-bottom: 27px;
    padding: 0;
}
.ui-slider-handle.ui-state-default {
    background: #ffffff none repeat scroll 0 0;
    border: 0 none;
    border-radius: 50%;
    box-shadow: 0 0 0 4px #000000;
    height: 14px;
    margin-left: 0;
    top: -7px;
    width: 14px;
}
.widget-tags > li {display: inline-block; margin-bottom: 17px; margin-right: 6px;}
.widget-tags a {font-size: 14px; padding: 3px 8px;}
.widget-tags a:hover {background: #1cadd9 none repeat scroll 0 0; color: #ffffff;}
.ht-sidebar-widget.tags {padding: 28px 16px 14px;}
.ht-sidebar-widget > p {color: #222222; margin-bottom: 5px; padding-top: 4px;}
.shop-area .ht-product-tab {left: auto; overflow: hidden; padding-bottom: 7px; position: inherit; width: auto;}
.shop-area .nav-tabs {display: block; float: right;}
.shop-area .nav.nav-tabs > li a {font-size: 14px; text-transform: none;}
.shop-area .ht-product-tab .nav-tabs > li::after {display: none;}
.shop-area .nav.nav-tabs > li a, .shop-area .nav.nav-tabs > li.active a {color: #222222;}
.shop-area .nav.nav-tabs > li a i {padding-right: 11px;}
.shop-area .ht-product-tab .nav-tabs > li:last-child {padding: 0;}
.shop-area .ht-product-tab .nav-tabs > li {padding-right: 30px;}
.shop-area .nav.nav-tabs li.active a i {color: #00ade5;}
.pagination-wrapper {display: block; float: left;}
.shop-results {color: #222222; float: left; position: relative; width: 67px;}
.shop-results select {
    -moz-appearance: none;
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    color: #00ade5;
    cursor: pointer;
    height: 17px;
    padding: 0 11px 0 0;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
    z-index: 2;
}
.shop-results option {border: 0 none; padding-left: 5px;}
.shop-results::after {content: ""; font-family: FontAwesome; position: absolute; right: 0; top: 0;}
.shop-results > span {color: #00ade5; padding-right: 5px;}
.pagination-content {float: left;}
.pagination-content > span {color: #222222; display: block; float: left; margin-left: 20px; margin-right: 14px;}
.pagination {display: block; float: left; margin: 0;}
.ht-page {float: left; padding: 0 8px;}
.pagination > li > a, .pagination > li > span {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    color: #222222;
    font-size: 14px;
    line-height: 16px;
    padding: 0 9px;
}
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #00ade5;
}
.ht-page:hover {color: #00ade5;}
.shop-area .tab-content {
    border-bottom: 1px solid #00ade5;
    border-top: 1px solid #00ade5;
    padding-bottom: 27px;
    padding-top: 42px;
    margin-bottom: 18px
}
.shop-area .ht-single-product {margin-bottom: 36px;}
/*----------------------------------------*/
/*  14.2 Shop List
/*----------------------------------------*/
.shop-area .list .ht-product-image {border: 1px solid #ebebeb; float: left;}
.shop-area .list .ht-product-text {overflow: hidden; padding-left: 30px; padding-right: 95px;}
.shop-area .list .ht-single-product {
    border: 0 none;
    margin-bottom: 19px;
    overflow: hidden;
    padding-top: 11px;
    text-align: left;
}
.list .ht-single-product .ht-p-tag {top: 0;}
.list .ht-product-text h5 a {color: #222222; font-size: 16px;}
.list .ht-product-text h5 a:hover {color: #00ade5;}
.list .ht-product-text > h5 {padding: 0;}
.list .ratings i {font-size: 16px;}
.list .ratings {padding-bottom: 0; padding-top: 14px;}
.list .ht-product-text h3 {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #00ade5;
    font-size: 26px;
    padding: 10px 0 12px;
}
.list .ht-product-text h3 span {color: #c2c2c2; font-size: 16px;}
.list .ht-product-button .cart_btn {
    border-color: #f0f0f0;
    border-radius: 30px;
    color: #898989;
    font-size: 14px;
    height: 51px;
    line-height: 51px;
    margin-left: 0;
    padding: 0 38px;
    width: auto;
}
.list .ht-product-button {opacity: 1; position: inherit; transform: scale(1);}
.list .ht-product-button {height: auto;}
.list .ht-product-button button:hover img {filter: brightness(1) invert(1);}
.list .ht-product-button button:hover img {filter: brightness(3) invert(0);}
.list .ht-product-button .cart_btn:hover {border-color: #1cadd9; color: #ffffff;}
.list .ht-product-button button {height: 51px; margin: 0 4px; width: 51px;}
.list .ht-product-text > p {margin-bottom: 24px;}
/*----------------------------------------*/
/*  15. Product Details Page
/*----------------------------------------*/
.slick-slider-image img {border: 1px solid #ebebeb;}
.slider-nav {margin-bottom: 30px;}
.details-nav .slick-list {padding: 0 !important;}
.details-nav .nav-image img {width: 100%;}
.details-nav .nav-image span {cursor: pointer; position: relative; display: block        }
.details-nav .nav-image span::after, .details-nav .nav-image span::before {
    border: 1px solid #ececec;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    transition: all 0.3s ease 0s
}
.details-nav .nav-image span::after {
    bottom: 1px;
    height: calc(100% - 2px);
    left: 1px;
    right: 1px;
    top: 1px;
    width: calc(100% - 2px);
    border-color: transparent
}
.details-nav .nav-image.slick-current span::after, .details-nav .nav-image.slick-current span::before {
    border-color: #1CADD9
}
.details-nav {margin-right: 33px; padding-right: 67px;}
.details-nav .slick-arrow {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #e6e6e6;
    bottom: auto;
    height: 21px;
    left: auto;
    right: -59px;
    top: 0;
    width: 23px;
}
.details-nav .slick-arrow::after {
    color: #dddddd;
    font-size: 14px;
    line-height: 19px;
    text-align: center;
    transform: skewX(0deg);
    width: 70%;
}
.details-nav .slick-arrow:hover {background: #222222 none repeat scroll 0 0;}
.details-nav .slick-prev {right: -37px; transform: skewX(0deg);}
.p-details-container {border-top: 1px solid #ebebeb; margin-top: 35px; padding-top: 33px;}
.p-details-container > h2 {color: #222222; line-height: 22px; text-transform: none;}
.details-review .ratings i {font-size: 18px;}
.details-review .ratings {display: inline-block; padding: 0;}
.details-review > span {color: #c2c2c2; display: inline-block; font-size: 18px; margin-left: 10px;}
.details-review {padding-bottom: 9px; padding-top: 19px;}
.p-details-price {color: #00ade5; display: block; font-size: 48px; margin-bottom: 13px;}
.p-details-price > span {
    color: #c2c2c2;
    font-size: 24px;
    padding-left: 24px;
    position: relative;
    text-decoration: line-through;
}
.p-details-container > p {color: #959595; font-size: 14px; line-height: 18px; padding-right: 70px;}
.p-details-price > span::after {bottom: 0; content: "/"; left: 4px; position: absolute;}
.single-p-option > label {color: #222222; font-size: 14px; line-height: 20px; margin: 0; width: 60px;}
.single-p-option select {
    -moz-appearance: none;
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #ebebeb;
    color: #898989;
    cursor: pointer;
    font-size: 14px;
    height: 23px;
    padding-right: 31px;
    position: relative;
    width: 143px;
    z-index: 2;
}
.single-p-option:first-child {float: left;}
.single-p-option:last-child {float: right;}
.p-details-options {overflow: hidden; padding-bottom: 31px; padding-top: 9px;}
.single-p-option::after {
    background: #ececec none repeat scroll 0 0;
    color: #898989;
    content: "";
    font-family: FontAwesome;
    font-size: 14px;
    height: 23px;
    line-height: 23px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 25px;
}
.single-p-option {position: relative;}
.p-details-share {border-bottom: 1px solid #ebebeb; border-top: 1px solid #ebebeb; padding: 11px 0 13px;}
.p-details-share button {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #898989;
    font-size: 14px;
}
.p-details-share button i {margin-right: 15px;}
.p-details-share button:hover {color: #00ade5;}
#p-quantity > label {
    color: #222222;
    float: left;
    font-size: 16px;
    font-weight: 700;
    line-height: 46px;
    width: 70px;
}
.qtybutton {
    border: 3px solid #ebebeb;
    color: #898989;
    cursor: pointer;
    float: left;
    font-size: 21px;
    font-weight: 700;
    height: 24px;
    line-height: 18px;
    margin: 12px 0;
    position: relative;
    text-align: center;
    width: 24px;
}
.qtybutton::-moz-selection {background: #ccc}
.dec.qtybutton {font-size: 31px; line-height: 15px;}
.cart-plus-minus-box {
    border: 3px solid #898989;
    color: #222222;
    float: left;
    font-size: 18px;
    height: 50px;
    margin: 0 14px 0 0;
    padding: 0;
    text-align: center;
    width: 51px;
}
.no-spin, .no-spin:hover, no-spin:focus {-webkit-appearance: none; -moz-appearance:textfield;}
#p-quantity {float: left; padding: 5px 0;}
.p-details-quantity {overflow: hidden; padding: 35px 0;}
.p-details-quantity .default-btn {
    float: left;
    font-size: 18px;
    height: 60px;
    line-height: 60px;
    margin-left: 30px;
    padding: 0 44px;
}
.product-details-area .nav.nav-tabs {border: 0 none;}
.product-details-area .nav-tabs > li.active > a, .product-details-area .nav-tabs > li.active > a:focus, .product-details-area .nav-tabs > li > a:hover, .product-details-area .nav-tabs > li.active > a:hover {
    background: #ffffff none repeat scroll 0 0;
    border: 0 none;
    color: #222222;
}
.product-details-area .nav-tabs > li {margin-right: 27px; padding-bottom: 17px;}
.product-details-area .nav-tabs > li > a {
    background: #ffffff none repeat scroll 0 0;
    border: 0 none;
    border-radius: 0;
    color: #898989;
    font-size: 18px;
    line-height: 15px;
    margin: 0;
    padding: 0;
    position: relative;
    text-transform: none;
}
.p-details-tab {border: 1px solid #959595; padding: 33px 90px 30px 34px;}
.product-details-bottom .tab-text > p {color: #7d7d7d; font-size: 13px; line-height: 26px;}
.details-product-area .sub-title h3 {font-weight: 400;}
.details-product-area .sub-title::after {bottom: 8px; right: 0;}
.details-product-area .carousel-style-1 .owl-nav {top: -65px;}
.p-owl-container {position: relative;}
/*----------------------------------------*/
/*  16. Cart Page
/*----------------------------------------*/
.cart-main-area .cart-table table {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #f1f1f1;
    line-height: 25px;
    margin: 0;
    width: 100%;
}
.cart-main-area .cart-table table th {
    border-bottom: 1px solid #f2f2f2;
    border-left: 1px solid #f1f1f1;
    color: #000000;
    font-size: 16px;
    font-weight: 400;
    padding: 13px 20px;
    text-transform: none;
    vertical-align: middle;
}
.cart-main-area .p-image > a {border: 1px solid #ececec; display: block; text-align: center;}
.cart-main-area .cart-table table td {
    border-right: 1px solid #f1f1f1;
    color: #000000;
    text-align: left;
    vertical-align: middle;
}
.cart-main-area .cart-table table td.p-total {border: 0 none; font-size: 15px; text-align: center; width: 13%;}
.cart-main-area .cart-table table .p-amount {text-align: center; width: 13%;}
.cart-main-area .cart-table table td.edit {text-align: center; width: 10%;}
.cart-main-area .cart-table table td.p-quantity {text-align: center; width: 6%;}
.cart-main-area .cart-table .p-quantity input, .wishlist-concept form input {
    border: 1px solid #f2f2f2;
    color: #222222;
    padding: 5px;
    text-align: center;
    width: 3em;
}
.cart-main-area .all-cart-buttons {padding: 40px 0 35px;}
.ht-shipping-content, .amount-totals {display: block; margin-bottom: 46px; overflow: hidden;}
.cart-main-area .ht-shipping-content h3, .ht-single-about > h3 {
    border-bottom: 1px solid #ececec;
    color: #000000;
    font-size: 16px;
    line-height: 13px;
    margin-bottom: 11px;
    padding-bottom: 9px;
    text-transform: none;
}
.cart-main-area select.country {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #f1f1f1;
    color: #777777;
    height: 40px;
    margin-bottom: 18px;
    outline: medium none;
    padding: 0 10px;
    width: 300px;
    cursor: pointer;
}
.postal-code > input {
    border: 1px solid #f1f1f1;
    color: #555555;
    height: 38px;
    line-height: 25px;
    margin-bottom: 27px;
    outline: medium none;
    padding: 0 10px;
    width: 300px;
}
.cart-main-area select.country {-moz-appearance: none; -webkit-appearance: none;}
.ht-shipping-content .level {color: #7d7d7d; font-size: 13px; margin-bottom: 12px;}
.amount-totals {padding-left: 35px;}
.amount-totals > p.total {color: #7d7d7d; display: block; margin-bottom: 11px; text-align: left;}
.amount-totals p:nth-child(2) {text-transform: none; font-size: 16px;}
.amount-totals span {float: right;}
.amount-totals .button {float: right; margin-bottom: 10px; margin-top: 9px; overflow: hidden;}
.cart-main-area .cart-table table th.p-image {border: 0 none;}
.cart-main-area .cart-table table .p-name {padding-left: 110px; width: 38%;}
.p-image {padding: 0 43px 51px; width: 24%;}
.cart-main-area .cart-table table .p-total {padding: 13px 32px;}
.cart-main-area .cart-table table th.p-edit {border-left: 0 none;}
.p-name > a {color: #000000;}
.all-cart-buttons button, .buttons-set .button, .amount-totals .button {
    background: #232323 none repeat scroll 0 0;
    border: 0 none;
    border-radius: 30px;
    color: #ffffff;
    display: inline-block;
    font-size: 13px;
    line-height: 37px;
    padding: 0 26px;
    text-transform: none;
}
.all-cart-buttons button:last-child, .all-cart-buttons button:nth-child(2) {float: right; margin-left: 5px;}
.all-cart-buttons .button:hover, .buttons-set .button:hover, .amount-totals .button:hover {
    background: #1cadd9 none repeat scroll 0 0;
}
.ht-shipping-content > p {color: #7d7d7d; font-size: 14px; line-height: 20px; margin-bottom: 19px;}
.ht-shipping-content > h4 {
    color: #7d7d7d;
    font-size: 16px;
    line-height: 13px;
    margin-bottom: 22px;
    text-transform: none;
}
.ht-shipping-content:nth-of-type(2) > p {margin-bottom: 14px;}
.amount-totals > p {color: #7d7d7d; font-size: 13px; text-align: right;}
.ht-shipping-content:nth-of-type(2) {margin: 0;}
/*----------------------------------------*/
/*  17. Checkout Page
/*----------------------------------------*/
.checkout-area .panel-group {margin: 0; padding-bottom: 52px;}
.checkout-area #accordion .panel-heading {padding: 0}
.checkout-area #accordion .panel-title a.collapsed {font-size: 14px; border-color: #eeeeee; margin-bottom: 27px;}
.checkout-area .panel-title > a {
    background: #ffffff none repeat scroll 0 0;
    border-bottom: 3px solid #ffffff;
    color: #222222;
    display: block;
    font-size: 18px;
    line-height: 16px;
    margin-bottom: 9px;
    padding: 0 0 12px;
    position: relative;
    text-decoration: none;
    text-transform: none;
    width: 100%;
}
.checkout-area #accordion .panel-title a span {color: #000000; padding-right: 13px; font-size: 18px}
.checkout-area #accordion .panel-title a.collapsed span {color: #222222;}
.checkout-area .panel.panel-default {border: 0}
.checkout-area .panel {box-shadow: none}
.single-checkout > h2{font-size: 16px; font-weight: 500; margin-bottom: 13px; padding-top: 7px;}
h3.login-title {
    border-bottom: 2px solid #e5e5e5;
    color: #222222;
    font-size: 16px;
    margin-bottom: 20px;
    padding-bottom: 27px;
    text-transform: none;
}
.single-checkout p.heading-p {color: #222222; font-size: 14px; margin-bottom: 19px;}
.single-checkout label {
    color: #7d7d7d;
    display: block;
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 5px;
    overflow: hidden;
}
.single-panel {float: left; width: 50%;}
.single-panel:first-child {padding-right: 41px;}
.single-panel:last-child {padding-left: 41px;}
.single-checkout input {float: left; height: 23px; width: auto; cursor: pointer}
.single-checkout:first-child {margin-bottom: 14px;}
.single-checkout span {color: #7d7d7d; float: left; padding-left: 7px;}
.single-checkout input[type="radio"] {margin-top: -2px}
.single-checkout h4 {color: #222222; font-size: 14px; font-weight: normal; margin: 0 0 31px;}
.panel-body p.fast-check {color: #7d7d7d; line-height: 25px; margin-bottom: 1px;}
.fast-check span {padding-right: 13px; padding-left: 0;}
.single-checkout p {color: #7d7d7d;}
.single-checkout:last-child .heading-p {margin-bottom: 15px;}
.login-btn {margin-top: 29px}
.checkout-area .c-btn:hover, .login-btn:hover, .login-reister-area .c-btn:hover {
    background: #E03550 none repeat scroll 0 0;
    color: #ffffff;
} 
.login-form input {
    border: 1px solid #e1e1e1;
    border-radius: 0;
    box-shadow: none;
    clear: both;
    cursor: auto;
    display: block;
    height: 32px;
    margin-bottom: 10px;
    overflow: hidden;
    padding: 0 10px;
    width: 100%;
}
.single-checkout .login-form p {
    color: #666666;
    font-size: 14px;
    font-weight: 400;
    line-height: 28px;
    margin-bottom: 0;
    padding-bottom: 5px;
}
.login-form p span {color: #eb340a; padding-left: 2px;}
.forgot-pass {
    border-bottom: 1px solid #222222;
    color: #222222;
    display: inline-block;
    line-height: 13px;
    margin-top: 5px;
    overflow: hidden;
    text-decoration: none;
    z-index: 9;
}
.login-reister-area .c-btn {
    display: block;
    float: left;
    margin-top: 20px;
    padding: 6px 25px !important;
}
.checkout-progress .section-title {margin-bottom: 0; margin-right: 0;}
.checkout-progress ul.check li {border-bottom: 1px solid #ececec; display: block; padding: 13px 0 17px;}
.checkout-progress ul.check li:last-child {border: 0}
.checkout-progress .check > li a {color: #7d7d7d; text-transform: none; font-size: 13px;}
.checkout-progress .check > li a:hover {color: #1CADD9}
.checkout-progress ul.check li a i {margin-right: 18px; font-size: 14px;}
.checkout-area .customer-name div, .checkout-area .customer-info div, .customer-info div, .city-country div {
    float: left;
    width: 50%;
}
.checkout-area .login-form p {color: #7d7d7d; padding-bottom: 0;}
.city-country, .customer-info, .customer-name {overflow: hidden}
.city-country select {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #e1e1e1;
    height: 32px;
    line-height: 32px;
    padding: 0 5px;
    width: 100%;
    cursor: pointer;
}
.ship-address > input {
    display: inline-block;
    height: auto;
    margin-right: 6px;
    padding: 0;
    position: relative;
    top: -3px;
    width: auto;
}
.checkout-area .login-form .buttons-set {padding-bottom: 0; padding-top: 1em;}
.ship-address label {font-weight: normal; margin-bottom: 0; cursor: pointer}
.ship-address input[type="radio"] {
    display: inline-block;
    margin-right: 9px;
    margin-top: 0;
    width: auto;
    height: auto;
}
.ship-address input[type="radio"]:focus, .billing-add input[type="checkbox"]:focus {outline: none}
.billing-add input[type="checkbox"] {
    display: inline-block;
    height: auto;
    margin-right: 6px;
    margin-top: -2px;
    width: auto;
}
.ship-new-address-info {display: none}
.checkout-area p.back-link {float: left; line-height: 14px; margin-top: 13px; padding-left: 0;}
.checkout-area p.back-link a:hover{color: #1CADD9}
.ship-method .buttons-set {margin: 20px 0 0; padding-top: 15px;}
.ship-wrap .ship-address input {margin-top: 0; top: 2px; position: relative;}
.checkout-table {padding: 10px}
.checkout-table table {width: 100%}
.checkout-table thead th {
    color: #7d7d7d;
    font-size: 14px;
    font-weight: 400;
    padding: 10px;
    text-transform: none;
}
.checkout-table table .p-amount {width: 80px}
.checkout-table table .p-quantity {text-align: center; width: 50px;}
.checkout-table table .p-total {width: 90px}
.checkout-table tbody tr, .checkout-table tfoot {border-top: 1px solid #f2f2f2}
.checkout-table tbody td.p-name {color: #232323; font-size: 16px; text-align: left;}
.checkout-table tbody td {padding: 10px; text-align: right; color: #7d7d7d;}
.checkout-table tfoot td {color: #7d7d7d; padding: 2px 10px; text-align: right;}
.checkout-table tfoot tr:first-child, .checkout-table tfoot tr:last-child {font-size: 16px}
.checkout-buttons {
    border: 1px solid #d9dde3;
    margin: 12px 2px;
    overflow: hidden;
    padding: 20px 30px;
}
.checkout-table .login-btn {margin-top: 0}
.panel-body p.fast-check:nth-of-type(3) {margin-bottom: 40px;}
.checkout-area .panel-body {
    border: 1px solid #dcdcdc;
    margin-bottom: 59px;
    padding: 32px 49px 31px 36px;
}
.single-panel:nth-child(2) .single-checkout > h4 {margin-bottom: 20px;}
.login-form > form {padding-top: 5px;}
.forgot-pss {display: inline-block;}
.forgot-pass:hover {color: #1CADD9; border-color: #1CADD9}
.single-checkout .default-btn {font-size: 13px; padding: 0 30px;}
.pass-wrap {margin-bottom: 27px;}
.customer-name > div:nth-child(1), .customer-info > div:nth-child(1), .city-country > div:first-child {
    padding-right: 15px;
}
.customer-name > div:nth-child(2), .customer-info > div:nth-child(2), .city-country > div:nth-child(2) {
    padding-left: 15px;
}
.checkout-area .buttons-set .button {float: right;}
.ship-method > p {color: #7d7d7d;}
.checkout-area .buttons-set .button {float: right;}
.ship-method > p {color: #7d7d7d;}
.ship-method.payment {text-align: left;}
.checkout-area .ship-address {margin-bottom: 10px;}
.checkout-buttons > p {color: #7d7d7d; float: left;}
.checkout-buttons .button {float: right;}
.checkout-buttons .default-button {float: right;}
.checkout-buttons .default-btn {float: right; font-size: 13px;}
.checkout-buttons a:hover {color: #1cadd9;}
.checkout-progress .section-title > h4 {
    border-bottom: 2px solid #ececec;
    color: #222222;
    line-height: 14px;
    margin-bottom: 3px;
    padding-bottom: 25px;
    text-transform: none;
}
.checkout-progress .section-title {margin-bottom: 0; margin-right: 0;}
/*----------------------------------------*/
/*  18. Contact Page
/*----------------------------------------*/
.ht-c-title {color: #222222; line-height: 14px; margin-bottom: 29px; text-transform: none;}
.ht-c-icon {
    border: 2px solid #e5e5e5;
    border-radius: 50%;
    color: #959595;
    display: block;
    float: left;
    font-size: 16px;
    height: 38px;
    line-height: 36px;
    text-align: center;
    width: 38px;
}
.ht-c-info {margin-bottom: 7px; overflow: hidden;}
.ht-c-text {display: block; font-size: 13px; line-height: 20px; overflow: hidden; padding: 9px 0 10px 16px;}
.ht-c-text span {color: #7d7d7d;}
.ht-c-info:first-of-type .ht-c-text {padding-bottom: 0; padding-top: 0;}
.contact-info {padding-right: 80px;}
.contact-form-wrapper label {color: #7d7d7d; font-size: 14px; margin-bottom: 9px;}
.contact-form-wrapper input, .contact-form-wrapper textarea { 
    border: 1px solid #ebebeb;
    height: 40px;
    margin-bottom: 17px;
}
.contact-form-wrapper textarea {height: 172px; margin-bottom: 27px;}
/*----------------------------------------*/
/*  19. About Page
/*----------------------------------------*/
.about-banner {position: relative;}
.about-banner::after {
    border: 1px solid #ffffff;
    bottom: 5px;
    content: "";
    left: 4px;
    position: absolute;
    right: 4px;
    top: 5px;
}
.about-text > h3 {
    color: #222222;
    font-size: 21px;
    line-height: 16px;
    margin-bottom: 17px;
    text-transform: none;
}
.about-text > p {font-size: 14px; font-style: italic; line-height: 26px; margin: 0 0 12px;}
.about-text {padding-right: 22px; padding-top: 11px;}
.about-text .default-btn {font-size: 13px; margin-top: 14px;}
.about-top {padding-bottom: 80px;}
.progress {
    background: #ebebeb none repeat scroll 0 0;
    border-radius: 30px;
    box-shadow: none;
    height: 24px;
    overflow: visible;
}
.progress-bar {
    background: #c2c2c2 none repeat scroll 0 0;
    border-radius: 30px;
    box-shadow: none;
    position: relative;
}
.progress-bar .text-top {
    background: #222222 none repeat scroll 0 0;
    border-radius: 50%;
    font-size: 12px;
    height: 42px;
    left: 0;
    line-height: 41px;
    position: absolute;
    text-transform: none;
    top: -9px;
    width: 42px;
}
.skill-bar-item {padding-bottom: 6px; position: relative;}
.skill-bar-item > span {
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    line-height: 23px;
    margin-left: 50px;
    position: absolute;
    text-align: center;
    text-transform: none;
    z-index: 2;
}
.skill-bar {overflow: hidden; padding-top: 22px;}
.ht-single-about > h5 {
    color: #000000;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    margin-bottom: 9px;
    padding-top: 17px;
}
.ht-single-about > p {
    color: #7d7d7d;
    font-size: 14px;
    font-style: italic;
    line-height: 18px;
    margin: 0 0 8px;
    text-indent: 13px;
}
.ht-about-work {margin-bottom: 27px; position: relative;}
.ht-work-text > h5 {
    font-size: 14px;
    font-weight: 600;
    line-height: 12px;
    margin-bottom: 5px;
    padding-top: 8px;
}
.ht-work-text > h5 a {color: #000000;}
.ht-work-text > h5 a:hover {color: #7d7d7d;}
.ht-work-text > p {
    color: #7d7d7d;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ht-about-work > span {
    background: #ebebeb none repeat scroll 0 0;
    border-radius: 50%;
    color: #7d7d7d;
    display: block;
    float: left;
    height: 42px;
    line-height: 41px;
    text-align: center;
    transition: all 0.3s ease 0s;
    width: 42px;
}
.ht-work-text {overflow: hidden; padding-left: 10px;}
.ht-about-work:hover > span {background: #222222 none repeat scroll 0 0; color: #ffffff;}
.ht-about-work:last-child {margin: 0;}
/*----------------------------------------*/
/*  20. Wishlist Page
/*----------------------------------------*/
.wishlist-table table {
    background: #ffffff none repeat scroll 0 0;
    border-color: #d6d4d4;
    border-radius: 0;
    border-style: solid;
    border-width: 1px 0 0 1px;
    width: 100%;
}
.wishlist-table table th, .wishlist-table table td {
    border-bottom: 1px solid #d6d4d4;
    border-right: 1px solid #d6d4d4;
    color: #222222;
    font-size: 15px;
    font-weight: 400;
    padding: 20px 10px;
    text-align: center;
    text-transform: none;
}
.wishlist-table table .product-remove {padding: 0 15px; width: 20px;}
.wishlist-table table .product-remove > a {color: #777777; font-size: 25px;}
.wishlist-table table .product-remove > a:hover {color: #1CADD9;}
.wishlist-table table .product-thumbnail {width: 150px;}
.wishlist-area .product-name > a, .wishlist-area td.product-price span.amount, .wishlist-area .product-stock-status span {
    color: #7d7d7d;
    font-size: 16px;
    text-transform: capitalize;
}
.wishlist-table table .wishlist-in-stock {color: #575757;}
.wishlist-table table .product-add-to-cart > a {
    background: #222222 none repeat scroll 0 0;
    color: #ffffff;
    display: inline-block;
    font-weight: 700;
    padding: 10px 31px;
    text-transform: none;
}
.wishlist-table table .product-add-to-cart > a:hover {background: #1CADD9 none repeat scroll 0 0;}
.wishlist-table table .product-add-to-cart {width: 240px;}
.wishlist-share {margin-bottom: 35px; margin-top: 20px;}
.wishlist-share ul li {display: inline-block; height: 21px; margin-left: 0; margin-right: 0;}
.wishlist-share ul li a {
    background-position: left top;
    border: medium none;
    display: inline-block;
    height: 21px;
    width: 21px;
}
.wishlist-share ul li a.facebook {
    background: rgba(0, 0, 0, 0) url("../img/icon/facebook.png") no-repeat scroll 0 0;
}
.wishlist-share ul li a.twitter {
    background: rgba(0, 0, 0, 0) url("../img/icon/twitter.png") no-repeat scroll 0 0;
}
.wishlist-share ul li a.pinterest {
    background: rgba(0, 0, 0, 0) url("../img/icon/pinterest.jpg") no-repeat scroll 0 0;
}
.wishlist-share ul li a.googleplus {
    background: rgba(0, 0, 0, 0) url("../img/icon/googleplus.jpg") no-repeat scroll 0 0;
}
.wishlist-share ul li a:hover {
    background-position: left bottom;
}
.product-name > a:hover {color: #222222;}
.wishlist-share-title {font-size: 14px; margin-bottom: 10px;}
/*----------------------------------------*/
/*  21. Blog Details Page
/*----------------------------------------*/
.style-two .ht-sidebar-widget {border: 0 none; margin-bottom: 45px; padding: 0;}
.style-two .sidebar-title {
    border-bottom: 1px solid #ededed;
    font-size: 16px;
    padding-bottom: 10px;
}
.style-two .category-widget a span {color: #222222; float: right;}
.style-two .category-widget a:hover span {color: #00ade5;}
.sidebar_search > input {
    border: 1px solid #ededed;
    color: #222222;
    font-size: 13px;
    height: 40px;
    padding: 0 15px;
}
.sidebar_search {position: relative;}
.sidebar_search > button {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #222222;
    height: 100%;
    padding: 0 15px;
    position: absolute;
    right: 0;
    top: 0;
}
.sidebar_search > input::-moz-placeholder {color: #222222;}
.style-two .widget-tags a {border: 1px solid #ededed; padding: 7px 16px;}
.style-two .widget-tags > li {line-height: 30px;}
.style-two .widget-tags a:hover {border-color: #1cadd9;}
.blog-img > img {width: 100%;}
.blog-info {margin-top: 17px; padding-right: 20px}
.blog-info.blog-pad {margin: 0; padding: 20px 25px;}
.blog-meta > span {padding-right: 20px;}
.blog-meta a {
    color: #666666;
    text-transform: capitalize;
    transition: all 0.3s ease 0s;
}
.blog-meta span {
    color: #666666;
    text-transform: capitalize;
    transition: all 0.3s ease 0s;
}
.blog-meta a:hover {color: #888888;}
.blog-meta a i {color: #464646; font-size: 14px; padding-right: 10px;}
.blog-meta i {color: #464646; font-size: 14px; padding-right: 10px;}
.blog-info h3 {
    color: #333333;
    font-size: 16px;
    font-weight: 500;
    margin: 18px 0 20px;
    text-transform: none;
}
.blog-info > a {
    border: 1px solid #464646;
    color: #464646;
    display: inline-block;
    font-size: 12px;
    font-weight: bold;
    margin-top: 14px;
    padding: 8px 30px;
    text-transform: none;
    transition: all 0.3s ease 0s;
}
.blog-info > a:hover {background-color: #464646; color: #ffffff;}
.blog-info > p {color: #858587; line-height: 27px;}
blockquote {
    background-color: #f6f6f6;
    border-left: 2px solid #464646;
    color: #666666;
    font-size: 14px;
    line-height: 26px;
    margin: 23px 0;
    padding: 14px 50px;
}
.style-two .ht-sidebar-widget.tags {margin-bottom: 28px;}
.nes-icon > a i {color: #666666; font-size: 14px; margin-top: 10px;}
.news-allreply img {border-radius: 100%; width: 100%;}
.blog-img-details {padding-left: 90px;}
.blog-title > h3 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 7px;
    text-transform: capitalize;
}
.blog-title > span {
    color: #666666;
    display: block;
    margin-bottom: 7px;
}
.blog-middle-mrg {margin: 32px 0 33px 90px;}
.leave-form input {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #ebebeb;
    color: #7d7d7d;
    font-size: 14px;
    height: 40px;
    margin-bottom: 20px;
    padding: 0 17px;
}
.leave-form input::-moz-placeholder, .text-leave textarea::-moz-placeholder, .main-input input::-moz-placeholder, .text-leave2 textarea::-moz-placeholder {
    color: #7d7d7d;
    opacity: 1;
}
.text-leave textarea {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #ebebeb;
    color: #7d7d7d;
    font-size: 14px;
    height: 165px;
    margin-bottom: 30px;
    padding: 20px 17px;
}
.news-allreply {
    display: inline-block;
    float: left;
    text-align: center;
}
.blog-img-details p {color: #858587; line-height: 26px;}
.news-details-bottom {margin: 70px 0; padding-right: 110px;}
.leave-comment-text {
    border-bottom: 1px solid #dadada;
    color: #222222;
    display: inline-block;
    font-size: 18px;
    margin-bottom: 29px;
    padding-bottom: 6px;
    text-transform: none;
}
.leave-comment {padding-right: 120px;}
.submit.default-btn {font-size: 13px;}
.blog-page-area .ht-single-blog {margin-bottom: 40px;}
/*----------------------------------------*/
/*  22. Error Page
/*----------------------------------------*/
.error-area {height: 100vh;}
.error-logo {margin-bottom: 290px; padding-top: 70px;}
.error-text h2 {
    color: #ffffff;
    display: inline-block;
    font-size: 33px;
    line-height: 25px;
    margin-bottom: 7px;
    position: relative;
    text-transform: none;
}
.error-text h2::after {
    border-bottom: 1px solid #ffffff;
    bottom: -7px;
    content: "";
    height: 1px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    width: 98%;
}
.error-text {padding-top: 31px;}
.error-info h4 {
    color: #ffffff;
    display: inline-block;
    font-size: 18px;
    line-height: 14px;
    text-transform: none;
}
.error-info > a {
    color: #1cadd9;
    display: inline-block;
    font-size: 23px;
    font-weight: 700;
    line-height: 20px;
    margin-left: 55px;
    text-transform: none;
    vertical-align: bottom;
}
.error-info {padding-top: 31px;}
.error-info > a:hover {color: #ffffff;}
/*----------------------------------------*/
/*  23. Other CSS
/*----------------------------------------*/
/*----------------------------------------*/
/*  23.1 Login Modal
/*----------------------------------------*/
.modal {background-color: rgba(0, 0, 0, 0.6); z-index: 99999;}
.modal-dialog {
    bottom: 0;
    color: #ffffff;
    height: 432px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    text-align: left;
    top: 0;
    width: 465px;
}
.modal .modal-header {border: 0 none; min-height: auto; padding: 0;}
.modal-dialog button.close {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #444444;
    border-radius: 50%;
    color: #222222;
    cursor: pointer;
    font-size: 15px;
    height: 28px;
    line-height: 13px;
    margin-top: 0;
    opacity: 1;
    position: absolute;
    right: -13px;
    text-align: center;
    text-shadow: none;
    text-transform: none;
    top: -11px;
    width: 28px;
    z-index: 5;
}
.modal-body {padding: 0;}
.form-pop-up-content {background: #ffffff none repeat scroll 0 0; padding: 60px;}
.area-title {margin-bottom: 43px; text-align: center}
.form-pop-up-content .area-title h2 {
    border: 2px solid #ececec;
    color: #222222;
    display: inline-block;
    font-size: 20px;
    padding: 7px 40px;
    text-transform: none;
}
.form-box > input {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #ececec;
    color: #7d7d7d;
    font-size: 13px;
    height: 36px;
    margin-bottom: 18px;
    padding: 0 16px;
}
.form-pop-up-content label {cursor: pointer; display: block; margin-bottom: 26px;}
.remember > input {float: left; height: auto; margin-right: 10px; width: auto;}
.form-pop-up-content a:hover {color: #1cadd9;}
.form-pop-up-content .default-btn {font-size: 13px; margin-top: 35px; padding: 0 44px;}
/*----------------------------------------*/
/*  23.2 Newsletter Modal
/*----------------------------------------*/
#newslettermodal .modal-dialog {height: 400px; width: 800px;}
#newslettermodal .modal-content {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    box-shadow: none;
    float: right;
    padding: 75px 45px 0;
    text-align: center;
    width: 59%;
}
.newsletter-content > h2 {color: #1a1a1a; line-height: 23px; margin-bottom: 16px; text-transform: none;}
.newsletter-content > p {color: #7d7d7d; font-size: 12px; line-height: 20px; margin-bottom: 21px;}
.newsletter-content > input {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #d7d7d7;
    color: #7d7d7d;
    font-size: 13px;
    height: 43px;
}
.newsletter-popup .default-btn {font-size: 13px; line-height: 39px; margin-top: 32px; padding: 0 35px;}
.checkbox_newsletter {margin-top: 26px; overflow: hidden;}
.checkbox_newsletter > input {
    height: auto;
    margin-right: 3px;
    position: relative;
    top: 1px;
    width: auto;
}
.checkbox_newsletter > label {color: #7d7d7d; font-size: 14px;}





/* Force all product images to be perfect squares */
.ht-p-image.style_2 {
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
}

.ht-p-image.style_2::before {
  content: "";
  display: block;
  padding-bottom: 100% !important; /* 1:1 square */
}

.ht-p-image.style_2 img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}




/* ✅ Make the title + price area equal height on all product cards */
.ht-single-product-content .ht-p-text {
  min-height: 130px !important;   /* Adjust this value if needed */
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

/* ✅ Limit title text to 2 lines to prevent stretching */
.ht-single-product-content .ht-p-text h4 a {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;      /* Change to 3 if you want longer titles */
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  min-height: 40px !important;           /* Matches 2 lines */
}

/* ✅ Ensure price + cart always stay aligned at bottom */
.ht-single-product-content .price-cart-container {
  margin-top: auto !important;
}

.fixed-whatsapp-btn {
    position: fixed;
    bottom: 20px;           /* distance from bottom */
    right: 20px;            /* distance from right */
    background-color: #25d366; /* WhatsApp green */
    color: #fff;
    font-weight: bold;
    font-size: 16px;
    padding: 12px 20px;
    border-radius: 50px;
    text-decoration: none;
    display: flex;
    align-items: center;
    z-index: 9999;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
}

.fixed-whatsapp-btn i {
    margin-right: 10px;
    font-size: 20px;
}

.fixed-whatsapp-btn:hover {
    background-color: #1ebe5d;
    color: #fff;
    text-decoration: none;
}

.added-cart-popup {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #00c853;
  color: #ffffff;
  padding: 16px 22px;
  border-radius: 10px;
  font-size: 16px;
  z-index: 99999;
  box-shadow: 0 6px 18px rgba(0,0,0,0.25);
  max-width: 350px;
  text-align: center;
  display: none;
}

.added-cart-popup-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.added-cart-check {
  font-size: 26px;
}

.added-cart-text strong {
  font-size: 16px;
}

.added-cart-sub {
  font-size: 14px;
  opacity: 0.95;
}

.footer-social-icons {
  display: flex;
  gap: 14px;
  margin-top: 12px;
}

.footer-social-icons a {
  font-size: 20px;
  color: #222;
  transition: 0.3s;
}

.footer-social-icons a:hover {
  color: #295471;
}

.search-suggest-box {
  position: absolute;
  background: #fff;
  width: 100%;
  border: 1px solid #ddd;
  border-radius: 6px;
  display: none;
  z-index: 99999;
  margin-top: 4px;
  max-height: 300px;
  overflow-y: auto;
}

.suggest-list {
  padding: 0;
  margin: 0;
  list-style: none;
}

.suggest-list li {
  padding: 8px 10px;
  border-bottom: 1px solid #f4f4f4;
}

.suggest-list li:last-child {
  border-bottom: none;
}

.suggest-list a {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}

.suggest-list img {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border-radius: 4px;
}

.suggest-list .title {
  color: #333;
  font-size: 14px;
}

/* CATEGORY SIDEBAR STYLING */
.sidebar-categories {
  margin-bottom: 30px;
  padding: 20px;
  background: #295471; /* NEW BACKGROUND */
  border: none;
  border-radius: 6px;
}

.sidebar-categories .sidebar-title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 16px;
  color: #ffffff; /* WHITE TEXT FOR READABILITY */
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  padding-bottom: 10px;
}

.category-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.category-list li {
  margin-bottom: 12px;
}

.category-list li:last-child {
  margin-bottom: 0;
}

.category-list a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-decoration: none;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.15); /* Light overlay */
  border-radius: 4px;
  color: #ffffff; /* White text */
  transition: 0.25s ease;
  font-size: 15px;
}

.category-list a:hover {
  background: #BFA970; /* Green highlight */
  color: #ffffff;
}

.category-list .cat-count {
  background: rgba(255, 255, 255, 0.25);
  color: #ffffff;
  padding: 2px 6px;
  border-radius: 12px;
  font-size: 12px;
}

.category-list a:hover .cat-count {
  background: #ffffff;
  color: #000;
}

/* ✅ MOBILE RESPONSIVE */
@media (max-width: 768px) {
  .sidebar-categories {
    padding: 16px;
  }
  .sidebar-categories .sidebar-title {
    font-size: 18px;
  }
  .category-list a {
    padding: 8px 10px;
    font-size: 14px;
  }
  .category-list .cat-count {
    font-size: 11px;
  }
}

<style>
.color-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 15px 0;
}

.color-swatch-label {
  display: flex;
  align-items: center;
  cursor: pointer;
  gap: 8px;
}

.color-swatch-circle {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid #ddd;
  display: inline-block;
}

.color-swatch-label input {
  display: none;
}

.color-swatch-label input:checked + .color-swatch-circle {
  border-color: #000;
}
</style>


/* Product Actions Row: Quantity + Add to Cart */
.product-actions-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 15px;
    margin-top: 20px;
}

/* Quantity Box */
.quantity-box {
    display: flex;
    align-items: center;
    border: 1px solid #ddd;
    border-radius: 5px;
    overflow: hidden;
    width: 120px;
}

.qty-btn {
    width: 35px;
    height: 35px;
    font-size: 20px;
    font-weight: bold;
    border: none;
    background: #f2f2f2;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background 0.2s;
}

.qty-btn:hover {
    background: #e0e0e0;
}

.cart-plus-minus-box {
    width: 50px;
    text-align: center;
    border: none;
    font-size: 16px;
}

/* Add to Cart Button */
.default-btn.addtocart {
    padding: 10px 20px;
    background-color: #000;
    color: #fff;
    border-radius: 5px;
    text-transform: uppercase;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s;
}

.default-btn.addtocart:hover {
    background-color: #333;
}

/* Disabled Add to Cart */
.default-btn.disabled-add-to-cart {
    background-color: #ccc;
    color: #666;
    cursor: not-allowed;
}

/* Responsive for small screens */
@media (max-width: 768px) {
    .product-actions-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .quantity-box {
        width: 100%;
    }

    .default-btn.addtocart {
        width: 100%;
        text-align: center;
    }
}

/* Cart Drawer Styles */
.cart-drawer {
  position: fixed;
  top: 0;
  right: -420px;
  width: 400px;
  height: 100%;
  background: #fff;
  box-shadow: -2px 0 8px rgba(0,0,0,0.2);
  transition: right 0.4s ease;
  z-index: 10000;
  display: flex;
  flex-direction: column;
}
.cart-drawer.open {
  right: 0;
}
.cart-drawer-header {
  padding: 15px 20px;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.cart-drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: 15px 20px;
}
.cart-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  z-index: 9999;
}
.cart-drawer.open + .cart-overlay {
  display: block;
}
.close-cart {
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
}

/* Force arrows to their correct sides */
.product-slider-wrapper .slick-prev {
  left: -20px !important;
  right: auto !important;
}

.product-slider-wrapper .slick-next {
  right: -20px !important;
  left: auto !important;
}

.shopify-payment-button {
  display: block !important;
  margin-top: 15px !important;
}

.shopify-payment-button__button {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.shopify-payment-button__more-options {
  display: block !important;
}

.cat-search-wrapper {
  position: relative;
}

#search-suggestions {
  position: absolute;
  top: 100%;          /* Place it directly below the input */
  left: 0;
  width: 100%;
  background: #fff;
  z-index: 999;
  border: 1px solid #ddd;
  display: none;       /* Hide until suggestions appear */
}

.search-field {
  position: relative;
  z-index: 1000;       /* Keep typed text above suggestions */
  background: #fff;
}
