body {
	background-image    : url('/images/background.jpg');
	background-color    : #222;
	margin              : 0;
	padding             : 0;
	font-family         : sans-serif;
	color               : #eee;
	font-size           : 18px;
}

#aoeu-logo {
	width     : 50%;
	max-width : 250px;
	margin    : 12px 12px 8px 0;
}

h1 {
	color : #444;
}

select.large {
	height    : 64px;
	font-size : 32px;
	width     : 90%;
}

#menus {
	border-top:    2px solid #fff;
	border-bottom: 2px solid #fff;
	margin-bottom: 48px;
	overflow:      hidden;

	-webkit-box-shadow: 0px 7px 14px -4px rgba(0,0,0,1);
	-moz-box-shadow: 0px 7px 14px -4px rgba(0,0,0,1);
	box-shadow: 0px 7px 14px -4px rgba(0,0,0,1);
}

div.menu {
	float         : left;
	/*width         : 33.333%;*/
	width         : 50%;
	height        : 48px;
	line-height   : 48px;
	margin-bottom : 0;
}

div.menu-inner {
	margin      : 0px 2px 2px 2px;
	text-align  : center;
}

.menu:first-child .menu-inner {
	margin-left: 0;
}

.menu:last-child .menu-inner {
	margin-right: 0;
}

div.menu-inner.active {
	color       : #fff;
	background  : #f60;
	font-weight : bold;
}

div.menu-inner.inactive {
	color      : #aaa;
	background : #666;
}

input, select {
	border     : 0;
	background : rgba(128, 128, 128, 0.3);
	color      : #fff;
	padding    : 4px;
	font-size  : 18px;
}

select {
	height : 28px;
}

div.left  { margin-left:  4px; }
div.right { margin-right: 4px; }

.clickable {
	cursor        : pointer;
	background    : #f60;
	padding       : 12px;
	color         : #fff;
}

.clickable.large {
	font-size: 16pt;
}

:-webkit-full-screen {
	    background-color: rgba(0,0,0,0);
    }
