/*
Theme Name: Studio 21 Creative Theme
Theme URI: https://studio21.co/
Template: hello-elementor
Author: Studio 21
Author URI: https://studio21.co/
Description: Studio 21 Creative Website Theme
Tags: flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 2.4.0.1625113745
Updated: 2021-07-01 04:29:05
*/


/* Account Headings Styling */

body.page-id-1619 .woocommerce h2 {display:block !important; font-size: 1.3em !important}


/* Yith Styling */

#yith-wapo-container {flex: 0 0 100%; margin-bottom:20px}

label.image-container {width:40px}

#yith-wapo-container .selection-single.selected {border:2px solid #FF3100}
#yith-wapo-container .selection-single {background:#f5f5f7; border-radius: 4px}
label.yith-wapo-label {font-weight:400 !important; text-transform:none !important; font-family:inherit !important; font-size:1em !important}
.wapo-addon-title {
  font-size: 0.8em !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
  margin: 0px;
}

small.option-price {font-weight:600 !important}

dt.variation-DesignOptions {display:none !Important}


#yith-wapo-container .yith-wapo-block {
  padding: 0px !important;
}

.elementor-menu-cart__product .variation {margin:0px !important}

.elementor-menu-cart__product .variation dd {
  -webkit-margin-start: 0px;
  margin-inline-start: 0px;
  color: #a3a3a3;
}

.elementor-menu-cart__product-name a {
  display: flex;
  font-size: 1em;
}


.jet-form-builder.is-loading::after {content:""; color:white; font-size:20px; position: absolute; left:0px; top:0px; height:100%; width:100%; background-image:url(http://localhost:10092/wp-content/uploads/2023/10/Preloader-Black.png); background-repeat:no-repeat; background-position:center center}


/* Filter Panel */

@media (max-width:767px) {
	#filterpanel {position:fixed; height:100vh; width:80vw; padding:20px; top:0; left:-100%; z-index:999; transition: left ease-in-out 0.3s; background:#fff}
	#filterpanel.active {position:fixed; top:0; left:0%; z-index:999; transition: left ease-in-out 0.3s;}
	#filterpanel-overlay {opacity:0; display:block; width:100vw; height:100vh; background:rgba(0,0,0,0.8); position:fixed; left:0px; top:0px; transition: all ease 0.5s; visibility:hidden; z-index:998}
	#filterpanel-overlay.active { opacity:1; transition: all ease 0.5s; visibility:visible}

}

@media (min-width:768px) {
	#filterpanel-overlay {opacity:0; visibility:hidden}
}


/* Header */

@media(hover: hover) and (pointer: fine) {
#transparent-header:hover {background:#fff; -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.15); box-shadow: 0 0 10px 0 rgba(0,0,0,0.15); transition: background ease 300ms, box-shadow ease 300ms}
#transparent-header:hover #search-open svg, #transparent-header:hover #account-icon-loggedin svg, #transparent-header:hover #account-icon-loggedout svg, #transparent-header:hover #cart-icon svg {fill:#1C1A1A}
#transparent-header:hover  #main-menu .elementor-nav-menu--main .elementor-item {color:#1C1A1A}
#transparent-header:hover #primary-logo-inv {display:block}
#transparent-header:hover #primary-logo {display:none}
#transparent-header:hover .toggle-menu span {background-color: #1C1A1A;}
#transparent-header:hover .toggle-menu span:before, #transparent-header:hover .toggle-menu span:after {background-color: #1C1A1A;}
#transparent-header:hover .toggle-menu.active span {background-color: #1C1A1A;}
#transparent-header:hover .toggle-menu.active span:before, #transparent-header:hover .toggle-menu.active span:after {background-color: #fff;}
#transparent-header:hover .elementor-nav-menu .sub-arrow {fill:#1C1A1A !important; transition: fill ease 0.3s}
}


header.elementor-sticky--active {
    z-index: 9 !important;
}

#search-open {cursor:pointer}
.jet-ajax-search__results-area {width:calc(100% + 40px) !important}

@media (max-width:768px) {
.jet-ajax-search__results-area {margin-top: 0px !important}
}
	


#transparent-header {background:transparent; transition: background ease 300ms, box-shadow ease 300ms}
#transparent-header.elementor-sticky--active {background:#fff; -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.15); box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);}
#transparent-header.elementor-sticky--active #primary-logo {width:120px; transition: ease all 0.5s}
#transparent-header.elementor-sticky--active #search-open svg, #transparent-header.elementor-sticky--active #account-icon-loggedin svg, #transparent-header.elementor-sticky--active #account-icon-loggedout svg, #transparent-header.elementor-sticky--active #cart-icon svg {fill:#1C1A1A}
#transparent-header.elementor-sticky--active #main-menu .elementor-nav-menu--main .elementor-item {color:#1C1A1A}
#transparent-header.elementor-sticky--active #main-menu .elementor-item.elementor-item-active::after {background-color: #111 !important;}
#transparent-header:hover #main-menu .elementor-item.elementor-item-active::after {background-color: #111 !important;}



#primary-logo-inv {display:none}
#transparent-header.elementor-sticky--active #primary-logo-inv {display:block;}
#transparent-header.elementor-sticky--active #primary-logo {display:none}
#light-header.elementor-sticky--active {-webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.15); box-shadow: 0 0 10px 0 rgba(0,0,0,0.15);}
#light-header.elementor-sticky--active #primary-logo-alt {}

/* Nav Dropdown Desktop */

#transparent-header.elementor-sticky--active .elementor-nav-menu .sub-arrow {fill:#1C1A1A !important; transition: fill ease 0.3s}

#transparent-header.elementor-sticky--active .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown {margin-top: 27px !important;}
#light-header.elementor-sticky--active .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown {margin-top: 27px !important;}

#search-overlay {opacity:0; visibility:hidden; transition: all ease 300ms}
#search-overlay.active {opacity:1; visibility:visible; transition: all ease 300ms}

.productsearch input {border:0 !important}
.productsearch input:focus {border:0 !important}

#transparent-header.elementor-sticky--active .jet-ajax-search__results-area {margin-top: 9px !important}
#light-header.elementor-sticky--active .jet-ajax-search__results-area {margin-top: 9px !important}


/* Woo Categories */

.category-header {background-size:cover; background-position:center center}
.category-list ul {list-style:none; padding:0px}
.category-list ul li a {color:#838383}
.category-list ul li a:hover {color:#1C1A1A}
.category-list ul li.current-cat a {color:#1C1A1A}
.category-list ul.children {padding-left:15px}

/* General Styles */

:focus {outline: none !important}
.elementor-widget-container p a {text-decoration:underline; color:#e6275b}
.uline::before {content:""; display:inline-block; height:5px; width:100%; position:absolute; bottom:6px; background:#FF3100; mix-blend-mode: multiply; }
.uline {position:relative;}
.dlbutton svg {width:10px !important;}
body,html {overflow-x:hidden !important}

@media (max-width:768px){.dlbutton svg {width:8px !important;}}


/* Recaptcha */

.grecaptcha-badge {display:none}

/* Lost Password Fix */

.woocommerce-page form.lost_reset_password .form-row-last {width: 100% !important}


/* Woo Notices Styling */


.woocommerce-notices-wrapper [role=alert],
.woocommerce [role=alert], 
.woocommerce-form-coupon-toggle > .woocommerce-info, 
.woocommerce-form-login-toggle > .woocommerce-info {
    -webkit-animation: wd-fadeInUpBig 0.3s ease 0.3s both;
    animation: wd-fadeInUpBig 0.3s ease 0.3s both;
}

@keyframes wd-fadeInUpBig {
  0%    { opacity: 0; -webkit-transform: translate3d(0,50%,0); transform: translate3d(0,50%,0);}
  100%  { opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }
}

.woocommerce-message {margin-top:10px !important; margin-bottom:10px !important}


/* Woo Styles */

.variations select {
	padding:10px 20px !Important;
    border-radius: 0 !important;
	color:#111 !important;
}



:is(.elementor-widget-woocommerce-product-add-to-cart,.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart,.elementor-widget-wc-add-to-cart,.woocommerce div.product .elementor-widget-wc-add-to-cart) form.cart.variations_form .woocommerce-variation-add-to-cart, :is(.elementor-widget-woocommerce-product-add-to-cart,.woocommerce div.product .elementor-widget-woocommerce-product-add-to-cart,.elementor-widget-wc-add-to-cart,.woocommerce div.product .elementor-widget-wc-add-to-cart) form.cart:not(.grouped_form):not(.variations_form) {
    flex-wrap: wrap !important;
}

#stripe-payment-data fieldset {padding:0px; border:0px !important}

.woocommerce-variation-price {display:none !important}

table.variations select {background-color:#f5f5f7 !important; border:1px solid #eee !important; padding:10px 20px !important}

.woocommerce-Reviews-title {font-size:1.3em !important; letter-spacing:0px !important}
.woocommerce #review_form #respond textarea {border:1px solid #e1dde7}

.front-image:hover {opacity:0; transition:ease opacity 0.3s}
.front-image {transition:ease opacity 0.3s}

.woocommerce span.onsale {border-radius:4px; top:1em; left:1em}

:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button {background:#E6275B; color:#fff; border-radius:3px;font-weight:400;text-transform:uppercase; font-family:"Jost"}
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button:hover {background:#FF7600;color:#fff;}

.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[data-selected] {background-color: #FF3100 !important; color:#fff !important; font-size:1em !important}
.order-again {display:none}
.select2-selection__rendered {font-weight:400 !important}
.el-color-green {color: #6a737e !important}
.woocommerce address {padding:0px !important}
.woocommerce a.button.woocommerce-MyAccount-downloads-file {background-image: url(http://localhost:10092/wp-content/uploads/2023/06/download-white.svg) !important; background-position:10px 50% !important; background-repeat:no-repeat !important; background-size:16px !important; padding-left:40px !important} 
.woocommerce-account .shop_table {padding:2% !important; background:#f5f5f7 !important; margin-bottom: 15px !important}
.wc-item-meta {padding:0px !important}
.woocommerce-account h2 {display:none}
.woocommerce-form-login {max-width:600px; margin:0 auto !important}
.lost_reset_password {margin:0 auto}
.select2-selection__arrow b {border-color: #000 transparent transparent transparent !important;}
#add_payment_method #payment div.payment_box {background-color:#f5f5f7}
#add_payment_method #payment div.form-row {padding:0px}
#add_payment_method #payment div.payment_box::before {border:1em solid #f5f5f7 !important; border-right-color: transparent !important;
border-left-color: transparent !important;
border-top-color: transparent !important;}
.woocommerce-address-fields, #add_payment_method #payment {padding:0 !important}
.woocommerce-Address address {padding-left:0 !important; padding-right:0 !Importantl; padding-top:0 !important}
.woocommerce-Address .edit {left: 0px !important;margin-top: -30px !important;}
.wc-stripe-elements-field {border: 1px solid #ddd !important}
.woocommerce-MyAccount-content-wrapper {background: #f5f5f7; padding: 5% !important}
.elementor-widget-woocommerce-cart .woocommerce .input-text.qty {padding: 12px 9px !important; text-align: left !important; font-size: 14px !important; min-height: 40px !important; max-height: 40px !important;}
.wc-stripe-elements-field, .wc-stripe-iban-element-field {padding:15px !important}
.elementor-menu-cart__toggle_button.elementor-button {background-color:transparent !important}
.woocommerce-checkout #payment div.form-row { padding: 0em !Important;}
.elementor-menu-cart--items-indicator-bubble .elementor-menu-cart__toggle .elementor-button-icon .elementor-button-icon-qty {font-size:12px !important; line-height:1.6em !important}
table.variations tbody tr {display: flex;flex-direction: column;align-items: flex-start;}
.woo-variation-swatches .variable-items-wrapper.radio-variable-items-wrapper li .variable-item-radio-input-wrapper {display: flex !important;flex-wrap: nowrap;}
table.variations tbody > tr:nth-child(2n+1) > th { background-color: white;}
table.variations tbody > tr:nth-child(2n+1) > td {background-color: white}
table.variations tr th {padding:0px 0px 10px 0px}
.woocommerce div.product span.price {color:#000}
.woocommerce span.onsale {background-color:var( --e-global-color-c49ecd9 )}
.woocommerce-variation.single_variation {margin-bottom:15px}
.woocommerce div.product form.cart .reset_variations {display:none !important}
.woocommerce div.product form.cart div.quantity {margin:0px}
button.plus {margin:0px !important; color:#000 !important; background:#ffffff !important; border: 1px solid #999 !important; margin-left: -1px !important; max-width:50px !important}
button.minus {margin:0px !important; color:#000 !important; background:#ffffff !important; border: 1px solid #999 !important; margin-right: -1px !important; max-width:50px !important}
.single_variation_wrap {padding-top:20px}
#wc-stripe-payment-request-button-separator {display:none !important}
#wc-stripe-payment-request-wrapper {width:100%}
.woocommerce-variation-add-to-cart {flex-wrap:wrap !important}
.single_add_to_cart_button {flex:auto}

/* Menu Styling */


.menu-main-menu-container {width:90%}

#mobilemenu {opacity:0 !important; transition: all ease 0.8s; visibility:hidden !important; position:fixed; left:0px; top:0px; z-index:1; width:100vw; height:100vh; display:flex; align-items: center; justify-content: center;}

#mobilemenu.open {opacity:1 !important; transition: all ease 1s; visibility:visible !important; position:fixed; left:0px; top:0px; z-index:1}

#mobilemenu .elementor-widget-container {width:100%; display:flex; align-items: center; justify-content: center; z-index:1}
#mobilemenu .elementor-widget-container .menu-menu-container {width:100%; padding:5%}

#mobilemenu::before {display:block; content:""; position:fixed; left:0; top:0; height:0; width:100vw; background:#111; transition: all ease 0.8s;}
#mobilemenu.open::before {height:100vh; transition: all ease 0.8s;}


#mobilemenu .menu,
#mobilemenu .sub-menu {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

#mobilemenu .menu-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

#mobilemenu .menu-item a { 
	text-decoration: none;
	font-size: 1.8em;
    color: #fff;
	display:block;
	text-transform:uppercase;
	line-height:1.8em;
	font-weight:400;
	font-family: "Space Grotesk", Sans-serif;
}

#mobilemenu .menu-item a:before {font-weight:400;}

#mobilemenu .sub-menu .menu-item a { font-size: 0.9em; color:#E0E0E0; font-weight:400}

#mobilemenu .menu > .menu-item:first-child {
	 border-top: 1px solid rgba(255, 255, 255, 0.2);
}

/* Submenu Indicator */

#mobilemenu  .menu-item-has-children > a {
	 position: relative;

}
#mobilemenu .menu-item-has-children > a:before {
	 position: absolute;
	 right:0px;
	 content: '+';
	 width: 10px;
	 height: 100%;
	 color: #fff;
	 line-height:1.8em;
}



#mobilemenu .menu-item-has-children > a.is-open:before {
	content: '-';
}
 

/* highlight current menu item  */

#mobilemenu .menu .current-menu-item a {
  color: #ccc;
}

/* Sub-menu */

#mobilemenu .sub-menu {
  display: none;
}

#mobilemenu .sub-menu {
  margin-top: 10px;
  margin-bottom: 15px;
  margin-left: 0px;
}

#mobilemenu .sub-menu .menu-item {
  line-height: 1.6;
  text-transform: none;
  font-size: 1.2rem;
  border: 0;
}




/* Hamburger Toggle Icon Animation 1 */


.toggle-menu {
	 background-color: transparent;
	 border: none;
	 cursor: pointer;
	 display: inline-block;
	 float: right;
	 height: 30px;
	 outline: none;
	 pointer-events: initial;
	 position: relative;
	 vertical-align: middle;
	 width: 25px;
	 z-index: 1110;
}

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


.toggle-menu.active span, .toggle-menu.active span:before, .toggle-menu.active span:after {background-color: #fff; mix-blend-mode: normal;
}


 .toggle-menu span {
	 background-color: #fff;
	 content: "";
	 display: block;
	 height: 1.5px;
	 left: calc(50% - 13px);
	 position: absolute;
	 top: calc(50% - 1px);
	 transform-origin: 50% 50%;
	 transition: background-color 0.2s ease-in-out, top 0.2s 0.2s ease-out, transform 0.2s linear;
	 width: 18px;

}
 .toggle-menu span:before, .toggle-menu span:after {
	 background-color: #fff;
	 content: "";
	 display: block;
	 height: 1.5px;
	 position: absolute;
	 transform-origin: 50% 50%;
	 transition: background-color 0.2s ease-in-out, top 0.2s 0.2s ease-out, transform 0.2s linear;
	 width: 18px;
}

#transparent-header.elementor-sticky--active .toggle-menu span {background-color: #1C1A1A;}
#transparent-header.elementor-sticky--active .toggle-menu span::after {background-color: #1C1A1A;}
#transparent-header.elementor-sticky--active .toggle-menu span::before {background-color: #1C1A1A;}


#transparent-header.elementor-sticky--active .toggle-menu.active span {background-color: #1C1A1A;}
#transparent-header.elementor-sticky--active .toggle-menu.active span::before {background-color: #fff !important;}
#transparent-header.elementor-sticky--active .toggle-menu.active span::after {background-color: #fff !important;}



#light-header .toggle-menu span {background-color: #1C1A1A;}
#light-header .toggle-menu span:before, #light-header .toggle-menu span:after {background-color: #1C1A1A;}

#light-header .toggle-menu.active span {background-color: #1C1A1A;}
#light-header .toggle-menu.active span:before, #light-header .toggle-menu.active span:after {background-color: #fff;}


 .toggle-menu span:before {
	 top: 5px;
}
 .toggle-menu span:after {
	 top: -5px;
}
 .toggle-menu.active span {
	 background-color: transparent;
	 transition: background 0.2s ease-out;
}
 .toggle-menu.active span:before, .toggle-menu.active span:after {
	 transition: top 0.2s ease-out, transform 0.2s 0.2s ease-out;
}
 .toggle-menu.active span:before {
	 top: 0;
	 transform: rotate3d(0, 0, 1, -45deg);
}
 .toggle-menu.active span:after {
	 top: 0;
	 transform: rotate3d(0, 0, 1, 45deg);
}


/* Elementor Image Box Fix  */
@media (max-width:768px){

	/* Image box wrapper */
	.elementor-widget-image-box .elementor-image-box-wrapper{
		display:flex;
		text-align:left;
	}
	
	/* Image box content */
	.elementor-widget-image-box .elementor-image-box-content{
		margin-left:16px;
		
	}
	
}


/* Improved Animations Stylesheet */

@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translate3d(0,-20px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInDown {
    animation-name: fadeDown
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translate3d(-20px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInLeft {
    animation-name: fadeLeft
}

@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translate3d(20px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInRight {
    animation-name: fadeRight
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translate3d(0,20px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInUp {
    animation-name: fadeUp
}



/* Slick Styling */


body {overflow-x:hidden}
.woocommerce .blockUI.blockOverlay {position:fixed !important; background-color:rgba(255,255,255,0.75) !important}


/* Account Dropdown */

.account-dropdown {visibility:hidden; opacity:0; transition:all ease 0.5s}
.account-dropdown.active {visibility:visible; opacity:1; transition:all ease 0.5s}
header:not(.elementor-sticky--effects) .account-dropdown {display:none}


/* Quick Links Effects */
.quick-links {opacity:0; visibility:hidden; transition: ease all 0.3s; transform: translate3d(0, 10px, 0); -moz-transform: translate3d(0, 10px, 0); -webkit-transform:translate3d(0, 10px, 0);-o-transform:translate3d(0, 10px, 0); -ms-transform: translate3d(0, 10px, 0)}
.product-block:hover .quick-links {opacity:1; visibility:visible; transition: ease all 0.3s; transform: translate3d(0, 0px, 0); -moz-transform: translate3d(0, 0px, 0); -webkit-transform:translate3d(0, 0px, 0);-o-transform:translate3d(0, 0px, 0); -ms-transform: translate3d(0, 0px, 0)}


/* Product Page Carousel */

ul.flex-direction-nav {
    position: absolute;
    top: 30%;
    z-index: 99999;
    width: 100%;
    left: 0;
    margin: 0;
    padding: 0px;
    list-style: none;}

li.flex-nav-prev {float: left;}
li.flex-nav-next {float: right;}
a.flex-next {visibility:hidden;}
a.flex-prev {visibility:hidden;}

a.flex-next::after {
	visibility:visible;content: '\f054';
	font-family: 'Font Awesome 5 Free';
	margin-right: 10px;
	font-size: 20px;   
	font-weight: bold;
}

a.flex-prev::before {
    visibility:visible;
    content: '\f053';
	font-family: 'Font Awesome 5 Free';   
	margin-left: 10px;
	font-size: 20px;
	font-weight: bold;
}

ul.flex-direction-nav li a {
	color: #ccc;
}

ul.flex-direction-nav li a:hover {
	text-decoration: none;
}

ul.flex-direction-nav li a {
	color: #ccc;
}

ul.flex-direction-nav li a:hover {
	text-decoration: none;
}
