@import "editor.css";

html {
	background-color: #000;
}

html, body {
	margin: 0;
	padding: 0;
	text-align: center;
}

a:hover, a:active {
	outline: none;
}

a img {
	border: 0;
}

a#logo {
	float: left;
	width: 240px;
	height: 300px;	
}

a#logo:hover {
	text-decoration: none;
}

body {
	background-position: left top;
	background-repeat: repeat-x;
}

body#intro {
	background-image: url('/media/layout/front_top_bg.jpg');
}

body#inside {
	background-image: url('/media/layout/inside_top_bg.jpg');
}

.wrapper4 {
	background-image: url('/media/layout/ground.png');
        background-repeat: repeat-x;
}

#intro .wrapper4 {
        background-position: center 500px;
}

#inside .wrapper4 {
        background-position: center 380px;
	height: 700px;
}

.wrapper2 {
	background-image: url('/media/layout/mountains.png');
        background-repeat: repeat-x;
}

#intro .wrapper2 {
        background-position: center 450px;
}

#inside .wrapper2 {
        background-position: center 330px;
}

#intro .wrapper1 {
	background-image: url('/media/layout/front_top.jpg');
	background-position: center top;
	background-repeat: no-repeat;
	height: 600px;
}

#inside .wrapper1 {
	background-image: url('/media/layout/inside_top.jpg');
	background-position: center top;
	background-repeat: no-repeat;
	height: 600px;
}

#intro .wrapper3 {
	background-image: url('/media/layout/barn_and_camels.png');
        background-position: center 380px;
        background-repeat: no-repeat;
}

#inside .wrapper3 {
	background-image: url('/media/layout/barn_and_camels2.png');
        background-position: center 260px;
        background-repeat: no-repeat;
}

#inside .wrapper5 {
	background-image: url('/media/layout/page_bg.png');
	background-position: center 500px;
	background-repeat: no-repeat;
}

#intro .video {
	background-image: url('/media/layout/paper.png');
        background-position: center bottom;
        background-repeat: no-repeat;
	width: 669px;
	padding-top: 370px;
	padding-left: 10px;
	margin: 0 auto;
	height: 350px;
}

#intro .video .content {
	width: 520px;
	height: 293px;
	padding-bottom: 55px;
	margin: 0 auto;
}

#intro .video #noFlash {
	margin-top: -220px;
	padding: 0 100px;
}

#intro .video #noFlash a {
	color: #000;
}

#intro .bottom {
	margin-top: -10px;
	padding-bottom: 20px;
}

#intro p {
	padding: 0;
	margin: 0;
}

#inside .paper, #inside .pageWrapper {
	margin: 0 auto;
	width: 730px;
	clear: both;
}

#inside .page {
	float: left;
	width: 100%;
}

#inside .page {
	text-align: left;
}

#inside .paper {
	height: 400px; 
}

#inside .paper .content {
	float: right;
	padding: 0 43px 0 0;
	margin-top: 95px;
	float: right;
	height: 220px;
	width: 380px;
	overflow: hidden;
}


#inside .paper .content p {
	padding: 0;
	margin: 0;
}

#cast {
	width: 620px;
	padding-left: 90px;
	position: relative;
}

#cast1, #cast3 {
	float: left;
}

#cast2, #cast4 {
	float: right;
}

#cast1, #cast2, #cast3, #cast4 {
}

#cast .wrapper {
	width: 285px;
	height: 270px;
	padding: 15px 5px 15px 0px;
	background-repeat: no-repeat;
}

#cast1 .wrapper {
	background-image: url('/media/layout/cast1_lines.png');
        background-position: left center;
}

#cast2 .wrapper {
	background-image: url('/media/layout/cast2_lines.png');
        background-position: right center;
}

#cast3 .wrapper {
	background-image: url('/media/layout/cast3_lines.png');
        background-position: left center;
}

#cast4 .wrapper {
	background-image: url('/media/layout/cast4_lines.png');
        background-position: right center;
}


#cast h1 {
	display: none;
}

#cast .name, #cast .name_hover {
        background-position: center 2px;
	background-repeat: no-repeat;
	height: 37px;
	cursor: pointer;
}

#cast .name_hover {
	background-position: center -36px;
}

#cast1 .name, #cast1 .name_hover { background-image: url('/media/layout/merja_satulehto.png'); }
#cast2 .name, #cast2 .name_hover { background-image: url('/media/layout/janne_pekkala.png'); }
#cast3 .name, #cast3 .name_hover { background-image: url('/media/layout/aki_louhela.png'); }
#cast4 .name, #cast4 .name_hover { background-image: url('/media/layout/lauri_salovaara.png'); }

#cast .image, #cast .image_hover {
        background-position: center -20px;
	background-repeat: no-repeat;
	height: 200px;
}

#cast .image_hover {
	background-position: center -270px;
}

#cast1 .image, #cast1 .image_hover { background-image: url('/media/layout/merja_satulehto_kuvat.png'); }
#cast2 .image, #cast2 .image_hover { background-image: url('/media/layout/janne_pekkala_kuvat.png'); }
#cast3 .image, #cast3 .image_hover { background-image: url('/media/layout/aki_louhela_kuvat.png'); }
#cast4 .image, #cast4 .image_hover { background-image: url('/media/layout/lauri_salovaara_kuvat.png'); }

#cast .character, #cast .character_hover {
        background-position: center 2px;
	background-repeat: no-repeat;
	height: 38px;
	cursor: pointer;
}

#cast .character_hover {
        background-position: center -37px;
}

#cast1 .character, #cast1 .character_hover { background-image: url('/media/layout/kuningatar_herodes.png'); }
#cast2 .character, #cast2 .character_hover { background-image: url('/media/layout/murjaanien_kuningas.png'); }
#cast3 .character, #cast3 .character_hover { background-image: url('/media/layout/knihti.png'); }
#cast4 .character, #cast4 .character_hover { background-image: url('/media/layout/mankki.png'); }

.scroll {
	width: 320px;
	background-image: url('/media/layout/scroll.gif');
        background-position: center top;
        background-repeat: no-repeat;
	padding-top: 50px;
	display: none;
	position: absolute;
	z-index: 200;
	top: 0;
}

#cast1_name, #cast3_name, #cast1_character, #cast3_character {
	left: 350px;
}

#cast2_name, #cast4_name, #cast2_character, #cast4_character {
	left: 130px;
}

.scroll .content {
	padding: 0 60px 10px 56px;
	color: #000;
}

.scroll .bottom {
	float: left;
	width: 100%;
	background-image: url('/media/layout/scroll_bottom.gif');
        background-position: center top;
        background-repeat: no-repeat;
	height: 23px;
}


.scroll .content p {
	padding: 10px 0 5px 0;
	margin: 0;
}

#images {
	clear: both;
	padding-right: 10px;
	padding-left: 90px;
}

#images span {
	float: left;
	width: 75px;
	height: 75px;
	margin-left: 10px;
	margin-bottom: 10px;
}

#images span a {
	float: left;
	width: 73px;
	height: 73px;
	background-position: center center;
	background-repeat: no-repeat;
	border: 1px solid #3e3e3e;
}

#images span a:hover {
	border: 1px solid #818080;
	text-decoration: none;
}

#footer {
	clear: both;
	padding-top: 100px;
	background-image: url('/media/layout/footer_bg.jpg');
        background-position: center top;
        background-repeat: no-repeat;
}

#footer .wrapper {
	float: left;
	width: 100%;
	background-color: #1b1515;
	border-top: 1px solid #3e3e3e;
}

#footer .wrapper .wrapper {
	float: none;
	margin: 0 auto;
	width: 720px;
	position: relative;
	border: 0;
	padding-right: 20px;
	text-align: right;
}

#footer .title {
	position: absolute;
	left: 0;
	top: -115px;
}