/*********************************************** 
 * Wrappers
 */

html, body, #container {
    overflow: hidden;
    height: 100%;
    width: 100%;


}

body {
   background: #000;
	color: #fff;
}

.description {
   background: #ccc;
	color: #aaa;
	width:200px;
}

.calendar td {
   background: #ccc;
	color: #aaa;
	width:200px;
}


h1, h2, h3 {
	font-weight: 900;
	font-size: 24px;
}

/*********************************************** 
 * XMB
 */

.omb-outer {
	position: 0px relative;
	height: 100%;
	-webkit-user-select: none;
	
}

.omb {
	position: absolute;
	width: 20000em;
	margin: 0;
	-webkit-transition: left 0.2s ease-out;
	left: 0;
	height: 100%;
	z-index: 3;
}


	.omb > li {
		float: left;
		display: inline;
		width: 20%;
		height: 100%;
		/* outline: 1px solid yellow; -- Used for debugging **/
		margin-top: 0;
		-webkit-transition: background-color 0.2s ease-out;
	}

@media only screen and (min-height: 1100px) {
	body {
		cursor:none;
	}
	.omb > li {
		margin-top: 700px;
}
}
	
		.omb > li > h2 {
			text-align: center;
			margin-top: 100px;
			position: relative;
			-webkit-transition: all 0.2s ease-in-out;
		}
		.omb > li:not(.current) > h2 {
			opacity: 0.5;
		}
		body.state-pop .omb > li:not(.current) > h2 {
			opacity: 0;
		}
		body.state-pop .omb > li.current > h2 {
			left: -100%;
		}
		
			.omb > li > h2 > i {
				display: block;
				margin: 0 auto;
				position: relative;
			}
			
			body.state-pop .omb > li.current h2 > span {
				opacity: 0;
			}

		/** link fix? dave **/			
			body.state-pop .omb > li.current h2 > a > span {
				opacity: 0;
			}

		
		.omb > li > div {
			position: relative;
			margin-top: 20px;
		}
		
		body.state-pop .omb > li.current > div {
			left: -100%;
		}
		
	
		.omb > li > div > ul {
			display: none;
			position: absolute;
			top: 0;
			height: 20000em;
			list-style: none;
			-webkit-transition: top 0.2s ease-out;
			width: 300%;
			margin: 0;
			
		}
		.omb > li.current > div > ul {
			display: block;
		}
	
			
			
			.omb > li.current > div > ul > li {
				padding: 3px 0;
				-webkit-transition: background-color: 1s ease-out;
				position: relative;
				font-size: 24px;
/*				outline: 1px solid yellow;*/
				-webkit-font-smoothing: antialiased;
			}
	
			/** Clearfix **/
			.omb > li > div > ul > li:before, .omb > li > div > ul > li:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
			.omb > li > div > ul > li:after { clear: both; }
			.omb > li > div > ul > li { zoom: 1; }
			
			body.state-pop .omb > li.current > div > ul > li > span {
				opacity: 0;
			}

			/** Dave **/
			body.state-pop .omb > li.current > div > ul > li > a >span {
				opacity: 0;
			}
	
	
			.omb > li.current > div > ul > li.current {
				color: #fff;
				padding: 200px 0 30px;
			}
			.omb > li.current > div > ul > li.current:first-child {
				padding-top: 30px;
				padding-left:5px;
			}
			
				.omb > li.current > div > ul > li > i {
					width: 60px;
					height: 40px;
					float: left;
					display: inline;
					margin-right: 10px;
					position: relative;
					-webkit-background-size: cover;
					margin-left: 30px;
					background-repeat: no-repeat;
					background-position: 50% 50%;
					-webkit-transition: all 0.2s ease-out;
/*					background-color: #000;*/
/*					border-radius: 999px;*/
				}
				
				.omb > li.current > div > ul > li.current i {
					width: 100px;
					height: 100px;
					margin-right: -10px;
					margin-left: 5px;
				}
				
				.omb > li > div > ul > li > span, .omb > li > div > ul > li > a > span {
					position: relative;
					top: 10px;
					left: 40px;
					-webkit-transition: all 0.2s ease-out;
					opacity: 0.5;
				}
				
				.omb > li > div > ul > li.current > span, .omb > li > div > ul > li.current > a > span {
					top: 40px;
					left: 40px;
					-webkit-animation: textpulse 1.5s 0 infinite;
					opacitY: 1;
				}
				
				body.state-pop .omb > li.current > div > ul > li:not(.current) > i {
					opacity: 0.5;
					-webkit-transform: scale(0.5);
					left: 10%;
				}
				
				body.state-pop .omb > li.current > div > ul > li > div {
					position: relative;
					left: 40%;
				}
			
				.omb > li.current > div > ul > li > div > ul {
					display: none;
					position: absolute;
					left: 0;
					top: 0;
					width: 100%;
					margin-left: 0;
					list-style: none;
					-webkit-transition: top 0.2s ease-out;
				}
				
				body.state-pop .omb > li.current > div > ul > li.current > div > ul {
					display: block;		
				}
				
					.omb > li.current > div > ul > li > div > ul > li {
						padding: 10px;
/*						outline: 1px solid white;*/
						opacity: 0.5;
					}
					
					.omb > li.current > div > ul > li > div > ul > li.current {
						opacity: 1;
					}
		
/*********************************************** 
 * Icons
 */

h2 > i { width: 90px; height: 90px; background: none no-repeat 50% 50%; -webkit-background-size: cover; -webkit-transition: all 0.2s ease-out; }

/** House **/
.house > h2 > i { background-image: url('../img/dave/house.png'); }
.about > h2 > i { background-image: url('../img/dave/questionmark.png'); }

/** Users **/
.users > h2 > i { background-image: url('../img/icons-big/Icons.6.png'); }
.turn-off > i {  background-image: url('../img/icons-big/Icons.62.png');  }
.create-user > i { background-image: url('../img/icons-big/Icons.37.png');  }
.existing-user > i {  background-image: url('../img/icons-big/Icons.12.png');  }

/** Settings **/
.settings > h2 > i { background-image: url('../img/icons-big/Icons.35.png'); }
.game-settings > i { background-image: url('../img/icons-big/Icons.27.png'); }
.video-settings > i { background-image: url('../img/icons-big/Icons.26.png'); }
.music-settings > i { background-image: url('../img/icons-big/Icons.29.png'); }
.system-settings > i { background-image: url('../img/icons-big/Icons.36.png'); }
.security-settings > i { background-image: url('../img/icons-big/Icons.33.png'); }
.audio-settings > i { background-image: url('../img/icons-big/Icons.34.png'); }


.photo > h2 > i { background-image: url('../img/icons-big/Icons.1.png'); }
.media-server > i { background-image: url('../img/icons-big/Icons.13.png'); }
.playlists > i { background-image: url('../img/icons-big/Icons.60.png'); }
.uploader > i { background-image: url('../img/icons-big/Icons.69.png'); }
.trophy > i { background-image: url('../img/icons-big/Icons.66.png'); }
.memory > i { background-image: url('../img/icons-big/Icons.5.png'); }

.music > h2 > i { background-image: url('../img/icons-big/Icons.16.png'); }
.video > h2 > i { background-image: url('../img/icons-big/Icons.38.png'); }
.game > h2 > i { background-image: url('../img/icons-big/Icons.39.png'); }

.network > h2 > i { background-image: url('../img/icons-big/Icons.18.png'); }
.download > i { background-image: url('../img/icons-big/Icons.49.png'); }
.browser > i { background-image: url('../img/icons-big/Icons.2.png'); }
.search > i { background-image: url('../img/icons-big/Icons.64.png'); }


.friends > h2 > i { background-image: url('../img/icons-big/Icons.9.png'); }
.message > i { background-image: url('../img/icons-big/Icons.54.png'); }
.add-friend > i { background-image: url('../img/icons-big/Icons.11.png'); }
.players > i { background-image: url('../img/icons-big/Icons.12.png'); }

.current > h2 > i { width: 120px; height: 120px; margin-top: -15px !important; margin-bottom: -13px !important; }

/*********************************************** 
 * Keyframes
 */			

@-webkit-keyframes textpulse {
	0% {
		text-shadow: 0 0 7px rgba(255, 255, 255, 0);
	}
	25% {
		text-shadow: 0 0 7px rgba(255, 255, 255, 1);
	}
	75% {
		text-shadow: 0 0 7px rgba(255, 255, 255, 1);
	}
	100% {
		text-shadow: 0 0 7px rgba(255, 255, 255, 0);
	}	
}

/*********************************************** 
 * Background
 */	

.omb-outer {
	/*
	background-color:#091076;
	background-image: -moz-linear-gradient(-90deg, #5DD6F9, #091076 700px);
	background-image: -webkit-linear-gradient(-90deg, #5DD6F9, #091076 700px);
	background-image: -o-linear-gradient(-90deg, #5DD6F9, #091076 700px);
	background-image: -ms-linear-gradient(-90deg, #5DD6F9, #091076 700px);
	background-image: linear-gradient(-90deg, #5DD6F9, #091076 700px);
	position: relative;
	z-index: 1;
	*/
	background-color:#000;
	/*background-image: -moz-linear-gradient(-90deg, #D6D6D6, #101010 700px);
	background-image: -webkit-linear-gradient(-90deg, #D6D6D6, #101010 700px);
	background-image: -o-linear-gradient(-90deg, #D6D6D6, #101010 700px);
	background-image: -ms-linear-gradient(-90deg, #D6D6D6, #101010 700px);
	background-image: linear-gradient(-90deg, #D6D6D6, #101010 700px);
	*/
	position: relative;
	z-index: 1;
}

.omb-outer #background {
	width: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 2;
}

/*********************************************** 
 * Mobile
 */

@media screen and (max-device-width: 320px) {
	#container > header h1,
	.fork-me {
		display: none;
	}
}