html, body{
  height: 100%;
  width: 100%;
  font-family: "Open Sans", Helvetica Neue, Arial;
  position: relative;
  background: #fafafa !important;
}

@keyframes fadeIN {
    0% { opacity: 0;}
    100% { opacity: 1;}
}

@keyframes fadeINRight {
    0% { opacity: 0; transform: translate(0);}
    100% { opacity: 1; transform: translate(-300px);}
}



@keyframes rotate {
    from {transform: rotate(0deg); opacity:0;}
    to {transform: rotate(360deg); opacity:100;}
}


@keyframes ZoomInOut {
    0% {width: 120%;}
    45% {width: 100%;}
  55% {width: 100%;}
  95% {width: 120%;}
  100% {width: 120%;}
}


.opacity_none{
  opacity:0;
}


/*.start_page{
  background: url('../images/start.png') no-repeat scroll center bottom / cover ;
  width:100%;
  display: table;
  height: 100%;
    padding: 0;
  top:0;
  position: absolute;
  color: #fff;
}*/

.start_page h1{
    line-height: 1.2;
}


.start_page a{
  color: #fff;
}


.start_page h2{
  line-height: 1.5;
}


.blue_shadow{  


background: rgba(0,0,0,0.3);
background: -moz-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.3) 27%, rgba(0,0,0,0.14) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0.3)), color-stop(27%, rgba(0,0,0,0.3)), color-stop(100%, rgba(0,0,0,0.14)));
background: -webkit-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.3) 27%, rgba(0,0,0,0.14) 100%);
background: -o-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.3) 27%, rgba(0,0,0,0.14) 100%);
background: -ms-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.3) 27%, rgba(0,0,0,0.14) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.3) 27%, rgba(0,0,0,0.14) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );

   width: 100%;
   height: 100%;
   position:absolute;
}


.background{
  width: 100%;
  height:100%;
  background: url(../images/led_empfang.png) no-repeat center center fixed;
  background-size: cover; 
  position: fixed;
  z-index: -10;
  top:0;
}

.white{
  color: #fff;
}

.spacer60{
  padding-top: 60px;
}


.spacer80{
  padding-top: 80px;
}

.middle{
  margin: 0 auto;
}

/*Nav*/
.navbar-inverse{
  background: #fafafa;
  box-shadow: 0 5px 5px -5px rgba(46, 46, 46, 0.15);
  z-index:100;
  border-bottom: 10px solid #048e34;
transition: opacity 0.5s ease-in;
}

.navbar-brand{
  height: 100px;
  padding-top: 30px;
  padding-bottom:0;
  
}

.logo{
  height:70px;
}
.navbar-nav{
  margin-top: 60px;  
  font-size: 20px;
  color: #414140;
}

.navbar-nav > li {
    margin-right: 10px;
}

.navbar-inverse .navbar-nav > li > a {
    transition: color 0.5s ease-out;
  color: #414140 !important;
  padding: 10px 15px;
  background: none !important;
}

.navbar-nav li span{
  border-top-right-radius:5px;
  border-top-left-radius:5px;
  height:0px;
  background: #048e34;
  display: block;
  position: absolute;
  bottom:0;
  width: 100%;
  z-index: 0;
  transition: height 0.5s ease-out;
}


.navbar-nav li:hover span{
  background: #048e34;
  border-top-right-radius:5px;
  border-top-left-radius:5px;
  height: 40px;
  transition: height 0.5s ease-out;
}

.navbar-nav li:hover a{
  color: #ffffff !important;
}

li .active a, .navbar-inverse .navbar-nav > .active > a{
  color:#ffffff !important;
   
}




.navbar-inverse .navbar-nav > .active > span, .navbar-inverse .navbar-nav > .active > span:focus, .navbar-inverse .navbar-nav > .active > a:hover span {
    background: #048e34;
  border-top-right-radius:5px;
  border-top-left-radius:5px;
  height: 40px;
  transition: height 0.5s ease-out;
}



/*second nav*/

#second_nav{
  height:0px;
  opacity:0;
  background: #048e34;
  margin-top: 100px;
  transition: all 0.5s ease;

}

#second_nav ul{
  height:40px;
  margin-top:0;
  margin: 0 auto;
  display: table;
}

#second_nav li{ 
  float:left;
}

#second_nav a{ 
  font-size: 14px;
  color: rgba(255,255,255,1);
  opacity: inherit;
}

#second_nav a:hover{ 
  color: rgba(255,255,255,0.5);
  background:none !important;
}

#second_nav a:focus{ 
  background:none !important;
}


/*font*/

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1;
  margin: 30px 0;
  font-family: "Open Sans", Helvetica Neue, Arial;
}

h2{
  font-size: 50px;  
  letter-spacing: -3px;
  display: inline-block;

}

h2 small{
  font-weight: 200;
}
.mainheader {
  margin-top: 100px;
}

.white_h2, .white_h2 small{
  color: #ffffff;
  letter-spacing: -2px;
}

/*andere Schriften */

small p, small{
  font-size: 14px;
  font-weight: 200;
}


.bg{
  background:#fafafa;
}


/* buttons*/

.btn{
  border-radius: 5px;
  text-decoration: none;
  padding: 10px 20px;
  font-size: 20px;
    margin: 20px auto;
  
}

.button_green{
  color: #048e34 ;
    border: 1px solid #048e34 ;  
  display: table;
  transition: all  0.2s ease
}



.button_green:hover{
  color: #ffffff ;
  background: #048e34;
}



.button_blue{
    color: #ffffff ;
    border: 1px solid #ffffff ;  
    display: table;
    background: linear-gradient(to left, transparent 50%, #ffffff 50%);
    background-size: 200% 100%;
    background-position:right bottom;
    transition:all 1s ease-in;
}

.button_blue:hover{
   background-position:left bottom;
   color: #0462ad ;
}



.content_container{
  padding: 40px 15px;  
}

.section{
  height: auto !import;
  min-height: 100%;
  overflow: hidden;
  background:#fafafa;
}

/*home*/

.home-section{
  height: auto !import;
  /*min-height: 100%;*/
  overflow: hidden;
  padding-top: 110px;
  background:#fafafa;
}


.price{
  background: #048e34 none repeat scroll 0 0;
    border-radius: 5px;
    color: #ffffff;
    display: inline-block;
    padding: 10px 0;
    text-align: center;
    width: 97px;
}



.pricelabel{
  width: 500px;
  margin: 0 10px 20px 0;
  display: inline-block;
  line-height: 40px;
  font-weight: normal;
}



.commercial{
  opacity: 0;
  animation: fadeIN 1s ease-in 1s;
  animation-fill-mode: forwards;  
  margin-top:40px;
}

#home h2{
   opacity: 0;
   animation: fadeIN 0.5s ease-in 0.2s;
   animation-fill-mode: forwards;  
}

.fade{
   opacity: 0;
   animation: fadeIN 1s ease-in 1.1s;
   animation-fill-mode: forwards;  
}

.start_commercial{
  float: right;
  opacity: 0;
  margin: 40px -300px 0 0; 
  animation: fadeINRight 0.5s ease-in 1.5s;
  animation-fill-mode: forwards;  
}

  .right{
    float:right;
  }
  
  .right:after{
    clear:both;
  }
  
  .left{
    float:left;
  }
  



/*about us

#ueberuns{

background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(250,250,250,0.76) 34%, rgba(250,250,250,1) 45%, rgba(250,250,250,1) 46%, rgba(250,250,250,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(34%, rgba(250,250,250,0.76)), color-stop(45%, rgba(250,250,250,1)), color-stop(46%, rgba(250,250,250,1)), color-stop(100%, rgba(250,250,250,1)));
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(250,250,250,0.76) 34%, rgba(250,250,250,1) 45%, rgba(250,250,250,1) 46%, rgba(250,250,250,1) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(250,250,250,0.76) 34%, rgba(250,250,250,1) 45%, rgba(250,250,250,1) 46%, rgba(250,250,250,1) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(250,250,250,0.76) 34%, rgba(250,250,250,1) 45%, rgba(250,250,250,1) 46%, rgba(250,250,250,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(250,250,250,0.76) 34%, rgba(250,250,250,1) 45%, rgba(250,250,250,1) 46%, rgba(250,250,250,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#fafafa', GradientType=0 );
}*/

.seperator_blue {
  width: 100%;
  height: 160px;
  background: rgba(4,98,173,0.4);  
}

.seperator_blue :after{
  clear: both;
}

.seperator_blue  h2, .seperator_blue  h2 small{
  color: #ffffff;
  float: right;
  margin: 30px 25% 30px 0;
  display: block;
  text-shadow: 2px 1px 1px rgba(173, 173, 173, 0.72);
}

.seperator_blue  h2{
  width: 300px;
}


.marketing .col-md-3, .marketing .col-sm-6{
  text-align: center;
}

.marketing p{
  margin-top: 20px;
}



.section {
  min-height: 0 !important;
}

.rotate{
  animation-name: rotate; 
    animation-duration: 1.5s; 
    animation-iteration-count: 1;
    animation-timing-function: linear;
  animation-fill-mode: forwards;
}

#years{
  color: #048e34;
    display: block;
    font-size: 140px;
    font-weight: 200;
    height: 140px;
    line-height: 1;
    margin: 0 auto;
    padding: 0;
    width: 140px;
}

.marketingFade, #wheel{
  opacity: 0;
}



/*contact*/



#kontakt{
  background: rgba(4,98,173,0.8);  
}

#contactForm{
  padding-top: 20px;
}



.form-group label {
  color:#ffffff;
}

.glyphicon-ok{
  color: green;
  top: 26px !important;
}

.glyphicon-warning-sign{
  color: red;
  top: 33px !important;
}
#contactForm label.error {
  display: none !important;
}



.cc_width{
  width: 100%;
}

.white a {
  color: #ffffff;
}

.white a:hover {
  color: rgba(255,255,255,0.5);
  text-decoration: none;
}


.socialMedia{
  text-align: right;
}
.socialMedia a{
  text-align: right;
  margin-left:10px;
}



/*Leistungen*/

.benefits{
  overflow:hidden;
  width: 100%;
  height: 300px;
  
}

.benefits img{
  width: 120%;
  animation-name: ZoomInOut; 
    animation-duration: 20s; 

    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.z1{
  animation-delay:0s;
  float:right;
}

.z2{
  animation-delay:3s;
}

.z3{
  animation-delay:9s;
  float:right;
}

.z4{
  animation-delay:2
}


.description h2{
  font-size: 30px;
  color:#0462ad;
  margin-top:0;
}

.description{
  padding-left: 40px;
}




.icon{
  margin-right: 10px;
}


/*team*/

.team_image{
  width:100%;
}

.thumbnail img{
  border-top-left-radius:4px;
  border-top-right-radius:4px;
}

.caption h3{
  margin-bottom:10px;
}

.jobtitle{
  margin-bottom:13px;
  display:block
}


/*anfahrt*/

#anfahrt{
  min-height: 0 !important;
}

#map{
  width:100%;
  height: 350px;
}
#mapabo{
  width:100%;
  height: 350px;
}



/*footer*/

footer{
  background:#048e34;
  min-height:60px;
}

footer a{
  color: #ffffff;
  margin-right:20px;
}

footer a:hover{
  color: #ffffff;
}
 
footer .container {
  padding-top: 20px;
}
 
@media(min-width:1200px){
  
.description li, .marketing p{
  font-size:18px;
}

.start_page h1{
  font-size:70px;
  letter-spacing:2px;
}

.start_page h2{
  font-size:25px;
  letter-spacing:4px;
}

  
}
 
/*----Abocenter----*/

/*Abo bestellen*/
.ticketheader {
  color: #278E2B;
  margin-bottom:15px;
  font-size: 23px;
}

.ticketheader2 {
  font-size: 12pt;  
  margin-bottom:25px;
}

.downloadfield {
 margin-bottom: 30px; 
 }

.downloadtext {
  margin-left:15px;
  font-size: 14pt; 
  font-weight: bold;
  color: rgb(39, 142, 43);
}
.margintop {
  margin-top: -120px;
  }

.downloadimg {
 width: 49px; 
  height: 41px;
}
.mehrBtn {
  width:40px;
  margin-left: 5px;
  margin-top: -5px;
  }
.download {
  color: rgb(39, 142, 43) !important;
  }

.ecklinieheader   {
        border-top: 1px solid #0070C0;
        width: 100%;
  margin-bottom: 30px;
      }      
.deckheader   {
      border: solid #0070C0 1px;
      margin-left:20px;
      width: 60px;
      background-color: #0070C0;
      color: white;
      border-radius: 0 0 5px 5px;
      padding-left: 12px;
      padding-bottom: 3px;
    }    
.downloadlink {
  margin-left: 65px;
  }

@media(max-width:1200px){




#second_nav{
  margin-top: 80px;
}

.navbar-brand{
  height: 80px;
  padding-top: 40px;
  padding-bottom:0;
  
}

.logo{
  height:40px;
}


.navbar-nav{
  margin-top: 40px;  
  font-size: 16px;

}




}

@media(max-width:992px){
  
.start_page{
  background: url('../images/start_small.png') no-repeat scroll center bottom / cover ;  
}  
  
.start_page h1{
  font-size:60px;
  letter-spacing:5px;
}

.start_page h2{
  font-size:22px;
  letter-spacing:4px;
}
  
  
.navbar-nav{
  margin-top: 34px;  
  font-size: 14px;

}

#second_nav{
  margin-top: 70px;
}

.navbar-brand{
  height: 70px;
  padding-top: 25px;
  padding-bottom:0;
  
}

.navbar-nav > li {
    margin-right: 8px;
}

.navbar-inverse .navbar-nav > li > a {
    transition: color 0.5s ease-out;
  color: #414140 !important;
  padding: 8px 10px;
  background: none !important;
}

.navbar-inverse .navbar-nav > .active > span, .navbar-inverse .navbar-nav > .active > span:focus, .navbar-inverse .navbar-nav > .active > a:hover span , .navbar-nav li:hover span{
  height: 35px;
}

.benefits{
    overflow:hidden;
    width: 70%;
    height: 200px;
    margin: 20px auto 0 auto;
  }

.schriftBild h1 { font-size: 60px !important;}
}




@media (max-width:767px) {
  
  
.start_page h1{
  padding-top: 40px;
  font-size:40px;
  letter-spacing:5px;
}

.start_page h2{
  font-size:16px;
  letter-spacing:4px;
}
  
  
  .cc_width{
    width: 250px;
    margin:0 auto;
     display: block;
  }
  
  .opacity_none{
  opacity:1;
}

  
  #second_nav{
    display: none;
  }
  
  .socialMedia{
    text-align: center;
  }
  
  
  .benefits{
    overflow:hidden;
    width: 70%;
    border-radius: none;   
  }
  
  .benefits img{
    animation: none;
    background-size: cover;
    width: 100%;
    border-radius: 6px;
  }
  
  h2{
    font-size: 45px;
  }
  
  .pricelabel{
    margin: 25px 10px 0 0;
  }
  
  .right{
    float:none;
  }
  
  .left{
    float:none;
  }
  
  .start_commercial{
    float: none;
    opacity: 0;
    margin: 0 auto; 
    animation: fadeIN 0.5s ease-in 1.5s;
    animation-fill-mode: forwards;  
    width: 100%;
  }

  .commercial{
      margin-top: 0;
  }


  .seperator_blue  h2  small{
    display: none;
  }
  
  .spacer80{
    padding-top: 30px;
  }
  
  .navbar-nav li span{
    display: none;
  }
  
  .navbar-nav > li {
    margin-right: 0;
  }
  
  .navbar-nav {
    margin-top: 0;
  }
  
  li .active a, .navbar-inverse .navbar-nav > .active {
    color: #ffffff !important;
    background: #048e34;
  }
  
  li .active a, .navbar-inverse .navbar-nav > li:hover , li .active a, .navbar-inverse .navbar-nav > li:hover   a{
    color: #ffffff !important;
    background: #;
  }
  
  
  .navbar-toggle {
    background-color: #048e34;
    background-image: none;
    border: none;
    border-radius: 4px;
    float: right;
    margin-bottom: 8px;
    margin-right: 25px;
    margin-top: 21px;
    padding: 9px 10px;
    position: relative;
  }
  
  .navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
    background-color: #0462ad;
  }
  
.schriftBild h1 { margin-top:80px; font-size: 50px !important;}
}

@media (max-width:400px) {
  

.start_page{
  background: url('../images/start_smaller.png') no-repeat scroll center bottom / cover ;  
}  
}


/*Powermail*/
.tx-powermail {
  width: 1170px;
  margin-left: auto;
  margin-right: auto;
  padding-right: 15px;
  padding-left: 15px;
  }
  
.powermail_fieldwrap {
  margin-top: 15px;
  }
#Uploads {
  min-height: 0 !important;
  }
.powermail_legend {
  font-size: 35px;
  color: #0462ad;
  font-weight: bold;
  }



/*Titelbild*/
.bild {
  width: 100%;
  filter: brightness(0.6);
  display: block;
  height: auto;
  padding: 0; 
  top:0;
}
.schriftBild {
  z-index: 222;
  position: absolute;
  color: white;
  top: 50px;
}
.schriftBild h1 {
  font-size: 94px;
  }
.schriftBild h2 {
  font-size: 35px;
  letter-spacing: 4px;
  }

.headertext {
  font-size: 30px;
  color: rgb(4, 98, 173);
  margin-left: 20px;
}
.headericon {
  width: 52px;
  height: auto;
  margin-top: -18px;
}
.articletext {
  margin-left: 72px;
}
.content_container {
  padding-top: 0px !important;
}
.downloadicon {
  height: 41px;
  width: 49px;
  margin-top: -4px;
}

/*Powermail*/
.powermail_form h3 {
  font-size: 0 !important;
}
.upload-answer {
  font-size: 30px;
  color: #278E2B;
}
.upload-error{
  color: red;
  font-size: 20px;
}
.powermail-button {
  border: solid 1px #0462ad;
  background-color: #0462ad;
  color: white;
  border-radius: 5px;
  font-size:16px;
  padding:8px;
}

/*Tabelle*/
.contenttable>tbody>tr>td {
  border: solid 1px #ddd  
}


/*Bild mit Überschrift*/
.bild_beschriftung {
	 position: relative;
}
.bild_beschriftung img {
	 display: block;
	 width:100%;
}
.bild_beschriftung h1 {
	position: absolute;
	 top: 0;
	font-weight: 700;
	margin: 30px 0 30px 0;
	width: 100%;
	 color: #fff;
	text-align: center;
	 height: 2.5em;
	 font-family: "Open Sans", Helvetica Neue, Arial;
}
.bild_beschriftung h2 {
	position: absolute;
	 top: 0;
	font-weight: 700;
	margin: 30px 0 30px 0;
	width: 100%;
	 color: #fff;
	text-align: center;
	 height: 2.5em;
	 font-family: "Open Sans", Helvetica Neue, Arial;
}


/*Team*/
.header-team {
  font-size: 30px;
  color: #0462ad;
  font-weight: bold;
}

/*Kontaktformular*/
.fehlermeldung {
  font-size: 36px;
  font-weight: bold;
  color: red;
}