/* 
This is the CSS for Gobaith.org by Reuben Whitehouse www.rocketfuelled.com
==================================================
*/

/* ==UNDO DEFAULT BROWSER STYLING: tantek.com/log/2004/undohtml.css */

ul { list-style-type: none; }
h1,h2,h3,h4,h5,h6,pre,code { font-size: 1em; font-weight: lighter; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,dl,dt,dd { margin: 0; padding: 0; }
a img,:link img,:visited img { border: none; }
a { text-decoration: none; }
address { font-style: normal; }

/* forms in content area */
#content form label
{
font-weight: bold;
padding: 3px 0 3px 3px;
}
#content form textarea
{
width: 375px;
}

/* == JUNGLE ======================================== */
body
{
margin: 0;
padding: 0;
font-family: arial, helvetica, verdana, sans-serif; 
font-size: 62.5%;
color: #666;
background: #0c419a;
text-align: center;
}

a
{
color: #0c419a;
}
a:hover
{
text-decoration: underline;
}

h2
{
margin-bottom: 13px;
font-size: 2.2em;
font-weight: bold;
color: #0c419a;
}
h3
{
margin-bottom: 10px;
padding-bottom: 3px;
font-size: 1.5em;
font-weight: bold;
color: #ff6600;
border-bottom: 1px solid #999;
}
h4
{
margin-bottom: 4px;
font-size: 1.3em;
font-weight: bold;
color: #0c419a;
}

p
{
margin-bottom: 7px;
font-size: 1.1em;
line-height: 1.4em;
}
/* == TREES ========================================= */
#wrapper
{
width: 750px;
margin: 0 auto;
padding: 0 10px;
text-align: left;
background: url(../images/wrapper-bg.gif) repeat-y right top #fff;
}

#logo-nav
{
float: left;
width: 338px;
background: url(../images/logo-nav-bg.gif) no-repeat;
}

#content
{
float: left;
width: 392px;
padding: 0 10px;
}

#copyright-etc
{
clear: both;
margin: 10px -10px 0 -10px;
padding: 8px 10px;
text-align: center;
color: #fff;
background: #082c68;
}

/* == MONKEYS ====================================== */
/* logo: */
#logo-nav #logo a
{
display: block;
text-indent: -10000px;
height: 222px;
}
#logo-nav #logo a:hover
{
background: none;
}

/* navigation: */
#logo-nav ul
{
margin: 3px 25px 0 3px;
font-family: arial;
font-size: 1.2em;
font-weight: bold;
}
#logo-nav ul li a
{
display: block;
padding: 8px 15px;
border-bottom: 1px solid #999;
}
#logo-nav ul li a:hover
{
text-decoration: none;
border-color: #0c419a;
background: #f3f3f3;
}
#logo-nav ul .hi a
{
background: #ffff99;
}
#logo-nav ul .hi a:hover
{
background: #ffff77;
}

#logo-nav ul .active
{
padding: 8px 15px;
background: #fff;
border-bottom: 1px solid #666;
}

/* adverts: */
#logo-nav #basis a
{
display: block;
margin: 5px 0;
height: 115px;
text-indent: -10000px;
background: url(../images/ad_basis.gif) no-repeat;
}
#logo-nav #beibl a
{
display: block;
margin: 5px 0;
height: 115px;
text-indent: -10000px;
background: url(../images/ad_beibl2.gif) no-repeat;
}
#logo-nav #basis_cym a
{
display: block;
margin: 5px 0;
height: 115px;
text-indent: -10000px;
background: url(../images/ad_basis_cym.gif) no-repeat;
}
#logo-nav #beibl_cym a
{
display: block;
margin: 5px 0;
height: 115px;
text-indent: -10000px;
background: url(../images/ad_beibl2_cym.gif) no-repeat;
}

/* page intro's: */
#content h2
{
margin-top: 60px;
}
#content .intro
{
font-size: 1.2em;
}
#content .intro strong
{
color: #ff6600;
}
#content ul
{
margin: 16px;
list-style-type: disc;
font-size: 1.1em;
}
#content ul li
{
margin: 4px 0;
line-height: 1.4em;
}

/* what's new list */
#content .whatsnew
{
margin: 20px 0;
}
#content .whatsnew dt
{
margin-bottom: 10px;
padding-bottom: 3px;
font-size: 1.5em;
font-weight: bold;
font-family: arial;
color: #0c419a;
border-bottom: 1px solid #999;
}
#content .whatsnew dd
{
margin-bottom: 10px;
padding-bottom: 3px;
border-bottom: 1px solid #999;
}
#content .whatsnew .date
{
font-weight: lighter;
color: #888;
}

/* who's who list */
#content .whoswho
{
margin: 20px 0;
}
#content .whoswho dt
{
margin-bottom: 10px;
padding-bottom: 3px;
font-size: 1.5em;
font-weight: bold;
font-family: arial;
color: #0c419a;
border-bottom: 1px solid #999;
}
#content .whoswho dd
{
margin-bottom: 10px;
padding-bottom: 3px;
}
#content .whoswho .date
{
font-weight: lighter;
color: #888;
}

/* links list */
#content #links
{
list-style-type: none;
margin: 0;
}
#content #links li
{
margin: 20px 0;
}
#content #links li img
{
float: left;
border: 1px solid #999;
padding: 8px;
margin: 0 10px 10px 0;
}
#content #links li p
{
display: inline;
}

/* songs list */
#content #songs
{
list-style-type: none;
margin: 0;
}
#content #songs li
{
margin: 20px 0;
padding-bottom: 6px;
border-bottom: 1px solid #999;
}
#content #songs li ul
{
margin: 0;
list-style-type: none;
}
#content #songs li ul li
{
display: inline;
margin-right: 10px;
padding-bottom: none;
border-bottom: none;
}
#content #songs li ul li .label
{
font-weight: bold;
}

/* songs navigaton alphabetical list: */
#content #songs-nav
{
margin: 15px 0 0 0;
padding-bottom: 15px;
list-style-type: none;
}
#content #songs-nav li
{
float: left;
margin: 5px;
margin-left: 0;
margin-top: 0;
}
#content #songs-nav li a
{
display: block;
padding: 5px 7px;
background: #f7f7f7;
border: 1px solid #999;
}
#content #songs-nav li a:hover
{
text-decoration: none;
border-color: #0c419a;
background: #f3f3f3;
}

/* hi-lighted content div: */
#content .hi
{
margin: 15px 0;
padding: 10px;
background: #ffff99;
border: 1px solid #666;
color: #333;
}

/* "this in english / cymraeg" buttons:*/
#content #this_cym a
{
display: block;
height: 35px;
margin-bottom: 20px;
text-indent: -10000px;
background: url(../images/this_cymraeg.gif) no-repeat;
}

#content #this_eng a
{
display: block;
height: 35px;
margin-bottom: 20px;
text-indent: -10000px;
background: url(../images/this_english.gif) no-repeat;
}

/* links in the copyright paragraph: */
#copyright-etc a
{
color: #fff;
}
#copyright-etc a:hover
{
background: none;
}

#splash
{
background: url(../images/splash-bg.gif) no-repeat top center #1C4196;
}
#splash ul
{
margin: 0 auto;
margin-top: 427px;
width: 322px;
}
#splash ul li
{
float: left;
margin-right: 7px;
}
#splash ul li a
{
display: block;
width: 154px;
height: 48px;
text-indent: -10000px;
}

/* == VINES ========================================= */
.clear
{
clear: both;
}

.accessibility
{
position: absolute;
left: -10000px;
}