﻿/*** The Essential Code ***/

body, p, a, td, label
{
    font-family: tahoma, arial, helvetica, sans-serif !important;
    font-size: small;
}
a
{
    color: #fff;
    font-size: 13px;
    text-decoration: none;
    font-weight: normal;
}
a:hover 
{
    /*background-color:#eee;*/
    text-decoration: underline;
}
a.iehideLink {
	font-size:11px;
	text-decoration:none;
	font-weight:normal;
	}
body
{
    margin: 0px;
    padding: 0px;
    color: #eee;
    background-color: #000;
}
h1,h2 {
	margin:0px 0px 15px 0px;
	padding:0px;
	font-size:28px;
	line-height:28px;
	font-weight:900;
	color:#eab200;
	}
h2
{
    font-size:18px;
    line-height:18px;
    color:#555;
}
h4
{
    text-align: left;
    font-size: 12px;
    line-height: 12px;
    font-weight: bold;
    border-bottom: thin solid #666;
    margin-bottom: 5px;
    padding-bottom: 5px;
}
.searchKeywords
{
display: none;
    border: solid thin #999;
    padding:5px;
	font-size:12px;
    color:#aaa;
    font-weight:normal;
}
hr
{
    color: #666;
    margin-bottom: 10px;
    margin-top: 10px;
}
p {
	font:11px/20px verdana, arial, helvetica, sans-serif;
	margin:0px 0px 16px 0px;
	padding:0px;
	}
#Content>p {margin:0px;}
#Content>p+p {text-indent:30px;}

#page
{
    width: 900px;
    text-align: left; 
    border-left: solid thin black;
    border-right: solid thin black;
}
#topMenu
{
    text-align: left;
    padding: 5px;
	padding-left: 30px;
    font-size: medium;
}
#topMenu ul
{
    margin:0;
    padding-top:2px;
    padding-bottom:2px;
    text-align: center;
}
#topMenu ul li
{
    display: inline;
}
#topMenu ul a
{
    font-size: medium;
    color: #ddd;
    margin: 0;
    padding: 5px 10px 5px 10px;
    text-decoration: none;
    letter-spacing: 1px;
}
#topMenu ul a:hover
{
    /*background: #ccc url("Images/nav-over.gif") repeat-x left top;*/
    color: #fff;
}

#Footer {	
	background: #000;
	border-top: solid thin #ff7f00;
	text-align: center;
	padding: 10px;
	color: #aaa;
	font-size: small;
	}
#Footer a
{
	font-size: small;
    color: #ff7f00;
}
#Header {	
	border-bottom: solid 1px black;
	padding: 5px;
	color: #ccc;
	letter-spacing: 1px;
    text-align: center;
	}
/* I've heard this called the "be nice to Opera 5" rule. Basically, it feeds correct 
length values to user agents that exhibit the parsing error exploited above yet get 
the CSS box model right and understand the CSS2 parent-child selector. ALWAYS include
a "be nice to Opera 5" rule every time you use the Tantek Celik hack (above). */
body>#Header {height:14px;}

#Content
{
    /*float:left;
    margin: 0px 190px 50px 10px;
    margin: 10px;*/
    padding: 10px;
}

#Menu 
{
	/*position:absolute;
	top:100px;
	right:20px;*/
	text-align: right;
	width:220px;
	padding:10px 10px 10px 10px;
	line-height:17px;
/* Again, the ugly brilliant hack. */
	voice-family: "\"}\"";
	voice-family:inherit;
	width:190px;
	}
/* Again, "be nice to Opera 5". */
body>#Menu {width:150px;}

.menuFloat
{
    float:left;
    padding: 0 15px 0 15px;
}
#menuTop
{
    margin: 0;
    padding-top: 10px;
    background-color: #222;
    border-bottom: solid 1px #000;
}
#announce
{
    margin: 0;
    padding: 10px;
    background-color: #555;
    border-bottom: solid 1px #000;
    display: none;
}
.rightMargin
{
    margin: 0px 210px 50px 10px;
}

.helpBlurb
{
    padding-right: 5px;
    padding-left: 5px;
    font-size: x-small;
    padding-bottom: 3px;
    color: black;
    padding-top: 3px;
    background-color: #ff7f00;
    margin: 2px;
}

/* ========================
THUMBNAIL BOXES STYLE
=========================*/
.thmBox, .thmBoxRecent
{
    text-align: center;
    /*border: solid 1px #555;*/
    margin: 2px; 
        
    display: inline;
    float: left;
    clear: none;
    position: static;
    overflow: hidden;
}
.thmBoxRecent
{
    /*background-color: #ddd;
    border-top: solid 2px #eab200;
    margin-bottom: 1px;*/
    
}
.menuShading
{
    position:absolute;
    top:3px;
    background-color:#000;
    width:100%;
    height:100%;
    filter:alpha(opacity=75);
    -moz-opacity:.75;
    opacity:.75;
    z-index:100;
}
.thmFunctionsBox
{
    position: absolute;
    /*top: 12px;*/
    left: 0px;
    padding-right: 2px;
    padding-left: 2px;
    padding-bottom: 0px;
    padding-top: 0px;
    text-align: left;
    z-index: 1000;
    visibility: hidden;
    display: none;
    border: 0px;
}    
    .thmFunctionsBox .menuRow
    {
         position:relative;
         z-index:200;
    }
    .thmFunctionsBox .menuItems
    {
        display: none;        
    }
    .thmFunctionsBox:hover .menuItems
    {
        display: block;        
    }
    .thmFunctionsBox img
    {
        position: relative;
        top: 4px;
    }
    .thmBox:hover .thmFunctionsBox, .thmBoxRecent:hover .thmFunctionsBox
    {
        visibility: visible;
        display: block;
    }
.thmFunctionsBar
{
    position: absolute;
    top: 12px;
    left: 10px;
    padding-right: 2px;
    padding-left: 2px;
    padding-bottom: 0px;
    padding-top: 0px;
    text-align: center;
    z-index: 1000;
    visibility: hidden;
    display: none;
    border: 0px;
}
    .thmBox:hover .thmFunctionsBar, .thmBoxRecent:hover .thmFunctionsBar
    {
        visibility: visible;
        display: block;
    }
    .thmImageBar
    {
        padding: 5px;
        text-align: center;
        vertical-align: bottom;
    }
    .thmImageBar img
    {
        /*border: solid 2px white;*/
    }
    .thmInfoKeywordsBar
    {
        font-size: x-small;
        padding-top: 5px;
        padding-bottom: 1px;
        padding-right: 10px;
        padding-left: 10px;
        vertical-align: middle;
        text-align: left;
        height: 30px;
    }
    .thmInfoBar
    {
        font-size:x-small;
        padding-top: 3px;
        padding-right: 10px;
        padding-left: 10px;
    }
    .thmInfoBarLight
    {
        font-size:x-small;
        padding-top: 3px;
        padding-right: 10px;
        padding-left: 10px;
        color: #aaa;
    }
    .thmInfoBarBold
    {
        font-weight: bold;
        font-size: x-small;
        padding-top: 1px;
        padding-right: 10px;
        padding-left: 10px;
    }
/* ========================
BASIC STYLE
=========================*/
img
{
    border: 0;
    border-color: Black;
    
}
a.minorLink
{
    color: #ccc;
    text-decoration: none;
    font-family: georgia, arial, helvetica, sans-serif;
    font-weight: normal;
}
a.minorLink:link {color:#ccc;}
a.minorLink:visited {color:#ccc;}
a.minorLink:hover 
{
    text-decoration: underline;
}




.dialogOuterTable
{
    border-right: black thin solid;
    padding-right: 0px;
    border-top: black thin solid;
    padding-left: 0px;
    padding-bottom: 0px;
    border-left: black thin solid;
    padding-top: 0px;
    border-bottom: black thin solid;
    margin: 10px;
}
.dialogTable
{
    font-size: 10pt;
    margin-top: 0px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    padding-top: 0px;
}
.dialogHeader
{
    font-size: 12pt;
    font-weight: bold;
    background-color: black;
    color: whitesmoke;
}
.dialogSubHeader
{
    font-size: 8pt;
    background-color: gray;
    color: whitesmoke;
}
.dialogItemName
{
    font-size: 10pt;
    text-align: right;
    vertical-align: top;
}
.dialogItem
{
    font-size: 10pt;
}

/*========================
OVERVIEW PAGE STYLES
=================*/
/* Content Image Lead */
.contentImageLead
{
    margin: 0 auto;
    width: 700px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    padding-top: 0px;
    text-align: center;
}
        .contentImageLead .mainImage img
        {
            margin: 2px 0px 0px 0px;
            border: solid 4px black;
        }
        .contentImageLead small
        {
            font-size: small;
            font-style: italic;
            color: #666;
        }
        .contentImageLead h2, .contentImageLead h2 a
        {
            text-align: center;
            font-size: large;
            color: #333;
            letter-spacing: 3px;
            margin: 2px 0px 5px 0px;
            text-decoration: none;
            font-weight: normal;
        }
        .contentImageLead h2
        {
        }
        .contentImageLead p label
        {
            float: left;
            font-weight: bold;
            font-variant: small-caps;
            padding-right: 15px;
            font-size: medium;
        }
        .contentImageLead p
        {
            text-align: left;
            font-size: medium;
            margin: 0px 0px 0px 0px;
            color: #999;
        }

/* Content Image Feature/Recent */
.contentImageArea
{
    padding: 0 10px 0 10px;
}
.contentImageRecentSet
{
    width: 380px;    
    padding-left: 10px;
    float:left;
}
.contentImageFeatureSet
{
    text-align: right;
    padding-right: 10px;
    float:right;
}
        .contentImageFeatureSet h2, .contentImageRecentSet h2
        {
            font-weight: bold;
            font-size: large;
            letter-spacing: 3px;
            margin: 2px 0px 5px 0px;
            /*border-bottom: 1px solid #ccc;*/
            color: #999;
            text-align: center;
        }
        .contentImageFeature
        {
            text-align: center;
            width: 270px;
            float:none;
            display: block;
            margin: 5px;
        }
        .contentImageRecent
        {
            margin: 5px;
        }
        .contentImageFeature img
        {
            margin: 2px 0px 5px 0px;
            border: solid 1px black;
        }
        .contentImageFeature small, .contentImageRecent small
        {
            font-style: italic;
            text-align: left;
            white-space: nowrap;
            color: #666;
        }
        .contentImageFeature h2, .contentImageRecent h2
        {
            display:none;
            margin: 2px 0px 0px 0px;
            font-size: small;
        }
        .contentImageFeature label a, .contentImageRecent label a
        {
            font-size: small;
        }
        .contentImageFeature p, .contentImageRecent p
        {
            text-align: left;
            margin: 0px;
            padding: 0px;
            font-size: small;
            color: #aaa;
        }
        /* Content Image Recent */
        .contentImageRecentSet h2
        {
            text-align:left;
        }
        .contentImageRecent img
        {
            margin: 0px 0px 5px 0px;
            border: solid 1px black;
            clear: left;
            float: left;
        }
        .contentImageRecent h2
        {
            float:left;
            text-align: left;
            padding-left: 5px;
        }
        .contentImageRecent p
        {
            float: left;
            margin: 0px 0px 0px 0px;
            padding-left: 5px;
            width: 180px;
            border-top: solid 1px #000;
        }
        .contentImageFeature p
        {
            text-align:center;
        }
/*========================
END OVERVIEW PAGE STYLES
=================*/


.rating 
{
    position: relative;
    left: 70px;
    top:2px;
    display:block;
}
.ratingStar {
    background-repeat:no-repeat;
    cursor:pointer;
    display:block;
    font-size:0pt;
    height:12px;
    margin:0px;
    padding:0px;
    width:13px;
}
.filledRatingStar {
    background-image:url(/images/icons/FilledStar_dark.png);
}
.emptyRatingStar {
    background-image:url(/images/icons/EmptyStar_dark.png);
}
.savedRatingStar {
    background-image:url(/images/icons/SavedStar_dark.png);
}
