svg {
    width: 100%;
    height: auto;
}

/* .nav-item:hover, */
.nav-link:hover,
.nav-link.active {
    background-color: #00afef !important;
    color: white !important;
    /* font-family: sans-serif !important; */
}

/* Media Query for Mobile */
@media (max-width: 767px) {
    .mobile-footer-view {
        text-align: center;
    }
}

.link-hover:hover {
    font-weight: bolder !important;
    transition: background-color 0.3s ease-in-out !important;
}

.exhibition-btn {
    border: none !important;
    background-color: #d2d2d2;
    text-decoration: none;
}

.exhibition-btn:focus,
.exhibition-btn.active {
    background-color: #21559b !important;
    color: white !important;
    border: none !important;
    text-decoration: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* .exhibition-scroll {
    scrollbar-width: none;
    -ms-overflow-style: none;
} */

.exhibition-scroll {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    padding-bottom: 6px;
    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;          /* Firefox */
    -ms-overflow-style: none;       /* IE 10+ */
}

.exhibition-scroll::-webkit-scrollbar {
    display: none; /* Hides scrollbar in Chrome, Safari */
}

.custom-hr {
    width: 50% !important; /* Adjust the width as needed */
    border: none !important; /* Remove default border */
    border-top: 1px solid #000 !important; /* Set the border color and thickness */
    margin: 5px 0 !important; /* Adjust spacing around the hr */
}

/* Style for the event number inside a circle */
.event-number {
    display: inline-block;
    width: 8px;
    height: 8px;
    line-height: 8px;
    /* border: 1px solid black; */
    border: 1px solid #21558A;
    border-radius: 50%;
    /* color: black; */
    color: #21559b !important;
    text-align: center;
    font-weight: bold;
    background: #21559b;
    margin-right: 2px;
    font-size: 8px;
}

.event-text {
    color: #21559b !important;
}

/* Optional: Style for the list to make it appear in a line */
.exhibition-event {
    display: inline-block;
    text-align: left !important;
    width: 100%;
}

.drop_zone {
    border: 1px dashed #cccccc;
}

.drop_zone.dragover {
    background-color: #f5f5f5;
}

.drop_zone > span {
    color: #ccccd3;
    font-size: 12pt;
    text-align: center;
    display: block;
    pointer-events: none;
}

.drop_zone > label {
    background: #eee;
}

.drop_zone > label > input {
    display: none;
}

/* this is for mobile number */
.iti {
    width: 100%;
}

.salutation {
    width: 100px !important; /* Adjust width as needed */
    flex: none !important; /* Prevents auto-stretch */
}