@charset "UTF-8";

* {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	vertical-align:baseline;
	text-decoration: none;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  outline:0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle; }

q, blockquote {
  quotes: none; }
q:before, q:after, blockquote:before, blockquote:after {
    content: "";
    content: none; }

a img {
  border: none; }




/* Communs */
html, body {
  height: 100%; }
  
html {overflow-x: auto; overflow-y: scroll;}
  
#background { position: fixed; top: 0; left: 0; z-index: -1; width: 100%; min-width: 1920px; height: 100%; min-height: 1200px;}

#page {
	position:relative; /* needed for footer positioning*/
	margin:0 auto; /* center, nicht im IE5 */
	min-width:980px;
	max-width: 100%;
	/* width: 980px; */
	height:auto !important;
	height:100%; /* IE6: wird benutzt als min-height*/
	min-height: 100%; /* real browsers */
	/* background: #eeeeee; */
	overflow: hidden;
	z-index: 300;
}


#stage {position: fixed;  width: 100%; height: 100%; top: 0px; left: 0px; margin: 0px; padding: 0px; z-index: 100; overflow: hidden;}
#btn_stage {position: fixed;  width: 100%; height: 100%; top: 0px; left: 0px; margin: 0px; padding: 0px; z-index: 300; overflow: hidden;}
#teaser {position: fixed;  width: 100%; height: 100%; top: 0px; left: 0px; margin: 0px; padding: 0px; z-index: 200; overflow: hidden;}

#fader {position: fixed; width: 100%; height: 100%; left : 0px; top: 0px; background: #ffffff; z-index: 500;}
#fader span {position: absolute; width: 100%; height: 90%; top: 0px; left: 0px; background: url(../bilder/loader.gif) no-repeat center center; display: block;}


/* button elemente */
#about, #logbook, #crew, #manifesto, #work, #contact, #imprint, #home {position: absolute; /* background: #0f0; */}
#about, #logbook, #crew, #manifesto, #work {z-index: 310;}
#contact, #imprint, #home {z-index: 305;}
#about a, #logbook a, #crew a, #manifesto a, #work a, #contact a, #imprint a, #home a {position:absolute; display: inline-block;  /* background: #f00; */}
.social {position: absolute; /* background: #0f0; */}
.social a {position:absolute; display: inline-block;  /* background: #f00; */}

#home {left: 20px; top: 20px;}
/* #btn_rocket{position: absolute; width: 200px; height: 360px; left: 0px; bottom: 0px; display: block; z-index: 303;} */


/* teaser */
#home-teaser {position: absolute; width: 661px; height: 360px; left: 0px; bottom: 0px; background: url(../bilder/flb_home.png) no-repeat; }
#about-teaser {position: absolute; width: 369px; height: 407px; left: 0px; bottom: 0px; background: url(../bilder/flb_about.png) no-repeat; }
#crew-teaser {position: absolute; width: 633px; height: 233px; right: 0px; bottom: 0px; background: url(../bilder/flb_crew.png) no-repeat; }
#logbook-teaser {position: absolute; width: 222px; height: 209px; left: 0px; bottom: 0px; background: url(../bilder/flb_logbook_arm.png) no-repeat; }


/* stage elemente */
.yellow1 {position: absolute; width: 31px; height: 31px; background: url(../bilder/flb_circle_yellow1.png) no-repeat; z-index: 110;}
.yellow2 {position: absolute; width: 21px; height: 21px; background: url(../bilder/flb_circle_yellow2.png) no-repeat; z-index: 110;}
#rocket {position: absolute; width: 222px; height: 155px; left: -222px; top: 1000px; background: url(../bilder/flb_rocket.png) no-repeat;}

/* page elemente */
#logo {position: absolute; width: 424px; height: 207px; right: 0px; top: 0px; background: url(../bilder/flb_logo.png) no-repeat;}

#about-page {position: relative; min-height: 600px; }
#imprint-page {position: relative; min-height: 900px; }
#crew-page {position: relative; min-height: 800px; }
#logbook-page {position: relative; min-height: 600px; }
#manifesto-page {position: relative; min-height: 600px; }
#contact-page {position: relative; min-height: 400px;}
#work-page {position: relative; min-height: 600px;}

.page a.close {
	display:inline-block;
	position: absolute;
	width: 23px; height: 24px;
	right: 10px; top: 10px; 
	background:url("../bilder/flb_btn_close.png") no-repeat;
	}
.page .container { z-index: 330;}
#contact-page .box, #contact-page .exit {z-index: 301;}
.social {z-index: 340;}


/* schriften */
h1, .crew-name, .logbook-index a,.logbook-index a:hover {	
	color: #ca0580;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 20px;
    font-style: italic;
    font-weight: bold;
    line-height: 24px;
    text-decoration: none;}
p, .crew-description {	
	padding-top: 5px;
	color: #666;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: normal;
    line-height: 20px;
    text-decoration: none;}
.link {
	color: #ca0580;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: bold;
    line-height: 20px;
    text-decoration: none;}


/* about-page */
#about-page .container {position: absolute; bottom: 200px; left: 200px;}
#about-page .box {position: relative; width: 435px; background: #ffffff;}
#about-page .shader {position: absolute; width: 435px; height: 100%; background: #b6035f; opacity: 0.8; left: 20px; top: 30px; }
#about-page .box {	
-moz-transform: rotate(-5deg);
-webkit-transform: rotate(-5deg);
-o-transform: rotate(-5deg);
-ms-transform: rotate(-5deg);
transform: rotate(-5deg); }
#about-page .content {padding: 15px;}

/* manifesto-page */
#manifesto-page .container {position: absolute; width: 610px; height: 340px;  margin: auto;  left: 10%; right: 10%; bottom: 20%;}
#manifesto-page .box {position: absolute; width: 610px; height: 340px; background: #ffffff; opacity: 1;}	
#manifesto-page a.btn-left {
	display:inline-block;
	position: absolute;
	width: 22px; height: 47px;
	left: 23px; top: 145px; 
	background:url("../bilder/flb_arrow_lft.png") no-repeat;
	}
#manifesto-page a.btn-right {
	display:inline-block;
	position: absolute;
	width: 22px; height: 47px;
	right: 23px; top: 145px; 
	background:url("../bilder/flb_arrow_rgt.png") no-repeat;
	}
#manifesto-page a.btn-left:hover, #manifesto-page a.btn-right:hover{background-position: 0px -47px;}
#manifesto-page .content {position: absolute; width: 420px; left: 95px; top: 100px;}
#manifesto-page .content div{position: relative;}
#manifesto-page .shader {position: absolute; width: 610px; height: 340px; background: #b6035f; opacity: 0.8; left: 10px; top: 20px; }
#manifesto-page .content span{color: #ca0580;}
#manifesto-page .shader {	
-moz-transform: rotate(5deg);
-webkit-transform: rotate(5deg);
-o-transform: rotate(5deg);
-ms-transform: rotate(5deg);
transform: rotate(5deg); }


/* crew-page */
.crew-btn {z-index: 301;}
#astro1 {position: absolute; width: 198px; height: 227px; right: 482px; bottom: 65px; background:url("../bilder/flb_astro1.png") no-repeat; display:inline-block;}
#astro1:hover {background-position: 0px -227px;}					
#astro2 {position: absolute; width: 158px; height: 175px; right: 414px; bottom: 307px; background:url("../bilder/flb_astro2.png") no-repeat; display:inline-block;}
#astro2:hover {background-position: 0px -175px;}
#astro3 {position: absolute; width: 150px; height: 279px; right: 250px; bottom: 173px; background:url("../bilder/flb_astro3.png") no-repeat; display:inline-block;}
#astro3:hover {background-position: 0px -279px;}
#astro4 {position: absolute; width: 150px; height: 250px; right: 124px; bottom: 184px; background:url("../bilder/flb_astro4.png") no-repeat; display:inline-block;}
#astro4:hover {background-position: 0px -250px;}
#astro5 {position: absolute; width: 115px; height: 161px; right: 25px; bottom: 259px; background:url("../bilder/flb_astro5.png") no-repeat; display:inline-block;}
#astro5:hover {background-position: 0px -161px;}

#crew-page .container {position: absolute; top: 10%; left: 200px;}
#crew-page .box {position: relative; width: 435px; background: #ffffff;}
#crew-page .content {padding: 15px;}
#crew-page .shader {position: absolute; width: 435px; height: 100%; background: #b6035f; opacity: 0.8; left: 20px; top: 30px; }
#crew-page .box {	
-moz-transform: rotate(-5deg);
-webkit-transform: rotate(-5deg);
-o-transform: rotate(-5deg);
-ms-transform: rotate(-5deg);
transform: rotate(-5deg); }
#crew-page .image-container {position: absolute; right: 200px; bottom: 10%; z-index: 331;}
#crew-page .image-box {position: relative; background: #fff; padding: 15px; padding-top: 45px;}
#crew-page .image-shader {position: absolute; width: 217px; height: 100%; background: #b6035f; opacity: 0.8; left: 20px; top: 20px; }
#crew-page .image-box {	
-moz-transform: rotate(6deg);
-webkit-transform: rotate(6deg);
-o-transform: rotate(6deg);
-ms-transform: rotate(6deg);
transform: rotate(6deg); }
#crew-page .image-shader {	
-moz-transform: rotate(9deg);
-webkit-transform: rotate(9eg);
-o-transform: rotate(9deg);
-ms-transform: rotate(9deg);
transform: rotate(9deg); }
#crew-page a.crew-close {
	display:inline-block;
	position: absolute;
	width: 23px; height: 24px;
	right: 10px; top: 10px; 
	background:url("../bilder/flb_btn_close.png") no-repeat;
	}
#crew-page .crew-name {display: block; padding-top: 5px;}


/* logbook-page */
#logbook-page .container {position: absolute; width: 706px; height: 540px;  margin: auto;  right: 10%;  left: 10%; bottom: 10%; background:url("../bilder/flb_logbook.png") no-repeat;}
#logbook-page a.btn-left {
	display:inline-block;
	position: absolute;
	width: 22px; height: 47px;
	left: 7px; top: 240px; 
	background:url("../bilder/flb_arrow_lft.png") no-repeat;
	}
#logbook-page a.btn-right {
	display:inline-block;
	position: absolute;
	width: 22px; height: 47px;
	right: 7px; top: 240px; 
	background:url("../bilder/flb_arrow_rgt.png") no-repeat;
	}
#logbook-page a.close {
	display:inline-block;
	position: absolute;
	width: 23px; height: 24px;
	right: 60px; top: 25px; 
	background:url("../bilder/flb_btn_close.png") no-repeat;
	}
#logbook-page a.btn-left:hover, #logbook-page a.btn-right:hover{background-position: 0px -47px;}
#logbook-page .logbook-index {position: absolute; width: 240px; height: 450px;  left: 67px; top: 55px; overflow: hidden;}
#logbook-page .logbook-index  a {display: block; padding-bottom: 20px;}
#logbook-page .content {position: absolute; width: 260px; height: 450px;  left: 377px; top: 50px; overflow: hidden;}
#logbook-page .content div{position: relative;}
#logbook-page .content div img {padding-top: 10px; padding-bottom: 5px;}


/* work-page */
#work-page .container {position: absolute; width: 670px; height: 490px;  margin: auto;  left: 10%; right: 10%; bottom: 10%;}
#work-page .box {position: absolute; width: 670px; height: 490px; background: #ffffff; opacity: 1;}	
#work-page a.btn-left {
	display:inline-block;
	position: absolute;
	width: 22px; height: 47px;
	left: 23px; top: 220px; 
	background:url("../bilder/flb_arrow_lft.png") no-repeat;
	}
#work-page a.btn-right {
	display:inline-block;
	position: absolute;
	width: 22px; height: 47px;
	right: 23px; top: 220px; 
	background:url("../bilder/flb_arrow_rgt.png") no-repeat;
	}
#work-page a.btn-left:hover, #work-page a.btn-right:hover{background-position: 0px -47px;}
#work-page .content {position: absolute; width: 480px; height: 450px;  left: 95px; top: 20px; overflow: hidden;}
#work-page .content div{position: relative;}
#work-page .content div img {padding-top: 10px; padding-bottom: 5px;}
#work-page .content span{color: #ca0580;}
#work-page .shader {position: absolute; width: 670px; height: 490px; background: #b6035f; opacity: 0.8; left: 10px; top: 20px; }
#work-page .shader {	
-moz-transform: rotate(5deg);
-webkit-transform: rotate(5deg);
-o-transform: rotate(5deg);
-ms-transform: rotate(5deg);
transform: rotate(5deg); }


/* contact-page */
#contact-page .box {position: absolute; width: 420px; height: 448px; left: 200px; bottom: 0px; background: url(../bilder/flb_contact_monitor.png) no-repeat;}
#contact-page .content {position: absolute; width: 300px; left: 60px; bottom: 200px; background: #ffffff; padding: 15px;}
#contact-page .content a, #contact-page .content a:hover {color: #ca0580;}
#contact-page a.exit {
	display:inline-block;
	position: absolute;
	width: 116px; height: 71px;
	left: 740px; top: 345px; }
#contact-background{position: fixed; top: 0; left: 0; width: 100%; min-width: 1920px; height: 100%; min-height: 1200px;}

/* imprint-page */
#imprint-page .container {position: absolute; top: 75px; left: 200px;}
#imprint-page .box {position: relative; width: 435px; background: #ffffff;}
#imprint-page .content { padding: 15px;}
#imprint-page .shader {position: absolute; width: 435px; height: 100%; background: #b6035f; opacity: 0.8; left: 0px; top: 20px; }
#imprint-page .box {	
-moz-transform: rotate(-5deg);
-webkit-transform: rotate(-5deg);
-o-transform: rotate(-5deg);
-ms-transform: rotate(-5deg);
transform: rotate(-5deg); }
#imprint-page .shader {	
-moz-transform: rotate(-3deg);
-webkit-transform: rotate(-3deg);
-o-transform: rotate(-3deg);
-ms-transform: rotate(-3deg);
transform: rotate(-3deg); }
#imprint-page .content a,#imprint-page .content a:hover {color: #ca0580;}