/* DOCUMENT INFORMATION ------------------------------------
TITLE:			x2
LAST UPDATED:	March 2010
AUTHOR:			Ed Fryer
NOTES:			x2 Stylesheet

-------------------------------------------------------------*/

/*----------COMMON----------*/

html {
     overflow: -moz-scrollbars-vertical;
}


body {
	background: #fff url(../images/main-bk.gif) repeat-x;
}

a, a:visited, a:hover {
	font-weight:bold;
	color:#2c6ea7;
}

p {
	font-size:13px;
	color:#363636;
	line-height:22px;
	padding-bottom:10px;
}

h2 {
	font-size:16px;
	font-weight:bold;
}

h2 span {
	font-size:11px;
	color:#2c6ea7;
}

.container {
	width: 975px;
	margin: 0 auto;
	position:relative;
}

.main {
	
}

.decoration {
	width:277px;
	height:281px;
	position:absolute;
	top:220px;
	left:0px;
	z-index:0;
	background:url(../images/decoration.gif) no-repeat;
}

.content p, .content a, .content li, .content a {
	font-size: 13px;
}

h1.title {
	width:100%;
	height:35px;
	overflow:hidden;
	line-height:200px;
	font-size:1px;
	color:#fff;
}

/*----------HEADER----------*/

.header {
	width:100%;
	height:130px;
	float:left;
}

	.header .headerNav {
		float:right;
		padding-top:5px;
	}

		.header .headerNav li {
			float:left;
			color:#6b6b6b;
			font-size:10px;
			margin:1px;
		}
	
			.header .headerNav a {
				color:#6b6b6b;
				font-size:10px;
			}
			
	.header .logo {
		display:block;
		width:164px;
		height:130px;
		margin-left:15px;
		background:url(../images/logo.gif) no-repeat;
	}
	
/*----------NAV----------*/

.mainNav {
	float:left;
	width:100%;
	height:60px;
	background:url(../images/nav-bk.gif) no-repeat center center;	
}

	.mainNav ul {
		float:left;
		height:40px;
		width:99%;
		margin-left:5px;
	}
			
		.mainNav ul li.spacer {
			float:left;
			width:9px;
			height:40px;
			background:url(../images/spacer.gif) no-repeat;
		}
		
		.mainNav ul li .spacer {
			float:left;
			width:9px;
			height:40px;
			background:url(../images/spacer.gif) no-repeat;
		}
		
		.mainNav ul li {
			float:left;	
		}
				
		.mainNav ul li.contactLi {
			float:right;
			width:55px;
			margin-right:20px;
		}
		
		.mainNav ul li.goRight {
			float:right;	
		}
		
			.mainNav ul li a {
				display:block;
				height:38px;
				float:left;
				padding:0 10px 0 10px;	
			}
			
			.mainNav ul li a.home {
				width:40px;
				background:url(../images/home-off.gif) no-repeat bottom center;	
			}
			
			.mainNav ul li a.home:hover, .mainNav ul li.selected a.home {
				background:url(../images/home-on.gif) no-repeat bottom center;	
			}
			
			.mainNav ul li a.games {
				width:78px;
				background:url(../images/games-off.gif) no-repeat bottom center;	
			}
			
			.mainNav ul li a.games:hover, .mainNav ul li.selected a.games {
				background:url(../images/games-on.gif) no-repeat bottom center;	
			}
			
			.mainNav ul li a.news {
				width:38px;
				background:url(../images/news-off.gif) no-repeat bottom center;	
			}
			
			.mainNav ul li a.news:hover, .mainNav ul li.selected a.news {
				background:url(../images/news-on.gif) no-repeat bottom center;	
			}
			
			.mainNav ul li a.help {
				width:31px;
				background:url(../images/help-off.gif) no-repeat bottom center;	
			}
			
			.mainNav ul li a.help:hover, .mainNav ul li.selected a.help {
				background:url(../images/help-on.gif) no-repeat bottom center;	
			}
			
			.mainNav ul li a.contact {
				width:55px;
				background:url(../images/contact-off.gif) no-repeat bottom center;	
			}
			
			.mainNav ul li a.contact:hover, .mainNav ul li.selected a.contact {
				background:url(../images/contact-on.gif) no-repeat bottom center;	
			}
									
			.mainNav ul li.hasSubNav {
				-position:relative;	
			}
			
			.mainNav ul li .subNav, .mainNav ul li .subNavHelp {
				display:none;
				position:absolute;
				top:168px;
				left:63px;	
				background:#ecebeb;
				width:200px;
				z-index:50;
				border:2px solid #2c6ea7;
				border-top:1px solid #222222;
				height:auto;
			}
			
			.mainNav ul li .subNavHelp {
				left:238px;	
			}
			
				.subNav li, .subNavHelp li {
					width:96%;
				}
				
					.mainNav .subNav li a, .mainNav .subNavHelp li a {
						display:block;
						color:#30302f;	
						height:24px;
						width:96%;
						background:url(../images/subnav-a-bk.gif) no-repeat;
						line-height:20px;
						padding-right:0px;
					}
					
					.mainNav .subNav li a:hover, .mainNav .subNavHelp li a:hover {
						color:#2c6ea7;
					}
			
	.breadCrumbs li {
		float:left;	
		font-size:11px;	
		padding:2px;
	}
	
	 .breadCrumbs ul li a {
		width:auto;
		height:auto;
		padding:0px; 	
	}
	
/*----------FEATURE----------*/
	
	
.feature {
	float:left;
	width:453px;
	height:319px;
	position:relative;
	margin-top:10px;
	left:-10px;	
}

#Portrait {
	width:220px;
	margin:10px 30px 0px 20px;
}

	.featureMask {
		position:absolute;
		z-index:20;
		top:0px;
		left:0px;
		background:url(../images/featured-pod.png) no-repeat;
		width:453px;
		height:319px;			
	}
	
	#Portrait .featureMask {
		background:url(../images/featured-pod-portrait.png) no-repeat;
		width:220px;
	}
	
	.featureItems, .googleMap {
		width:420px;
		height:285px;
		background:#878787 url(../images/feature-loader.gif) no-repeat center center;
		position:relative;
		float:left;	
		margin:15px 0 0 15px;
		overflow:hidden;
	}
	
	#Portrait .featureItems {
		width:196px;	
	}
		
		.featureItems li {
			width:430px;
			height:285px;	
		}
		
		#Portrait .featureItems li {
			width:196px;
		}
		
			.featureMask h2 {
				position:absolute;
				z-index:90;
				top:32px;
				right:35px;	
				color:#fff;	
			}
			
			.featureItems li h2 {
				display:none;	
			}
			
/*----------CONTENT----------*/
		
.welcome {
	width:520px;
	height:285px;
	float:left;	
	margin:35px 0 0 0px;
	color:#fff;
}

#Portrait + .welcome {
	width:705px;	
}

	.welcome .banner {
		height:60px;
		width:335px;
		float:left;
	}
	
	.welcome .buyNow {
		float:right;
		width:150px;
		height:55px;
		margin-top:2px;
	}
	
		.welcome .buyNow a {
			display:block;
			width:150px;
			height:55px;
			background:url(../images/app-store.gif) no-repeat;
		}
	
	.welcome h1 {
		font-weight:bold;
		font-size:24px;
		padding-bottom:10px;	
	}
	
	.welcome p {
		color:#fff;	
	}
	
	.welcome h1 + p {
		font-weight:bold;	
	}

.pod {
	position:relative;
	padding-bottom:10px;
}
	
.greyPod {
	float:left;	
	margin-top:10px;
	background:#ebebeb;
}

.ourGames {
	width:455px;	
}

	.ourGames h1 {
		background:url(../images/our-games-title.gif) no-repeat;	
	}
		
	.game {
		padding:10px;
	}
	
		.gamePic {
			float:left;
			width:96px;
			height:96px;
			position:relative;
			overflow:hidden;
			background:#878787 url(../images/feature-loader.gif) no-repeat center center;
		}
		
			.gamePicMask {
				position:absolute;
				top:0px;
				left:0px;
				width:96px;
				height:96px;
				background:url(../images/game-pic-mask.png) no-repeat;
			}
					
		.gameInfo {
			padding:0 0 0 10px;	
			float:left;
			width:320px;
		}
			.gameInfo h2 a {
				color: #000;
			}
		
	.greyPod .divider {
		width:100%;
		height:17px;
		float:left;
		background:url(../images/grey-divider.gif) no-repeat center center;
	}
	
	.greyPod .podBot {
		width:100%;
		float:left;
		height:9px;
		background:url(../images/game-pod-bot.gif) no-repeat;
		position:absolute;
		bottom:0px;	
		left:0px;
	}
	
.latestNews {
	width:310px;
	margin-left:22px;
}

	.latestNews h1 {
		background:url(../images/latest-news-title.gif) no-repeat;	
	}
	
	.latestNews .newsItem {
		margin:10px 10px 0 10px;
		float:left;	
	}
	
.address {
	width:310px;
	margin-left:22px;
}

	.address h1 {
		background:url(../images/address-title.gif) no-repeat;	
	}
	
	.greyPod .dividerSmall {
		width:100%;
		height:17px;
		float:left;
		background:url(../images/grey-divider-small.gif) no-repeat center center;	
	}
	
	.greyPod .dividerLarge {
		width:100%;
		height:17px;
		float:left;
		background:url(../images/grey-divider-large.gif) no-repeat center center;	
	}
	
	.greyPod .podBotSmall {
		width:100%;
		height:8px;
		background:url(../images/news-pod-bot.gif) no-repeat;
		float:left;
		position:absolute;
		bottom:0px;	
		left:0px;
	}
	
	.greyPod .podBotLarge {
		width:100%;
		height:8px;
		background:url(../images/pod-bot-large.gif) no-repeat;
		float:left;
		position:absolute;
		bottom:0px;	
		left:0px;
	}
	
.moreGames {
	width:235px;	
}

	.moreGames h1 {
		background:url(../images/more-games-title.gif) no-repeat;	
	}
	
	.moreGames .gameIcon {
		overflow:hidden;
		width:62px;
		height:62px;
		float:left;
		margin:8px;	
		position:relative;
	}
	
		.moreGames .gameIconMask {
			width:62px;
			height:62px;
			display:block;
			position:absolute;
			top:0px;
			left:0px;
			background:url(../images/game-icon-mask.png) no-repeat;
		}
	
.features {
	width:535px;
	margin-left:22px;
}

	.features h1 {
		background:url(../images/features-title.gif) no-repeat;	
	}
	
	.features h3 {
		color:#2d70a7;	
	}
	
.blackPod {
	float:left;
	background:#3a3a3a;
	color:#fff;
	margin-top:10px;	
	position:relative;
}

	.blackPod p {
		color:#fff;	
	}
	
.findUs {
	width:161px;
	margin-left:22px;	
}
	
	.findUs h1 {
		background:url(../images/find-us-title.gif) no-repeat center top;	
	}
	
	.findUs h1.top {
		background:url(../images/find-us-title-top.gif) no-repeat center top;	
	}
	
	.findUs h1.more {
		background:url(../images/more-options-title.gif) no-repeat center top;	
	}
	
	.network {
		float:left;
		padding:10px;	
	}
	
		.networkInfo {
			width:80px;
			float:left;	
		}
	
	.blackPod .dividerSmall {
		width:100%;
		float:left;
		height:17px;
		background:url(../images/black-divider-small.gif) no-repeat center center;	
	}
	
	.blackPod .podBotSmall {
		width:100%;
		height:8px;
		float:left;
		background:url(../images/small-black-bot.png) no-repeat bottom center;	
		position:absolute;
		bottom:-3px;	
		left:0px;
	}
	
	a.twitter {
		display:block;
		width:60px;
		height:59px;
		float:right;
		background:url(../images/twitter.gif) no-repeat;	
	}
	
	a.facebook {
		display:block;
		width:60px;
		height:59px;
		float:right;
		background:url(../images/facebook.gif) no-repeat;	
	}
	
	a.share {
		display:block;
		width:60px;
		height:59px;
		float:right;
		background:url(../images/share.gif) no-repeat;	
	}
	
	a.faq {
		display:block;
		width:60px;
		height:59px;
		float:right;
		background:url(../images/faq.gif) no-repeat;	
	}
	
.dot {
	border-top:1px dotted #383838;
	width:100%;
	float:left;
	margin:10px 0;	
}

.downloads h3 {
	color:#2c6ea7;
}

.download {
	line-height:25px;
}

.editableContent .download img {
	float:left;
	margin:0px;
	padding-right:10px;
}
	
/*----------NEWS----------*/
	
#mainNews {
	float:left;
	margin-top:40px;
	position:relative;
}

	#mainNews .shadow {
		background:url(../images/main-news-bk.png) no-repeat top left;
		position:absolute;
		top:-8px;
		left:-18px;
		height:327px;
		width:1005px;
	}

	.newsList {
		width:790px;	
	}

		.newsList h1 {
			background:url(../images/x2-news-title.gif) no-repeat;	
		}
		
		.newsList h1.blank {
			background:url(../images/x2-news-title-blank.gif) no-repeat;
			line-height:35px;	
			color:#4b92ba;
			font-size:20px;	
			font-weight:bold
		}
		
		#mainNews .findUs h1.normal {
			background:url(../images/find-us-title-news.gif) no-repeat center center !important;
		}
		
		#mainNews .findUs h1.filter {
			background:url(../images/filter-title-news.gif) no-repeat center center !important;	
		}
		
	#mainNews .news-sidebar li {
		padding: 4px 0 4px 20px;
		background: url(../images/newspaper.png) no-repeat center left;
	}
		#mainNews .news-sidebar li a {
			font-weight: normal;	
			color: #fff;
		}
		
	#mainNews .newsItem {
		padding:10px;
		float:left;		
	}
	
	#mainNews .newsItem:hover {
		background-color:#fff;		
	}
	
	.newsItem h2 a {
		color: #000;
	}
.newsPic {
	float:left;
	width:96px;
	height:96px;
	position:relative;
	overflow:hidden;
	background:#878787 url(../images/feature-loader.gif) no-repeat center center;
	margin:0 10px 0 0;
}
		
	.newsPicMask {
		position:absolute;
		top:0px;
		left:0px;
		width:96px;
		height:96px;
		background:url(../images/game-pic-mask.png) no-repeat;
	}

/*----------HELP----------*/
	
#help {
	float:left;
	margin-top:40px;
	position:relative;
}

	#help .shadow {
		background:url(../images/main-news-bk.png) no-repeat top left;
		position:absolute;
		top:-8px;
		left:-18px;
		height:327px;
		width:1005px;
		z-index:0;
	}

	.helpList {
		width:790px;
		position:relative;	
	}

		.helpList h1 {
			background:url(../images/x2-faq-title.gif) no-repeat;
			line-height:35px;
			font-size:18px;
			color:#4b91ba;
			font-weight:bold;
			text-indent:140px;	
		}
		
		#help .findUs h1 {
			background:url(../images/find-us-title-top.gif) no-repeat center top;	
		}
		
	#help .helpItem {
		float:left;	
		width:767px;
		position:relative;
		z-index:20;	
	}
	
	#help .helpItem h2 {
		width:767px;
		background:url(../images/faq-header1.gif) no-repeat;	
		float:left;	
		height:40px;
		line-height:40px;
		color:#4d94bb;	
		cursor:pointer;
		margin-bottom:10px;
		position:relative;
		text-indent:25px;
		font-size:13px;
	}
	
		#help .helpItem h2 span.open {
			width:30px;
			height:40px;
			background:url(../images/open-faq1.gif) no-repeat;	
			display:block;	
			position:absolute;
			top:0px;
			right:10px;
		}
		
		#help .helpItem h2 span.close {			
			background:url(../images/close-faq1.gif) no-repeat;			
		}
		
		#help .helpItem .details {
			padding:0px;
			float:left;	
			width:767px;;
		}
	
	#help .helpItem:hover {
		background-color:#fff;		
	}
	
	.filler {
		width:100%;
		height:200px;
		float:left;	
	}
	

/*----------EDITABLE CONTENT----------*/
	
.editableContent h3 {
	font-weight:bold;
	font-size:18px;
	padding-bottom:5px;
}

.editableContent ul {
	margin:10px 0 0 30px;
	font-weight:bold;
	list-style-type:url(../images/wigit.gif);
}

.editableContent ul li {
	margin:5px 0px;
	list-style-type:disc;
	list-style-image:url(../images/wigit.gif);
	list-style-position:outside;
}

.editableContent img {
	float:right;
	margin:0 0 10px 10px;
}

.slider {
	float:left;
	height:100px;
	background:#383838;
	width:430px;
}

#slider li {
	height:100px;
	width:100px;
	overflow:hidden;
	cursor:pointer;
}

#slider li a {
	display:block;
	height:100px;
	width:100px;
}

#slider li img {
	visibility:hidden;
}

.slideControl {
	width:14px;
	height:100px;
}

.sliderPrev {
	background:url(../images/slider-prev.gif) no-repeat;
	border-right:1px solid #383838;
}

.sliderNext {
	background:url(../images/slider-next.gif) no-repeat;
	border-left:1px solid #383838;
}

.sliderNext.disabled {
	background:url(../images/slider-next-off.gif) no-repeat;
	border-left:1px solid #fff;
}

.sliderPrev.disabled {
	background:url(../images/slider-prev-off.gif) no-repeat;
	border-right:1px solid #fff;
}

.small {
	float:left;
	font-size:10px;
	width:auto;
}

/*----------CONTACT----------*/

#contact fieldset {
	margin:0 auto;
	width:300px;
}

#contact label {
	font-weight:bold;
	width:80px;
	float:left;
	margin:5px 0px
}

#contact input, #contact select {
	border:1px solid #a2a1a1;
	width:200px;
	float:left;
	height:17px;
	margin:5px 0px
}

#contact input.button {
	border:none;
}

#contact input.getDirections {
	width:41px;
	height:21px;
	background:url(../images/go-but.gif) no-repeat;
	margin-left:10px;
}

#contact input.reset {
	width:91px;
	height:21px;
	background:url(../images/reset-but.gif) no-repeat;
	cursor:pointer;
}

#contact input.sendBut {
	width:91px;
	height:21px;
	background:url(../images/send-but.gif) no-repeat;
}

#contact .message {
	width:200px;
	height:60px;
	margin:5px 0px;
}

#contact #directions {
	background:#fff;
}

.directions {
	width:455px;
	position:relative;
	padding-bottom:40px;
}

	.directions h1 {
		background:url(../images/directions-title.gif) no-repeat;	
	}
	
	.directions h3 {
		font-weight:bold;
		color:#2d6fa8;	
	}

sup {
	color:red;
}

.error {
	color:red;
	border:1px solid red;
}

/*----------SEARCH----------*/

.searchBox {
	width:314px;
	height:34px;
	background:url(../images/search-bk.gif) no-repeat bottom right;
	position:absolute;
	top:0px;
	right:0px;
}

	.searchBox fieldset {
		width:235px;
		float:right;
		margin:0px;
	}

#search label {
	font-weight:bold;
	width:80px;
	float:left;
	margin:5px 0px
}

#search input, #search select, .searchBox input {
	border:1px solid #a2a1a1;
	width:200px;
	float:left;
	height:17px;
	margin:5px 0px
}

	.searchBox .searchBut {
		width:22px;
		height:22px;
		background:url(../images/search-but.gif) no-repeat;
		border:0px;
		margin-left:5px;
	}
	
#search .searchButton {
	width:100px;
	height:21px;
	background:url(../images/search-big-but.gif) no-repeat;
	border:none;
	margin-left:5px;
}

#search .resetButton {
	width:100px;
	height:21px;
	background:url(../images/reset-big-but.gif) no-repeat;
	border:none;
	margin-left:5px;
}

span.highlight {
	background-color:#fef695;
	font-weight:bold;
	padding:0px 5px;	
}
	
/*----------FOOTER----------*/
	
.footer {
	width:100%;
	height:158px;
	float:left;
	background:url(../images/footer.gif) no-repeat;
	margin-top:20px;
	padding-top:18px;
}
	
	.footer .footerNav {
		float:left;
		margin-left:10px;
	}

		.footer .footerNav li {
			float:left;
			color:#fff;
			font-size:10px;
			margin:1px;
		}
	
			.footer .footerNav a {
				color:#fff;
				font-size:10px;
			}

	.footer .cleverClover {
		font-size:10px;	
		float:right;
		margin-right:15px;
		color:#8ccd27;		
	}
	
	
	
/*
* Simple Paging
*/
.paging {
	width: auto;
	margin: 0 auto;
	width: 110px;
	height: 26px;
	text-align:center;
}
.paging li{
	font-size:11px;
	list-style:none;
	float: left;
	display: inline;
}
.paging a{
	border:solid 1px #DDDDDD;
	margin-right:2px;
}
.paging select {
	background:url(../images/paging-select.png) no-repeat;
	padding:1px 1px 2px 3px;
	height: 19px;
	width:53px;
	text-align: center;
	margin-top:4px;
}

.paging select option {
	background:#fff;
}

.paging .previous a, .paging .next a {
	display:block;
	float:left;
	width:18px;
	height:18px;
	margin:3px;
}
.paging .next a {
	background:url(../images/paging-next.png) no-repeat;
}

.paging .previous a {
	background:url(../images/paging-prev.png) no-repeat;
}