@font-face {
    font-family: 'tajawal-regular';
    src: url('../font/tajawal-regular.woff') format('woff'), url('../font/tajawal-regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
:root {
    --primary-color: #8e6d2a;
    --secondary-color: #4e3614;
    --third-color: #291a05;
    --fourth-color: #b9a57b;
    --fifth-color: #7e6e56;
    --tajawal-regular: tajawal-regular, system-ui, -apple-system,"Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/*#region ----Bootstrap Color */
.btn-primary, .btn-primary:active, .btn-primary:visited {
    color: #fff !important;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
    .btn-primary:hover {
        color: #fff !important;
        background-color: var(--third-color);
        border-color: var(--primary-color);
    }
    .btn-primary:focus,
    .btn-primary.focus {
        box-shadow: 0 0 0 .2rem #7a306d;
        border-color: var(--primary-color);
    }
.btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary:visited {
    color: var(--primary-color) !important;
    background-color: #fff;
    border-color: var(--primary-color);
}
    .btn-outline-primary:hover {
        color: #fff !important;
        background-color: var(--primary-color);
        border-color: var(--primary-color);
    }

/*#endregion */

/*#region ----General */
body {
    font-family: var(--tajawal-regular);
    color: var(--secondary-color);
    font-size: 14pt;
}
a {
    text-decoration: none;
    color: var(--primary-color) !important;
}
    a:hover {
        color: var(--secondary-color) !important;
    }
    a.active {
        color: var(--third-color) !important;
        font-weight:600;
    }

.primary-color {
    color: var(--primary-color) !important;
}
.secondary-color {
    color: var(--secondary-color) !important;
}
.third-color {
    color: var(--third-color) !important;
}
.forth-color {
    color: var(--forth-color) !important;
}
.fifth-color {
    color: var(--fifth-color) !important;
}
.primary-bg{
    background: var(--primary-color);
    color: #fff !important;
}
.secondary-bg {
    background: var(--secondary-color);
    color: #fff !important;
}
.third-bg {
    background: var(--third-color);
    color: #fff !important;
}
.fourth-bg {
    background: var(--fourth-color);
    color: #fff !important;
}
.fifth-bg {
    background: var(--fifth-color);
    color: #fff !important;
}

h1 {
    font-weight: 600;
    color: var(--secondary-color);
}

h2 {
    font-weight: 600;
    color: var(--primary-color);
}
.pageContent p{
    padding-top: 16px;
}
.project-thumb {
    position: relative;
    width: 100%;
    height: 400px;
    overflow: hidden;
    border-radius: 16px;
}

    .project-thumb img {
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
/*#endregion */
/*#region ----Banner */
.banner-caption {
    background-color: #7a306db6;
    text-align: right;
}
.carousel-item h1 {
    color: #fff !important;
}
.carousel-item img {
    height: 600px;
    width: auto;
}
@media (max-width: 575px) {
    .carousel-item img {
        height: 300px;
        width: 100%;
    }
}
/*#endregion */

/*#region ----Header & Footer */
.header{
}
.imgLogo{
    height:100px;
    margin-left:16px;
}
footer {
    font-size:12pt;
}
/*#endregion */

/*#region ----Map */
#map{
    width:100%;
    height:500px;
    padding:0px;
    margin:0px;
}
.map{
    width:100%;
    height:100%;
}
/*#endregion */

@media (max-width: 575px) {
    .project-thumb {
        height: 250px;
    }
}