/*!* VARIABLES *!*/

/** {*/
/*    --light-color: #f7f5f5;*/
/*    --dark-color: #0C120C;*/
/*    --primary-color: #0c2753;*/
/*    --secondary-color: #FF5666;*/
/*    --accent-color: #C4D7F2;*/
/*}*/


/*!* GENERAL STYLES *!*/
/*body {*/
/*    font-family: 'DM+Sans', sans-serif;*/
/*    background-color: var(--light-color);*/
/*}*/

/*h1 {*/
/*    color: var(--dark-color);*/
/*    font-weight: bold;*/
/*    font-size: xxx-large;*/
/*}*/

/*h3 {*/
/*    color: var(--dark-color);*/
/*    font-weight: lighter;*/
/*    font-size: x-large;*/
/*}*/

/*.btn-primary {*/
/*    background-color: var(--primary-color);*/
/*    border-color: var(--primary-color);*/
/*}*/

/*.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {*/
/*    color: var();*/
/*    background-color: var();*/
/*    border-color: var();*/
/*}*/


/*!* BASE STYLES *!*/
/*!* NAVBAR *!*/

/*.navbar-nav {*/
/*    width: 100% !important;*/
/*}*/

/*.navbar {*/
/*    border: 2px solid #0c2753; !* Adds a border with custom color *!*/
/*    background-color: var(--light-color) !important;*/
/*}*/

/*!* FOOTER *!*/

/*.footer {*/
/*    background-color: var(--light-color) !important;*/
/*}*/


/*!* LANDING PAGE CSS *!*/
/*!* MAIN LANDING PAGE *!*/
/*!* HERO SECTION *!*/

/*.landing-hero {*/
/*    min-height: 84vh;*/
/*}*/

/*!* ABOUT PAGE *!*/

/*.about-hero {*/
/*    min-height: 84vh;*/
/*}*/

/*.about-image {*/
/*    max-height: 50vh;*/
/*    border-radius: 25px;*/
/*}*/

/*!* CONTACT PAGE *!*/

/*.contact-hero {*/
/*    min-height: 84vh;*/
/*}*/

/*!* AUTH *!*/
/*!* LOGIN *!*/
/*.login-page {*/
/*    min-height: 84vh;*/
/*}*/

/*!* MAIN *!*/
/*!* MAIN *!*/
/*.main-section {*/
/*    min-height: 84vh;*/
/*}*/


/*!* ACCOUNT *!*/
/*.img-wrapper-account {*/
/*    position: relative;*/
/*    width: 10vw;*/
/*    padding-top: 10vw; !* This ensures the aspect ratio remains 1:1 *!*/
/*    overflow: hidden;*/
/*}*/

/*.profile-image {*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    object-fit: cover;*/
/*    border-radius: 100px;*/
/*}*/

/*.notifications {*/
/*    color: #78291c;*/
/*    text-decoration: none;*/
/*    position: relative;*/
/*    display: inline-block;*/
/*    border-radius: 4px;*/
/*}*/

/*.notifications .badge {*/
/*    position: absolute;*/
/*    top: -5px;*/
/*    right:10px;*/
/*    padding:3px 5px;*/
/*    border-radius: 50%;*/
/*    border-color: #78291c;*/
/*    background: #0c2753;*/
/*    color: white ;*/
/*}*/
/*.navbar_btn {*/
/*    color: #78291c;*/
/*    text-decoration: none;*/
/*    position: relative;*/
/*    display: inline-block;*/
/*}*/
/*.navbar {*/
/*    font-family: "Roboto", sans-serif;*/
/*    border-bottom: 3px solid #78291c; !* Adds a border with custom color *!*/
/*    background-color: #A9A9A9 !important;*/
/*}*/

/*body {*/
/*    font-family: "Roboto", sans-serif;*/
/*}*/
/*.sidenav {*/
/*    height: 100%; !*Full-height: remove this if you want "auto" height *!*/
/*    width: 0px; !* Set the width of the sidebar *!*/
/*    position: Fixed; !* Fixed Sidebar (stay in place on scroll) *!*/
/*    z-index: 1; !* Stay on top *!*/
/*    top: 45px; !* Stay at the top *!*/
/*    left: 0;*/
/*    border-right: 3px solid #78291c;*/
/*    background-color: #f1f1f1; !* Black *!*/
/*    overflow-x: hidden; !* Disable horizontal scroll *!*/
/*    padding-top: 60px;*/
/*    transition: 0.5s; !* 0.5 second transition effect to slide in the sidenav *!*/
/*    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
/*    }*/

/*    !* The navigation menu links *!*/
/*.sidenav a {*/
/*    font-family: "Roboto", sans-serif;*/
/*    padding: 8px 8px 8px 32px;*/
/*    text-decoration: none;*/
/*    font-size: 25px;*/
/*    color: #0c2753;*/
/*    display: block;*/
/*    transition: 0.3s;*/
/*    }*/

/*    !* When you mouse over the navigation links, change their color *!*/
/*.sidenav a:hover {*/
/*    color: #78291c;*/
/*    }*/

/*.sidenav .closebtn {*/
/*    position: absolute;*/
/*    top: 15px;*/
/*    right: 0px;*/
/*    font-size: 25px;*/
/*    font-size: 36px;*/
/*    margin-left: 50px;*/
/*}*/

/*    !* Style page content *!*/
/*.main {*/
/*    margin-left: 160px; !* Same as the width of the sidebar *!*/
/*    padding: 0px 10px;*/
/*    }*/

/*.btn-primary {*/
/*    background-color: #0c2753;*/
/*    border-color: #78291c;*/
/*}*/


/*.btn-primary:hover {*/
/*    color: #78291c;*/
/*    background-color: white;*/
/*    border-color: #78291c;*/
/*}*/

/*.btn-danger {*/
/*    background-color: #78291c;*/
/*    border-color: #0c2753;*/
/*}*/

/*.btn-danger:hover {*/
/*    background-color: #78291c;*/
/*    border-color: #78291c;*/
/*}*/

/*.btn-outline-danger {*/
/*    color: #78291c;*/
/*    border-color: #78291c;*/
/*}*/
/*.btn-outline-danger:hover {*/
/*    background-color: #78291c;*/
/*    border-color: #0c2753;*/
/*}*/

/*!* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) *!*/
/*@media screen and (max-height: 450px) {*/
/*.sidenav {padding-top: 15px;}*/
/*.sidenav a {font-size: 18px;}*/
/*}*/
/*    !* Ensure the text area is full width and auto-expands *!*/
/*textarea.form-control-sm {*/
/*    width: 100%;*/
/*    box-sizing: border-box; !* Ensures padding and border are included in width *!*/
/*}*/

/*.d-flex {*/
/*display: flex;*/
/*}*/

/*.justify-content-end {*/
/*    justify-content: flex-end; !* Align items to the end (right side) *!*/
/*}*/
/*!* Dropdown Button *!*/
/*.dropbtn {*/
/*    background-color: #04AA6D;*/
/*    color: white;*/
/*    padding: 16px;*/
/*    font-size: 16px;*/
/*    border: none;*/
/*}*/

/*!* The container <div> - needed to position the dropdown content *!*/
/*.dropdown {*/
/*    position: relative;*/
/*}*/

/*!* Dropdown Content (Hidden by Default) *!*/
/*.dropdown-content {*/
/*    display: none;*/
/*    position: absolute;*/
/*    background-color: #f1f1f1;*/
/*    min-width: 160;*/
/*    max-width: 200;*/
/*    width: auto;*/
/*    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
/*    z-index: 1;*/
/*    padding: 5px;*/
/*    overflow-wrap: break-word; !* Ensures long content wraps *!*/
/*    border: 1px solid #ccc; !* Optional: add border for clarity *!*/
/*    right: 0; !* Move dropdown to the right of the parent *!*/
/*}*/

/*!* Links inside the dropdown *!*/
/*.dropdown-content a {*/
/*    color: black;*/
/*    padding: 8px 12px;*/
/*    text-decoration: none;*/
/*    display: block;*/
/*    word-wrap: break-word;*/
/*}*/

/*!* Change color of dropdown links on hover *!*/
/*.dropdown-content a:hover {background-color: #ddd;}*/

/*!* Show the dropdown menu on hover *!*/
/*.dropdown:hover .dropdown-content {display: block;}*/

/*!* Change the background color of the dropdown button when the dropdown content is shown *!*/
/*.dropdown:hover .dropbtn {background-color: #3e8e41;}*/
/*.search-bar-container {*/
/*    display: flex;*/
/*    justify-content: flex-end; !* Centers horizontally *!*/
/*    align-items: center;    !* Centers vertically *!*/
/*    flex-grow: 1;          !* Makes the search bar take available space *!*/
/*    margin-right: 100px;*/
/*}*/
/*!* Dark Mode background *!*/
/*body {*/
/*    background-color:#dddddd;*/
/*}  */
/*.custom-card-bg {*/
/*    background-color: #cccccc;*/
/*    border-color: #78291c;*/
/*    border-width: 2.5px;*/
/*}*/
/*!* Tab Background and Text Color *!*/
/*.custom-tabs .nav-link {*/
/*    background-color: #0c2753; !* Tab background *!*/
/*    color: white; !* Text color *!*/
/*    border: 1px solid #78291c; !* Optional: Tab border *!*/
/*}*/

/*!* Active Tab Style *!*/
/*.custom-tabs .nav-link.active {*/
/*    background-color: #A9A9A9; !* Active tab background *!*/
/*    color: white; !* Active tab text *!*/
/*    border-bottom-color: #78291c;*/
/*}*/

/*!* Hover Effects *!*/
/*.custom-tabs .nav-link:hover {*/
/*    background-color: #78291c;*/
/*    border-color: #0c2753;*/
/*}*/

/*!* Add this CSS to your main stylesheet *!*/

/*!*html, body {*!*/
/*!*    height: 100%;*!*/
/*!*    margin: 0;*!*/
/*!*}*!*/

/*!*.wrapper {*!*/
/*!*    display: flex;*!*/
/*!*    flex-direction: column;*!*/
/*!*    min-height: 100vh;*!*/
/*!*}*!*/

/*!*main.flex-fill {*!*/
/*!*    flex: 1;*!*/
/*!*}*!*/
