/* Basic Elements and Objects */

*{outline: 0;}

body
{
	font-size: 11px; 
	letter-spacing: 1px;
	line-height: 150%;	
	padding: 0px;
	margin: 0px;
	overflow-x: hidden;
	background-color: #413b42;
	color: #fff;
	font-family: 'Merriweather', serif;
}



.Loading {
	position: fixed;
	margin: auto;
	top: 40%;
	height: 21%;
	z-index: 9999;
/* 	background: url('http://marbertrocel.com/relaunch/images/interaction/vogel.png') center  no-repeat; */
	background-size: contain; 
}



/* Hyperlinks */

a:link {}
	
a:link, a:visited, a:active {
	color: #fff;
	text-decoration:none;
}

a:hover {
	color: #999;
	text-decoration:none;
}


/* Text */
.TextTiny { font-size: 9px; }
.TextSmall { font-size: 10px; }
.TextNormal { font-size: 11px; }
.TextBig { font-size: 15px; }
.TextLarge { font-size: 21px; }
.TextHuge { font-size: 28px; }






.Page { 
	padding: 0px;
	margin: auto;
}

.Footer { width: 100%; color: #aaa; }

.Footer span { margin-right: 20px; }

.SubPage {
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 100%; 
	overflow-x: hidden;
}

.SubPage > img { width: 600px; }

.SubPage .TextBody { width: 600px; margin: auto; color: #fff; color: #999;}

.TextBody { text-align: left;}

.BeamMeBack { position: fixed; top: 100px; height: 100px; width: 50px; background-color: #fff; padding: 6px; cursor: pointer;}
.BeamMeBack { background-image: url('../images/presskit.png');  background-size: 50px;}

.BuyLogo { margin-right: 20px; }




/* Backgrounds */

.BG_Ground {

	background-image: url('../images/erde.png'); 
	background-repeat: repeat;
	/* background-position: center center; */
}

.BG_Dark {

	background-image: url('../images/kachel.png'); 
	background-repeat: repeat;
	/* background-position: center center; */
}

.BG_Fixed {
	background-attachment: fixed;
}





/*  Layers */

* {z-index: 3;}

.Underground { z-index: 1; }

.Background {z-index: 2;}

.BehindCover { z-index: 3;}

.Cover, .CoverLeft, .CoverRight { z-index: 4; }

.Vignette {z-index: 5;}

.BeforeVignette {z-index: 6;}

.Foreground {z-index: 7;}

.OnTop {z-index: 8;}

.ReallyOnTop {z-index: 10;}

.SubPage {z-index: 11;}



/*  World View */

.WorldWidth { width: 700px; left: calc(50% - 350px); }

.WorldDepthEnllax { left: 0px; width: 100%; }

.WorldDepthSkollr { }

.SkyWidth { margin: auto; }

.Ground { top: 0px; height: 100% !important; }

.CoverLeft { position: fixed; top: 0px; left: 0px; width: calc(50% - 300px); height: 100%; }

.CoverRight { position: fixed; top: 0px; right: 0px; width: calc(50% - 300px); height: 100%; } 



/*  Objects */

.Ready { top: 280px; }


.ObjectWidth { width: 700px; left: calc(50% - 350px); }

._Object { border: dotted 1px rgba(255, 255, 255, 0.13); }
._Object:hover{border: dotted 1px rgba(255, 255, 255, 0.2);}

.Object {
	/* background-size: contain; */
	background-repeat: no-repeat;
	background-position: center center;
}

.Interaction { cursor: pointer; }



.CloudRight { width: 900px; top: 5px; right: 23%; }
.CloudRight { background-image: url('../images/clouds/cloud2.png'); }
.CloudLeft { width: 1000px; left: 20%; }
.CloudLeft { background-image: url('../images/clouds/cloud1.png'); }

.CloudBelowRight { width: 900px; top: 5px; right: 23%; }
.CloudBelowRight { background-image: url('../images/clouds/cloudu2.png'); }
.CloudBelowLeft { width: 1000px; left: 20%; }
.CloudBelowLeft { background-image: url('../images/clouds/cloudu1.png'); }


.Nebel { background-image: url('../images/clouds/clouds.png') }


.WeltOben { background-image: url('../images/weltoben.png'); }
.BogenOben { background-image: url('../images/stars.png'); }

.WeltUnten { background-image: url('../images/weltunten.png'); }



.Vogel.Interaction {}
.Vogel.Interaction { background-image: url('../images/interaction/vogel.png'); }
.Vogel.Interaction:hover { background-image: url('../images/interaction/vogelroll.png');}


.Baum.Interaction {}
.Baum.Interaction { background-image: url('../images/interaction/baum.png'); }
.Baum.Interaction:hover { background-image: url('../images/interaction/baumroll.png');}
 
.Fels { background-image: url('../images/fels3neu.png'); }
 

.Hand.Interaction {}
.Hand.Interaction { background-image: url('../images/interaction/hand.png'); }
.Hand.Interaction:hover { background-image: url('../images/interaction/handroll.png');}
.HandHover.Interaction { background-image: url('../images/interaction/handroll.png');}

.HandForm1 { background-image: url('../images/form/form4.png'); }
.HandForm2 { background-image: url('../images/form/form2.png'); }
.HandForm3 { background-image: url('../images/form/form3.png'); }
.HandForm4 { background-image: url('../images/form/form1.png'); }


.Pferd.Interaction {}
.Pferd.Interaction { background-image: url('../images/interaction/pferd.png'); }
.Pferd.Interaction:hover { background-image: url('../images/interaction/pferdroll.png');}



.Floet.Interaction {}
.Floet.Interaction { background-image: url('../images/interaction/flute.png'); }
.FloetHover.Interaction { background-image: url('../images/interaction/fluteroll.png');}
.FloetDummy { background-image: none; }



/* Object Hover Interaction */

.Hue
{
	filter: hue-rotate(0);
	-webkit-filter: hue-rotate(0);
	-moz-filter: hue-rotate(0);
	-o-filter: hue-rotate(0);
	-ms-filter: hue-rotate(0);
}

.Hue:hover
{
	filter: hue-rotate(180deg);
	transition: -webkit-filter 2s linear, filter 2s linear;
	-webkit-filter: hue-rotate(180deg);
	-moz-filter: hue-rotate(180deg);
	-o-filter: hue-rotate(180deg);
	-ms-filter: hue-rotate(180deg);
}


.Outline:hover {

    -webkit-filter: drop-shadow(2px 1px 0 white) drop-shadow(-1px -1px 0 white);
    filter:drop-shadow(2px 1px 0 black) drop-shadow(-1px -1px 0 white);


}



/* Vignette */

.Vignette {
	 background: -webkit-radial-gradient(rgba(0,0,0,0), rgba(0,0,0,1)); /* For Safari 5.1 to 6.0 */
	 background: -o-radial-gradient(rgba(0,0,0,0), rgba(0,0,0,1)); /* For Opera 11.1 to 12.0 */
	 background: -moz-radial-gradient(rgba(0,0,0,0), rgba(0,0,0,1)); /* For Firefox 3.6 to 15 */
	 background: radial-gradient(rgba(0,0,0,0), rgba(0,0,0,1)); /* Standard syntax (must be last) */
}

.Vignette {position: fixed; top: 0px; left: 0px; height: 100%; width: 100%; opacity: 0.6;}



/* Slider */

.Slider { width: 640px; height: 469px; overflow: hidden; padding: 0px; margin: auto;}
.Slider > .SliderCanvas { width: 100%; height: 100%; left: 0px; top: 0px; text-align: center; padding: 0px; margin: 0; }
.Slide { position: relative; margin: 0px; padding: 0px; height: 100%; }
.Slide > img { display: inline; width: 100%; height: 100%; padding: 0px; margin: 0px;}


/* Preloader */
.Preloader {position: absolute; top: -9999px; left: -9999px;}



/* Media Control */
.TooNarrow { display: none; }



// Enhance Scrolling Performance

div {
   -webkit-backface-visibility: hidden; /* Chrome, Safari, Opera */
	-webkit-perspective: 1000;
   backface-visibility: hidden;  
   background-attachment: fixed;
    
   -webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	transform: translateZ(0);
}



/* Blink */

.Blink {
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;

    -moz-animation-name: blinker;
    -moz-animation-duration: 1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;

    animation-name: blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@-moz-keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.2; }
    100% { opacity: 1.0; }
}

@-webkit-keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.2; }
    100% { opacity: 1.0; }
}

@keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.2; }
    100% { opacity: 1.0; }
}
