@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700');

section.info {
    display: none;
    padding: 100px 0;
    box-sizing: border-box;
    margin: 0 auto;
    position: relative;
}
section.info p,li {
    color: #111;
}
section.info ul {
    list-style: none;
}
section.info .cell-1-2 {
    vertical-align: top;
}
section.info iframe {
    width: 100%;
    height: 75%;
    margin: 50px auto 0;
    box-shadow: 0 0 25px rgba(0,0,0,0.5);
}

input {
    display: none;
}

.tab-title {
	font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400;
	color: #cb0102 !important;
	font-size: 48px;
	margin: 20px 0;
	text-align: left;
}

label {
    display: inline-block;
    margin: 0;
    padding: 10px;
    text-align: center;
    color: #111;
    font-size: 18px;
    background: #eee;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight:400;
}

label:before {
    margin-right: 5px;
    width:25px; 
    height:25px; 
    display:inline-block; 
    vertical-align:middle; 
}

label:hover,
label:focus {
    color: #cb0102;
    cursor: pointer;
}

input:checked + label {
    color: white;
    background: #111;
}

#leadership:checked ~ #leadership-info,
#ministries:checked ~ #ministries-info,
#youth:checked ~ #youth-info,
#community:checked ~ #community-info,
#fellowship:checked ~ #fellowship-info,
#special:checked ~ #special-info,
#support:checked ~ #support-info,
#christmas:checked ~ #christmas-info,
#emergency:checked ~ #emergency-info,
#response:checked ~ #response-info,
#camping:checked ~ #camping-info,
#hockey:checked ~ #hockey-info {
    display: block;
    margin: 0;
    padding-bottom: 25px;
}

@media screen and (max-width: 1200px) {
    label {
        display: block;
        margin: 0 50px 2px 0;
        padding: 10px;
        text-align: left;
        background: #111;
        color: white;
        float: left;
        clear: left;
        width: 200px;
    }
    input:checked + label {
        color: white;
        background: #cb0102;
    }
    
    section.info {
        padding: 0;
        margin: 0;
    }
    
    #leadership:checked ~ #leadership-info,
    #ministries:checked ~ #ministries-info,
    #youth:checked ~ #youth-info,
    #community:checked ~ #community-info,
    #fellowship:checked ~ #fellowship-info,
    #special:checked ~ #special-info,
    #support:checked ~ #support-info,
    #christmas:checked ~ #christmas-info,
    #emergency:checked ~ #emergency-info,
    #response:checked ~ #response-info,
    #camping:checked ~ #camping-info,
    #hockey:checked ~ #hockey-info {
        display: block;
        margin: -275px 0 0;
        padding-bottom: 25px;
        float: left;
        width: calc(100% - 300px);
    }
}

@media screen and (max-width: 768px) {
    label {
        font-size: 0;
        width: 60px;
        height: 60px;
        padding: 0;
        margin: 0 25px 0;
    }
    label:before {
        margin: 0;
        padding: 0;
    }
    
    .tab-title {
        font-size: 36px;
    }
    
    label[for*='leadership']:before { 
        content:''; 
        background:url(../images/icons/leader.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='ministries']:before { 
        content:''; 
        background:url(../images/icons/ministries.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='youth']:before { 
        content:''; 
        background:url(../images/icons/youth.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='community']:before { 
        content:''; 
        background:url(../images/icons/community.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='fellowship']:before { 
        content:''; 
        background:url(../images/icons/fellowship.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='special']:before { 
        content:''; 
        background:url(../images/icons/special.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='support']:before { 
        content:''; 
        background:url(../images/icons/community.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='christmas']:before { 
        content:''; 
        background:url(../images/icons/donate.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='emergency']:before { 
        content:''; 
        background:url(../images/icons/emergency.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='response']:before { 
        content:''; 
        background:url(../images/icons/help.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='camping']:before { 
        content:''; 
        background:url(../images/icons/camp.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    label[for*='hockey']:before { 
        content:''; 
        background:url(../images/icons/hockey.png) no-repeat center;
        background-size: 40px 40px;
        width: 60px;
        height: 60px;
    }
    
    #leadership:checked ~ #leadership-info,
    #ministries:checked ~ #ministries-info,
    #youth:checked ~ #youth-info,
    #community:checked ~ #community-info,
    #fellowship:checked ~ #fellowship-info,
    #special:checked ~ #special-info,
    #support:checked ~ #support-info,
    #christmas:checked ~ #christmas-info,
    #emergency:checked ~ #emergency-info,
    #response:checked ~ #response-info,
    #camping:checked ~ #camping-info,
    #hockey:checked ~ #hockey-info {
        margin: -325px 0 0;
        padding: 0;
        float: left;
        width: calc(100% - 150px);
    }
}

@media screen and (max-width: 532px) {
    label {
        display: inline-block;
        float: none;
        margin: 0;
        width: 40px;
        height: 40px;
    }
    
    label[for*='leadership']:before { 
        content:''; 
        background:url(../images/icons/leader.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='ministries']:before { 
        content:''; 
        background:url(../images/icons/ministries.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='youth']:before { 
        content:''; 
        background:url(../images/icons/youth.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='community']:before { 
        content:''; 
        background:url(../images/icons/community.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='fellowship']:before { 
        content:''; 
        background:url(../images/icons/fellowship.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='special']:before { 
        content:''; 
        background:url(../images/icons/special.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='support']:before { 
        content:''; 
        background:url(../images/icons/community.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='christmas']:before { 
        content:''; 
        background:url(../images/icons/donate.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='emergency']:before { 
        content:''; 
        background:url(../images/icons/emergency.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='response']:before { 
        content:''; 
        background:url(../images/icons/help.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='camping']:before { 
        content:''; 
        background:url(../images/icons/camp.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }
    label[for*='hockey']:before { 
        content:''; 
        background:url(../images/icons/hockey.png) no-repeat center;
        background-size: 40px 40px;
        width: 40px;
        height: 40px;
    }    
    
    #leadership:checked ~ #leadership-info,
    #ministries:checked ~ #ministries-info,
    #youth:checked ~ #youth-info,
    #community:checked ~ #community-info,
    #fellowship:checked ~ #fellowship-info,
    #special:checked ~ #special-info,
    #support:checked ~ #support-info,
    #christmas:checked ~ #christmas-info,
    #emergency:checked ~ #emergency-info,
    #response:checked ~ #response-info,
    #camping:checked ~ #camping-info,
    #hockey:checked ~ #hockey-info {
        float: none;
        width: 90%;
        margin: 0 auto;
    }
}