body{

margin:0;
padding:0;

font-family:'Fredoka',sans-serif;

background-image:url("background.gif");
background-repeat:repeat;
background-size:600px;

overflow-x:hidden;

color:#4e334f;

}


.crt{

position:fixed;

top:0;
left:0;

width:100%;
height:100%;

background-image:url("crt.png");

opacity:.15;

pointer-events:none;

z-index:999;

animation:flicker .13s infinite;

}



@keyframes flicker{

0%{

opacity:.12;

}

50%{

opacity:.18;

}

100%{

opacity:.14;

}

}



.container{

position:relative;

width:70%;

margin:auto;

margin-top:35px;
margin-bottom:35px;

background:

repeating-linear-gradient(
-45deg,
#d8d0dd,
#d8d0dd 22px,
#d3cad7 22px,
#d3cad7 44px
);

border-radius:12px;

overflow:hidden;

box-shadow:
0 0 35px rgba(0,0,0,.4);

}



header{

background:

linear-gradient(
to bottom,
#704d8f,
#573469
);

text-align:center;

padding-bottom:12px;

}



.logo{

width:400px;

padding:20px;

}



nav{

background:#5b3447;

padding:14px;

display:flex;

justify-content:center;

gap:30px;

flex-wrap:wrap;

}



nav a{

color:white;

text-decoration:none;

font-size:1.2rem;

font-weight:bold;

transition:.3s;

}



nav a:hover{

transform:scale(1.1);

color:#d9b5ff;

text-shadow:

0 0 10px #fff;

}



.videoBox{

padding:25px;

}



iframe{

border:none;

border-radius:10px;

box-shadow:
0 0 20px rgba(0,0,0,.4);

}



.welcome{

text-align:center;

padding:20px 60px;

}



.welcome h1{

font-size:2.2rem;

color:#7d51b9;

text-shadow:

2px 2px white;

}



.welcome p{

font-size:1.1rem;

line-height:1.7;

}



.faq{

padding:50px;

}



.faq h2{

font-size:60px;

color:#8a59d7;

transform:rotate(-4deg);

margin-bottom:35px;

}



.question{

margin-bottom:40px;

}



.question h3{

color:#633683;

font-size:1.5rem;

}



.question p{

font-size:1.05rem;

line-height:1.7;

}



footer{

background:#5b3447;

color:white;

text-align:center;

padding:20px;

font-size:.9rem;

}



@media(max-width:900px){

.container{

width:95%;

}

.logo{

width:90%;

}

.welcome{

padding:20px;

}

.faq{

padding:20px;

}

.creditsSection{
    padding:50px;
    text-align:center;
}

.creditSub{
    margin-bottom:30px;
    font-size:1.1rem;
}

.creditsTable{
    width:100%;
    border-collapse:collapse;
    margin-top:20px;
    background:rgba(255,255,255,.35);
    overflow:hidden;
    border-radius:10px;
}

.creditsTable th{
    background:#684082;
    color:white;
    padding:15px;
    font-size:1.2rem;
}

.creditsTable td{
    padding:14px;
    border:2px solid rgba(100,70,120,.3);
    font-size:1rem;
}

.creditsTable tr:hover{
    background:rgba(130,90,170,.2);
    transition:.2s;
}

body{
font-family:'Chewy', cursive;
}

h1,h2,h3{
font-family:'Luckiest Guy', cursive;
}

}

}