/* general html tag styles */
html, body
{
margin:0;
padding:0;
border:0;
}

body
{
background:#2a316e url(../graphics/bodybg.jpg);
background-repeat:repeat-x;
font-family:verdana, arial, sans-serif;
font-size:86%;
font-weight:normal;
text-align:left;
margin:5px 0;
color:#000;
}

p
{
text-align:left;
margin:5px 40px;
padding:0;
text-indent:15px;
line-height:normal;
}

p.noindent
{
line-height:normal;
text-indent:0;
}

p.attention
{
font-weight:bold;
text-align:center;
font-size:15px;
letter-spacing:1px;
text-indent:0;
line-height:normal;
}

h1, h2, h3
{
text-align:center;
margin:10px 45px;
}

h1
{
margin-top:15px;
font-family:verdana, arial, sans-serif;
font-size:25px;
}

h2
{font-size:20px;}

h2.impact
{
font-family:impact, verdana, sans-serif;
font-size:24px;
color:#2a316e;
letter-spacing:1.2;
}

h3
{font-size:18px;}

h3.img
{
font-weight:normal;
font-size:13px;
margin:5px auto;
text-align:center;
}

h3.alignleft
{
margin:5px 30px;
text-align:left;
}

h4
{
font-weight:normal;
text-align:left;
margin:5px 40px;
font-size:12px;
}

a, a:visited
{
color:#2a316e;
font-weight:bold;
text-decoration:none;
border-bottom:1px dotted #2a316e;
}

a:hover, a:active
{
color:#c20808;
border-bottom:1px dashed #c20808;
}

a.noborder, a:visited.noborder, a:hover.noborder, a:active.noborder
{
text-decoration:none;
border-bottom:0;
}

img
{border:0;}

img.left
{
float:left;
margin:10px 10px 10px 40px;
}

img.right
{
float:right;
margin:10px 40px 10px 10px;
}

/* list classes start here */

ul.listbox, ol.listbox
{
border:0;
margin:5px 30px 5px 50px;
}

ul.listbox li, ol.listbox li
{
list-style-image:url(../graphics/link.jpg);
padding:0 0 5px 5px;
font-size:14px;
line-height:1.3;
font-weight:normal;
}

ol.listbox li
{
list-style-image:none;
list-style-type:default;
font-weight:normal;
font-size:13px;
letter-spacing:1.2;
line-height:1.3;
}

ul.listbox ul, ol.listbox ol
{margin-left:0;}

ul.listbox ul li, ol.listbox ol li
{
font-weight:normal;
font-size:12px;
letter-spacing:1.2;
line-height:1.3;
padding:0 0 5px 5px;
}

ol.listbox ol li
{list-style-type:none;}

/ *text position styles start here */
.sub
{
vertical-align:sub;
font-weight:bold;
font-size:10px;
color:#c20808;
}

.clear
{clear:both;}

.center
{text-align:center;}

/* text formatting styles start here */
.bold
{font-weight:bold;}

.red
{color:#c20808;}

.blue
{color:#2a316e;}

.green
{color:#008b3c;}

.orange
{color:#e46b00;}

.gold
{color:#ffc601;}

.cap /* creates the large drop-cap first-letter in the paragraphs */
{
font-family:georgia, times new roman, serif;
font-size:35px;
color:#c20808; /*red */
font-weight:bold;
float:left;
height:35px;
line-height:35px;
margin-top:-2px;
margin-right:3px;
}

.cap2
{
font-family:georgia, times new roman, serif;
font-size:35px;
color:#2a316e;
font-weight:bold;
float:left;
height:35px;
line-height:35px;
margin-top:-2px;
margin-right:3px;
}

.hilite
{
background-color:#ffecb7;
font-weight:bold;
color:#8f1744;
}

/* layouts start here */
#wrapper
{
margin:0 auto;
width:796px;
background:#fff;
border:0;
}

#maincol
{
background-color:#fff;
border:0;
float:right;
display:inline;
position:relative;
width:630px;
}

#leftcol
{
background-color:#fff;
width:166px;
float:left;
position:relative;
}

#leftcol h3
{
text-align:center;
margin:10px auto;
}

/* menu tabs with selected items as a.classes */
.tabs
{
list-style:none;
padding:15px 0 11px 0;
margin:15px 10px 10px 0;
width:150px;
background:url(../graphics/vback.gif) repeat-y right bottom;
}

.tabs li
{
display:block;
margin:0 0 4px 19px;
}

.tabs li a
{
display:block;
width:130px;
height:26px;
text-decoration:none;
border-bottom:0;
background:url(../graphics/vtab.gif) left top;
font-size:12px;
text-decoration:none;
color:#fff;
font-family:verdana;
line-height:24px;
text-align:center;
border-right:1px solid #000;
}

.tabs li a:hover
{
background:url(../graphics/vtab.gif) left center;
color:#fff;
border-color:#000;
}

.tabs li a.current, .tabs li a.current,
.tabs li a:hover.current, .tabs li a:active.current
{
background:url(../graphics/vtab.gif) left bottom;
color:#000;
border-color:#000;
cursor:default;
}

/* fixes clearing of the floating elements on maincol and leftcol */

.clearfix:after /* :after is a pseudo-element that inserts something after an element.  So, after content: which is defined as "." it will clear the columns by displaying a "block of text that has a height of 0", clears any content that is floating, and is effectively hidden from view */
{
content: ".";
display:block;
height:0;
clear:both;
visibility:hidden;
}

.clearfix
{display:inline-table;}

/* Hides from IE-mac \*/
* html .clearfix
{height:1%;}

.clearfix
{display:block;}
/* End hide from IE-mac */


#header
{
display:block;
widthL796px;
height:250px;
border:0;
background:url(../graphics/halloffame_header_2010.jpg) #2a316e;
background-position:top center;
background-repeat:no-repeat;
margin:0 auto;
}

#footer
{
display:block;
width:796px;
height:50px;
clear:both;
background:#2a316e url(../graphics/footerbg.jpg);
border:0;
}

#footer p
{
color:#000;
text-align:center;
font-weight:bold;
font-size:11px;
color:#c20808;
margin:5px 20px;
line-height:normal;
}

#footer a, #footer a:visited
{
color:#275b1d;
text-decoration:none;
border-bottom:1px dashed #275b1d;
}

#footer a:hover, #footer a:active
{
color:#2a316e;
border-bottom:1px dotted #2a316e;
}

#footer a.noborder, #footer a:visited.noborder,
#footer a:hover.noborder, #footer a:active.noborder
{
text-decoration:none;
border-bottom:0;
}