body
{
     background-color: #000; font-size: 76%;
     font-family: Garamond, "Bitstream Vera Sans", Verdana, sans-serif;
     margin: 0; padding: 0 0 30px; text-align: center;
}
#end
{
     background-color: #000;
}

/* Major Divs */

#sleeve
{
     background-color: transparent; 
     width: 800px; margin: 0 auto 0 auto
}
#legend
{
     padding: 0 30px; text-align: left
}

/* The Legend page styles */

#directions
{
     font-size: 2.8em; font-variant: small-caps;
     color: #bbb; letter-spacing: .1em;
     margin: 0; 
}
#legend ul
{
     list-style-type: square; width: 75%;
     font-size: 1.2em; font-weight: bold; 
}
#legend li
{
     line-height: 2; color: #bbb;
     letter-spacing: .1em; margin-bottom: 10px;
     padding-left: 20px
}
.link
{
     color: #fff;
     border-bottom: 2px solid #333
}
.visited
{
     color: #666;
     border-bottom: 2px solid #ddd
}
#biggie
{
     font-size: 1.3em; text-align: left;
     font-variant: small-caps
}

/* Header Styles */

#rumble
{
     text-align: left; background-color: #252525;
     font-size: .9em; font-variant: small-caps;
     margin: 0 0 50px; padding: 10px 30px;
     letter-spacing: .3em; font-weight: normal;
     border-bottom: 0px solid #333;
}
#rumble a:link, #rumble a:visited
{
     color: #ddd; border-left: 10px solid #bbb;
     text-decoration: none; padding-left: 10px
}
#rumble a:hover
{
     color: #fff; border-left: 10px solid #fc0;
     text-decoration: none
}

/* Paragraph Styles */

p
{
     font-size: 1.2em; border: 0px solid #fff;
     margin: 0 30px; color: #bbb;
     font-weight: bold; letter-spacing: .2em;
     word-spacing: .05em; text-align: right;
     font-family: Garamond, "Palatino Linotype", serif;
     line-height: 1.6
}
.credits
{
     font-size: 1em; letter-spacing: .1em;
     line-height: 1.6; color: #fff; font-weight: normal;
     margin-top: 90px; border-right: 20px solid #bbb;
     padding-right: 20px; font-family: garamond;
     word-spacing: .01em; font-variant: small-caps
}
.x
{
     margin-top: 30px
}
.credits:hover
{
     border-color: #fc0
}
.credits a
{
     font-weight: normal
}
p a, li a
{
     text-decoration: none;
}
p a:link, li a:link
{
     color: #fff;
     border-bottom: 2px solid #333
}
p a:visited, li a:visited
{
     color: #666;
     border-bottom: 2px solid #ddd
}
p a:hover, li a:hover
{
     color: #fc0; background-color: #252525;
     border-bottom: 2px solid #333
}
#derangement
{
     margin-left: 405px
}
#apocalypse
{
     margin-right: 405px
}
#confusion
{
     margin-left: 285px
}
#region
{
     margin-right: 405px
}
#tears
{
     margin-left: 405px
}
#rhythm
{
     margin-right: 405px
}
.do
{
     margin-left: 260px
}


/* Image Styles */

img
{ 
     border: 4px solid #252525; 
     vertical-align: bottom; position: relative;
     margin: 0 30px; float: left
}
img:hover
{
     border: 4px solid #333
}

/* Index page styles */

#fraction
{
     font-size: 3.8em; letter-spacing: .1em;
     color: #bbb; margin: 200px auto 0 auto;
     font-variant: small-caps; 
}
#fraction a
{
     border-bottom: 1px dotted #bbb; 
     text-decoration: none; color: #bbb
}
#fraction[title]:after{
/*Workaround for Gecko*/
	content: "";
}

#fraction[title]:hover:after{
/*Shows the value of the title attribute when hovered*/
	content: " (" attr(title) ")";
        cursor: auto; 
}