* {
    user-select: none;
    position: relative;
}

html, body {
    background-color: black;
}

.hero {
	width: 100vw;
	height: 100vh;
	position: relative;

	color: white;
	background: black;

	overflow: hidden;
	text-align: center;
}



h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Bebas Neue';
    letter-spacing: 5px;
}

h1 {
	font-size: 10rem;
}

p {
	font-family: 'Lato';
}

@keyframes scrollLeft {
	0% {
        translate: 0 0;
	}

	100% {
        translate: -50% 0;
	}
}

@keyframes hover {
	0% {
        translate: 0;
	}

	100% {
        translate: 0 20px;
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes fadeOut {
    100% {
        opacity: 0;
    }
}

@keyframes sun-slideIn {
    0% {
        translate: 0 200px;
    }
    100% { 
        translate: 0 0;
    }
}
@keyframes sun-slideOut {
    100% { 
        translate: 0 200px;
    }
}
@keyframes slideIn {
	to {
        translate: 0;
	}
}

@keyframes slideOut {
    to {
        translate: 100vw 0;
    }
}