:root {
    --purple:  rgb(106, 19, 89);
    --white: rgb(255, 255, 255);
  }

html {
    font-family: sans-serif;
}
body {
    text-align: center;
    margin-left: 20%;
    margin-right: 20%;
}
@media (max-width: 990px) {
    body {
        margin: 0 auto;
    }
}
a {
    text-decoration: none;
}
img {
    max-width: 100%;
    margin: 0px;
    padding: 0px;
}
#container {
    background-color: rgb(250, 250, 250);
}
#banner {
    padding: 8px;
}
#banner-logo {
    margin: 80px;
}
#nav {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: rgb(255, 255, 255);
    margin: 0px;
}
@media (max-width: 990px) {
    #nav {
        grid-template-columns: repeat(1, 1fr);
    }
}
#menu {
    display: none;
}
@media (max-width: 990px) {
    .nav-title {
        display: none;
        margin: 2px;
        padding: 8px;
    }
    #menu {
        display: inline;
        color: rgb(255, 255, 255);
        background-color: var(--purple);
        font-size: 1.5em;
        padding: 4px;
    }
}
.nav-title {
    color: rgb(255, 255, 255);
    background-color: var(--purple);
    margin: 2px;
    padding: 8px;
}
#page-title {
    padding: 8px;
}



#content {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(2, 1fr);
    background-color: rgb(238, 238, 238);
    text-align: left;
    margin: 2px;
    padding: 8px;
}
@media (max-width: 990px) {
    #content {
        grid-template-columns: repeat(1, 1fr);
    }
}
.content-title {
    color: rgb(255, 255, 255);
    background-color: var(--purple);
    text-align: left;
    padding: 8px;
    font-size: 1.25em;
}
#covid19 {
    color: rgb(0, 0, 0);
}
.covid19-content-title {
    color: rgb(255, 255, 255);
    background-color: rgb(255, 0, 0);
    text-align: center;
    text-transform: uppercase;
    padding: 8px;
    font-size: 2em;
}
#covid19-content {
    font-size: 1.25em;
    font-weight: 900;
    padding: 8px;
    text-align: justify;
}
#covid-box {
    background-color: rgb(230, 230, 230);
    border: 1px solid rgb(120, 120, 120);
    margin-left: 20%;
    margin-right: 20%;
    /* max-width: 400px; */
    margin: 16px;
    padding: 12px;
}
.covid-para {
    text-align: justify;
    margin: 8px;
    padding: 2px;
}

.small-text {
    font-size: .75em;
}
.border-rounded {
    border: 4px solid var(--purple);
    border-radius: 4px;
}

#raised-box {
    margin: -4px;
}
#three {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;

    background: rgb(255, 255, 255);
    margin: 0px;
}
.three-section div {
    margin-top: -4px;
    border: 1px solid rgb(100, 100, 100);
}
@media (max-width: 990px) {
    #three {
        grid-template-columns: repeat(1, 1fr);
    }
}

#contact-info {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    background: rgb(255, 255, 255);
    margin: 0px;
}
@media (max-width: 990px) {
    #contact-info {
        grid-template-columns: repeat(1, 1fr);
    }
}
.contact-info-title {
    color: rgb(255, 255, 255);
    background-color: var(--purple);
    margin-bottom: 8px;
    padding: 8px;
    font-size: 1.25em;
    text-align: center;
}
.content-box {
    border: 2px solid var(--purple);
}
.content-box-item {
    text-align: left;
    padding: 8px;
}
#phone, #locations, #email {
    padding: 8px;
    text-align: left;
}
#phone a {
    font-size: 1.5em;
}
#email a {
    color: rgb(255, 0, 0);
}

#management-team {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
#management-team img {
    border: 8px solid white;
}
#management-team-title {
    grid-column: 1/4;
    color: rgb(255, 255, 255);
    background-color: var(--purple);
    padding: 4px;
    font-size: 1.5em;
    font-weight: 400;
}
.management-team-member {
    background-color: rgb(250, 250, 250);
}
.management-team-member-title {
    padding: 4px;
    font-size: 1.25em;
    font-weight: 800;
}
.centered-ul {
    margin-left: 30%;
    margin-right: 10%;
}
@media (max-width: 990px) {
    .centered-ul {
        margin-left: 0%;
        margin-right: 0%;
        padding: 0px;
    }
}
li {
    text-align: left;
}


footer {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    text-align: center;
    padding: 16px;
    padding-bottom: 16px;
}
@media (max-width: 990px) {
    footer {
        grid-template-columns: repeat(2, 1fr);
    }
}
#redesign {
    font-size: .5em;
    text-align: right;
}
#history {
    text-align: center;
}
#small-text {
    font-size: .75em;
}
#content-box-bottom {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    text-align: right;
}
.content-box-bottom-title {
    grid-row: 1 / 4;
    color: rgb(255, 255, 255);
    background-color: var(--purple);
    text-align: left;
    padding: 8px;
    font-size: 1.25em;

}
#vans {
    padding: 2px;
}
#form {
    margin: 0 auto;
    padding: 1em;
    border: 1px solid rgb(0, 0, 0);
    border-radius: 1em;
    text-align: left;
}

.form-section {
    background-color: rgb(236, 223, 236);
    margin: 2px;
    padding: 4px;
}
.form-section-title {
    font-size: 1.5em;
    font-weight: 900;
}
#submit-button {
    text-align: center;
    font-size: 2em;
}

#back-to-top {
    color: blanchedalmond;
    background-color: black;
    margin-top: 8px;
    margin: 8px;
    padding: 8px;
}
#back-to-top a {
    color: blanchedalmond;
    padding: 8px;
}