:root {
    --bg-start-color: #5438DC;
    --bg-end-color: #357DED;
}

* {
    box-sizing: border-box;
}

body, html {
    margin: 0;
    padding: 0;
    color: #fff;
}

body {
    animation: animateGradient 10s infinite linear;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
}

@keyframes animateGradient {
    0% {
        background: linear-gradient(to right, var(--bg-start-color), var(--bg-end-color));
        background-size: 200% 100%;
        background-position: left center;
    }

    50% {
        background: linear-gradient(to right, var(--bg-start-color), var(--bg-end-color));
        background-size: 200% 100%;
        background-position: right center;
    }

    100% {
        background: linear-gradient(to right, var(--bg-start-color), var(--bg-end-color));
        background-size: 200% 100%;
        background-position: left center;
    }
}

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

.mainContainer > * {
    max-width: 80vw;
}

#videoContainer {
    display: none;
    /* position: absolute;
    top: 8px;
    left: 0;
    right: 0;
    text-align: center; */
}

#videoContainer.show {
    display: block;
}

#video {
    width: 100%;
}



/* From https://getcssscan.com/css-buttons-examples */
.button-92 {
    --c: #fff;
    /* text color */
    background: linear-gradient(90deg, #0000 33%, #fff5, #0000 67%) var(--_p,100%)/300% no-repeat,
      #004dff;
    /* background color */
    color: #0000;
    border: none;
    transform: perspective(500px) rotateY(calc(20deg*var(--_i,-1)));
    text-shadow: calc(var(--_i,-1)* 0.08em) -.01em 0   var(--c),
      calc(var(--_i,-1)*-0.08em)  .01em 2px #0004;
    outline-offset: .1em;
    transition: 0.3s;
  }
  
.button-92:hover,
.button-92:focus-visible {
--_p: 0%;
--_i: 1;
}

.button-92:active {
text-shadow: none;
color: var(--c);
box-shadow: inset 0 0 9e9q #0005;
transition: 0s;
}

.button-92 {
font-weight: bold;
font-size: 2rem;
margin: 0;
cursor: pointer;
padding: .1em .3em;
}