/* CSS Document */
/*------------------------------------------------------
G L O B A L  E L E M E N T S
------------------------------------------------------*/

* {
	margin: 0;
	padding: 0;
}
body {
	margin: 0;
	padding: 0;
	background-color:#000;
	color: #FFFFFF;
}
a {
	color:#4F7B8F;
}
a:hover {
	color:#3C93BC;
}
h2 span {
	 color: #FFCC33;
}
h4 { font-size: 14px; color: #c5c5c5; text-decoration: none; font-weight: normal;}
div#box{width: 25em;padding: 30px  0;margin:0 auto;
    text-align:left;background: #9CC0FF url(gradient.png) repeat-x 0 -5px}
h1{font: lighter 200% "Trebuchet MS",Arial sans-serif;color: #303F6E}
h1,p{margin:0 20px}
ol{margin:10px 40px;padding:0}
ol li{margin:0;padding:0}
/*------------------------------------------------------
D I V I D E R S <Div>
------------------------------------------------------*/
#main{
font-size:16px;
padding:5px;
padding-top:0;
}
#pageHeader {
	margin: 0 0 0 0;
	background-color: #ffffff;
	background:  url(page_header.png) no-repeat;
}

#container {
	margin: 20px auto;
	font-family: Georgia, "Times New Roman", Times, serif, "Trebuchet MS", Arial, Verdana, sans-serif;
	font-size: 16px;
	color: #000000;
	text-align:center;
	font: 12px arial;
	padding:5px;
}
#supporting_container{
	width: 100%;
	background-color: #ffffff;
	padding-bottom:10px;
  min-height: 400px;
	/*background-image: url(background_body.png);
	background-repeat: no-repeat;
	background-position: 180px 0px;*/
}
#pageSummary{
	color: FFFFFF;
	margin-left: 40px;
	margin-bottom: 20px;
	margin-right: 40px;
	text-align: justify;
}
#list {
	font-size: 14px;
	position: absolute;
	left: 1px;
}
#list h3 span{
	text-decoration: underline;

}
#list li {
	text-decoration: underline;
	font: bold;
}
#list ul {
	margin: 0 0 10px 0;
	text-indent: 0px;
}
#indexPage{
	position:absolute;
	bottom:1px;
	right:1px;
}
#rtColumn{
	position: absolute;
	width: 500px;
	left: 300px;
	align: right;
}
#rtColumn2{
	position: absolute;
	width: 800px;
	left: 300px;
}
#ltColumn{
	position: absolute;
	width: 400px;
	left: 1px;
}
#list1
#list2

/*------------------------------------------------------
C L A S S E S -<p><td>
------------------------------------------------------*/

.paraHeader{
	 color: #FFCC33;
}
.p1{
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 0px;
}
.p2{
	margin-bottom: 23px;
}
.p3{
	text-indent: 20px;
}
.p4{
	text-indent: 50px;
}
.link{
	margin-top: 10px;
}
.end {
	margin-top: 30px;
}
.gameholder{
	position:relative;
	height: 22px;
	width: 800px;
	}
.gamethumb{
	position:absolute;
	top:1px;
	height:80px;
	width: 80px;
}
.gamethumb img {
	height: 60px;
	width: 60px;
}
.gametitle{
	position:absolute;
	top:1px;
	height: 20px;
	width: 600px;
	font-size:18px;
	text-decoration:none;
}
.gametitle span{font-size:12px;}
.gamedescr{
	position: absolute;
	top: 40px;
	left: 100px;
	width: 400px;
	height: 60px;
}
#prevbtn{
	position: absolute;
	top: 80px;
	left: 450px;
	height: 20px;
	width: 100px;
	text-align: left;
	}
#nextbtn{
	position: absolute;
	top: 80px;
	left: 450px;
	height: 20px;
	width: 100px;
	text-align: right;
	}
#chooser{
	position: absolute;
	top: 80px;
	left: 450px;
	height: 500px;
	width: 500px;
	text-align: center;
}

.games {
	background-color:#FFFFFF;
}
.games img{
margin:2px;
height:60px;
}

#nav li a{}
#nav, #nav ul {
	padding: 0;
	margin: 0;
	list-style: none;
}
#nav li a{
display: block;
	width: 16em;
}

#nav li ul a {
	display: block;
	width: 16em;
	padding-top:5px;
	padding-bottom:5px;
	font-weight:normal;
	line-height:1em;
}

#nav li {
	float: left;
	width: 16em;
}
#nav li ul {
	position: absolute;
	width: 16em;
	left: -999em;

}

#nav li:hover ul {
	left: auto;
	margin: -1.7em 0 0 10em;
	background-color:#000000;
}
#nav li:hover ul, #nav li.sfhover ul {
	left: auto;
	margin: -1.7em 0 0 10em;
	background-color:#6C7B8B;

}

#displaybox {
	z-index: 10000;
	filter: alpha(opacity=50); /*older IE*/
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /* IE */
	-moz-opacity: .50; /*older Mozilla*/
	-khtml-opacity: 0.5;   /*older Safari*/
	opacity: 0.5;   /*supported by current Mozilla, Safari, and Opera*/
	background-color:#000000;
	position:fixed; top:0px; left:0px; width:100%; height:100%; text-align:center; vertical-align:middle;
	display:none;
}
#displaytext {
	z-index: 10001;
	filter: alpha(opacity=100); /*older IE*/
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); /* IE */
	-moz-opacity: 1; /*older Mozilla*/
	-khtml-opacity: 1;   /*older Safari*/
	opacity: 1;   /*supported by current Mozilla, Safari, and Opera*/
	position:fixed; top:0px; left:0px; width:100%; height:100%; text-align:center; vertical-align:middle;
	display:none;
}
#displaybox.selected, #displaytext.selected{display:block}

#menu_holder{
	display:inline-block; padding: 0px; margin:0px; height: 160px; background-color: #ffffff;
}
#menu{
	height: 125px; width: 17em; background-color: #ffffff;
}
.menu{
	line-height:2.5em;
	list-style-type: none;
	text-align:center;
	text-decoration:none;
	color:#FF6699;
	cursor:pointer
}
.menu a{text-decoration: none}
.menu a:hover{color:#000000;}

.menu:hover{
	background-color:#FFB6C1;
	color:#000000;
	font-weight:bold;
}
.menu.selected{
	line-height:2.5em;
	list-style-type: none;
	text-align:center;
	border: 1px solid #CCCCCC;
	background-color: #E8E1DF;
	text-decoration:none;
	font-weight:bold;
	color:#000000;
}

.menu.selected:hover{
	background-color:#D7CECC;
	color:#000000;
}

#footer_holder{}
.footer{padding-top:5px; padding-bottom:5px; background-color: #8B7D7B; text-align:center}
.footer a{color:#FFFFFF; text-decoration:none; font-size:10px;}
.footer a:hover{color:#000000; text-decoration:none; font-size:10px;}

#webdesign .page{background-color:#FFF}

.page{text-align: center; padding: 10px; padding-top:0; background-color: #ffffff; background-color:#000;}
.page .page_title{font-weight: bold; font-size: 12px; letter-spacing:1em; padding:5px; color:#fff}
.page.selected{display:block}

.web_item{display:inline-block; padding:10px; max-width:140px;}
.web_item a{text-decoration:none}
.web_item img{max-height:100px; border:0; max-width:140px}

.item_holder{font-size: 16px; text-align: left; display:none;}
.item_holder h3{background-color:#D7CECC; padding:5px; padding-bottom:15px}
.item_holder .item{padding:10px; margin-top:-10px; background-color:#fff; border:2px solid #D7CECC;}
.item_holder .item.image_only{text-align:center; background-color:#000; border-color:#000 }
.item_holder .item.image_only img{max-width:600px; max-height:600px;}
.item_holder .item.title_only{text-align:center;background-color:#000;}
.item_holder .item .details{margin-bottom:10px;padding-left:20px; color:#333;}
.item_holder .item img{display:inline-block; max-width:400px; max-height:400px}
.item_holder .item span{font-size:10px; color:#999}
.item_holder .item p{display:inline-block; max-width:400px; vertical-align:top; margin:0 }
.item_holder.selected{display:block}
.item_holder .images{overflow:hidden; height:200px; text-align:center}

.interest_holder{display:inline-block; text-align: center}
.interest_holder img{max-width:250px;  max-height: 250px;}

.thumbnails_container{overflow:hidden; padding-top:5px; padding-left:60px; padding-right:50px; position:relative; text-align:center; background-color:#8B7D7B; height:58px; margin-bottom:2px;}

.right_thumbs{ margin-top:-6px; margin-left:-3px;background-color:#fff; line-height:50px; height:50px; width:50px; text-align:center; font-weight:bold; cursor:pointer; border:2px solid #000;}
.left_thumbs{ margin-top:-6px; margin-left:-3px;background-color:#fff; line-height:50px; height:50; width:50px; text-align:center; font-weight:bold; cursor:pointer; border:2px solid #000;}
.right_thumbs_holder {position:absolute; cursor:pointer;padding:2px; padding-top:5px; background-color:#8B7D7B; margin-bottom:10px; right:5px; top:5px;}
.left_thumbs_holder {position:absolute; cursor:pointer;padding:2px; padding-top:5px; background-color:#8B7D7B; margin-bottom:10px; left:5px; top:5px;}
.right_thumbs_holder:hover, .left_thumbs_holder:hover{background-color:#000}


.thumb_holder.selected {cursor:pointer;}
.thumb_holder.selected .thumb{border:2px solid #fff;}
.thumb_holder.selected .thumb_shadow{background-color:#fff}
.thumb_holder.selected:hover .thumb_shadow{background-color:#fff}
.thumb{height:50px; width:50px; position:absolute; top:0px; left:0px; background-position:30% 40%; border:2px solid #000;}
.thumb_shadow{width:50px; height:50px; bottom:0px; right:5px; position:absolute}
.thumb_holder{display:inline-block; position:relative; cursor:pointer;padding:1px; width:57px; height:52px; margin-bottom:10px; margin-right:0px; margin-left:0px;}
.thumb_holder:hover .thumb_shadow{background-color:#000}

#supporting_container .featured{
  width:200px;
  height: 210px;
  text-align: center;
  display:inline-block;
  vertical-align:middle;

}
#supporting_container .featured img{max-height: 180px; max-width: 190px}

#feature_footer .featured{width:100px; text-align: center; display:inline-block;}
#feature_footer .featured img{max-height: 100px; max-width: 100px}
