@font-face {                  
	font-family: 'AnalogueOS';
	src: url(https://humantooth.neocities.org/fonts/AnalogueOS-Regular.woff) format('woff');
	font-weight: normal;
	font-style: normal;
} 
body {
	background-image: url('./img/bg.webp');
	background-size: 25% 25%;
	margin-left: 5%;
	margin-right: 5%;
}

.textContainer {
	display: flex;
	justify-content: center;
	flex-direction: column;
	margin-bottom: 5px;
	font-size: 1.4vw
}

h1 {
	text-align: center;
	margin: 0;
	margin-top: 20px;
	font-family: 'AnalogueOS';
	font-size: 6vw;
}

.wave-text span {
    display: inline-block;
    
    animation: wave 2s ease-in-out infinite;
}

.wave-text span:nth-child(1) {
    animation-delay: 0s;
}
.wave-text span:nth-child(2) {
    animation-delay: 0.2s;
}
.wave-text span:nth-child(3) {
    animation-delay: 0.4s;
}
.wave-text span:nth-child(4) {
    animation-delay: 0.6s;
}
.wave-text span:nth-child(5) {
    animation-delay: 0.8s;
}
.wave-text span:nth-child(6) {
    animation-delay: 1.0s;
}
.wave-text span:nth-child(7) {
    animation-delay: 1.2s;
}
.wave-text span:nth-child(8) {
    animation-delay: 1.4s;
}
.wave-text span:nth-child(9) {
    animation-delay: 1.6s;
}
.wave-text span:nth-child(10) {
    animation-delay: 1.8s;
}
.wave-text span:nth-child(11) {
    animation-delay: 2.0s;
}

@keyframes wave {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-20px);
    }
}

h2 {
	text-align: center;
	margin: 0;
	font-family: 'AnalogueOS';
	font-size: 2vw
}

h3 {
	text-align: center;
	margin-bottom: 5px;
	font-family: 'AnalogueOS';
}

p {
	background-color: rgba(180,180,180,.8);
	text-align: center;
	margin-bottom: 2px;
	margin-top: 2px;
	font-family: 'AnalogueOS';
}

img {
	margin: auto;
	width: 90%;
}

.headingContainer {
	.textContainer;
	margin: auto;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	align-content: center;
	border: solid 5px;
	border-color: rgba(180,180,180,1);
	background-color: rgba(210,210,210,.8);
}

.headingContainer img {
	max-width: 200px;
}

.mainHolder {
	display: flex;
	align-items: center;
	border: solid 5px;
	border-color: rgba(180,180,180,1);
	background-color: rgba(210,210,210,.8);
}

.mainHolder img {
	max-width: 30vw;
}

.maidHolder {
	display: flex;
	align-items: center;
	border: solid 5px;
	border-color: rgba(180,180,180,1);
	background-color: rgba(210,210,210,.8);
}

.maidHolder img{
	flex: 0 1 50%;
}

.footStickers {
	display: flex;
	flex-wrap: wrap;
	background-color: rgba(180,180,180,.8);
}

.footStickers img{
	width: initial;
	justify-content: center;
	align-items: center;
}

@media screen and (max-width: 600px){
	.mainHolder {
		flex-direction: column;
	}
	.maidHolder {
		display: none;
	}
	.headingContainer img{
		display: none;
	}
	#extramaid {
		display: none;
	}
	.textContainer {
		font-size: 5vw;
	}
	h1 {
		font-size: 12vw;
	}
	h2 {
		font-size: 6vw;
	}
	.mainHolder img {
		max-width: 80vw;
	}
}