@import url('https://fonts.googleapis.com/css?family=Source+Serif+Pro:400,600,700|Figtree:100,200,300,400,500,600,700,800,900|Darker+Grotesque:300,400,500,600,700,800,900');
	
@import url("./header.css");

@import url("./home.css");

@import url("./blur.css");

@import url("./resume.css");

@import url("./hoverimage.css");

@import url("./modal_video.css");

@import url("./mobile.css");

@import url("./tablet.css");
	
html {
	overflow: hidden;
	width: auto;
	min-height:100%;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	cursor: none !important;
}

html * {
	cursor: none !important;    
}

body {
	overflow: hidden;
	width: auto;
	min-height:100%;
	margin: 0;
	padding: 0;
	cursor: none !important;
	background-color: var(--base-color);
	user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-touch-callout: none;
}

.distorted {
  filter: blur(0.3px) contrast(1.0);
  animation: shake 0.7s infinite ease-in-out;
}

:root {
	--base-color: rgba(25, 14, 15, 1);
	--base-blur: rgba(25, 14, 15, 0.1);
	--base-variant: rgba(255, 35, 0, 0.1);
	--base-variant-2: rgba(87, 80, 80, 0);
	--text-color: rgba(97, 77, 77, 1);
	--text-color-2: rgba(177, 170, 170, 1);
	--secondary-text: rgba(57, 50, 50, 1);
	--secondary-text-2: rgba(57, 50, 50, 1);
	--primary-color: rgba(41, 30, 31, 1);
	--accent-color: rgba(255, 35, 0, 1);
	--grain-color: rgba(247, 245, 245, 0.07);
  --scratch-color: rgba(247, 245, 245, 0.09);
}

.lightmode {
	--base-color: rgba(247, 245, 245, 1);
	--base-blur: rgba(247, 245, 245, 0.1);
	--base-variant: rgba(255, 35, 0, 0.1);
	--base-variant-2: rgba(200, 200, 200, 0);
	--text-color: rgba(147, 120, 120, 1);
	--text-color-2: rgba(87, 80, 80, 1);
	--secondary-text: rgba(147, 140, 140, 1);
	--secondary-text-2: rgba(227, 220, 220, 1);
	--primary-color: rgba(237, 230, 230, 1);
	--accent-color: rgba(255, 35, 0, 1);
	--grain-color: rgba(07, 04, 05, 0.07);
  --scratch-color: rgba(07, 04, 05, 0.2);
}

#custom-cursor {
	position: fixed;
	top: 0;
	left: 0;
	pointer-events: none;
	z-index: 10000;
}

[data-cursor-role="cursor"] {
	position: fixed;
	z-index: 5000;  
	display: block;
	width: 64px;
	height: 64px;
	margin: -32px 0 0 -32px;    
	pointer-events: none;
	touch-events: none;
}

@media(pointer:coarse) {
	body, html, html * {
	cursor:auto!important;
}

[data-cursor-role="cursor"] {
	opacity: 0!important;
	}
}

[data-cursor-role="elements/ring"] {
	fill: none;
	stroke: #ff2300; 
	stroke-width: 1.2px;
}

[data-cursor-role="elements/hover"] {
	fill: #ff2300; 
	opacity: 0;
}
	
.fade-section {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1s ease, transform 1s ease;
  transition-delay: 0s; /* default */
}

.fade-section.visible {
	opacity: 1;
	transform: translateY(0);
}

.fade-sequence {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.fade-sequence.visible {
  opacity: 1;
  transform: translateY(0);
}

.clear{
	clear:both;	
}