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

	Canvas: Store

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



:root {

	--cnvs-themecolor: #222;

	--cnvs-themecolor-rgb: 34, 34, 34;

	--cnvs-body-font: 'Karla', sans-serif;

	--cnvs-primary-font: 'Karla', sans-serif;

	--cnvs-header-height: 70px;

	--cnvs-sticky-header-height: 70px;

	--cnvs-menu-gap: 30px;

}



* {

	text-rendering: optimizeLegibility;

	-webkit-font-smoothing: antialiased;

}



#header {

	--cnvs-primary-menu-font-weight: 500;

	--cnvs-primary-menu-font-size:	1rem;

	--cnvs-primary-menu-tt:	none;

	--cnvs-primary-menu-ls:	0;

	--cnvs-primary-menu-submenu-font-size:	0.875rem;

	--cnvs-primary-menu-submenu-font-weight:	400;

	--cnvs-primary-menu-submenu-hover-font-weight: 500;

	--cnvs-primary-menu-submenu-tt:	none;

}



.is-expanded-menu .mega-menu-style-2 .mega-menu-title > .menu-link {

	font-size: calc(var(--cnvs-primary-menu-submenu-font-size) * 0.9);

}



#header {

	--cnvs-primary-menu-font-size: 13px;

	--cnvs-primary-menu-font-weight: 600;

	--cnvs-primary-menu-tt: uppercase;

	--cnvs-primary-menu-ls: 1px;

}



/* Custom Header Size

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



.btn-link:hover { text-decoration: underline !important; }



.ls--1 { letter-spacing: -1px !important; }

.ls--2 { letter-spacing: -2px !important; }



.mega-menu-content.mega-menu-style-2 .menu-link {

	text-transform: none;

	font-weight: 400;

	font-size: 14px;

}



#top-account a {

	text-transform: uppercase;

	letter-spacing: 0;

	font-weight: 600;

	font-size: 13px;

	text-shadow: none;

}



.dark .header-misc a {

	color: rgba(255,255,255,0.9);

}



.dark .menu-item:hover > .menu-link,

.dark .menu-item.current > .menu-link {

	color: #116FAC;;

}



.slider-caption {

	position: absolute;

	width: 100%;

	max-width: none;

	left: 0;

	right: 0;

	margin: 0 auto;

	text-align: center;

}



.slider-caption h2 {

	font-size: 3.85rem;

	letter-spacing: -2px;

	text-transform: none;

}



.slider-caption p {

	margin-top: 15px;

	font-size: 1.125rem;

}



.slider-arrow-left,

.slider-arrow-right,

.flex-prev,

.flex-next {

	--right: 70px;

	--size: 36px;

	top: auto;

	bottom: 22px;

	left: calc(50% + 22px);

	right: 70px;

	right: var(--right);

	margin-top: 0;

	background-color: rgba(255,255,255,0.8);

	width: 42px;

	width: var(--size);

	height: 42px;

	height: var(--size);

	border: 0;

	border-radius: 50%;

	transform: translateX(-50%);

	transition: all .4s ease;

}



.flex-prev,

.flex-next {

	opacity: 0;

	top: 50%;

	bottom: auto;

	left: auto;

	right: 4px;

	transform: translateY(-50%);

}



.product:hover .flex-prev,

.product:hover .flex-next { opacity: 1; }



.slider-arrow-left { left: calc(50% - 22px); }



.flex-prev { left: 4px; }



.slider-arrow-left i,

.slider-arrow-right i,

.flex-prev i,

.flex-next i {

	line-height: 42px;

	line-height: var(--size);;

	width: 42px;

	width: var(--size);

	height: 42px;

	height: var(--size);

	color: #DDD;

	color: rgba(0,0,0,0.8);

	text-shadow: none;

	font-size: 24px;

	margin-left: 2px;

	transition: color .4s ease;

}



.slider-arrow-left i,

.flex-prev i { margin-left: 0; }



.slider-arrow-left:hover i,

.slider-arrow-right:hover i,

.flex-prev:hover i,

.flex-next:hover i  { color: #FFF; }



.social-icons {

	position: absolute;

	left: 55px;

	bottom: 15px;

	z-index: 10;

}



.social-icons::before {

	content: '';

	position: absolute;

	left: -40px;

	top: 45%;

	width: 30px;

	height: 1px;

	background-color: rgba(255, 255, 255, 0.2);

}



.cat-card p {

	font-size: 1rem;

	font-weight: 400;

	line-height: 1.6 !important;

	opacity: .8;

}



.device-md .cat-card p { display: none; }



.items-nav li a {

	display: block;

	position: relative;

	padding: 3px 8px;

	color: #888;

	transition: all .1s linear;

}



.items-nav li:hover a {

	background-color: #F5F5F5;

	color: #111;

}



.product-desc {

	display: -webkit-flex;

	display: -moz-flex;

	display: -ms-flex;

	display: -o-flex;

	display: flex;

	justify-content: space-between;

	padding: 15px 3px;

}



.product-title h3 {

	font-size: 17px;

	font-weight: 700;

	margin: 0;

}



.product-title span a { color: #999; }



.product-price {

	margin-bottom: 0;

	font-size: 15px;

}



.product-image { position: relative; }



.product-image .cart-btn {

	position: absolute;

	display: block;

	opacity: 0;

	bottom: 7px;

	left: 0;

	right: 0;

	width: calc(100% - 14px) !important; /* bottom 2x */

	max-width: 100%;

	margin: 0 auto;

	padding: 8px 0;

	height: auto;

	text-align: center;

}



.product:hover .product-image .cart-btn,

.product:hover .flex-control-nav.flex-control-thumbs {

	opacity: 1;

	z-index: 2;

}



.flex-control-nav.flex-control-thumbs {

	opacity: 0;

	position: absolute;

	top: 0;

	left: 0;

	right: auto;

	margin: 3px;

	transition: opacity .3s linear;

}



.flex-control-nav li {

	float: none;

	display: block;

	margin: 3px;

	box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);

}



nav.flex-control-thumbs li:hover img,

.flex-control-nav.flex-control-thumbs li img.flex-active {

	border-width: 1px;

	opacity: 1;

	box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.3);

}



.flex-control-nav.flex-control-thumbs li,

.flex-control-nav.flex-control-thumbs li img {

	width: auto !important;

	height: 70px !important;

}



.container-fluid {

	padding-right: 40px;

	padding-left: 40px;

}



.footer-widgets-wrap li { margin-bottom: 3px; }

.dark .footer-widgets-wrap a { color: #888; }



.masonry-thumbs a::before {

	opacity: 0;

	display: flex;

	content: "\e9bc";

	font-family: 'lined-icons';

	justify-content: center;

	align-items: center;

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	transform: scale(1);

	font-size: 24px;

	color: #FFF;

	background-color: rgba(0, 0, 0, 0.5);

	transition: opacity .3s, transform .3s ease;

}



.instagram-photos.masonry-thumbs a::before {

	content: "\F437";

	font-family: 'bootstrap-icons';

}



.masonry-thumbs a:hover::before {

	opacity: 1;

	transform: scale(1.2);

}





#modal-subscribe {

	left: auto;

	right: 0;

	top: auto;

	bottom: 0;

    max-width: 550px;

    height: auto;

}



#modal-subscribe .modal-dialog {

	margin: 0;

    border-radius: 0;

    max-width: 550px;

}



#modal-subscribe .modal-content {

	background-color: #EEE;

	border: 8px solid #FFF;

	border-radius: 0;

}



body.modal-open { overflow-y: auto; }

.modal-backdrop { display: none; }





/* Responsive Device less than 768px (.device-sm <)

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

@media (max-width: 767.98px) {



	.items-nav li {

		position: relative;

		display: inline-block;

		margin: 5px;

	}



	.items-nav li:not(:last-child):not(.no-divider)::before {

		content: '/';

		position: absolute;

		right: -10px;

		top: 50%;

		color: #AAA;

		transform: translateY(-50%);

	}



	.fslider:not(.flex-thumb-grid) .flex-control-nav.flex-control-thumbs li,

	.fslider:not(.flex-thumb-grid) .flex-control-nav.flex-control-thumbs li img {

		width: auto !important;

		height: 80px !important;

	}



	.flex-control-nav.flex-control-thumbs { opacity: 1; }



	.modal-backdrop { display: block; }



}



/* Responsive Device more than 992px (.device-md >)

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

@media (min-width: 992px) {



	#header.transparent-header.floating-header {

		--cnvs-header-floating-top-offset: 15px;

	}



	#header.transparent-header.floating-header #header-wrap {

		position: fixed;

		top: 15px;

		margin-top: 0;

		box-shadow: none;

		z-index: 199;

		border-bottom: 0;

	}



	#header.transparent-header.floating-header .container-fluid,

	#header.sticky-header.transparent-header.floating-header .container-fluid {

		width: calc(100% - 30px);

		width: calc(100% - var(--cnvs-menu-gap));

		padding: 0 30px;

		padding: 0 var(--cnvs-menu-gap);

		background-color: transparent !important;

		transition: all .8s cubic-bezier(.19,1,.22,1);

	}



	#header.hover-light.transparent-header.floating-header .container-fluid,

	#header.sticky-header.transparent-header.floating-header .container-fluid {

		background-color: #FFF !important;

		box-shadow: 0 0 10px rgba(0,0,0,0.1);

	}



	.floating-header .mega-menu-content {

		border: 0;

		width: calc(100% - 30px) !important;

		width: calc(100% - var(--cnvs-menu-gap) ) !important;

		margin: 0;

	}



	.menu-link {

		letter-spacing: 0;

	}



	.menu-container:hover > .menu-item:not(:hover):not(.active) > .menu-link { color: #BBB; }



	#header.sticky-header #header-wrap { background-color: transparent; }



	#top-account a {

		position: relative;

		display: block;

		z-index: 11;

	}



	.header-overlay::after {

		position: absolute;

		width: 100%;

		height: 100%;

		top: 0;

		left: 0;

		background-color: rgba(0, 0, 0, 0.5);

		z-index: 1;

		transition: background-color .3s cubic-bezier(.19,1,.22,1);

	}



	.card-img-overlay.bg { background-color: rgba(0, 0, 0, 0.4); }



	.container-fluid {

		padding-right: 75px;

		padding-left: 75px;

	}



}