body{
    font-family: 'Montserrat', math, 'Roboto', sans-serif;
    background-color:#f5f7fb;
}
.text-gold{
    color: #af8a4b!important;
}
.ff-math{
   font-family: math!important;
}
.navbar-custom {
    position: fixed;
    top: 10px;
    left: 15px;
    right: 15px;
    z-index: 1030; /* High z-index to keep navbar on top */
    background-color: rgba(0,0,0,0.60);
 }
.navbar-custom .logo img{
    max-width: 350px!important;
    padding-top:5px;
}

@media (max-width: 360px) {
    .navbar-custom .logo img {
        max-width: 200px !important;
    }
}


.mt-7rem{
    margin-top: 7rem!important;
}
.mb-7rem{
    margin-bottom: 7rem!important;
}
.lh-25{
    line-height: 25px!important;
}
.image-container {
    position: relative;
    width: 100%;
}

.image-container img {
    width: 100%;
    height: auto;
    display: block;
}

.overlay {
    position: absolute;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 84, 107, 0.6);
    color: white;
    width: 100%;
    height: 100%;
    text-align: center;
    padding: 20px 0;
    opacity: 0;
    transition: opacity 0.5s;
}

.image-container:hover .overlay {
    opacity: 1;
}
#scrollToTopBtn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
    z-index: 99;
    opacity: 0.3;
}
#scrollToTopBtn:hover {
    opacity: 1;
}
.nav-item .active{
    color:#af8a4b!important;
    font-weight: bolder;
}
.parallax {
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: top;
    height: 350px;
}
.parallax-breadcrumb {
    background-size: contain;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: top;
    height: 431px;
}

@media (max-width: 1024px) {
    .mt-7rem{
        margin-top: 0;
    }
    .mb-7rem{
        margin-bottom: 0.1rem!important;
    }
    .parallax-breadcrumb {
        background-size: auto!important;
        overflow: hidden!important;

    }
}
@media (orientation: landscape) and (max-width: 768px) {
    .mt-7rem{
        margin-top: 0;
    }
    .mb-7rem{
        margin-bottom: 0.1rem!important;
    }
    .parallax-breadcrumb {
        background-size: auto!important;
        overflow: hidden!important;

    }
    text-sm-center{
        text-align: center!important;
    }
}