.front9, .back9 {
    margin-bottom: 1em;
}
.front9 .hole, .back9 .hole {
    background-color: #f63;
    color: #fff;
}
.front9 .hole span, .back9 .hole span {
    padding: .5em 0;
}
.front9 .par, .back9 .par {
    border-bottom: 1px solid darkgrey;
    background-color: #ccc;
    color: #777;
}
.front9 .par span, .back9 .par span {
    padding: .25em 0;
}
.front9 .score, .back9 .score {
    color: #f63;
    border-bottom: 1px solid #ccc;
}
.front9 .score span, .back9 .score span {
    padding: .75em 0;
}
.front9 span, .back9 span {
    border: rgba(0, 0, 0, 0.25) solid 1px;
    border-width: 0 0 0 1px;
    display: inline-block;
    text-align: center;
    width: 3em;
}
.front9 span:first-child, .back9 span:first-child {
    text-align: left;
    padding-left: 1em;
    border-width: 0;
}
span.skin {
     background-color: black;
     font-weight: bold;
 }
span.greenie {
    color: limegreen;
    font-weight: bold;;
    text-decoration: underline overline;
}
span.putts {
    background-color: blue;
    font-weight: bold;
}

@media screen and (min-width: 80em) {
    .front9, .back9 {
        display: inline-block;
    }

    .back9 span:first-child {
        display: none;
    }
}


table a:link {
    color: #666;
    font-weight: bold;
    text-decoration:none;
}
table a:visited {
    color: #999999;
    font-weight:bold;
    text-decoration:none;
}
table a:active,
table a:hover {
    color: #bd5a35;
    text-decoration:underline;
}
table {
    font-family:Arial, Helvetica, sans-serif;
    color:#666;
    font-size:12px;
    text-shadow: 1px 1px 0px #fff;
    background:#eaebec;
    margin:20px;
    border:#ccc 1px solid;

    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;

    -moz-box-shadow: 0 1px 2px #d1d1d1;
    -webkit-box-shadow: 0 1px 2px #d1d1d1;
    box-shadow: 0 1px 2px #d1d1d1;
}
table th {
    padding:21px 25px 22px 25px;
    border-top:1px solid #fafafa;
    border-bottom:1px solid #e0e0e0;

    background: #ededed;
    background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#ebebeb));
    background: -moz-linear-gradient(top,  #ededed,  #ebebeb);
}
table th:first-child {
    text-align: left;
    padding-left:20px;
}
table tr:first-child th:first-child {
    -moz-border-radius-topleft:3px;
    -webkit-border-top-left-radius:3px;
    border-top-left-radius:3px;
}
table tr:first-child th:last-child {
    -moz-border-radius-topright:3px;
    -webkit-border-top-right-radius:3px;
    border-top-right-radius:3px;
}
table tr {
    text-align: center;
    padding-left:20px;
}
table td:first-child {
    text-align: left;
    padding-left:20px;
    border-left: 0;
}
table td {
    padding:18px;
    border-top: 1px solid #ffffff;
    border-bottom:1px solid #e0e0e0;
    border-left: 1px solid #e0e0e0;

    background: #fafafa;
    background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#fafafa));
    background: -moz-linear-gradient(top,  #fbfbfb,  #fafafa);
}
table tr.even td {
    background: #f6f6f6;
    background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#f6f6f6));
    background: -moz-linear-gradient(top,  #f8f8f8,  #f6f6f6);
}
table tr:last-child td {
    border-bottom:0;
}
table tr:last-child td:first-child {
    -moz-border-radius-bottomleft:3px;
    -webkit-border-bottom-left-radius:3px;
    border-bottom-left-radius:3px;
}
table tr:last-child td:last-child {
    -moz-border-radius-bottomright:3px;
    -webkit-border-bottom-right-radius:3px;
    border-bottom-right-radius:3px;
}
table tr:hover td {
    background: #f2f2f2;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#f0f0f0));
    background: -moz-linear-gradient(top,  #f2f2f2,  #f0f0f0);
}