@font-face {
	font-family: 'Circe';
	src: url('font/circe/Circe-Light.eot');
	src: local('Circe Light'), local('Circe-Light'),
		url('font/circe/Circe-Light.eot?#iefix') format('embedded-opentype'),
		url('font/circe/Circe-Light.woff') format('woff'),
		url('font/circe/Circe-Light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;	
}

*{
    margin:  0;
	padding: 0;
	border:  0;
	outline: 0;	
	vertical-align: baseline;
	background:     transparent;			        
	box-sizing:     border-box;
	z-index:        1;	

	font-family: 'Circe', sans-serif;
	font-weight: 300;
	font-style: normal;	
	font-size: 14pt;
	letter-spacing: 1px;

	color:#fff;
}



html, body {
    height:   100%;
    position: relative;	
	

	background: linear-gradient(270deg, #C52027 0%, #D34529 23.23%, #93BA53 75.96%, #268754 100%);	
}

textarea,
input[type="text"],
input[type="button"],
input[type="submit"] {    
    border-radius: 0;
}


/* index */

#container {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 100vw;
	height: 100vh;
}

img {
	max-width: 80%;
	animation: show_logo 1.0s ease-in-out 1;
}

@keyframes show_logo {	
	0% {transform: scale(1.2);opacity: 0;}
	100% {transform: scale(1.0);opacity: 1;}
	

}

p {
	

	overflow: hidden; 
	width: 0; 
	text-align: center;

	font-weight: 300;
	animation: typing; 
	animation-duration: 1.0s; 
	white-space: nowrap; 
	animation-timing-function: steps(50, end); animation-fill-mode: forwards; 

	
}

@keyframes typing { 
	from { width: 0 } 
	to { width: 100% }	
}

p:nth-child(2) {		
	font-size: 50px;	
}

p:nth-child(3) {	
	font-size: 12px;
	opacity: 0.5;	
}








/* DESCTOP */

@media (min-width: 1200px) {
	
}