html {
    scroll-behavior: smooth;
    overflow: unset;
}

body {
    /* font-family: 'Roboto', sans-serif; */
    font-family: 'Montserrat', sans-serif;
}

/* global css utils */
.w-85p {
    width: 85%;
}

.w-95p {
    width: 95%;
}

.w-fit-content {
    width: fit-content;
}

.w-max-width {
    width: max-content;
}

.overflow-x-auto {
    overflow-x: auto;
}
.mt-82p {
    margin-top: 82px;
}
.my-1_1r {
    margin-top: 1.1rem;
    margin-bottom: 1.1rem;
}
.margin-auto {
    margin: auto;
}
.margin-right-auto {
    margin-right: auto;
}

.fs-14p {
    font-size: 0.875rem;
}

.fs-1r {
    font-size: 1rem;
}

.fw-400 {
    font-weight: 400;
}

.ml-40p {
    margin-left: 40px;
}

.hide,
.show-only-over-865px,
.show-only-under-865px {
    display: none;
}

@media (min-width: 866px) {
    .show-only-over-865px {
        display: block;
    }
}
@media (max-width: 865px) {
    .show-only-under-865px {
        display: block;
    }
}
@media (min-width: 1280px) {
    .show-over-1280px {
        display: block;
    }
}

/* specific utils */

.category-page-bgColor {
    background-color: #171616;
}

.exchange-label {
    background-color: #f5fafa;
}

.card-img-top {
    border-radius: 12px;
}

a:hover {
    color: #06c;
    text-decoration: underline;
}

.rounded-4 {
    border-radius: 12px;
}

.title {
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
    line-height: 105%;
}

.nav-link[role='tab'] {
    background: 0;
    border-radius: 14px;
}

.nav-link[role='tab'].active {
    background-color: #dbe8f1 !important;
}

.fw-bold {
    text-decoration: none;
}

.fw-normal {
    text-decoration: none;
}

.small {
    font-size: 12px;
}

.fa {
    font-size: 22px;
}

.zoom:hover {
    opacity: 0.9;
    cursor: pointer;
}

.nav-link,
a {
    font-family: 'Montserrat', sans-serif;
    /* font-size: 14px; */
    line-height: 18px;
    font-weight: 600;
    letter-spacing: -0.1px;
    color: #555759;
}

.h1 {
    font-size: 60px;
}

.progress-container {
    width: 100%;
    height: 3px;
    background: #dadada;
}

.progress-bar {
    height: 3px;
    background: #cd1818;
    width: 0%;
}

.content {
    margin-left: 75px;
    font-size: 30px;
}

.next {
    margin-right: -26px !important;
}

/* categoryPage */
.categoryPage-textCard {
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 100%);
    border-radius: 14px;
}

/* contact-form */

/* override mdb's padding-right: 0px to keep the page inching on modal open */
body.modal-open {
    padding-right: 17px !important;
}

#contactUsModal .modal-dialog {
    min-width: min(800px, 100vw - 2rem) !important;
}

#contactUsModal .form-label {
    margin-bottom: 0.35rem;
}

#contactUsModal .form-control.is-valid,
#contactUsModal .form-control.is-valid:focus {
    border-color: #16a34a;
    background-image: unset;
}

#contactUsModal .invalid-feedback {
    font-size: 0.9rem;
    color: #d97706;
}

#contactUsModal .notification {
    border-bottom: 2px solid black;
    padding-bottom: 0.25rem;
    font-size: 1.1rem;
}

#contactUsModal .notification.success {
    border-color: #16a34a;
}

#contactUsModal .notification.warning {
    border-color: #d97706;
}

#contactUsModal #submit {
    height: 48px;
    width: 113px !important;
}

#contactUsModal .spinner-border-sm {
    height: 1.4rem;
    width: 1.4rem;
}

a .animate-underline {
    background: linear-gradient(currentColor 0 0) bottom left/ var(--underline-width, 0%) 0.1em no-repeat;
    color: black;
    display: inline-block;
    padding-bottom: 0.35rem;
    text-decoration: none !important;
    transition: background-size 0.75s ease-in-out;
}

a:hover .animate-underline {
    --underline-width: 100%;
}

.zoom img {
    -webkit-transition: all 0.75s ease-in-out;
    -o-transition: all 0.75s ease-in-out;
    transition: all 0.75s ease-in-out;
}

/* header */

.header-home a {
    color: white !important;
    text-shadow: 0px 0px 0.25px white;
    font-weight: 400 !important;
    font-size: 1.1rem !important;
}

.fullscreen-image-container {
    width: 100%;
    height: calc(100vh - 56.25px); /* 100% of the viewport height - footer */
    overflow: hidden; /* Hide any parts of the image that overflow */
}

.fullscreen-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures the image covers the container, cropping if necessary */
    object-position: center; /* Centers the image within the container */
}

.footer-home-bg {
    background-color: #eadec4;
}