.title {
    font-family: 'kanit_m', sans-serif;
    font-size: 2rem;
    margin-bottom: 20px;
    color: black;
    transition: 0.3s;
}

.dark .title {
    color: white;
}

.section {
    font-family: 'kanit_m', sans-serif;
    font-size: 1.5rem;
    margin-bottom: 20px;
    color: var(--rojo);
}

.text {
    font-family: 'kanit_r', sans-serif;
    font-size: 1.1rem;
    margin-bottom: 50px;
}

.content b {
    font-family: 'kanit_m', sans-serif;
}

.content a {
    color: var(--rojo);
}

.content a:hover {
    text-decoration: underline;
}

.update {
    font-family: 'kanit_li', sans-serif;
    color: gray;
    margin-bottom: 50px;
}

.content {
    height: 80% !important;
    height: 80vh !important;
    height: calc(var(--vh, 1vh) * 80) !important;
}

.siteContainer {
    width: 88% !important;
}


@media (max-width: 400px) {

    .content {
        height: 78% !important;
        height: 78vh !important;
        height: calc(var(--vh, 1vh) * 78) !important;
        margin-top: 2vh;
    }

    .title {
        font-size: 1.8rem;
        margin-bottom: 20px;
    }

    .section {
        font-size: 1.3rem;
    }

    .text {
        font-size: 1rem;
    }
}