BODY {
    font-family: 'Roboto', Arial, Helvetica, Sans-Serif;
    font-size: 12px;
    color: Black;
    margin: 0px;
    padding: 0px;
    background-image: url("wallpaper.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

TABLE {
    white-space: nowrap;
    border-collapse: collapse;
}

@media screen and (max-width: 699px) {
    .wideViewOnly {
        display: none;
    }

    .narrowViewOnly {
    }
}

@media screen and (min-width: 700px) {
    .wideViewOnly {
    }

    .narrowViewOnly {
        display: none;
    }
}

.main-content {
    padding: 0px 30px 30px 30px;
    overflow: auto;
}
@media screen and (max-width: 699px) {
    .main-content {
        padding: 0px 0px;
    }
}

a:link {
    text-decoration: none
}

a:hover {
    text-decoration: none
}

a:visited {
    text-decoration: none
}

a:active {
    text-decoration: none
}

.shadow {
    box-shadow: 7px 7px 5px #87815d;
}

.menu {
    background-color: #4f6228;
    padding: 0px 8px;
    color: White;
    font-size: 140%;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

    .menu a {
        color: White;
        padding: 8px 20px;
    }

    .menu a:hover {
        color: White;
        background-color: #708741;
        text-decoration: none;
    }

    .menu .check {
        font-size: 70%;
        margin-left: 70px;
    }

@media screen and (max-width: 699px) {
    .menu {
        margin-bottom: 0px;
    }
    .menu .check {
        margin-left: 0px;
    }
}

.filter-box {
    max-width: 750px;
    border: solid 1px black;
    padding: 10px 15px;
    margin: 0 30px 30px;
    background-color: #e7ebc5;
    overflow: auto;
}

    .filter-box .left {
        padding-right: 15px;
    }

    .filter-box input[type="radio"] {
        margin-right: 3px;
    }

    .filter-box .dates {
    }

        .filter-box .dates .title {
            font-weight: bold;
            font-size: 110%;
            margin-bottom: 3px;
        }

        .filter-box .dates .years {
            display: flex;
            flex-wrap: wrap;
        }

            .filter-box .dates .years > div {
                margin: 3px 10px;
            }

        .filter-box .dates .custom {
            margin: 15px 10px 3px;
        }

            .filter-box .dates .custom input[type="text"] {
                width: 7em;
                text-align: center;
                margin: 0px 4px;
            }

    .filter-box .list-by {
        border-top: solid 1px black;
        margin-top: 15px;
        text-align: center;
        padding: 15px 0px;
    }

        .filter-box .list-by div {
            display: inline-block;
            padding: 0px 15px;
        }


    .filter-box td:nth-child(2) {
        padding-left: 10px;
    }

    .filter-box .apply {
        text-align: center;
        margin: 5px;
    }

    .filter-box select {
        width: 100px;
        height: 120px;
    }

    .filter-box .instructions {
        text-align: center;
        padding: 5px;
    }

@media screen and (max-width: 699px) {
    .filter-box {
        margin: 0px 0px 30px;
        border-left: none;
        border-right: none;
    }

        .filter-box .selection {
            display: flex;
            flex-direction: column;
        }

        .filter-box select {
            height: 60px;
        }

        .filter-box .dates {
            margin-bottom: 15px;
        }

        .filter-box .golfers {
            border-top: solid 1px black;
            padding-top: 15px;
        }
}

@media screen and (min-width: 700px) {
    .filter-box .selection {
        display: flex;
    }

    .filter-box .golfers {
        border-left: solid 1px black;
        padding-left: 15px;
    }
}


.white-text {
    color: white;
}

.scorecard {
    margin-bottom: 30px;
    border: solid 1px black;
    background-color: #595959;
}

    .scorecard td {
        padding: 3px;
        padding-left: 6px;
        padding-right: 6px;
        border: solid 1px black;
    }

    .scorecard .course-name td {
        text-align: left;
        font-weight: bold;
        font-size: 170%;
        background: #c4d79b;
        padding-top: 5px;
        padding-bottom: 5px;
        padding-left: 10px;
        vertical-align: middle;
    }

    .scorecard .hole-number td {
        text-align: center;
        color: White;
        background-color: #4f6228;
        border-left: 0px;
        border-right: 0px;
        font-weight: bold;
    }

        .scorecard .hole-number td:last-child {
            border-right: solid black 1px;
        }

    .scorecard .info td {
        text-align: center;
        background-color: #e7ebc5;
        border: 0px;
    }

        .scorecard .info td:first-child {
            text-align: left;
        }

        .scorecard .info td:last-child {
            border-right: solid black 1px;
        }

    .scorecard .tee-container {
        background-color: #e7ebc5;
    }

    .scorecard .date td {
        text-align: left;
        font-weight: bold;
        background-color: #c4d79b;
    }

    .scorecard .golfer-name {
        width: 8em;
        text-align: left;
        color: White;
        background-color: #595959;
        border-right: 0px;
    }

    .scorecard .round .tee-container {
        padding: 5px;
        border: solid 1px black;
        border-left: 0px;
        background-color: #595959;
    }

    .scorecard .birdie-container {
        color: White;
        text-align: center;
        background: #1375a9;
    }

    .scorecard .other-container {
        color: White;
        text-align: center;
        background: #1375a9;
    }

    .scorecard .score-cell {
        text-align: center;
        width: 3em;
        min-width: 3em;
        text-align: center;
        color: White;
        padding: 6px 0;
    }

    .scorecard .total {
        text-align: right;
        font-weight: bold;
        color: White;
        background-color: #808080;
    }

    .scorecard .handicap {
        text-align: right;
        color: White;
        background-color: #595959;
    }

    .scorecard .ratingCell {
        text-align: left;
        color: rgba(237, 222, 106, 1.0);
        letter-spacing: -1px;
        text-shadow: #000000 1px 1px 0px;
        border-right: solid 3px black;
    }

    .scorecard .rate5 {
        color: rgba(255, 255, 255, 1.0);
    }

    .scorecard .rate4 {
        color: rgba(237, 221, 150, 1.0);
    }

    .scorecard .rate3 {
        color: rgba(229, 177, 100, 1.0);
    }

    .scorecard .rate2 {
        color: rgba(201, 143, 50, 1.0);
    }

    .scorecard .rate1 {
        color: rgba(183, 109, 0, 1.0);
    }

    .scorecard .net {
        text-align: right;
        color: White;
        background-color: #595959;
    }

    .scorecard .winner {
        text-align: right;
        color: White;
        background-color: #787878;
    }

    .scorecard .adjusted-score {
        text-align: right;
        color: White;
    }


    .scorecard .course-record {
        display: inline-block;
        background-color: gold;
        color: black;
        padding: 2px;
        font-size: 75%;
        font-weight: bold;
        margin: 0px 3px;
        border-radius: 8px;
    }

    .scorecard .best {
        display: inline-block;
        background-color: silver;
        color: black;
        padding: 2px;
        font-size: 75%;
        font-weight: bold;
        margin: 0px 3px;
        border-radius: 8px;
    }


.single-circle {
    position: absolute;
    top: calc(50% - 10px);
    left: calc(50% - 10px);
    border-radius: 50%;
    width: 19px;
    height: 19px;
    border: 1px solid rgba(255, 255, 255, 1);
    text-align: center;
}

.single-square {
    position: absolute;
    top: calc(50% - 10px);
    left: calc(50% - 10px);
    width: 19px;
    height: 19px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    text-align: center;
}

.double-circle {
    position: absolute;
    top: calc(50% - 11px);
    left: calc(50% - 11px);
    border-radius: 50%;
    width: 21px;
    height: 21px;
    border: 3px double white;
    text-align: center;
}

.all-table {
    background-color: #eeece1;
    border: solid 0px;
}

    .all-table a {
        color: white;
    }

    .all-table .alt-row {
        background-color: #ddd9c4;
    }

    .all-table .most-recent {
        background-color: #178ecf;
        color: white;
    }

    .all-table th {
        text-align: center;
        background-color: #4f6228;
        color: White;
        font-weight: bold;
        padding: 3px;
        padding-left: 10px;
        padding-right: 10px;
        border: solid 0px;
    }

        .all-table th:hover {
            background-color: #728a40;
            cursor: pointer;
        }

    .all-table td {
        text-align: center;
        padding: 3px;
        padding-left: 10px;
        padding-right: 10px;
        border: solid 0px;
    }

    .all-table .name {
        color: White;
        font-weight: bold;
    }

    .all-table .adj-score {
        font-weight: bold;
    }

.topBorder {
    border-top: solid 1px black;
}

.right-border {
    border-right: solid 1px black;
}

.bottom-border {
    border-bottom: solid 1px black;
}

.career-table {
    margin-bottom: 30px;
}

    .career-table td {
        padding-top: 2px;
        padding-bottom:2px;
    }

    .career-table .spacer {
        height: 30px;
    }

    .career-table .name-row {
        background-color: #4f6228;
        color: white;
        vertical-align: bottom;
        font-weight: bold;
        border-bottom: solid 7px #76933c;
    }

        .career-table .name-row:hover {
            background-color: #708741;
            cursor: pointer;
        }

        .career-table .name-row .handicap {
            text-align: right;
            padding: 10px;
            padding-right: 5px;
        }

        .career-table .name-row .handicap-text {
            padding: 10px;
            padding-left: 0px;
            font-weight: normal;
        }

        .career-table .name-row .golferName {
            font-weight: bold;
            font-size: 120%;
            color: White;
            padding: 7px 2px 7px 7px;
        }

        .career-table .name-row .expand {
            font-size: 80%;
            vertical-align: middle;
            padding-left: 50px;
        }

    .career-table .title-row {
        background-color: #c4bd97;
    }

        .career-table .title-row td {
            text-align: center;
            font-size: 85%;
            padding-left: 8px;
            padding-right: 8px;
            padding-top: 0px;
            padding-bottom: 0px;
            vertical-align: middle;
        }

        .career-table .title-row .bold {
            font-weight: bold;
            font-size: 90%;
        }

    .career-table .stats-row {
        background-color: #eeece1;
    }

        .career-table .stats-row .year {
            padding-left: 5px;
            font-weight: bold;
            text-align: left;
        }

        .career-table .stats-row td {
            text-align: center;
            padding-left: 5px;
            padding-right: 5px;
        }

        .career-table .stats-row .hole-count {
            font-size: 75%;
            vertical-align: bottom;
            text-align: right;
            padding-right: 2px;
            padding-left: 12px;
        }

        .career-table .stats-row .distribution-cell {
            text-align: center;
            min-width: 45px;
            padding: 0px;
        }

        .career-table .stats-row .distribution-child {
            position: relative;
            padding: 0px;
            background-color: Red;
            height: 100%;
            width: 100%;
        }

        .career-table .stats-row .distribution-bar {
            background: #63c384; /* Old browsers */
            background: -moz-linear-gradient(left, #afdab6 0%, #63c384 100%); /* FF3.6+ */
            background: -webkit-gradient(linear, left top, right top, color-stop(0%,#afdab6), color-stop(100%,#63c384)); /* Chrome,Safari4+ */
            background: -webkit-linear-gradient(left, #afdab6 0%,#63c384 100%); /* Chrome10+,Safari5.1+ */
            background: -o-linear-gradient(left, #afdab6 0%,#63c384 100%); /* Opera 11.10+ */
            background: -ms-linear-gradient(left, #afdab6 0%,#63c384 100%); /* IE10+ */
            background: linear-gradient(left, #afdab6 0%,#63c384 100%); /* W3C */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#afdab6', endColorstr='#63c384',GradientType=1 ); /* IE6-9 */
            position: absolute;
            left: 0px;
            top: 2px;
            height: 12px;
            margin-top: -7px;
            z-index: 0;
        }

        .career-table .stats-row .distribution-text {
            position: absolute;
            left: 0px;
            top: 0px;
            height: 100%;
            width: 100%;
            text-align: center;
            margin-top: -7px;
            z-index: 1;
        }


.allAdjScore {
    font-weight: bold;
}

.sectionLabel {
    font-weight: bold;
    font-size: 15px;
    margin-bottom: 15px;
    margin-top: 15px;
}

.analysis-box {
    display: inline-block;
}

    .analysis-box .content {
        background-color: #e8e5d7;
        border: solid 1px #968d63;
        border-top: 0px;
        padding: 20px;
    }

.submenu {
    border-bottom: solid 1px #968d63;
    display: flex;
}

    .submenu div {
        font-size: 130%;
        padding: 5px 20px;
        font-weight: bold;
        border-top: solid 1px #968d63;
        border-right: solid 1px #968d63;
    }

        .submenu div:first-child {
            border-left: solid 1px #968d63;
        }

        .submenu div:hover {
            background-color: #ebe9e0;
            cursor: pointer;
        }

        .submenu div:first-child {
            margin-left: 0px;
        }

    .submenu .unselected {
        background-color: #ddd9c4;
    }

    .submenu .selected {
        background-color: #968d63;
        color: white;
    }

        .submenu .selected:hover {
            background-color: #968d63;
            cursor: pointer;
        }

.outing-page-container {
}

    .outing-page-container > tbody > tr > td {
        vertical-align: top;
        padding: 0px 20px;
    }

.outing-table {
    background-color: #595959;
}

    .outing-table td, .outing-table th {
        text-align: center;
        color: White;
        padding: 3px;
        padding-left: 8px;
        padding-right: 8px;
        border: solid 1px black;
    }
    .outing-table .index {
        background-color: #4f6228;
        border-top: 0;
        border-bottom: 0;
    }

    .outing-table .date {
        background-color: #4f6228;
        border-top: 0;
        border-bottom: 0;
        text-align: left;
    }

    .outing-table .course {
        background-color: #c2d69a;
        color: black;
        border-top: 0;
        border-bottom: 0;
        text-align: left;
    }

    .outing-table .name-row {
        background-color: #4f6228;
        color: white;
    }

        .outing-table .name-row th {
            background-color: #4f6228;
        }

    .outing-table .wma-row {
        background-color: #4f6228;
        font-weight: bold;
        border-top: solid black 4px;
    }

    .outing-table .average-row {
        background-color: #4f6228;
    }

.outcomeTable {
    border: solid 1px black;
}

    .outcomeTable td {
        padding: 3px;
        padding-left: 8px;
        padding-right: 8px;
        border-left: solid 1px black;
        border-right: solid 1px black;
        text-align: right;
        vertical-align: top;
    }

    .outcomeTable th {
        background-color: #4f6228;
        font-weight: bold;
        color: White;
        padding: 3px;
        padding-left: 8px;
        padding-right: 8px;
        border: solid 1px black;
    }

td.outcomeName {
    background-color: #76933c;
    font-weight: bold;
    color: White;
}

td.outcomeHoles {
    background-color: White;
}

td.outcomePercent {
    background-color: White;
}

td.outcomeOverPar {
    background-color: White;
    font-weight: bold;
}

.courseTable {
}

    .courseTable td {
        text-align: center;
        padding: 3px;
        padding-left: 8px;
        padding-right: 8px;
    }

    .courseTable .scoreCourseNameCell {
        padding-top: 5px;
        padding-bottom: 5px;
    }

td.coursesGolferName {
    color: White;
    font-weight: bold;
    width: 6em;
}

td.courseCell {
    background-color: #eeece1;
}

.text {
    width: 800px;
    margin-bottom: 30px;
    white-space: normal;
}

.clickLink {
    border-bottom: dashed 1px green;
    color: green;
}

    .clickLink:hover {
        cursor: pointer;
    }

.clickBox {
    margin-bottom: 20px
}

#HiddenDiv {
    width: 900px;
    font-size: 14px;
    display: none;
    margin-bottom: 25px;
}

.goals {
    display: inline-block;
    background-color: white;
    padding: 30px;
}

    .goals select {
        width: 200px;
    }

    .goals .output {
        font-size: 120%;
        margin-top: 40px;
        display: inline-block;
        padding: 30px;
        border: solid 1px black;
    }

        .goals .output th {
            text-align: center;
            background-color: #4a739a;
            color: white;
            font-weight: bold;
            padding: 5px 10px;
        }

        .goals .output td {
            text-align: center;
            padding: 3px 10px;
        }

        .goals .output tr:not(:first-child) {
            border-bottom: solid 1px #a0a0a0;
        }


#course-page {
}
    #course-page > .course-container {
        display: flex;
        flex-direction: row;
        margin: 15px 0;
    }

    #course-page .instructions {
        background-color: #746c4a;
        color: white;
        border: solid 1px black;
        border-bottom: 0px;
        padding: 5px 15px;
        font-weight: bold;
        font-size: 120%;
    }

    #course-page .courses {
        display: inline-block;
        border: solid 1px black;
        border-top: 0px;
        padding: 10px 15px;
        background-color: #e7ebc5;
    }

        #course-page .courses .course {
            white-space: nowrap;
            font-size: 120%;
            color: black;
        }
        #course-page .courses .line {
            padding: 4px 0px;
        }

        #course-page .courses .course:hover {
            font-weight: bold;
        }

    #course-page .data {
        margin-left: 30px;
    }

        #course-page .data .course-name {
            font-weight: bold;
            font-size: 170%;
            margin-bottom: 15px;
        }

        #course-page .data .header {
            background-color: #746c4a;
            color: white;
            font-weight: bold;
        }

        #course-page .data .total-length {
            border-left: solid 1px black;
            border-right: solid 1px black;
        }

        #course-page .data .tees .tee-container {
            border-right: solid 1px black;
        }

        #course-page .data .par,
        #course-page .data .rating,
        #course-page .data .slope {
            background-color: #808080;
            color: white;
        }

        #course-page .data .tees td {
            padding: 3px 6px;
        }

        #course-page .data .all-table {
            border: solid 1px black;
        }



.tee-container {
    padding: 5px;
    border: 0px;
}

.tee-box {
    width: 12px;
    height: 12px;
    border: solid 1px black;
    border-radius: 4px;
}