
/* Harmony Demo Styles
================================================== */

	/* Page Fonts -  You can customize on here: https://fonts.google.com/?preview.text_type=custom&selection.family=Stint+Ultra+Condensed|Ubuntu:wght@300;400;500;700&sidebar.open=true */
	@import url('https://fonts.googleapis.com/css2?family=Stint+Ultra+Condensed&family=Ubuntu:wght@300;400;500;700&display=swap');
	.font-main{ font-family: 'Ubuntu', sans-serif !important;}
	.font-secondary{ font-family: 'Stint Ultra Condensed', cursive !important; }
	/* You can add a secondary font with .font-secondary class */

	/* Body Options */
	body{ font-family: 'Ubuntu', sans-serif; font-weight: 400; letter-spacing: 0px; }
	body *{outline:none !important;}







	.modern-nav.nav-dark .nav-links .dropdown-menu .nav-link:hover,
	.modern-nav.nav-dark .nav-links .dropdown-menu li.active .nav-link{background-color:#272322;color:#fff;}



	.bg-menu-pattern{background:url(../images/pattern_menu_01.jpg) repeat left top scroll;}
	.bg-dark-pattern{background:url(../images/pattern_black_01.jpg) repeat left top scroll;}
	.bg-coffee-pattern{background:url(../images/pattern_coffee_01.jpg) repeat left top scroll;}








	.hover-reveal { position: fixed; width: 250px; height: 200px; top: 0; left: 0; pointer-events: none; opacity: 0; }
	.hover-reveal__inner,
	.hover-reveal__img { width: 100%; height: 100%; position: relative; }
	.hover-reveal__deco { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: #181314; }
	.hover-reveal__img { background-size: cover; background-position: 50% 50%; }


	[data-fx]:hover{z-index: 5;}







	.shop .cbp-wrapper-outer,.shop .product-items, .shop .product{ overflow: visible; }
	.shop .product figure:before{position: absolute; left:-60px; height: 0; right: -60px; bottom:50px; display: block; z-index: -1; content: ''; background-image: url(../images/hover_brush.png); background-repeat: no-repeat; background-size: 72% auto; background-position: bottom center; pointer-events: none; -webkit-transition:all 0.7s!important;transition:all 0.7s!important;}
	.shop .product:hover figure:before{ height: 109%;}







	.gallery-items .masked{mask-mode: alpha; mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat; mask-size: contain; -webkit-mask-size: contain; -webkit-mask-position-y: center; mask-position-y: center;}

	.gallery-items .mask1{-webkit-mask-image: url(../images/gallery/gallery_mask_01.png); mask-image: url(../images/gallery/gallery_mask_01.png),;}
	.gallery-items .mask2{-webkit-mask-image: url(../images/gallery/gallery_mask_02.png); mask-image: url(../images/gallery/gallery_mask_02.png),;}
	.gallery-items .mask3{-webkit-mask-image: url(../images/gallery/gallery_mask_03.png); mask-image: url(../images/gallery/gallery_mask_03.png),;}
	.gallery-items .mask4{-webkit-mask-image: url(../images/gallery/gallery_mask_04.png); mask-image: url(../images/gallery/gallery_mask_04.png),;}
	.gallery-items .mask5{-webkit-mask-image: url(../images/gallery/gallery_mask_05.png); mask-image: url(../images/gallery/gallery_mask_05.png),;}
	.gallery-items .mask6{-webkit-mask-image: url(../images/gallery/gallery_mask_06.png); mask-image: url(../images/gallery/gallery_mask_06.png),;}
	.gallery-items .mask7{-webkit-mask-image: url(../images/gallery/gallery_mask_07.png); mask-image: url(../images/gallery/gallery_mask_07.png),;}
	.gallery-items .mask8{-webkit-mask-image: url(../images/gallery/gallery_mask_08.png); mask-image: url(../images/gallery/gallery_mask_08.png),;}




	.cbp-item-wrapper:after{display: none!important;}
	.cbp-item-wrapper{background-color:transparent !important;}





	/* Dots Navigation */
    .dots-circle .cbp-nav-pagination{bottom:-60px;}
    .dots-circle .cbp-nav-pagination .cbp-nav-pagination-item{width:25px;height:25px;background-color:transparent;border-radius:50%;display:inline-flex;display:-ms-inline-flexbox;justify-content:center;-ms-flex-pack:center;align-items:center;-ms-flex-align:center;}
    .dots-circle .cbp-nav-pagination .cbp-nav-pagination-item:before{width:5px;height:5px;background-color:#222;box-shadow:inset 0 0 0 0.5px transparent;-webkit-transform:scale(1);transform:scale(1);content:'';display: block;border-radius:inherit;-webkit-transition:all 0.5s;transition:all 0.5s;}
    .dots-circle .cbp-nav-pagination .cbp-nav-pagination-item.cbp-nav-pagination-active:before{box-shadow:inset 0 0 0 0.5px #222;background-color:transparent!important;-webkit-transform:scale(3);transform:scale(3);}

    /* Dots Navigation */
    .cbp-nav-controls{position:absolute;left:0;top:0;z-index:100;width:100%;height:100%;pointer-events:none;}
    .cbp-nav-controls div{font-size:20px;color:white;border-radius:0;background:rgba(24,24,24,0.3);position:absolute;top:50%;width:40px;height:90px;left:0;opacity:0;z-index:5;cursor:pointer;pointer-events:all;display:inline-flex;display:-ms-inline-flexbox;justify-content:center;-ms-flex-pack:center;align-items:center;-ms-flex-align:center;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-transition:all 0.5s;-moz-transition:all 0.5s;transition:all 0.5s;}
    .cbp:hover .cbp-nav-controls div{opacity:.55;}
    .cbp-nav-controls div.cbp-nav-next{left:auto;right:1px;}
    .cbp-nav-controls div:before,.cbp-nav-controls div:after{content:"\e64a";display:inline-flex;display:-ms-inline-flexbox;z-index:2;font-family:'themify';color:inherit;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;transition:all 0.5s;}
    .cbp-nav-controls div:after{display:none;content:'';z-index:0;}
    .cbp:hover .cbp-nav-controls div:hover{opacity:1;}
    .cbp-nav-controls div.cbp-nav-next:before{content:"\e649";}
