body {
    background: url(background.JPG);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    min-height: 100%;
    font-family: Arial, Helvetica, sans-serif;
    font-size: xx-large;
}


@media screen and (min-width: 700px) {
    .box {
        width: 50%;
    }
}

.box {
    margin: 5rem auto;
    background-color: #ca6ee6cb;
    border-radius: 2rem;
    padding: 2rem;
    word-wrap: break-word;
    animation: fadeIn 0.4s ease-in;
}

h1,
h2 {
    text-align: center;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}