
nav {
	background: var(--violet);
  margin:0 auto;
}  
    /* normal menu css */
    .primary_menu {
      text-align: center;
    }
    .main_menu > ul > li {
        display: inline-block;
        position: relative;
        /*margin: 0 -2px;*/
      }
      .main_menu ul li {
        position: relative;
      }
      
    .main_menu ul li a {
	position: relative;
	margin: 0;
	border: 0px;
	padding: 10px 15px 10px 15px;
	text-decoration: none;
	font-size: 16px;
	font-weight: 500;
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 2px;
	letter-spacing: 0.07rem;
	color: #fff;
}
      .main_menu ul li a i {
        font-size: 13px;
        line-height: 100%;
        margin-top: 1px;
      }
      .main_menu ul li .active,
      .main_menu ul li:hover > a {
        background:var(--maroon);
        color:var(--bs-white);
      }
      /* Normal Dropdown menu */
      .main_menu ul li ul {
        width: 230px;
        background: #fff;
        transition: 0.5s;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);
        padding:0;
      }
      

      .main_menu ul li ul > li > a {
        padding: 10px 10px;
        font-weight: 400;
        font-size: 15px;
        text-transform: none;
        color: #333;
        white-space: nowrap;
        letter-spacing: 0.01rem;
        font-family:var(--Primary-font);
        text-wrap: wrap;
        border-bottom: solid 1px #e5e5e5;
      }
 
    .main_menu ul li ul > li > a:hover{background: #3e4095;color: #F2D85A;}
      
      .main_menu ul li ul li ul {
        left: 100%;
        top: 0;
      }

      .main_menu ul li ul > li > ul > li > a {
        padding: 8px 10px;
        letter-spacing: 0;
      }
      
      /* mega menu css */
      .mega_menu_dropdown {
        position: static !important;
      }
      .mega_menu {
        left: 0;
        right: 0;
        background: #fff;
        display: flex;
        flex-wrap: wrap;
        transition: 0.5s;
        box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);
      }
      .mega_menu_item {
        width: 25%;
        padding: 30px 20px;
      }
    
      .mega_menu_item3 {
        width:33.33%;
        padding: 10px 10px;
      }
      .main_menu ul li .mega_menu_item a {
        padding: 10px 0;
        color: #333;
        text-align: left;
        text-transform: none;
      }
      .main_menu ul li .mega_menu_item3 a {
        padding: 10px 0;
        color: #333;
        text-align: left;
        text-transform: none;
      }
      
      .main_menu ul li .mega_menu_item a:hover {
        color: var(--hover-color);
      }
      .mega_menu_item h3 {
        margin-bottom: 15px;
        text-align: left;
      }
      .mega_menu_item img {
        width: 100%;
      }
      
      /* demo_2 css */
      .mega_menu_demo_2 .mega_menu {
        left: 50%;
        transform: translateX(-50%);
        width: 1140px;
      }

      /* demo_3 css */
      .mega_menu_demo_3 .mega_menu {
        left: 50%;
        transform: translateX(-50%);
        width: 940px;
      }
      
      .mobile_btn {
        display: none;
      }
      
      /* responsive css */
      @media (min-width: 992px) and (max-width: 1199.98px) {
        .container {
          width: 960px;
        }
        .mega_menu_demo_2 .mega_menu {
          width: 940px;
        }
        .mega_menu_demo_3 .mega_menu {
          width: 640px;
        }
        .main_menu ul li ul {
          width: 150px;
        }
      }
      
      @media (min-width: 768px) and (max-width: 991.98px) {
        .container {
          width: 720px;
        }
        .mega_menu_demo_2 .mega_menu {
          width: 700px;
        }
        .mega_menu_demo_3 .mega_menu {
          width: 500px;
        }
        .main_menu ul li a {
          font-size: 15px;
          padding: 20px 16px;
        }
        .main_menu ul li ul {
          width: 150px;
        }
      }
      @media (min-width: 768px) {
        .main_menu ul li ul {
          visibility: hidden;
          opacity: 0;
          position: absolute;
          margin-top: 50px;
          text-align: left;
        }
        .main_menu ul li .mega_menu {
          visibility: hidden;
          opacity: 0;
          position: absolute;
          margin-top: 50px;
        }
        .main_menu ul li:hover > ul {
          visibility: visible;
          opacity: 1;
          margin-top: 0px;
          z-index: 99;
        }
        .main_menu ul li:hover > .mega_menu {
          visibility: visible;
          opacity: 1;
          margin-top: 0;
          z-index: 99;
        }
      }
      
      @media (max-width: 767.98px) {
        .mega_menu_demo_2 .mega_menu,
        .container {
          width: 100%;
        }
      
        nav {
          padding:0;
          width: 100%;
        }
.mobile_btn {
	cursor: pointer;
	color: #fff;
	font-size: 26px;
	line-height: 100%;
	text-align: right;
	background: #202020;
	border: 1px solid #0C0C0C;
	padding: 8px;
	border-radius: 5px;
	margin: 0 10px;
	max-width: 42px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: auto;
}
      
        .main_menu {
          display: none;
          width: 100%;
        }
      
        .main_menu ul li {
          display: block;
        }
     
        .main_menu ul li a {
          border-bottom: 1px solid #7e20a4;
        }
        .main_menu ul li:last-child a {
	border-bottom: none;
}
        .main_menu ul li ul {
          width: 100%;
        }
        .main_menu ul li ul li ul {
          left: 0;
          top: auto;
        }
      
        .mega_menu .mega_menu_item {
          width: 50%;
        }
        .main_menu ul li ul {
          display: none;
          transition: none;
        }
        .main_menu ul li .mega_menu {
          display: none;
          transition: none;
        }
      
        .mega_menu_demo_2 .mega_menu {
          transform: translateX(0);
        }
      }
      
      @media (max-width: 575.98px) {
        .mega_menu .mega_menu_item {
          width: 100%;
        }
      }
      