.mobile-menu {
    text-align: center;
}

.mobile-menu ul {
    list-style: none;  
    margin: 0;  
    padding: 0;  
}

.mobile-menu {
    display: block;
    background-color: rgba(0, 0, 0, 5);
    width: 100%;
}
.mobile-nav a, .mobile-menu .user a {
    color: #C8B568;
    text-decoration: none;
}

.mobile-menu .user, .user li {
    margin-top: 15px;
}

.mobile-nav li {
    margin-top: 15px;
}

.mobile-logo img {
    margin-top: 13px;
    width: 75px;
    height: auto;

}

@media all and (min-width: 1001px) {
    .mobile-menu {
        display: none;
        visibility: hidden;
    }
}

@media all and (max-width: 1000px) { 
    .desktop-menu {
        display: none;
        visibility: hidden;
    }

    /* Tablet  width 1000px*/
    .reihe1,
    .reihe2 {
      display: block;
    }

    .columns {
      display: block;
    }

    #slider {
      display: none;
      visibility: hidden;
    }
    
    #slider .slide-nav {
      display: block;
    }

    .card-collection {
      justify-content: center;
      text-align: center;
    }

    .card {
        background-color: hsla(0, 0%, 0%, 0.3);
        height: 400px;
        width: 250px; 
        padding: 0px;
        /*float: left;*/
        margin: 20px;
        align-items: center;
        text-align: center;
        transition: all 0.2s ease-in-out;
    }
}

 /* Kleine Mobile Phone und Geräte */
 @media only screen and (max-width: 260px) {
    /* Mobile Content Anfang */
    body {
      width: 100%;
    }

    p {
      font-size: 16px;
    }

    h1 {
      font-size: 18px;
    }
    .card-collection {
      display: block;
      /*flex-wrap: wrap; 
      justify-content: left;
      text-align: left;*/
    }
    
    .reihe1,
    .reihe2 {
      display: block;
      /*flex-basis: 100%;*/
      justify-content: center;
    }
    
    .card {
      /*background-color: rgb(74, 9, 194);*/
      height: 350px;
      width: 250px; 
      padding: 0px;
      margin: 5px;
      float: left;
      margin-bottom: 10px;
      align-items: center;
      text-align: center;
      transition: all 0.2s ease-in-out;
    }

    .card img {
      height: 349px;
      width: 249px;
      object-fit: cover;
      /*z-index: -1;*/
      position: absolute;
    }
    
    .card:hover {
      box-shadow: 5px 5px 5px rgba(255, 255, 255, 0.3);
      transform: scale(1.05) translateY(-5px);
    }

    .social-nav {
      display: block;
    }
    /* Mobile Content Ende */
    .columns .column p{
      font-size: 18px;
    }

    /* Verstecke Desktop Menü */
    .desktop-menu {
        display: none;
    }
}

@media only screen and (max-width: 220px) {
  /* Sehr kleine Mobile Endgeräte */
  body {
    font-size: 16px;
  }
  .card p {
    font-size: 16px;
  }
  .card {
    /*background-color: rgb(74, 9, 194);*/
    height: 250px;
    width: 145px; 
    padding: 0px;
    margin: 20px;
    float: left;
    margin-bottom: 40px;
    margin-top: 50px;
    align-items: center;
    text-align: center;
    transition: all 0.2s ease-in-out;
  }

  .social-div {
    display: block;
  }
}