<?php

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

?>

#scene {
	cursor: url(<?php echo $basepath; ?>/shell/grab.cur), default;
	overflow: hidden;
}

.grabbing #scene {
	cursor: url(<?php echo $basepath; ?>/shell/grabbing.cur), default;
}

#scene,
#pannable {
	left: 0;
	max-width: 2000px;
	min-height: 1030px;
	position: absolute;
	top: 0;
	width: 100%;
}

/* --- HORIZON ---- */

#horizon,
#horizon-haze {
	height: 300px;
	left: 0;
	position: absolute;
	width: 100%;
}

#horizon {
	background-repeat: no-repeat;
	top: 0;
}

#horizon-haze {
	/*
	animation: horizon-haze 150s linear infinite;
	-moz-animation: horizon-haze 150s linear infinite;
	-webkit-animation: horizon-haze 150s linear infinite;
	*/
	background-repeat: repeat-x;
	top: 25px;
}

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

@-moz-keyframes horizon-haze {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -2500px 0;
	}
}

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

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

#ship {
	background-position: 0 0;
	background-repeat: no-repeat;
	color: #fff;
	display: block;
	left: 400px;
	padding-top: 50px;
	position: absolute;
	text-shadow: #333 0px 0px 3px;
	text-transform: uppercase;
	top: 510px;
	width: 155px;
	z-index: 70;
}

#ship.selected,
#ship:hover {
	background-position: 0 -100px;
}

/* -- DAY LABELS --- */

.day {
	position: absolute;
	text-transform: uppercase;
	width: 100px;
	z-index: 70;
}

.day a {
	background-image: url(<?php echo $basepath; ?>/shell/bg-day.png);
	background-position: right top;
	background-repeat: no-repeat;
	display: inline-block;
	height: 30px;
	line-height: 30px;
	overflow: hidden;
	padding-right: 40px;
}

.day a:hover,
.day a.selected {
	background-position: right bottom;
}

#day-one {
	left: 420px;
	top: 465px;
}

#day-two {
	left: 535px;
	top: 625px;
}

#day-three {
	left: 970px;
	top: 680px;
}

#day-four {
	left: 1520px;
	top: 595px;
}

#day-five {
	left: 1285px;
	top: 565px;
}

#day-five a {
	background-position: left top;
	padding: 0 0 0 40px;
}

#day-five a:hover,
#day-five a.selected {
	background-position: left bottom;
}

#day-six {
	left: 1335px;
	top: 685px;
}

#day-seven {
	left: 735px;
	top: 790px;
}

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

#light-source {
	height: 100%;
	position: absolute;
	width: 100%;
	z-index: 61;
}

/* --- REFLECTION --- */

.ie7 #reflection {
	display: none;
}

#reflection {
	background-position: 0 0;
	background-repeat: no-repeat;
	height: 616px;
	position: absolute;
	width: 500px;
	z-index: 18;
}

/* --- LAND --- */

#land {
	background-repeat: no-repeat;
	height: 560px;
	left: -840px;
	position: absolute;
	top: 237px;
	width: 3250px;
	z-index: 20;
}

/* --- SEA --- */

#sea-waves {
	/*
	animation: sea-waves 60s linear infinite;
	-moz-animation: sea-waves 60s linear infinite;
	-webkit-animation: sea-waves 60s linear infinite;
	*/
	background-repeat: repeat-x;
	height: 700px;
	left: -840px;
	position: absolute;
	top: 350px;
	width: 3250px;
	z-index: 19;
}

/*
@keyframes sea-waves {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -300px 0;
	}
}

@-moz-keyframes sea-waves {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -300px 0;
	}
}

@-webkit-keyframes sea-waves {
	from {
		background-position: 0 0;
	}
	to {
		background-position: -300px 0;
	}
}
*/

#sea-deep {
	background-image: url(<?php echo $basepath; ?>/shell/scene-sea-deep.jpg);
	background-repeat: no-repeat;
	height: 700px;
	left: -840px;
	position: absolute;
	top: 350px;
	width: 3250px;
	z-index: 18;
}

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

#octopus {
	bottom: 230px;
	display: block;
	height: 121px;
	left: -748px;
	position: absolute;
	text-indent: -9999px;
	width: 127px;
	z-index: 70;
}