/******************
HTML Tags
******************/

body
{
    font-size: 10pt;
    font-family: Arial, Helvetica, sans-serif;
    margin: 0px;
    line-height: 13pt;
    text-align: center;
    background-color: #ffffff;
}

html, body, form { height: 100%; }

#mainnav-container
{
width:1024px; height: 99%; text-align: -moz-center;	margin: 0 auto;
}

#maincontent
{
    position: absolute;
    left: auto;
    right:auto;
    height: 100%;
}

#footercontent
{
    position:relative;
    top:30px;
	font-size: 10px;
    font-family: Verdana,Arial,Sans-Serif;
    text-align:center;
	width: 100%;
    margin-left: auto ;
    margin-right: auto ;
}

#content p,#content-side p,table{
	margin:0px 0px 20px 0px;
	}

#content-side img{
	border:none;
	}

#breadcrumb-right label{
	display:none;
	}


/******************
FORM STYLES
******************/

#content-container form{
	margin:20px 0px;
	padding:0px 0px 0px 0px;
	}

#content-container fieldset{
	margin:10px 0px 10px 0px;
	padding:0px 10px 10px 15px;
	}

/* a nested fieldset */
#content-container fieldset fieldset{
	margin:15px 0px 5px 0px;
	padding:0px 5px 5px 5px;
	}

#content-container legend{
	margin-bottom:0px;
	padding:0px 10px 5px 5px;
	color:#666666;
	font-weight:bold;
	}

/* a nested legend */
#content-container fieldset fieldset legend{
	margin-bottom:0px;
	padding:0px;
	font-weight:normal;
	}

#content-container label{
	display:block;
	padding-top:8px;
	}

#breadcrumb-right form{
	margin:0px;
	padding:0px;
	text-align:center;
	}

#breadcrumb-right form fieldset{
	margin:0px;
	padding:0px;
	border:none;
	}

#breadcrumb-right form legend{
	display:none;
	}

.view {
	margin-left: auto;
	margin-right: auto;
	width: 786px;
	text-align: center;
}

.view .photo-frame {
	margin-left: auto;
	margin-right: auto;
}
/******************
LINKS
******************/

/* LINK VISTED HOVER ACTIVE selectors must remain in this order to work */
a:link{
	color:#0071BC;
	}

a:visited{
	color:#004EB7;
	}

a:hover{
	color:#999999;
	text-decoration:none;
	}

a:active{
	color:#B70000;
	}

/* LINK VISTED HOVER ACTIVE selectors must remain in this order to work */
#mainnav-container a:link{
	color:#FFFFFF;
	text-decoration:none;
	font-weight:bold;
	}

#mainnav-container a:visited{
	color:#FFFFFF;
	text-decoration:none;
	font-weight:bold;
	}

#mainnav-container a:hover{
	text-decoration:underline;
	}

#mainnav-container a:active{
	color:#CCCCCC;
	text-decoration:none;
	}

/* LINK VISTED HOVER ACTIVE selectors must remain in this order to work */
#breadcrumb-container a:link{
	color:#FFFFFF;
	text-decoration:underline;
	font-weight:bold;
	}

#breadcrumb-container a:visited{
	color:#FFFFFF;
	text-decoration:underline;
	font-weight:bold;
	}

#breadcrumb-container a:hover{
	text-decoration:none;
	}

#breadcrumb-container a:active{
	color:#CCCCCC;
	}

/******************
HEADINGS
******************/

h1 {
	font-size:1.3em;
	padding-top:4px;
	}

h2 {
	font-size:1.1em;
	}

h3 {
	font-size:1em;
	}
	
h4 {
	font-size:.9em;
	}
	
h5 {
	font-size:.8em;
	}
	
h6 {
	font-size:.75em;
	}
	
#three-column-container h2{
	margin:0px 0px 10px 0px;
	padding:0px;
		}

/******************
LAYOUT DIVS
******************/

#header-container{
	background:#6F0D0D;
	height:50px;
	color:#FFFFFF;
	font-size:1.8em;
	}

#header-container a{
	text-decoration:none;
	color:#FFFFFF;
	}

#header-name{
	float:left;
	width:50%;
	height:34px;
	padding:16px 10px 0px 4px;
	font-weight:bold;
	}

#header-slogan{
	margin:0px 44px 0px 50%;
	height:35px;
	padding:15px 0px 0px 0px;
	text-align:right;
	font-size:.75em;
	font-weight:normal;
	}

#mainnav-container
{
    background: #CC0000;
    color: #FFFFFF;
    border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
    height: 102px;
}

#mainnav{
	float:left;
	width:115px;
	text-align:right;
	padding:15px;
	height:102px;
	background: #CC0000;
	}

#mainnav-side
{
    float: right;
    width: 224px;
    padding: 0px 0px 0px 3px;
    border-left: 2px solid #FFFFFF;
    height: 134px;
    background-color: #000000;
    text-align: left;
    font-size: 20px;
    color: #FFFFFF;
}

#posterphoto
{
	margin:0px 15% 0px 145px;
	padding:0px;
    text-align: right;
    background: url(steam-logo.jpg) no-repeat;
    height: 134px;
    font-size: 20px;
    background-color: #CC0000;
    z-index: 999;
}

#breadcrumb-container{
	color:#FFFFFF;
	height:35px;
	padding:0px 44px;
	margin:0px;
	background:#C53333;
	}

#breadcrumb-left{
	float:left;
	width:70%;
	height:28px;
	padding:7px 0px 0px 0px;
	}

#breadcrumb-right{
	float:right;
	height:28px;
	width:155px;
	padding:7px 0px 0px 0px;
	border-left:1px solid #FFFFFF;
	border-right:1px solid #FFFFFF;
	background:#972727;
	}

#content-container{
	padding:10px 3% 0px 44px;
	}

#content{
	float:right;
	width:70%;
	}

#content-side{
	width:24%;
	}

#three-column-container{
	width:100%;
	margin:30px 0px;
	text-align:justify;
	}

#three-column-left{
	float:left;
	width:30%;
	}

#three-column-right{
	float:right;
	width:30%;
	}

#three-column-middle{
	width:30%;
	margin:0px 31% 0px 35%;
	}

#footer-container
{
    color: #FFFFFF;
    background: #000000 url(bg-footer-left.gif) repeat-y left;
    margin-top: 20px;
}

#footer-right{
	margin-left:31%;
	padding:1px 15px;
	border-left:1px solid #FFFFFF;
	background:url(bg-mainnav-right.gif) repeat-y right;
	}

/******************
Menu Items
******************/

#mainnav-container ul{
	margin:0px;
	padding:0px;
	}

#mainnav-container li{
	margin:0px;
	padding:0px;
	list-style:none;
	}

/******************
LISTS - IN THE CONTENT DIV
******************/

#content ul.list,#content ul.link-list-vertical{
	margin:10px 0px 20px 10px;
	padding:0px;
	}

#content ul.list li{
	list-style:none;
	padding:1px 0px 1px 12px;
	margin:0px;
	background:url(bullet.gif) no-repeat;
	background-position:0 .4em;
	}

#content ul.link-list-vertical li{
	list-style:none;
	margin:0px;
	}

#content ul.link-list-vertical li a:link{
	padding:1px 0px 1px 12px;
	background:url(bullet-link.gif) no-repeat;
	background-position:0 .4em;
	}

#content ul.link-list-vertical li a:visited{
	padding:1px 0px 1px 12px;
	background:url(bullet-link-visited.gif) no-repeat;
	background-position:0 .4em;
	}

#content ul.link-list-vertical li a:hover{
	padding:1px 0px 1px 12px;
	background:url(bullet-link-hover.gif) no-repeat;
	background-position:0 .4em;
	}

#content ul.link-list-vertical li a:active{
	padding:1px 0px 1px 12px;
	background:url(bullet-link-active.gif) no-repeat;
	background-position:0 .4em;
	}

/******************
LISTS - IN THE SIDE COLUMN
******************/

#content-side ul.list,#content-side ul.link-list-vertical{
	margin:10px 0px 20px 10px;
	padding:0px;
	}

#content-side ul.list li{
	list-style:none;
	padding:1px 0px 1px 12px;
	margin:0px;
	background:url(bullet.gif) no-repeat;
	background-position:0 .4em;
	}

#content-side ul.link-list-vertical li{
	list-style:none;
	margin:0px;
	}

#content-side ul.link-list-vertical li a:link{
	padding:1px 0px 1px 12px;
	background:url(bullet-link.gif) no-repeat;
	background-position:0 .4em;
	}

#content-side ul.link-list-vertical li a:visited{
	padding:1px 0px 1px 12px;
	background:url(bullet-link-visited.gif) no-repeat;
	background-position:0 .4em;
	}

#content-side ul.link-list-vertical li a:hover{
	padding:1px 0px 1px 12px;
	background:url(bullet-link-hover.gif) no-repeat;
	background-position:0 .4em;
	}

#content-side ul.link-list-vertical li a:active{
	padding:1px 0px 1px 12px;
	background:url(bullet-link-active.gif) no-repeat;
	background-position:0 .4em;
	}

/******************
TABLE STYLES
******************/

.table{
	width:100%;
	border:1px solid #C53333;
	}

.table td {
	padding:8px;
	border-left:1px solid #C53333;
	border-right:1px solid #C53333;
	}

thead th, tfoot th{
	background:#C53333;
	padding:8px;
	color:#FFFFFF;
	border-left:1px solid #C53333;
	border-right:1px solid #C53333;
	border-top:1px solid #C53333;
	border-bottom:1px solid #C53333;
	}

.table-row-1 td,.table-row-1 th{
	background:#F7E0E0;
	border:1px solid #C53333;
	}

.table-row-2 td,.table-row-2 th,thead{
	background:#F4F4F4;
	border:1px solid #C53333;
	}


/*******************
photo frames
********/
/* Photo Border for All Pages Except the Albums Page */

.photo-frame .topx-- {
	background-image: url(Images/frame-topx--.gif);
	background-repeat: no-repeat;
	width: auto;
	height: 4px;
	vertical-align: top;
}
.photo-frame .top-x- {
	background-image: url(Images/frame-top-x-.gif);
	background-repeat: repeat-x;
	width: auto;
	height: 4px;
}
.photo-frame .top--x {
	background-image: url(Images/frame-top--x.gif);
	background-repeat: no-repeat;
	width: auto;
	height: 4px;
	vertical-align: top;
}

.photo-frame .midx-- {
	background-image: url(Images/frame-midx--.gif);
	background-repeat: repeat-y;
	width: 4px;
	height: 100%;
}
.photo-frame .mid--x {
	background-image: url(Images/frame-mid--x.gif);
	background-repeat: repeat-y;
	width: 4px;
	height: 100%;
}

.photo-frame .botx-- {
	background-image: url(Images/frame-botx--.gif);
	background-repeat: no-repeat;
	width: 4px;
	height: 4px;
	vertical-align: top;
}
.photo-frame .bot-x- {
	background-image: url(Images/frame-bot-x-.gif);
	background-repeat: repeat-x;
	width: auto;
	height: 4px;
}
.photo-frame .bot--x {
	background-image: url(Images/frame-bot--x.gif);
	background-repeat: no-repeat;
	width: 4px;
	height: 4px;
	vertical-align: bottom;
}

/* Photo Border for the Album Page */

.album-frame .topx----,
.album-frame .top----x,
.album-frame .botx----,
.album-frame .bot----x {
	height: 14px;
	width: 14px;
}

.album-frame .top-x--- {
	background-image: url(images/album-tstretch.gif);
	background-repeat: repeat-x;
	text-align: left;
	height: 14px;
	width: auto;
}
.album-frame .top--x-- {
	background-image: url(images/album-tstretch.gif);
	background-repeat: repeat-x;
	height: 14px;
	width: auto;
}
.album-frame .top---x- {
	background-image: url(images/album-tstretch.gif);
	background-repeat: repeat-x;
	text-align: right;
	height: 14px;
	width: auto;
}

.album-frame .mtpx---- {
	background-image: url(images/album-lstretch.gif);
	background-repeat: repeat-y;
	vertical-align: top;
	height: auto;
	width: 14px;
}
.album-frame .mtp----x {
	background-image: url(images/album-rstretch.gif);
	background-repeat: repeat-y;
	vertical-align: top;
	height: auto;
	width: 14px;
}

.album-frame .midx---- {
	background-image: url(images/album-lstretch.gif);
	background-repeat: repeat-y;
	height: auto;
	width: 14px;
}
.album-frame .mid----x {
	background-image: url(images/album-rstretch.gif);
	background-repeat: repeat-y;
	height: auto;
	width: 14px;
}

.album-frame .mbtx---- {
	background-image: url(images/album-lstretch.gif);
	background-repeat: repeat-y;
	vertical-align: bottom;
	height: auto;
	width: 14px;
}
.album-frame .mbt----x {
	background-image: url(images/album-rstretch.gif);
	background-repeat: repeat-y;
	vertical-align: bottom;
	height: auto;
	width: 14px;
}

.album-frame .bot-x--- {
	background-image: url(images/album-bstretch.gif);
	background-repeat: repeat-x;
	text-align: right;
	height: 14px;
	width: auto;
}
.album-frame .bot--x-- {
	background-image: url(images/album-bstretch.gif);
	background-repeat: repeat-x;
	height: 14px;
	width: auto;
}
.album-frame .bot---x- {
	background-image: url(images/album-bstretch.gif);
	background-repeat: repeat-x;
	text-align: left;
	height: 14px;
	width: auto;
}

.buttonbar, .buttonbar-top {
	width: 686px;
	height: 36px;
	background-image: url(images/photonav.gif);
	background-repeat: no-repeat;
	margin-bottom: 5px;
	text-align: center;
}

/******************
CLASSES & TABLE STYLES
******************/

.button-big{
	margin-top:8px;
	}

img.photobig,img.photosmall{
	border:1px solid #A87171;
	padding:5px 5px 5px 5px;
	background:#EBE9E1;
}

img.photosmall{
	margin-bottom:2px;
    width: 192px;
    height: 128px;
	}

.searchbox{
	height:13px;
	margin:0px;
	padding:0px;
	width:6em;
	color:#666666;
	font:11px Verdana,Arial,Helvetica,sans-serif;
	}

.button-search{
	height:17px;
	margin:0px;
	padding:0px 1px;
	color:#000000;
	border:1px solid #000000;
	font:bold 10px Verdana,Arial,Helvetica,sans-serif;
	background:#FAEEEE;
	}

.separator-side-column{
	border-top:1px solid #D0D0BF;
	width:100%;
	height:2px;
	font-size:1px;
	background:transparent;
	}

.small-text{
	font-size:.8em;
	}

.none{
	display:none;
	}

.clear{
	clear:both;
	}