* {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
 }

 html,
 body {
   min-height: 100%;
   overflow-x: hidden;
 }

 body {
   font-family: 'Times New Roman', Times, serif;
 }

 .booking_container {
   max-width: 1250px;
   margin: 0 auto;
   /*background: white;*/
   border-radius: 20px;

   box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
   overflow: hidden;
 }

 .booking_header {
   background: linear-gradient(135deg, #03405e 0%, #2a5298 100%);
   color: white;
   padding: 15px;
   text-align: center;
 }

 .booking_header h1 {
   font-size: 2.1em;
   margin-bottom: 10px;
 }

 .booking_header p {
   font-size: 1.1em;
   opacity: 0.9;
   margin-bottom: 0.4rem;
 }

 .booking-content {
   display: grid;
   grid-template-columns: 2fr 1fr;
   gap: 30px;
   padding: 30px;
 }

 .booking-form {
   display: flex;
   flex-direction: column;
   gap: 25px;
 }

 .section {
   background: #f8f9fa;
   padding: 25px;
   border-radius: 15px;
   border-left: 5px solid #2a5298;
 }

 .section-title {
   color: #03405e;
   font-size: 1.4em;
   margin-bottom: 10px;
   display: flex;
   align-items: center;
   gap: 10px;
 }

 .section-title::before {
   content: '';
   width: 8px;
   height: 8px;
   background: #2a5298;
   border-radius: 50%;
 }

 .form-group {
   margin-bottom: 20px;
 }

 label {
   display: block;
   color: #333;
   font-weight: 600;
   margin-bottom: 8px;
   font-size: 0.95em;
 }

 input[type="date"],
 input[type="text"],
 input[type="email"],
 input[type="tel"],
 select {
   width: 100%;
   padding: 10px 15px;
   border: 2px solid #e0e0e0;
   border-radius: 8px;
   font-size: 1em;
   transition: all 0.3s;
 }

 input:focus,
 select:focus {
   outline: none;
   border-color: #2a5298;
   box-shadow: 0 0 0 3px rgba(42, 82, 152, 0.1);
 }

 .time-slots {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
   gap: 10px;
   margin-top: 10px;
 }

 .time-slot {
   padding: 12px;
   border: 2px solid #e0e0e0;
   border-radius: 8px;
   text-align: center;
   cursor: pointer;
   transition: all 0.3s;
   background: white;
 }

 .time-slot:hover {
   border-color: #2a5298;
   background: #f0f4ff;
 }

 .time-slot.selected {
   background: #2a5298;
   color: white;
   border-color: #2a5298;
 }

 .traveller-counter {
   display: flex;
   align-items: center;
   gap: 15px;
   background: white;
   padding: 15px;
   border-radius: 8px;
   margin-bottom: 15px;
 }

 .counter-label {
   flex: 1;
   font-weight: 600;
   color: #333;
 }

 .counter-controls {
   display: flex;
   align-items: center;
   gap: 15px;
 }

 .counter-btn {
   width: 35px;
   height: 35px;
   border: 2px solid #2a5298;
   background: white;
   color: #2a5298;
   border-radius: 50%;
   cursor: pointer;
   font-size: 1.2em;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.3s;
 }

 .counter-btn:hover {
   background: #2a5298;
   color: white;
 }

 .counter-value {
   min-width: 30px;
   text-align: center;
   font-weight: bold;
   font-size: 1.2em;
   color: #2a5298;
 }

 .traveller-details {
   background: white;
   padding: 20px;
   border-radius: 8px;
   margin-bottom: 15px;
   border: 2px solid #e0e0e0;
 }

 .traveller-header {
   color: #2a5298;
   font-weight: 600;
   margin-bottom: 15px;
   font-size: 1.1em;
 }

 .form-row {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 15px;
 }

 .addon-item {
   background: white;
   padding: 15px;
   border-radius: 8px;
   border: 2px solid #e0e0e0;
   margin-bottom: 15px;
   display: flex;
   align-items: center;
   gap: 15px;
   cursor: pointer;
   transition: all 0.3s;
 }

 .addon-item:hover {
   border-color: #2a5298;
   box-shadow: 0 4px 12px rgba(42, 82, 152, 0.1);
 }

 .addon-item.selected {
   border-color: #2a5298;
   background: #f0f4ff;
 }

 .addon-checkbox {
   width: 24px;
   height: 24px;
   cursor: pointer;
 }

 .addon-info {
   flex: 1;
 }

 .addon-name {
   font-weight: 600;
   color: #333;
   margin-bottom: 5px;
 }

 .addon-description {
   font-size: 0.9em;
   color: #666;
 }

 .addon-price {
   font-weight: bold;
   color: #2a5298;
   font-size: 1.1em;
 }

 .sidebar {
   position: sticky;
   top: 20px;
   height: fit-content;
 }

 .summary-card {
   background: linear-gradient(135deg, #03405e 0%, #2a5298 100%);
   color: white;
   padding: 25px;
   border-radius: 15px;
   margin-bottom: 20px;
 }

 .summary-title {
   font-size: 1.5em;
   margin-bottom: 20px;
 }

 .summary-item {
   display: flex;
   justify-content: space-between;
   padding: 12px 0;
   border-bottom: 1px solid rgba(255, 255, 255, 0.2);
 }

 .summary-item:last-child {
   border-bottom: none;
 }

 .summary-total {
   font-size: 1.5em;
   font-weight: bold;
   /*margin-top: 15px;*/
   padding-top: 15px;
   padding-bottom: 15px;
   /*border-top: 2px solid rgba(255, 255, 255, 0.3);*/
 }

 .itinerary-card {
   background: #f8f9fa;
   padding: 25px;
   border-radius: 15px;
   border-left: 5px solid #2a5298;
 }

 .itinerary-title {
   color: #03405e;
   font-size: 1.3em;
   margin-bottom: 15px;
 }

 .itinerary-day {
   background: white;
   padding: 15px;
   border-radius: 8px;
   margin-bottom: 10px;
 }

 .day-title {
   color: #2a5298;
   font-weight: 600;
   margin-bottom: 8px;
 }

 .day-description {
   color: #666;
   font-size: 0.95em;
   line-height: 1.6;
 }

 .inclusions {
   margin-top: 20px;
 }

 .inclusion-item {
   display: flex;
   align-items: center;
   gap: 10px;
   padding: 8px 0;
   color: #333;
 }

 .inclusion-item::before {
   content: '✓';
   color: #2a5298;
   font-weight: bold;
   font-size: 1.2em;
 }

 .book-btn {
   /*width: 100%;
   padding: 18px;*/

   width: 40%;
   padding: 9px;

   /*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
   background: linear-gradient(135deg, #fbb040, #99600a 100%);
   color: white;
   border: none;
   border-radius: 10px;
   font-size: 1.2em;
   font-weight: 600;
   cursor: pointer;
   transition: all 0.3s;
   box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
 }

 .book-btn:hover {
   transform: translateY(-2px);
   box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
 }

 .modal {
   display: none;
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.7);
   z-index: 1000;
   overflow-y: auto;
   padding: 20px;
 }

 .modal.active {
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .modal-content {
   background: white;
   border-radius: 20px;
   max-width: 600px;
   width: 100%;
   max-height: 90vh;
   overflow-y: auto;
   box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
   animation: modalSlideIn 0.3s ease-out;
 }

 @keyframes modalSlideIn {
   from {
     transform: translateY(-50px);
     opacity: 0;
   }

   to {
     transform: translateY(0);
     opacity: 1;
   }
 }

 .modal-header {
   background: linear-gradient(135deg, #03405e 0%, #2a5298 100%);
   color: white;
   padding: 25px 30px;
   border-radius: 20px 20px 0 0;
   display: flex;
   justify-content: space-between;
   align-items: center;
 }

 .modal-header h3 {
   font-size: 1.5em;
   margin: 0;
 }

 .close-modal {
   background: rgba(255, 255, 255, 0.2);
   border: none;
   color: white;
   width: 35px;
   height: 35px;
   border-radius: 50%;
   font-size: 1.5em;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.3s;
 }

 .close-modal:hover {
   background: rgba(255, 255, 255, 0.3);
   transform: rotate(90deg);
 }

 .modal-body {
   padding: 30px;
 }

 .traveller-list {
   margin-bottom: 20px;
 }

 .traveller-card {
   background: #f8f9fa;
   padding: 15px 20px;
   border-radius: 10px;
   margin-bottom: 10px;
   display: flex;
   justify-content: space-between;
   align-items: center;
   border: 2px solid #e0e0e0;
   transition: all 0.3s;
 }

 .traveller-card:hover {
   border-color: #2a5298;
   box-shadow: 0 4px 12px rgba(42, 82, 152, 0.1);
 }

 .traveller-card.completed {
   border-color: #28a745;
   background: #f0fff4;
 }

 .traveller-info {
   flex: 1;
 }

 .traveller-name {
   font-weight: 600;
   color: #333;
   margin-bottom: 3px;
 }

 .traveller-type {
   font-size: 0.85em;
   color: #666;
 }

 .edit-traveller-btn {
   padding: 8px 20px;
   background: #2a5298;
   color: white;
   border: none;
   border-radius: 6px;
   cursor: pointer;
   font-weight: 600;
   transition: all 0.3s;
 }

 .edit-traveller-btn:hover {
   background: #03405e;
 }

 .completed-icon {
   color: #28a745;
   font-size: 1.2em;
   margin-right: 10px;
 }

 .modal-form {
   background: #f8f9fa;
   padding: 25px;
   border-radius: 12px;
   margin-top: 20px;
 }

 .form-title {
   color: #03405e;
   font-size: 1.2em;
   margin-bottom: 20px;
   font-weight: 600;
 }

 .radio-group {
   display: flex;
   gap: 20px;
   margin-top: 8px;
 }

 .radio-label {
   display: flex;
   align-items: center;
   gap: 8px;
   cursor: pointer;
   font-weight: normal;
 }

 .radio-label input[type="radio"] {
   width: auto;
   cursor: pointer;
 }

 .save-traveller-btn {
   width: 100%;
   padding: 15px;
   /*background: linear-gradient(135deg, #28a745 0%, #20c997 100%);*/
   background: linear-gradient(135deg, #fbb040, #99600a 100%);
   color: white;
   border: none;
   border-radius: 8px;
   font-size: 1.1em;
   font-weight: 600;
   cursor: pointer;
   transition: all 0.3s;
   margin-top: 20px;
 }

 .save-traveller-btn:hover {
   transform: translateY(-2px);
   box-shadow: 0 4px 15px rgba(40, 167, 69, 0.4);
 }

 .add-details-btn {
   width: 100%;
   padding: 15px;
   background: #2a5298;
   color: white;
   border: 2px solid #2a5298;
   border-radius: 10px;
   font-size: 1em;
   font-weight: 600;
   cursor: pointer;
   transition: all 0.3s;
   margin-top: 10px;
 }

 .add-details-btn:hover {
   background: #03405e;
   border-color: #03405e;
 }

 @media (max-width: 968px) {
   .booking-content {
     grid-template-columns: 1fr;
   }

   .form-row {
     grid-template-columns: 1fr;
   }

   .booking_header h1 {
     font-size: 1.8em;
   }
 }

 /* ===== Button Back Top ===== */

 .back-top a {
   position: fixed;
   bottom: 20px;
   right: 20px;
   border: 2px solid #03405e;
   background-color: #03405e;
   width: 40px;
   height: 40px;
   line-height: 36px;
   text-align: center;
   font-size: 24px;
   z-index: 100;
   color: #fff;
   top: 0;
   opacity: 0;
   transition: all 0.9s linear 0s;
 }

 .back-top a::after {
   z-index: -1;
   content: "";
   position: absolute;
   left: -2px;
   top: -2px;
   width: 40px;
   height: 40px;
   animation: ripple 1.6s ease-out infinite;
   opacity: 1;
   background: #2c62de;
 }

 @-webkit-keyframes ripple {
   0% {
     transform: scale(0);
     opacity: 1;
   }

   100% {
     transform: scale(1.5);
     opacity: 0;
   }
 }

 .back-top {
   position: relative;
   top: 0;
   display: block;
 }

 .back-top.active a {
   opacity: 1;
   top: 90%;
 }

 .back-top a:hover {
   background-color: #fcb33f;
   border: 2px solid #fcb33f;
   color: #fff;
 }

 /* ============= Footer ============= */

 .bg-footer {
   background: #03405e;
 }

 .footer-content {
   padding: 46px 0px;
 }

 .info-company-widget .content-widget p {
   color: #ffffffb3;
   margin-bottom: 14px;
 }

 .info-company-widget .footer-logo {
   margin-bottom: 23px;
 }

 .footer-logo a {
   color: #fff;
   font-weight: 500;
 }

 .footer-logo a:hover {
   color: #fff;
   font-weight: 500;
 }

 .info-company-widget .content-widget .social a {
   background: #fff0;
   width: 30px;
   height: 30px;
   display: inline-block;
   text-align: center;
   line-height: 30px;
   margin-right: 4px;
   border-radius: 100%;
   border: 1px solid #fff;
   color: #fff;
   transition: all 0.4s;
 }

 .info-company-widget .content-widget .social a:hover {
   background: #fff;
   color: #03405e;
 }

 .info-company-widget .content-widget span {
   color: #fff;
   font-size: 18px;
   font-weight: bold;
   display: block;
   margin-bottom: 14px;
 }

 .info-company-widget .content-widget span i {
   margin-right: 8px;
 }

 .copyright {
   padding: 8px 0px;
   background: #071025;
 }

 .copyright small {
   color: #fff;
 }

 /*===== Preloader =====*/

 .spinner-wrapper {
   position: fixed;
   z-index: 999999;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   background: #fff;
 }

 .logo-spinner {
   position: absolute;
   top: 50%;
   left: 50%;
   text-align: center;
   margin-left: -70px;
   margin-top: -80px;
 }

 .spinner {
   position: absolute;
   top: 50%;
   /* centers the loading animation vertically one the screen */
   left: 50%;
   /* centers the loading animation horizontally one the screen */
   width: 3.75rem;
   height: 3.25rem;
   margin: -0.625rem 0 0 -1.875rem;
   /* is width and height divided by two */
   text-align: center;
 }

 .spinner>div {
   display: inline-block;
   width: 1rem;
   height: 1rem;
   border-radius: 100%;
   background-color: #03405e;
   -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
   animation: sk-bouncedelay 1.4s infinite ease-in-out both;
 }

 .spinner .bounce1 {
   -webkit-animation-delay: -0.32s;
   animation-delay: -0.32s;
 }

 .spinner .bounce2 {
   -webkit-animation-delay: -0.16s;
   animation-delay: -0.16s;
 }

 @-webkit-keyframes sk-bouncedelay {

   0%,
   80%,
   100% {
     -webkit-transform: scale(0);
   }

   40% {
     -webkit-transform: scale(1.0);
   }
 }

 @keyframes sk-bouncedelay {

   0%,
   80%,
   100% {
     -webkit-transform: scale(0);
     -ms-transform: scale(0);
     transform: scale(0);
   }

   40% {
     -webkit-transform: scale(1.0);
     -ms-transform: scale(1.0);
     transform: scale(1.0);
   }
 }

 /* ============= Header ============= */

 /*Top Bar*/

 .header-topbar {
   font-size: 14px;
   padding: 8px 0px;
   border-bottom: 1px solid #ffffff73;
 }

 .header-topbar.bg-blue {
   background: #03405e;
 }

 ul.topbar-left li {
   border-right: 1px solid #fff;
   padding-right: 12px;
 }

 ul.topbar-left li a {
   color: #ffffff;
 }

 ul.topbar-left li a:hover {
   text-decoration: none;
 }

 ul.topbar-left.list-unstyled.list-inline.float-left {
   display: inline-flex;
   margin: 0px;
 }

 ul.topbar-left li:nth-child(2) {
   padding-left: 12px;
   border: 0px;
 }

 ul.dropdown-language.list-unstyled li a {
   padding: 8px 48px;
   display: block;
   padding-left: 12px;
   color: #505050;
   transition: all 0.4s;
 }

 ul.dropdown-language.list-unstyled li a:hover {
   text-decoration: none;
   background: #03405e;
   color: #fff;
 }

 ul.dropdown-language.list-unstyled li:nth-child(2) {
   padding-left: 0px;
   padding-right: 0px;
 }

 ul.dropdown-language.list-unstyled li:nth-child(1) {
   border: 0px;
   padding-right: 0px;
   border-bottom: 1px solid #ececec;
 }

 li.language img {
   margin-right: 8px;
   margin-top: -3px;
 }

 li.language i,
 li.monney i {
   margin-left: 4px;
   position: relative;
 }

 ul.dropdown-language.list-unstyled {
   position: absolute;
   background: #fff;
   z-index: 99;
   top: 29px;
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.12);
   transition: all 0.4s;
 }

 ul.dropdown-monney.list-unstyled {
   position: absolute;
   background: #fff;
   z-index: 99;
   top: 29px;
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.12);
   transition: all 0.4s;
 }

 ul.dropdown-money.list-unstyled li:nth-child(1) {
   border-bottom: 1px solid #ececec;
 }

 ul.dropdown-monney.list-unstyled li:nth-child(2) {
   padding-left: 0px;
   border-top: 1px solid #ececec;
   border-bottom: 1px solid #ececec;
 }

 ul.dropdown-monney.list-unstyled li a {
   padding: 8px 93px;
   display: block;
   padding-left: 12px;
   color: #505050;
   transition: all 0.4s;
 }

 ul.dropdown-monney.list-unstyled li a:hover {
   transition: all 0.4s;
   background: #03405e;
   text-decoration: none;
   color: #fff;
 }

 ul.dropdown-monney.list-unstyled li {
   border-right: none;
   padding-right: 0px;
 }

 ul.topbar-right {
   display: inline-flex;
   margin: 0px;
 }

 ul.topbar-right li {
   border-right: 1px solid #ffffff;
   padding-right: 18px;
 }

 ul.topbar-right li:nth-child(2) {
   padding-left: 18px;
   border: 0px;
 }

 .topbar-login a,
 .topbar-register a {
   color: #ffffffde;
   transition: all 0.4s;
 }

 .topbar-login a:hover,
 .topbar-register a:hover {
   text-decoration: none;
   color: #ffffff;
 }

 .topbar-login a i,
 .topbar-register a i {
   margin-right: 8px;
 }

 .hide {
   transform: scale(0);
 }

 /*Header style*/

 .base-header {
   background-color: #fff0;
 }

 .header-default {
   line-height: 80px;
   width: 100%;
 }

 .header-default.header-style-2 {
   border-bottom: 1px solid #ffffff73;
 }


 .header {
   transition: all 0.4s;
   position: relative;
   z-index: 9;
 }

 .header-default.hide-menu {
   top: -120px !important;
   position: fixed;
   transition: all 0.6s ease;
 }

 .header-default.header-style-2.header-fixed {
   position: fixed;
   top: 0;
   transition: all 0.6s ease;
   left: 0;
   right: 0;
   background: #ffffff;
   z-index: 99999;
   height: 65px;
 }

 .header-default.header-fixed {
   position: fixed;
   top: 0;
   transition: all 0.6s ease;
   left: 0;
   right: 0;
   background: #03405e;
   z-index: 99999;
   height: 55px;
 }

 .brand-logo a {
   display: block;
 }

 .header-style-2 .navbar ul.navbar-nav li a.nav-link {
   color: #212529;
 }

 .header-style-2 .navbar ul.navbar-nav li a.nav-link.active {
   color: #212529 !important;
 }

 .header-style-2 ul.navbar-nav a.nav-link.active:before {
   position: absolute !important;
   height: 2px !important;
   content: '' !important;
   transition: all 0.4s ease;
   background: #03405e !important;
   bottom: 18px !important;
   width: 100% !important;
 }

 .header-style-2 ul.navbar-nav li a.nav-link:before {
   position: absolute;
   height: 2px;
   content: '';
   transition: all 0.4s ease;
   background: #03405e;
   bottom: 14px;
   width: 0;
 }

 .header-default.header-style-2 .logo-white {
   display: block;
   text-align: center;
 }

 .header-default.header-style-2 .brand-logo {
   width: 100%;
   display: block;
   line-height: 60px;
   padding-top: 10px;
 }

 .header-default.header-style-2.header-fixed .brand-logo {
   display: inline-block;
   width: auto;
 }

 .header-style-2 nav.navbar.navbar-expand-lg {
   float: none !important;
   margin: auto;
   display: table;
 }

 .header-default.header-style-2.header-fixed nav.navbar.navbar-expand-lg {
   float: right !important;
   display: inline-block;
   margin: 0;
 }

 .header-style-2 ul.navbar-nav {
   margin: auto;
   margin-left: 46px;
 }

 .logo-black {
   display: none;
 }

 .header-fixed .brand-logo a {
   line-height: 65px;
   margin-top: -10px;
   display: block;
 }

 .brand-logo {
   display: inline-block;
 }

 .header-fixed .brand-logo .logo-white {
   height: 65px;
   display: block !important;
 }

 .header-fixed .brand-logo .logo-black {
   display: none !important;
 }

 .header-fixed .brand-logo {
   height: 65px;
   margin-top: -5px;
 }

 .header-default.header-style-2 .header-fixed .brand-logo {
   display: inline-block;
 }

 .header-fixed .brand-logo .logo-white img {
   margin-top: -25px;
   max-width: 115px;
 }

 .base-header.bg-white .brand-logo .logo-white {
   display: none;
 }

 .base-header.bg-white .brand-logo .logo-black {
   display: block;
 }

 .base-header.bg-white .navbar ul.navbar-nav li a.nav-link {
   color: #212529;
 }

 .base-header.bg-white .navbar ul.navbar-nav li a.nav-link:hover {
   color: #03405e;
 }

 .base-header.bg-white a.nav-link.active {
   color: #03405e !important;
 }

 .base-header.bg-white .header-fixed .navbar ul.navbar-nav li a.nav-link {
   color: #ffffff9c;
 }

 .base-header.bg-white .header-fixed .navbar ul.navbar-nav li a.nav-link:hover {
   color: #fff;
 }

 .base-header.bg-white .header-fixed a.nav-link.active {
   color: #ffffff !important;
 }

 .bg-white ul.navbar-nav a.nav-link.active:before {
   position: absolute !important;
   height: 2px !important;
   content: '' !important;
   transition: all 0.4s ease;
   background: #03405e !important;
   bottom: 18px !important;
   width: 100% !important;
 }

 .bg-white ul.navbar-nav li a.nav-link:before {
   position: absolute;
   height: 2px;
   content: '';
   transition: all 0.4s ease;
   background: #03405e;
   bottom: 14px;
   width: 0;
 }

 .bg-white .header-fixed ul.navbar-nav a.nav-link.active:before {
   position: absolute !important;
   height: 2px !important;
   content: '' !important;
   transition: all 0.4s ease;
   background: #ffffff !important;
   bottom: 18px !important;
   width: 100% !important;
 }

 .bg-white .header-fixed ul.navbar-nav li a.nav-link:before {
   position: absolute;
   height: 2px;
   content: '';
   transition: all 0.4s ease;
   background: #ffffff;
   bottom: 14px;
   width: 0;
 }

 .navbar {
   padding: 0px;
 }

 nav.navbar.for-mobile {
   display: none;
 }

 nav.navbar.navbar-expand-lg.float-right.for-mobile {
   display: none;
 }

 .icon-nav-mobile-open {
   display: none;
 }

 .icon-nav-mobile-close {
   display: none;
 }

 .navbar ul.navbar-nav li a.nav-link {
   padding: 0;
   text-transform: uppercase;
   font-size: 13px;
   font-weight: bold;
   color: #ffffffb8;
   transition: all 0.4s;
   position: relative;
   line-height: 80px;
   margin-right: 40px;
 }

 .header-fixed .navbar ul.navbar-nav li a.nav-link {
   line-height: 65px;
 }

 a.nav-link.active {
   color: #ffffff !important;
 }

 ul.navbar-nav a.nav-link.active:before {
   position: absolute !important;
   height: 2px !important;
   content: '' !important;
   transition: all 0.4s ease;
   background: #ffffff !important;
   bottom: 18px !important;
   width: 100% !important;
 }

 ul.navbar-nav li a.nav-link:before {
   position: absolute;
   height: 2px;
   content: '';
   transition: all 0.4s ease;
   background: #ffffff;
   bottom: 14px;
   width: 0;
 }

 ul.navbar-nav li.nav-item.btn-search a.nav-link:before {
   background: transparent;
 }

 .navbar ul.navbar-nav li:hover a.nav-link:before {
   color: #ffffff;
   width: 50px;
   transition: all 0.4s ease;
 }

 ul.navbar-nav li a.nav-link:hover {
   color: #ffffff;
 }

 .navbar-nav ul li a {
   text-transform: uppercase;
   color: #363638;
   padding: 24px 18px;
 }

 ul.sub-menu a.dropdown-item {
   padding: 8px 32px;
   transition: all 0.2s;
   text-transform: capitalize;
   font-size: 15px;
   line-height: 32px;
   display: block;
   font-weight: 500;
   width: 180px;
 }

 ul.sub-menu a.dropdown-item:hover {
   background: #03405e;
   color: #fff;
 }

 .dropdown-menu a.dropdown-item {
   padding: 12px 32px;
 }

 ul.navbar-nav li a i {
   margin-left: 4px;
 }

 .dropdown>.dropdown-toggle:active {
   pointer-events: none;
 }

 ul.navbar-nav li .sub-menu {
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.12);
   list-style: none;
   background: #ffffff;
   position: absolute;
   padding: 0;
   opacity: 0;
   transition: all 0.4s;
   visibility: hidden;
   transform-style: preserve-3d;
   transform: rotateX(-90deg);
   z-index: 9999;
 }

 ul.navbar-nav li:hover .sub-menu {
   opacity: 1;
   visibility: visible;
   transform: rotateX(0deg);
 }

 ul.navbar-nav li:hover i {
   transform: rotate(180deg);
   transition: all 0.4s ease;
 }

 ul.navbar-nav li.nav-item.btn-search:hover i {
   transform: rotate(0deg);
   transition: all 0.4s ease;
 }

 ul.navbar-nav li i {
   transition: all 0.4s ease;
 }

 .nav-search {
   position: absolute;
   top: 75px;
   right: 21px;
   padding: 20px;
   background-color: #ffffff26;
   box-shadow: 0 3px 5px rgba(0, 0, 0, .2);
   transition: all 0.4s;
   opacity: 1;
   z-index: 1;
 }

 .nav-search.hide {
   display: block;
   opacity: 0;
   right: -100px;
 }

 .nav-search form input[type='text'] {
   display: table-cell;
   width: 225px;
   height: 40px;
   padding: 0 20px;
   border: none;
   background: #f7f7f7;
   margin-right: -4px;
 }

 .nav-search form .searchbutton {
   position: relative;
   top: -1px;
   display: table-cell;
   width: 40px;
   height: 40px;
   padding: 0;
   text-align: center;
   vertical-align: middle;
   border: none;
   background-color: #fcb33f;
   box-shadow: none;
   color: #fff;
 }


 .form-row-btn {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 15px;
   margin-top: 20px;
 }

 .btn {
   padding: 10px;
   font-size: 1.05em;
   font-weight: 600;
   border: none;
   border-radius: 8px;
   cursor: pointer;
   transition: all 0.3s ease;
 }

 /* Grey Close Button */
 .btn-close {
   flex: 0 0 30%;
   /* 30% width */
   background: #6c757d;
   color: white;
 }

 .btn-close:hover {
   background: #5a6268;
   color: white;
 }

 /* Yellow Save Button */
 .btn-save {
   background: linear-gradient(135deg, #fbb040, #99600a);
   color: white;
 }

 .btn-save:hover {
   background: linear-gradient(135deg, #fbc461, #b27210);
   color: white;
 }