body {
    background-image: url("../images/cantina.jpg");
    background-repeat: no-repeat;
    background-size: 100vw 100vh;
    position: fixed;
    width: 120%; 
    left: 0px; 
    top: 0px; 
}

#battle-ground {
    background-image: linear-gradient(black, rgb(38, 203, 245), black);
}

#page-logo,
#pick-fighter {
    color: #feda4a;
    text-shadow: 6px 6px 7px black;
    font-family: 'Pathway Gothic One', sans-serif;
}

.back-drop {
    background-image: linear-gradient(rgba(0,0,0,1), rgba(0,0,0,0));
    width: 120%;
}

@media screen and (max-width: 700px) {
    .fighter,
    .ally,
    .your-enemy {
        width: 50%;
    }

    #page-logo {
        font-size: 25px;
    }

    body {
        position: relative;
        background-repeat: repeat-y;
        background-size: 120%;
    }

    .container,
    .back-drop,
    .row,
    .card {
        width: 80%;
    }

}