#main {
    width: 352px;
    margin: 0px auto 0px auto;
    font-family: tahoma;
    padding-right: 8px;
}

.separator {
    border-bottom: 2px solid black;
}

label {
    font-size: 1.2em;
}

input[type="radio"] {
    display:none;
}

// section 1

input#show1, input#hide1 {
    display:none;
}

#section1 {
    background-color: red;
    color: white;
}

.space1 {
    padding: 0 0 0 5px;
}

div#content1 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show1:checked ~ .show1:before {
    content: ""
}
input#show1:checked ~ .hide1:before {
    content: " All Weeks [Hide]"
}

input#hide1:checked ~ .hide1:before {
    content: ""
}
input#hide1:checked ~ .show1:before {
    content: " All Weeks [Show]"
}
input#show1:checked ~ div#content1 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide1:checked ~ div#content1 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}

// section 2

input#show2, input#hide2 {
    display:none;
}

#section2 {
    background-color: red;
    color: white;
}

.space2 {
    padding: 0 0 0 5px;
}

div#content2 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}

input#show2:checked ~ .show2:before {
    content: ""
}
input#show2:checked ~ .hide2:before {
    content: " All Players [Hide]"
}

input#hide2:checked ~ .hide2:before {
    content: ""
}
input#hide2:checked ~ .show2:before {
    content: " All Players [Show]"
}
input#show2:checked ~ div#content2 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide2:checked ~ div#content2 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}

// section 3

input#show3, input#hide3 {
    display:none;
}

#section3 {
    background-color: red;
    color: white;
}

.space3 {
    padding: 0 0 0 5px;
}

div#content3 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show3:checked ~ .show3:before {
    content: ""
}
input#show3:checked ~ .hide3:before {
    content: " This Week [Hide]"
}

input#hide3:checked ~ .hide3:before {
    content: ""
}
input#hide3:checked ~ .show3:before {
    content: " This Week [Show]"
}
input#show3:checked ~ div#content3 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide3:checked ~ div#content3 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}

// section 4

input#show4, input#hide4 {
    display:none;
}

#section4 {
    background-color: red;
    color: white;
}

.space4 {
    padding: 0 0 0 5px;
}

div#content4 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show4:checked ~ .show4:before {
    content: ""
}
input#show4:checked ~ .hide4:before {
    content: " Table [Hide]"
}

input#hide4:checked ~ .hide4:before {
    content: ""
}
input#hide4:checked ~ .show4:before {
    content: " Table [Show]"
}
input#show4:checked ~ div#content4 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide4:checked ~ div#content4 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}

// section 5

input#show5, input#hide5 {
    display:none;
}

#section5 {
    background-color: red;
    color: white;
}

.space5 {
    padding: 0 0 0 5px;
}

div#content5 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show5:checked ~ .show5:before {
    content: ""
}
input#show5:checked ~ .hide5:before {
    content: " Last Week [Hide]"
}

input#hide5:checked ~ .hide5:before {
    content: ""
}
input#hide5:checked ~ .show5:before {
    content: " Last Week [Show]"
}
input#show5:checked ~ div#content5 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide5:checked ~ div#content5 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}

// section 6

input#show6, input#hide6 {
    display:none;
}

#section6 {
    background-color: red;
    color: white;
}

.space6 {
    padding: 0 0 0 5px;
}

div#content6 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show6:checked ~ .show6:before {
    content: ""
}
input#show6:checked ~ .hide6:before {
    content: " Scores of Eleven [Hide]"
}

input#hide6:checked ~ .hide6:before {
    content: ""
}
input#hide6:checked ~ .show6:before {
    content: " Scores of Eleven [Show]"
}
input#show6:checked ~ div#content6 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide6:checked ~ div#content6 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}

// section 7

input#show7, input#hide7 {
    display:none;
}

#section7 {
    background-color: red;
    color: white;
}

.space7 {
    padding: 0 0 0 5px;
}

div#content7 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show7:checked ~ .show7:before {
    content: ""
}
input#show7:checked ~ .hide7:before {
    content: " Final September Table [Hide]"
}

input#hide7:checked ~ .hide7:before {
    content: ""
}
input#hide7:checked ~ .show7:before {
    content: " Final September Table [Show]"
}
input#show7:checked ~ div#content7 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide7:checked ~ div#content7 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}

// section 8

input#show8, input#hide8 {
    display:none;
}

#section8 {
    background-color: red;
    color: white;
}

.space8 {
    padding: 0 0 0 5px;
}

div#content8 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show8:checked ~ .show8:before {
    content: ""
}
input#show8:checked ~ .hide8:before {
    content: " Final October Table [Hide]"
}

input#hide8:checked ~ .hide8:before {
    content: ""
}
input#hide8:checked ~ .show8:before {
    content: " Final October Table [Show]"
}
input#show8:checked ~ div#content8 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide8:checked ~ div#content8 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}

// section 9

input#show9, input#hide9 {
    display:none;
}

#section9 {
    background-color: red;
    color: white;
}

.space9 {
    padding: 0 0 0 5px;
}

div#content9 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show9:checked ~ .show9:before {
    content: ""
}
input#show9:checked ~ .hide9:before {
    content: " Final November Table [Hide]"
}

input#hide9:checked ~ .hide9:before {
    content: ""
}
input#hide9:checked ~ .show9:before {
    content: " Final November Table [Show]"
}
input#show9:checked ~ div#content9 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide9:checked ~ div#content9 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}

// section 10 December

input#show10, input#hide10 {
    display:none;
}

#section10 {
    background-color: red;
    color: white;
}

.space10 {
    padding: 0 0 0 5px;
}

div#content10 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show10:checked ~ .show10:before {
    content: ""
}
input#show10:checked ~ .hide10:before {
    content: " Final December Table [Hide]"
}

input#hide10:checked ~ .hide10:before {
    content: ""
}
input#hide10:checked ~ .show10:before {
    content: " Final December Table [Show]"
}
input#show10:checked ~ div#content10 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide10:checked ~ div#content10 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}


// section 11 January

input#show11, input#hide11 {
    display:none;
}

#section11 {
    background-color: red;
    color: white;
}

.space11 {
    padding: 0 0 0 5px;
}

div#content11 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show11:checked ~ .show11:before {
    content: ""
}
input#show11:checked ~ .hide11:before {
    content: " Final January Table [Hide]"
}

input#hide11:checked ~ .hide11:before {
    content: ""
}
input#hide11:checked ~ .show11:before {
    content: " Final January Table [Show]"
}
input#show11:checked ~ div#content11 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide11:checked ~ div#content11 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}

// section 12 January

input#show12, input#hide12 {
    display:none;
}

#section12 {
    background-color: red;
    color: white;
}

.space12 {
    padding: 0 0 0 5px;
}

div#content12 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
    padding-top: 5px;
}
input#show12:checked ~ .show12:before {
    content: ""
}
input#show12:checked ~ .hide12:before {
    content: " Final February Table [Hide]"
}

input#hide12:checked ~ .hide12:before {
    content: ""
}
input#hide12:checked ~ .show12:before {
    content: " Final February Table [Show]"
}
input#show12:checked ~ div#content12 {
    opacity: 1;
    font-size: 100%;
    height: auto;
}
input#hide12:checked ~ div#content12 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}


/* extra */
#content1, #content2, #content3, #content4, #content5, #content6, #content7, #content8, #content9, #content10, #content11, #content12 {
    clear: both;
    background-color: white;
    color: #088A08;
}

.s_line {
    width: 352px;
    clear: both;
}
.s_week {
    width: 345px;
    clear: both;
    border: 1px solid black;
    padding-left: 5px;
}
.s_overall {
    width: 350px;
    clear: both;
}
.s_player_name {
    width: 322px;
    float: left;
    color: #21610B;
    font-weight: bold;
    background-color: #E8E8E8;
}
.s_points {
    width: 30px;
    float: left;
    color: #21610B;
    background-color: #E8E8E8;
}
.s_total {
    width: 322px;
    float: left;
    text-align: right;
}
.s_player_points {
    width: 30px;
    float: left;
    text-align: right;
}
.s_league {
    width: 170px;
    float: left;
}
.s_team {
    width: 152px;
    float: left;
    font-weight: bold;
}
.s_pos {
    width: 30px;
    float: left;
}
.s_table {
    width: 292px;
    float: left;
    font-weight: bold;
}
.s_table_header {
    width: 290px;
    float: left;
    font-weight: bold;
}