#map {
    max-width: 55%;
    height: auto;
    float: left;
    margin: 2%;
    border-radius: 10px;
  }

#back {
    max-width: 25%;
    height: auto;
    float: right;
    margin: 15px;
    border-radius: 50px;
}

#shots {
    margin: auto;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-right: 10px;
}

h1, h2 {
    font-family: 'Gill Sans', 'sans-serif';
}

#second {
    font-family: 'Inknut Antiqua', 'serif';
    font-size: larger;
}

#third {
    font-family: 'Montserrat', 'sans-serif';
    font-size: x-large;
}

#intro {
    font-family: 'Futura', 'sans-serif';
    font-size: x-large;
    padding: 20px;
}

#instruct {
    font-family: 'Futura', 'sans-serif';
    font-size: large;
}

#repeatShot, #repeatAgain {
    font-family: 'Gill Sans', 'sans-serif';
    font-size: large;
    font-weight: bold;
    background-color: #888687;
    padding: 10px;
    border-radius: 10px;
    border: 3px solid black;
    margin: 10px;
}

ul {
    display: block;
    list-style-position: inside;
}

a {
    box-shadow: inset 0 0 0 0 #8A0707;
    color: #8A0707;
    margin: 0 -.25rem;
    padding: 0 .25rem;
    transition: color .3s ease-in-out, box-shadow .3s ease-in-out;
}

a:hover {
    box-shadow: inset 1000px 0 0 0 #8A0707;
    color: white;
}

body {
    background-color: #e9ba30;
}