 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 body {
     font-family: 'Poppins', sans-serif;
 }

 .navbar {
     display: flex;
     background: linear-gradient(yellow, red);
     color: #fff;
     align-items: center;
     --bs-navbar-padding-y: 0rem;
 }

 .navbar-nav .nav-item {
     margin-top: 18px;
     margin-right: 10px;
     text-align: center;
     /* background-color: #3f373; */
     /* background: linear-gradient(rgb(186, 204, 231), rgb(18, 47, 194)); */
     background: blueviolet;
     border-radius: 10px;
     box-shadow: 1px 2px 2px #dc3545;
 }

 .navbar-nav .nav-item:hover {

     border-radius: 10px;
     background: linear-gradient(rgb(37 85 160), rgb(58 59 63));
     box-shadow: 1px 2px 2px #160000;
 }

 .navbar-nav .nav-link {
     color: white;
     font-weight: bold;
     transition: all 0.3s ease;
 }

 .navbar-nav .nav-link:hover {
     /* color: black; */
     color: white;

 }

 .topbar-fixed {
     display: none;
 }

 .topbar-links {
     display: flex;
     align-items: center;
     justify-content: center;
     flex-direction: column;
 }

 .topbar,
 .topbar-fixed {
     h2 {
         color: #2555a0;
         font-weight: 700;
         margin-bottom: 0;
         padding-bottom: 0rem;
         /* text-shadow: 1px 1px 0px #f7cb00, 0px 0px 14px #ffffff; */
     }

     h5,
     h6 {
         margin: 0;
         padding: 0;
         color: rgb(2, 3, 46);
         font-size: 16px;
         text-align: center;
     }
 }

 .navbar-toggler {
     /* margin-top: 75px; */
     /* margin-top: 36px; */
     margin-top: 0;
     text-align: center;
 }

 /* .topLogo {
     width: 100%;
     max-width: 160px;
     height: 120px;
 } */

 .topLogoleft {
     margin-left: 0px;
     max-width: 134px;
 }

 .topLogoRight {
     margin-right: 0px;
     max-width: 240px;
 }

 @media (max-width:1200px) {
     .topLogoRight {
         max-width: 200px;
     }

     /* .topbar-links {
         margin-bottom: 0.5rem;
     } */
 }

 @media (max-width: 991px) {
     .topLogo {
         width: 100%;
         max-width: 100px;
         height: auto;
         border-radius: 10%;
         /* margin-left: 100px; */
     }

     .topbar-fixed {
         /* position: fixed;
         top: 0;
         left: 0;
         right: 0; */
         /* background: linear-gradient(#ffb70a, #d83c10); */
         color: #fff;
         padding: 4px 0;
         text-align: center;
         display: flex;
         align-items: center;
         justify-content: center;
         flex-direction: column;
         margin-left: -2rem;
     }

     .topbar-links .topbar {
         display: none;
     }

     .navbar-collapse {
         position: absolute;
         top: 100%;
         left: 0;
         width: 100%;
         background: linear-gradient(yellow, #d83c10);
         box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
         z-index: 1000;
         color: white;
     }

     .navbar-nav {
         flex-direction: column;
         text-align: center;
         width: 100%;
     }

     .navbar-nav .nav-item {
         margin: 2px 0;
     }

     .navbar-brand {
         margin-right: 0;
         margin-top: -50px;
     }

     .topLogoleft {
         max-width: 116px;
     }

     .topLogoRight {
         max-width: 170px;
     }

     .navbar {
         justify-content: center;
     }
 }

 @media (max-width:768px) {
     .navbar-brand {
         margin-right: 0;
         margin-top: -12px;
     }
 }

 @media (max-width:575px) {
     .topLogoRight {
         max-width: 150px;
         margin-bottom: -30px;
     }

     .topbar-fixed {
         margin-left: 0rem;
     }
 }

 @media (max-width: 400px) {
     .topLogo {
         width: 100%;
         max-width: 90px;
         height: auto;
         border-radius: 10%;
         margin-right: auto;
         /* margin-left: 5px; */
     }

     .topLogoleft {
         margin-left: 10px;

     }

     .topLogoRight {
         margin-left: 10px;
         margin-bottom: -10px;
         max-width: 130px;
     }

     .navbar-toggler {
         margin-top: 60px;
         text-align: center;
     }

     .navbar-toggler {
         position: absolute;
         right: 42.5%;
         top: 13px;
     }

     .topbar h3 {
         font-size: 17px;
     }

     .topbar h5 {
         margin-top: -8px;
         color: rgb(2, 3, 46);
         font-size: 10px;
     }

 }

 @media (max-width: 260px) {
     .topLogo {
         width: 100%;
         max-width: 50px;
         height: auto;
         border-radius: 10%;
         margin-top: -50px;
         /* margin-left: 5px; */
     }

     .topLogoleft {
         margin-left: 10px;

     }

     .topLogoRight {
         margin-left: 10px;
     }

     .navbar-toggler {
         margin-top: 60px;
         text-align: center;
     }

     .topbar h3 {
         font-size: 16px;
     }

     .topbar h5 {
         margin-top: -8px;
         color: rgb(2, 3, 46);
         font-size: 10px;
     }

 }

 .navbar-collapse {
     flex-basis: 100%;
     flex-grow: 0;
     align-items: center;
 }

 /* .nav-item.active {
     background-color: #007bff;
 } */

 .nav-link.active {
     color: #fff !important;
 }