html {
    background-color: #CDCDCD;
}

body {
    font-family: 'Kdam Thmor Pro', sans-serif;
    background-color: white;
}

.header {
    font-weight: bolder;
    text-align: center;
    letter-spacing: .1em;
    margin: auto;
    padding-left: 10px;
    border-color: black;
    border-style: solid;
    border-width: 8px 0px;
    background-color: #694DAB; /* purple */
}

    .header a {
        color: white;
        text-decoration: none;
    }

h1 {
    font-size: 3em;
}

.navbar {
    overflow: hidden;
    background-color: #333;
}

    .navbar input {
        background-color: #333;
        float: left;
        color: #f2f2f2;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
        width: 150px;
        font-size: 1.5em;
        cursor: pointer;
    }

        .navbar input:hover {
            text-decoration: none;
            background-color: #ddd;
            color: black;
        }

        .navbar input.active {
            background-color: #04AA6D;
            color: white;
        }


footer {
    text-align: center;
    color: #694DAB;
}
::-webkit-scrollbar {
    width: 10px;
}
::-webkit-scrollbar-track {
    background: #f1f1f1;
}
::-webkit-scrollbar-thumb:hover {
    background: #555;
}
::-webkit-scrollbar-thumb {
    background: #694DAB;
}

select#year, select#meet {
    font-family: 'Kdam Thmor Pro', sans-serif;
    border-radius: 5px;

}

.results {
    margin: 10px;
    margin-top: 40px;
    text-align: center;
    border: solid;
}



.resultsBox {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
}

.maleResults {
    border-right: solid;
    text-align: left;
    display: inline-block;
}

.femaleResults {
    border-left: solid;
    text-align: left;
    display: inline-block;
}

.maleRace {
    padding: 10px;
}

.femaleRace {
    padding: 10px;
}

.temperature {
    padding: 10px;
    text-align: left;
}

.teamScorePlaceJVB {
    color: red;
}

.teamScorePlace {
    padding: 10px;
    border-top: solid;
    border-bottom: solid;
}

.year {
    text-align: center;
    border-style: solid;
    padding: 10px;
    font-size: 1.5em;
}

    .year caption {
        font-size: 1em;
    }

tr:hover {
    background-color: #ddd;
}
table {
    margin: auto;
    width: 50%;
}
    table th {
        border-bottom: solid;
    }
th {
    text-align: center;
    padding: 10px;
    background-color: #694DAB;
    color: black;
}
td {
    padding: 4px;
    text-align: center;
}
    td.date {
       width: 25%;
    }
    td.time {
        width: 20%;
    }
    td.place {
        width: 5%;
    }
    td.meet {
        width: 20%;
    }
    td.raceLength {
        width: 5%;
    }
    td.raceType {
        width: 7%;
    }
    td.fullName {
        width: 30%;
    }
    td.allTimePlace {
        width: 15%;
    }
    td.place {
        font-style: italic;
    }
tr:nth-child(even) {
    background-color: #f2f2f2;
}
tr:nth-child(even):hover {
    background-color: #ddd;
}
.nameStringEntry {
    margin-left: 10px;
    padding: 10px;
    width: 60%;
}

    .nameStringEntry input {
        font-family: 'Kdam Thmor Pro', sans-serif;
        border-radius: 5px;
    }
.button {
    margin: 10px;
    background-color: #333;
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
}
.athleteNameSelector {
    width: 20%;
}
    .athleteNameSelector select {
        margin-left: 20px;
        border-radius: 5px;
        font-family: 'Kdam Thmor Pro', sans-serif;
    }

.athleteResults {
    border-style: solid;
    text-align: center;
    margin: 10px;
    padding: 10px;
}
.distanceForm, .sexForm, .raceTypeForm, .limitForm, .uniqueForm {
    float:left;
    margin-left: 10px;
}

.bestResults {
    margin: 15px;
    padding: 50px;
}

#limit {
    font-family: 'Kdam Thmor Pro', sans-serif;
    border-radius: 5px;
}

.selectors select {
    border-radius: 10px;
    color: black;
    font-family: 'Kdam Thmor Pro', sans-serif;
}
    .selectors select {
        background-color: #333;
        color: white;
    }
.uniqueForm input {
    border-radius: 10px;
    background-color: #333;
    color: white;
    font-family: 'Kdam Thmor Pro', sans-serif;
}
