*{
margin:0;
padding:0;
box-sizing:border-box;
}

html,body{
width:100%;
height:100%;
background:#000;
overflow:hidden;
}

video{
position:fixed;
inset:0;
width:100%;
height:100%;
object-fit:cover;
background:#000;
display:none;
}

#loader{
position:fixed;
inset:0;
display:flex;
justify-content:center;
align-items:center;
background:#000;
z-index:100;
}

.spinner{
width:45px;
height:45px;
border:4px solid rgba(255,255,255,.2);
border-top:4px solid white;
border-radius:50%;
animation:spin .8s linear infinite;
}

@keyframes spin{
100%{
transform:rotate(360deg);
}
}

#end{
position:fixed;
inset:0;
display:none;
justify-content:center;
align-items:center;
background:#000;
}

button{

padding:18px 34px;

font-size:18px;

border:none;

border-radius:40px;

cursor:pointer;

background:white;

color:black;

font-weight:bold;

transition:.25s;

}

button:hover{

transform:scale(1.05);

}

#thanks{
    position:fixed;
    inset:0;
    background:#000;
    color:#fff;

    display:none;

    justify-content:center;
    align-items:center;
    flex-direction:column;

    text-align:center;
}

#thanks h1{
    font-size:42px;
    margin-bottom:10px;
    font-family:Poppins,sans-serif;
}

#thanks p{
    font-size:22px;
    color:#bbb;
    margin-bottom:35px;
    letter-spacing:4px;
}

#thanks button{
    padding:16px 35px;
    border:none;
    border-radius:50px;
    background:white;
    color:black;
    cursor:pointer;
    font-size:18px;
    font-weight:bold;
}