@charset "UTF-8";

@font-face{
	font-family:		'Cantora One';
	font-style:			normal;
	font-weight:		400;
	src:				local('Cantora One'), local('CantoraOne-Regular'), url('../fonts/GoogleCantoraOne.woff2') format('woff2');
}
@font-face{
	font-family:		'Federo';
	font-style:			normal;
	font-weight:		400;
	src:				local('Federo'), local('Federo-Regular'), url('../fonts/GoogleFedero.woff2') format('woff2');
}
@font-face{
	font-family:		'Oxygen';
	font-style:			normal;
	font-weight:		400;
	src:				local('Oxygen'), local('Oxygen-Regular'), url('../fonts/GoogleOxygen.woff2') format('woff2');
}

body{
	font-family:	"Oxygen", sans-serif;
	text-rendering:	optimizeLegibility;
}

a{
	margin-top:			0;
	border-top:			solid transparent 0.1em;
	padding-top:		0;
	height:				auto;
	padding-bottom:		0;
	border-bottom:		solid transparent 0.1em;
	margin-bottom:		0;
	
	margin-left:		0.3em;
	border-left:		solid transparent 0.1em;
	padding-left:		0.5em;
	width:				auto;
	padding-right:		0.5em;
	border-right:		solid transparent 0.1em;
	margin-right:		0;
}

li a{
	padding-top:		0;
	padding-bottom:		0;
	padding-left:		0.5em;
	padding-right:		0.5em;
}

@media only screen and (max-device-width: 800px){
	body{
		font-size:  x-large;
	}
}

dt{
	clear:			both;
	float:			left;
	font-weight:	bold;
	text-align:		right;
	margin-right:	1em;
	width:			30%;
}

dd{
}

#main-content{
	max-width:		45%;
	
	margin-left:	auto;
	margin-right:	auto;
}

@media only screen and (max-device-width: 800px){
	#main-content{
		max-width:	90%;
	}
}

.page-title{
	background:		white;
	color:			#444;
	font-family:	"Cantora One", "Federo", "Optima", sans-serif;
	max-width:		65%;
	text-align:		center;
	
	margin-left:	auto;
	margin-right:	auto;

	margin-top:		0.3em;
	margin-bottom:	0.3em;
}

header .domain-begin{
	margin-right:	1em;
}

header .domain-begin,
header .domain-end{
	background:		white;
	color:			#ccc;
	font-size:		small;
	font-style:		italic;
	text-align:		center;
}

header .domain-end{
	margin-left:	1em;
}

#portrait{
	background:		white url('../images/Portrait128x200.jpg');
	color:			#888;
	repeat:			no-repeat;
	text-align:		center;
	width:			128px;
	height:			200px;
	
	margin-left:	auto;
	margin-right:	auto;
	
	border-top-left-radius:				0.6em;
	border-top-right-radius:			0.6em;
	border-bottom-left-radius:			0.6em;
	border-bottom-right-radius:			0.6em;
}

.tabs{
	display:			block;
	overflow:			auto;
	text-align:			center;
	
	margin-top:			0;
	border-top:			0;
	padding-top:		1em;
	height:				auto;
	padding-bottom:		0;
	border-bottom:		solid 0.1em;
	margin-bottom:		0;
	
	margin-left:		-1em;
	border-left:		0;
	padding-left:		0;
	width:				auto;
	padding-right:		0;
	border-right:		0;
	margin-right:		-1em;
}

.tabs{
	background:			#eee;
	color:				black;
	
	border-top-color:	transparent;
	border-bottom-color:#111;
	border-left-color:	transparent;
	border-right-color:	transparent;
}

.tabs ul{
	white-space:		nowrap;
	
	margin-top:			0;
	border-top:			0;
	padding-top:		0;
	height:				auto;
	padding-bottom:		0.3em;
	border-bottom:		solid 0.3em;
	margin-bottom:		0;
	
	margin-left:		0;
	border-left:		0;
	padding-left:		1.5em;
	width:				auto;
	padding-right:		0;
	border-right:		0;
	margin-right:		0;
}

.tabs li{
	display:			inline;
	list-style-type:	none;
	
	padding-bottom:		0.3em;
	border-bottom:		solid 0.3em;
}

.tabs ul,
.tabs li{
	border-bottom-color:#555;
}

.tabs li a{
	margin-top:			0;
	border-top:			0;
	padding-top:		0.5em;
	height:				auto;
	padding-bottom:		0.3em;
	border-bottom:		0;
	margin-bottom:		0;
	
	margin-left:		0.5em;
	border-left:		0;
	padding-left:		1em;
	width:				auto;
	padding-right:		1em;
	border-right:		0;
	margin-right:		0.5em;
	
	border-top-left-radius:			0.4em;
	border-top-right-radius:		0.4em;
	border-bottom-left-radius:		0;
	border-bottom-right-radius:		0;
}

.tabs li a{
	text-shadow:		white 0.175em 0.2em 0.4em;
	
	border-top-color:	black;
	border-bottom-color:transparent;
	border-left-color:	black;
	border-right-color:	black;
}

.tabs li.nth-tab-selected a{
	background:			#ccc;
	color:				black;
	text-decoration:	none;
	
	box-shadow:			0.1em 0.15em 0.3em #555;
}

.tabs li.nth-tab-selected a{
	-webkit-transition-property:		background;
	-webkit-transition-delay:			0;
	-webkit-transition-duration:		0.15s;
	-webkit-transition-timing-function:	ease-out;
}

.app-icon{
	background-size:	64px 64px;
	background-repeat:	no-repeat;
	box-shadow:			0.2em 0.2em 0.4em #555;
	width:				64px;
	height:				64px;

	margin-left:		1em;
	margin-top:			0.5em;
}

.celtreos{
	background:		#111;
	color:			#dedede;
	margin-top:		1em;
	padding-top:	0.5em;
	padding-bottom:	0.5em;
	margin-bottom:	1em;
}

.celtreos a{
	background:		#333;
	color:			white;
	text-decoration:	none;
	
	border-bottom:	solid #888 0.1em;
	
	border-top-left-radius:			0.4em;
	border-top-right-radius:		0.4em;
	border-bottom-left-radius:		0.4em;
	border-bottom-right-radius:		0.4em;
}

.celtreos a.app-store-link{
	border-bottom-color:	transparent;
}

.celtreos a.current-page{
	background: black;
	color: white;
	cursor:	default;
	border: transparent;
}

.celtreos li a{
	line-height:	160%;
	
	padding-top:		0;
	padding-bottom:		0;
	padding-left:		0.5em;
	padding-right:		0.5em;
	
	border-top-left-radius:			0.2em;
	border-top-right-radius:		0.2em;
	border-bottom-left-radius:		0.2em;
	border-bottom-right-radius:		0.2em;
}

.celtreos dt{
	color:			white;
	width:			2em;
}

.celtreos dd{
	margin-left:	3em;
	margin-top:		1em;
	margin-bottom:	1em;
}

.celtreos h2,
.celtreos h3,
.celtreos h4{
	margin-top:		2em;
	margin-left:	-1em;
}

.celtreos h4{
	background:		#333;
	color:			white;
	padding-left:	1em;
	padding-top:	0.3em;
	padding-bottom:	0.3em;
}

.celtreos .note{
	border:			solid white 0.2em;
	padding:		1em;
	margin-left:	1em;
	margin-right:	1em;
	margin-top:		2em;
	margin-bottom:	2em;
}

#celtreos-app-icon{
	background-image:	url('../apps/celtreos/images/AppIcon64×64.png');
}

#gallery-celtreos-game-controllers{
	background-image:	url('../apps/celtreos/images/ScreenShotGameControllers390×260.png');
}

#gallery-celtreos-ships-weapons{
	background-image:	url('../apps/celtreos/images/ScreenShotShipsWeapons390×260.png');
}

#gallery-celtreos-waves-of-foes{
	background-image:	url('../apps/celtreos/images/ScreenShotEnemyWaves390×260.png');
}

#gallery-celtreos-bosses{
	background-image:	url('../apps/celtreos/images/ScreenShotBosses390×260.png');
}

#gallery-celtreos-power-ups{
	background-image:	url('../apps/celtreos/images/ScreenShotPowerUps390×260.png');
}

#gallery-celtreos-obstacles{
	background-image:	url('../apps/celtreos/images/ScreenShotObstacles390×260.png');
}

#gallery-celtreos-music{
	background-image:	url('../apps/celtreos/images/ScreenShotMusicPanel390×260.png');
}

#gallery-celtreos-music-auto-next{
	background-image:	url('../apps/celtreos/images/ScreenShotMusicAutoNext390×260.png');
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	only screen and (-o-min-device-pixel-ratio: 3/2),
	only screen and (min--moz-device-pixel-ratio: 1.5),
	only screen and (min-device-pixel-ratio: 1.5){
	/* note: not all original images have Retina versions */
	#celtreos-app-icon{
		background-image:	url('../apps/celtreos/images/AppIcon64×64@2x.png');
	}
	#gallery-celtreos-game-controllers{
		background-image:	url('../apps/celtreos/images/ScreenShotGameControllers390×260@2x.png');
	}
	#gallery-celtreos-ships-weapons{
		background-image:	url('../apps/celtreos/images/ScreenShotShipsWeapons390×260@2x.png');
	}
	#gallery-celtreos-waves-of-foes{
		background-image:	url('../apps/celtreos/images/ScreenShotEnemyWaves390×260@2x.png');
	}
	#gallery-celtreos-bosses{
		background-image:	url('../apps/celtreos/images/ScreenShotBosses390×260@2x.png');
	}
	#gallery-celtreos-power-ups{
		background-image:	url('../apps/celtreos/images/ScreenShotPowerUps390×260@2x.png');
	}
	#gallery-celtreos-obstacles{
		background-image:	url('../apps/celtreos/images/ScreenShotObstacles390×260@2x.png');
	}
	#gallery-celtreos-music{
		background-image:	url('../apps/celtreos/images/ScreenShotMusicPanel390×260@2x.png');
	}
	#gallery-celtreos-music-auto-next{
		background-image:	url('../apps/celtreos/images/ScreenShotMusicAutoNext390×260@2x.png');
	}
}

.gallery{
	display:			block;
	
	margin-top:			0;
	border-top:			solid 0.1em;
	padding-top:		0.5em;
	height:				auto;
	padding-bottom:		0.5em;
	border-bottom:		solid 0.1em;
	margin-bottom:		0;
	
	margin-left:		1em;
	border-left:		solid 0.1em;
	padding-left:		1em;
	width:				auto;
	padding-right:		1em;
	border-right:		solid 0.1em;
	margin-right:		1em;
	
	border-top-left-radius:			0.7em;
	border-top-right-radius:		0.7em;
	border-bottom-left-radius:		0.7em;
	border-bottom-right-radius:		0.7em;
}

#screenshot-list{
	padding-left:		0;
}

@media only screen and (max-device-width: 800px){
	#screenshot-list li{
		width:			100%;
		margin-left:	auto;
		margin-right:	auto;
	}
	#screenshot-list dl dd{
		width:			100%;
		margin-left:	auto;
		margin-right:	auto;
	}
	#screenshot-list .overview-image{
		margin-left:	auto;
		margin-right:	auto;
	}
}

.gallery{
	box-shadow:			0 0.4em 0.5em #000;
	background:			#222;
	color:				white;
	
	margin-bottom:		1em;
	
	border-top-color:	#333;
	border-bottom-color:#222;
	border-left-color:	#222;
	border-right-color:	#222;
}

.gallery .scrollable{
	overflow:			scroll;
	height:				220px;
}

.gallery .gallery-caption{
	text-align:			center;
}

.gallery .gallery-navigation{
	float:				right;
	margin-right:		1em;
}

.gallery h2{
	text-shadow:		black 0.075em 0.15em 0.5em;
}

.gallery a{
	cursor:				pointer;
	display:			inline-block;
	
	border-bottom-color:	transparent;
}

.gallery dl{
	line-height:		250%;
	white-space:		nowrap;
	
	margin-top:			0;
	border-top:			0;
	padding-top:		0;
	height:				auto;
	padding-bottom:		0;
	border-bottom:		0;
	margin-bottom:		0;
	
	margin-left:		0;
	border-left:		0;
	padding-left:		0;
	width:				auto;
	padding-right:		0;
	border-right:		0;
	margin-right:		0;
}

.gallery dt{
	float:				right;
	text-align:			center;
	white-space:		nowrap;
	
	margin-top:			0;
	border-top:			0;
	padding-top:		1.5em;
	height:				auto;
	padding-bottom:		0;
	border-bottom:		0;
	margin-bottom:		0;
	
	margin-left:		0;
	border-left:		0;
	padding-left:		1em;
	width:				auto;
	padding-right:		1em;
	border-right:		0;
	margin-right:		0;
}

@media only screen and (max-device-width: 800px){
	.gallery dt{
		float:		none;
	}
}

.gallery dd{
	float:				left;
	text-align:			center;
	
	margin-top:			0;
	border-top:			0;
	padding-top:		0;
	height:				auto;
	padding-bottom:		0;
	border-bottom:		0;
	margin-bottom:		0;
	
	margin-left:		0;
	border-left:		0;
	padding-left:		0;
	width:				auto;
	padding-right:		0;
	border-right:		0;
	margin-right:		0;
}

.gallery ul{
	display:			inline-block;
}

.gallery li{
	display:			inline-block;
	
	border:				solid transparent 0.3em;
	padding:			0.33em;
}

.gallery .overview-image{
	background-size:	390px 260px;
	background-repeat:	no-repeat;
	width:				390px;
	height:				260px;
	
	border-top-left-radius:			0.4em;
	border-top-right-radius:		0.4em;
	border-bottom-left-radius:		0.4em;
	border-bottom-right-radius:		0.4em;
}

.gallery img,
.gallery embed,
.gallery .overview-image{
	border:				solid #ccc 0.1em;
	box-shadow:			0.45em 0.5em 0.9em #050505;
	margin-left:		0.75em;
	margin-right:		0.75em;
	margin-top:			1.35em;
	margin-bottom:		1.35em;
}

.gallery a img,
.gallery a .overview-image{
	box-shadow:			0.15em 0.5em 0.9em #444;
	opacity:			1.0;
}

.gallery a:hover img,
.gallery a:hover.overview-image{
	box-shadow:			-0.15em 0.5em 2.5em white;
	xopacity:			0.75;
}

footer div{
	background:		white;
	color:			#888;
	max-width:		65%;
	text-align:		center;
	
	margin-top:		6em;
	
	margin-left:	auto;
	margin-right:	auto;
}