@font-face {
    font-family: "PhetsarathOT";
    src: url("../../fonts/Phetsarath OT.ttf") format("truetype");
}

@font-face {
    font-family: "NotosanLao";
    src: url("../../fonts/NotoSansLao-Regular.ttf") format("truetype");
}

:root {
    --base-font-family: "PhetsarathOT", "NotosanLao", "Times New Roman", serif;
    --bs-body-font-family: var(--base-font-family);

    --bg-top: #e9f4fb; /* light */
    --bg-bottom: #9fb8d9; /* darker */
}

* {
    font-family: var(--base-font-family);
}

body {
    margin: 0;
    color: #757575;
    background: linear-gradient(
        180deg,
        var(--bg-top) 0%,
        var(--bg-bottom) 100%
    );
    background-attachment: fixed;
}

h1 {
    font-size: 2.5rem;
} /* ~40px */
h2 {
    font-size: 2rem;
    color: #6a6a6a;
} /* ~32px */
h3 {
    font-size: 1.75rem;
} /* ~28px */
h4 {
    font-size: 1.5rem;
} /* ~24px */
h5 {
    font-size: 1.25rem;
} /* ~20px */
h6 {
    font-size: 1rem;
} /* ~16px */

header {
    display: flex;
    width: 100%;
    border: solid 1px #000;
}

.logo {
    height: 10rem;
    width: auto;
    margin-top: 50px;
    margin-bottom: 30px;
    img {
        height: 100%;
    }
}

hr {
    margin: 40px 0px;
}

.form-control {
    margin-top: 20px;
    margin-bottom: 20px;
}

label {
    font-weight:800 !important;
}

input{
    border-radius: 5px !important;
    margin-top: 5px !important;
}

input::placeholder {
    color: #949494 !important;
    font-style: italic;
    font-size: 14px;
}

footer {
    /* background-color: transparent; */
    color: #000;
    background: inherit;
}
/**
*/
@media (max-width: 1200px) {
    h2 {
        font-size: 2rem;
    }
    .logo {
        height: 9rem;
        margin-top: 40px;
    }
}

@media (max-width: 992px) {
    h2 {
        font-size: 1.8rem;
    }
    .logo {
        height: 8rem;
        margin-top: 30px;
    }
}

@media (max-width: 768px) {
    h2 {
        font-size: 1.6rem;
    }
    .logo {
        height: 7rem;
        margin-top: 20px;
    }
}

@media (max-width: 576px) {
    h2 {
        font-size: 1.4rem;
    }
    .logo {
        height: 6rem;
        margin-top: 10px;
    }
}