/*Created by Mick Truman 2007 www.micktruman.com/websites (version 6 Sept 2007) */

html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset, img {
margin: 0; padding: 0;
}

/* "define font sizes in ems using values that are a tenth of target pixel size" .net/march07 Craig Grannel*/
html {
font-size: 100%;
}
body {
font: 62.5% Verdana, Arial, Helvetica, sans-serif;
color: #000; background: #fff;
}
p {
font: 1.2em/1.4em Verdana, Arial, Helvetica, sans-serif;
}
h1 {
font: 2em/1.4em Verdana, Arial, Helvetica, sans-serif;
}
h2 {
font: 1.8em/1.4em Verdana, Arial, Helvetica, sans-serif;
}
h3 {
font: 1.6em/1.4em Verdana, Arial, Helvetica, sans-serif;
}
h4 {
font: 1.2em/1.4em Verdana, Arial, Helvetica, sans-serif;
}
h5 {
font: 1em/1.2em Verdana, Arial, Helvetica, sans-serif;
}
h6 {
font: 0.8em/1.2em Verdana, Arial, Helvetica, sans-serif;
}



#wrapper {
width: 825px; background: #fff;
margin-top: 2em; margin-left: auto; margin-right: auto; margin-bottom: 2em;
}


#skip a, #skip a:hover, #skip a:visited {/*Based upon information from www.webaim.org*/ 
position:absolute; left:0px; top:-500px; width:1px; height:1px; overflow:hidden;
} 
#skip a:active,#access a:active { 
position:static; width:auto; height:auto; 
}



#header {
width: 100%; clear: both; height: auto; margin: 0;
}
#header img {
float: left; padding-bottom: 2em;
}
#header h1 {
font: bold 3em Arial, Helvetica, sans-serif; padding: 0 2.5em;
}
#header h2 	{
padding: 0 4.2em; text-transform: lowercase; font-weight: normal; color: #777;
}


#logo {
float: left;
}
#logo a {
text-decoration: none; color: #000;
}
#logo a:hover {
color: #e8ba5c;
}

#topNav {
width: 45%; float: right; text-align: right; color: #777; clear: right;
}
#topNav ul {
list-style-type: none; display: inline;
}
#topNav li {
display: inline;
}
#topNav a {
text-decoration: none; font-weight: bold; color: #777;
}
#topNav a:hover {
text-decoration: underline;
}

#search {
width: 45%; float: right; text-align: right; clear: right; padding-right: 1em; padding-top: 2em;color: #777;
}

#breadcrumbs {
clear: both; font-size: 0.9em; padding: 2em 0 0.5em 0; margin: 0; color: #999; background: #fff;
}
#breadcrumbs a {
text-decoration: none; color: #999;
}
#breadcrumbs a:hover {
text-decoration: underline;
}


#contentHolder {
width: 100%; clear: both; 
}
#contentHolder p {
padding: 0.5em 0;
}
#contentHolder a {
text-decoration: underline; color: #7a748e;
}
#contentHolder a:hover {
text-decoration: none; color: yellow; background: black;
}



/*Opacity Transparency CSS article from: http://webdesign.about.com "CSS 3 Opacity" by Jennifer Kyrnin. I have changed various divs and properties of proposed coding to make improvements for my design! VALIDATION = does not validate for CSS as opacity property not yet included!*/
#photoHeader {
margin: 0; padding: 0; width: 100%; position:relative; clear: both;
}
#photoHeader_text {
position:absolute; bottom: 0; left: 0; width: 100%; height: 4em; background: #fff; padding: 0.5em; filter: alpha(opacity=60); opacity: 0.6;
}
#photoHeader_words {
position: absolute; bottom: 0; left: 0; width: 100%; height: 4em; background: transparent; text-align: left;
}
#songTitle {
width: 65%; float: left; padding: 0 0 0 2em; font-size: 1.4em;
}
#songRef {
width: 28%; float: right; text-align: right; padding: 0.5em 2em 0 0; font-size: 1.2em;
}
.whiteText {
color: #fff;
}




#contentLeft {
margin: 0; padding: 1em 0; width: 50%; float: left;
}

#contentRight {
margin: 0; padding: 0; width: 40%; float: right;
}


#listen {
margin: 2em 0 1em 0; border: 0.1em solid #777; 
}
#listen h3 {/*div header*/
font-size: 1.2em; color: #fff; font-weight: bold; padding: 0.4em 1em;  margin-bottom: 1em; text-transform: lowercase;
}
.pssListen {
background: #7a748e;
}
.hssListen {
background: #396; 
}
.smsListen {
background: #369;
}
#listen h4 {/*track title*/
font-size: 1.5em; font-weight: bold; color: #003; padding: 0 0.7em;
}
#listen h5 {/*copyright line*/
font-size: 1.0em; color: #777; padding: 0 1em;
}
#listen h6 {/*credit info*/
font-size: 1.2em; color: #777; font-weight: bold; padding: 2em 0 0 1em;
}
#listen p {
padding: 0.5em 1em;
}
#listen img  {
padding: 0 0.5em 0 0; border: 0; float: left;
}
.noAudio {/*text "No audio available"*/
font-size: 1.5em; font-weight: bold; color: #777; padding: 0 0.7em;
}
.shedRed {
color: #c33; font-weight: bold;
}
.shedGrey {
color: #c6c4c6; text-align: right;
}


#themes h4, #lituse h4 {
color: #777; font-size: 1.3em; font-weight: bold;
}
#themes, #lituse {
width: 47%; text-align: left; text-transform: lowercase; margin: 1.5em 0;
}
#themes {
float: left; 
}
#lituse {
float: right;
}

#pdfDownload, #copyright {
clear: both; margin: 1.5em 0 2.5em 0;
}
#pdfDownload img, #copyright img {
float: left; padding: 0 1em 0 0;
}
#pdfDownload ul {
font-size: 1.2em; padding: 0 1em 2em 1em; list-style-type: none; line-height: 2em; 
}


#lyrics p {
color: #777; margin: 0 0 1em 2em;
}
#lyrics a {
color: #777; text-decoration: underline; padding: 0.2em;
}
#lyrics a:hover {
color: #9f3; text-decoration: underline; background: #003366; 
}
#lyrics ul {
font-size: 1.2em; padding: 0.5em 0; list-style-type: none;
}
#lyrics ul li {
margin-left: 2em; padding-bottom: 1.2em;
}
#lyrics ol {
font-size: 1.2em; padding-left: 2em; 
}
#lyrics ol li {
list-style-type: decimal; padding-bottom: 1.2em;
}
#lyrics h5 {/*copyright line*/
font-size: 1em; margin: 0 0 2em 2em; color: #888;
}

#related {
background: #dadeff; margin: 0 0 1em 0;
}
#related p {
font-size: 1.2em; color: #fff; font-weight: bold; padding: 0.3em 1em;  margin-bottom: 1em; text-transform: lowercase; background: #369;
}
#related ul {
font-size: 1.2em; padding: 0 1em 2em 1em; list-style-type: none; line-height: 2em; 
}


#footer {
width: 100%; clear: both; color: #777; padding: 1em 0; border-top: 0.1em dotted #777;
}
#footer p {
font-size: 0.9em; float: left;
}
#footer ul {
list-style-type: none; display: inline; float: right;
}
#footer li {
display: inline;
}
#footer a {
text-decoration: none; font-weight: bold; color: #777;
}
#footer a:hover {
text-decoration: underline;
}


/*----------------------------------------------------------------------------------------*/

#footer2print {
display: none;
}
#designPrint {
display: none;
}

.greytxt {
color: #777;
}