body {
    background: white;
    margin: auto;
    padding: 0;
    max-width: 2000px;
}
.container{
    background-color: white;
}
.navbar {
    width: 100%;
    background-color: white;
}

.card {
    width: 100%;
    margin: auto;
    padding: 20px;
}

#person {
    width: 100%;
    margin: auto;
    text-align: center;
}
#person-bild{
    width: 50%;
}

.literatur {
    width: 100%;
}

#person-card{
        width: 80%;
    }
#buch-card{
    width: 80%;
}
#buch{
    width: 50%;
}
footer a{
    list-style-type: none;
    text-decoration: none !important;
}


@media only screen and (max-width: 460px) {
    header {
        margin-bottom: 20%;
        /*margin-top: 19%;*/
    }

    .visible {
        display: block;
    }
    .card-text {
        text-align: justify;
    }
    .card {
        color: white;
        background-color: #131522;
    }
    #person-card{
        width: 100%;
    }
    #person-bild{
    width: 100%;
    }
    #buch-card{
        width: 100%;
    }
    #buch{
        width: 100%;
    }
    .diseapear {
        display: none;
    }

    body {
        background-color: #131522;
    }
    .container{
         background-color: #131522;
 
    }
    .literatur img{
        width: 100%;
    }
    .myBtn{
        background-color: transparent;
        color: white;
    }
}

@include media-breakpoint-up(sm) {
    html {
        font-size: 1.2rem;
    }
}

@include media-breakpoint-up(md) {
    html {
        font-size: 1.4rem;
    }
}

@include media-breakpoint-up(lg) {
    html {
        font-size: 1.6rem;
    }
}


.gallery {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-width: 33%;
    -moz-column-width: 33%;
    column-width: 33%;
}

.gallery .pics {
    -webkit-transition: all 350ms ease;
    transition: all 350ms ease;
}

.gallery .animation {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}


@media (max-width: 450px) {
    .gallery {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
        -webkit-column-width: 100%;
        -moz-column-width: 100%;
        column-width: 100%;
    }
}

@media (max-width: 400px) {
    .btn.filter {
        padding-left: 1.1rem;
        padding-right: 1.1rem;
    }
}

.thumb{
    font-size:  50px;
}


#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 2%; /* Place the button at the bottom of the page */
  left: 0px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: transparent; /* Set a background color */
  color: #131522; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 5px; /* Some padding */
  font-size: 2em; /* Increase font size */
}

/*#myBtn:hover {
  background-color: #131522;  Add a dark-grey background on hover 
  color: white;
  background-color: lightgrey;
  color: white;
  border: 1px solid lightgrey;
}*/
