@charset "utf-8";
/* CSS Document */

/* iPads (landscape) ----------- */

@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {

}



@font-face {
    font-family: 'BebasRegular';
    src: url('font/BEBAS___-webfont.eot');
    src: url('font/BEBAS___-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/BEBAS___-webfont.woff') format('woff'),
         url('font/BEBAS___-webfont.ttf') format('truetype'),
         url('font/BEBAS___-webfont.svg#BebasRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
html,body{
    font-family: 'BebasRegular';
    width:100%;
    height:100%;
}


.navigation{
	position:fixed;
	z-index:1;
	top:20px;
}
.navigation li{
	color:#333333;
	display:block;
	padding: 0 10px;
	line-height:30px;
	margin-bottom:2px;
	font-weight:bold;
	-webkit-transition: all .2s ease-in-out;
	border-bottom:1px solid black;
	text-align:left;
	width:53px;
}
.navigation li:hover,.active{
	font-size:25px;
	cursor:pointer;
	width:100px!important;
}
.glow{
    position:fixed;
    top:10%;
    left:82%;
    width:15%;
    margin-top:1%;
    z-index:1;
    -webkit-animation-name: bild_rotate;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-name: bild_rotate;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    animation-name: bild_rotate;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

@-webkit-keyframes bild_rotate {
    0% { -webkit-transform: rotate(0deg) }
    25% { -webkit-transform: rotate(10deg) }
    75% { -webkit-transform: rotate(-10deg) }
    100% { -webkit-transform: rotate(0deg) }
}

@-moz-keyframes bild_rotate {
    0% { -moz-transform: rotate(0deg) }
    25% { -moz-transform: rotate(10deg) }
    75% { -moz-transform: rotate(-10deg) }
    100% { -moz-transform: rotate(0deg) }
}

@keyframes bild_rotate {
    0% { transform: rotate(0deg) }
    25% { transform: rotate(10deg) }
    75% { transform: rotate(-10deg) }
    100% { transform: rotate(0deg) }
}



.glow2{
    text-align: center;
    width: 20%;
    height: auto;
    -webkit-animation-name: zittern;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: zittern;
    -moz-animation-duration: 1s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: zittern;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes zittern {
    0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }
    10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }
    20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }
    30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
    40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
    50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
    60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
    70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }
    80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }
    90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
    100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}

@-moz-keyframes zittern {
    0% { -moz-transform: translate(2px, 1px) rotate(0deg); }
    10% { -moz-transform: translate(-1px, -2px) rotate(-1deg); }
    20% { -moz-transform: translate(-3px, 0px) rotate(1deg); }
    30% { -moz-transform: translate(0px, 2px) rotate(0deg); }
    40% { -moz-transform: translate(1px, -1px) rotate(1deg); }
    50% { -moz-transform: translate(-1px, 2px) rotate(-1deg); }
    60% { -moz-transform: translate(-3px, 1px) rotate(0deg); }
    70% { -moz-transform: translate(2px, 1px) rotate(-1deg); }
    80% { -moz-transform: translate(-1px, -1px) rotate(1deg); }
    90% { -moz-transform: translate(2px, 2px) rotate(0deg); }
    100% { -moz-transform: translate(1px, -2px) rotate(-1deg); }
}

@keyframes zittern {
    0% { transform: translate(2px, 1px) rotate(0deg); }
    10% { transform: translate(-1px, -2px) rotate(-1deg); }
    20% { transform: translate(-3px, 0px) rotate(1deg); }
    30% { transform: translate(0px, 2px) rotate(0deg); }
    40% { transform: translate(1px, -1px) rotate(1deg); }
    50% { transform: translate(-1px, 2px) rotate(-1deg); }
    60% { transform: translate(-3px, 1px) rotate(0deg); }
    70% { transform: translate(2px, 1px) rotate(-1deg); }
    80% { transform: translate(-1px, -1px) rotate(1deg); }
    90% { transform: translate(2px, 2px) rotate(0deg); }
    100% { transform: translate(1px, -2px) rotate(-1deg); }
}

.slide{
    background-attachment: fixed;
    width:100%;
    height:100%;
    position: relative;
    box-shadow:inset 0px 10px 10px rgba(0,0,0,0.3);
}
.wrapper{
	width:80%;
	height:auto;
	margin:0 auto;
	position:relative;
}
.slideno{
	position:absolute;
	bottom:0%;
	left:0%;
	font-size:700%;
	font-weight:bold;
	color:rgba(255,255,255,0.3);
}
.button{
	display:block;
	width:2.6%;
	height:6%;
	position:absolute;
	bottom:0%;
	left:15%;
	background-color:#9dd53a;
        
	background-image:url(../images/arrow.png);
        background-repeat: no-repeat;
        background-position: center;
}
.button:hover{
	background-color:#494949;
	cursor:pointer;
}

/******************************
 SLIDE 1 
*******************************/
#slide1{
    background:#9dd53a; /* Old browsers */
    background:-moz-linear-gradient(left, #9dd53a 3%, #a1d54f 27%, #80c217 54%, #7cbc0a 80%);  
    background: -webkit-gradient(linear, left top, right top, color-stop(3%,#9dd53a), color-stop(27%,#a1d54f),color-stop(54%,#80c217),color-stop(80%,#7cbc0a));
    background: -webkit-linear-gradient(left, #9dd53a 3%,#a1d54f 27%,#80c217 54%,#7cbc0a 80%);  
    background: -o-linear-gradient(left, #9dd53a 3%,#a1d54f 27%,#80c217 54%,#7cbc0a 80%); 
    background:-ms-linear-gradient(left,#9dd53a 3%,#a1d54f 27%,#80c217 54%,#7cbc0a 80%);  
    background: linear-gradient(to right, #9dd53a 3%, #a1d54f 27%, #80c217 54%, #7cbc0a 80%); 
	
}

#slide1{

   text-align: center;
   rotation: 10%;
}


h1{
    text-align: center;
    color: #000;
    font-size: 200%;
    
}
h2{
    padding-top: 3%;
    text-align: center;
    color: #000;
    font-size: 140%;
    
}

h3{
    color:#000;
    text-align: center;
    font-size: 200%;
    font-family: 'BebasRegular';
    /*margin-top: 3%;*/
}

.tagline{
    text-align: center;
/*    font-family: Leckerli+One, sans-serif;*/
/*    text-shadow: 1px 1px 0px rgba(255, 255, 255, 1);*/
    color:#fff;
    font-weight: bold;
    font-size:1.9em;
    font-family: 'BebasRegular';
    
}

p{
    font-family: ' Rosario ', sans-serif ;
    text-align: center;
    padding: 1.4%;
    color: #fff;
    font-weight: bolder;
    text-shadow: 3px 3px 4px #888;
}


/*
/******************************
 SLIDE 2 
*******************************/
#slide2{
    background: url('../images/pinkineu.png') no-repeat;
    width: 100%;
    height: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

}
#slide2 img:first-child{
    position:absolute;
    top: 100%;
    left: 8%;
}
#slide2 img:nth-child(2){
    position:absolute;
    top:300%;
    left:80%;
}
#slide2 img:nth-child(3){
    position:absolute;
    top:600%;
    left:30%;
}
#slide2 img:nth-child(4){
    position:absolute;
    top:400%;
    left:70%;
}
#slide2 img:nth-child(5){
    position:absolute;
    top:600%;
    right:300%;
}
#slide2 img:nth-child(6){
    position:absolute;
    top:600%;
    right:300%;
}
#slide2 img:nth-child(7){
    position:absolute;
    top:400%;
    right:100%;
}
#slide2 img:nth-child(8){
    position:absolute;
    top:500%;
    left:20%;
}



.elastic-video {
        position: relative;
        padding-bottom: 70%;
        padding-top:10%;
        padding-left: 50%;
        height: 0;
        overflow: hidden;
        
}

.elastic-video iframe {
        position: absolute;
        
        left: 25%;
        width: 50%;
        height: 50%;
        
        border-radius: 10px;
        border:5px solid #000000;
        box-shadow: 10px 10px 20px 0px;
       
      
}
    

/******************************
 SLIDE 3 
*******************************/
#slide3{
	background-color:#005c99;
        padding-top:2%;
        width: 100%;
        height: 100%;
}
#slide3 img:first-child{
	position:absolute;
        margin-top: 20%;
        left: 8%;
}
#slide3 img:nth-child(2){
	position:absolute;
	margin-top:60%;
	left:-10%;
}
#slide3 img:nth-child(3){
	position:absolute;
	top:150%;
	left:300%;
}
#slide3 img:nth-child(4){
	position:absolute;
	top:200%;
	left:50%;
}
#slide3 img:nth-child(5){
	position:absolute;
	top:200%;
	right:100%;
}
#slide3 img:nth-child(6){
	position:absolute;
	top:130%;
	right:50%;
}
#slide3 img:nth-child(7){
	position:absolute;
	top:110%;
	right:80%;
}

.artikel{
    float: left;
/*    margin-top: 3%;*/
    width: 26%;
    margin-left: 40%;
    text-align:left;
    padding-top: 10%;
}


/******************************
 SLIDE 4 
*******************************/

#slide4{
    background: url('../images/streifen.png');
    width: 100%;
    height: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#slide4 .parallaxbg{
    position:absolute;
    right:6%;
    top:5%;
    font-size:230%;
    color:rgba(51,51,51,0.3);
}

.taglinezwei{
    text-align: center;
/*    font-family: Leckerli+One, sans-serif;*/
/*    text-shadow: 1px 1px 0px rgba(255, 255, 255, 1);*/
    color:#000;
    font-size:1.1em;
    
}

.taglinedrei{
    color:#000;
    font-size:1.2em;
    
}

.content{
    width: 50%;
    height:77%;
    background-image: url('../images/pape.png');
    
    position: absolute;
    margin: 4% 10% 8% 28%;
    padding:0 20px 20px 20px;
    -moz-box-shadow: 0 0 5px #888; 
    -webkit-box-shadow: 0 0 5px #888; 
    box-shadow: 0 0 8px #888; 
    border-radius: 12px 12px 0 0 ;
}
        
.content_sub{
    border-radius: 15px;
    border:5px solid black;
    background-color: #000;
    box-shadow: 10px 10px 15px silver;
}

a{
    color: #000;
    font-size: 1.3em;
}


footer{
    width:auto;
    height:2%;
}

.blitz{
    width: 90%;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media screen and (max-width: 480px) {
    
    .navigation{
	position:fixed;
	z-index:1;
	top:20px;
}
   
h1{
    color:#000;
    text-align: center;
    font-size: 200%;
    font-family: 'BebasRegular';
    padding-top: 70%;
  
}

    
    p{
    font-family: ' Rosario ', sans-serif ;
    text-align: center;
    padding: 1.4%;
    color: #fff;
    font-weight: bolder;
    text-shadow: 3px 3px 4px #888;
}
    
#slide2 img:first-child{
    position:absolute;
    padding-top:-15%;
    left: 25%;
    width: 30%;
    height: auto;
}
#slide2 img:nth-child(2){
    position:absolute;
    padding-top:20%;
    left:18%;
    width: 50%;
    height: auto;
}
#slide2 img:nth-child(3){
    position:absolute;
    top:600%;
    left:13%;
}
#slide2 img:nth-child(4){
    position:absolute;
    top:400%;
    left:5%;
    width: 30%;
    height: auto;
}
#slide2 img:nth-child(5){
    position:absolute;
    top:700%;
    right:30%;
    width: 30%;
    height: auto;
}
#slide2 img:nth-child(6){
    position:absolute;
    top:900%;
    right:20%;
    width: 50%;
    height: auto;
}
#slide2 img:nth-child(7){
    position:absolute;
    top:400%;
    right:10%;
    width: 50%;
    height: auto;
}
#slide2 img:nth-child(8){
    position:absolute;
    top:150%;
    left:20%;
    width: 50%;
    height: auto;
}

    
 .elastic-video {
        position: relative;
        padding-bottom: 140%;
        padding-top: 50%;
        padding-left: 10%;
        height: 0;
        overflow: hidden;
        
}

.elastic-video iframe {
        position: absolute;
        left: 10%;
        width: 70%;
        height: 70%;
        border-radius: 10px;
        border:5px solid #000000;
        box-shadow: 10px 10px 20px 0px;
       
      
}   
    #slide3{
	background-color:#005c99;
        width: 100%;
        height: 100%;
}
#slide3 img:first-child{
	position:absolute;
        top: 15%;
        left: 40%;
        width: 70%;
        height: auto;
}
#slide3 img:nth-child(2){
	position:absolute;
	padding-top:-70%;
	left:-42%;
        width: 30%;
        height:auto;
}
 
#slide3 img:nth-child(3){
	position:absolute;
	top:10%;
	left:3%;
        width: 20%;
}
#slide3 img:nth-child(4){
	position:absolute;
	top:40%;
	left: -60%;
        width: 30%;
        height: auto;
}
#slide3 img:nth-child(5){
	position:absolute;
	padding-top:30%;
	right:70%;
        width: 20%;
}
#slide3 img:nth-child(6){
	position:absolute;
	padding-top:100%;
	right:12%;
        width: 30%;
        
}

#slide3 img:nth-child(7){
	position:absolute;
	padding-top:30%;
	left:55%;
        width: 50%;
        
}

.artikel{
    float: left;
/*    margin-top: 3%;*/
    width: 80%;
    margin-left: 10%;
    text-align:left;
    padding-top: 75%;
    font-size: 80%;
    
}

.content{
    padding-top: 40%;
    width: 80%;
    height:auto;
    background-image: url('../images/pape.png');
    right: -5%;
    position: absolute;
    margin-top:25%;
    padding-top: 6%;
    box-shadow: 0 0 8px #888; 
    border-radius: 12px 12px 0 0 ;
}

.taglinezwei{
    text-align: center;
    color:#000;
    font-size:0.8em;
    
}

.taglinedrei{
    color:#000;
    font-size:0.8em;
    
}
    
}