@font-face {
  font-family: 'Big Caslon';
  src: url('big-caslon-regular.ttf') format('truetype'); /* Make sure the font file is in the same folder */
  font-weight: normal;
  font-style: normal;
}

body {
  font-family: "Montserrat", sans-serif;
}


 #middlenav .custom-slide .navbar-nav .nav-link
 {
     font-weight:400;
     font-size:21px;
     margin-right:20px;
     color:black;
 }
 .dropdown-item.active, .dropdown-item:active {
    color: #ffffff;
    text-decoration: none;
    background-color: #f9e5b7;
}
 #middlenav .navbar-expand-lg .navbar-nav .nav-link
 {
     
     font-weight:bold;
     font-size:22px;
 }
  #middlenav  .navbar 
  {
      position:relative;
  }
  #middlenav  .logo-circle
{
   height: 810px;
    position: absolute;
    left: 50%;
  transform: translate(-50%, -26%);
    
    z-index:5;
}

 /* Mobile Sidebar */
    @media (max-width: 991.98px) {
        .ri-arrow-right-s-line
        {
            display:none;
        }
      #middlenav .custom-slide {
        position: fixed;
        top: 0;
        left: 0;
        transform: translateX(-100%);
        height: 100vh;
        width: 250px;
        background-color: #343a40;
        padding-top: 60px;
        transition: transform 0.4s ease-in-out;
        z-index: 999;
        flex-direction: column;
        display: flex !important;
      }
      #middlenav .custom-slide .navbar-nav .nav-link {
    font-weight: 400;
    font-size: 21px;
    margin-right: 20px;
    color: #ffffff;
}

      #middlenav .custom-slide.show {
        transform: translateX(0);
      }

      #middlenav .close-btn {
        position: absolute;
        top: 15px;
        right: 15px;
        font-size: 28px;
        color: white;
        cursor: pointer;
      }

      #middlenav .custom-slide .nav-link {
        color: white;
        font-size: 18px;
        padding: 10px 20px;
      }

      #middlenav .custom-slide .nav-link:hover {
        background: transparent;
        color: #ffc107;
      }

      #middlenav .sidebar-backdrop {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        z-index: 1040;
        display: none;
      }

      #middlenav .sidebar-backdrop.show {
        display: block;
      }

      body.offcanvas-open {
        overflow: hidden;
      }

      #middlenav .dropdown {
        position: relative;
      }

      /* Updated dropdown styling */
      #middlenav .dropdown-menu {
        position: relative;
        left: 0;
        width: 100%;
        margin: 0;
        padding: 0.5rem 1.5rem;
        background-color: #343a40;
        border-radius: 0;
        display: none;
        box-shadow: none;
        z-index: 1050;
        opacity: 0;
        transform: translateY(-10px);
        transition: opacity 0.3s ease, transform 0.3s ease;
      }

      #middlenav .dropdown-menu.show {
        display: block;
        opacity: 1;
        transform: translateY(0);
      }

      #middlenav .dropdown-menu .nav-link {
        color: white;
        padding: 8px 15px;
      }

      #middlenav .dropdown-menu .nav-link:hover {
        background-color: #495057;
        color: #ffc107;
      }

      /* Dropdown icon rotation */
      #middlenav .dropdown-link i {
        margin-left: 5px;
        transition: transform 0.3s ease;
      }

      #middlenav .dropdown-link i.rotate {
        transform: rotate(180deg);
      }

      /* Align navbar content to the left on mobile view */
      #middlenav .custom-slide .navbar-nav {
        margin-left: 0 !important;
        margin-right: 0 !important;
      }

      #middlenav .custom-slide .navbar-nav.ms-auto {
        margin-left: 0 !important;
      }

      /* Adjusting the content of the sidebar to be left aligned */
      #middlenav .custom-slide .navbar-nav .nav-link {
        text-align: center;
      }

      #middlenav .custom-slide .navbar-nav .nav-item {
        width: 100%;
      }

      /* Submenu icon */
      #middlenav .submenu i {
        float: right;
        
      }   
    }