@font-face {
    src:url("Azonix-1VB0.otf");
    font-family:Azonix;
}

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

body {
    background-image: url('https://wallpaperaccess.com/full/4014646.jpg');
    background-size:cover;
    background-repeat: no-repeat;
    background-position: center;
    height:100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color:#fff;
    text-shadow: 1px 1px 10px #433bf9;
}

h1 {
    font-family:Azonix;
    letter-spacing: 2px;
    font-size:calc(30px + 1rem);
    margin-bottom:10px;
}

h4{
    font-family: 'Courier New', Courier, monospace;
}

button{
    background-color: #62a2ef ;
    margin-top:20px;
    padding:50px;
    border:none;
    border-radius:50%;
    /* box-shadow: 1px 1px 10px #62a2ef ; */
    transition: all 0.5s;
    cursor:pointer;
    animation: glowing 2s infinite;
}

@keyframes glowing {
    0% {
        box-shadow: 1px 1px 10px #62a2ef ;
    }
     50% {
        box-shadow: 1px 1px 60px #62a2ef ;
    }
     100% {
        box-shadow: 1px 1px 10px #62a2ef ;
    }
}

button:hover,
button:active{
    box-shadow: 1px 1px 50px #433bf9;
}

.spiral {
    background-image: url('https://media0.giphy.com/media/xT39CTrFW4nHLdBPpu/giphy.gif');
    background-size:cover;
}