/* Overall defaults */
* {
margin:0;
padding:0;
font-family: varela_round, "Trebuchet MS", Arial, Verdana, sans-serif;
line-height:140%;
}
p {
font-size:110%;
padding-top:0.5em;
padding-bottom:0.5em;
}
span, a, li, b, i {
font-size:110%;
}
#header {
overflow:hidden;
}
#main-menu {
padding-top:0.4em;
padding-bottom:0.8em;
}
.menu-item {
text-decoration:none;
color:#005511;
padding-bottom:0.5em;
}
.menu-item-current {
color:#dd1111;
text-decoration:none;
border-bottom: 1px solid #ff0000;
}
#set-menu {
width:100%;
border:1px solid #ff0000;
}
.bottom-menu-left {
}
.bottom-menu-right {
float:right;
}
@media only screen and (max-width: 589px) {
.bottom-menu-left {
float:left;
clear:both;
}
.bottom-menu-right {
clear:both;
float:left;
padding-top:30px;
padding-bottom:20px;
}
}
ul {
list-style-type:none;
padding-left:0.1em;
}
h1 {
color:#044300;
}
h1.tune-title {
clear:both;
white-space:nowrap;
font-size:3.5vw;
color:#000000;
}
h1.long-tune-title {
clear:both;
white-space:nowrap;
font-size:2.6vw;
color:#000000;
}
h1.extra-long-tune-title {
clear:both;
white-space:nowrap;
font-size:2.5vw;
color:#000000;
}
span.tune-type {
font-size:70%;
position:absolute;
right:50px;
margin-top:5px;
}
span.tune-type-two-icons {
font-size:70%;
position:absolute;
right:90px;
margin-top:5px;
}
span.tune-type-three-icons {
font-size:70%;
position:absolute;
right:130px;
margin-top:5px;
}
span.tune-type-four-icons {
font-size:70%;
position:absolute;
right:170px;
margin-top:5px;
}
h2 {
padding-top:0.7em;
padding-bottom:0.5em;
color:#004400;
}
a {
outline-style:none;
}
#body {
margin:12px;
max-width:1079px;
}
div.tune-break {
clear:both;
height:20px;
}
img.action-icon-1 {
position:absolute;
right:10px;
margin-top:8px;
max-width:5vw;
}
img.action-icon-2 {
position:absolute;
right:50px;
margin-top:8px;
max-width:5vw;
}
img.action-icon-3 {
position:absolute;
right:90px;
margin-top:8px;
max-width:5vw;
}
img.action-icon-4 {
position:absolute;
right:130px;
margin-top:8px;
max-width:5vw;
}
img.notes {
position:relative;
left:-0.1in;
top:0in;
max-width:45%;
min-width:2.5in;
}
img.notes-only {
width:100%;
max-width:100%;
min-width:100%;
margin-top:5px;
}

/* Chord tables */
table.chords {
position:relative;
top:0in;
right:0in;
font-size:2.8vw;
border:0px;  /* For Chrome and Safari */
border-left:2px solid #000;
border-right:2px solid #000;
margin-left:4px;
margin-top:20px;
float:right;
}
table.chords-only {
clear:both;
left:0in;
right:none;
font-size:5.0vw;
width:95%;
float:left;
margin-top:2vw;
}
tr.even {
background:#DDDDDD;
}
td {
padding-right:1.0em;
line-height:120%;
}
td.last-chord {
padding-right:0.5em;
}
td.last {
text-align:right;
padding-right:3px;
}
td.first {
padding-left:3px;
padding-right:0.5em;
}

/* Adjust CSS for narrow devices */
@media only screen and (max-width: 489px) {
img.notes {
width:100%;
max-width:100%;
min-width:100%;
margin-top:5px;
}
table.chords {
clear:both;
left:0in;
right:none;
font-size:5.5vw;
width:95%;
float:left;
}
}


/*Preferable but does not work in Firefox 36.0.1 (the latest)*/
/*@page {
margin:0.5in;
}*/
#body {
margin:0.5in;
}
img.action-icon {
display:none;
}