@import url('https://fonts.googleapis.com/css2?family=Warnes&display=swap');

html, body {
    background-image: url(/Gifs/snow.gif);
    background-color: white;
    max-width: 100%;
    overflow-x: hidden;
}

* {
    margin: 0;
}

.container img:nth-of-type(1) {
    width: 90px;
    position: absolute;
    margin-left: 250px;
    z-index: 0;
}

.container img:nth-of-type(2) {
    width: 90px;
    position: absolute;
    margin-left: 1290px;
}

.container {
    width: 100%;
    height: 0%;
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 2rem;

}

.container > * {
    width: 100%;
    
}

.container h1 {
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    font-size: 75px;
    color: rgb(241, 120, 72);
    margin-left: 390px;
}

.glow {
    animation: glow 1s ease-in-out infinite alternate;
}

@keyframes glow {
    from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60026, 0 0 40px #d7e600, 0 0 50px #f3e522, 0 0 60px #24231d, 0 0 70px #e60073;
    }
    to {
    text-shadow: 0 0 20px #fff, 0 0 30px #eff2f5, 0 0 40px #4dff91, 0 0 50px #4dff88, 0 0 60px #ff4da6, 0 0 70px #4dff65, 0 0 80px #fafafa;
    }
}

.fun img:nth-of-type(1) {
    z-index: 0;
    position: absolute;
    width: 300px;
    margin-left: 410px;
    margin-top: 110px;

}

.fun img:nth-of-type(2) {
    z-index: 0;
    position: absolute;
    width: 300px;
    margin-left: 1010px;
    margin-top: 110px;

}

.fun img:nth-of-type(3) {
    z-index: 0;
    position: absolute;
    width: 200px;
    height: 500px;
    margin-left: 1180px;
    margin-top: 250px;
}

.about img {
    position: absolute;
    margin-left: 400px;
    width: 900px;
}

.about h1 {
    position: absolute;
    text-align: justify;
    width: 510px;
    height: 380px;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    color: rgb(241, 77, 48);
    margin-left: 520px;
    margin-top: 330px;
    font-size: 33px;
    
}

.container {
    display: flex;
    flex-direction: column;
}


nav#menu ul {
    display: flex;
    flex-direction: column;
    list-style: none;
    position: fixed;
    text-align: center;
    top: 0px;
    bottom: 0px;
    background-color: rgb(28, 2, 43);
    background-image: url(/Gifs/snow.gif);
    border: rgb(139, 139, 138) 10px solid;
    width: 220px;
    padding: 20px;
    
}

nav#menu h1 {
    font-size: 28px;
    padding-top: 55px;
    color: lawngreen;
    z-index: 2;
    font-family: 'Satisfy', cursive;
}

nav#menu img {
    height: 70px;
    padding-top: 90px;
    z-index: 2;
    
}

nav#menu li {
    padding: 2px;
    margin: 5px;
    color: rgb(247, 224, 241);
    font-family: 'Satisfy', cursive;
    font-size: 16pt;
    text-align: center;
    border: 2px solid rgb(241, 115, 31);
    align-content: center;
    
}

nav#menu a {
    color: rgb(243, 239, 239);
    text-decoration: underline;
}

.visitor {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    text-align: center;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    color: rgb(119, 0, 255);
    margin-left: 310px;

}

audio#music {
	display: block;
	position: fixed;
    margin-left: 85px;
	top: 650px;
    width: 100px;
    
}