/* bagian margin top fixer */
#marginTopFixer {
    padding-top: 6vh;
}


/* bagian logo */
#conimgLogo {
    justify-content: center;
}
@media (max-width: 767px) {
    #imgLogo {
        width: 60%;
    }
}
@media (min-width: 768px) {
    #imgLogo {
        width: 50%;
    }
}
@media (min-width: 1025px) {
    #imgLogo {
        width: 18%;
    }
}

/* bagian salam */
#conSalam {
    justify-content: center;
    margin-top: 3vh;
}
@media (max-width: 767px) {
    #salam {
        width: 95%;
    }
}
@media (min-width: 768px) {
    #salam {
        width: 80%;
    }
}
@media (min-width: 1025px) {
    #salam {
        width: 90%;
    }   
}
#salam > h1 {
    color: rgb(255, 247, 232);
    text-align: center;
    font-weight: 700;
}
@media (max-width: 767px) {
    #salam>h1 {
        font-size: 3.5em;
    }
}
@media (min-width: 768px) {
    #salam>h1 {
        font-size: 6em;
    }
}
@media (min-width: 1025px) {
    #salam>h1 {
        font-size: 4.5em;
    }
}

/* bagian subsalam */
#consubsalam {
    margin-top: 3vh;
    justify-content: center;
}
#subsalam > h3 {
    text-align: center;
    color: #ffebde;
}
@media (min-width: 768px) {
    #subsalam > h3 {
        font-size: 2em;
    }
}
@media (min-width: 1025px) {
    #subsalam>h3 {
        font-size: 1.3em;
    }
}
@media (min-width: 768px) {
    #subsalam {
        width: 85%;
    }
}
@media (max-width: 767px) {
    #subsalam {
        width: 90%;
    }
}
@media (min-width: 1025px) {
    #subsalam {
        width: 100%;
    }
}

/* bagian tombol */
#conTombol {
    margin-top: 6vh;
    margin-bottom: 3vh;
}
@media (max-width: 767px) {
    #conTombol {
        align-items: center;
        flex-direction: column;
        row-gap: 20px;
    }
}
@media (min-width: 768px) {
    #conTombol {
        flex-direction: column;
        align-items: center;
        row-gap: 35px;
    }
}
@media (min-width: 1025px) {
    #conTombol {
        flex-direction: row;
        justify-content: center;
        column-gap: 20px;
    }
}
@media (max-width: 767px) {
    #tombol {
        width: 80%;
    }
}
@media (min-width: 768px) {
    #tombol {
        width: 60%;
    }
}
@media (min-width: 1025px) {
    #tombol {
        width: 20%;
    }
}
#tombol > button {
    width: 100%;
}
@media (max-width: 767px) {
    #tombol > button {
        font-size: 1.2rem;
    }
}
@media (min-width: 768px) {
    #tombol > button {
        font-size: 1.8em;
    }
}
@media (min-width: 1025px) {
    #tombol > button {
        font-size: 1.3rem;
    }
}