
/*
* {
   margin:0px;
   padding:0px;
}
html{
   height: 100%;
}
body{
   padding: 0;
   color: black;
   background-color: black;
   font: 12px/12px Verdana, Geneva, sans-serif bold;
   height: 100%;
   overflow:hidden;
}
*/
canvas { width: 100%; height: 100%; position:absolute; z-index:2 }

#ng-container{
   background:transparent url(/images/intro/hintergrund.png) 0 0px no-repeat;
    /* background: -webkit-gradient(linear, left top, left bottom, from(#F0F2F3), to(#B4B8BB));*/
   /*-webkit-perspective: 0px;
   -webkit-perspective-origin: 0% 0%;
   -moz-perspective: 0px;
   -moz-perspective-origin: 0% 0%;
   -ms-perspective: 0px;
   -ms-perspective-origin: 0% 0%;
   perspective: 600px;
   perspective-origin: 0% 0%;*/

   width: 982px;/*100%;*/
   height: 299px;/*100%;*/  
   color:white;
/*   margin: 100px auto 0;*/
   position: relative;
   overflow:hidden;
}


#ng-geraet {
	position: absolute; 
	z-index:1;
	top: 10px;
	left: 150px;/*670px;*/
   -webkit-transform: translate3d(80px, 0px, 0px) rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1);
   -moz-transform: translate3d(80px, 0px, 0px) rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1);
   -ms-transform: translate3d(80px, 0px, 0px) rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1); 
   transform: translate3d(80px, 0px, 0px) rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1); 
}

.ng-bewegt {  
   -webkit-transform-style: preserve-3d;
   -webkit-animation-name: bewegtani;
   -webkit-animation-duration: 3s;
   -webkit-animation-iteration-count: infinite;
   -webkit-animation-timing-function: linear;

   -moz-transform-style: preserve-3d;
   -moz-animation-name: bewegtani;
   -moz-animation-duration: 3s;
   -moz-animation-iteration-count: infinite;
   -moz-animation-timing-function: linear;

   -ms-transform-style: preserve-3d;
   -ms-animation-name: bewegtani;
   -ms-animation-duration: 3s;
   -ms-animation-iteration-count: infinite;
   -ms-animation-timing-function: linear;

   transform-style: preserve-3d;
   animation-name: bewegtani;
   animation-duration: 3s;
   animation-iteration-count: infinite;
   animation-timing-function: linear;
}
.ng-pause {
    -webkit-animation-play-state:paused;
    -moz-animation-play-state:paused;
    -o-animation-play-state:paused; 
    animation-play-state:paused;   
}

@-webkit-keyframes bewegtani {
   from {-webkit-transform: rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
   50% {-webkit-transform: rotate3d(0, 1, 0.2,  10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
   to{-webkit-transform: rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
}
@-moz-keyframes bewegtani {
   from {-moz-transform: rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
   50% 	{-moz-transform: rotate3d(0, 1, 0.2,  10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
   to 	{-moz-transform: rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
}
@-ms-keyframes bewegtani {
   from {-ms-transform: rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
   50% {-ms-transform: rotate3d(0, 1, 0.2,  10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
   to{-ms-transform: rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
}
@-keyframes bewegtani {
   from {transform: rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
   50% {transform: rotate3d(0, 1, 0.2,  10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
   to{transform: rotate3d(0, 1, 0.05, -10deg) scale3d(1, 1, 1) translate3d(80px, 0px, 0px);}
}



#ng-textbox_butterfly , #ng-textbox {
	width: 360px;
	height: 299px;
	background-color: #f5f5f6;
	position: absolute;
	top:0px; 
	right: 40px;
	z-index:3
}
#ng-textbox_butterfly h2, #ng-textbox h2 {
	color: #2e4979;
	font-size: 26px;
	line-height: 36px;
	font-weight: normal;
	position: relative;
	width: 300px;
	top: 40px;
	left: 30px;
}
#ng-textbox_butterfly p, #ng-textbox p {
	color: #2e4979;
	font-size: 16px;
	line-height: 22px;
	font-weight: normal;
	position: relative;
	left: 30px;
	top:40px;
/*	top: 135px;*/
	
}
#ng-textbox_butterfly img, #ng-textbox img {
	border: 0;
	position: relative;
	left: 30px;
	top: 20px;
/*	top: 203px;*/
}
#ng-textbox_butterfly  a.button, #ng-textbox  a.button {
   position: relative;
   top: 40px;
   left: 30px;
}   
#ng-textbox_butterfly a span, #ng-textbox  a span {display:inline-block; vertical-align:bottom; color:white; font-weight:bold}
#ng-textbox_butterfly .button_left, #ng-textbox .button_left{background:transparent url(/images/intro/button_left.png) 0 0 no-repeat; width:11px; height:25px;}
#ng-textbox_butterfly .button_text, #ng-textbox .button_text{background:transparent url(/images/intro/button_middle.png) 0 0 repeat-x; height:25px; line-height:23px;}
#ng-textbox_butterfly .button_right, #ng-textbox .button_right{background:transparent url(/images/intro/button_right.png) 0 0 no-repeat; width:17px; height:25px;}
clearfix:after {
    .content: ".";
    display: block;
    height: 0px;
   margin: 0px;
   padding: 0px;
    clear: both;
   visibility: hidden;
   overflow:hidden;
   font-size: 0px;
}

.clearfix {
   display: inline-block;
}


