* {
   padding: 0;
   margin: 0;
   box-sizing: border-box;
 }
 
 body {
   background-color: #e7e7e7;
   color: white;
   font-family: "Poppins", sans-serif;
 }
 .body-container{
     min-height:75vh;
     background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(230,252,250,1) 78%, rgba(158,231,215,1) 100%);
     display: flex;
     flex-direction: row;
     justify-content:space-between;
 }
 .sidebar-container{
    display: flex;
     flex: 1 0 10%;
     width:0vw; /* wenn sidebar vorhanden dann 20vw */
     background-color: rgb(5, 56, 5);
     display: none; /* vorerst mal weglassen */
  }
  .content-container{
     display:flex;
     flex-direction: column;
     flex: 1 1 90%;
     justify-content: space-around;
     width: 100vw; /* wenn sidebar vorhanden dann 80vw */
     background-color:  #e7e7e7;
  }
  .zeile-container{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    min-height: 30vh;
  /*  background-color: rgb(129, 10, 103);*/
    padding: 50px 50px 50px 50px;
  }
 
  .carousel-item a
  {
     font-size: 100px;
     color: darkcyan;
     
  }
 .Karusell-Karte{
    margin: 30px 30px;
    align-self: center;      
 }
 .Content-Karte{  
   border: 3px solid darkcyan;
   box-shadow: 10px 10px 30px 10px grey;
   border-radius: 7px;
   border-style:double;   
  min-width: 350px;	/*
  max-width: 400px;*/
  width: 20%;
  padding: 0px 8px 20px 8px;
}
 .Content-Karte-Text1{
 font-size: 20px;
 color:darkcyan;
 font-weight: bold;
 text-align: center;
 }
 .Content-Karte-Text1 h2
 {
  color: darkslategray;
 }
 .Content-Karte-Text1 h3
 {
  color: darkslategray;
 }
 .Content-Karte-Text1 h4
 {
  color: darkslategray;
 }
 .Detail-Karte li
 {
  color: darkslategray;
 }
 .Content-Karte-Text2{
 font-size: 12px;
 color: grey;
 text-align: center;
 }
 .Content-Karte-Text3{
   font-size: 16px;
   color: grey;
   text-align: center;
   }
 .Content-List{
 padding: 0px 0px 0px 0px;
 margin: 0px 0px 0px 0px;
 align-self: center;
 }
 .Content-List-Eintrag{
 font-size: 18px;
 color: darkslategray;
 }
 
/*
Alle Unterseiten
*/
.InBeschr-Karte{
   border: 3px solid darkcyan;
   border-radius: 7px;
   border-style:double;   
   padding: 10px 0px 50px 0px;
  }

  .InBeschr-Karte li{
   color: darkslategray;
  }
.ISoftware-content{
   align-items: center;
   width: 100vw;
   display: block;
}
.ISoftware-content p{
   color: grey;
}
.Impressum-content p
{
   color: grey;
   margin: 1px;
}
/*
Kontakt
*/
.anfrage{
   padding-top: 40px;
   padding-bottom: 25px;
   color: rgb(32, 105, 117);
   font-weight: bold;
   font-size: 19px;
}
.Kontakt-content{
   text-align: center;
   width: 100vw;
   display: block;
 }
.KontaktForm  input[type=text], textarea {
   background-color: rgb(233, 233, 233);
   border: 2px solid #216156;
   border-radius: 7px;
   width: 350px;
   padding: 5px;
   margin: 1px;
   color: rgb(85, 84, 84);
}
.KontaktForm input[type=submit]{
   background-color: rgb(255, 255, 255);
   border: 2px solid #216156;
   border-radius: 7px;
   width: 150px;
   padding: 10px;
   margin-bottom: 30px;
   color: rgb(85, 84, 84);
   
}


 @media (max-width: 1200px){
   body{
      background-image: linear-gradient(120deg, white, grey);   
      }
 
   .body-container{
      flex-direction: column;
      margin: 90px 0px 0px 0px; 
   }
   .content-container{
      width: 100vw;
   }
   .zeile-container{
      flex-direction: column;
    /*  max-width:500px;*/
      margin: 0px 0px 0px 0px;
      align-self: center;
      padding: 0px;
      }
       
   .mapouter{
      display: flex;
      justify-content: center;
      align-items: flex-end;
      max-width: 500px;
   }
       
   .Content-Karte{
      margin: 10px 0px;
      width: 100vw;
   }
   .sidebar-container
   {
      flex-direction: row;
      width: 100vw;
      height: 50px;
      flex: 1 1 20%;
   }
}