body{-webkit-text-size-adjust:100%;font-family:Verdana,Geneva,sans-serif;font-size:16px;color:#39382D;line-height:1.6;margin:0;padding:0;background-color:#ebebe7}
h1,h2,h3,h4{font-family:'Grandstander',sans-serif;color:#666;line-height:1.1;font-weight:100;margin:0 0 -8px}
h1{font-size:1.8em;min-height:1em;margin-top:10px}
h2{font-size: 1.4em;margin-top:10px}
h3{font-size:1.3em;margin-top:25px}
p{font-size:1em;overflow-wrap:break-word;word-wrap:break-word;word-break:break-word}
b{color: #484739}
a:link{color: #956739;text-decoration: none}
a:visited{color: #6A4928}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;border:15px solid #FFF}
img.radius{max-width:100%;border-radius:50%;border:none;margin-right:auto;margin-left:auto}
#header_wrapper{height:46px}
.header{height:46px;width:100%;background-color:#dededa;position: fixed;top: 0;left: 0;z-index: 3}
.header ul{margin:0;padding:0;list-style:none;overflow:hidden}
.header li a{text-align:center;display:block;border-left:1px solid #AAA;text-decoration:none}
.header li a:hover{background-color:#AAA;color:#FFF}
#logo{font-family:'Grandstander',sans-serif;font-size:1.6em;width:auto;float:left;margin-left:12px;margin-top:5px;}
#logo a{color: #273037}
.menu a{color:#273037}
.menu li a {padding: 10px 20px;}
.menu {clear: none;float: right;}
.first_text{color:#963;margin-right:-4px}
.second_text{color:#273037}
#firstwrapper{color: #ccc;background-color:#252522;max-width:1100px;height:400px;background-image:url(images/background.jpg);background-repeat:no-repeat;margin:0 auto;}
#secondwrapper{background-color:#252522;width:100%;height:auto;line-height:1;}
#secondwrapper h1{color: #999;font-size:2.8em;padding-top:5px}
#secondwrapper h2{font-size: 2em;}
#secondwrapper p{color: #EEE;font-size: 1.05em;line-height:120%;}
#inside_left{width:54%;padding:10px 3% 10px 3%;margin:0 auto;}
.main-content,.transcription,.flute,.ukulele,.piano,.tabpng,.chords,.key {background-color:#fbfbfb;margin:2px 0;padding:10px 30px;}
.main-content {border-left: 3px solid #CCC;}
.transcription a,.flute a,.piano a,.ukulele a, .chords a {text-decoration: underline}
.transcription {border-left: 3px solid #949483;}
.ukulele {border-left: 3px solid #3eebc6;}
.flute {border-left: 3px solid #64e0dc;}
.piano {border-left: 3px solid #3E3125;}
.tabpng {border-left: 3px solid #e9ce88;}
.chords {border-left: 3px solid #fd64ff;}
.key {border-left: 3px solid #86f231;float:left}
aside {max-width:1037px;background-color:#fbfbfb;padding:20px 30px 10px;margin:0 auto;border-left: 3px solid #ee937c;clear:left}
.quadrant_one,.quadrant_two,.quadrant_three,.quadrant_four{width:40%;float:left;padding-right:5%;padding-left:5%;text-align:center}
.quadrant_one h3,.quadrant_two h3,.quadrant_three h3,.quadrant_four h3{text-transform:uppercase}
.box{padding: 15px;display: block;border-bottom: 1px solid #DDD;}
.boxtext{display: block;border-bottom: 1px dotted #fd64ff;}
.verse{font-size:.7em;color: #CCC;font-style: italic;line-height:80%;}
.downloadlinks{font-size: 1.025em;height:28px;background-image:url(images/pdf_icon.png);background-repeat:no-repeat;background-position:left center;padding:8px 0 8px 32px}
.tags{font-size: 0.8em;color: #888;text-transform: uppercase;margin-left:10px}
#content{max-width:1100px;padding:1px 0;margin:0 auto}
.sidebar-nav{max-width:1100px;background-color:#fbfbfb;color:#3E3125;margin:2px auto;padding:30px 0;}
.sidebar-nav h4{font-size:1.5em;margin-bottom:5px;text-align:center}
.sidebar-nav ul{list-style:none;margin:0;padding:0 10%}
.sidebar-nav li{border-bottom:1px solid #DDD;text-align:center;padding:7px 0}
footer{font-size: .975em;line-height: 240%;text-align: center;padding: 10px 0;background-color: #dededa;}
.smaller {font-size: .8em}
.clear{height:1px;clear:both}
.sound{margin:20px 0 15px}
audio{height: 25px}
table{min-width:50%;border-spacing:0;background-color:#FFF;font-size:.9em;padding:8px}
th{padding-right:15px;padding-left:15px;border-bottom: 3px solid #ebebe7;text-align:left}
td{border-bottom:1px solid #ebebe7;padding:6px 15px 4px}
#tablefilter th{cursor:pointer}

@media only screen and (max-width: 1100px) {
#firstwrapper,#secondwrapper{margin: 0px auto 0;}
}
@media only screen and (max-width: 750px) {
#logo{font-size:1.5em;margin-left:8px;}
.menu li a {padding: 10px 15px;}
#firstwrapper{height:240px;background-image:url(images/background_small.jpg)}
#inside_left{width:90%;padding:10px 5% 10px 5%}
img{min-width: 102%;height: auto;margin: 0 -2%;padding: 0 1%;border-top: 15px solid #FFF;border-bottom: 15px solid #FFF;border-right:none;border-left:none}
img.cover {min-width: 50%;border:15px solid #FFF}
table{min-width:106%;padding:8px 0;margin:0 -3%}th{padding-right:10px;padding-left:10px}td{padding:6px 10px 4px}
}