@media screen and (min-width: 375px){
    #biography{
        padding-left: 24px;
        padding-right: 24px;
    }
    .event{
        width: 300px;
    }
    .pic{
        width: 250px;
        height: 250px;
    }
}
@media screen and (min-width: 425px){
    #main-heading{
        font-size: 40px;
    }
    .event{
        margin-left: 30px;
        margin-right: 30px;
    }
    .h2{
        font-size: 28px;
    }
    #gallery-container{
        height: 500px;
    }
    .pic{
        margin-left: 85px;
        margin-right: 85px;
    }
    #prev, #next{
        top: 220px;
    }
    #close{
        font-size: 60px;
    }
    #contact span{
        font-size: 18px;
    }
    #contact p .fa{
        margin-left: 20px;
        margin-right: 20px;
        font-size: 32px;
    }
    #media{
        font-size: 18px;
    }
}
@media screen and (min-width: 576px){
    .pic{
        margin-left: 45px;
        margin-right: 45px;
    }
    #show-slide-image{
        width: 80%;
    }

}
@media screen and (min-width: 768px){
    #show-slide-image{
        width: 60%;
    }
    .pic{
        width: 350px;
        height: 350px;
        margin-left: 30px;
        margin-right: 30px;
    }
    #gallery-container{
        height: 600px;
    }
    #prev, #next{
        top: 250px;
        font-size: 28px;
    }
}