body {
    font-family: "Open Sans";
    font-size: 1em;
    background-color: black;
}

.red {
    color: red;
    }
h1 {
    font-size: 1.5em;
    }

h2 {
    font-size: 1.3em;
}

h3 {
    font-size: 1em;
    }

.wrapper {
    background-color: white;
    width: 90%;
    margin: 0 auto;
    /* height: 100%; */
}

.header {
    background-color: darkseagreen;
    padding-left: 2%;
    padding-bottom: 2%;
}

.header h1, .header h2 {
    color: white;
    padding: 0;
    margin: 0;
    text-shadow: grey 1px 1px 4px;
    font-family: Montserrat, sans-serif;
}

.header h1 {
    font-size: 2em;
}

.header h2 {
    font-size: 1.3em;
}

.header a {
    text-decoration: none;
    }

.nav {
    background-color: rgb(167, 203, 176);
    border: green 1px solid;
    border-left: 0;
    border-right: 0;

    padding-top: 1%;
    padding-bottom: 1%;
}

.nav ul {
    list-style: none;
    text-align: center;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;
}

.nav li {
    display: inline-block;
    padding: 0 5% 0 5%;
}

.nav a {
    text-decoration: none;
    color: white;
}
.nav a:hover {
    text-decoration: underline;
}

.on {
    font-weight: 700;
    }
    
.off {
    font-weight: 300;
    }    

.footer p {
    font-size: 0.7em;
    color:  grey;
    margin-left: 2%;
    margin-top: 2px;
    margin-bottom: 2px;
}

.info-pane {
    font-size: 0.9em;
    padding-right: 10px;
    padding-left: 10px;
}

.info-pane p {
    padding-left: 3%;
    padding-right: 3%;
}



.square-image {
    float: right;
    margin-top: 0px;
}

.square-image img {
    height: 150px;
    width: 150px;
}

/*Gigs Section*/

.gigs ul {
    list-style: none;
    padding-left: 10px;
}    

.gig-date {
    font-size: 0.9em;
}
.gig-venue {
    font-weight: 700;
    font-size: 1em;
    padding-left: 10px;
}
.gig-location {
    font-size: 0.8em;
}

/* Downloads Section */

.download-links {
    text-align: center;
    }
    
.download-links ul { 
    list-style: none;
    padding: 0;
    
}

.download-links a {
    text-decoration: none;
}

.song-name {
    font-size: 1.3em;
}
.song-description {
    font-size: 0.8em;
}


/*ClearFix*/
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */}

.cf:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */.cf {
    *zoom: 1;
}