/*
	Theme Name: Nanotech Child
	Theme URI: http://nanotech.clapat-themes.com/
	Description: Responsive Wordpress Theme
	Template: nanotech
	Version: 1.0
	Author: You
	Author URI: http://your site
	License: Themeforest
	License: GNU General Public License version 3.0
	License URI: http://www.gnu.org/licenses/gpl-3.0.html
	Tags: agency, ajax, business, clapat, clean, creative, gallery, minimal, modern, photography, portfolio, premium, responsive, showcase
	Text Domain: nanotech-child
*/


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

Add here your own styles
-------------------------------------------------------------------*/

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

Add here your own styles
-------------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;700&display=swap');

@font-face {
  font-family: 'Ugly Dave';
  src:  url('fonts/Ugly-Dave-Regular.woff2') format('woff2'),
        url('fonts/Ugly-Dave-Regular.woff') format('woff');
}

@font-face {
  font-family: 'Ugly Dave Alts';
  src:  url('fonts/Ugly-Dave-Alternates-Regular.woff2') format('woff2'),
        url('fonts/Ugly-Dave-Alternates-Regular.woff') format('woff');
}

@font-face {
  font-family: 'MANIC Sketches';
  src:  url('fonts/MANIC-Sketches.woff2') format('woff2'),
        url('fonts/MANIC-Sketches.woff') format('woff');
}

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

General Settings Beginning 🔵
-------------------------------------------------------------------*/


html, body {
	
	font-family: 'Ugly Dave';
	text-transform: lowercase;
	
}

h1, h2, h3, h4, h5, h6 {		
		
	font-family: 'Ugly Dave';
	letter-spacing: −2px;
	text-transform: lowercase;
	font-weight:500;
	color:#222;
	margin-bottom:25px;
	-webkit-text-stroke: 1px;
		
}

p {
		
		font-family: 'Inter', sans-serif;
		font-weight: 200;
		text-transform: none;
		color: #A0A0A0;
	
}
	
h1, h2, h3 {
		
	line-height:110%;
		
}
	
h4, h5, h6 {
	
	line-height:130%;

}

b,
strong {
		
	font-weight: 700;
	color:#ADADAD;

	
}


.classic-menu .flexnav li a {
    background: transparent none repeat scroll 0 0;
    padding: 0;
    position: relative;
    border-left: medium none;
    color: #000;
    font-size: 19px;
	text-transform:lowercase;
	
}

   .button-text {
    
	font-family: "Ugly Dave";
	text-transform: lowercase;
	font-weight: 400;
    font-size: calc(1rem + 1vw);
	line-height: calc(1rem + 1.2vw);
	
}

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

General Settings End 🔵
-------------------------------------------------------------------*/

/*--------------------------------------------------
	02. Magic Cursor
---------------------------------------------------*/	
	
#ball i {
		color:#fff;
		width:76px;
		height:80px;
		line-height:78px;
		text-align:center;
		font-size:14px;
		display:block;
		opacity:1;
		transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
	}
	
	#ball {
		display:flex;
		flex-direction: column;
		justify-content: center;
	}
	
	#ball p {
		font-family: Ugly Dave;
		text-transform: lowercase;
		color:#fff;
		width:auto;
		height:16px;
		line-height:16px;
		padding-top:0px;
		padding-left:0px;
		box-sizing:border-box;
		margin:0 auto;
		margin-bottom:0;
		text-align:center;
		font-size:14px;
		font-weight: 500;
		display:flex;
		flex-direction: column;
		align-self: center;
		opacity:1;
		position:relative;
		transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
	}
	
	.light-content #ball p {
		color:#fff;
	}
	
	#ball p.center-first::before {
		font-family: MANIC Sketches;
		content:"9";
		font-size:16px;
		font-weight: 500;
		position:absolute;
		height:20px;
		top:calc(50% - 10px);
		left:-16px;
		line-height:20px;
		transform: rotate(-90deg);
	}
	
	#ball p.center-first::after {
		font-family: MANIC Sketches;
		content:"9";
		font-size:16px;
		font-weight: 500;
		position:absolute;
		height:20px;
		top:calc(50% - 10px);
		right:-16px;
		line-height:20px;
		transform: rotate(90deg);
	}
	
/*--------------------------------------------------
	Magic Cursor END
---------------------------------------------------*/
/*------------------------------------------------------------------

Showcase Beginning 🔵
-------------------------------------------------------------------*/



	.showcase-carousel {
		transform: rotate(357deg);
		scale: 1.05;

}

	.showcase-carousel .slide-caption .slide-title {
		
		font-family: "Ugly Dave";
		font-size: calc(1rem + 3.2vw);
		line-height: calc(1rem + 1.8vw);
		text-transform: lowercase;
		padding: 7% 1% 4%;
		-webkit-text-stroke-width: 1px;
	
		
}

	.showcase-carousel .swiper-slide .outer {
		padding: 0px 0px;
		height: auto;
		position: absolute;
		top: 97%;
}

	.showcase-carousel .swiper-slide {
		width: calc(35% - 40px);
		height: 45vh;
		margin: 0px 24px;
		-webkit-text-stroke-width: 1px;
	
}

	.showcase-carousel .slide-title-wrapper {

		width: 100%;
		margin-top: -7%;
	
}

	.showcase-carousel .slide-subtitle {
		
		font-family: 'Inter', sans-serif;
		font-weight: 200;
		-webkit-text-stroke: 0px;
		font-size: 16px;
		line-height: 28px;
		margin-bottom: 0px;
		opacity: 0.4;
		width: auto;
		display: block;
		float: left;
		text-align: left;
		width: 100%;
		text-transform: lowercase;
		
	
}
	
	.showcase-carousel .slide-subtitle span {

    	display: block;
		
}

	.slide-title span {
	
		margin-top: 0;

}

	#footer-container {

    	transform: rotate(357deg);
	
}

	footer .swiper-pagination {
	
		display: none;
	
}

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

Caurosel Details Underline from title and tag removal
-------------------------------------------------------------------*/

	.showcase-carousel .clapat-slide:hover .slide-caption .slide-title {
		text-decoration: none;
		text-decoration-thickness: 0px;
		text-underline-offset: 0px;
	}

	.showcase-carousel .clapat-slide .slide-date {
    	display: none;
	}

.showcase-carousel .slide-caption .slide-cat {
	font-size: 1.5em;
	line-height: 1em;
	padding: 6%;
	
}

@media only screen and (max-width: 1024px) {
    .showcase-carousel .slide-caption .slide-cat {
		
	font-size: 1.5em;
	padding: 5%;
	
}
	
@media only screen and (max-width: 855px) {
    .showcase-carousel .slide-caption .slide-cat {
		
	font-size: 1.5em;
	padding: 7%;
	
}
/*------------------------------------------------------------------

Showcase Ending 🔵
-------------------------------------------------------------------*/

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