/* --------------------------------
Primary Media Style
-------------------------------- */

/* #################### */
/* Responsive */
/* #################### */

@media only screen and (min-width: 1024px) {
	.nav-btn {
		margin: -1px;
		overflow: hidden;
		position: absolute;
		width: 1px;
		height: 1px;
	}
	
	.nav-btn {top: 27px;}
}
@media only screen and (max-width: 1023px) {
  .header {padding: 48px 0;}

#abstand {height: 100px;}

	#menue {
      padding: 0;
      }

  .nav {
    height: auto;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 100px;
    left: -2px;
    background-color: #fff;
    border: 1px solid black;
    overflow-x: hidden;
    transition: 0.5s;
    text-align: right;
    font-size: 130%;
    margin: -4px 0 0 0;
      }

.nav li {
      display: block;
      overflow: hidden;
      padding: 6px 50px;
      text-align: right;
      }  

	.small-logo{
    left: 85%;
    padding-top: 40px;
    position: fixed;
  }

	#lehrgaengebg, #bannerueberuns {
//    background: #bbb url(../img/banner/kleinueberunsbg.jpg) no-repeat center center;
    background-color: #fff;
    background-size: 100% auto;
    margin: 0 auto;
    padding-top: 0;
    position: relative;
    width: 100%;
    height: 280px;
	}

  .maps {
    background-color: #ccc;
    background-size: 100% auto;
    margin-top: 0px;
    position: relative;
//    width: 100%;

  }

  .imgmedia {margin-top: 10px;}
/*  
  .ueberunsinhalt {
      height:80%;
      position:absolute;
      }
*/
  .impressuminhalt {
    padding-top: 190px;
  }

  .kontaktinhalt {
    padding-top: 40px;
  }

//  .lehrgaenge {overflow: auto;}

   #footer .innen {

    width: 80%;
   }

  .innen {
      margin: 2% auto 0;
  }


  .infobox4 {height: auto;}

    /* Footerleiste mittg */

  .fix {
    height: 0;
    margin-top: -40px;
    visibility: hidden;
  }  

  
  #footer .footerlinerechts{
    float: none;
    text-align: center;
    margin-top: 4px;
    transition: all 0.4s ease 0s;
  }

  #footer .footerline {
    text-align: center;
    transition: all 0.4s ease 0s;
  }

  /* Trainerbox breite 100% und mittig */
  
  #trainerbox {margin-top: 0;}

  #trainerbox .trainerboxklein{
    transition: all 0.6s ease 0s;
    width: 100% !important;
    float: none;
    height: auto;
  }

  /* Mittig zentrierung wird aufgelöst (Trainerboxen)*/
  
  #trainerbox .center{
    padding: 0;
  }

  .kontaktinhalt .buttonlink{
    text-align: center;
    transition: all 0.6s ease 0s;
  }

  .table{
    width: 100%;
//    display:block;
    overflow:auto;
  }

/* Startsite formating */

  #headerindex{
    position: fixed;
  }

  .cd-projects-container {
 //   background: none repeat scroll 0 0 #333;
 	padding-top:100px;
}

  .cd-projects-previews a, .cd-projects .preview-image {
    height: 200px;
    background: #333;
    background-size: 100% auto;
  }
  
    .cd-projects-previews a, .cd-projects .preview-image > .footerline .innen .links {
  	background-color: #5d5d5d;;
  	height:auto;
  	}
  	
  #footer #footerinnen a {
  	background-color: #fafafa;
  	height:auto;
  	display: ;
  	}

  .cd-projects-previews li:nth-of-type(1) a, .cd-projects > li:nth-of-type(1) .preview-image {
    height: 350px;
//    margin-top: 65px;
    background: #333;
    background-size: 100% auto;
  }

  .cd-projects-previews li:nth-of-type(1) .cd-project-title, .cd-projects > li:nth-of-type(1) .cd-project-title {
    transform: translateY(0px);
}

  .cd-projects-previews li:nth-of-type(2) a, .cd-projects > li:nth-of-type(2) .preview-image {
    height: 400px;
    margin-top: 0px;
    background: #333;
    background-size: 100% auto;
  }

  .cd-projects-previews li:nth-of-type(2) .cd-project-title, .cd-projects > li:nth-of-type(2) .cd-project-title {
    transform: translateY(0px);
}

  .cd-projects-previews li:nth-of-type(3) a, .cd-projects > li:nth-of-type(3) .preview-image {
    height: 370px;
    background: #333;
    background-size: 100% auto;
    margin-top: 0px;
  }

  .cd-projects-previews li:nth-of-type(3) .cd-project-title, .cd-projects > li:nth-of-type(3) .cd-project-title {
    transform: translateY(0px);
}

  .cd-projects-previews li:nth-of-type(4) a, .cd-projects > li:nth-of-type(4) .preview-image {
    height: 370px;
    background: #333;
    background-size:  100% auto;
//    margin-top: 140px;
}

.cd-projects-previews li:nth-of-type(4) a .cd-project-title, .cd-projects > li:nth-of-type(4) .cd-project-title {
    transform: translateY(0px);
}

.cd-projects-previews li:nth-of-type(4) a {
    transform: translateY(0px);
}

  .cd-projects-previews a {
    opacity: 1;
    z-index:5;
  }
  
  .cd-projects-previews #list a {
  	height:80px;
  	opacity: 1;
  	}

  .cd-projects-previews li {
    height: auto;
//    overflow: hidden;
    background: #333;
  }

  .cd-projects-previews #listfooter {
    
//    position: fixed;
//    bottom: 0;
    }

  #listfooter {
    display: table; 
    margin-top: 110vh; 
    overflow-y: auto; 
    width: 100%; 
    height:50%;
  }
  
  .footerpreview {height:100%;}

  .cd-project-title {
    top: 0;
  }

  .cd-projects {
    height: 10%;
    top:70px;
}

 .cd-projects > li.selected {
    background: #333 none repeat scroll 0 0;
}

  .cd-projects > li {
    height: 30%;
  }

  .preview-image .cd-project-title {
    margin-top: 150px;
  }
/*
  .cd-projects-previews {
    height: 60vh;
*/
  #kinder {
  	margin: 0 auto;
    width: 100%;
  }

  #kinder1 {
    width: auto;
    margin-top: 20px;
  }

  #kinder2 {
//    height: 100px;
    width: auto;
  }

  #herren {
  	margin: 15px auto 0 auto;
    width: 100%;
//    margin-top: 80px;
  }

#herren1 {margin-top: 20px;}

  #herren1, #herren2 {
    width: auto;
  }

  #damen {
  	margin: 25px auto 0 auto;
    width: 100%;
//    margin-top: 50px;
  }

  #damen1 {margin-top: 20px;}

  #damen1, #damen2 {
    width: auto;
  }

  #damentransform, #herrentransform {
    transform: translateX(0px);
  }

  .infoboxkinder, .infoboxdamen, .infoboxherren, .infoboxsenioren {
    color: #fff;
    line-height: 1.4;
    margin: auto;
    text-align: center;
    width: auto;
    padding: 2% 1%;
  }

  #senioren {
  	margin: -25px auto 0 auto;
    width: 100%;   
  //  margin-top: -200px;
  }

  #senioren1 {margin-top: 20px;}

  #senioren1, #senioren2 {
    width: auto;
  }

  .infobox2 {
    padding-top: 50px;
 }

}