:root {
    --bs-blue: #74b445;
    --bs-primary: #74b445;
    --bs-link-color: #74b445;
    --bs-nav-pills-link-active-bg: #74b445;
    --bs-link-hover-color: #389344;
    --bs-body-color: #333;
}

.nav-pills {
    --bs-nav-pills-border-radius: var(--bs-border-radius);
    --bs-nav-pills-link-active-color: #fff;
    --bs-nav-pills-link-active-bg: var(--bs-primary);
}

/* body {
    --bs-body-font-family: var(--bs-font-monospace);
    --bs-body-line-height: 1.4;
    --bs-body-bg: var(--bs-gray-100);
}

.table {
    --bs-table-color: var(--bs-gray-600);
    --bs-table-bg: var(--bs-gray-100);
    --bs-table-border-color: transparent;
} */

.text-white {
    color: #fff;
}

.text-main {
    color: var(--bs-primary);
}

.bg-main {
    background-color: var(--bs-primary);
}

.bg-transparent {
    background-color: transparent;
}

.bg-gray {
    background-color: #f6f7f8;
}

.bg-black {
    background-color: #000;
}

ul.nav-menu a.nav-link,
ul.nav-languages a.nav-link {
    /* import font */
    font-family: 'Arial' !important;
}

ul.nav-menu .nav-item .nav-link {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-focus-shadow-rgb: 25, 135, 84;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--bs-primary);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--bs-primary);
    --bs-gradient: none;
    font-weight: bolder;
    font-size: 1.15rem;
    /* border-radius: var(--bs-nav-pills-border-radius); */
    /* border: 1px solid; */
}

ul.nav-languages .nav-item .nav-link {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-focus-shadow-rgb: 25, 135, 84;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--bs-primary);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--bs-primary);
    --bs-gradient: none;
    border: 1px solid;
}

#section_form_find_job {
    position: relative;
    overflow: hidden;
}

#section_form_find_job::before {
    background: url(../img/bg_cat_small.png) no-repeat right bottom;
    content: "";
    position: absolute;
    overflow: hidden;
    display: block;
    width: 457px;
    height: 340px;
    /* left: calc(50% + 263px); */
    right: 0;
    bottom: 0;
}



#form_find_job h2,
#container_list_jobs h2,
#container_job_detail h2,
#container_list_posts h2,
#section_contact h1 {
    font-family: 'Nunito', 'Nunito Black' !important;
    font-size: 3rem;
    color: var(--bs-primary) !important;
    font-weight: 700;
    line-height: 1.5;
}

#form_find_job .block {
    background-color: #f2fee9;
    border-radius: 20px;
}

#form_find_job .block label .require-mark {
    border: 1px solid var(--bs-primary) !important;
    border-radius: 30px;
    background-color: #fff;
    font-size: 0.7rem;
    padding: 5px 10px;
}

#form_find_job .block .form-control {
    border-color: var(--bs-primary) !important;
}

#form_find_job p.description {
    margin-top: 40px;
    margin-bottom: 40px;
    color: #333333;
    font-family: 'Nunito', 'Nunito SemiBold' !important;
}

#form_find_job #btn_submit {
    --bs-btn-padding-y: 0.6rem;
    --bs-btn-padding-x: 2rem;
    --bs-btn-font-size: 2rem;
    --bs-btn-border-radius: 45px;
    background-color: #e97b0d;
    border-color: #bc5e00;
    padding-bottom: 14px;
    font-family: 'Nunito', 'Nunito SemiBold' !important;
    font-weight: 700;
}

#form_find_job #btn_submit:hover,
#view_all:hover {
    background-color: #bc5e00;
}

#section_show_list_jobs {
    background: url(../img/bg_list_jobs.png) no-repeat bottom #F3F7FF;
}

/* #container_list_jobs h2 {
    font-family: 'Nunito', 'Nunito Black' !important;
    font-size: 3rem;
    color: var(--bs-primary) !important;
    font-weight: 700
} */

#container_list_jobs .block .item-job {
    border-radius: 20px;
    font-size: 1.3rem;
}

.item-job .job-info {
    font-family: 'Nunito', 'Nunito SemiBold' !important;
}

.item-job .job-info .title {
    font-family: 'Nunito', 'Nunito Black' !important;
    /* font-size: 3rem; */
    color: var(--bs-primary) !important;
    font-weight: 700
}

.item-job .job-info .detail .published_at {
    font-size: 0.95rem;
}

.item-job .job-info a.view-detail {
    background-color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
    border-radius: 50px;
}

.item-job .job-info a.view-detail:hover {
    background-color: var(--bs-link-hover-color) !important;
}

#view_all,
#load_more {
    --bs-btn-padding-y: 0.6rem;
    --bs-btn-padding-x: 2rem;
    --bs-btn-font-size: 2rem;
    --bs-btn-border-radius: 45px;
    background-color: #e97b0d;
    border-color: #bc5e00;
    padding-bottom: 14px;
    font-family: 'Nunito', 'Nunito SemiBold' !important;
    font-weight: 700;
}

#load_more .spinner-border {
    border-width: 5px !important;
    color: var(--bs-primary) !important;
}

#section_job_detail {
    background: url(../img/bg_list_jobs.png) no-repeat bottom #F3F7FF;
}

#container_job_detail .card.item-job {
    border: none;
}

#container_job_detail .job-info {
    font-size: 1.2rem;
}

#form_find_job .form-content {
    font-size: 1.2rem;
}

/*************Contact**********/
#section_contact {
    background: url(../img/bg_decor.png) no-repeat center bottom;
}

#section_contact h1 {
    font-family: 'Nunito', 'Nunito Black' !important;
    font-size: 3rem;
    color: var(--bs-primary) !important;
    font-weight: 700;
    line-height: 1.5;
}

#section_contact .description {
    font-family: 'Nunito', 'Nunito Black' !important;
    font-size: 1rem;
}

#contact_form {
    background: url(../img/bg_contact_form.png) no-repeat center center;
    color: #fff;
    font-size: 1.3rem;
}

#contact_form h2 {
    color: #c09415;
    font-family: 'Nunito', 'Nunito Black' !important;
    font-size: 2.2rem;
    font-weight: 700
}

/*************Recommended Post**********/
#section_show_list_posts {
    background: url(../img/bg_list_jobs.png) no-repeat bottom #F3F7FF;
}

#container_list_posts .block .item-post {
    border-radius: 20px;
    font-size: 1.3rem;
}

.item-post .post-info {
    font-family: 'Nunito', 'Nunito SemiBold' !important;
}

.item-post .post-info .title {
    font-family: 'Nunito', 'Nunito Black' !important;
    /* font-size: 3rem; */
    color: var(--bs-primary) !important;
    font-weight: 700
}

.item-post .post-info .detail .published_at {
    font-size: 0.95rem;
}

.item-post .post-info a.view-detail {
    background-color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
    border-radius: 50px;
}

.item-post .post-info a.view-detail:hover {
    background-color: var(--bs-link-hover-color) !important;
}

/*************Post Detail**********/
#section_post {
    background: url(../img/bg_list_jobs.png) no-repeat bottom #F3F7FF;
}

#section_post h1 {
    font-family: 'Nunito', 'Nunito Black' !important;
    font-size: 3rem;
    color: var(--bs-primary) !important;
    font-weight: 700;
    line-height: 1.5;
}

#section_post h2 {
    font-size: 2.5rem !important;
}

/*************Page Detail**********/
#section_page {
    background: url(../img/bg_list_jobs.png) no-repeat bottom #F3F7FF;
}

#section_page h1 {
    font-family: 'Nunito', 'Nunito Black' !important;
    font-size: 3rem;
    color: var(--bs-primary) !important;
    font-weight: 700;
    line-height: 1.5;
}

#section_page h2 {
    font-size: 2.5rem !important;
}

/********************* `md` applies to small devices (landscape phones, less than 768px) **************************/
@media (max-width: 767.98px) {
    #section_form_find_job::before {
        background: url(../img/bg_cat_small.png) no-repeat right bottom;
        width: 100%;
        height: 200px;
        right: 0;
        bottom: 0;
    }
}

/********************* `sm` applies to x-small devices (portrait phones, less than 576px) **************************/
@media (max-width: 575.98px) {
    #section_form_find_job {
        padding-bottom: 105px !important;
    }

    #section_form_find_job::before {
        background: url(../img/bg_cat_small.png) no-repeat right bottom;
        width: 100%;
        height: 200px;
        right: 0;
        bottom: 0;
    }

    .img-star-1,
    .img-star-2 {
        width: 75px;
    }

    #contact_form {
        font-size: 1rem;
    }

    #contact_form h2 {
        font-size: 1.8rem;
    }

    #contact_form .phone img {
        height: 30px;
    }

    #contact_form .phone .h5 {
        font-size: 0.9rem;
    }
}