<?php

header("Content-type: text/css");
$basepath = ($_SERVER['PSS_DEPLOYMENT_CONTEXT'] === 'live' ? '' : '/demo.guestdeck.com') . '/kenwood-sc3';
$themepath = $basepath.'/shell/'.$_GET['theme']; ?>

?>

/* --- VIEWABLE --- */

.light #viewable {
	background-color: #1d353c;
}

.dark #viewable {
	background-color: #111214;
}

/* --- INTRO --- */

.light #intro h2 {
	color: #002f48;
}

.light #intro h3 {
	color: #245e7d;
}

.light #intro p {
	color: #245e7d;
}

.light #intro p b {
	color: #245e7d;
}


.dark #intro {
	opacity: 0.5;
	-moz-opacity: 0.5;
	-ms-opacity: 0.5;
	-o-opacity: 0.5;
	-webkit-opacity: 0.5;
}

.dark #intro h2 {
	color: #91e0ff;
}

.dark #intro h3 {
	color: #91e0ff;
}

.dark #intro p {
	/* color: #429abd; */
	color:#ffffff;
}

.dark #intro p b {
	/* color: #429abd; */
	color:#ffffff;
}

/* -- DAY LABELS --- */

.light .day {
	color: #66a2a1;
}

.light .day a {
	color: #fff;
	text-shadow: #222 0px 0px 5px;
}

.dark .day {
	color: #1B2631;
}

.dark .day a {
	color: #fff;
	text-shadow: #222 0px 0px 5px;
}

/* --- WEATHER ICONS (SUN/MOON) --- */

.light .bubble .bubble-side-bar .c113 /* Clear/Sunny */ {
	background-image: url(<?php echo $basepath; ?>/images/info-weather-sun.png);
}

.light .bubble .bubble-side-bar .c116 /* Partly Cloudy */ {
	background-image: url(<?php echo $basepath; ?>/images/info-weather-sunclouds.png);
}

.dark .c113 /* Clear/Sunny */ {
	background-image: url(<?php echo $basepath; ?>/images/info-weather-moon.png);
}

.dark .bubble .bubble-side-bar .c116 /* Partly Cloudy */ {
	background-image: url(<?php echo $basepath; ?>/images/info-weather-moonclouds.png);
}

/* --- HORIZON --- */

#horizon {
	background-image: url(<?php echo $themepath; ?>/scene-horizon.png);
}

.light #horizon-haze {
	background-image: url(<?php echo $themepath; ?>/scene-horizon-haze.jpg);
}

.dark #horizon-haze {
	background-image: url(<?php echo $themepath; ?>/scene-horizon-haze.png);
}

.dark #horizon-stars,
.dark #horizon-sky,
.dark #horizon-lighting {
	height: 300px;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.ie7 .dark #horizon-lighting {
	display: none;
}

.dark #horizon-stars {
	/*
	animation: horizon-stars 36s linear infinite;
	-moz-animation: horizon-stars 36s linear infinite;
	-webkit-animation: horizon-stars 36s linear infinite;
	*/
	background-image: url(<?php echo $themepath; ?>/scene-horizon-stars.jpg);
}

/*
@keyframes horizon-stars {
	from {
		background-position: 0 0;
	}
	to {
		background-position: 600px 600px;
	}
}

@-moz-keyframes horizon-stars {
	from {
		background-position: 0 0;
	}
	to {
		background-position: 600px 600px;
	}
}

@-webkit-keyframes horizon-stars {
	from {
		background-position: 0 0;
	}
	to {
		background-position: 600px 600px;
	}
}
*/

.dark #horizon-sky {
	background-image: url(<?php echo $themepath; ?>/scene-horizon-sky.png);
	background-repeat: no-repeat;
}

.dark #horizon-lighting {
	/*
	animation: horizon-lighting 42s linear infinite;
	-moz-animation: horizon-lighting 42s linear infinite;
	-webkit-animation: horizon-lighting 42s linear infinite;
	*/
	background-image: url(<?php echo $themepath; ?>/scene-horizon-lighting.png);
}

/*
@keyframes horizon-lighting {
	from {
		background-position: 0 0;
	}
	to {
		background-position: 0 -700px;
	}
}

@-moz-keyframes horizon-lighting {
	from {
		background-position: 0 0;
	}
	to {
		background-position: 0 -700px;
	}
}

@-webkit-keyframes horizon-lighting {
	from {
		background-position: 0 0;
	}
	to {
		background-position: 0 -700px;
	}
}
*/

/* --- CRUISE SHIP --- */

#ship {
	background-image: url(<?php echo $themepath; ?>/ship.png);
}

.light #ship {
	height: 20px;
}

.dark #ship {
	height: 30px;
}

/* --- SUN / MOON --- */

#light-source {
	background: url(<?php echo $themepath; ?>/scene-light-source.png) no-repeat right top;
}

.dark #light-source {
	background-position: 0 0;
}

/* --- LENS FLARES --- */

.light #lens-flares {
	min-height: 880px;
	z-index: 60;
}

.ie7 .light #lens-flares {
	display: none;
}

.light #flare0,
.light #flare1,
.light #flare2,
.light #flare3,
.light #flare4,
.light #flare5,
.light #flare6 {
	background-repeat: no-repeat;
	height: 100%;
	position: absolute;
	width: 100%;
}

.light #flare0 {
	background-image: url(<?php echo $themepath; ?>/flare-03.png);
	z-index: 60;
}

.light #flare1 {
	background-image: url(<?php echo $themepath; ?>/flare-01.png);
	z-index: 62;
}

.light #flare2 {
	background-image: url(<?php echo $themepath; ?>/flare-02.png);
	z-index: 63;
}

.light #flare3 {
	background-image: url(<?php echo $themepath; ?>/flare-04.png);
	z-index: 64;
}

.light #flare4 {
	background-image: url(<?php echo $themepath; ?>/flare-06.png);
	z-index: 65;
}

.light #flare5 {
	background-image: url(<?php echo $themepath; ?>/flare-03.png);
	z-index: 66;
}

.light #flare6 {
	background-image: url(<?php echo $themepath; ?>/flare-05.png);
	z-index: 67;
}

/* --- REFLECTION --- */

#reflection {
	background-image: url(<?php echo $themepath; ?>/scene-reflection.png);
}

.light #reflection {
	right: -27px;
	top: 200px;
}

.dark #reflection {
	left: -30px;
	top: 285px;
}

/* --- CLOUDS --- */

.light #clouds {
	background-image: url(<?php echo $themepath; ?>/scene-clouds.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	height: 800px;
	left: 0;
	position: absolute;
	top: 55px;
	width: 3250px;
	z-index: 30;
}

/* --- LAND --- */

#land {
	background-image: url(<?php echo $themepath; ?>/scene-land.png);
}

/* --- LIGHTHOUSE BEAM --- */

#lighthouse-beam {
	background-image: url(<?php echo $themepath; ?>/scene-lighthouse-beam.png);
	height: 96px;
	left: 1377px;
	position: absolute;
	top: 637px;
	width: 123px;
	z-index: 21;
}

/* --- SEA --- */

#sea-waves {
	background-image: url(<?php echo $themepath; ?>/scene-sea-waves.png);
}

#sea-deep {
	background-image: url(<?php echo $themepath; ?>/scene-sea-deep.jpg);
}

/* --- OCTOPUS - KENWOOD CORPORATE SITE --- */

#octopus {
	background: url(<?php echo $themepath; ?>/scene-octopus.png) no-repeat;
}


/* --- CONTENT --- */

span[data-theme] {
	display: none;
}

.light span[data-theme="light"],
.dark span[data-theme="dark"] {
	display: inline;
}