.jumbotron {
    background-image: url('../images/small-town-ph.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    opacity: 0.75;
    padding: 15%;
    background-position-y: -100px;
    z-index: -1000;
}

.transparent-box {
    background: rgb(0, 0, 0);
    /* Fallback for older browsers without RGBA-support */
    background: rgba(0, 0, 0, 0.6);
    width: 500px;
    padding: 15px;
}

@media only screen and (max-width: 720px) {
    .transparent-box {
        width: 250px;
    }
}

@media only screen and (max-width: 1100px) {
    .jumbotron {
        background-position-y: -50px;
    }
}

.jumbotron-content {
    font-weight: bolder;
}

.jumbotron-content>button {
    background-color: #004ea0;
    border-color: #004ea0;
    border-radius: 20px;
    font-size: 25px;
}

.rotate-to-normal {
    animation: rotateBack 200ms ease-in-out forwards;
}

.rotate-down {
    animation: rotate 200ms ease-in-out forwards;
}

@keyframes rotate {
    from {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(-90deg)
    }
}

@keyframes rotateBack {
    from {
        transform: rotate(-90deg)
    }

    to {
        transform: rotate(0deg)
    }
}