@media (max-width: 1028px) {
    h2 {
        font-size: 5vh;
        font-family: 'Bebas Neue', sans-serif;
    }
    
    .navbar-brand {
        font-family: 'Bebas Neue';
    }

    .nav-item > a {
        font-family: 'Montserrat', sans-serif;
    }

    .intro {
        margin-top: 10vh;
        padding: 10vh;
        background-image: url(/img/welcome-background.png);
        background-position: center;
        background-size: cover;
    }

    .intro-text {
        font-size: 5vh;
        color: white;
        font-family: 'Bebas Neue';
        text-shadow: 2px 2px 4px #000000;
    }

    .about-us {
        padding: 2vh 0vh 2vh 0vh;
    }

    .about-us > img {
        max-width: 80%;
        height: auto;
        display: block;
        margin: auto;
        padding: 2vh 0vh;
    }

    .ibadah-komisi {
        padding: 2vh 0vh 4vh 0vh;
    }

    .carousel {
        max-width: 80%;
        height: auto;
        margin: auto;
    }

    .konselor {
        padding: 2vh 0vh 2vh 0vh;
    }

    .kontak-konselor {
        flex-direction: column;
    }

    .kontak-konselor-nama {
        font-family: 'Young Serif', serif;
        margin-bottom: 0vh;
        font-size: 2.5vh;
    }

    .kontak-konselor-nomor {
        text-decoration: none;
        color: black;
    }

    .kontak-konselor-part {
        margin-bottom: 3vh;
    }

    .identitas-gembala {
        flex-direction: column;
        padding: 2vh 0vh 2vh 0vh;
    }

    .foto-gembala > img {
        max-width: 80% !important;
        height: auto;
        margin: 0vh 5vh;
    }

    .nama-gembala {
        text-align: center;
        padding-top: 2vh;
    }

    .nama-gembala > h4 {
        font-family: 'Young Serif', serif;
        font-size: 3.5vh;
    }

    .nama-gembala > p {
        font-size: 2.5vh;
        line-height: 1.5vh;
    }

    footer {
        padding: 5vh 5vh;
        background-color: gray;
    }

    .foot-one {
        padding-bottom: 3vh;
    }

    .social-media-link {
        margin-bottom: -2vh !important;
    }

    .social-media-link > a {
        text-decoration: none;
        color: white;
        font-size: 5vh;
    }

    .jam-ibadah > p {
        margin-bottom: 0.5vh;
    }

    span {
        display: none;
    }
}

@media (min-width: 1028px) {
    h2 {
        font-size: 7vh;
        font-family: 'Bebas Neue', sans-serif;
    }

    .navbar-brand {
        font-family: 'Bebas Neue';
    }

    .nav-item > a {
        font-family: 'Montserrat', sans-serif;
    }

    .intro {
        margin-top: 5vh;
        padding: 20vh;
        background-image: url(/img/welcome-background.png);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .intro-text {
        font-size: 10vh;
        color: white;
        font-family: 'Bebas Neue';
        text-shadow: 2px 2px 4px #000000;
    }

    .content {
        padding: 4vh 0vh;
    }

    .about-us > p {
        font-size: 3vh;
    }

    .about-us > img {
        max-width: 60%;
        height: auto;
        display: block;
        margin: auto;
        padding: 2vh 0vh;
    }

    .carousel {
        max-width: 70%;
        height: auto;
        margin: auto;
    }

    .ibadah-komisi {
        padding-top: 10vh;
        padding-bottom: 10vh;
    }

    .konselor > p {
        padding: 0vh 5vh;
        font-size: 3.5vh;
    }

    .kontak-konselor-part {
        padding: 5vh 0vh;
        margin: 0vh auto;
        font-size: 3vh;
    }

    .kontak-konselor-nama {
        font-family: 'Young Serif', serif;
        margin-bottom: -1vh;
    }

    .kontak-konselor-nomor {
        text-decoration: none;
        color: black;
    }

    .profile-gembala {
        padding-top: 10vh;
        padding-bottom: 10vh;
    }

    .identitas-gembala {
        flex-direction: row;
    }

    .nama-gembala {
        padding: 15% 0vh;
    }

    .nama-gembala > h4 {
        font-family: 'Young Serif', serif;
        font-size: 5vh;
    }

    .nama-gembala > p {
        font-size: 3.5vh;
    }

    footer {
        padding: 5vh 40vh;
        background-color: #353535;
    }

    .foot-one {
        padding-bottom: 5vh;
    }

    .social-media {
        padding: 0vh 10vh 0vh 10vh;
    }

    .social-media > h3 {
        font-size: 3.5vh;
    }

    .jam-ibadah > h3 {
        font-size: 3.5vh;
        /* line-height: 0; */
    }

    .jam-ibadah > p {
        line-height: 0.5;
    }

    .social-media-link > a {
        text-decoration: none;
        color: white;
        font-size: 2vh;
    }

    .jam-ibadah > p{
        color: white;
        font-size: 2vh;
    }

    .location > p {
        font-size: 2vh;
    }
}