body{
    background-image: url("./visualscss/noise.gif");
    background-repeat: repeat;
    background-attachment: fixed;
    background-position: center;
}


#box1{
    position: relative;
    margin-left: 27%;
    margin-right: 50%;
    margin-top: 300px;
    top: 30px;
    filter: drop-shadow(0px 0px 20px rgba(0,0,0,1));
    animation: text 2s ease-in-out 0s forwards, text2 2s ease-in-out 3s forwards;
}

@keyframes text {
    from {opacity: 0; filter: blur(5px);}
    to {opacity: 100; filter: blur(0px);}
}

@keyframes text2 {
    to {opacity: 0; filter: blur(10px);}
}

.usb{
    display: inline;
    position: relative;
    text-align: center;
    left: 45%;
    bottom: 120px;
    opacity: 0;
    animation: appear 2s 5s forwards;
}

@keyframes appear{
    from {opacity: 0; filter: blur(5px)}
    to {opacity: 1; filter: blur(0px);}
}

@media (max-width: 600px) {
    #box1{
        scale: 0.5;
        right: 16%;
    }

    .usb{
        text-align: center;
        left: 40%;
    }
}
