@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');

@font-face {
  font-family: Storia;
  src: url('storia/storia-light.otf');
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'Storia', sans-serif;
}

body {
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.content, .content1 {
	position: static;
	max-height: 140px;
	min-width: 50%;
}

.content h2, .content1 h2 {
	color:#FFF;
	font-size: 11em;

/*	font-style: italic;*/
	font-weight: 600;
}

.content h2:nth-child(1) {
	color: #552e72;
	-webkit-text-stroke:0px #03a9f4;
/*	transform: translate(-50%, 50%);*/
}

.content h2:nth-child(1) a {
	color: #552e72;
	-webkit-text-stroke:0px #03a9f4;
/*	transform: translate(-50%, 50%);*/
}

.content h2:nth-child(2) {
	color: #2faf91;
	animation: animate 4s ease-in-out infinite;
	transform: translate(0%, -105.5%);
}

.content h2:nth-child(2) a {
	color: #2faf91;
	animation: animate 4s ease-in-out infinite;
	transform: translate(0%, -105.5%);
}

.content1 h2:nth-child(1) {
	color: transparent;
	-webkit-text-stroke:0px #03a9f4;
/*	transform: translate(-50%, 50%);*/
}

.content1 h2:nth-child(1) a {
	color: transparent;
	-webkit-text-stroke:0px #03a9f4;
/*	transform: translate(-50%, 50%);*/
}

.content1 h2:nth-child(2) {
	color: #03a9f4;
	animation: animate 4s ease-in-out infinite;
	transform: translate(0%, -106%);
}

.content1 h2:nth-child(2) a {
	color: #03a9f4;
	animation: animate 4s ease-in-out infinite;
	transform: translate(0%, -106%);
}

a:hover {
	text-decoration: none;
}

@keyframes animate {
	0%, 100% {
		clip-path: polygon(0% 45%, 15% 44%, 32% 50%, 54% 60%, 70% 61%, 84% 59%, 100% 52%, 100% 100%, 0% 100%);
	}
	50% {
		clip-path: polygon(0% 60%, 16% 65%, 34% 66%, 51% 62%, 67% 50%, 84% 45%, 100% 46%, 100% 100%, 0% 100%);
	}
}

@media only screen and (max-width:768px) {
	.site_img {
		width:80px !important;
		height: 80px !important;
	}

	.content h2, .content1 h2 {	
		font-size: 4em !important;
	}

	.content h2:nth-child(2) {
	    color: #2faf91;
	    animation: animate 4s ease-in-out infinite;
	    transform: translate(0%, -108.5%);
	}

	.content, .content1 {
    	position: static;
    	max-height: 100px;
    }		
}

#myVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%; 
  min-height: 100%;
}