/***
 Site Name: LimoHungary.com
 Version: 1.1
==============================
TABLE CONTENT
 Import Google Fonts
 Include Third Party CSS Library
 GENERAL
 HEADER
 Offcanvas Sidebar
 Search form
 Main header
 Mega menu
 Header layouts
 Page layouts
 Pagination
 Breadcrumb
 CATEGORY PAGES
 SINGLE POST
 Author box
 comment
 Post share social
 Custom amine
***/

@import url(https://fonts.bunny.net/css?family=dm-sans:400,500,700);
/*import vendors*/
@import url(../css/vendors/normalize.css);
@import url(../css/vendors/bootstrap.min.css);
@import url(../css/vendors/uicons-regular-rounded.css);
@import url(../css/plugins/swiper-bundle.min.css);
@import url(../css/plugins/magnific-popup.css);
@import url(../css/plugins/select2.min.css);
@import url(../css/plugins/slick.css);
@import url(../css/plugins/jquery-ui.css);
@import url(../css/plugins/perfect-scrollbar.css);
@import url(../css/plugins/animate.css);
@import url(../css/plugins/jquery.timepicker.min.css);

:root {
    --dark-color: #0b0b0d;
    background: #0b0b0d;
    color-scheme: dark;
}

/*RESET*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

main {
  display: block;
  clear: both;
    background-color: var(--dark-color);
}

thead {
  font-weight: 600;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

body {
  line-height: 1;
    overscroll-behavior-y: none;
    background-color: var(--dark-color);
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img {
  max-width: 100%;
}

input,
select,
button,
textarea {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
}

*:focus,
select:focus,
.custom-select:focus,
button:focus,
textarea:focus,
textarea.form-control:focus,
input.form-control:focus,
input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=number]:focus,
[type=text].form-control:focus,
[type=password].form-control:focus,
[type=email].form-control:focus,
[type=tel].form-control:focus,
[contenteditable].form-control:focus {
  outline: none !important;
  box-shadow: none !important;
}

input:focus::-moz-placeholder {
  opacity: 0;
  -moz-transition: 0.4s;
  transition: 0.4s;
}

li.hr span {
  width: 100%;
  height: 1px;
  background-color: #e4e4e4;
  margin: 20px 0;
  display: block;
}

/*--- Common Classes---------------------*/
::-moz-selection {
  background: #069; /* WebKit/Blink Browsers */
  color: #fff;
}
::selection {
  background: #069; /* WebKit/Blink Browsers */
  color: #fff;
}

::-moz-selection {
  background: #069; /* Gecko Browsers */
  color: #fff;
}

::-moz-placeholder {
  color: #122830;
  opacity: 1;
}

::placeholder {
  color: #122830;
  opacity: 1;
}

:-ms-input-placeholder,
::-webkit-input-placeholder {
  color: #122830;
  opacity: 1;
}

*:focus,
select:focus,
.custom-select:focus,
button:focus,
textarea:focus,
textarea.form-control:focus,
input.form-control:focus,
input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=number]:focus,
[type=text].form-control:focus,
[type=password].form-control:focus,
[type=email].form-control:focus,
[type=tel].form-control:focus,
[contenteditable].form-control:focus {
  outline: none !important;
  box-shadow: none;
}

.img-responsive {
  max-width: 100%;
}

body {
  font-family: "DM Sans", sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "DM Sans", sans-serif;
  font-style: normal;
  color: #000000;
}

h1 {
  font-weight: 700;
  font-size: 52px;
  line-height: 76px;
}

h2 {
  font-weight: 700;
  font-size: 44px;
  line-height: 58px;
}

h3 {
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
}

h4 {
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
}

h5 {
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
}

h6 {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}

.heading-52 {
  font-weight: 400;
  font-size: 52px;
  line-height: 76px;
}

.heading-52-medium {
  font-weight: 500;
  font-size: 52px;
  line-height: 76px;
}

.heading-52-bold {
  font-weight: 700;
  font-size: 52px;
  line-height: 76px;
}

.heading-44 {
  font-weight: 400;
  font-size: 44px;
  line-height: 58px;
}

.heading-44-medium {
  font-weight: 500;
  font-size: 44px;
  line-height: 58px;
}

.heading-44-bold {
  font-weight: 700;
  font-size: 44px;
  line-height: 58px;
}

.heading-100-medium {
  font-weight: 700;
  font-size: 100px;
  line-height: 130px;
}

.heading-36-medium {
  font-weight: 500;
  font-size: 36px;
  line-height: 58px;
}

.heading-32-medium {
  font-weight: 500 !important;
  font-size: 32px !important;
  line-height: 58px !important;
}

.heading-30-medium {
  font-weight: 500;
  font-size: 30px;
  line-height: 58px;
}

.heading-24 {
  font-weight: 400;
  font-size: 24px;
  line-height: 32px;
}

.heading-24-medium {
  font-weight: 500;
  font-size: 24px;
  line-height: 32px;
}

.heading-24-bold {
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
}

.bg-white {
  background-color: #ffffff;
}

.color-grey {
  color: #626262;
}

.color-primary {
  color: #000000;
}

.color-text {
  color: #181A1F !important;
}

.bg-primary {
  background-color: #000000 !important;
}

.bg-secondary {
  background-color: #E95440 !important;
}

.text-14 {
  font-size: 14px !important;
  line-height: 24px !important;
  font-weight: 400 !important;
}

.text-14-medium {
  font-size: 14px !important;
  line-height: 24px !important;
  font-weight: 500 !important;
}

.text-14-bold {
  font-size: 14px;
  line-height: 24px;
  font-weight: 700;
}

.text-16 {
  font-size: 16px !important;
  line-height: 28px !important;
  font-weight: 400 !important;
}

.text-16-medium {
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
}

.text-16-bold {
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
}

.text-18 {
  font-size: 18px;
  line-height: 28px;
  font-weight: 400;
}

.text-18-medium {
  font-size: 18px;
  line-height: 28px;
  font-weight: 500;
}

.text-18-medium-2 {
  font-size: 18px;
  line-height: 35px;
  font-weight: 500;
}

.text-18-bold {
  font-size: 18px;
  line-height: 28px;
  font-weight: 700;
}

.text-20 {
  font-size: 20px;
  line-height: 32px;
  font-weight: 400;
}

.text-20-medium {
  font-size: 20px;
  line-height: 32px;
  font-weight: 500;
}

.text-20-bold {
  font-size: 20px;
  line-height: 32px;
  font-weight: 700;
}

.color-success {
  color: #06D6A0;
}

.color-warning {
  color: #FFD166;
}

.color-danger {
  color: #EF476F;
}

.color-secondary {
  color: #E95440;
}

.color-mutted {
  color: #CFDEE3;
}

.color-info {
  color: #28A7E6;
}

.color-white {
  color: #fff !important;
}

.section {
  /*display: inline-block;*/
  width: 100%;
}

.bg-1 {
  background-color: #F0F2F6 !important;
}

.bg-2 {
  background-color: #FDEEEC !important;
}

.bg-3 {
  background-color: #F0FBF7 !important;
}

.bg-4 {
  background-color: #F6F6F6 !important;
}

a {
  color: #181A1F;
  text-decoration: none;
}
a:hover {
  color: #06D6A0;
}

@media (min-width: 1400px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1410px;
  }
}
.hover-up {
  transition: all 0.25s cubic-bezier(0.02, 0.01, 0.47, 1);
}
.hover-up:hover {
  transform: translateY(-2px);
  transition: all 0.25s cubic-bezier(0.02, 0.01, 0.47, 1);
}

img {
  transition: all 0.25s cubic-bezier(0.02, 0.01, 0.47, 1);
}
img:not(.no-hover):hover {
  transform: translateY(-5px);
  transition: all 0.25s cubic-bezier(0.02, 0.01, 0.47, 1);
}

.form-control {
  height: 54px;
  border-radius: 8px;
  color: #3D565F;
  border: 1px solid #CDE2E7;
  padding: 18px 20px;
}
.form-control:focus {
  border-color: #06D6A0;
}

.form-control::-moz-placeholder {
  color: #8EA4AC;
  font-size: 16px;
  line-height: 24px;
  opacity: 1;
}

.form-control::placeholder {
  color: #8EA4AC;
  font-size: 16px;
  line-height: 24px;
  opacity: 1;
}

.form-control:-ms-input-placeholder,
.form-control::-webkit-input-placeholder {
  color: #8EA4AC;
  font-size: 16px;
  line-height: 24px;
  opacity: 1;
}

.table-responsive {
  max-width: 100%;
}

.box-pagination {
  display: inline-block;
}

.pagination {
  display: flex;
  padding-left: 0;
  list-style: none;
  margin-bottom: 20px;
}

.pagination li {
  padding: 0px;
}

.pagination li a {
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #181A1F;
  border: 1px solid #E5E5E5;
  border-left: 0px;
  max-width: 55px;
  min-width: 55px;
  width: 100%;
  text-align: center;
  padding: 15px 20px;
  margin-left: 0px;
}
.pagination li a:hover {
  background-color: #F0FBF7;
}
.pagination li a.active {
  background-color: #000000 !important;
  color: #fff;
}

.pagination li .page-prev {
  background: none;
  min-height: 55px;
  padding: 15px 20px;
  border-radius: 0;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  border: 1px solid #E5E5E5;
}
.pagination li .page-prev svg {
  color: #181A1F;
  height: 14px;
}

.pagination li .page-next {
  min-height: 55px;
  padding: 15px 20px;
  border: 1px solid #E5E5E5;
  border-left: 0px;
  border-radius: 0;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
.pagination li .page-next svg {
  color: #181A1F;
  height: 14px;
}

.page-item:not(:first-child) .page-link {
  margin-left: 0px;
}

.container-sub {
  max-width: 1170px;
  width: 100%;
  padding-right: var(--bs-gutter-x, 0.75rem);
  padding-left: var(--bs-gutter-x, 0.75rem);
  margin-right: auto;
  margin-left: auto;
}

.border-bottom {
  border-bottom: 1px solid #E5E5E5;
}

.ui-datepicker.ui-widget.ui-widget-content {
  border: 2px solid #181A1F !important;
  border-radius: 6px;
  padding: 20px;
  background-color: #ffffff;
}

.ui-datepicker {
  width: 100%;
  max-width: 430px;
}

.ui-datepicker th {
  padding: 14px 14px 4px 14px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  color: #181A1F;
  font-family: "DM Sans", sans-serif !important;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
  background-color: #ffffff;
  border-color: #fff;
  font-size: 15px;
  line-height: 27px;
  color: #181A1F;
  font-family: "DM Sans", sans-serif !important;
  font-weight: 500;
}

.ui-datepicker td span, .ui-datepicker td a {
  text-align: center;
}

.ui-state-default, .ui-widget-content .ui-state-default {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  line-height: 48px;
  padding: 0px;
}
.ui-state-default:hover, .ui-widget-content .ui-state-default:hover {
  background-color: #181A1F;
  color: #fff;
}
.ui-state-default.ui-state-active, .ui-widget-content .ui-state-default.ui-state-active {
  background-color: #181A1F;
  color: #fff;
}
.ui-state-default.ui-state-highlight, .ui-widget-content .ui-state-default.ui-state-highlight {
  background-color: #626262;
  color: #fff;
}

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
  width: 36px;
  height: 36px;
  border: 1px solid #E5E5E5;
  border-radius: 50%;
  line-height: 36px;
  background-color: #ffffff;
  top: 0px;
}
.ui-datepicker .ui-datepicker-prev:hover, .ui-datepicker .ui-datepicker-next:hover {
  background-color: #F0FBF7;
  border-color: #181A1F;
}

.ui-datepicker .ui-datepicker-next {
  background-image: url(../imgs/template/icons/next-day.png);
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
}

.ui-datepicker .ui-datepicker-prev {
  background-image: url(../imgs/template/icons/prev-day.png);
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
}

.ui-datepicker .ui-datepicker-title span {
  font-size: 18px;
  line-height: 28px;
  font-family: "DM Sans", sans-serif !important;
  font-weight: 500;
}

.ui-widget-header {
  border: 0px;
  background: #ffffff;
  color: #181A1F;
}

.bd-rd6 {
  border-radius: 6px;
}

a.color-text:hover, a.color-text:hover *, a.color-white:hover, a.color-white:hover *, a.color-primary:hover, a.color-primary:hover * {
  color: #E95440 !important;
}

.tags a:hover, .latest-new-white .tags a:hover {
  color: #E95440 !important;
}

.box-button-download .btn-download {
  margin-bottom: 20px;
}

.box-count {
  text-align: left;
  margin: 0px 0px 20px 0px;
}
.box-count .deals-countdown {
  border-radius: 0px;
  display: flex;
  padding: 4px 0px;
  width: 100%;
  margin: auto;
  max-width: 100%;
}
.box-count .deals-countdown .countdown-section {
  display: inline-block;
  text-align: center;
  width: 25%;
  line-height: 12px;
  position: relative;
}
.box-count .deals-countdown .countdown-section span {
  display: block;
  color: #fff;
}
.box-count .deals-countdown .countdown-section .countdown-amount {
  font-size: 52px;
  font-weight: 500;
  line-height: 76px;
  color: #fff;
}
.box-count .deals-countdown .countdown-section .countdown-period {
  text-transform: uppercase;
  font-size: 24px;
  font-weight: 500;
  line-height: 32px;
}
.box-count .deals-countdown .countdown-section:last-child::before {
  display: none;
}

a,
button,
img,
input,
span,
h4 {
  transition: all 0.3s ease 0s;
}

@keyframes slideleft {
  10% {
    opacity: 0;
    transform: scale(0);
    right: 0;
  }
  50% {
    opacity: 1;
    transform: scale(1);
  }
  90% {
    opacity: 0;
    transform: scale(0);
    right: 100%;
  }
}
[data-loader=spinner] {
  width: 35px;
  height: 35px;
  display: inline-block;
  animation: spinner 1.2s infinite ease-in-out;
  background: url(../imgs/theme/favicon.svg);
  box-shadow: 0 0 10px #fff;
}
@keyframes spinner {
  0% {
    transform: perspective(120px) rotateX(0) rotateY(0);
  }
  50% {
    transform: perspective(120px) rotateX(-180deg) rotateY(0);
  }
  100% {
    transform: perspective(120px) rotateX(-180deg) rotateY(-180deg);
  }
}
@keyframes shadow-pulse {
  0% {
    box-shadow: 0 0 0 0px rgba(151, 119, 250, 0.8);
  }
  100% {
    box-shadow: 0 0 0 5px rgba(0, 0, 0, 0);
  }
}
@keyframes shadow-pulse-big {
  0% {
    box-shadow: 0 0 0 0px rgba(239, 63, 72, 0.1);
  }
  100% {
    box-shadow: 0 0 0 20px rgba(0, 0, 0, 0);
  }
}
@keyframes jump {
  0% {
    transform: translate3d(0, 20%, 0);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}
.jump {
  transform-origin: 0;
  animation: jump 0.5s linear alternate infinite;
}

/*TYPOGRAPHY*/
body {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  line-height: 18px;
  font-style: normal;
  font-weight: 500;
  position: relative;
}

.btn {
  border-radius: 4px;
  padding: 10px 0px 10px 22px;
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  text-decoration: none;
  position: relative;
}
.btn.btn-default {
  padding: 7px 21px;
  border-radius: 40px;
  background-color: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
}
.btn.btn-default:hover {
  background-color: #ffffff;
  color: #181A1F;
}
.btn.btn-white {
  padding: 7px 21px;
  border-radius: 40px;
  background-color: #ffffff;
  color: #181A1F;
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
}
.btn.btn-white:hover {
  background-color: rgba(255, 255, 255, 0.2);
  color: #fff;
}
.btn.btn-search {
  padding: 13px 24px 13px 24px;
  border-radius: 60px;
  background-color: #000000;
  color: #fff;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn.btn-search img {
  vertical-align: middle;
  margin-right: 10px;
}
.btn.btn-search:hover {
  background-color: #E95440;
  color: #fff;
}
.btn.btn-search-2 {
  position: absolute;
  top: 0px;
  right: 0px;
  height: 100%;
  width: 60px;
  line-height: 100%;
  text-align: center;
  padding: 0px;
}
.btn.btn-search-2 svg {
  height: 25px;
  color: #181A1F;
}
.btn.btn-tag {
  border-radius: 32px;
  background-color: #FDEEEC;
  color: #000000;
  padding: 7px 20px;
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
}
.btn.btn-tag:hover {
  color: #22C58B;
}
.btn.btn-link-location {
  padding: 5px 20px 5px 37px;
  background-image: url(../imgs/template/marker.png);
  background-repeat: no-repeat;
  background-position: left 14px center;
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  color: #fff;
}
.btn.btn-link-location:hover {
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 40px;
}
.btn.btn-link-globe {
  padding: 5px 20px 5px 37px;
  background-image: url(../imgs/template/icons/globe.svg);
  background-repeat: no-repeat;
  background-position: left 14px center;
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  color: #fff;
}
.btn.btn-link-globe:hover {
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 40px;
}
.btn.btn-arrow-up {
  padding: 0px;
  height: 50px;
  width: 50px;
  border: 1px solid #fff;
  border-radius: 50%;
  line-height: 50px;
  text-align: center;
}
.btn.btn-arrow-up svg {
  color: #fff;
}
.btn.btn-arrow-up:hover {
  background-color: rgba(255, 255, 255, 0.2);
}
.btn.btn-primary {
  background-color: #000000;
  border-radius: 6px;
  padding: 14px 24px;
  color: #fff;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  border: 0px;
}
.btn.btn-primary:hover {
  background-color: #E95440;
  color: #fff;
}
.btn.btn-primary-big {
  padding-top: 20px;
  padding-bottom: 20px;
}
.btn.btn-grey {
  background-color: #F6F6F6;
  border-radius: 6px;
  padding: 14px 20px;
  color: #181A1F;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  border: 0px;
}
.btn.btn-grey:hover {
  background-color: #000000;
  color: #fff;
}
.btn.btn-grey:hover svg {
  color: #fff;
}
.btn.btn-secondary {
  background-color: #E95440;
  border-radius: 6px;
  padding: 14px 24px;
  color: #fff;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  border: 0px;
}
.btn.btn-secondary:hover {
  background-color: #000000;
  color: #fff;
}
.btn.btn-third {
  background-color: #EEEEEE;
  border-radius: 6px;
  padding: 14px 24px;
  color: #151515;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  border: 0px;
}
.btn.btn-third:hover {
  background-color: #000000;
  color: #fff;
}
.btn.btn-border {
  border: 1px solid #fff;
  border-radius: 6px;
  padding: 14px 24px;
  color: #fff;
}
.btn.btn-border svg {
  color: #fff;
  margin-left: 5px;
  vertical-align: sub;
  display: inline-block;
}
.btn.btn-download {
  padding: 9px 15px 9px 20px;
  background-color: #000000;
  border-radius: 12px;
  max-width: 210px;
  width: 100%;
}
.btn.btn-download .inner-download {
  display: flex;
  color: #fff;
  font-size: 12px;
  line-height: 24px;
  font-weight: 400;
  align-items: center;
}
.btn.btn-download .inner-download .icon-download {
  padding-right: 20px;
  position: relative;
  margin-right: 20px;
}
.btn.btn-download .inner-download .icon-download img {
  display: block;
}
.btn.btn-download .inner-download .icon-download::before {
  content: "";
  height: 30px;
  width: 1px;
  background-color: #ffffff;
  opacity: 0.2;
  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 1;
}
.btn.btn-download .inner-download .info-download {
  text-align: left;
}
.btn.btn-download .inner-download .info-download .text-download-top {
  letter-spacing: 0.3px;
}
.btn.btn-download .inner-download .info-download span {
  display: block;
  line-height: 20px !important;
}
.btn.btn-white-big {
  border: 1px solid #fff;
  border-radius: 6px;
  padding: 13px 24px;
  color: #181A1F;
  background-color: #ffffff;
  font-size: 16px;
  font-weight: 500;
  line-height: 28px;
}
.btn.btn-white-big svg {
  color: #181A1F;
  margin-left: 5px;
  vertical-align: sub;
  display: inline-block;
}
.btn.btn-white-big:hover {
  background-color: rgba(255, 255, 255, 0.2);
  color: #fff;
}
.btn.btn-white-big:hover svg {
  color: #fff;
}
.btn.btn-border-black {
  border: 1px solid #181A1F;
  border-radius: 6px;
  padding: 14px 24px;
  color: #181A1F;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  background-color: #fff;
}
.btn.btn-border-black svg {
  color: #181A1F;
  margin-left: 5px;
  vertical-align: sub;
  display: inline-block;
}
.btn.btn-border-black:hover {
  background-color: #000000;
  color: #fff;
}
.btn.btn-border-black:hover svg {
  color: #fff;
}
.btn.btn-border-black-small {
  border: 1px solid #181A1F;
  border-radius: 6px;
  padding: 5px 20px;
  color: #181A1F;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  background-color: #fff;
}
.btn.btn-border-black-small svg {
  color: #181A1F;
  margin-left: 5px;
  vertical-align: sub;
  display: inline-block;
}
.btn.btn-border-black-small:hover {
  background-color: #000000;
  color: #fff;
}
.btn.btn-border-black-small:hover svg {
  color: #fff;
}
.btn.btn-rounded {
  border-radius: 60px;
  padding: 0px 20px;
  color: #E95440;
  font-size: 13px;
  line-height: 28px;
  font-weight: 500;
  background-color: #FDEEEC;
}
.btn.btn-link {
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  color: #000000;
  padding: 5px 0px;
}
.btn.btn-like {
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  color: #181A1F;
  padding: 0px 0px 0px 26px;
  background: url(../imgs/page/blog2/like.png) no-repeat left center;
  vertical-align: middle;
}
.btn.btn-like:hover {
  color: #E95440;
}
.btn.btn-dislike {
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  color: #626262;
  padding: 0px 0px 0px 26px;
  background: url(../imgs/page/blog2/dislike.png) no-repeat left center;
  vertical-align: middle;
}
.btn.btn-dislike:hover {
  color: #E95440;
}
.btn.btn-book {
  max-width: 320px;
  width: 100%;
  text-align: center;
}
.btn.btn-login-google {
  border: 1px solid #E5E5E5;
  border-radius: 8px;
  padding: 14px 21px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  color: #181A1F;
  background: url(../imgs/page/signin/google.svg) no-repeat left 20px center;
  text-align: center;
  width: 100%;
}
.btn.btn-login-google:hover {
  background-color: #3A77EA;
  color: #fff;
  border: 1px solid #3A77EA;
}
.btn.btn-login-facebook {
  border: 1px solid #3A77EA;
  border-radius: 8px;
  padding: 14px 21px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  color: #fff;
  background: url(../imgs/page/signin/facebook.svg) no-repeat left 20px center;
  background-color: #3A77EA;
  text-align: center;
  width: 100%;
}
.btn.btn-login-facebook:hover {
  background-color: #181818;
  border-color: #181818;
}
.btn.btn-login-apple {
  border: 1px solid #181818;
  border-radius: 8px;
  padding: 14px 21px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  color: #fff;
  background: url(../imgs/page/signin/apple.svg) no-repeat left 20px center;
  background-color: #181818;
  text-align: center;
  width: 100%;
}
.btn.btn-login-apple:hover {
  background-color: #3A77EA;
  border-color: #3A77EA;
}

.bg-download-2 .btn.btn-download {
  background-color: #333333;
}

.btn-homepage {
  padding: 0px !important;
  margin: 0px 0px 15px 0px;
}
.btn-homepage span {
  display: inline-block;
  height: 30px;
  width: 30px;
  text-align: center;
  line-height: 25px;
  background-color: #AFEAE4;
  border-radius: 50%;
  margin-right: 10px;
}
.btn-homepage span svg {
  color: #024430;
}
.btn-homepage:hover * {
  color: #071920;
}

.dropdown-language {
  display: inline-block;
}
.dropdown-language .dropdown-toggle::after {
  display: none;
}
.dropdown-language .btn {
  padding: 0px;
}

.btn-tooltip {
  position: relative;
}
.btn-tooltip:after {
  bottom: 0;
  right: 34px;
  position: absolute;
  white-space: nowrap;
  border-radius: 5px;
  font-size: 11px;
  padding: 7px 10px;
  color: #AFEAE4;
  background-color: #3D565F;
  content: attr(aria-label);
  line-height: 1.3;
  box-shadow: 0;
  transition: 0;
  opacity: 0;
  visibility: hidden;
  transform: 0;
  transition-duration: 0.2s;
}
.btn-tooltip:before {
  content: "";
  position: absolute;
  left: -8px;
  bottom: 0;
  transition-delay: 0.1s;
  border: 7px solid transparent;
  border-left-color: transparent;
  border-left-color: #3D565F;
  z-index: 9;
  margin-bottom: 0;
  transition: 0;
  opacity: 0;
  visibility: hidden;
  transition-duration: 0.2s;
}
.btn-tooltip:hover:after {
  opacity: 1;
  visibility: visible;
  transform: 0;
  transition-duration: 0.2s;
}
.btn-tooltip:hover:before {
  opacity: 1;
  visibility: visible;
  transform: translateY(-8px);
  transition-duration: 0.2s;
}

.cb-container {
  display: block;
  position: relative;
  padding-left: 34px;
  margin-bottom: 12px;
  cursor: pointer;
  line-height: 25px;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.cb-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.checkmark {
  position: absolute;
  top: 1px;
  left: 0;
  height: 24px;
  width: 24px;
  background-color: #ffffff;
  border: 2px solid #8EA4AC;
  border-radius: 4px;
}

.cb-container input:checked ~ .checkmark {
  border: 2px solid #8EA4AC;
}

.cb-container .text-small {
  color: #3D565F;
  font-weight: 500;
}

.cb-container input:checked ~ .text-small {
  color: #3D565F;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.cb-container input:checked ~ .checkmark:after {
  display: block;
}

.cb-container input:checked ~ .text-lbl {
  color: #ccc;
}

.cb-container .checkmark:after {
  left: -2px;
  top: -2px;
  width: 24px;
  height: 24px;
  background: #06D6A0 url(../imgs/page/register/check.svg) no-repeat center;
  border-radius: 4px;
}

.box-swiper {
  position: relative;
  width: 100%;
}
.box-swiper .swiper-container {
  position: relative;
  height: 100%;
  padding-bottom: 35px;
}
.box-swiper .swiper-container .item-logo {
  border: 1px solid #ccc;
  padding: 39px 0px 36px 0px;
  display: inline-block;
  width: 100%;
  text-align: center;
  border-radius: 12px;
  box-shadow: 0px 6px 24px rgba(0, 0, 0, 0.1);
}
.box-swiper .swiper-container .item-logo img {
  max-width: 100%;
}
.box-swiper .swiper-container .item-logo:hover {
  border: 1px solid #ccc;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}

.swiper-button-next:after,
.swiper-button-prev:after {
  content: "";
}

.swiper-button-next {
  background: url(../imgs/slider/swiper/next.svg) no-repeat 0px 0px;
}
.swiper-button-next:hover {
  background: url(../imgs/slider/swiper/next.svg) no-repeat 0px 0px;
}

.swiper-button-prev {
  background: url(../imgs/slider/swiper/prev.svg) no-repeat 0px 0px;
}
.swiper-button-prev:hover {
  background: url(../imgs/slider/swiper/prev.svg) no-repeat 0px 0px;
}

.swiper-button-next,
.swiper-button-prev {
  width: 40px;
  height: 40px;
  margin-top: 0px;
}

.swiper-button-next {
  left: auto;
  right: 0px;
  top: 20px;
}

.swiper-button-prev {
  left: auto;
  right: 40px;
  top: 20px;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
  opacity: 1;
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 2px;
}

.swiper-pagination {
  text-align: center;
  width: 100%;
}
.swiper-pagination .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 50%;
  background: #cfcfcf;
  opacity: 1;
}
.swiper-pagination .swiper-pagination-bullet-active {
  opacity: 1;
  background: #151515;
  width: 16px;
  height: 8px;
  border-radius: 7px;
}
.swiper-pagination.swiper-pagination-2 .swiper-pagination-bullet {
  background: #B9CAD0;
}
.swiper-pagination.swiper-pagination-2 .swiper-pagination-bullet-active {
  background: #151515;
}

.swiper-pagination-bullet {
  margin: 10px;
}

/*Style of the location of the div that wraps the custom pager*/
.swiper-pagination-custom {
  bottom: 40px;
  padding-left: 70px;
}

.swiper-pagination-customs {
  background: url(../imgs/slider/swiper/dot.svg) no-repeat 0px 0px;
  display: inline-block;
  background-repeat: no-repeat;
  background-size: contain;
  width: 10px;
  height: 10px;
  margin-left: 4px;
  margin-right: 4px;
}

/*Customize the style representation when pager is activated*/
.swiper-pagination-customs-active,
.swiper-pagination-customs:hover {
  background: url(../imgs/slider/swiper/dot-active.svg) no-repeat 0px 0px;
  width: 12px;
  height: 12px;
  margin-bottom: -1px;
  margin-left: 3px;
  margin-right: 3px;
}

.box-button-slider {
  position: absolute;
  top: 0px;
  left: 0px;
}

.swiper-group-1 .swiper-pagination {
  bottom: 50px;
  left: 55px;
}
.swiper-group-1.swiper-home-3 .swiper-pagination {
  left: 0px;
}
.swiper-group-1.home-9 .swiper-pagination {
  bottom: 20px;
  left: 25px;
}

/* This line can be removed it was just for display on CodePen: */
.slider-labels {
  margin-top: 10px;
}

/* Functional styling;
 * These styles are required for noUiSlider to function.
 * You don't need to change these rules to apply your design.
 */
.noUi-target, .noUi-target * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  touch-action: none;
  -moz-user-select: none;
  user-select: none;
  box-sizing: border-box;
}

.noUi-target {
  position: relative;
  direction: ltr;
}

.noUi-base {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
  /* Fix 401 */
}

.noUi-origin {
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0;
}

.noUi-handle {
  position: relative;
  z-index: 1;
}

.noUi-stacking .noUi-handle {
  /* This class is applied to the lower origin when
     its values is > 50%. */
  z-index: 10;
}

.noUi-state-tap .noUi-origin {
  transition: left 0.3s, top 0.3s;
}

.noUi-state-drag * {
  cursor: inherit !important;
}

/* Painting and performance;
 * Browsers can paint handles in their own layer.
 */
.noUi-base, .noUi-handle {
  transform: translate3d(0, 0, 0);
}

/* Slider size and handle placement;
 */
.noUi-horizontal {
  height: 4px;
}

.noUi-horizontal .noUi-handle {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  left: -6px;
  top: -6px;
  background-color: #345DBB;
}

/* Styling;
 */
.noUi-background {
  background: #D6D7D9;
}

.noUi-connect {
  background: #345DBB;
  transition: background 450ms;
}

.noUi-origin {
  border-radius: 2px;
}

.noUi-target {
  border-radius: 2px;
}

/* Handles and cursors;
 */
.noUi-draggable {
  cursor: w-resize;
}

.noUi-vertical .noUi-draggable {
  cursor: n-resize;
}

.noUi-handle {
  cursor: default;
  box-sizing: content-box !important;
}

.noUi-handle:active {
  border: 8px solid #345DBB;
  border: 8px solid rgba(53, 93, 187, 0.38);
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  left: -14px;
  top: -14px;
}

/* Disabled state;
 */
[disabled].noUi-connect, [disabled] .noUi-connect {
  background: #FFE7BB;
}

[disabled].noUi-origin, [disabled] .noUi-handle {
  cursor: not-allowed;
}

.ui-slider-handle {
  display: none;
}

.ui-widget.ui-widget-content {
  border: 0px solid #EBEBEB;
}

.noUi-target {
  border-radius: 12px;
}

.noUi-horizontal {
  height: 6px;
}

.noUi-background {
  background: #ccc;
}

.noUi-origin {
  border-radius: 12px;
}

.noUi-connect {
  background: #069;
  transition: background 450ms;
  height: 6px;
  margin-top: 0px;
}

.noUi-horizontal .noUi-handle {
  background-color: #069;
  border: 1px solid #069;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
  left: -6px;
  top: -6px;
}

.noUi-handle:active {
  border-width: 1px;
  left: -6px;
  top: -6px;
}

.cardFleet {
  width: 100%;
  display: inline-block;
  border: 1px solid #E5E5E5;
  border-radius: 6px;
  padding: 30px;
  background-color: #ffffff;
}
.cardFleet .cardInfo {
  position: relative;
}
.cardFleet .cardInfo a:hover h3 {
  color: #E95440 !important;
}
.cardFleet .cardImage {
  position: relative;
}
.cardFleet .cardImage img {
  width: 100%;
}
.cardFleet .cardInfoBottom {
  position: relative;
  display: flex;
  align-items: center;
}
.cardFleet .cardInfoBottom .passenger, .cardFleet .cardInfoBottom .luggage {
  display: flex;
  align-items: center;
  width: 50%;
}
.cardFleet .cardInfoBottom .passenger .icon-circle, .cardFleet .cardInfoBottom .luggage .icon-circle {
  display: inline-block;
  width: 40px;
  height: 40px;
  background-color: #F6F6F6;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  margin-right: 10px;
}
.cardFleet .cardInfoBottom .passenger {
  width: 100%;
}
.cardFleet .cardInfoBottom .passenger .icon-passenger {
  background-image: url(../imgs/template/icons/friend.svg);
}
.cardFleet .cardInfoBottom .luggage {
  width: 60%;
  min-width: 117px;
  text-align: right;
  justify-content: flex-end;
}
.cardFleet .cardInfoBottom .luggage .icon-luggage {
  background-image: url(../imgs/template/icons/luggage.svg);
}
.cardFleet:hover {
  background-color: #F6F6F6;
}
.cardFleet:hover .cardInfoBottom .passenger .icon-circle, .cardFleet:hover .cardInfoBottom .luggage .icon-circle {
  background-color: #ffffff;
}
.cardFleet.cardFleetStyle2 {
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
  border: 0px;
  margin-bottom: 30px;
}
.cardFleet.cardFleetStyle2:hover {
  background-color: #ffffff;
}
.cardFleet.cardFleetStyle2:hover .cardInfoBottom .passenger .icon-circle, .cardFleet.cardFleetStyle2:hover .cardInfoBottom .luggage .icon-circle {
  background-color: #F6F6F6;
}
.cardFleet.cardFleetStyle2:hover .cardInfo h3 {
  color: #E95440 !important;
}
.cardFleet.cardFleetStyle3 {
  border: 0px;
}
.cardFleet.cardFleetStyle3 .cardInfoBottom .passenger .icon-circle, .cardFleet.cardFleetStyle3 .cardInfoBottom .luggage .icon-circle {
  width: 20px;
  height: 20px;
  background-color: transparent;
}
.cardFleet.cardFleetStyle3:hover {
  background-color: transparent;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}
.cardFleet.cardFleetStyle3 .cardInfoBottom .luggage {
  justify-content: flex-start;
}
.cardFleet.cardFleetStyle3 .cardInfoBottom .passenger {
  min-width: 40px;
  max-width: 40px;
  margin-right: 20px;
}

.cardIconTitleDesc {
  text-align: center;
}
.cardIconTitleDesc .cardIcon {
  margin-bottom: 30px;
}
.cardIconTitleDesc .cardTitle {
  margin-bottom: 10px;
}
.cardIconTitleDesc .cardDesc {
  margin-bottom: 30px;
}

.cardService {
  height: auto;
  width: 100%;
  position: relative;
  border-radius: 6px;
  overflow: hidden;
}
.cardService .cardImage {
  position: relative;
  top: auto;
  left: auto;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.cardService .cardImage img {
  height: auto;
  min-height: 100%;
  position: relative;
  z-index: 1;
  width: 100%;
  display: block;
}
.cardService .cardImage::before {
  content: "";
  background-image: url(../imgs/page/homepage1/bg-trans.png);
  background-position: bottom left;
  background-repeat: repeat-x;
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.cardService .cardInfo {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  z-index: 3;
  padding: 30px 30px 20px 30px;
}
.cardService .cardInfo .cardTitle {
  color: #fff;
}
.cardService .cardInfo .box-inner-info {
  overflow: hidden;
  height: 0;
  transition: height 0.3s ease-in;
}
.cardService .cardInfo .box-inner-info .cardDesc {
  color: #fff;
  max-height: 48px;
  overflow: hidden;
}
.cardService .cardInfo .box-inner-info .cardLink {
  color: #fff;
}
.cardService:hover .box-inner-info {
  height: 130px;
  transition: height 0.3s ease-in;
}

.cardNews {
  margin-bottom: 30px;
}
.cardNews .cardImage {
  margin-bottom: 20px;
  position: relative;
}
.cardNews .cardImage img {
  border-radius: 6px;
  width: 100%;
  display: block;
}
.cardNews .cardImage::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1;
  background-image: url(../imgs/page/homepage1/bg-trans2.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.cardNews .cardImage .datePost {
  position: absolute;
  top: 20px;
  left: 30px;
  z-index: 2;
}
.cardNews .cardImage .datePost .heading-52-medium {
  line-height: 52px;
}

.cardWork {
  margin-bottom: 30px;
}
.cardWork .cardImage {
  margin-bottom: 30px;
  position: relative;
  max-height: 200px;
}
.cardWork .cardTitle {
  margin-bottom: 20px;
}

.cardServiceStyle2 .cardImage {
  overflow: hidden;
  border-radius: 6px;
  margin-bottom: 20px;
}
.cardServiceStyle2 .cardImage img {
  width: 100%;
  display: block;
}

.cardServiceStyle3 {
  height: 290px;
  border-radius: 16px;
}
.cardServiceStyle3 .cardImage img {
  width: auto;
  min-width: 100%;
  max-width: none;
  max-height: 100%;
}
.cardServiceStyle3:hover .cardImage::before {
  background-image: url(../imgs/page/homepage5/bg-trans-pink.png);
}

.cardServiceStyle4 {
  height: auto;
  background-color: #ffffff;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
  overflow: visible;
}
.cardServiceStyle4 .cardImage {
  position: relative;
  top: auto;
}
.cardServiceStyle4 .cardImage img {
  width: 100%;
  border-radius: 6px 6px 0 0;
  display: block;
}
.cardServiceStyle4 .cardInfo {
  position: relative;
  bottom: auto;
  left: auto;
  padding: 20px 30px;
}
.cardServiceStyle4 .cardInfo .color-white {
  color: #181A1F !important;
}
.cardServiceStyle4:hover .cardInfo .color-white {
  color: #E95440 !important;
}

.cardTestimonial {
  border-radius: 6px;
  padding: 30px;
  background-color: #ffffff;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}

.cardCities {
  display: inline-block;
  width: 100%;
  margin-bottom: 30px;
}
.cardCities .cardImage {
  margin-bottom: 20px;
}
.cardCities .cardImage img {
  border-radius: 6px;
  width: 100%;
}
.cardCities .cardInfo .cardTitle {
  font-size: 15px;
  line-height: 28px;
  color: #181A1F;
  font-weight: 400;
}
.cardCities .cardInfo .cardTitle:hover {
  color: #E95440 !important;
}
.cardCities .cardInfo .cardDesc {
  font-size: 17px;
  line-height: 28px;
  color: #181A1F;
  font-weight: 500;
}

.cardImageText {
  margin-bottom: 90px;
  display: inline-block;
}
.cardImageText .cardImage {
  margin-bottom: 20px;
}

.cardImageLeftTextRight {
  display: flex;
  align-items: center;
  margin-bottom: 80px;
}
.cardImageLeftTextRight .cardImage {
  width: 90px;
  height: 90px;
  padding: 20px;
  text-align: center;
  background-color: #ffffff;
  margin-right: 30px;
  border-radius: 18px;
  line-height: 50px;
}
.cardImageLeftTextRight .cardImage img {
  height: auto;
  max-width: 100%;
  vertical-align: middle;
  display: inline-block;
}

.cardContact .cardImage img {
  max-height: 120px;
  max-width: 100%;
  display: block;
}
.cardContact .cardInfo {
  position: relative;
}

.cardTeam {
  margin-bottom: 30px;
}
.cardTeam .cardImage {
  position: relative;
  overflow: hidden;
  border-radius: 6px;
  margin-bottom: 20px;
}
.cardTeam .cardImage .box-arrow-up-link {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 2;
  background-image: url(../imgs/page/our-team/bg-trans.png);
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
}
.cardTeam .cardImage img {
  position: relative;
  z-index: 1;
  display: block;
}
.cardTeam:hover .cardImage .box-arrow-up-link {
  display: flex;
}
.cardTeam .cardInfo {
  position: relative;
}

.card-experiences {
  display: flex;
  width: 100%;
}
.card-experiences .card-experience-circle {
  position: relative;
  min-width: 30px;
  max-width: 30px;
  margin-right: 20px;
}
.card-experiences .card-experience-circle .circle-text {
  display: inline-block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #FDEEEC;
  font-size: 11px;
  line-height: 30px;
  font-weight: 700;
  text-align: center;
}
.card-experiences .card-experience-info .year {
  background-color: #FDEEEC;
  border-radius: 60px;
  display: inline-block;
  padding: 3px 13px;
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  font-family: "DM Sans", sans-serif;
}

.card-plan {
  border-radius: 8px;
  padding: 44px 50px 49px 50px;
  background-color: #fff;
  border: 1px solid #CDE2E7;
  margin-bottom: 30px;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}
.card-plan .desc-plan {
  margin-bottom: 17px;
}
.card-plan .title-plan {
  margin-bottom: 0px;
}
.card-plan .btn-border-black {
  width: 100%;
}
.card-plan .card-plan-top {
  display: flex;
  justify-content: space-between;
}
.card-plan .card-plan-top .card-top-left-info {
  width: 100%;
}
.card-plan .card-plan-top .card-top-right-image {
  width: 30%;
  max-width: 70px;
  min-width: 70px;
}
.card-plan:hover {
  background-color: #FDEEEC;
  border-color: #FDEEEC;
}
.card-plan:hover .btn-border-black {
  color: #fff;
  background-color: #000000;
}
.card-plan:hover .btn-border-black svg {
  color: #fff;
}

.cardNumberTitleDesc {
  position: relative;
  text-align: center;
  margin-bottom: 30px;
}
.cardNumberTitleDesc::before {
  content: "";
  height: 3px;
  width: 76%;
  background: url(../imgs/page/homepage6/dashed.png) repeat-x 0px 0px;
  position: absolute;
  top: 35px;
  left: 65%;
}
.cardNumberTitleDesc .cardTitle {
  margin-bottom: 20px;
}
.cardNumberTitleDesc .cardNumber {
  text-align: center;
  margin-bottom: 60px;
  position: relative;
}
.cardNumberTitleDesc .cardNumber span {
  display: inline-block;
  height: 70px;
  width: 70px;
  border: 1px solid #E5E5E5;
  border-radius: 50%;
  text-align: center;
  line-height: 70px;
  font-size: 24px;
  font-weight: 500;
}
.cardNumberTitleDesc.cardNumberTitleDescStyle2 {
  display: flex;
}
.cardNumberTitleDesc.cardNumberTitleDescStyle2::before {
  display: none;
}
.cardNumberTitleDesc.cardNumberTitleDescStyle2 .cardNumber {
  min-width: 76px;
  margin-right: 20px;
  margin-bottom: 0px;
}
.cardNumberTitleDesc.cardNumberTitleDescStyle2 .cardNumber span {
  font-size: 60px;
  line-height: 76px;
  font-weight: 400;
  color: #181A1F;
  border: 0px;
  border-radius: 0px;
}
.cardNumberTitleDesc.cardNumberTitleDescStyle2 .cardInfo {
  text-align: left;
}

.cardTestimonialsStyle2 .heading-24-medium {
  line-height: 45px;
}

.cardServiceStyle5 {
  display: flex;
  align-items: center;
  height: auto;
}
.cardServiceStyle5 .cardImage {
  width: 45%;
  position: relative;
  padding: 50px 50px 50px 0px;
  height: auto;
}
.cardServiceStyle5 .cardImage img {
  display: block;
  width: 100%;
  position: relative;
  z-index: 2;
  border-radius: 0;
}
.cardServiceStyle5 .cardImage::before {
  content: "";
  position: absolute;
  top: 0px;
  z-index: 1;
  right: 0px;
  bottom: 0px;
  width: 100%;
  max-width: 90%;
  left: auto;
  background-color: #F6F6F6;
  background-image: none;
}
.cardServiceStyle5 .cardInfo {
  width: 55%;
  padding-left: 70px;
  position: relative;
}
@keyframes load7 {
  0%, 80%, 100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }
  40% {
    box-shadow: 0 2.5em 0 0;
  }
}
.loader {
  border-radius: 50%;
  width: 2em;
  height: 2em;
  animation-fill-mode: both;
  animation: load7 1.8s infinite ease-in-out;
  color: #069;
  font-size: 10px;
  margin: 80px auto;
  position: relative;
  text-indent: -9999em;
  transform: translateZ(0);
  animation-delay: -0.16s;
}
.loader:before {
  border-radius: 50%;
  width: 2em;
  height: 2em;
  animation-fill-mode: both;
  animation: load7 1.8s infinite ease-in-out;
  content: "";
  position: absolute;
  top: 0;
  left: -3.5em;
  animation-delay: -0.32s;
}
.loader:after {
  border-radius: 50%;
  width: 2em;
  height: 2em;
  animation-fill-mode: both;
  animation: load7 1.8s infinite ease-in-out;
  content: "";
  position: absolute;
  top: 0;
  left: 3.5em;
}

.swiper-pagination {
  text-align: center;
  bottom: 0px !important;
}
.swiper-pagination .swiper-pagination-customs {
  background: #ffffff;
  border-radius: 50%;
}
.swiper-pagination .swiper-pagination-customs:hover {
  background: #fff;
}
.swiper-pagination .swiper-pagination-customs-active {
  background: #069;
}
.swiper-pagination.swiper-pagination-2 {
  top: auto;
  height: auto;
  z-index: 123;
  line-height: 30px;
  text-align: center;
}

/*page loading*/
.preloader {
  background-color: #fff;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999999999;
  transition: 0.6s;
  margin: 0 auto;
}
.preloader img {
  max-width: 250px;
}

.page-loading-inner {
  width: 100%;
  height: 100%;
  position: relative;
  transform: translateZ(0) scale(1);
  backface-visibility: hidden;
  transform-origin: 0 0;
}
.page-loading-inner div {
  position: absolute;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  box-sizing: content-box;
  margin: -10px -20px;
}
.page-loading-inner div:nth-child(1) {
  background: #E95440;
  animation: page-loading-inner 1s linear infinite;
  animation-delay: -0.5s;
}
.page-loading-inner div:nth-child(2) {
  background: #000000;
  animation: page-loading-inner 1s linear infinite;
  animation-delay: 0s;
}
.page-loading-inner div:nth-child(3) {
  background: #E95440;
  animation: page-loading-inner-o 1s linear infinite;
  animation-delay: -0.5s;
}

.page-loading {
  width: 100px;
  height: 100px;
  display: inline-block;
  overflow: hidden;
}

@keyframes page-loading-inner-o {
  0% {
    opacity: 1;
    transform: translate(0, 0);
  }
  49.99% {
    opacity: 1;
    transform: translate(30px, 0);
  }
  50% {
    opacity: 0;
    transform: translate(30px, 0);
  }
  100% {
    opacity: 0;
    transform: translate(0, 0);
  }
}
@keyframes page-loading-inner {
  0% {
    transform: translate(0, 0);
  }
  50% {
    transform: translate(30px, 0);
  }
  100% {
    transform: translate(0, 0);
  }
}
@keyframes rotate {
  0%, 49.999%, 100% {
    transform: none;
  }
  50%, 99.999% {
    transform: rotate(90deg);
  }
}
@keyframes shift-left {
  0%, 100% {
    transform: translateX(0%);
  }
  50% {
    transform: scale(0.65) translateX(-75%);
  }
}
@keyframes shift-right {
  0%, 100% {
    transform: translateX(0%);
  }
  50% {
    transform: scale(0.65) translateX(75%);
  }
}
.preloader-dots {
  --uib-size: 30px;
  --uib-speed: .9s;
  --uib-color: #425A8B;
  position: relative;
  height: calc(var(--uib-size) / 2);
  width: var(--uib-size);
  filter: url("#uib-jelly-ooze");
  animation: rotate calc(var(--uib-speed) * 2) linear infinite;
}
.preloader-dots::before {
  content: "";
  position: absolute;
  top: 0%;
  left: 25%;
  width: 50%;
  height: 100%;
  background: var(--uib-color);
  border-radius: 100%;
  animation: shift-left var(--uib-speed) ease infinite;
}
.preloader-dots::after {
  content: "";
  position: absolute;
  top: 0%;
  left: 25%;
  width: 50%;
  height: 100%;
  background: var(--uib-color);
  border-radius: 100%;
  animation: shift-right var(--uib-speed) ease infinite;
}

/*select 2 style*/
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #069;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #069 transparent transparent transparent;
  border-width: 5px 5px 0 5px;
}

.select2-search--dropdown {
  padding: 0px;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid #ccc;
  margin-bottom: 15px;
  border-radius: 4px;
  padding: 8px;
}

.select2-container--default .select2-results > .select2-results__options {
  max-height: 200px;
  overflow-y: auto;
  scrollbar-width: thin;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: #ccc;
  color: #069;
}

.modal-header .btn-close {
  margin: -0.5rem 0rem -0.5rem auto;
}

.banner-home1 {
  position: relative;
  display: block;
}

.banner-home2 {
  position: relative;
  display: block;
  padding-left: 100px;
  padding-right: 100px;
}
.banner-home2 .box-banner-homepage-2 .box-cover-image {
  border-radius: 12px;
  overflow: hidden;
}

.box-banner-info {
  position: absolute;
  top: 40%;
  left: 0px;
  width: 100%;
  z-index: 3;
  right: 0px;
  max-width: 1170px;
  margin: auto;
  padding-right: var(--bs-gutter-x, 0.75rem);
  padding-left: var(--bs-gutter-x, 0.75rem);
}

.box-cover-image {
  position: relative;
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 800px;
}
.box-cover-image::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 0.3;
  z-index: 2;
}
.box-cover-image img {
  position: relative;
  z-index: 1;
}

.box-pagination-button {
  position: absolute;
  top: 30%;
  max-width: 1170px;
  left: 0px;
  right: 0px;
  margin: auto;
  display: flex;
  align-items: center;
  padding-right: var(--bs-gutter-x, 0.75rem);
  padding-left: var(--bs-gutter-x, 0.75rem);
}

.swiper-button-next-banner, .swiper-button-prev-banner {
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  bottom: auto;
}

.swiper-button-prev-banner {
  margin-right: 10px;
}

.swiper-pagination-banner {
  position: relative;
  display: inline-block;
  bottom: auto !important;
  text-align: left;
  width: auto;
  left: auto;
  padding: 0px 0px 0px 12px;
  color: #fff;
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
}

.ui-timepicker-standard {
  width: 270px !important;
  border: 2px solid #181A1F !important;
  padding: 15px 0px;
  border-radius: 6px;
  margin-top: 40px;
  margin-left: -60px;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}
.ui-timepicker-standard .ui-timepicker, .ui-timepicker-standard .ui-timepicker-viewport {
  height: 260px !important;
}
.ui-timepicker-standard .ui-timepicker {
  text-align: left;
}
.ui-timepicker-standard li a {
  padding: 0px 20px;
  border-radius: 0px;
  border: 1px solid #fff;
  font-size: 14px;
  line-height: 35px;
  color: #181A1F;
  font-family: "DM Sans", sans-serif;
  transition: none;
  font-weight: 500;
}
.ui-timepicker-standard li a.ui-state-hover {
  border-color: #F0FBF7;
  background-color: #F0FBF7;
  font-weight: 500;
  color: #181A1F;
}
.ui-timepicker-standard li a:hover {
  background-color: #F0FBF7;
  border-color: #F0FBF7;
}

.box-dropdown-location {
  position: absolute;
  top: 100%;
  left: 15px;
  background: #ffffff;
  border: 2px solid #181A1F;
  border-radius: 6px;
  padding: 0px 20px;
  margin-top: 35px;
  width: 430px;
  z-index: 99;
  display: none;
}

.list-locations .item-location {
  display: flex;
  align-items: flex-start;
  padding: 20px 0px;
  border-bottom: 1px solid #E5E5E5;
  cursor: pointer;
}
.list-locations .item-location:last-child {
  border-bottom: 0px;
}
.list-locations .item-location:hover .location-info h6 {
  color: #22C58B;
}
.list-locations .item-location:hover .location-info p {
  color: #181A1F;
}
.list-locations .item-location .location-icon {
  max-width: 16px;
  margin-right: 20px;
  padding-top: 6px;
}
.list-locations .item-location .location-info {
  width: 100%;
}

@keyframes hero-thumb-animation {
  0% {
    transform: translateY(-20px);
  }
  100% {
    transform: translateY(0px);
  }
}
@keyframes hero-thumb-animation-2 {
  0% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(-20px);
  }
}
@keyframes hero-thumb-sm-animation {
  0% {
    transform: translateY(-20px) translateX(50px);
  }
  100% {
    transform: translateY(-20px) translateX(0px);
  }
}
@keyframes hero-thumb-sm-2-animation {
  0% {
    transform: translateY(-50px);
  }
  100% {
    transform: translateY(0px);
  }
}
.shape-1 {
  animation: hero-thumb-animation 2s linear infinite alternate;
}

.shape-1-2 {
  animation: hero-thumb-animation-2 2s linear infinite alternate;
}

.shape-2 {
  animation: hero-thumb-sm-animation 4s linear infinite alternate;
}

.shape-3 {
  animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
}

.box-container-sw {
  max-width: 700px;
  margin: auto;
  position: relative;
  min-height: 22px;
  line-height: 18px;
  padding: 10px 0px;
}

.call-phone {
  background: url(../imgs/template/icons/call.svg) no-repeat left top 1px;
  padding-left: 22px;
}

.address-footer {
  background: url(../imgs/page/homepage3/address.png) no-repeat left top 1px;
  padding-left: 30px;
}

.time-footer {
  background: url(../imgs/page/homepage3/time.png) no-repeat left top 1px;
  padding-left: 30px;
}

.header {
  padding: 0px 0;
  float: left;
  width: 100%;
  position: relative;
  border-bottom: 0px solid #B9CAD0;
  background-color: #000000;
  z-index: 1004;
}
.header .main-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
.header .main-header .header-left {
  display: flex;
  align-items: center;
  width: 100%;
}
.header .main-header .header-left .header-logo {
  max-width: 150px;
  width: 100%;
}
.header .main-header .header-left .header-logo a {
  display: block;
}
.header .main-header .header-left .header-logo a img {
  min-height: 37px;
}
.header .main-header .header-left .header-nav {
  display: inline-block;
  width: 55%;
  text-align: left;
  padding-left: 45px;
}
.header .main-header .header-left .header-right {
  width: 45%;
  text-align: right;
}
.header .main-header .header-left .header-right .icon-list {
  display: inline-block;
  padding: 0px 10px 0px 10px;
  position: relative;
  font-size: 16px;
  color: #AFEAE4;
  line-height: 24px;
  cursor: pointer;
}
.header .main-header .header-left .header-right .icon-list:hover {
  color: #024430;
}
.header .main-header .header-left .header-right .icon-list .arrow-down {
  background: url(../imgs/template/icons/globe.svg) no-repeat left top 1px;
  padding-left: 22px;
}
.header .main-header .header-left .header-right .icon-list .arrow-down:hover {
  color: #024430;
}
.header .nav-main-menu {
  width: auto;
  padding: 0px 0px 0px 10px;
  float: none;
}
.header .burger-icon {
  display: none;
}
.header .main-menu > li {
  padding: 23px 0px 23px 0px;
}
.header .main-menu li {
  float: left;
  position: relative;
  text-align: left;
}
.header .main-menu li.has-children > a::after {
  content: "";
  background: url(../imgs/template/icons/angle-down.svg) no-repeat center;
  height: 8px;
  width: 12px;
  position: absolute;
  top: 50%;
  right: 14px;
  margin-top: -4px;
}
.header .main-menu li.hr {
  padding: 0px 22px;
}
.header .main-menu li.hr span {
  background-color: #B9CAD0;
  height: 1px;
  width: 100%;
  display: block;
  margin: 5px 0;
}
.header .main-menu li a {
  font-family: "DM Sans", sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  color: #fff;
  line-height: 24px;
  display: block;
  padding: 5px 33px 5px 15px;
  text-decoration: none;
  position: relative;
}
.header .main-menu li a:hover {
  color: #fff;
  border-radius: 40px;
  background-color: rgba(255, 255, 255, 0.1764705882);
}
.header .main-menu li a:hover i {
  opacity: 1;
  transition: 0.2s;
}
.header .main-menu li a i {
  font-size: 12px;
  margin-right: 8px;
  opacity: 0.38;
  transition: 0.2s;
}
.header .main-menu li div.sub-menu {
  opacity: 0;
  visibility: hidden;
  transition-duration: 0.2s;
  position: absolute;
  top: 100%;
  left: 0px;
  z-index: 999999;
  min-width: 220px;
  width: 400px;
  border-radius: 8px;
  padding: 25px 30px 10px 30px;
  background-color: #fff;
  border: 1px solid #CDE2E7;
  box-shadow: 0px 6px 24px rgba(0, 0, 0, 0.1);
  border-bottom: 8px solid #AFEAE4;
  display: none;
}
.header .main-menu li div.sub-menu .menu-inner {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  top: auto;
  left: auto;
  opacity: 1;
  visibility: visible;
  border: 0px;
  background-color: transparent;
  box-shadow: none;
}
.header .main-menu li div.sub-menu .menu-inner li {
  width: 50%;
  padding-right: 0px;
}
.header .main-menu li div.sub-menu .menu-inner li a {
  padding-left: 0px;
  padding-right: 0px;
  color: #024430;
}
.header .main-menu li div.sub-menu .menu-inner li a svg {
  color: #8EA4AC;
  margin-right: 5px;
}
.header .main-menu li div.sub-menu .menu-inner li a:hover {
  color: #071920;
}
.header .main-menu li div.sub-menu .menu-inner li a:hover * {
  color: #071920;
}
.header .main-menu li ul {
  opacity: 0;
  visibility: hidden;
  transition-duration: 0.2s;
  position: absolute;
  top: 100%;
  left: 0px;
  z-index: 999999;
  min-width: 220px;
  border-radius: 0px;
  padding: 0px 0px 0px 0;
  background-color: #181A1F;
  border: 0px solid #CDE2E7;
  box-shadow: 0px 6px 24px rgba(0, 0, 0, 0.1);
}
.header .main-menu li ul li {
  width: 100%;
}
.header .main-menu li ul li a {
  font-size: 14px;
  color: #fff;
  position: relative;
  padding: 6px 22px 6px 22px;
  transition: 0.2s;
}
.header .main-menu li ul li a:hover {
  padding-left: 25px;
  transition: 0.2s;
  border-radius: 0px;
}
.header .main-menu li ul li a.closer {
  padding: 8px 22px 8px 22px;
}
.header .main-menu li ul li ul {
  top: 0px;
  left: 100%;
}
.header .main-menu li:hover > ul, .header .main-menu li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  display: block;
}
.header .main-menu li:hover > ul li, .header .main-menu li:hover > .sub-menu li {
  width: 100%;
}
.header.header-black-2 .btn-default {
  border: 1px solid #fff;
  border-radius: 6px;
  background-color: #181A1F;
}
.header.header-black-2 .btn-default:hover {
  background-color: #fff;
}
.header.header-black-2 .btn-white {
  border-radius: 6px;
}
.header.header-black-2 .btn-white:hover {
  background-color: #181A1F;
}
.header.header-white {
  background-color: #ffffff;
}
.header.header-white .main-menu li.has-children > a::after {
  background: url(../imgs/template/icons/angle-down-black.svg) no-repeat center;
}
.header.header-white .main-menu li a {
  color: #181A1F;
}
.header.header-white .main-menu li a:hover {
  color: #22C58B;
}
.header.header-white .main-menu li ul {
  background-color: #ffffff;
}
.header.header-white .main-menu li ul li a {
  color: #181A1F;
}
.header.header-white .main-menu li ul li a:hover {
  color: #22C58B;
}
.header.header-white .btn-default {
  border-radius: 6px;
  background-color: #F6F6F6;
  color: #181A1F;
}
.header.header-white .btn-white {
  background-color: #000000;
  color: #fff;
  border-radius: 6px;
}
.header.header-white .call-phone {
  color: #181A1F !important;
  background: url(../imgs/template/icons/call-black.svg) no-repeat left top 1px;
}
.header.header-white .main-header .header-left .header-right .icon-list .arrow-down {
  color: #181A1F !important;
  background: url(../imgs/template/icons/globe-black.svg) no-repeat left top 1px;
}
.header.header-white .dropdown-account {
  background-color: #ffffff;
}
.header.header-white .box-dropdown-cart .dropdown-account ul li a {
  color: #181A1F;
}
.header.header-white .burger-icon.burger-icon-white > span::before, .header.header-white .burger-icon.burger-icon-white > span::after {
  background-color: #181A1F;
}
.header.header-bg-2 {
  background-color: #FDEEEC;
}
.header.header-bg-2 .btn-default {
  border-radius: 6px;
  background-color: transparent;
  color: #181A1F;
}
.header.header-bg-2 .btn-white {
  background-color: transparent;
  color: #181A1F;
  border-radius: 6px;
  border: 1px solid #181A1F;
}
.header.header-7 .main-header .header-left .header-nav {
  width: 72%;
}
.header.header-7 .main-header .header-left .header-right {
  width: 18%;
  text-align: right;
  min-width: 205px;
}
.header.header-homepage9 .container-fluid {
  padding-left: 60px;
  padding-right: 60px;
}
.header.header-homepage9 .main-menu > li:first-child > a {
  padding-left: 0px;
}
.header.header-homepage9 .nav-main-menu {
  padding-left: 0px;
}
.header.header-homepage9 .main-header .header-left {
  flex-wrap: wrap;
  display: flex;
  width: 100%;
}
.header.header-homepage9 .main-header .header-left .header-nav {
  width: 40%;
  display: inline-block;
}
.header.header-homepage9 .main-header .header-left .header-right {
  width: 40%;
  text-align: right;
  display: inline-block;
}
.header.header-homepage9 .main-header .header-left .header-logo {
  width: 20%;
  text-align: center;
  display: inline-block;
  max-width: 100%;
}
.header.header-homepage9 .main-header .header-left .header-logo img {
  max-width: 150px;
}
.header.header-transparent {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  background-color: transparent;
}
.header.header-transparent .main-header .header-left {
  justify-content: space-between;
}
.header.header-transparent .main-header .header-left .header-right {
  width: 30%;
  min-width: 220px;
  max-width: 220px;
}

.box-notify svg {
  height: 14px;
  color: #FFE7BB;
}

.sticky-bar.stick {
  animation: 700ms ease-in-out 0s normal none 1 running fadeInDown;
  box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.05);
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1004;
  left: 0;
  transition: all 0.3s ease 0s;
  border-bottom: 0px solid #B9CAD0;
  background: #000000;
}
.sticky-bar.header-white {
  background-color: #ffffff;
}
.sticky-bar.header-bg-2 {
  background-color: #FDEEEC;
}

.user-account {
  display: flex;
  align-items: center;
}
.user-account img {
  max-width: 50px;
  border-radius: 50%;
  margin-right: 10px;
}
.user-account .user-name {
  margin-bottom: 0;
  font-weight: 600;
  font-size: 14px;
}

.perfect-scroll {
  height: 100vh;
  width: 100%;
  position: relative;
  max-width: 430px;
  padding: 0px 20px 0px 20px;
  display: inline-block;
}

.body-overlay-1 {
  background: transparent;
  height: 100%;
  left: 0;
  opacity: 0;
  position: fixed;
  top: 0;
  visibility: hidden;
  width: 100%;
  cursor: crosshair;
  z-index: 1002;
}

.mobile-menu-active .body-overlay-1 {
  opacity: 1;
  visibility: visible;
}

.dropdown-menu {
  border: 1px solid #3D565F;
  border-radius: 4px;
}

.dropdown-item {
  font-size: 14px;
  color: #AFEAE4;
}
.dropdown-item.active, .dropdown-item:active, .dropdown-item:hover {
  color: #AFEAE4;
  text-decoration: none;
  background-color: #3D565F;
}

.dropdown-language .dropdown-item img {
  margin-right: 5px;
}

.box-dropdown-cart {
  position: relative;
}
.box-dropdown-cart .dropdown-account {
  padding: 25px 25px;
  width: 150px;
}
.box-dropdown-cart .dropdown-account ul li {
  margin-bottom: 15px;
}
.box-dropdown-cart .dropdown-account ul li a {
  color: #fff;
  text-decoration: none;
}
.box-dropdown-cart .dropdown-account ul li a img {
  float: left;
  margin: 4px 10px 0px 0px;
}

.dropdown-cart {
  display: none;
  visibility: hidden;
  position: absolute;
  right: -70px;
  top: calc(100% + 22px);
  z-index: 99;
  width: 320px;
  background-color: #fff;
  padding: 22px;
  transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
  border-radius: 0 0 4px 4px;
  border: 1px solid #3D565F;
}
.dropdown-cart.dropdown-open {
  display: block;
  visibility: visible;
}

.dropdown-account {
  width: 200px;
  right: 0;
  display: none;
  visibility: hidden;
  position: absolute;
  top: calc(100% + 30px);
  border-radius: 8px;
  z-index: 99;
  width: 220px;
  background-color: #000000;
  padding: 22px;
  box-shadow: 0px 6px 24px rgba(0, 0, 0, 0.1);
  transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
  border: 1px solid #000000;
}
.dropdown-account.dropdown-open {
  display: block;
  visibility: visible;
}
.dropdown-account ul li {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 20px;
}
.dropdown-account ul li:last-child {
  margin: 0;
}
.dropdown-account ul li a {
  color: #fff;
}
.dropdown-account ul li a:hover {
  color: #024430;
}

.item-cart {
  display: flex;
  text-align: left;
}
.item-cart .cart-image {
  min-width: 80px;
  max-width: 80px;
  margin-right: 15px;
}
.item-cart .cart-image img {
  width: 100%;
}
.item-cart .color-brand-3:hover {
  color: #024430 !important;
}

.search-post svg {
  height: 16px;
  color: #071920;
}

.swiper-button-prev-notify, .swiper-button-next-notify {
  background: none;
  height: 14px;
}
.swiper-button-prev-notify:hover, .swiper-button-next-notify:hover {
  background: none;
}

.swiper-button-next-notify {
  left: auto;
  right: 0px;
  top: 12px;
}

.swiper-button-prev-notify {
  left: auto;
  right: 22px;
  top: 12px;
}

.btn-close {
  position: absolute;
  top: 5px;
  background: none;
  right: 0px;
  padding: 7px 22px 5px 22px;
  line-height: 14px;
  opacity: 1;
}
.btn-close svg {
  height: 16px;
}

.swiper-notify.swiper-container {
  padding-bottom: 0px;
}

.box-search-top {
  position: relative;
}
.box-search-top .form-search-top {
  position: absolute;
  top: 54px;
  width: 220px;
  right: -20px;
  background-color: #ffffff;
  padding: 10px 15px;
  border-radius: 4px;
  border: 1px solid #ECF1F2;
  z-index: 123;
  display: none;
  overflow: hidden;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.08);
}
.box-search-top .form-search-top .input-search {
  border: 0px solid #ECF1F2;
  border-radius: 4px;
  padding: 5px 10px;
  width: 100%;
}
.box-search-top .form-search-top .btn-search {
  position: absolute;
  top: 0px;
  right: 10px;
  z-index: 12;
  padding: 10px;
  height: 46px;
}
.box-search-top .form-search-top .btn-search svg {
  height: 16px;
  color: #4E6770;
}

.header-top-main {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1725490196);
}
.header-top-main .header-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 0px;
}
.header-top-main .header-top .arrow-down {
  cursor: pointer;
  background: url(../imgs/template/icons/globe.svg) no-repeat left top 1px;
  padding-left: 22px;
}
.header-top-main .icon-socials {
  margin-right: 0px;
  height: 34px;
  width: 34px;
  line-height: 34px;
}
.header-top-main .burger-icon {
  top: 26px;
  right: 15px;
}

.header-top-sub {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1725490196);
}
.header-top-sub .btn-default {
  background-color: transparent;
}
.header-top-sub .btn-default:hover {
  border-radius: 8px;
}
.header-top-sub .btn-white {
  border-radius: 8px;
}

.header .header-top-sub .nav-main-menu {
  padding-left: 0px;
}
.header .header-top-sub .main-header .header-left .header-right {
  width: 25%;
  min-width: 225px;
}
.header .header-top-sub .main-header .header-left .header-nav {
  width: 85%;
}

.header-homepage5 {
	background-color: transparent;
	position: absolute;
	z-index: 1234;
    background-color: #142b3a33;
	background-image: radial-gradient(circle at 25% 0, #ffffff17, #0000 61%), linear-gradient(76deg, #0000 31%, #ffffff05 31%), linear-gradient(282deg, #ffffff03, #ffffff1a);
	backdrop-filter: blur(5px);
}
.header-homepage5 .main-header .header-left .header-nav {
  padding-left: 0px;
}
.header-homepage5 .main-menu > li {
  padding: 13px 0px 13px 0px;
}

.limo.header-homepage5{
    max-width: 1170px;
    left: 0;
    right: 0;
    margin: auto;
    border-radius: 25px;
    top: 10px;
}

.limo.header-homepage5 .header-top-sub {
    border: none;
}

.mobile-header-wrapper-style {
  position: fixed;
  top: 0px;
  max-width: 430px;
  width: 100%;
  min-height: 100vh;
  bottom: 0;
  right: 0;
  visibility: hidden;
  opacity: 0;
  transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
  background-color: #ffffff;
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.09);
  z-index: 1003;
  padding-top: 66px;
}
.mobile-header-wrapper-style.sidebar-visible {
  visibility: visible;
  opacity: 1;
  transform: translate(0, 0);
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner {
  padding: 0px 0px 0px 0px;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-logo {
  position: relative;
  border-bottom: 1px solid #CDE2E7;
  padding: 15px 30px 15px 30px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-logo img {
  width: 60px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-top {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 0;
  background-color: #ffffff;
  align-items: center;
  align-self: center;
  border-bottom: 0;
  margin-bottom: 15px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-top .mobile-header-logo a {
  display: block;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-top .mobile-header-logo a img {
  width: 100px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area {
  padding: 0px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu {
  max-width: 430px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li {
  display: block;
  position: relative;
  padding: 15px 0;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li:last-child {
  border-bottom: none;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li.has-children .menu-expand {
  right: 0;
  position: absolute;
  cursor: pointer;
  z-index: 9;
  text-align: center;
  font-size: 12px;
  display: block;
  width: 30px;
  height: 58px;
  line-height: 44px;
  top: 5px;
  color: #071920;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li.has-children .menu-expand i {
  font-size: 18px;
  font-weight: 300;
  opacity: 0.5;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li.has-children.active > .menu-expand {
  background: rgba(255, 255, 255, 0.2);
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li.has-children.active > .menu-expand i::before {
  content: "\f113";
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li a {
  font-size: 24px;
  line-height: 32px;
  font-family: "DM Sans", sans-serif;
  text-transform: capitalize;
  font-weight: 500;
  position: relative;
  display: inline-block;
  color: #181A1F;
  transition-duration: 0.2s;
  text-decoration: none;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li a i {
  margin-right: 5px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li a:hover {
  color: #06D6A0;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul {
  padding: 15px 0 0px 10px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li {
  padding: 0px 0;
  border-bottom: none;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li.has-children .menu-expand {
  top: 0px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li:hover a {
  padding-left: 13px;
  transition-duration: 0.2s;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li a {
  font-size: 16px;
  line-height: 35px;
  display: block;
  font-weight: 400;
  color: #626262;
  padding-left: 10px;
  position: relative;
  transition-duration: 0.2s;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li ul {
  margin-top: 0;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li.has-children.active {
  padding-bottom: 0;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li.hr {
  padding: 0 0 0 10px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li.hr span {
  background-color: #B9CAD0;
  height: 1px;
  width: 100%;
  display: block;
  margin: 5px 0;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li:hover > a {
  color: #06D6A0;
  padding-left: 3px;
  transition-duration: 0.2s;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .categories-dropdown-wrap ul li a {
  padding: 5px 15px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap {
  padding: 20px;
  border-radius: 5px;
  border: 1px solid #071920;
  margin: 17px 0 30px 0;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info {
  position: relative;
  margin-bottom: 13px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info:last-child {
  margin-bottom: 0;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info a {
  font-size: 14px;
  display: block;
  font-weight: 500;
  color: #071920;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info a:hover {
  color: #071920;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info a i {
  font-size: 14px;
  color: #071920;
  margin-right: 8px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown {
  margin-top: 5px;
  display: none;
  background-color: transparent;
  box-shadow: none;
  padding: 10px 0 0 0;
  width: 100%;
  z-index: 11;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul li {
  padding-bottom: 10px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul li:last-child {
  padding-bottom: 0px;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul li a {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.7);
  font-weight: 400;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul li a:hover {
  color: #071920;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info:hover > a {
  color: #071920;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-border {
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-border nav {
  display: inline-block;
  width: 100%;
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .site-copyright {
  font-size: 12px;
  color: #071920;
  padding-bottom: 20px;
}

.burger-icon {
  position: absolute;
  width: 24px;
  height: 20px;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
  top: 10px;
  right: 2px;
  z-index: 1004;
}
.burger-icon.burger-close {
  width: 20px;
}
.burger-icon > span {
  display: block;
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
}
.burger-icon > span.burger-icon-top {
  top: 2px;
}
.burger-icon > span.burger-icon-bottom {
  bottom: 2px;
}
.burger-icon > span.burger-icon-mid {
  top: 4px;
}
.burger-icon.burger-close {
  position: fixed;
  top: 23px;
  right: 15px;
}
.burger-icon.burger-close > span.burger-icon-top {
  display: none;
  opacity: 0;
}
.burger-icon.burger-close > span.burger-icon-mid {
  top: 8px;
  transform: rotate(45deg);
}
.burger-icon.burger-close > span.burger-icon-bottom {
  bottom: 10px;
  transform: rotate(-45deg);
}

.burger-icon > span::before,
.burger-icon > span::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  background-color: #333;
}

.burger-icon.burger-icon-white > span::before,
.burger-icon.burger-icon-white > span::after {
  background-color: #ffffff;
}

.burger-icon.burger-close.burger-icon-white > span::before,
.burger-icon.burger-close.burger-icon-white > span::after {
  background-color: #ffffff;
}

.mobile-search form {
  background-color: #F0F2F6;
  border-radius: 8px;
  height: 44px;
  padding: 0px 15px 0px 44px;
  position: relative;
}
.mobile-search form input {
  border: 0;
  background-color: transparent;
  width: 100%;
  padding: 12px 10px;
}
.mobile-search form i {
  position: absolute;
  left: 18px;
  top: 14px;
  font-size: 18px;
  color: #122830;
}

.mobile-social-icon h6 {
  font-weight: 600;
  font-size: 20px;
  margin-bottom: 30px;
}
.mobile-social-icon a {
  text-align: center;
  font-size: 14px;
  margin-right: 5px;
  transition-duration: 0.5s;
  height: 30px;
  width: 30px;
  display: inline-flex;
  background: #efeaff;
  border-radius: 30px;
  line-height: 1;
  align-content: center;
  justify-content: center;
}
.mobile-social-icon a img {
  max-width: 18px;
}
.mobile-social-icon a img:hover {
  opacity: 0.8;
}
.mobile-social-icon a:hover {
  transform: translateY(-2px);
  transition-duration: 0.5s;
  margin-top: -2px;
}
.mobile-social-icon a:last-child {
  margin-right: 0;
}

.mobile-account {
  margin: 20px 0 25px 0;
  padding: 30px 0 20px 0;
  border-top: thin solid #B9CAD0;
  border-bottom: thin solid #B9CAD0;
}
.mobile-account ul.mobile-menu {
  columns: 2;
  -webkit-columns: 2;
  -moz-columns: 2;
}
.mobile-account h6 {
  font-weight: 600;
  font-size: 18px;
}
.mobile-account ul li {
  padding: 8px 0;
}
.mobile-account ul li a {
  font-size: 14px;
  line-height: 1;
  text-transform: capitalize;
  font-weight: 400;
  position: relative;
  display: inline-block;
  color: #071920;
  transition-duration: 0.2s;
  text-decoration: none;
}
.mobile-account ul li:hover a {
  padding-left: 3px;
  transition-duration: 0.2s;
  color: #071920;
}

.box-download-app {
  padding-top: 30px;
  padding-bottom: 30px;
  border-bottom: 1px solid #CDE2E7;
  border-top: 1px solid #CDE2E7;
  margin-bottom: 20px;
  margin-top: 20px;
}

.nav-tabs-mobile {
  display: flex;
  width: 100%;
  flex-wrap: nowrap;
}
.nav-tabs-mobile li {
  padding: 0px;
  position: relative;
}
.nav-tabs-mobile li a {
  padding: 10px;
  display: flex;
  font-size: 14px;
  line-height: 18px;
  font-weight: bold;
  color: #024430;
}
.nav-tabs-mobile li a svg {
  height: 14px;
  vertical-align: middle;
  float: left;
  margin: 2px 5px 0px 0px !important;
  color: #024430;
}
.nav-tabs-mobile li a:hover, .nav-tabs-mobile li a:hover *, .nav-tabs-mobile li a.active {
  color: #06D6A0;
}
.nav-tabs-mobile li a:hover::before, .nav-tabs-mobile li a:hover *::before, .nav-tabs-mobile li a.active::before {
  content: "";
  height: 2px;
  width: 100%;
  position: absolute;
  bottom: -1px;
  left: 0px;
  background-color: #06D6A0;
}
.nav-tabs-mobile li a.active * {
  color: #06D6A0;
}

.notifications-item {
  padding: 20px 0px 0px 0px;
}
.notifications-item .item-notify {
  margin-bottom: 30px;
  display: flex;
}
.notifications-item .item-notify .item-image {
  min-width: 32px;
  max-width: 32px;
  width: 100%;
  margin-right: 15px;
}
.notifications-item .item-notify .item-info {
  width: 100%;
}
.notifications-item .item-notify .item-time {
  width: 63px;
  max-width: 63px;
  margin-left: 20px;
  min-width: 63px;
}

.footer {
  background-color: #000000;
  background-image: url(../imgs/template/bg-footer.png);
  background-repeat: no-repeat;
  background-position: top left;
  background-size: cover;
}
.footer .btn-download {
  border: 1px solid #fff;
  margin-bottom: 20px;
}
.footer .menu-footer {
  display: inline-block;
}
.footer .menu-footer li {
  list-style: none;
  margin-bottom: 8px;
}
.footer .menu-footer li a {
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  line-height: 35px;
  text-decoration: none;
  display: block;
  padding: 0px 0px 0px 0px;
  transition-duration: 0.2s;
  letter-spacing: 0.3px;
}
.footer .menu-footer li a:hover {
  transition-duration: 0.2s;
  padding-left: 2px;
  text-decoration: underline;
}
.footer.footer-white {
  background-color: #ffffff;
  background-image: none;
}
.footer.footer-white .footer-bottom, .footer.footer-white .box-footer-top {
  border-color: #E5E5E5;
}
.footer.footer-white .color-white, .footer.footer-white .menu-footer li a, .footer.footer-white .menu-bottom li a {
  color: #181A1F !important;
}
.footer.footer-white .menu-bottom li a:hover {
  text-decoration: underline;
}
.footer.footer-white .btn.btn-link-location {
  background-image: url(../imgs/page/homepage2/marker.png);
  color: #181A1F !important;
  border-radius: 40px;
}
.footer.footer-white .btn.btn-link-location:hover, .footer.footer-white .btn.btn-link-location .active {
  background-color: #FDEEEC;
}
.footer.footer-white .btn.btn-link-globe {
  background-image: url(../imgs/template/icons/globe-black.svg);
  color: #181A1F !important;
  border-radius: 40px;
}
.footer.footer-white .btn.btn-link-globe:hover, .footer.footer-white .btn.btn-link-globe.active {
  background-color: #FDEEEC;
}
.footer.footer-white .icon-socials.icon-facebook {
  background: url(../imgs/template/icons/fb-black.svg) no-repeat center;
}
.footer.footer-white .icon-socials.icon-twitter {
  background: url(../imgs/template/icons/tw-black.svg) no-repeat center;
}
.footer.footer-white .icon-socials.icon-instagram {
  background: url(../imgs/template/icons/instagram-black.svg) no-repeat center;
}
.footer.footer-white .icon-socials.icon-linkedin {
  background: url(../imgs/template/icons/linkedin-black.svg) no-repeat center;
}
.footer.footer-bg-4 {
  background-color: #F6F6F6;
}
.footer.footer-bg-4 .btn.btn-link-globe:hover, .footer.footer-bg-4 .btn.btn-link-globe.active, .footer.footer-bg-4 .btn.btn-link-location:hover, .footer.footer-bg-4 .btn.btn-link-location.active {
  background-color: #ffffff;
}
.footer.footer-3 {
  background-image: none;
}
.footer.footer-4 .btn.btn-link-location:hover, .footer.footer-4 .btn.btn-link-location .active {
  background-color: #ffffff;
}
.footer.footer-4 .btn.btn-link-globe:hover, .footer.footer-4 .btn.btn-link-globe.active {
  background-color: #ffffff;
}
.footer.footer-5 .box-footer-top {
  border-bottom: 0px;
}
.footer.footer-6 {
  padding-top: 60px;
  background-image: none;
}

.width-20 {
  width: 20%;
}

.width-25 {
  width: 25%;
}

.footer-bottom {
  padding: 28px 0px;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.menu-bottom {
  display: inline-block;
}
.menu-bottom li {
  display: inline-block;
  color: #fff;
  padding: 0px 15px;
}
.menu-bottom li a {
  color: #fff;
}
.menu-bottom li a:hover {
  color: #22C58B;
}

.bg-download {
  background-color: #FDEEEC;
  background-image: url(../imgs/page/homepage1/bg-download.png);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  padding: 123px 0px;
  position: relative;
}
.bg-download .container-sub {
  position: relative;
  z-index: 2;
}
.bg-download::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0px;
  right: 0px;
  background-image: url(../imgs/page/homepage1/phone.png);
  background-repeat: no-repeat;
  background-position: right center;
  background-size: auto 100%;
  z-index: 1;
}

.bg-download-2 {
  background-image: url(../imgs/page/homepage2/bg-download.png);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  padding: 123px 0px;
  position: relative;
}
.bg-download-2 .container-sub {
  position: relative;
  z-index: 2;
}
.bg-download-2::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0px;
  right: 0px;
  background-image: url(../imgs/page/homepage1/phone.png);
  background-repeat: no-repeat;
  background-position: right center;
  background-size: auto 100%;
  z-index: 1;
}

.bg-download-3 {
  background-image: url(../imgs/page/homepage3/bg-download-3.png);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  padding: 123px 0px;
  position: relative;
}
.bg-download-3 .container-sub {
  position: relative;
  z-index: 2;
}
.bg-download-3::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0px;
  right: 0px;
  background-image: url(../imgs/page/homepage1/phone.png);
  background-repeat: no-repeat;
  background-position: right center;
  background-size: auto 100%;
  z-index: 1;
}

#scrollUp {
  width: 56px;
  height: 56px;
  color: #fff;
  right: 20px;
  bottom: 20px;
  border-radius: 8px;
  text-align: center;
  text-decoration: none;
  overflow: hidden;
  z-index: 999 !important;
  border: 0;
  background-color: #fff;
  transition-duration: 0.2s;
  background-color: #024430;
}
#scrollUp i {
  display: block;
  line-height: 56px !important;
  font-size: 20px;
  color: #fff;
}
#scrollUp:hover {
  transform: translateY(-3px);
  transition-duration: 0.2s;
  background-color: #066a4c;
}

footer a {
  text-decoration: none;
}

.icon-socials {
  display: inline-block;
  margin-right: 8px;
  height: 40px;
  width: 40px;
  line-height: 40px;
  transition-duration: 0.2s;
  vertical-align: middle;
}
.icon-socials:last-child {
  margin-right: 0px;
}
.icon-socials.icon-facebook {
  background: url(../imgs/template/icons/fb.svg) no-repeat center;
  transition-duration: 0.2s;
}
.icon-socials.icon-facebook:hover {
  background: url(../imgs/template/icons/fb.svg) no-repeat center;
  transition-duration: 0.2s;
  background-color: rgba(255, 255, 255, 0.2);
}
.icon-socials.icon-twitter {
  background: url(../imgs/template/icons/tw.svg) no-repeat center;
  transition-duration: 0.2s;
}
.icon-socials.icon-twitter:hover {
  background: url(../imgs/template/icons/tw.svg) no-repeat center;
  transition-duration: 0.2s;
  background-color: rgba(255, 255, 255, 0.2);
}
.icon-socials.icon-instagram {
  background: url(../imgs/template/icons/instagram.svg) no-repeat center;
  transition-duration: 0.2s;
}
.icon-socials.icon-instagram:hover {
  background: url(../imgs/template/icons/instagram.svg) no-repeat center;
  transition-duration: 0.2s;
  background-color: rgba(255, 255, 255, 0.2);
}
.icon-socials.icon-linkedin {
  background: url(../imgs/template/icons/linkedin.svg) no-repeat center;
  transition-duration: 0.2s;
}
.icon-socials.icon-linkedin:hover {
  background: url(../imgs/template/icons/linkedin.svg) no-repeat center;
  transition-duration: 0.2s;
  background-color: rgba(255, 255, 255, 0.2);
}
.icon-socials:hover {
  transform: translateY(-3px);
  transition-duration: 0.2s;
  border-radius: 50%;
}

.footer-white .icon-socials:hover {
  background-color: #FDEEEC !important;
}

.box-footer-top {
  padding: 30px 0px 10px 0px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  margin-bottom: 60px;
}

/*LAYOUT -> SPACING**/
.section-padding-30 {
  padding: 30px 0;
}

.section-padding-50 {
  padding: 50px 0;
}

.section-padding-60 {
  padding: 60px 0;
}

.section-padding {
  padding: 25px 0;
}

.ml-3 {
  margin-left: 3px;
}

.ptb-0 {
  padding: 0;
}

.ptb-10 {
  padding: 10px 0;
}

.ptb-20 {
  padding: 20px 0;
}

.ptb-30 {
  padding: 30px 0;
}

.ptb-35 {
  padding: 35px 0;
}

.ptb-32 {
  padding: 32px 0;
}

.ptb-40 {
  padding: 40px 0;
}

.ptb-50 {
  padding: 50px 0;
}

.ptb-60 {
  padding: 60px 0;
}

.ptb-70 {
  padding: 70px 0;
}

.ptb-80 {
  padding: 80px 0;
}

.ptb-90 {
  padding: 90px 0;
}

.ptb-100 {
  padding: 100px 0;
}

.ptb-110 {
  padding: 110px 0;
}

.ptb-120 {
  padding: 120px 0;
}

.ptb-130 {
  padding: 130px 0;
}

.ptb-140 {
  padding: 140px 0;
}

.ptb-150 {
  padding: 150px 0;
}

.ptb-160 {
  padding: 160px 0;
}

.ptb-170 {
  padding: 170px 0;
}

.ptb-177 {
  padding: 177px 0;
}

.ptb-180 {
  padding: 180px 0;
}

.ptb-190 {
  padding: 190px 0;
}

.ptb-200 {
  padding: 200px 0;
}

.ptb-210 {
  padding: 210px 0;
}

.ptb-220 {
  padding: 220px 0;
}

.ptb-290 {
  padding: 290px 0;
}

.ptb-310 {
  padding: 310px 0;
}

.p-10 {
  padding: 10px !important;
}

.p-15 {
  padding: 15px !important;
}

.p-20 {
  padding: 20px !important;
}

.p-25 {
  padding: 25px !important;
}

.p-30 {
  padding: 30px !important;
}

.p-40 {
  padding: 40px !important;
}

.p-65 {
  padding: 65px !important;
}

.pt-5 {
  padding-top: 5px !important;
}

.pt-10 {
  padding-top: 10px !important;
}

.pt-15 {
  padding-top: 15px !important;
}

.pt-20 {
  padding-top: 20px !important;
}

.pt-25 {
  padding-top: 25px !important;
}

.pt-30 {
  padding-top: 30px !important;
}

.pt-35 {
  padding-top: 35px !important;
}

.pt-40 {
  padding-top: 40px !important;
}

.pt-45 {
  padding-top: 45px !important;
}

.pt-50 {
  padding-top: 50px !important;
}

.pt-55 {
  padding-top: 55px !important;
}

.pt-60 {
  padding-top: 60px !important;
}

.pt-65 {
  padding-top: 65px !important;
}

.pt-70 {
  padding-top: 70px !important;
}

.pt-75 {
  padding-top: 75px !important;
}

.pt-80 {
  padding-top: 80px !important;
}

.pt-85 {
  padding-top: 85px !important;
}

.pt-90 {
  padding-top: 90px !important;
}

.pt-95 {
  padding-top: 95px !important;
}

.pt-100 {
  padding-top: 100px !important;
}

.pt-105 {
  padding-top: 105px !important;
}

.pt-110 {
  padding-top: 110px !important;
}

.pt-115 {
  padding-top: 115px !important;
}

.pt-120 {
  padding-top: 120px !important;
}

.pt-125 {
  padding-top: 125px !important;
}

.pt-130 {
  padding-top: 130px !important;
}

.pt-135 {
  padding-top: 135px !important;
}

.pt-140 {
  padding-top: 140px !important;
}

.pt-145 {
  padding-top: 145px !important;
}

.pt-150 {
  padding-top: 150px !important;
}

.pt-155 {
  padding-top: 155px !important;
}

.pt-160 {
  padding-top: 160px !important;
}

.pt-165 {
  padding-top: 165px !important;
}

.pt-170 {
  padding-top: 170px !important;
}

.pt-175 {
  padding-top: 175px !important;
}

.pt-180 {
  padding-top: 180px !important;
}

.pt-185 {
  padding-top: 185px !important;
}

.pt-190 {
  padding-top: 190px !important;
}

.pt-195 {
  padding-top: 195px !important;
}

.pt-200 {
  padding-top: 200px !important;
}

.pt-260 {
  padding-top: 260px !important;
}

.pb-5 {
  padding-bottom: 5px !important;
}

.pb-10 {
  padding-bottom: 10px !important;
}

.pb-15 {
  padding-bottom: 15px !important;
}

.pb-20 {
  padding-bottom: 20px !important;
}

.pb-25 {
  padding-bottom: 25px !important;
}

.pb-30 {
  padding-bottom: 30px !important;
}

.pb-35 {
  padding-bottom: 35px !important;
}

.pb-40 {
  padding-bottom: 40px !important;
}

.pb-45 {
  padding-bottom: 45px !important;
}

.pb-50 {
  padding-bottom: 50px !important;
}

.pb-55 {
  padding-bottom: 55px !important;
}

.pb-60 {
  padding-bottom: 60px !important;
}

.pb-65 {
  padding-bottom: 65px !important;
}

.pb-70 {
  padding-bottom: 70px !important;
}

.pb-75 {
  padding-bottom: 75px !important;
}

.pb-80 {
  padding-bottom: 80px !important;
}

.pb-85 {
  padding-bottom: 85px !important;
}

.pb-90 {
  padding-bottom: 90px !important;
}

.pb-95 {
  padding-bottom: 95px !important;
}

.pb-100 {
  padding-bottom: 100px !important;
}

.pb-105 {
  padding-bottom: 105px !important;
}

.pb-110 {
  padding-bottom: 110px !important;
}

.pb-115 {
  padding-bottom: 115px !important;
}

.pb-120 {
  padding-bottom: 120px !important;
}

.pb-125 {
  padding-bottom: 125px !important;
}

.pb-130 {
  padding-bottom: 130px !important;
}

.pb-135 {
  padding-bottom: 135px !important;
}

.pb-140 {
  padding-bottom: 140px !important;
}

.pb-145 {
  padding-bottom: 145px !important;
}

.pb-150 {
  padding-bottom: 150px !important;
}

.pb-155 {
  padding-bottom: 155px !important;
}

.pb-160 {
  padding-bottom: 160px !important;
}

.pb-165 {
  padding-bottom: 165px !important;
}

.pb-170 {
  padding-bottom: 170px !important;
}

.pb-175 {
  padding-bottom: 175px !important;
}

.pb-180 {
  padding-bottom: 180px !important;
}

.pb-185 {
  padding-bottom: 185px !important;
}

.pb-190 {
  padding-bottom: 190px !important;
}

.pb-195 {
  padding-bottom: 195px !important;
}

.pb-200 {
  padding-bottom: 200px !important;
}

.pl-0 {
  padding-left: 0px !important;
}

.pl-5 {
  padding-left: 5px !important;
}

.pl-10 {
  padding-left: 10px !important;
}

.pl-15 {
  padding-left: 15px !important;
}

.pl-20 {
  padding-left: 20px !important;
}

.pl-25 {
  padding-left: 25px !important;
}

.pl-30 {
  padding-left: 30px !important;
}

.pl-35 {
  padding-left: 35px !important;
}

.pl-40 {
  padding-left: 40px !important;
}

.pl-45 {
  padding-left: 45px !important;
}

.pl-50 {
  padding-left: 50px !important;
}

.pl-55 {
  padding-left: 55px !important;
}

.pl-60 {
  padding-left: 60px !important;
}

.pl-65 {
  padding-left: 65px !important;
}

.pl-70 {
  padding-left: 70px !important;
}

.pl-75 {
  padding-left: 75px !important;
}

.pl-80 {
  padding-left: 80px !important;
}

.pl-85 {
  padding-left: 85px !important;
}

.pl-90 {
  padding-left: 90px !important;
}

.pl-95 {
  padding-left: 95px !important;
}

.pl-100 {
  padding-left: 100px !important;
}

.pl-105 {
  padding-left: 105px !important;
}

.pl-110 {
  padding-left: 110px !important;
}

.pl-115 {
  padding-left: 115px !important;
}

.pl-120 {
  padding-left: 120px !important;
}

.pl-125 {
  padding-left: 125px !important;
}

.pl-130 {
  padding-left: 130px !important;
}

.pl-135 {
  padding-left: 135px !important;
}

.pl-140 {
  padding-left: 140px !important;
}

.pl-145 {
  padding-left: 145px !important;
}

.pl-150 {
  padding-left: 150px !important;
}

.pl-155 {
  padding-left: 155px !important;
}

.pl-160 {
  padding-left: 160px !important;
}

.pl-165 {
  padding-left: 165px !important;
}

.pl-170 {
  padding-left: 170px !important;
}

.pl-175 {
  padding-left: 175px !important;
}

.pl-180 {
  padding-left: 180px !important;
}

.pl-185 {
  padding-left: 185px !important;
}

.pl-190 {
  padding-left: 190px !important;
}

.pl-195 {
  padding-left: 195px !important;
}

.pl-200 {
  padding-left: 200px !important;
}

.pr-0 {
  padding-right: 0px !important;
}

.pr-5 {
  padding-right: 5px !important;
}

.pr-10 {
  padding-right: 10px !important;
}

.pr-15 {
  padding-right: 15px !important;
}

.pr-20 {
  padding-right: 20px !important;
}

.pr-25 {
  padding-right: 25px !important;
}

.pr-30 {
  padding-right: 30px !important;
}

.pr-35 {
  padding-right: 35px !important;
}

.pr-40 {
  padding-right: 40px !important;
}

.pr-45 {
  padding-right: 45px !important;
}

.pr-50 {
  padding-right: 50px !important;
}

.pr-55 {
  padding-right: 55px !important;
}

.pr-60 {
  padding-right: 60px !important;
}

.pr-65 {
  padding-right: 65px !important;
}

.pr-70 {
  padding-right: 70px !important;
}

.pr-75 {
  padding-right: 75px !important;
}

.pr-80 {
  padding-right: 80px !important;
}

.pr-85 {
  padding-right: 85px !important;
}

.pr-90 {
  padding-right: 90px !important;
}

.pr-95 {
  padding-right: 95px !important;
}

.pr-100 {
  padding-right: 100px !important;
}

.pr-105 {
  padding-right: 105px !important;
}

.pr-110 {
  padding-right: 110px !important;
}

.pr-115 {
  padding-right: 115px !important;
}

.pr-120 {
  padding-right: 120px !important;
}

.pr-125 {
  padding-right: 125px !important;
}

.pr-130 {
  padding-right: 130px !important;
}

.pr-135 {
  padding-right: 135px !important;
}

.pr-140 {
  padding-right: 140px !important;
}

.pr-145 {
  padding-right: 145px !important;
}

.pr-150 {
  padding-right: 150px !important;
}

.pr-155 {
  padding-right: 155px !important;
}

.pr-160 {
  padding-right: 160px !important;
}

.pr-165 {
  padding-right: 165px !important;
}

.pr-170 {
  padding-right: 170px !important;
}

.pr-175 {
  padding-right: 175px !important;
}

.pr-180 {
  padding-right: 180px !important;
}

.pr-185 {
  padding-right: 185px !important;
}

.pr-190 {
  padding-right: 190px !important;
}

.pr-195 {
  padding-right: 195px !important;
}

.pr-200 {
  padding-right: 200px !important;
}

.plr-5-percent {
  padding: 0 5%;
}

/***************************
    Page section margin
****************************/
.mtb-0 {
  margin: 0;
}

.mtb-10 {
  margin: 10px 0;
}

.mtb-15 {
  margin: 15px 0;
}

.mtb-20 {
  margin: 20px 0;
}

.mtb-30 {
  margin: 30px 0;
}

.mtb-40 {
  margin: 40px 0;
}

.mtb-50 {
  margin: 50px 0;
}

.mtb-60 {
  margin: 60px 0;
}

.mtb-70 {
  margin: 70px 0;
}

.mtb-80 {
  margin: 80px 0;
}

.mtb-90 {
  margin: 90px 0;
}

.mtb-100 {
  margin: 100px 0;
}

.mtb-110 {
  margin: 110px 0;
}

.mtb-120 {
  margin: 120px 0;
}

.mtb-130 {
  margin: 130px 0;
}

.mtb-140 {
  margin: 140px 0;
}

.mtb-150 {
  margin: 150px 0;
}

.mtb-290 {
  margin: 290px 0;
}

.mb-24 {
  margin-bottom: 24px;
}

.mt-5 {
  margin-top: 5px !important;
}

.mt-8 {
  margin-top: 8px !important;
}

.mt-10 {
  margin-top: 10px !important;
}

.mt-15 {
  margin-top: 15px !important;
}

.mt-20 {
  margin-top: 20px !important;
}

.mt-25 {
  margin-top: 25px !important;
}

.mt-30 {
  margin-top: 30px !important;
}

.mt-35 {
  margin-top: 35px !important;
}

.mt-40 {
  margin-top: 40px !important;
}

.mt-45 {
  margin-top: 45px !important;
}

.mt-50 {
  margin-top: 50px !important;
}

.mt-55 {
  margin-top: 55px !important;
}

.mt-60 {
  margin-top: 60px !important;
}

.mt-65 {
  margin-top: 65px !important;
}

.mt-70 {
  margin-top: 70px !important;
}

.mt-75 {
  margin-top: 75px !important;
}

.mt-80 {
  margin-top: 80px !important;
}

.mt-85 {
  margin-top: 85px !important;
}

.mt-90 {
  margin-top: 90px !important;
}

.mt-95 {
  margin-top: 95px !important;
}

.mt-100 {
  margin-top: 100px !important;
}

.mt-105 {
  margin-top: 105px !important;
}

.mt-110 {
  margin-top: 110px !important;
}

.mt-115 {
  margin-top: 115px !important;
}

.mt-120 {
  margin-top: 120px !important;
}

.mt-125 {
  margin-top: 125px !important;
}

.mt-130 {
  margin-top: 130px !important;
}

.mt-135 {
  margin-top: 135px !important;
}

.mt-140 {
  margin-top: 140px !important;
}

.mt-145 {
  margin-top: 145px !important;
}

.mt-150 {
  margin-top: 150px !important;
}

.mt-155 {
  margin-top: 155px !important;
}

.mt-160 {
  margin-top: 160px !important;
}

.mt-165 {
  margin-top: 165px !important;
}

.mt-170 {
  margin-top: 170px !important;
}

.mt-175 {
  margin-top: 175px !important;
}

.mt-180 {
  margin-top: 180px !important;
}

.mt-185 {
  margin-top: 185px !important;
}

.mt-190 {
  margin-top: 190px !important;
}

.mt-195 {
  margin-top: 195px !important;
}

.mt-200 {
  margin-top: 200px !important;
}

.mb-5 {
  margin-bottom: 5px !important;
}

.mb-10 {
  margin-bottom: 10px !important;
}

.mb-15 {
  margin-bottom: 15px !important;
}

.mb-20 {
  margin-bottom: 20px !important;
}

.mb-25 {
  margin-bottom: 25px !important;
}

.mb-30 {
  margin-bottom: 30px !important;
}

.mb-35 {
  margin-bottom: 35px !important;
}

.mb-40 {
  margin-bottom: 40px !important;
}

.mb-45 {
  margin-bottom: 45px !important;
}

.mb-50 {
  margin-bottom: 50px !important;
}

.mb-55 {
  margin-bottom: 55px !important;
}

.mb-60 {
  margin-bottom: 60px !important;
}

.mb-65 {
  margin-bottom: 65px !important;
}

.mb-70 {
  margin-bottom: 70px !important;
}

.mb-75 {
  margin-bottom: 75px !important;
}

.mb-80 {
  margin-bottom: 80px !important;
}

.mb-85 {
  margin-bottom: 85px !important;
}

.mb-90 {
  margin-bottom: 90px !important;
}

.mb-95 {
  margin-bottom: 95px !important;
}

.mb-100 {
  margin-bottom: 100px !important;
}

.mb-105 {
  margin-bottom: 105px !important;
}

.mb-110 {
  margin-bottom: 110px !important;
}

.mb-115 {
  margin-bottom: 115px !important;
}

.mb-120 {
  margin-bottom: 120px !important;
}

.mb-125 {
  margin-bottom: 125px !important;
}

.mb-130 {
  margin-bottom: 130px !important;
}

.mb-135 {
  margin-bottom: 135px !important;
}

.mb-140 {
  margin-bottom: 140px !important;
}

.mb-145 {
  margin-bottom: 145px !important;
}

.mb-150 {
  margin-bottom: 150px !important;
}

.mb-155 {
  margin-bottom: 155px !important;
}

.mb-160 {
  margin-bottom: 160px !important;
}

.mb-165 {
  margin-bottom: 165px !important;
}

.mb-170 {
  margin-bottom: 170px !important;
}

.mb-175 {
  margin-bottom: 175px !important;
}

.mb-180 {
  margin-bottom: 180px !important;
}

.mb-185 {
  margin-bottom: 185px !important;
}

.mb-190 {
  margin-bottom: 190px !important;
}

.mb-195 {
  margin-bottom: 195px !important;
}

.mb-200 {
  margin-bottom: 200px !important;
}

.ml-0 {
  margin-left: 0px !important;
}

.ml-5 {
  margin-left: 5px !important;
}

.ml-10 {
  margin-left: 10px !important;
}

.ml-15 {
  margin-left: 15px !important;
}

.ml-20 {
  margin-left: 20px !important;
}

.ml-25 {
  margin-left: 25px !important;
}

.ml-30 {
  margin-left: 30px !important;
}

.ml-35 {
  margin-left: 35px !important;
}

.ml-40 {
  margin-left: 40px !important;
}

.ml-45 {
  margin-left: 45px !important;
}

.ml-50 {
  margin-left: 50px !important;
}

.ml-55 {
  margin-left: 55px !important;
}

.ml-60 {
  margin-left: 60px !important;
}

.ml-65 {
  margin-left: 65px !important;
}

.ml-70 {
  margin-left: 70px !important;
}

.ml-75 {
  margin-left: 75px !important;
}

.ml-80 {
  margin-left: 80px !important;
}

.ml-85 {
  margin-left: 85px !important;
}

.ml-90 {
  margin-left: 90px !important;
}

.ml-95 {
  margin-left: 95px !important;
}

.ml-100 {
  margin-left: 100px !important;
}

.ml-105 {
  margin-left: 105px !important;
}

.ml-110 {
  margin-left: 110px !important;
}

.ml-115 {
  margin-left: 115px !important;
}

.ml-120 {
  margin-left: 120px !important;
}

.ml-125 {
  margin-left: 125px !important;
}

.ml-130 {
  margin-left: 130px !important;
}

.ml-135 {
  margin-left: 135px !important;
}

.ml-140 {
  margin-left: 140px !important;
}

.ml-145 {
  margin-left: 145px !important;
}

.ml-150 {
  margin-left: 150px !important;
}

.ml-155 {
  margin-left: 155px !important;
}

.ml-160 {
  margin-left: 160px !important;
}

.ml-165 {
  margin-left: 165px !important;
}

.ml-170 {
  margin-left: 170px !important;
}

.ml-175 {
  margin-left: 175px !important;
}

.ml-180 {
  margin-left: 180px !important;
}

.ml-185 {
  margin-left: 185px !important;
}

.ml-190 {
  margin-left: 190px !important;
}

.ml-195 {
  margin-left: 195px !important;
}

.ml-200 {
  margin-left: 200px !important;
}

.mr-5 {
  margin-right: 5px !important;
}

.mr-10 {
  margin-right: 10px !important;
}

.mr-15 {
  margin-right: 15px !important;
}

.mr-20 {
  margin-right: 20px !important;
}

.mr-25 {
  margin-right: 25px !important;
}

.mr-30 {
  margin-right: 30px !important;
}

.mr-35 {
  margin-right: 35px !important;
}

.mr-40 {
  margin-right: 40px !important;
}

.mr-45 {
  margin-right: 45px !important;
}

.mr-50 {
  margin-right: 50px !important;
}

.mr-55 {
  margin-right: 55px !important;
}

.mr-60 {
  margin-right: 60px !important;
}

.mr-65 {
  margin-right: 65px !important;
}

.mr-70 {
  margin-right: 70px !important;
}

.mr-75 {
  margin-right: 75px !important;
}

.mr-80 {
  margin-right: 80px !important;
}

.mr-85 {
  margin-right: 85px !important;
}

.mr-90 {
  margin-right: 90px !important;
}

.mr-95 {
  margin-right: 95px !important;
}

.mr-100 {
  margin-right: 100px !important;
}

.mr-105 {
  margin-right: 105px !important;
}

.mr-110 {
  margin-right: 110px !important;
}

.mr-115 {
  margin-right: 115px !important;
}

.mr-120 {
  margin-right: 120px !important;
}

.mr-125 {
  margin-right: 125px !important;
}

.mr-130 {
  margin-right: 130px !important;
}

.mr-135 {
  margin-right: 135px !important;
}

.mr-140 {
  margin-right: 140px !important;
}

.mr-145 {
  margin-right: 145px !important;
}

.mr-150 {
  margin-right: 150px !important;
}

.mr-155 {
  margin-right: 155px !important;
}

.mr-160 {
  margin-right: 160px !important;
}

.mr-165 {
  margin-right: 165px !important;
}

.mr-170 {
  margin-right: 170px !important;
}

.mr-175 {
  margin-right: 175px !important;
}

.mr-180 {
  margin-right: 180px !important;
}

.mr-185 {
  margin-right: 185px !important;
}

.mr-190 {
  margin-right: 190px !important;
}

.mr-195 {
  margin-right: 195px !important;
}

.mr-200 {
  margin-right: 200px !important;
}

.box-author {
  display: flex;
  align-items: center;
}
.box-author img {
  max-width: 56px;
  height: 56px;
  width: 56px;
  border-radius: 50%;
  margin-right: 10px;
}
.box-author .author-info .author-name {
  display: block;
}
.box-author .author-info img {
  width: 12px;
  height: auto;
  border-radius: 0;
  margin-right: 0px;
  max-width: 100%;
}

.list-faqs {
  padding: 0px;
  margin: 0px;
  list-style: none;
  border: 0px;
}
.list-faqs li {
  margin-bottom: 15px;
  width: 100%;
}
.list-faqs li a {
  display: flex;
  padding: 14px 26px 16px 26px;
  border: 1px solid #ECF1F2;
  color: #4E6770;
  border-radius: 4px;
  text-decoration: none;
  font-size: 18px;
  line-height: 24px;
  font-weight: 700;
}
.list-faqs li a span {
  width: 100%;
  display: inline-block;
}
.list-faqs li a svg {
  display: inline-block;
  margin-top: 4px;
  transition-duration: 0.2s;
}
.list-faqs li a:hover, .list-faqs li a.active {
  background-color: #066a4c;
  color: #FFE7BB !important;
}
.list-faqs li a:hover svg, .list-faqs li a:hover *, .list-faqs li a.active svg, .list-faqs li a.active * {
  color: #FFE7BB !important;
}
.list-faqs li a:hover svg {
  transform: rotate(-45deg);
  transition-duration: 0.2s;
}

.accordion .accordion-item {
  border-bottom: 1px solid #E5E5E5;
  transition: all 0.4s ease;
}
.accordion .accordion-button {
  font-size: 20px;
  line-height: 32px;
  font-weight: 500;
  color: #181A1F;
  border: 0px;
  padding: 20px 0px 20px 0px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  background-color: #ffffff;
  transition: all 0.4s ease;
}
.accordion .accordion-collapse {
  border-width: 0 0;
  background-color: #ffffff;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  transition: all 0.4s ease;
}
.accordion .accordion-body {
  padding: 0px 0px 30px 0px;
  font-size: 16px;
  line-height: 28px;
  transition: all 0.4s ease;
}

.accordion-button::after {
  width: 30px;
  height: 30px;
  background-image: url(../imgs/template/icons/plus.png);
  background-size: 30px;
}

.accordion-button:not(.collapsed) {
  background-color: #ffffff;
}
.accordion-button:not(.collapsed)::after {
  background-image: url(../imgs/template/icons/minus.png);
}

.box-search-ride {
  background-color: #ffffff;
  border-radius: 100px;
  padding: 20px 5px;
  position: absolute;
  bottom: 50px;
  left: 0px;
  right: 0px;
  margin: auto;
  z-index: 3;
  max-width: 1170px;
  display: flex;
  align-items: center;
}
.box-search-ride .search-item {
  width: 100%;
  display: flex;
  padding: 0px 15px;
  align-items: center;
  position: relative;
}
.box-search-ride .search-item .search-icon {
  max-width: 52px;
  width: 100%;
  min-width: 52px;
  margin-right: 15px;
}
.box-search-ride .search-item .search-icon .item-icon {
  display: inline-block;
  width: 52px;
  height: 52px;
  border-radius: 100%;
  background-color: #F6F6F6;
  background-position: center;
  background-repeat: no-repeat;
  vertical-align: middle;
}
.box-search-ride .search-item .search-icon .item-icon.icon-date {
  background-image: url(../imgs/template/icons/calendar.svg);
}
.box-search-ride .search-item .search-icon .item-icon.icon-time {
  background-image: url(../imgs/template/icons/time.svg);
}
.box-search-ride .search-item .search-icon .item-icon.icon-from {
  background-image: url(../imgs/template/icons/from.svg);
}
.box-search-ride .search-item .search-icon .item-icon.icon-to {
  background-image: url(../imgs/template/icons/to.svg);
}
.box-search-ride .search-item .search-inputs {
  width: 100%;
}
.box-search-ride .search-item .search-inputs .search-input {
  width: 100%;
  display: inline-block;
  padding: 0px;
  border: 0px;
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  color: #181A1F;
  background-color: transparent;
}
.box-search-ride .search-button {
  max-width: 161px;
  min-width: 161px;
}
.box-search-ride .search-time {
  max-width: 200px;
  min-width: 200px;
}
.box-search-ride .search-date {
  max-width: 230px;
  min-width: 230px;
}

.list-logos {
  display: flex;
  align-items: center;
}
.list-logos li {
  width: 100%;
  text-align: right;
}

.icon-16 {
  height: 16px;
}

.bg-our-fleet {
  background-image: url(../imgs/page/homepage1/bg-our-fleet.png);
  background-repeat: no-repeat;
  background-position: left top 230px;
}

.box-pagination-fleet {
  position: relative;
  margin-top: 60px;
}

.swiper-button-prev-fleet {
  margin-right: 15px;
}

.swiper-button-next-fleet, .swiper-button-prev-fleet {
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  bottom: auto;
}

.swiper-button-next-fleet, .swiper-button-prev-fleet {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 1px solid #E5E5E5;
  line-height: 67px;
  text-align: center;
  display: inline-block;
  background-image: none;
}
.swiper-button-next-fleet svg, .swiper-button-prev-fleet svg {
  height: 20px;
  display: inline-block;
  vertical-align: middle;
  color: #181A1F;
}
.swiper-button-next-fleet:hover, .swiper-button-prev-fleet:hover {
  border-color: #181A1F;
  background-color: #F6F6F6;
}

.bg-our-service-2 .swiper-button-next-fleet, .bg-our-service-2 .swiper-button-prev-fleet {
  line-height: 67px;
}
.bg-our-service-2 .swiper-button-next-fleet svg, .bg-our-service-2 .swiper-button-prev-fleet svg {
  color: #fff;
  height: 20px;
}
.bg-our-service-2 .swiper-button-next-fleet:hover svg, .bg-our-service-2 .swiper-button-prev-fleet:hover svg {
  color: #181A1F;
}

.slider-nav-thumbnails {
  max-width: 439px;
  margin: auto 0 auto auto;
}

.list-how.slider-nav-thumbnails {
  list-style: none;
  padding: 0px;
  margin: 0px;
}
.list-how.slider-nav-thumbnails .slick-list .slick-track li {
  padding-bottom: 60px;
  position: relative;
  padding-left: 50px;
  cursor: pointer;
}
.list-how.slider-nav-thumbnails .slick-list .slick-track li .line-white {
  display: none;
  height: 56px;
  width: 3px;
  position: absolute;
  top: 36px;
  border-radius: 60px;
  background-color: #ffffff;
  left: 8px;
}
.list-how.slider-nav-thumbnails .slick-list .slick-track li::before {
  content: "";
  height: 20px;
  width: 20px;
  border: 1px solid #fff;
  border-radius: 50%;
  opacity: 0.6;
  position: absolute;
  top: 6px;
  left: 0px;
}
.list-how.slider-nav-thumbnails .slick-list .slick-track li::after {
  content: "";
  bottom: 4px;
  width: 3px;
  opacity: 0.2;
  position: absolute;
  top: 36px;
  background-color: #ffffff;
  left: 8px;
  border-radius: 60px;
}
.list-how.slider-nav-thumbnails .slick-list .slick-track li h4, .list-how.slider-nav-thumbnails .slick-list .slick-track li p {
  color: #fff;
  opacity: 0.6;
}
.list-how.slider-nav-thumbnails .slick-list .slick-track li.slick-current::before {
  opacity: 1;
}
.list-how.slider-nav-thumbnails .slick-list .slick-track li.slick-current h4, .list-how.slider-nav-thumbnails .slick-list .slick-track li.slick-current p {
  opacity: 1;
}
.list-how.slider-nav-thumbnails .slick-list .slick-track li.slick-current .line-white {
  display: block;
}
.list-how.slider-nav-thumbnails .slick-list .slick-track li.slick-active:last-child::after {
  display: none;
}
.list-how.slider-nav-thumbnails .slick-list .slick-track li.slick-active:last-child .line-white {
  display: none;
}

.box-main-slider {
  width: 100%;
  position: absolute;
  top: 15%;
  right: 0px;
  max-width: 52%;
}

.detail-gallery {
  display: inline-block;
  vertical-align: middle;
  min-height: 510px;
  width: 100%;
  position: relative;
  z-index: 4;
}
.detail-gallery .main-image-slider .slick-slide {
  display: flex;
  align-items: center;
  max-height: 630px;
  width: 100%;
  text-align: right;
}
.detail-gallery .main-image-slider .slick-slide img {
  max-height: 600px;
  max-width: 100%;
}

.bg-how-it-works {
  position: relative;
}
.bg-how-it-works::before {
  content: "";
  width: 100%;
  height: 100%;
  background-image: url(../imgs/page/homepage1/line.png);
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: contain;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1;
}
.bg-how-it-works .position-z3 {
  position: relative;
  z-index: 3;
}

.box-faqs {
  max-width: 770px;
  margin: auto;
}

.bg-showcase {
  background-color: #0B1D40;
  background-image: url(../imgs/page/homepage1/bg-showcase.png);
  background-repeat: no-repeat;
  background-position: top right;
  background-size: cover;
  border-radius: 14px;
  padding-left: 20px;
  padding-right: 20px;
}

.bg-our-service {
  background-image: url(../imgs/page/homepage1/bg-our-service.png);
  background-repeat: no-repeat;
  background-position: right top -460px;
}

.bg-faqs {
  background-image: url(../imgs/page/homepage1/bg-faqs.png);
  background-repeat: no-repeat;
  background-position: left -100px bottom 50px;
}

.box-showcase {
  padding-left: 60px;
  padding-right: 60px;
}

.box-quote {
  display: flex;
  align-items: center;
  margin-bottom: 60px;
}
.box-quote .icon-quote {
  height: 70px;
  width: 70px;
  border-radius: 6px;
  background-color: #ffffff;
  background-image: url(../imgs/page/homepage1/quote.png);
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 20px;
}

.content-quote {
  font-size: 24px;
  line-height: 40px;
  color: #fff;
  font-weight: 500;
}

.box-video {
  max-width: 370px;
  width: 100%;
  position: relative;
  border-radius: 6px;
  display: inline-block;
}
.box-video img {
  border-radius: 6px;
  width: 100%;
}
.box-video .btn-play {
  position: absolute;
  height: 100px;
  width: 100px;
  top: 50%;
  left: -50px;
  margin-top: -50px;
  background-image: url(../imgs/page/homepage1/play.png);
  background-repeat: no-repeat;
  background-position: center;
  z-index: 2;
}

.cardIconStyleCircle .cardIconTitleDesc .cardIcon {
  position: relative;
}
.cardIconStyleCircle .cardIconTitleDesc .cardIcon::before {
  content: "";
  height: 60px;
  width: 60px;
  background-color: #FDEEEC;
  border-radius: 50%;
  position: absolute;
  top: -25px;
  left: 0px;
  right: 0px;
  margin: auto;
  z-index: 1;
}
.cardIconStyleCircle .cardIconTitleDesc .cardIcon img {
  position: relative;
  z-index: 2;
}

.box-gallery {
  display: flex;
}
.box-gallery .gallery-1 {
  width: 311px;
  margin-right: 10px;
  margin-bottom: 10px;
}
.box-gallery .gallery-1 img {
  border-radius: 6px;
}
.box-gallery .gallery-2 {
  width: 249px;
}
.box-gallery .gallery-2 img {
  margin-bottom: 10px;
  display: block;
  border-radius: 6px;
}

.box-region-right {
  padding-left: 110px;
}

.bg-region {
  background-image: url(../imgs/page/homepage1/maps.png);
  background-repeat: no-repeat;
  background-position: center right;
  background-size: contain;
}

.tags a {
  color: #fff;
  font-size: 14px;
  line-height: 24px;
}

.box-pagination-testimonials {
  position: relative;
  display: inline-block;
}
.box-pagination-testimonials .firstNumber, .box-pagination-testimonials .lastNumber {
  position: absolute;
  top: 3px;
  font-size: 16px;
  line-height: 20px;
  font-weight: 500;
  color: #fff;
}
.box-pagination-testimonials .firstNumber {
  left: 0px;
}
.box-pagination-testimonials .lastNumber {
  right: 0px;
}
.box-pagination-testimonials .swiper-pagination.swiper-pagination-testimonials {
  text-align: left;
  position: relative;
  padding: 0px 34px 0px 30px;
}
.box-pagination-testimonials .swiper-pagination.swiper-pagination-testimonials .swiper-pagination-bullet {
  width: 50px;
  height: 2px;
  display: inline-block;
  background: #ffffff;
  opacity: 0.2;
  margin: 0px;
  border-radius: 0px;
}
.box-pagination-testimonials .swiper-pagination.swiper-pagination-testimonials .swiper-pagination-bullet-active {
  opacity: 1;
  width: 50px;
  height: 2px;
}

.box-testimonials {
  background-image: url(../imgs/page/homepage1/bg-testimonials.png);
  background-repeat: no-repeat;
  background-position: top right 35%;
}

.box-list-how {
  position: relative;
}
.box-list-how ul {
  display: flex;
  width: 100%;
}
.box-list-how ul li {
  width: 100%;
  padding-right: 180px;
  display: inline-block;
}
.box-list-how ul li:last-child {
  padding-right: 0px;
  min-width: 270px;
  max-width: 270px;
}
.box-list-how ul li.has-arrow {
  background-image: url(../imgs/page/homepage2/arrow-button.png);
  background-repeat: no-repeat;
  background-position: right 60px top 80px;
}

.box-fleet-cover {
  padding-left: 100px;
  padding-right: 100px;
}

.box-fleet-padding {
  background-color: #F6F6F6;
  border-radius: 12px;
  padding-top: 120px;
  padding-bottom: 120px;
  background-image: url(../imgs/page/homepage2/bg-line.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.box-image-showcase {
  position: relative;
}
.box-image-showcase > img {
  border-radius: 6px;
  display: block;
}

.box-btn-play-video {
  position: absolute;
  bottom: 20px;
  left: 20px;
}
.box-btn-play-video .btn-white {
  border-radius: 6px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
}
.box-btn-play-video .btn-white:hover {
  background-color: #E95440;
}

.box-number-info {
  border: 1px solid #E5E5E5;
  padding: 10px 26px;
  border-radius: 6px;
  background-color: #ffffff;
  display: flex;
  align-items: center;
  min-height: 83px;
}
.box-number-info .text-number {
  display: inline-block;
  padding-right: 15px;
}
.box-number-info .text-number-info {
  width: 100%;
  display: inline-block;
}

.block-padding-100 {
  padding-left: 100px;
  padding-right: 100px;
}
.block-padding-100 .block-padding-inner {
  border-radius: 12px;
  padding: 120px 0px;
}

.bg-testimonial {
  background-image: url(../imgs/page/homepage2/quote.png);
  background-repeat: no-repeat;
  background-position: right 175px top 49px;
  background-size: auto;
}

.swiper-group-testimonials-2 .swiper-slide {
  padding: 40px;
  width: 100% !important;
}

.bg-testimonial .box-region-right {
  padding-left: 30px;
}

.box-pagination-button-testimonials-2 {
  position: relative;
  padding-left: 40px;
  display: flex;
  position: relative;
  align-items: center;
  padding-top: 20px;
}
.box-pagination-button-testimonials-2 .swiper-button-prev-testimonials-2, .box-pagination-button-testimonials-2 .swiper-button-next-testimonials-2 {
  position: relative;
  top: auto;
  bottom: auto;
  right: auto;
  display: inline-block;
  left: auto;
  height: 40px;
  width: 40px;
}
.box-pagination-button-testimonials-2 .swiper-pagination-testimonials-2 {
  display: inline-block;
  padding-left: 20px;
  width: auto;
  position: relative;
  top: auto;
  margin: 0px;
}
.box-pagination-button-testimonials-2 .swiper-button-prev-testimonials-2 {
  background-image: url(../imgs/page/homepage2/prev-white.png);
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 10px;
}
.box-pagination-button-testimonials-2 .swiper-button-next-testimonials-2 {
  background-image: url(../imgs/page/homepage2/next-white.png);
  background-repeat: no-repeat;
  background-position: center;
}

.latest-new-white .tags a, .latest-new-white .color-white {
  color: #181A1F !important;
}
.latest-new-white .btn.btn-arrow-up {
  border-color: #181A1F;
}
.latest-new-white .btn.btn-arrow-up svg {
  color: #181A1F;
}
.latest-new-white .datePost .color-white {
  color: #fff !important;
}

.box-banner-homepage-2 {
  position: relative;
}

.box-search-ride-style-2 {
  display: inline-block;
  background-color: transparent;
  bottom: 0px;
  width: 100%;
}
.box-search-ride-style-2 .box-search-tabs {
  max-width: 470px;
  width: 100%;
  border-radius: 6px;
  bottom: -60px;
  right: 0px;
  background-color: #ffffff;
  position: absolute;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}
.box-search-ride-style-2 .box-form-search {
  display: flex;
  flex-wrap: wrap;
  padding: 30px;
}
.box-search-ride-style-2 .box-form-search .btn-search {
  background-color: #E95440;
  border-radius: 6px;
  width: 100%;
}
.box-search-ride-style-2 .box-form-search .btn-search:hover {
  background-color: #000000;
}
.box-search-ride-style-2 .search-item {
  background: #F6F6F6;
  padding: 10px;
  border-radius: 6px;
  margin-bottom: 20px;
  width: 100%;
}
.box-search-ride-style-2 .search-item.search-date, .box-search-ride-style-2 .search-item.search-time, .box-search-ride-style-2 .search-item.search-button {
  min-width: 100%;
  max-width: 100%;
}
.box-search-ride-style-2 .search-item.search-button {
  padding: 0px;
}
.box-search-ride-style-2 .search-item .search-icon .item-icon {
  background-color: #ffffff;
  border-radius: 6px;
  width: 44px;
  height: 44px;
}
.box-search-ride-style-2 .search-item .search-inputs .search-input {
  line-height: 18px;
}
.box-search-ride-style-2 .search-item .search-inputs .text-14 {
  line-height: 16px;
}

.nav-tabs-search {
  border-bottom: 1px solid #E5E5E5;
}
.nav-tabs-search li {
  padding: 0px 30px;
  position: relative;
}
.nav-tabs-search li a {
  position: relative;
  display: block;
  padding: 26px 0px;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  color: #626262;
}
.nav-tabs-search li a.active, .nav-tabs-search li a:hover {
  color: #181A1F;
}
.nav-tabs-search li a.active::before, .nav-tabs-search li a:hover::before {
  content: "";
  height: 2px;
  width: 100%;
  background-color: #181A1F;
  bottom: 0px;
  left: 0px;
  position: absolute;
}

.box-fleet-padding.bg-testimonial {
  padding-bottom: 40px;
}

.box-fleet-padding.bg-download-2 {
  background-image: url(../imgs/page/homepage2/bg-line.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.box-banner-homepage-3 {
  position: relative;
  background-image: url();
}
.box-banner-homepage-3 .box-banner-info {
  top: 50%;
  transform: translateY(-50%);
  max-width: 1410px;
}
.box-banner-homepage-3 .box-cover-image {
  background-image: url(../imgs/page/homepage3/bg-banner.png);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
}
.box-banner-homepage-3 .box-image-banner {
  position: absolute;
  top: 50%;
  right: 0%;
  transform: translateY(-50%);
  display: flex;
  max-width: 48%;
  overflow: hidden;
  z-index: 3;
  padding-top: 30px;
}
.box-banner-homepage-3 .box-image-banner .img-1 {
  position: relative;
  top: 20px;
  display: inline-block;
  margin-right: 15px;
  border-radius: 6px;
}
.box-banner-homepage-3 .box-image-banner .img-2 {
  position: relative;
  top: -20px;
  display: inline-block;
  margin-right: 15px;
  border-radius: 6px;
}
.box-banner-homepage-3 .box-image-banner .img-3 {
  position: relative;
  top: 20px;
  display: inline-block;
  border-radius: 6px;
}

.cardIconTitleDescLeft .cardIconTitleDesc {
  text-align: left;
  padding: 40px 40px 10px 40px;
}
.cardIconTitleDescLeft .cardIconTitleDesc:hover {
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
  border-radius: 18px;
}

.list-how-2 {
  padding-top: 70px;
}
.list-how-2 li {
  position: relative;
  display: inline-block;
  padding-left: 70px;
  padding-bottom: 30px;
  cursor: pointer;
}
.list-how-2 li .number-circle {
  border-radius: 50%;
  background-color: #000000;
  color: #fff;
  width: 50px;
  height: 50px;
  display: inline-block;
  line-height: 50px;
  text-align: center;
  font-size: 20px;
  font-weight: 500;
  position: absolute;
  top: 0px;
  left: 0px;
}
.list-how-2 li .line-dashed {
  height: auto;
  width: 2px;
  background: url(../imgs/page/homepage3/dashed.png) repeat-y top center;
  position: absolute;
  top: 70px;
  left: 25px;
  bottom: 15px;
}
.list-how-2 li.slick-current .number-circle, .list-how-2 li.active .number-circle, .list-how-2 li:hover .number-circle {
  background-color: #E95440;
}
.list-how-2 li:last-child {
  margin-bottom: 0px;
}
.list-how-2 li:last-child .line-dashed {
  display: none;
}

.box-image-how {
  padding-left: 110px;
  position: relative;
  padding-top: 10px;
}
.box-image-how img {
  border-radius: 6px;
}

.bg-our-service-2 {
  background-color: #000000;
  background-image: url(../imgs/page/homepage3/bg-line.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.box-btn-play {
  position: absolute;
  top: 0px;
  bottom: 0px;
  margin: auto;
  left: 110px;
  right: 0px;
  height: 46px;
  text-align: center;
  justify-content: center;
  display: flex;
}
.box-btn-play .btn-white {
  border-radius: 6px;
  display: flex;
  padding: 11px 21px;
  align-items: center;
  justify-content: center;
}
.box-btn-play .btn-white:hover {
  background-color: #E95440;
}

.list-ticks li {
  font-size: 18px;
  line-height: 50px;
  font-weight: 500;
  color: #181A1F;
  padding: 0px 0px 0px 40px;
  position: relative;
}
.list-ticks li::before {
  content: "";
  height: 25px;
  width: 25px;
  background-color: #FDEEEC;
  border-radius: 50%;
  background-image: url(../imgs/page/homepage3/tick.svg);
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  top: 50%;
  left: 0px;
  transform: translateY(-50%);
}

.box-image-top {
  display: block;
}
.box-image-top img {
  border-radius: 6px;
}

.box-image-bottom {
  display: inline-block;
  width: 100%;
  margin-top: 20px;
}
.box-image-bottom img {
  vertical-align: top;
  margin-left: 30px;
  border-radius: 6px;
  margin-bottom: 30px;
}
.box-image-bottom img:first-child {
  margin-left: 0px;
}

.rates {
  margin-top: 10px;
}
.rates img {
  display: inline-block;
  margin-right: 7px;
}

.box-customers-say {
  padding-right: 100px;
}

.cardTestimonialsStyle2 .box-quote {
  margin-bottom: 30px;
}
.cardTestimonialsStyle2 .content-quote {
  font-size: 18px;
  line-height: 35px;
  font-weight: 500;
}

.box-pagination-testimonials-2 .firstNumber, .box-pagination-testimonials-2 .lastNumber {
  color: #181A1F;
}
.box-pagination-testimonials-2.box-pagination-testimonials .swiper-pagination.swiper-pagination-testimonials .swiper-pagination-bullet {
  background-color: #000000;
}

.fleet-style-3 .cardFleet .cardInfoBottom .passenger .icon-circle, .fleet-style-3 .cardFleet .cardInfoBottom .luggage .icon-circle {
  background-color: #F6F6F6;
}

.box-search-ride-style-3 {
  position: relative;
  bottom: auto;
  right: auto;
  max-width: 470px;
  margin: 0px;
  border-radius: 0px;
  background: no-repeat;
}
.box-search-ride-style-3 .box-form-search {
  display: inline-block;
  width: 100%;
}
.box-search-ride-style-3 .search-item {
  background-color: #ffffff;
  border-radius: 6px;
  margin-bottom: 10px;
  padding: 10px;
}
.box-search-ride-style-3 .search-item .search-icon .item-icon {
  background-color: #ffffff;
}
.box-search-ride-style-3 .search-button {
  padding: 0px;
  min-width: 100%;
  max-width: 100%;
  margin-top: 20px;
}
.box-search-ride-style-3 .search-button .btn-search {
  width: 100%;
  padding: 19px;
  border-radius: 6px;
  background-color: #000000;
}

.box-header-home4 {
  padding: 0px 60px;
}

.banner-home-4 {
  background-image: url(../imgs/page/homepage4/banner.png);
  background-position: bottom right;
  background-repeat: no-repeat;
}

.gallery-home-4 .box-image-1 {
  text-align: right;
  padding-right: 20px;
  max-width: 240px;
}
.gallery-home-4 .box-image-bottom img {
  margin-bottom: 20px;
  margin-left: 0px;
}

.list-ticks-style-2 li::before {
  background-image: url(../imgs/page/homepage4/tick.png);
}

.box-list-how-2 ul li.has-arrow {
  background-position: right 60px top 59%;
}

.bg-our-fleet-3 {
  background-color: #000000;
  background-image: url(../imgs/page/homepage4/pattern.png);
  background-repeat: no-repeat;
  background-position: bottom right;
  background-size: auto;
}

.box-button-download-white .btn.btn-download {
  background-color: #ffffff;
}
.box-button-download-white .btn.btn-download .inner-download .icon-download::before {
  background-color: #E5E5E5;
}
.box-button-download-white .btn.btn-download .inner-download .info-download span {
  color: #181A1F;
}

.box-padding-fleet {
  padding-top: 30px;
}

.link-grey {
  margin-top: 30px;
}
.link-grey li a {
  color: #181A1F;
  opacity: 0.2;
  font-weight: 500;
  font-size: 32px;
  line-height: 58px;
}
.link-grey li a:hover {
  opacity: 1;
}

.bg-our-fleet-2 {
  background-image: url(../imgs/page/homepage5/map.png);
  background-repeat: no-repeat;
  background-position: center right;
  background-size: contain;
}
.bg-our-fleet-2 .cardCities .cardInfo .cardTitle, .bg-our-fleet-2 .cardCities .cardInfo .cardDesc {
  color: #fff !important;
}
.bg-our-fleet-2 .cardCities .cardInfo .cardTitle:hover {
  color: #E95440 !important;
}

.footer-5 {
  background-image: none;
  padding-top: 90px;
}
.footer-5 .box-footer-top {
  margin-bottom: 36px;
}

.box-fleet-style-2 .box-swiper {
  width: calc(100% + 60px);
  margin-left: -30px;
}
.box-fleet-style-2 .box-swiper .swiper-container {
  padding-left: 30px;
  padding-right: 30px;
}

.latest-new-background .cardNews {
  overflow: hidden;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}
.latest-new-background .cardNews .cardImage img {
  border-radius: 0px;
}
.latest-new-background .cardInfo {
  padding: 0px 30px;
}
.latest-new-background .cardInfo .cardLink {
  display: none;
}

.box-testimonials-home5 {
  background-image: url(../imgs/page/homepage5/quote.png);
  background-repeat: no-repeat;
  background-position: center top;
}
.box-testimonials-home5 .cardTestimonialsStyle2 .content-quote {
  font-size: 32px;
  line-height: 55px;
  font-weight: 500;
  margin-bottom: 30px;
}
.box-testimonials-home5 .cardTestimonialsStyle2 .box-quote .box-author {
  justify-content: center;
  width: 100%;
}

.box-testimonials-770 {
  max-width: 770px;
  margin: auto;
  text-align: center;
}

.box-services-banner {
  position: absolute;
  bottom: 30px;
  z-index: 533;
  left: 0px;
  right: 0px;
}

.swiper-button-next-banner-2, .swiper-button-prev-banner-2 {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 1px solid #fff;
  line-height: 62px;
  text-align: center;
  display: inline-block;
  background-image: none;
  position: relative;
  left: auto;
  bottom: auto;
  right: auto;
  margin-top: 20px;
}

.swiper-button-next-banner-2 svg, .swiper-button-prev-banner-2 svg {
  height: 20px;
  color: #fff;
}

.swiper-button-next-banner-2:hover, .swiper-button-prev-banner-2:hover {
  border-color: #fff;
  background-color: #ffffff;
}
.swiper-button-next-banner-2:hover svg, .swiper-button-prev-banner-2:hover svg {
  color: #181A1F;
}

.box-pagination-button-2 {
  position: absolute;
  right: 0px;
  top: 25px;
  max-width: 85px;
  margin: 0px;
  left: auto;
  display: inline-block;
}

.banner-home5 {
  position: relative;
}
.banner-home5 .swiper-banner-1 .swiper-slide {
  padding-right: 100px;
}
.banner-home5 .box-banner-info {
  top: 30%;
}
.banner-home5 .box-cover-image::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  background-image: url(../imgs/page/homepage5/bg-banner.png);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 1;
  background-color: transparent;
  opacity: 1;
}
.banner-home5 .btn-border {
  border-radius: 16px;
}
.banner-home5 .box-banner-homepage-2 {
  z-index: 2;
}
.banner-home5 .box-banner-homepage-2 .box-cover-image {
  height: 1060px;
}

.header-homepage5.stick .header-top-main {
  display: none;
}

.accordion-style-2 .accordion-button:not(.collapsed)::after {
  background-image: none;
}
.accordion-style-2 .accordion-collapse {
  background: transparent;
}
.accordion-style-2 .accordion-button::after {
  background-image: none;
}
.accordion-style-2 .accordion-button {
  opacity: 1;
  padding-top: 15px;
  padding-bottom: 10px;
  background: transparent;
}
.accordion-style-2 .accordion-button.collapsed {
  opacity: 0.2;
}
.accordion-style-2.accordion .accordion-item {
  border-bottom: 0px;
}
.accordion-style-2.accordion .accordion-body {
  padding-bottom: 10px;
}

.latest-new-white {
  padding-top: 120px;
  padding-bottom: 90px;
}

.banner-homepage6 {
  position: relative;
}
.banner-homepage6 .container-fluid {
  padding: 0px;
}
.banner-homepage6 .container-fluid .row {
  margin: 0px;
}
.banner-homepage6 .container-fluid .row [class*=col-lg-] {
  padding: 0px;
}
.banner-homepage6 .list-logos li {
  display: inline-block;
  padding-right: 50px;
  width: auto;
  text-align: left;
}

.box-search-ride-3 {
  position: relative;
  bottom: auto;
  left: auto;
  right: auto;
  width: 100%;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}
.box-search-ride-3 .search-item .search-icon .item-icon {
  background-color: #FDEEEC;
}
.box-search-ride-3 .btn.btn-search {
  background-color: #E95440;
}
.box-search-ride-3 .btn.btn-search:hover {
  background-color: #000000;
}

.box-banner-homepage6-left {
  padding-left: 200px;
  padding-top: 150px;
  max-width: 955px;
}

.box-banner-homepage6-right {
  height: 100%;
  background-color: #F0F2F6;
  text-align: center;
  display: flex;
  width: 100%;
  align-items: flex-end;
  padding: 72px 105px 0px 105px;
}

.box-how-it-work .col-lg-4:last-child .cardNumberTitleDesc::before {
  display: none;
}

.block-padding-60 {
  padding-left: 0px;
  padding-right: 0px;
  position: relative;
}
.block-padding-60::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 60px;
  height: 100%;
  right: 0px;
  background-color: #FDEEEC;
  z-index: 1;
}
.block-padding-60 .container-sub {
  position: relative;
  z-index: 2;
}

.block-news-padding-60 {
  padding-left: 0px;
  padding-right: 0px;
  position: relative;
  padding-top: 0px;
  padding-bottom: 0px;
}
.block-news-padding-60::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 60px;
  height: 100%;
  right: 0px;
  background-color: #F0FBF7;
  z-index: 1;
}
.block-news-padding-60 .container-sub {
  position: relative;
  z-index: 2;
}

.box-our-services-full, .box-latest-news-full {
  padding: 120px 0px;
}

.box-reliability {
  position: relative;
  margin-top: 50px;
}
.box-reliability .container-sub {
  position: relative;
  padding-top: 65px;
  padding-bottom: 35px;
}
.box-reliability .container-sub .row {
  z-index: 2;
  position: relative;
}
.box-reliability .container-sub::before {
  content: "";
  position: absolute;
  width: 80%;
  z-index: 1;
  height: 100%;
  background-color: #F6F6F6;
  top: 0px;
  left: 10px;
}

.box-reliability-inner {
  padding-left: 80px;
}

.box-customers-images .image-customer {
  position: relative;
  margin-right: 20px;
  display: inline-block;
  width: 90px;
  opacity: 0.5;
}
.box-customers-images .image-customer.active {
  opacity: 1;
}
.box-customers-images .image-customer img {
  height: 90px;
  width: 90px;
  border-radius: 50%;
  display: block;
}
.box-customers-images .image-customer .customer-quote {
  position: absolute;
  bottom: -5px;
  right: -5px;
  height: 40px;
  width: 40px;
}
.box-customers-images .image-customer .customer-quote img {
  height: auto;
  width: auto;
}

.swiper-button-prev-small, .swiper-button-next-small {
  height: 40px;
  width: 40px;
  line-height: 40px;
  position: relative;
  margin-right: 10px;
}
.swiper-button-prev-small svg, .swiper-button-next-small svg {
  position: absolute;
  top: 13px;
  left: 0px;
  right: 0px;
  margin: auto;
  height: 13px;
}

.swiper-pagination-testimonials-fraction {
  position: absolute;
  top: 0px;
  left: 115px;
  text-align: left;
  padding-left: 0px;
  line-height: 40px;
}

.box-banner-homepage7-left {
  padding: 0px 0px 0px 0px;
  max-width: 470px;
  margin: 0px;
}

.box-banner-homepage7-right img {
  display: block;
}

.banner-homepage7 {
  background: url(../imgs/page/homepage7/map.png) no-repeat left center;
  background-size: auto 100%;
}

.box-number-banner {
  background-color: #000000;
  padding: 55px 55px 55px 85px;
  text-align: center;
  color: #fff;
}
.box-number-banner .number-1 {
  display: inline-block;
  padding-left: 83px;
}

.box-some-number {
  padding: 68px 60px;
  background-color: rgba(0, 0, 0, 0.9098039216);
}

.bg-enjoy .container-fluid {
  padding: 0px;
}
.bg-enjoy .container-fluid .row {
  margin: 0px;
}
.bg-enjoy .container-fluid .row .col-lg-5 {
  padding: 0px;
}

.bg-our-service-home-7 {
  position: relative;
  padding: 105px 0px 0px 0px;
  margin-top: 100px;
}
.bg-our-service-home-7 .box-pagination-fleet {
  margin-top: 0px;
}
.bg-our-service-home-7::before {
  content: "";
  height: 435px;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  background-color: #000000;
}
.bg-our-service-home-7 .container-sub {
  position: relative;
  z-index: 2;
}
.bg-our-service-home-7 .box-pagination-fleet {
  position: unset;
}
.bg-our-service-home-7 .box-pagination-fleet .swiper-button-next-fleet, .bg-our-service-home-7 .box-pagination-fleet .swiper-button-prev-fleet {
  position: absolute;
  top: 50%;
  left: -102px;
  z-index: 1234;
  background-color: #ffffff;
  margin-top: -48px;
  border-color: #fff;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}
.bg-our-service-home-7 .box-pagination-fleet .swiper-button-next-fleet {
  right: -102px;
  left: auto;
}

.bg-download-black {
  background-color: #000000;
}
.bg-download-black .btn.btn-download {
  background-color: rgba(255, 255, 255, 0.1843137255);
}

.box-make-your-trip {
  padding: 120px 0px;
  position: relative;
}
.box-make-your-trip .bg-right-trip {
  position: absolute;
  top: 0px;
  right: 0px;
  max-width: 45%;
  z-index: 1;
  height: 100%;
  width: 100%;
  background-image: url(../imgs/page/homepage7/bg-your-trip.png);
  background-position: top right;
  background-size: cover;
  background-repeat: no-repeat;
}

.list-features-trip li {
  display: flex;
  margin-bottom: 24px;
}
.list-features-trip li .feature-left {
  min-width: 56px;
  max-width: 56px;
  width: 100%;
  margin-right: 40px;
}
.list-features-trip li .feature-right {
  width: 100%;
}

.box-testimonials-homepage7 .box-customers-images {
  padding-top: 10px;
}

.box-testimonials-home8 {
  padding: 120px 0px 90px 0px;
}
.box-testimonials-home8 .box-customers-images {
  max-width: 370px;
}
.box-testimonials-home8 .box-customers-images img {
  border-radius: 6px;
  display: block;
}

.box-showcase-home8 {
  position: relative;
}

.box-slider-customers {
  padding: 50px 0px 50px 0px;
  position: relative;
  max-height: 945px;
  overflow: hidden;
}
.box-slider-customers .box-swiper {
  max-width: 100%;
}

.swiper-pagination.swiper-pagination-number .swiper-pagination-bullet {
  height: 40px;
  width: 40px;
  display: inline-block;
  margin: 5px 0px 5px 0px;
  border: 1px solid #181A1F;
  border-radius: 50%;
  background-color: #ffffff;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
}

.swiper-pagination.swiper-pagination-number .swiper-pagination-bullet-active {
  background-color: #F6F6F6;
}

.swiper-pagination-number {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 60px;
  width: 40px;
  bottom: auto !important;
}

.box-our-fleet-home8 {
  padding: 120px 0px 120px 0px;
}
.box-our-fleet-home8 .fleet-style-3 .cardFleet {
  border: 1px solid #f2f2f2;
}
.box-our-fleet-home8 .fleet-style-3 .cardFleet:hover {
  border-color: #E5E5E5;
}
.box-our-fleet-home8 .fleet-style-3 .box-pagination-fleet {
  margin-top: 0px;
  position: unset;
}
.box-our-fleet-home8 .fleet-style-3 .box-pagination-fleet .swiper-button-prev-fleet {
  position: absolute;
  top: 50%;
  left: -102px;
  transform: translateY(-50%);
}
.box-our-fleet-home8 .fleet-style-3 .box-pagination-fleet .swiper-button-next-fleet {
  position: absolute;
  top: 50%;
  right: -102px;
  transform: translateY(-50%);
}

.box-makeyourtrip-home8 {
  background-color: #FDEEEC;
  padding: 120px 0px;
}
.box-makeyourtrip-home8 .cardIconTitleDescLeft .cardIconTitleDesc {
  background-color: #ffffff;
  border-radius: 6px;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}

.box-how-it-works-home8 {
  background-image: url(../imgs/page/homepage8/map.png);
  background-position: left bottom;
  background-repeat: no-repeat;
  padding: 120px 0px;
}
.box-how-it-works-home8 .list-how li:last-child {
  padding-bottom: 0px;
}

.banner-home8 {
  position: relative;
}

.box-search-ride-style-4 {
  position: relative;
  top: auto;
  left: auto;
  bottom: auto;
  right: auto;
}
.box-search-ride-style-4 .box-search-tabs {
  position: relative;
  top: auto;
  left: auto;
  bottom: auto;
  right: auto;
}

.box-banner-homepage-8 .box-cover-image {
  padding: 109px 0px;
}
.box-banner-homepage-8 .box-cover-image .container-sub {
  position: relative;
  z-index: 2;
}
.box-banner-homepage-8 .box-search-ride-style-4 .box-form-search .btn-search {
  background-color: #000000;
  color: #fff;
}
.box-banner-homepage-8 .box-search-ride-style-4 .box-form-search .btn-search:hover {
  background-color: #E95440;
  color: #fff;
}

.footer-8 {
  background-color: #ffffff;
  padding-top: 0px;
}
.footer-8 .footer-box-inner {
  background-color: #ffffff;
  padding-top: 0px;
}
.footer-8 .footer-box-inner .address-footer {
  background-image: url(../imgs/page/homepage8/address.png);
}
.footer-8 .footer-box-inner .time-footer {
  background-image: url(../imgs/page/homepage8/time.png);
}
.footer-8 .footer-box-inner .call-footer {
  background-image: url(../imgs/page/homepage8/call.png);
}
.footer-8 .footer-bottom {
  border-top: 1px solid #E5E5E5;
}
.footer-8 .menu-footer li a {
  color: #181A1F;
}
.footer-8 .menu-footer li a:hover {
  color: #06D6A0;
}
.footer-8 .menu-bottom li a {
  color: #181A1F;
}
.footer-8 .menu-bottom li a:hover {
  color: #06D6A0;
}
.footer-8 .btn.btn-link-location {
  background-image: url(../imgs/page/homepage8/address.png);
}
.footer-8 .btn.btn-link-globe {
  background-image: url(../imgs/page/homepage8/globe.png);
}
.footer-8 .btn.btn-link-location, .footer-8 .btn.btn-link-globe {
  color: #181A1F;
}
.footer-8 .btn.btn-link-location:hover, .footer-8 .btn.btn-link-globe:hover {
  background-color: #FDEEEC;
}

.color-text-2 {
  color: rgba(24, 26, 31, 0.5137254902);
}

.box-info-slide-custmer {
  padding-left: 120px;
  max-width: 590px;
}

.box-swiper .swiper-group-1-number .swiper-slide {
  max-height: 945px;
}
.box-swiper .swiper-group-1-number .swiper-container {
  height: auto;
}

.box-intercity-home8 {
  padding: 120px 0px 0px 0px;
}

.box-testimonials-home8 .box-pagination-fleet {
  margin-top: 30px;
}

.box-comfortable-home9 {
  padding: 0px 60px;
  position: relative;
}

.box-comfortable-home9-inner {
  border-radius: 6px;
  padding-top: 120px;
  padding-bottom: 120px;
  position: relative;
}

.bg-our-service-home-9 {
  padding-top: 120px;
  padding-bottom: 120px;
}

.latest-new-home9 {
  padding: 0px 60px;
}
.latest-new-home9 .color-text {
  color: #fff !important;
}

.banner-home9 {
  padding-left: 60px;
  padding-right: 60px;
}
.banner-home9 .box-pagination-button {
  top: auto;
  bottom: 30px;
}

.box-search-ride-5 {
  max-width: 1366px;
  background-color: #000000;
  border-radius: 0 0 6px 6px;
  top: 0px;
  bottom: auto;
}
.box-search-ride-5 .search-item .search-inputs .search-input {
  color: #fff;
}
.box-search-ride-5 .color-grey {
  color: #E5E5E5;
}
.box-search-ride-5 .search-item .search-icon .item-icon {
  background-color: rgba(255, 255, 255, 0.2039215686);
}
.box-search-ride-5 .search-item .search-icon .item-icon.icon-date {
  background-image: url(../imgs/page/homepage9/planning.png);
}
.box-search-ride-5 .search-item .search-icon .item-icon.icon-time {
  background-image: url(../imgs/page/homepage9/clock.png);
}
.box-search-ride-5 .search-item .search-icon .item-icon.icon-from {
  background-image: url(../imgs/page/homepage9/from.png);
}
.box-search-ride-5 .search-item .search-icon .item-icon.icon-to {
  background-image: url(../imgs/page/homepage9/to.png);
}
.box-search-ride-5 .btn-search {
  border-radius: 6px;
  background-color: #E95440;
}
.box-search-ride-5 .btn-search:hover {
  background-color: #181A1F;
}

.swiper-pagination-banner-2 .swiper-pagination-bullet {
  height: 4px;
  width: 12px;
  background-color: #ffffff;
  border-radius: 6px;
  margin: 0px 5px;
}

.swiper-pagination-banner-2 .swiper-pagination-bullet-active {
  width: 24px;
}

.box-pdrl-60, .footer-7 {
  padding: 0px 60px;
  position: relative;
}

.footer.footer-7 {
  background-color: #ffffff;
  padding-top: 0px;
}
.footer.footer-7 .menu-footer li {
  margin-bottom: 5px;
}

.footer-box-inner {
  background-color: #000000;
  padding-top: 60px;
}

.bg-download-home9 {
  background-image: none;
}

.color-white-2 {
  color: rgba(255, 255, 255, 0.6);
}

.address-footer {
  display: block;
  padding: 0px 0px 5px 30px;
  background: url(../imgs/page/homepage9/address.png) no-repeat left top 5px;
}

.time-footer {
  display: block;
  padding: 0px 0px 5px 30px;
  background: url(../imgs/page/homepage9/time.png) no-repeat left top 5px;
}

.call-footer {
  display: block;
  padding: 0px 0px 5px 30px;
  background: url(../imgs/page/homepage9/call.png) no-repeat left top 5px;
}

.box-number-servered {
  position: absolute;
  bottom: -70px;
  right: -80px;
}

.box-number-servered .box-number-info {
  border: 0px;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}

.cardIconTitleDescLeftStyle2 .cardIconTitleDesc {
  text-align: left;
}

.banner-home10 .box-cover-image::before {
  opacity: 0.5;
}
.banner-home10 .box-banner-info {
  transform: translateY(-50%);
  top: 50%;
}

.btn-play-big {
  display: inline-block;
  height: 90px;
  width: 90px;
  background: url(../imgs/page/homepage10/play.png) no-repeat center;
  background-size: contain;
}

.box-search-ride-style-6 {
  background-color: transparent;
  border-radius: 0px;
  bottom: -70px;
  max-width: 1150px;
}
.box-search-ride-style-6 .tab-content {
  background-color: #ffffff;
  border-radius: 0px 6px 6px 6px;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
  padding: 20px 30px;
}
.box-search-ride-style-6 .tab-content .box-form-search {
  display: flex;
  margin-bottom: 0px;
  margin-left: -10px;
  margin-right: -10px;
}
.box-search-ride-style-6 .search-item {
  margin-right: 15px;
  border: 1px solid #E5E5E5;
  padding-left: 0px;
  border-radius: 6px;
}
.box-search-ride-style-6 .search-item:last-child {
  margin-right: 0px;
}
.box-search-ride-style-6 .search-item .search-icon {
  margin-right: 5px;
}
.box-search-ride-style-6 .search-item .search-icon .item-icon {
  background-color: transparent;
}
.box-search-ride-style-6 .search-item.search-button {
  padding: 0px;
  min-width: 150px;
  max-width: 150px;
  border: 0px;
}
.box-search-ride-style-6 .box-search-tabs {
  width: 100%;
}
.box-search-ride-style-6 .btn-search {
  border-radius: 6px;
  width: 100%;
  background-color: #E95440;
}
.box-search-ride-style-6 .nav-tabs-search {
  border-bottom: 0px;
}
.box-search-ride-style-6 .nav-tabs-search li {
  padding: 0px;
  float: left;
}
.box-search-ride-style-6 .nav-tabs-search li a {
  padding: 16px 30px;
  background-color: #FDEEEC;
}
.box-search-ride-style-6 .nav-tabs-search li a:hover, .box-search-ride-style-6 .nav-tabs-search li a.active {
  background-color: #ffffff;
}
.box-search-ride-style-6 .nav-tabs-search li a:hover::before, .box-search-ride-style-6 .nav-tabs-search li a.active::before {
  display: none;
}
.box-search-ride-style-6 .nav-tabs-search li:first-child a {
  border-radius: 6px 0px 0px 0px;
}
.box-search-ride-style-6 .nav-tabs-search li:last-child a {
  border-radius: 0px 6px 0px 0px;
}

.fleet-style-2 .cardFleet:hover {
  background-color: #FDEEEC;
}
.fleet-style-2 .swiper-button-next-fleet:hover, .fleet-style-2 .swiper-button-prev-fleet:hover {
  background-color: #FDEEEC;
}

.bg-how-it-works-home10 {
  position: relative;
  background: url(../imgs/page/homepage10/map.png) no-repeat right bottom;
}
.bg-how-it-works-home10::before {
  display: none;
}
.bg-how-it-works-home10 .list-how li::before, .bg-how-it-works-home10 .list-how.slider-nav-thumbnails .slick-list .slick-track li::before {
  border-color: #181A1F;
}
.bg-how-it-works-home10 .list-how li:after, .bg-how-it-works-home10 .list-how.slider-nav-thumbnails .slick-list .slick-track li:after {
  background-color: #181A1F;
}
.bg-how-it-works-home10 .list-how li a, .bg-how-it-works-home10 .list-how.slider-nav-thumbnails .slick-list .slick-track li a {
  color: #181A1F;
}
.bg-how-it-works-home10 .list-how li .line-white, .bg-how-it-works-home10 .list-how.slider-nav-thumbnails .slick-list .slick-track li .line-white {
  background-color: #181A1F;
}
.bg-how-it-works-home10 .list-how li h4, .bg-how-it-works-home10 .list-how.slider-nav-thumbnails .slick-list .slick-track li h4, .bg-how-it-works-home10 .list-how li p, .bg-how-it-works-home10 .list-how.slider-nav-thumbnails .slick-list .slick-track li p {
  color: #181A1F;
}

.box-showcase-home10 .bg-showcase {
  background-color: #000000;
  background-image: url(../imgs/page/homepage10/line.png);
  background-position: top right;
  background-repeat: no-repeat;
  border-radius: 0px;
  background-size: cover;
}

.box-reliability-home10 {
  background: url(../imgs/page/homepage10/img-reliability.png) no-repeat top center;
  background-size: cover;
  padding: 160px 0px;
  text-align: right;
}

.box-info-reliability {
  background-color: #ffffff;
  padding: 50px;
  max-width: 370px;
  text-align: left;
  display: inline-block;
  border-radius: 6px;
}

.bg-our-service-home-10 {
  margin: 90px 0px 120px 0px;
}
.bg-our-service-home-10 .box-pagination-fleet {
  margin-top: 30px;
}

.swiper-services-auto .swiper-slide {
  max-width: 1170px;
}

.footer.footer-10 {
  background-image: none;
}
.footer.footer-10 .footer-2 {
  background-color: rgba(255, 255, 255, 0.0823529412);
}
.footer.footer-10 .footer-2 .footer-bottom {
  border-top: 0px;
}

.bg-region-home10 {
  padding-top: 120px;
  padding-bottom: 120px;
}

.dropdown-menu-box {
  display: inline-block;
}
.dropdown-menu-box .dropdown-toggle::after {
  display: none;
}
.dropdown-menu-box .dropdown-toggle {
  padding: 10px 25px 10px 20px;
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  background: url(../imgs/template/icons/angle-down-black.svg) no-repeat right center;
}
.dropdown-menu-box .dropdown-menu {
  border: #E5E5E5 1px solid;
}
.dropdown-menu-box .dropdown-menu .dropdown-item {
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  color: #181A1F;
}
.dropdown-menu-box .dropdown-menu .dropdown-item:hover {
  background-color: #F0FBF7;
}

.our-fleet-2 .cardFleet .cardInfoBottom .passenger {
  position: relative;
  min-width: 170px;
  max-width: 170px;
}
.our-fleet-2 .cardFleet .cardInfoBottom .luggage {
  justify-content: flex-start;
}
.our-fleet-2 .cardFleetStyle3 .cardInfoBottom .passenger {
  min-width: 70px;
  max-width: 70px;
}

.fleet-style-5 .cardFleet:hover {
  border-color: #000000;
  background-color: #ffffff;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}

.fleet-style-3 .cardFleet {
  border: 0px;
}
.fleet-style-3 .cardFleet:hover {
  background-color: #ffffff;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
}

.passengers-info {
  display: inline-block;
  padding: 0px 0px 0px 22px;
  background-image: url(../imgs/template/icons/friend.svg);
  background-position: left center;
  background-repeat: no-repeat;
}

.luggages-info {
  display: inline-block;
  padding: 0px 0px 0px 22px;
  background-image: url(../imgs/template/icons/luggage.svg);
  background-position: left center;
  background-repeat: no-repeat;
}

.box-vehicle-price {
  background-color: #F0FBF7;
  border-radius: 6px;
  padding: 15px 30px;
}

.list-prices {
  padding: 0px;
  margin: 0px;
  display: block;
  list-style: none;
}
.list-prices li {
  display: flex;
  justify-content: space-between;
  width: 100%;
  border-bottom: 1px solid #E5E5E5;
  padding: 15px 0px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
  color: #181A1F;
}
.list-prices li span.text {
  width: 100%;
}
.list-prices li span.price {
  min-width: 42px;
  max-width: 42px;
  width: 100%;
}
.list-prices li:last-child {
  border-bottom: 0px;
  padding-bottom: 0px;
}

.mw-100 {
  max-width: 100% !important;
}

.text-conditions {
  font-size: 14px;
  line-height: 18px;
  color: #181A1F;
  font-weight: 400;
  padding: 0px 0px 0px 20px;
  display: inline-block;
}
.text-conditions.icon-meet {
  background-image: url(../imgs/page/fleet/meet.png);
  background-position: left center;
  background-repeat: no-repeat;
}
.text-conditions.icon-free-cancel {
  background-image: url(../imgs/page/fleet/free-cancel.png);
  background-position: left center;
  background-repeat: no-repeat;
}
.text-conditions.icon-free-wait {
  background-image: url(../imgs/page/fleet/free-wait.png);
  background-position: left center;
  background-repeat: no-repeat;
}
.text-conditions.icon-safe {
  background-image: url(../imgs/page/fleet/safe.png);
  background-position: left center;
  background-repeat: no-repeat;
}

.banner-image-service {
  position: relative;
  background-image: url(../imgs/page/services/banner.png);
  background-position: top left;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 500px;
  height: 500px;
}

.box-form-service-single {
  position: relative;
}
.box-form-service-single .box-search-ride-style-2 .box-search-tabs {
  bottom: 80px;
  position: absolute;
  max-width: 370px;
  right: 10px;
}

.box-info-left {
  padding-right: 50px;
}

.box-info-right {
  padding-left: 50px;
}

.icon-quote.bg-secondary {
  background-image: url(../imgs/page/about/quote.png);
}

.box-pagination-testimonials.swiper-pagination-grey .swiper-pagination .swiper-pagination-bullet {
  background-color: #181A1F;
}
.box-pagination-testimonials.swiper-pagination-grey .swiper-pagination .swiper-pagination-bullet-active {
  background-color: #000000;
}
.box-pagination-testimonials.swiper-pagination-grey .firstNumber, .box-pagination-testimonials.swiper-pagination-grey .lastNumber {
  color: #181A1F;
}

.list-the-trip li {
  display: flex;
  width: 100%;
  margin-bottom: 30px;
}
.list-the-trip li .cardImage {
  min-width: 80px;
  max-width: 80px;
  width: 100%;
  margin-right: 20px;
}
.list-the-trip li .cardInfo {
  width: 100%;
}

.box-the-trip {
  padding: 120px 0px 90px 0px;
  max-width: 540px;
}

.bg-your-trip {
  position: relative;
}

.box-the-trip-right {
  max-width: 45%;
  width: 100%;
  background: url(../imgs/page/about/bg-trip.png) no-repeat top right;
  background-size: cover;
  position: absolute;
  top: 0px;
  right: 0px;
  height: 100%;
}

.banner-about {
  position: relative;
}

.padding-box {
  padding: 60px 0px;
}

.box-banner-right {
  position: absolute;
  bottom: -50px;
  right: 0px;
  overflow: hidden;
  max-width: 55%;
  top: 0px;
  width: 100%;
  height: calc(100% + 50px);
  background: url(../imgs/page/about/banner2.png) no-repeat top center;
  background-size: cover;
}

.mw-770 {
  max-width: 770px;
  margin: auto;
}

.form-contact-2 .form-contact {
  max-width: 520px;
}

.box-offices {
  padding-left: 50px;
}

.box-offices .cardContact .cardImage img {
  max-height: 60px;
}
.box-offices .cardContact .mb-30 {
  margin-bottom: 20px !important;
}

.list-contact-infos {
  display: block;
  width: 100%;
}
.list-contact-infos li {
  display: flex;
  margin-bottom: 60px;
}
.list-contact-infos li .contact-icon {
  min-width: 62px;
  margin-right: 40px;
}
.list-contact-infos li .contact-info {
  width: 100%;
}

.box-banner-contact-2 {
  max-width: 50%;
  top: 70px;
  height: auto;
}

.map-contact {
  width: 100%;
  height: 700px;
}

.box-banner-contact-2 iframe {
  height: 100%;
  width: 100%;
}

.content-team-single {
  max-width: 670px;
}
.content-team-single .tab-content {
  padding: 30px 0px;
}
.content-team-single .tab-content p {
  margin-bottom: 30px;
  font-size: 16px;
  line-height: 28px;
  color: #181A1F;
}

.list-tabs-team {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #E5E5E5;
}
.list-tabs-team li a {
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  color: #626262;
  display: inline-block;
  padding-bottom: 10px;
  border-bottom: 2px solid #fff;
}
.list-tabs-team li a.active, .list-tabs-team li a:hover {
  color: #181A1F;
  border-bottom: 2px solid #181A1F;
}

.list-experiences li {
  position: relative;
}
.list-experiences li .card-experiences .card-experience-circle {
  position: relative;
}
.list-experiences li .card-experiences .card-experience-circle::before {
  content: "";
  position: absolute;
  top: 40px;
  left: 0px;
  right: 0px;
  width: 1px;
  bottom: 10px;
  margin: auto;
  background: url(../imgs/page/team-single/dashed.png);
}
.list-experiences li:last-child .card-experiences .card-experience-circle::before {
  display: none;
}

.box-user-info {
  padding: 20px;
  background: #ffffff;
  box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.05);
  position: absolute;
  max-width: 370px;
  top: -240px;
  border-radius: 6px;
}
.box-user-info .image-user {
  margin-bottom: 20px;
}
.box-user-info .image-user img {
  border-radius: 6px;
  display: block;
}
.box-user-info .list-info-user li {
  display: flex;
  width: 100%;
  justify-content: space-between;
  padding: 0px 0px 10px 0px;
  border-bottom: 1px solid #E5E5E5;
  margin-bottom: 10px;
}
.box-user-info .list-info-user li .label-left {
  min-width: 65px;
}
.box-user-info .list-info-user li .text-info-right {
  width: auto;
}
.box-user-info .list-info-user li:last-child {
  border-bottom: 0px;
}
.box-user-info .icon-socials {
  height: 20px;
  width: 20px;
}
.box-user-info .icon-socials.icon-facebook {
  background: url(../imgs/template/icons/fb-black.png) no-repeat center;
}
.box-user-info .icon-socials.icon-twitter {
  background: url(../imgs/template/icons/tw-black.png) no-repeat center;
}
.box-user-info .icon-socials.icon-instagram {
  background: url(../imgs/template/icons/instagram-black.png) no-repeat center;
}
.box-user-info .icon-socials.icon-linkedin {
  background: url(../imgs/template/icons/linkedin-black.png) no-repeat center;
}
.box-user-info .box-button-send {
  margin-top: 10px;
}
.box-user-info .box-button-send .btn {
  width: 100%;
}

.text-billed {
  font-weight: 400;
  font-family: "Noto Sans", sans-serif;
  font-size: 16px;
  line-height: 28px;
  display: inline-block;
  vertical-align: middle;
  color: #fff;
}

.switch {
  position: relative;
  display: inline-block;
  width: 55px;
  height: 30px;
  vertical-align: middle;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #F0F2F6;
  transition: 0.4s;
}

.slider.round {
  border-radius: 34px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 24px;
  width: 24px;
  left: 3px;
  bottom: 3px;
  background-color: #fff;
  transition: 0.4s;
}

.slider.round:before {
  border-radius: 50%;
}

input:checked + .slider {
  background-color: #FFE7BB;
}

input:checked + .slider:before {
  transform: translateX(25px);
}

.box-bill-switch {
  align-items: center;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.list-ticks-plan {
  display: flex;
  flex-wrap: wrap;
}
.list-ticks-plan li {
  width: 100%;
  color: #181A1F;
  font-size: 14px;
  line-height: 18px;
  margin-bottom: 21px;
}
.list-ticks-plan li svg {
  color: #000000;
  height: 20px;
  margin-right: 10px;
}

.for-month, .for-year {
  display: none;
}

.display-month, .display-year {
  display: block;
}

.box-login {
  max-width: 369px;
  margin: auto;
}

.cb-rememberme {
  float: left;
  margin: 5px 9px 0px 0px;
}

.text-or-box {
  position: relative;
  text-align: center;
  margin: 35px 0px;
}
.text-or-box::before {
  content: "";
  height: 1px;
  width: 100%;
  background-color: #E5E5E5;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1;
  bottom: 0px;
  margin: auto;
}
.text-or-box .text-or {
  display: inline-block;
  padding: 5px 10px;
  background-color: #ffffff;
  color: #181A1F;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  position: relative;
  z-index: 2;
}

.box-comingsoon {
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  background: url(../imgs/page/comingsoon/banner.png) no-repeat top center;
  background-size: cover;
}
.box-comingsoon::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  z-index: 1;
  background: url(../imgs/page/our-team/bg-trans.png) repeat top center;
}
.box-comingsoon .inner-comingsoon {
  max-width: 790px;
  margin: auto;
  text-align: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0px;
  right: 0px;
  z-index: 3;
  padding: 0px 20px;
}

.box-subscriber {
  position: relative;
  max-width: 540px;
  margin: auto;
}
.box-subscriber .inner-box-subscriber {
  background-color: #ffffff;
  border-radius: 12px;
  position: relative;
}
.box-subscriber .btn-subscriber {
  background-color: #ffffff;
  padding: 0px 18px;
  height: 100%;
  max-width: 123px;
  width: 100%;
  position: absolute;
  top: 0px;
  right: -1px;
  z-index: 2;
  color: #181A1F;
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  border-radius: 0px 12px 12px 0px;
}
.box-subscriber .btn-subscriber:hover {
  background-color: #181818;
  color: #fff;
}
.box-subscriber .form-control {
  color: #181A1F;
  font-size: 14px;
  line-height: 24px;
  height: 70px;
  width: 100%;
  border-radius: 12px;
}

.box-invoice-block {
  padding: 0px 20px;
}

.box-invoice {
  background-color: #ffffff;
  box-shadow: 0px 0px 35px rgba(181, 181, 195, 0.15);
  border-radius: 6px;
  position: relative;
  max-width: 1170px;
  margin: auto;
  margin-top: 145px;
  margin-bottom: 100px;
}

.inner-invoice {
  padding: 130px 100px 0px 100px;
}

.invoice-top {
  margin: 0px -10px;
}

.invoice-left {
  width: 100%;
  padding: 0px 10px;
}

.invoice-right {
  width: 100%;
  padding: 0px 10px;
  max-width: 350px;
}

.bottom-invoice {
  padding: 48px 0px 44px 0px;
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  border-top: 1px solid #E5E5E5;
  margin-top: 100px;
}
.bottom-invoice a {
  display: inline-block;
  padding: 0px 30px;
}

.table-invoice thead th {
  background-color: #F0FBF7;
  padding: 21px 41px;
  font-size: 18px;
  line-height: 28px;
  font-weight: 500;
}
.table-invoice tbody tr td {
  font-size: 14px;
  line-height: 18px;
  font-weight: 400;
  color: #181A1F;
  padding: 23px 41px;
  border-bottom: 1px solid #E5E5E5;
}
.table-invoice tbody tr:last-child td {
  border-bottom: 0px;
}

.box-booking-tabs {
  display: flex;
  margin: 0px -15px;
}
.box-booking-tabs .item-tab {
  width: 25%;
  padding: 0px 15px;
}
.box-booking-tabs .item-tab .box-tab-step {
  width: 100%;
  padding: 30px 0px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px solid #E5E5E5;
  cursor: pointer;
}
.box-booking-tabs .item-tab .box-tab-step .icon-tab {
  display: flex;
  align-items: center;
}
.box-booking-tabs .item-tab .box-tab-step .icon-tab .icon-book {
  display: inline-block;
  height: 60px;
  width: 60px;
  margin-right: 20px;
  background-color: #F0FBF7;
  border-radius: 50%;
  text-align: center;
  line-height: 60px;
}
.box-booking-tabs .item-tab .box-tab-step .icon-tab .icon-book.icon-vehicle {
  background-image: url(../imgs/page/booking/vehicle.svg);
  background-position: center;
  background-repeat: no-repeat;
}
.box-booking-tabs .item-tab .box-tab-step .icon-tab .icon-book.icon-extra {
  background-image: url(../imgs/page/booking/extra.svg);
  background-position: center;
  background-repeat: no-repeat;
}
.box-booking-tabs .item-tab .box-tab-step .icon-tab .icon-book.icon-pax {
  background-image: url(../imgs/page/booking/pax.svg);
  background-position: center;
  background-repeat: no-repeat;
}
.box-booking-tabs .item-tab .box-tab-step .icon-tab .icon-book.icon-payment {
  background-image: url(../imgs/page/booking/payment.svg);
  background-position: center;
  background-repeat: no-repeat;
}
.box-booking-tabs .item-tab .box-tab-step .icon-tab .text-tab {
  font-size: 18px;
  line-height: 28px;
  color: #181A1F;
  font-weight: 500;
}
.box-booking-tabs .item-tab .box-tab-step.active, .box-booking-tabs .item-tab .box-tab-step:hover {
  border-bottom-color: #181A1F;
}
.box-booking-tabs .item-tab .box-tab-step.active .icon-tab .icon-book, .box-booking-tabs .item-tab .box-tab-step:hover .icon-tab .icon-book {
  background-color: #181A1F;
}
.box-booking-tabs .item-tab .box-tab-step.active .icon-tab .icon-book.icon-vehicle, .box-booking-tabs .item-tab .box-tab-step:hover .icon-tab .icon-book.icon-vehicle {
  background-image: url(../imgs/page/booking/vehicle-hover.svg);
  background-position: center;
  background-repeat: no-repeat;
}
.box-booking-tabs .item-tab .box-tab-step.active .icon-tab .icon-book.icon-extra, .box-booking-tabs .item-tab .box-tab-step:hover .icon-tab .icon-book.icon-extra {
  background-image: url(../imgs/page/booking/extra-hover.svg);
  background-position: center;
  background-repeat: no-repeat;
}
.box-booking-tabs .item-tab .box-tab-step.active .icon-tab .icon-book.icon-pax, .box-booking-tabs .item-tab .box-tab-step:hover .icon-tab .icon-book.icon-pax {
  background-image: url(../imgs/page/booking/pax-hover.svg);
  background-position: center;
  background-repeat: no-repeat;
}
.box-booking-tabs .item-tab .box-tab-step.active .icon-tab .icon-book.icon-payment, .box-booking-tabs .item-tab .box-tab-step:hover .icon-tab .icon-book.icon-payment {
  background-image: url(../imgs/page/booking/payment-hover.svg);
  background-position: center;
  background-repeat: no-repeat;
}
.box-booking-tabs .item-tab .box-tab-step .number-tab span {
  font-weight: 500;
  font-size: 30px;
  line-height: 58px;
  color: #181A1F;
}

.box-row-tab {
  display: flex;
  flex-wrap: wrap;
  margin: 0px -10px;
}
.box-row-tab .box-tab-left {
  padding: 0px 10px;
  width: 71%;
}
.box-row-tab .box-tab-right {
  padding: 0px 10px;
  width: 29%;
}

.sidebar {
  padding: 30px;
  border-radius: 6px;
  width: 100%;
  border: 1px solid #E5E5E5;
  margin-bottom: 30px;
}

.list-routes li {
  display: flex;
  width: 100%;
  align-items: center;
  position: relative;
  padding-bottom: 50px;
}
.list-routes li .location-item {
  width: 36px;
  height: 40px;
  background: url(../imgs/page/booking/location.png) no-repeat center;
  margin-right: 25px;
  color: #fff;
  line-height: 35px;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
  display: inline-block;
}
.list-routes li .info-location {
  position: relative;
}
.list-routes li::before {
  content: "";
  position: absolute;
  top: 50px;
  left: 17px;
  height: 30px;
  width: 2px;
  background: url(../imgs/page/booking/dotted.png) no-repeat center;
}
.list-routes li:last-child {
  padding-bottom: 0px;
}
.list-routes li:last-child::before {
  display: none;
}

.list-icons {
  padding: 20px 0px 0px 0px;
}
.list-icons li {
  display: flex;
  width: 100%;
  align-items: center;
  position: relative;
  padding-bottom: 20px;
}
.list-icons li .icon-item {
  width: 40px;
  height: 40px;
  background-color: #E95440;
  margin-right: 25px;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
  display: inline-block;
  border-radius: 50%;
}
.list-icons li .icon-item.icon-plan {
  background-image: url(../imgs/page/booking/plan.png);
  background-repeat: no-repeat;
  background-position: center top 10px;
}
.list-icons li .icon-item.icon-time {
  background-image: url(../imgs/page/booking/time.png);
  background-repeat: no-repeat;
  background-position: center;
}
.list-icons li .info-location {
  position: relative;
}
.list-icons li:last-child {
  padding-bottom: 0px;
}

.box-map-route {
  width: 100%;
  height: 200px;
  margin-top: 30px;
  margin-bottom: 25px;
  border-radius: 6px;
  overflow: hidden;
}
.box-map-route iframe {
  width: 100%;
  height: 100%;
}

.box-info-route {
  display: flex;
  justify-content: space-between;
}
.box-info-route .info-route-left {
  position: relative;
}
.box-info-route .info-route-left span {
  display: block;
}
.box-info-route .info-route-right {
  padding-left: 20px;
}
.box-info-route .info-route-right span {
  display: block;
}

.list-ticks-small-booking li {
  padding-left: 35px;
}
.list-ticks-small-booking li::before {
  background-image: url(../imgs/page/booking/tick.png);
  background-position: center;
  background-repeat: no-repeat;
}
.list-ticks-small-booking li:last-child {
  margin-bottom: 0px !important;
}

.list-vehicles {
  position: relative;
}

.item-vehicle {
  border: 1px solid #E5E5E5;
  border-radius: 6px;
  padding: 15px 20px;
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}
.item-vehicle:hover {
  background-color: #F0FBF7;
}
.item-vehicle:hover .btn-primary {
  background-color: #E95440;
  color: #fff;
}
.item-vehicle:hover .btn-primary svg {
  color: #fff;
}
.item-vehicle .vehicle-left {
  padding: 0px 10px;
  position: relative;
  width: 67%;
  border-right: 1px solid #E5E5E5;
  margin-right: 20px;
}
.item-vehicle .vehicle-left .vehicle-image {
  margin-bottom: 15px;
  width: 100%;
  text-align: center;
}
.item-vehicle .vehicle-left .vehicle-image img {
  display: block;
}
.item-vehicle .vehicle-left .vehicle-facilities {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0px -10px;
}
.item-vehicle .vehicle-left .vehicle-facilities .text-fact {
  font-size: 14px;
  line-height: 35px;
  color: #181A1F;
  display: inline-block;
  padding: 0px 10px 0px 25px;
  width: 50%;
}
.item-vehicle .vehicle-left .vehicle-facilities .text-fact.meet-greeting {
  background-image: url(../imgs/page/booking/meet.svg);
  background-position: left center;
  background-repeat: no-repeat;
}
.item-vehicle .vehicle-left .vehicle-facilities .text-fact.free-cancel {
  background-image: url(../imgs/page/booking/cancel.svg);
  background-position: left center;
  background-repeat: no-repeat;
}
.item-vehicle .vehicle-left .vehicle-facilities .text-fact.free-waiting {
  background-image: url(../imgs/page/booking/free-time.svg);
  background-position: left center;
  background-repeat: no-repeat;
}
.item-vehicle .vehicle-left .vehicle-facilities .text-fact.safe-travel {
  background-image: url(../imgs/page/booking/safe.svg);
  background-position: left center;
  background-repeat: no-repeat;
}
.item-vehicle .vehicle-left .link {
  text-decoration: underline;
}
.item-vehicle .vehicle-left .link:hover {
  color: #E95440;
}
.item-vehicle .vehicle-right {
  width: 33%;
  padding: 0px 10px;
  position: relative;
}
.item-vehicle .vehicle-right .vehicle-passenger-luggage {
  display: flex;
  justify-content: space-between;
}
.item-vehicle .vehicle-right .vehicle-passenger-luggage .passenger {
  display: inline-block;
  padding: 0px 0px 0px 18px;
  background-image: url(../imgs/page/booking/passenger.svg);
  background-position: left center;
  background-repeat: no-repeat;
}
.item-vehicle .vehicle-right .vehicle-passenger-luggage .luggage {
  display: inline-block;
  padding: 0px 0px 0px 18px;
  background-image: url(../imgs/page/booking/luggage.svg);
  background-position: left center;
  background-repeat: no-repeat;
}

.list-extras {
  position: relative;
}
.list-extras .item-extra {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 30px;
  margin-bottom: 30px;
  border-bottom: 1px solid #E5E5E5;
}
.list-extras .item-extra .extra-info span.price {
  font-size: 14px;
  line-height: 24px;
  background-color: #E95440;
  display: inline-block;
  padding: 3px 14px;
  border-radius: 40px;
  color: #fff;
  vertical-align: middle;
  margin-left: 10px;
}
.list-extras .item-extra .extra-quantity {
  position: relative;
  max-width: 130px;
  width: 100%;
  min-width: 130px;
}
.list-extras .item-extra .extra-quantity span.minus {
  position: absolute;
  left: 0px;
  top: 0px;
  height: 40px;
  width: 40px;
  border: 1px solid #E5E5E5;
  border-radius: 50%;
  background: #ffffff url(../imgs/page/booking/minus.svg) no-repeat center;
  cursor: pointer;
}
.list-extras .item-extra .extra-quantity span.minus:hover {
  border-color: #181A1F;
  background-color: #F6F6F6;
}
.list-extras .item-extra .extra-quantity input.form-control {
  border: 0px;
  width: 100%;
  text-align: center;
  padding: 0px;
  height: 40px;
  color: #181A1F;
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
  background-color: #ffffff;
  min-height: 40px;
}
.list-extras .item-extra .extra-quantity span.plus {
  position: absolute;
  right: 0px;
  top: 0px;
  height: 40px;
  width: 40px;
  border: 1px solid #E5E5E5;
  border-radius: 50%;
  background: #ffffff url(../imgs/page/booking/plus.svg) no-repeat center;
  cursor: pointer;
}
.list-extras .item-extra .extra-quantity span.plus:hover {
  border-color: #181A1F;
  background-color: #F6F6F6;
}

.sidebar .list-prices li span.price {
  min-width: 92px;
  max-width: 92px;
  text-align: right;
}

.list-prices-2 li {
  border-bottom: 0px;
  padding-bottom: 5px;
  padding-top: 5px;
}

.box-content-detail {
  padding-right: 40px;
}
.box-content-detail select.form-control {
  -webkit-appearance: revert;
  -moz-appearance: revert;
  appearance: revert;
  padding-top: 0px;
  padding-bottom: 0px;
}

.box-completed-booking {
  max-width: 740px;
  margin: auto;
  padding: 120px 0px 90px 0px;
}

.box-booking-border {
  border-radius: 6px;
  border: 1px solid #E5E5E5;
  padding: 50px;
  margin-bottom: 30px;
}

.box-info-book-border {
  padding: 40px 20px;
  border: 1px dashed #181A1F;
  border-radius: 6px;
  display: flex;
  align-items: center;
  background-color: #F6F6F6;
  margin-bottom: 30px;
}
.box-info-book-border .info-1 {
  width: 25%;
  padding: 0px 10px;
}

.cb-agree, .cb-subscriber {
  float: left;
  margin: 2px 10px 0px 0px;
}

.list-prices li .text-top {
  min-width: 140px;
  display: inline-block;
}

.box-breadcrumb ul li {
  display: inline-block;
  position: relative;
  padding: 0px 22px 0px 0px;
}
.box-breadcrumb ul li::before {
  content: "-";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 4px;
  color: #fff;
}
.box-breadcrumb ul li:last-child::before {
  display: none;
}
.box-breadcrumb ul li a {
  color: #fff;
  font-size: 14px;
  line-height: 24px;
  font-weight: 400;
}

.cardNewsList .cardNews {
  display: flex;
  align-items: center;
}
.cardNewsList .cardNews > a {
  max-width: 320px;
  margin-right: 30px;
  width: 100%;
}
.cardNewsList .cardNews .cardInfo {
  width: 100%;
}
.cardNewsList .cardNews .cardInfo .mb-20 {
  margin-bottom: 15px !important;
}

.sidebar-radius {
  border-radius: 6px;
  border: 1px solid #E5E5E5;
  padding: 30px;
  margin-bottom: 30px;
}
.sidebar-radius .sidebar-title {
  margin-bottom: 30px;
}

.sidebar-content ul li {
  display: inline-block;
  width: 100%;
  margin-bottom: 15px;
}
.sidebar-content ul li:last-child {
  margin-bottom: 0;
}
.sidebar-content ul li a {
  font-size: 16px;
  line-height: 26px;
  color: #181A1F;
  text-decoration: none;
}
.sidebar-content ul li a:hover {
  text-decoration: underline;
}

.box-form-search {
  margin-bottom: 30px;
  position: relative;
}

.recent-post {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
}
.recent-post .image-post {
  max-width: 90px;
  min-width: 90px;
  width: 100%;
  margin-right: 20px;
}
.recent-post .image-post img {
  border-radius: 6px;
  display: block;
}
.recent-post .info-post {
  width: 100%;
}
.recent-post .info-post .date-post {
  font-size: 14px;
  line-height: 24px;
  font-weight: 400;
  color: #181A1F;
}
.recent-post .info-post .link-post {
  font-size: 14px;
  line-height: 24px;
  font-weight: 500;
  color: #181A1F;
  -webkit-line-clamp: 2;
  max-height: 47px;
  display: inline-block;
  width: 100%;
  -webkit-box-orient: vertical;
  -o-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cardNewsBig .cardNews .cardInfo .text-20-medium {
  font-size: 36px;
  line-height: 58px;
}

.box-frature-image .cardImage {
  margin-bottom: 20px;
  position: relative;
}
.box-frature-image .cardImage img {
  border-radius: 6px;
  width: 100%;
  display: block;
}
.box-frature-image .cardImage::before {
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1;
  background-image: url(../imgs/page/homepage1/bg-trans2.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.box-frature-image .cardImage .datePost {
  position: absolute;
  top: 20px;
  left: 30px;
  z-index: 2;
}
.box-frature-image .cardImage .datePost .heading-52-medium {
  line-height: 52px;
}
.box-frature-image .cardImage .datePost .color-white {
  color: #fff !important;
}

.content-single p {
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  color: #181A1F;
  margin-bottom: 30px;
}
.content-single img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  width: 100%;
}
.content-single blockquote {
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  font-style: italic;
  margin-bottom: 30px;
  color: #181A1F;
  padding: 20px 10px 30px 75px;
  border-left: 5px solid #E95440;
  background-image: url(../imgs/page/blog2/quote.png);
  background-position: top 7px left 22px;
  background-repeat: no-repeat;
}
.content-single h1, .content-single h2 {
  font-size: 44px;
  line-height: 76px;
  color: #181A1F;
  font-weight: 500;
  margin-bottom: 30px;
}
.content-single h3, .content-single h4 {
  font-size: 34px;
  line-height: 66px;
  margin-bottom: 30px;
  color: #181A1F;
  font-weight: 500;
}

.social-single .icon-socials {
  border-radius: 50%;
}
.social-single .icon-socials.icon-facebook {
  background: #FDEEEC url(../imgs/template/icons/fb-black.png) no-repeat center;
}
.social-single .icon-socials.icon-twitter {
  background: #FDEEEC url(../imgs/template/icons/tw-black.png) no-repeat center;
}
.social-single .icon-socials.icon-instagram {
  background: #FDEEEC url(../imgs/template/icons/instagram-black.png) no-repeat center;
}
.social-single .icon-socials.icon-linkedin {
  background: #FDEEEC url(../imgs/template/icons/linkedin-black.png) no-repeat center;
}

.author-box {
  display: inline-block;
  width: 100%;
}
.author-box .item-author {
  display: flex;
  width: 100%;
}
.author-box .item-author .item-author-image {
  width: 100%;
  min-width: 70px;
  max-width: 70px;
  margin-right: 30px;
}
.author-box .item-author .item-author-image img {
  border-radius: 50%;
  height: 70px;
  width: 70px;
  display: block;
}
.author-box .item-author .item-author-info {
  width: 100%;
}

.box-pager-prev-inner {
  padding-left: 40px;
}

.box-pager-next-inner {
  padding-right: 40px;
  text-align: right;
}

.box-pager-inner {
  position: relative;
}
.box-pager-inner a.prev-page {
  position: relative;
  display: inline-block;
  padding-left: 40px;
}
.box-pager-inner a.prev-page svg {
  position: absolute;
  left: 0px;
  top: 0px;
  height: 25px;
}
.box-pager-inner a.prev-page:hover, .box-pager-inner a.prev-page:hover * {
  color: #E95440;
}
.box-pager-inner a.next-page {
  position: relative;
  display: inline-block;
  padding-right: 40px;
}
.box-pager-inner a.next-page svg {
  position: absolute;
  right: 0px;
  top: 1px;
  height: 25px;
}
.box-pager-inner a.next-page:hover, .box-pager-inner a.next-page:hover * {
  color: #E95440;
}

.item-reviews {
  margin-bottom: 30px;
}
.item-reviews .item-author-info {
  display: flex;
  width: 100%;
  margin-bottom: 30px;
  align-items: center;
}
.item-reviews .item-author-info .item-avatar {
  width: 70px;
  height: 70px;
  background-color: #181A1F;
  border-radius: 50%;
  margin-right: 20px;
  color: #fff;
  font-size: 15px;
  line-height: 15px;
  font-weight: 500;
  line-height: 70px;
  text-align: center;
}
.item-reviews .item-desc {
  display: inline-block;
  width: 100%;
  margin-bottom: 30px;
}
.item-reviews .buttons-like {
  display: inline-block;
  width: 100%;
}

textarea.form-control {
  height: auto;
  height: 160px;
}

.form-group {
  position: relative;
  margin-bottom: 30px;
}
.form-group label {
  position: absolute;
  top: -25px;
  left: 0px;
  font-size: 14px;
  line-height: 24px;
  font-weight: 400;
  transition: top 150ms ease-out;
  padding: 0px 10px;
  font-size: 16px;
  font-weight: 500;
  color: #181A1F;
}

.form-control {
  background-color: #F6F6F6;
  border: 2px solid #F6F6F6;
  border-radius: 6px;
  min-height: 55px;
  font-size: 16px;
  font-weight: 500;
  color: #181A1F;
  width: 100%;
}
.form-control:focus, .form-control.filled {
  border-color: #181A1F;
  background-color: #ffffff;
}

.focused label {
  top: -11px;
  background-color: #ffffff;
  color: #626262;
}

.service-box {
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 12px;
    background: #fff;

    box-shadow: 0 2px 6px rgba(0,0,0,0.04);

    transition:
        box-shadow .25s ease,
        transform .25s ease,
        border-color .25s ease;
}

.service-box:hover {
    border-color: #c8a96e;
    box-shadow:
        0 14px 32px rgba(0,0,0,0.10),
        0 2px 6px rgba(0,0,0,0.05);
}
.service-box svg {
    transition: transform .25s ease;
}

.service-box:hover svg {
    transform: scale(1.08);
}

@media (max-width: 1550px) {
  .cardFleet {
    padding: 15px;
  }
  .cardFleet .cardInfoBottom .passenger .icon-circle, .cardFleet .cardInfoBottom .luggage .icon-circle {
    margin-right: 7px;
  }
}
@media (max-width: 1399.98px) {
  .header .main-header .header-left .header-right {
    width: 25%;
  }
  .header .main-header .header-left .header-nav {
    width: 86%;
  }
  .banner-home2, .block-padding-100 {
    padding-left: 10px;
    padding-right: 10px;
  }
  .bg-our-service-home-7 .box-pagination-fleet .swiper-button-next-fleet {
    right: -80px;
  }
  .bg-our-service-home-7 .box-pagination-fleet .swiper-button-prev-fleet {
    left: -80px;
  }
  .box-number-banner {
    padding-left: 5px;
  }
  .box-header-home4 {
    padding: 0px 15px;
  }
  .header.header-homepage9 .container-fluid {
    padding-left: 15px;
    padding-right: 15px;
  }
  .header.header-homepage9 .main-header .header-left .header-nav {
    width: 50%;
  }
  .header.header-homepage9 .main-header .header-left .header-logo {
    width: 14%;
  }
  .header.header-homepage9 .main-header .header-left .header-right {
    width: 36%;
  }
  .box-our-fleet-home8 .fleet-style-3 {
    padding-left: 60px;
    padding-right: 60px;
  }
  .box-our-fleet-home8 .fleet-style-3 .box-pagination-fleet .swiper-button-next-fleet {
    right: -80px;
  }
  .box-our-fleet-home8 .fleet-style-3 .box-pagination-fleet .swiper-button-prev-fleet {
    left: -80px;
  }
}
@media (max-width: 1199.98px) {
  .header {
    padding: 10px 0;
  }
  .header .header-right .btn.btn-brand-1 {
    padding: 8px 16px;
  }
  .header-top-sub {
    display: none;
  }
  .burger-icon {
    display: inline-block;
  }
  .header .burger-icon {
    display: block;
  }
  .header .main-header .header-left .header-right {
    width: 100%;
    text-align: right;
    padding-right: 40px;
  }
  .header .main-header .header-left .header-nav {
    width: 0%;
  }
  .box-search-ride {
    flex-wrap: wrap;
    position: relative;
    bottom: auto;
    left: auto;
    right: auto;
    margin-top: 20px;
    padding: 0px 15px;
  }
  .header .container {
    max-width: 100%;
  }
  .box-cover-image {
    height: 700px;
  }
  .box-search-ride .search-item {
    background: #F6F6F6;
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 20px;
    width: 100%;
    min-width: auto;
    max-width: 100%;
  }
  .box-search-ride .search-item .search-icon .item-icon {
    background-color: #ffffff;
    border-radius: 6px;
    width: 44px;
    height: 44px;
  }
  .box-search-ride .search-item .search-icon {
    max-width: 44px;
    min-width: 44px;
    margin-right: 10px;
  }
  .box-search-ride .search-item.search-button {
    width: 100%;
    border-radius: 6px;
    text-align: center;
    padding: 0px;
  }
  .box-search-ride .search-item.search-button .btn-search {
    border-radius: 6px;
    width: 100%;
  }
  .ui-timepicker-standard {
    margin-top: 25px;
    margin-left: 0px;
  }
  .box-dropdown-location {
    top: 45px;
    left: 65px;
  }
  .box-search-ride-style-2 .box-search-tabs {
    right: auto;
    bottom: auto;
    position: relative;
    max-width: 100%;
  }
  .box-banner-homepage-2 .box-banner-info {
    top: 200px;
  }
  .banner-home5 .box-banner-info {
    top: 30%;
  }
  .box-search-ride-style-2 {
    padding: 0px;
  }
  .box-fleet-cover {
    padding-left: 10px;
    padding-right: 10px;
  }
  .box-search-ride-style-3 .box-dropdown-location {
    left: 0px;
    max-width: 430px;
    width: 100%;
  }
  .box-search-ride-style-3 .search-item {
    background-color: #ffffff;
  }
  .box-search-ride-style-3 {
    padding: 0px;
  }
  .header .header-top-sub .main-header .header-left .header-right {
    width: 100%;
  }
  .header-top-sub {
    padding: 15px 0px;
  }
  .header-homepage5 {
    padding: 0px 0;
  }
  .box-socials-header {
    padding-right: 35px;
  }
  .box-the-trip-right {
    max-width: 40%;
  }
  .bg-our-service-home-7 .box-slide-fleet-2 {
    padding: 0px 80px;
  }
  .bg-our-service-home-7::before {
    height: 410px;
  }
  .header.header-7 .main-header .header-left .header-right {
    min-width: 255px;
  }
  .box-banner-homepage6-left {
    padding-left: 15px;
    padding-right: 15px;
  }
  .box-search-ride-3 {
    padding: 15px 15px;
    border-radius: 8px;
  }
  .box-search-ride-style-6 .tab-content .box-form-search {
    flex-wrap: wrap;
  }
  .box-search-ride-style-6 .search-item {
    margin-right: 1%;
    width: 48%;
    margin-left: 1%;
  }
  .header.header-homepage9 .main-header .header-left .header-right {
    width: 80%;
  }
  .header.header-homepage9 .main-header .header-left .header-logo {
    width: 20%;
    text-align: left;
  }
  .header.header-homepage9 .main-header .header-left .header-nav {
    width: 0%;
  }
  .header.header-homepage9 .container-fluid {
    padding-left: 15px;
    padding-right: 15px;
  }
  .box-comfortable-home9 {
    padding: 0px 20px;
  }
  .banner-home9 {
    padding-left: 20px;
    padding-right: 20px;
  }
  .latest-new-home9 {
    padding: 0px 20px;
  }
  .box-pdrl-60, .footer-7 {
    padding: 0px 20px;
  }
  .box-search-ride-5 {
    margin-top: 0px;
    padding: 15px 15px 0px 15px;
  }
  .box-search-ride-5 .search-item {
    background-color: #000000;
  }
  .box-search-ride-5 .search-item .search-icon .item-icon {
    background-color: rgba(255, 255, 255, 0.2039215686);
    border-radius: 50%;
  }
  .box-our-fleet-home8 .fleet-style-3 .box-pagination-fleet .swiper-button-next-fleet {
    right: -70px;
  }
  .box-our-fleet-home8 .fleet-style-3 .box-pagination-fleet .swiper-button-prev-fleet {
    left: -70px;
  }
  .box-main-slider {
    top: 32%;
  }
}
@media (max-width: 991.98px) {
  .box-container-sw .box-swiper {
    padding-left: 30px;
  }
  .box-container-sw .box-button-slider {
    left: 30px;
  }
  .box-region-right {
    padding-left: 0px;
  }
  .list-logos li {
    text-align: left;
  }
  .box-video .btn-play {
    left: 0px;
    right: 0px;
    margin: auto;
    top: 0px;
    bottom: 0px;
  }
  .cardServiceStyle4, .cardService.cardServiceStyle5 {
    height: auto;
  }
  .bg-how-it-works::after {
    content: "";
    width: 100%;
    height: 430px;
    background-position: center;
  }
  .box-cover-image {
    height: 600px;
  }
  .bg-how-it-works::before {
    background-size: cover;
  }
  .box-list-how ul {
    flex-wrap: wrap;
  }
  .box-list-how ul li {
    width: 100%;
  }
  .bg-testimonial .box-region-right {
    padding-left: 0px;
  }
  .swiper-group-testimonials-2 .swiper-slide {
    padding: 0px;
  }
  .box-pagination-button-testimonials-2 {
    padding-left: 0px;
    padding-top: 60px;
  }
  .bg-download-2::before {
    display: none;
  }
  .box-list-how ul li.has-arrow {
    padding-right: 0px;
    padding-bottom: 100px;
    background-position: center bottom 20px;
  }
  .box-list-how ul li:last-child {
    min-width: 100%;
    max-width: 100%;
  }
  .box-fleet-padding {
    padding-top: 90px;
    padding-bottom: 50px;
  }
  .box-image-how {
    padding-left: 0px;
  }
  .box-customers-say {
    padding-right: 0px;
  }
  .bg-download-3::before {
    background-image: none;
  }
  .box-btn-play {
    left: 0px;
  }
  .cardServiceStyle3 {
    height: 290px;
  }
  .box-form-service-single .box-search-ride-style-2 .box-search-tabs {
    bottom: auto;
    position: relative;
    max-width: 100%;
    right: auto;
  }
  .box-banner-right {
    display: none;
  }
  .box-the-trip-right {
    display: none;
  }
  .box-the-trip {
    max-width: 100%;
  }
  .inner-invoice {
    padding: 50px 30px 0px 30px;
  }
  .invoice-left, .invoice-right {
    width: 50%;
    max-width: 100%;
  }
  .box-booking-tabs .item-tab .box-tab-step .icon-tab .icon-book {
    background-size: 25px;
    height: 50px;
    width: 50px;
    line-height: 50px;
    margin-right: 10px;
  }
  .box-booking-tabs .item-tab .box-tab-step .number-tab span {
    font-size: 20px;
    line-height: 48px;
  }
  .box-row-tab .box-tab-left {
    width: 61%;
  }
  .box-row-tab .box-tab-right {
    width: 39%;
  }
  .box-content-detail {
    padding-right: 0px;
  }
  .item-vehicle .vehicle-left {
    padding: 0px 10px;
    position: relative;
    width: 100%;
    border-right: 0px solid #E5E5E5;
    margin-right: 0px;
    margin-bottom: 30px;
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 30px;
  }
  .item-vehicle .vehicle-right {
    width: 100%;
  }
  .item-vehicle {
    flex-wrap: wrap;
  }
  .box-offices {
    padding-left: 0px;
  }
  .box-banner-homepage7-left {
    padding: 50px 10px 60px 10px;
  }
  .box-some-number {
    text-align: center;
  }
  .box-number-banner .number-1:first-child {
    padding-left: 0px;
  }
  .box-number-banner {
    padding-right: 5px;
  }
  .bg-right-trip {
    display: none;
  }
  .cardNumberTitleDesc::before {
    display: none;
  }
  .block-padding-60::before, .block-news-padding-60::before {
    left: 0px;
  }
  .box-reliability .container-sub::before {
    width: auto;
    right: 10px;
  }
  .box-number-servered {
    right: 20px;
  }
  .banner-home9 {
    padding-left: 0px;
    padding-right: 0px;
  }
  .box-comfortable-home9 {
    padding: 0px 0px;
  }
  .latest-new-home9 {
    padding: 0px 0px;
  }
  .box-pdrl-60, .footer-7 {
    padding: 0px 0px;
  }
  .banner-home8 .box-cover-image {
    height: auto !important;
    padding-bottom: 5px;
    padding-top: 50px;
  }
  .box-main-slider {
    top: auto;
    width: 100%;
    position: relative;
    right: auto;
    max-width: 100%;
    margin-bottom: 0px;
  }
  .slider-nav-thumbnails {
    max-width: 100%;
  }
  .width-20 {
    width: 33.33%;
  }
  .detail-gallery {
    min-height: auto;
  }
}
@media (max-width: 767.98px) {
  .mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-top .mobile-header-logo a img {
    max-width: 140px;
  }
  .cardFleet {
    padding: 15px;
  }
  .width-20 {
    width: 33.33%;
    margin-bottom: 30px;
  }
  .width-25 {
    margin-bottom: 30px;
    width: 50%;
  }
  .menu-bottom {
    display: inline-block;
    width: 100%;
    padding: 15px 0px;
  }
  .bg-download::before {
    display: none;
  }
  .box-cover-image {
    height: 500px;
  }
  .box-banner-homepage-2 .box-banner-info {
    top: 140px;
  }
  .banner-home5 .box-banner-info {
    top: 30%;
  }
  .box-search-ride-style-2 .box-form-search {
    padding: 15px;
  }
  .nav-tabs-search li {
    padding: 0px 15px;
  }
  .nav-tabs-search li a {
    padding: 20px 0px;
  }
  .banner-home-4.pt-150 {
    padding-top: 70px !important;
  }
  .cardIconTitleDescLeft .cardIconTitleDesc {
    padding: 20px 20px 10px 20px;
  }
  .heading-100-medium {
    font-size: 50px;
    line-height: 70px;
  }
  .table-invoice thead th {
    padding: 11px 11px;
    font-size: 16px;
    line-height: 24px;
  }
  .table-invoice tbody tr td {
    padding: 13px 11px;
  }
  .box-invoice {
    margin-top: 55px;
    margin-bottom: 50px;
  }
  .box-booking-tabs {
    flex-wrap: wrap;
  }
  .box-booking-tabs .item-tab {
    width: 50%;
  }
  .box-row-tab .box-tab-left {
    width: 100%;
  }
  .box-row-tab .box-tab-right {
    width: 100%;
  }
  .box-booking-tabs .item-tab .box-tab-step {
    padding: 15px 0px;
  }
  .box-info-book-border {
    flex-wrap: wrap;
    padding-bottom: 10px;
  }
  .box-info-book-border .info-1 {
    width: 50%;
    margin-bottom: 30px;
  }
  .cardImageLeftTextRight .cardImage {
    padding: 10px;
    margin-right: 15px;
    line-height: 70px;
  }
  .cardImageLeftTextRight {
    margin-bottom: 30px;
  }
  .cardServiceStyle5 {
    flex-wrap: wrap;
  }
  .cardServiceStyle5 .cardImage {
    width: 100%;
    margin-bottom: 30px;
  }
  .cardServiceStyle5 .cardInfo {
    width: 100%;
    padding-left: 0px;
  }
  .box-number-servered {
    right: 10px;
    left: 10px;
  }
  .width-20 {
    width: 50%;
  }
}
@media (max-width: 575.98px) {
  .header {
    padding: 10px 0;
    min-height: 60px;
  }
  .header-homepage5 {
    padding: 0px;
  }
  .swiper-button-next,
  .swiper-button-prev {
    display: none;
  }
  .box-container-sw .swiper-button-next,
  .box-container-sw .swiper-button-prev {
    display: block;
  }
  .swiper-button-next-fleet, .swiper-button-prev-fleet, .swiper-button-prev-banner, .swiper-button-next-banner {
    display: inline-block;
  }
  .box-showcase {
    padding-left: 10px;
    padding-right: 10px;
  }
  .width-20 {
    width: 50%;
  }
  .width-25 {
    width: 100%;
  }
  .menu-bottom li {
    margin-bottom: 10px;
  }
  .footer-bottom .mr-50 {
    margin-right: 0px !important;
  }
  .list-logos {
    overflow: hidden;
  }
  .list-logos li {
    min-width: 125px;
  }
  .list-logos li img {
    max-width: 80%;
  }
  .bg-how-it-works::after {
    height: 290px;
  }
  .box-cover-image {
    height: 350px;
  }
  .box-pagination-button {
    top: 20%;
  }
  .box-banner-info .heading-52-medium {
    font-weight: 500;
    font-size: 25px;
    line-height: 35px;
  }
  .box-banner-homepage-2 .box-banner-info {
    top: 110px;
  }
  .banner-home5 .box-banner-info {
    top: 30%;
  }
  .box-fleet-cover {
    padding-left: 10px;
    padding-right: 10px;
  }
  .box-pagination-button-2 {
    display: none;
  }
  .banner-home5 .swiper-slide {
    padding-right: 0px;
  }
  .header-top-main .icon-socials, .box-socials-header {
    display: none !important;
  }
  .header .header-top-sub .main-header .header-left .header-nav {
    width: 0%;
  }
  .cardServiceStyle3 .cardImage img {
    max-height: none;
  }
  .header-top-main .burger-icon {
    top: 21px;
    right: 15px;
  }
  .box-dropdown-cart {
    padding-right: 25px;
  }
  .pagination li a {
    max-width: 40px;
    min-width: 40px;
    padding: 9px 0px;
  }
  .pagination li .page-prev, .pagination li .page-next {
    min-height: 44px;
    padding: 8px 0px;
  }
  .cardNewsList .cardNews {
    flex-wrap: wrap;
  }
  .cardNewsList .cardNews > a {
    max-width: 100%;
    margin-right: 0px;
    width: 100%;
  }
  .invoice-top {
    flex-wrap: wrap;
  }
  .invoice-left, .invoice-right {
    width: 100%;
  }
  .link-grey li a {
    font-weight: 500;
    font-size: 22px;
  }
  .number-1 .heading-44-medium {
    font-size: 25px;
    line-height: 35px;
  }
  .number-1 .text-20 {
    font-size: 16px;
  }
  .box-number-banner .number-1 {
    padding-left: 15px;
  }
  .bg-our-service-home-7 .box-pagination-fleet .swiper-button-next-fleet, .bg-our-service-home-7 .box-pagination-fleet .swiper-button-prev-fleet {
    display: none;
  }
  .bg-our-service-home-7 .box-slide-fleet-2 {
    padding: 0px;
  }
  .box-banner-info {
    flex-wrap: wrap;
    top: 25%;
  }
  .banner-info-left {
    margin-bottom: 15px;
  }
  .banner-home10 .box-cover-image {
    height: 420px;
  }
  .box-search-ride-style-6 .search-item.search-button {
    min-width: 100%;
    max-width: 100%;
  }
  .box-search-ride-style-6 .search-item {
    margin-right: 0%;
    width: 100%;
    margin-left: 0%;
  }
  .box-our-fleet-home8 .fleet-style-3 .box-pagination-fleet .swiper-button-next-fleet {
    display: none;
  }
  .box-our-fleet-home8 .fleet-style-3 .box-pagination-fleet .swiper-button-prev-fleet {
    display: none;
  }
  .box-our-fleet-home8 .fleet-style-3 {
    padding-left: 0px;
    padding-right: 0px;
  }
  .box-slider-customers {
    padding: 50px 70px 50px 10px;
  }
  .swiper-pagination-number {
    right: 10px;
  }
}
@media (max-width: 499.98px) {
  .width-20 {
    width: 100%;
  }
  .heading-44-medium {
    font-size: 36px;
    line-height: 50px;
  }
  .ui-datepicker {
    max-width: 360px;
  }
  .ui-state-default, .ui-widget-content .ui-state-default {
    width: 40px;
    height: 40px;
    line-height: 40px;
  }
  .box-dropdown-location {
    top: 45px;
    left: 0px;
    max-width: 430px;
    width: 100%;
  }
  .heading-52-medium {
    font-size: 35px;
    line-height: 55px;
  }
  .cardServiceStyle3 {
    height: 410px;
  }
  .content-single blockquote {
    padding-left: 55px;
    background-position: top 7px left 14px;
  }
  .box-count .deals-countdown .countdown-section .countdown-amount {
    font-size: 35px;
    line-height: 55px;
  }
  .box-count .deals-countdown .countdown-section .countdown-period {
    font-size: 18px;
    line-height: 24px;
  }
  .box-invoice-block {
    padding: 0px 5px;
  }
  .inner-invoice {
    padding: 30px 10px 0px 10px;
  }
  .box-search-ride-style-6 .nav-tabs-search li a {
    padding: 10px 15px;
    font-size: 14px;
    line-height: 24px;
  }
  .box-info-reliability {
    padding: 30px;
  }
  .box-footer-top .mr-30 {
    margin-right: 10px !important;
  }
  .cardServiceStyle4, .cardService.cardServiceStyle5 {
    height: auto;
  }
  .box-cover-image {
    height: 250px;
  }
  .box-button-login {
    display: none !important;
  }
  .header-top-sub .box-button-login {
    display: inline-block !important;
  }
  .box-banner-homepage-2 .box-banner-info {
    top: 40px;
  }
  .banner-home5 .box-banner-info {
    top: 30%;
  }
  .header-top-1 {
    display: none;
  }
  .card-plan {
    padding: 34px 20px 39px 20px;
  }
  .heading-100-medium {
    font-size: 40px;
    line-height: 60px;
  }
  .table-invoice thead th {
    padding: 11px 5px;
    font-size: 14px;
    line-height: 18px;
  }
  .table-invoice tbody tr td {
    padding: 12px 5px;
    font-size: 12px;
    line-height: 16px;
  }
  .table-invoice tbody tr td .text-18-medium {
    font-size: 16px;
    line-height: 28px;
  }
  .box-booking-tabs .item-tab {
    padding: 0px 10px;
  }
  .item-vehicle .vehicle-left .vehicle-facilities .text-fact {
    width: 100%;
  }
  .box-info-book-border {
    padding: 20px 5px 0px 5px;
  }
  .box-booking-border .list-prices li {
    flex-wrap: wrap;
  }
  .box-booking-border .list-prices li .text-top {
    width: 100%;
    color: #626262;
    display: block;
    padding-bottom: 10px;
  }
  .box-booking-border {
    padding: 30px;
  }
  .sidebar {
    padding: 20px 15px;
  }
  .heading-44-medium {
    font-size: 30px;
    line-height: 40px;
  }
  .list-extras .item-extra .extra-quantity {
    max-width: 115px;
    min-width: 115px;
  }
  .list-extras .item-extra {
    flex-wrap: wrap;
  }
  .list-extras .item-extra .extra-info {
    width: 100%;
    margin-bottom: 30px;
  }
  .number-1 .heading-44-medium {
    font-size: 20px;
    line-height: 25px;
  }
  .number-1 .text-20 {
    font-size: 15px;
  }
  .box-number-banner .number-1 {
    padding-left: 15px;
  }
  .ui-datepicker.ui-widget.ui-widget-content {
    padding: 10px;
  }
  .ui-datepicker th {
    padding: 14px 4px 4px 4px;
    font-size: 14px;
    line-height: 28px;
  }
  .ui-state-default, .ui-widget-content .ui-state-default {
    width: 25px;
    height: 25px;
    line-height: 25px;
  }
  .ui-datepicker {
    max-width: 260px;
  }
  .ui-timepicker-standard {
    width: 190px !important;
  }
}

@media (max-width: 349.98px) {
  .mobile-header-wrapper-style {
    width: 310px;
  }
  .perfect-scroll {
    width: 100%;
  }
  .author-box .item-author .item-author-image {
    margin-right: 10px;
  }
  .heading-100-medium {
    font-size: 35px;
    line-height: 55px;
  }
  .box-booking-tabs .item-tab {
    width: 100%;
  }
  .box-booking-border {
    padding: 20px 15px;
  }
  .box-booking-tabs .item-tab .box-tab-step .number-tab span {
    font-size: 35px;
    line-height: 58px;
  }
}
@media (min-width: 1400px) {
  .container.wide {
    max-width: 1544px;
  }
}
/*OTHER SCREEN*/
.page-content p {
  margin-bottom: 15px;
}

/* ===================================================
   Fleet Card — Inner Image Gallery / Slider
   =================================================== */

/* Shared aspect-ratio for single fallback image */
.cardFleet .cardImage > a > img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 4px;
  display: block;
}

/* Gallery wrapper */
.cardFleet .cardImage.card-fleet-gallery {
  border-radius: 4px;
  overflow: hidden;
}

/* Inner Swiper container */
.card-fleet-gallery .card-img-swiper {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  padding-bottom: 0px;
  /*background: #0e0e0e;*/
}

/* Each slide locks to 4:3 ratio */
.card-fleet-gallery .card-img-swiper .swiper-slide {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.card-fleet-gallery .card-img-swiper .swiper-slide a {
  display: block;
  width: 100%;
  height: 100%;
}

.card-fleet-gallery .card-img-swiper .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

/* Subtle ken-burns on active slide */
.card-fleet-gallery .card-img-swiper .swiper-slide-active img {
  transform: scale(1.02);
}

/* ---- Pagination dots — luxury pill style ---- */
.card-img-pagination.swiper-pagination {
  position: absolute;
  bottom: 10px!important;
  left: 0;
  right: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  line-height: 1;
}

.card-img-pagination.swiper-pagination .swiper-pagination-bullet {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255, 127, 127, 0.55);
  opacity: 1;
  margin: 0 !important;
  transition: width 0.3s ease, background 0.3s ease, border-radius 0.3s ease;
}

.card-img-pagination.swiper-pagination .swiper-pagination-bullet-active {
  background: #E95440;
  width: 16px;
  border-radius: 3px;
}

/* ---- Prev / Next arrow buttons ---- */
.card-img-swiper .card-img-btn-prev,
.card-img-swiper .card-img-btn-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 30px;
  height: 30px;
  background: rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.25s ease, background 0.25s ease;
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.card-img-swiper .card-img-btn-prev {
  left: 8px;
}

.card-img-swiper .card-img-btn-next {
  right: 8px;
}

/* Reveal arrows on card hover */
.cardFleet:hover .card-img-btn-prev,
.cardFleet:hover .card-img-btn-next {
  opacity: 1;
}

.card-img-swiper .card-img-btn-prev:hover,
.card-img-swiper .card-img-btn-next:hover {
  background: rgba(233, 84, 64, 0.75);
  border-color: rgba(233, 84, 64, 0.6);
}

.card-img-swiper .card-img-btn-prev svg,
.card-img-swiper .card-img-btn-next svg {
  width: 14px;
  height: 14px;
  stroke: #ffffff;
  flex-shrink: 0;
}

/* Disabled state (first/last slide) */
.card-img-btn-prev.swiper-button-disabled,
.card-img-btn-next.swiper-button-disabled {
  opacity: 0 !important;
  pointer-events: none;
}

/* Thin gradient scrim so dots stay legible on any image */
.card-fleet-gallery .card-img-swiper::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 40px;
  /*background: linear-gradient(to top, rgba(0, 0, 0, 0.35), transparent);*/
  pointer-events: none;
  z-index: 5;
}

/*# sourceMappingURL=style.css.map */

/* ==========================================================================
   LH-2026-08 — Home rework (LH-001 … LH-009)

   Appended block. The public/assets/scss sources are not wired into a build
   (no sass script in package.json), so — following the existing convention in
   this repo — the compiled stylesheet is edited directly. Keep everything
   related to this batch inside this block so it stays reviewable and
   revertible in one piece. Bump ?v= in layouts/frontend.blade.php on change.
   ========================================================================== */

/* --- LH-004 — static hero (the single-slide Swiper is gone) --------------- */
.banner-home5 .hero-static {
  padding-right: 100px;
  max-width: 780px;
}

.banner-home5 .hero-lead {
  margin-top: 14px;
  max-width: 560px;
  opacity: 0.85;
}

.banner-home5 .hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
}

/* --- LH-001 — Business / Leisure entry switch ---------------------------- */
.audience-switch {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 6px;
  margin-bottom: 24px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background-color: rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(6px);
}

.audience-switch-item {
  display: inline-block;
  padding: 9px 20px;
  border-radius: 999px;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 500;
  white-space: nowrap;
  color: #fff;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.audience-switch-item:hover {
  background-color: rgba(255, 255, 255, 0.14);
  color: #fff;
}

.audience-switch-item.active {
  background-color: #fff;
  color: #181A1F;
}

/* --- LH-005 — scroll-down affordance ------------------------------------- */
.hero-scroll-down {
  position: absolute;
  left: 50%;
  bottom: 48px;
  transform: translateX(-50%);
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: #fff;
  background-color: rgba(0, 0, 0, 0.2);
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.hero-scroll-down:hover {
  color: #fff;
  border-color: #fff;
  background-color: rgba(0, 0, 0, 0.45);
}

.hero-scroll-down .hero-scroll-down-icon {
  animation: heroScrollNudge 1.9s ease-in-out infinite;
}

@keyframes heroScrollNudge {
  0%, 100% { transform: translateY(-3px); }
  50%      { transform: translateY(3px); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-scroll-down .hero-scroll-down-icon {
    animation: none;
  }
}

/* --- LH-007 — service cards -----------------------------------------------
   Superseded by the .cardService--reveal block at the end of this file: the
   copy is hidden at rest and slides in on hover instead of being always-on. */

/* --- LH-009 — swiper affordance ------------------------------------------ */
.bg-our-service-2 .swiper-pagination-fleet {
  position: static;
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 34px;
  width: auto;
}

.bg-our-service-2 .swiper-pagination-fleet .swiper-pagination-bullet {
  width: 9px;
  height: 9px;
  margin: 0;
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.32);
  transition: width 0.2s ease, background-color 0.2s ease;
}

.bg-our-service-2 .swiper-pagination-fleet .swiper-pagination-bullet-active {
  width: 26px;
  border-radius: 5px;
  background-color: #fff;
}

.bg-our-service-2 .box-pagination-fleet {
  margin-top: 24px;
  text-align: center;
}

/* With loop disabled (audience lists shorter than the visible row) Swiper
   flags the arrows as disabled — make that state visible instead of leaving
   two buttons that look clickable but do nothing. */
.bg-our-service-2 .swiper-button-next-fleet.swiper-button-disabled,
.bg-our-service-2 .swiper-button-prev-fleet.swiper-button-disabled {
  opacity: 0.3;
  pointer-events: none;
}

/* --- Language switcher (header / footer) --------------------------------- */
.lang-switch {
  display: inline-flex;
  gap: 2px;
  vertical-align: middle;
}

.lang-switch-item {
  display: inline-block;
  padding: 3px 9px;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.65);
  transition: background-color 0.2s ease, color 0.2s ease;
}

.lang-switch-item:hover {
  color: #fff;
}

.lang-switch-item.active {
  color: #181A1F;
  background-color: #fff;
}

.lang-switch-mobile {
  display: flex;
  gap: 6px;
}

.lang-switch-mobile .lang-switch-item {
  padding: 6px 14px;
  font-size: 14px;
}

/* --- Responsive ----------------------------------------------------------- */
@media (max-width: 991.98px) {
  .banner-home5 .hero-static {
    padding-right: 0;
  }
  .hero-scroll-down {
    bottom: 32px;
  }
}

@media (max-width: 767.98px) {
  .audience-switch {
    width: 100%;
    justify-content: center;
  }
  .audience-switch-item {
    padding: 8px 14px;
    font-size: 13px;
  }
  /* Was `flex:1 1 100%`, stacking Book now / View our fleet on separate
     lines — asked to sit side by side instead. Each takes an even share of
     the row (min-width:0 lets them actually shrink below their text's
     natural width, which flex items refuse to do by default); padding and
     font-size come down a step so both fit without wrapping their own text
     on a narrow phone. */
  .banner-home5 .hero-actions {
    flex-wrap: nowrap;
    gap: 10px;
  }
  .banner-home5 .hero-actions .btn {
    flex: 1 1 0;
    min-width: 0;
    text-align: center;
    justify-content: center;
    padding: 13px 10px;
    font-size: 14px;
  }
  .banner-home5 .hero-actions .btn svg {
    flex-shrink: 0;
  }
  .hero-scroll-down {
    width: 44px;
    height: 44px;
    bottom: 24px;
  }
  .bg-our-service-2 .swiper-button-next-fleet,
  .bg-our-service-2 .swiper-button-prev-fleet {
    width: 48px;
    height: 48px;
    line-height: 44px;
  }
  .bg-our-service-2 .swiper-button-next-fleet svg,
  .bg-our-service-2 .swiper-button-prev-fleet svg {
    height: 16px;
  }
}

/* ==========================================================================
   LH-012 / LH-013 — service index and subpages
   Appended block, same convention as the LH-2026-08 block above.
   ========================================================================== */

.service-single-image {
  border-radius: 8px;
  overflow: hidden;
}

.service-single-image img {
  width: 100%;
  height: auto;
  display: block;
}

.service-single-content h2,
.service-single-content h3 {
  font-size: 22px;
  font-weight: 500;
  margin: 26px 0 12px;
}

.service-single-content p {
  margin-bottom: 16px;
  line-height: 1.75;
}

.service-single-content ul,
.service-single-content ol {
  margin: 0 0 18px 20px;
  padding: 0;
}

.service-single-content li {
  margin-bottom: 8px;
  line-height: 1.7;
}

.service-single-cta {
  border-top: 1px solid #E5E5E5;
  padding-top: 30px;
}

.service-single-cta-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
}

.service-single-cta-actions .btn {
  display: inline-flex;
  align-items: center;
}

/* The /services grid reuses the Home card, which is built for a dark section —
   give it a floor height so short copy does not collapse the card. */
.section .cardService--reveal {
  min-height: 320px;
}

@media (max-width: 767.98px) {
  .service-single-cta-actions .btn {
    flex: 1 1 100%;
    justify-content: center;
  }
}

/* ==========================================================================
   LH-017 … LH-021 / LH-031 / LH-034 / LH-040 — booking wizard cleanup
   Appended block, same convention as the LH-2026-08 block above.
   Bump ?v= in layouts/frontend.blade.php on change.
   ========================================================================== */

/* --- LH-018 — route status block ----------------------------------------
   Was an inline `margin-bottom:16px` on a Bootstrap column that also carried
   `display:none`, so on mobile the panel butted straight into the Pickup Date
   field and, while hidden, still left the column's gutter behind. Owning the
   spacing here keeps it consistent in both states and at every breakpoint. */
.booking-route-status {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 4px 0 26px;
  padding: 12px 16px;
  border: 1px solid rgba(200, 169, 110, 0.3);
  border-radius: 10px;
  background: rgba(200, 169, 110, 0.07);
}

.booking-route-status svg {
  flex-shrink: 0;
  vertical-align: -3px;
}

/* Helper text under a field (LH-034 airport note, LH-040 window, capacities) */
.booking-hint {
  margin: 6px 0 0;
  line-height: 1.5;
  font-size: 13px;
}

/* --- LH-020 — route markers in the Ride Summary --------------------------
   The theme drew both stops with the same 40x40 red pin PNG inside a 36px-wide
   box, so the artwork was clipped 4px off-centre, the A/B letter did not sit on
   the pin's disc, and the dotted connector (left:17px) missed the marker centre
   by a pixel. The markers are now drawn in CSS: an origin disc for the pickup
   and a destination pin for the drop-off — distinct shapes, in the site's gold
   accent rather than the theme's leftover red, crisp on any DPI. */
.list-routes li {
  padding-bottom: 34px;
  align-items: flex-start;
}

.list-routes li .location-item {
  width: 32px;
  height: 32px;
  min-width: 32px;
  margin-right: 16px;
  background: #c8a96e;
  border-radius: 50%;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  line-height: 32px;
  text-align: center;
  display: inline-block;
}

/* The drop-off reads as an outlined marker so the two stops are told apart at a
   glance. Driven by a modifier class, not :last-child — with only the pickup
   filled in, :last-child would style the origin as the destination. */
.list-routes li .location-item--to {
  background: transparent;
  border: 2px solid #c8a96e;
  color: #c8a96e;
  line-height: 28px;
}

.list-routes li .info-location {
  padding-top: 6px;
  line-height: 1.5;
  word-break: break-word;
}

/* Connector: centred on the 32px marker (16px) instead of the old 17px */
.list-routes li::before {
  top: 34px;
  left: 15px;
  height: 22px;
  background: repeating-linear-gradient(
    to bottom,
    rgba(200, 169, 110, 0.75) 0,
    rgba(200, 169, 110, 0.75) 3px,
    transparent 3px,
    transparent 6px
  );
}

/* The date/time icons sitting right below the route reused the theme's red
   accent; align them with the gold used everywhere else on this page. */
.sidebar .list-icons li .icon-item {
  background-color: #c8a96e;
}

/* --- LH-017 — service description modal ---------------------------------- */
.service-tile {
  position: relative;
}

.service-tile-info {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid rgba(200, 169, 110, 0.5);
  border-radius: 50%;
  background: rgba(200, 169, 110, 0.12);
  color: #c8a96e;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}

.service-tile-info:hover,
.service-tile-info:focus-visible {
  background: #c8a96e;
  color: #fff;
}

.service-info-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(14, 14, 14, 0.6);
}

.service-info-dialog {
  position: relative;
  width: 100%;
  max-width: 640px;
  max-height: 85vh;
  overflow-y: auto;
  padding: 32px;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
}

.service-info-close {
  position: absolute;
  top: 14px;
  right: 18px;
  width: 32px;
  height: 32px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: transparent;
  color: #888;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.service-info-close:hover {
  color: #0e0e0e;
}

.service-info-lead {
  margin: 8px 0 18px;
  line-height: 1.6;
}

.service-info-body {
  margin-bottom: 24px;
}

.service-info-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

@media (max-width: 767.98px) {
  .service-info-dialog {
    padding: 24px 20px;
    max-height: 90vh;
  }

  .service-info-actions .btn {
    flex: 1 1 100%;
    justify-content: center;
  }
}

/* ==========================================================================
   LH-047 / LH-048 — offer request thank-you page
   The former Payment Instructions block was replaced by a numbered
   "what happens next" list; the theme has no list style for it.
   ========================================================================== */

.thankyou-next {
  margin: 0;
  padding-left: 20px;
  list-style: decimal;
}

.thankyou-next li {
  margin-bottom: 10px;
  line-height: 1.7;
  padding-left: 4px;
}

.thankyou-next li:last-child {
  margin-bottom: 0;
}

/* Same list inside the wizard's last step, which has no card wrapper of its own. */
.wizard-next-box {
  padding: 22px 24px;
  border: 1px solid rgba(200, 169, 110, 0.35);
  border-radius: 8px;
  background: rgba(200, 169, 110, 0.05);
}

@media (max-width: 575.98px) {
  .wizard-next-box {
    padding: 18px 18px;
  }
}

/* ==========================================================================
   Service cards — hover reveal (Home slider + /services grid)
   Replaces the always-open LH-007 treatment. At rest the card is just the
   image and the title sitting low; on hover/focus the title floats up and the
   description plus the two actions slide in underneath.
   Appended block, same convention as the blocks above.
   Bump ?v= in layouts/frontend.blade.php on change.
   ========================================================================== */

/* Timing: entering the hover state is staggered — image, then overlay, then
   title, then the copy block, then the description and the actions last. Every
   delay lives on the :hover/:focus-within rule; the base rule governs leaving,
   which runs quicker and without delay so the card does not feel sticky.

   Every `:hover` variant below lives ONLY inside `@media (hover: hover) and
   (pointer: fine)`, further down this block, not next to its `:focus-within`
   twin as before. Reason: `@media (hover: none)` (mobile's media *feature*)
   does not stop `:hover` (the *pseudo-class*) from matching — phone browsers
   commonly apply `:hover` styles on tap and hold them until the next tap
   elsewhere, "sticky hover". With the swiper this section sits in, dragging
   across a card during a swipe was enough to toggle it, so the reveal
   flashed open/closed mid-swipe. Gating the ruleset itself behind
   `(hover: hover)` removes it from touch devices' stylesheet entirely — a
   pseudo-class that can never be evaluated cannot misfire. `:focus-within`
   (keyboard tab focus) is not touch-triggered, so it stays active for every
   device, unscoped, below. */

/* --- Image: soft zoom, and a real gradient instead of the theme's
       bg-trans.png tile so the copy stays readable over any photo ---------- */
.cardService--reveal .cardImage {
  overflow: hidden;
}

.cardService--reveal .cardImage img {
  transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
}

.cardService--reveal:focus-within .cardImage img {
  transform: scale(1.06);
  transition: transform 0.9s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.cardService--reveal .cardImage::before {
  background-image: linear-gradient(
    to top,
    rgba(10, 12, 16, 0.9) 0%,
    rgba(10, 12, 16, 0.68) 26%,
    rgba(10, 12, 16, 0.28) 55%,
    rgba(10, 12, 16, 0) 82%
  );
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

/* A second, stronger layer fades in on hover so the longer copy keeps its
   contrast without darkening the resting card. */
.cardService--reveal .cardImage::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background-image: linear-gradient(
    to top,
    rgba(10, 12, 16, 0.94) 0%,
    rgba(10, 12, 16, 0.8) 40%,
    rgba(10, 12, 16, 0.4) 72%,
    rgba(10, 12, 16, 0.1) 100%
  );
  opacity: 0;
  transition: opacity 0.3s ease;
}

.cardService--reveal:focus-within .cardImage::after {
  opacity: 1;
  transition: opacity 0.55s ease 0.06s;
}

/* --- Copy block ----------------------------------------------------------- */
.cardService--reveal .cardInfo {
  padding: 26px 28px 24px;
}

.cardService--reveal .cardInfo .cardTitle {
  margin-bottom: 0;
  transform: translateY(6px);
  transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1),
              margin-bottom 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.cardService--reveal:focus-within .cardInfo .cardTitle {
  transform: translateY(0);
  margin-bottom: 12px;
  transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1) 0.1s,
              margin-bottom 0.55s cubic-bezier(0.22, 0.61, 0.36, 1) 0.1s;
}

/* The theme animates `height` between 0 and 130px, which cannot fit the two
   actions and jumps on longer copy — animate max-height/opacity instead.

   .cardInfo is in every selector below to match the specificity of the theme's
   `.cardService .cardInfo .box-inner-info`, which otherwise wins and reinstates
   both `height: 0` and its own `transition: height .3s` — that killed the
   animation outright and made the block snap open. */
.cardService--reveal .cardInfo .box-inner-info,
.cardService--reveal:focus-within .cardInfo .box-inner-info {
  height: auto;
}

.cardService--reveal .cardInfo .box-inner-info {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateY(12px);
  transition: max-height 0.35s cubic-bezier(0.22, 0.61, 0.36, 1),
              opacity 0.25s ease,
              transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.cardService--reveal:focus-within .cardInfo .box-inner-info {
  max-height: 260px;
  opacity: 1;
  transform: translateY(0);
  transition: max-height 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) 0.14s,
              opacity 0.45s ease 0.18s,
              transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) 0.14s;
}

/* The description and the actions carry their own delay on top of the block's,
   so the two rows arrive one after the other instead of all at once. */
/* .cardInfo is in the selector to outweigh the theme's four-class
   `.cardService .cardInfo .box-inner-info .cardDesc`, which clamps the copy to
   a 48px max-height — two lines instead of the three the clamp allows. */
.cardService--reveal .cardInfo .box-inner-info .cardDesc {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  max-height: none;
  overflow: hidden;
  margin-bottom: 16px;
  line-height: 1.6;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.25s ease;
}

.cardService--reveal:focus-within .cardInfo .box-inner-info .cardDesc {
  opacity: 0.88;
  transform: translateY(0);
  transition: opacity 0.5s ease 0.3s,
              transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s;
}

/* --- Actions -------------------------------------------------------------- */
.cardService-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.cardService--reveal .cardInfo .cardService-actions {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.25s ease;
}

.cardService--reveal:focus-within .cardInfo .cardService-actions {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.5s ease 0.42s,
              transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1) 0.42s;
}

/* Real mouse hover only (excludes touch, see the note at the top of this
   block) — same properties as the :focus-within rules above, kept apart so
   touch devices never even parse a `:hover` rule for this component. */
@media (hover: hover) and (pointer: fine) {
  .cardService--reveal:hover .cardImage img {
    transform: scale(1.06);
    transition: transform 0.9s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .cardService--reveal:hover .cardImage::after {
    opacity: 1;
    transition: opacity 0.55s ease 0.06s;
  }

  .cardService--reveal:hover .cardInfo .cardTitle {
    transform: translateY(0);
    margin-bottom: 12px;
    transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1) 0.1s,
                margin-bottom 0.55s cubic-bezier(0.22, 0.61, 0.36, 1) 0.1s;
  }

  .cardService--reveal:hover .cardInfo .box-inner-info {
    height: auto;
    max-height: 260px;
    opacity: 1;
    transform: translateY(0);
    transition: max-height 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) 0.14s,
                opacity 0.45s ease 0.18s,
                transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) 0.14s;
  }

  .cardService--reveal:hover .cardInfo .box-inner-info .cardDesc {
    opacity: 0.88;
    transform: translateY(0);
    transition: opacity 0.5s ease 0.3s,
                transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s;
  }

  .cardService--reveal:hover .cardInfo .cardService-actions {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.5s ease 0.42s,
                transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1) 0.42s;
  }
}

.cardService-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 18px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  white-space: nowrap;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

/* Black at rest, the theme's .btn-primary accent on hover. */
.cardService-btn--primary {
  background-color: #000;
  border: 1px solid #000;
  color: #fff;
}

.cardService-btn--primary:hover,
.cardService-btn--primary:focus-visible {
  background-color: #E95440;
  border-color: #E95440;
  color: #fff;
}

.cardService-btn--ghost {
  background-color: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.45);
  color: #fff;
}

.cardService-btn--ghost:hover,
.cardService-btn--ghost:focus-visible {
  background-color: #fff;
  border-color: #fff;
  color: #181A1F;
}

/* Touch devices never fire :hover — show the copy and the actions outright
   rather than leaving the card with a title and no way into it.

   2026-08-14, second pass: this used to force the DESCRIPTION open too
   (`opacity:1` on .cardDesc), unconditionally, on every touch device — and
   that state fought with the (now-removed) `:hover` rules above, which
   phones apply and hold on tap regardless of this media feature ("sticky
   hover" — `hover:none` describes the input mechanism, it does not stop the
   `:hover` pseudo-class from matching). Inside the services swiper, a drag
   crossing a card was enough to toggle it, so the description flashed open
   and closed mid-swipe. Now that no `:hover` ruleset exists for touch
   devices to accidentally trigger (gated behind `(hover: hover)` further up),
   the fix is to also stop forcing the description open here — it stays
   hidden on touch, full stop, matching how the card already looks at rest.
   The actions (View details / Book now) stay reachable without needing a
   hover touch cannot reliably produce. */
@media (hover: none) {
  .cardService--reveal .cardInfo .cardTitle {
    transform: none;
    margin-bottom: 12px;
  }

  .cardService--reveal .cardInfo .box-inner-info {
    height: auto;
    max-height: none;
    opacity: 1;
    overflow: visible;
    transform: none;
  }

  .cardService--reveal .cardInfo .box-inner-info .cardDesc {
    display: none;
  }

  .cardService--reveal .cardInfo .cardService-actions {
    opacity: 1;
    transform: none;
  }

  .cardService--reveal .cardImage::after {
    opacity: 1;
  }
}

/* Reduced motion drops the movement — the zoom, the float, the stagger — but
   keeps a short cross-fade so the card still reads as changing state rather
   than snapping. Note this kicks in whenever Windows' "Animation effects" (or
   the macOS "Reduce motion" switch) is off, which is easy to hit by accident.
   `:hover` variants only exist under `(hover: hover)` now (see above), so
   they are neutralised there rather than listed here — nesting one media
   condition inside another keeps that scoping intact. */
@media (prefers-reduced-motion: reduce) {
  .cardService--reveal .cardImage img,
  .cardService--reveal:focus-within .cardImage img {
    transform: none;
    transition: none;
  }

  .cardService--reveal .cardImage::after,
  .cardService--reveal:focus-within .cardImage::after {
    transition: opacity 0.2s ease;
  }

  .cardService--reveal .cardInfo .cardTitle,
  .cardService--reveal:focus-within .cardInfo .cardTitle {
    transform: none;
    transition: margin-bottom 0.2s ease;
  }

  .cardService--reveal .cardInfo .box-inner-info,
  .cardService--reveal:focus-within .cardInfo .box-inner-info {
    transform: none;
    transition: opacity 0.2s ease;
  }

  .cardService--reveal .cardInfo .box-inner-info .cardDesc,
  .cardService--reveal:focus-within .cardInfo .box-inner-info .cardDesc,
  .cardService--reveal .cardInfo .cardService-actions,
  .cardService--reveal:focus-within .cardInfo .cardService-actions {
    transform: none;
    transition: opacity 0.2s ease;
  }
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: reduce) {
  .cardService--reveal:hover .cardImage img {
    transform: none;
    transition: none;
  }

  .cardService--reveal:hover .cardImage::after {
    transition: opacity 0.2s ease;
  }

  .cardService--reveal:hover .cardInfo .cardTitle {
    transform: none;
    transition: margin-bottom 0.2s ease;
  }

  .cardService--reveal:hover .cardInfo .box-inner-info {
    transform: none;
    transition: opacity 0.2s ease;
  }

  .cardService--reveal:hover .cardInfo .box-inner-info .cardDesc,
  .cardService--reveal:hover .cardInfo .cardService-actions {
    transform: none;
    transition: opacity 0.2s ease;
  }
}

/* ==========================================================================
   Home hero — mobile layout (rebuilt 2026-08-14)
   The previous fix in this block only shrank `.box-cover-image`'s height and
   assumed the existing `top:30%` positioning of `.box-banner-info` would just
   re-center inside it. It did not: `.box-banner-info` is `position:absolute`
   with no `height`/`bottom`, so it grows to fit its own content (audience
   switch + eyebrow + two-line heading + three-line lead + two CTAs) and, on a
   phone-width viewport, that content is comfortably taller than any of the
   short pixel heights tried here. Since `.box-banner-homepage-2`'s own
   rendered height comes ONLY from the in-flow `.box-cover-image` sibling, the
   overflowing absolute-positioned text spilled straight past the box's
   bottom edge into whatever follows in normal flow — the "Our Services"
   heading and the CTAs rendered on top of each other. Verified live at a true
   390px viewport via an iframe (Chrome's own window resize would not go
   narrow enough on this machine) — see the screenshots this fix was built
   against for the actual failure mode.

   Fix: stop predicting a pixel height for the text block. `.box-banner-info`
   becomes an in-flow flex child on mobile, pushed to the bottom of the hero
   with `margin-top:auto` — the same "tall image, copy anchored low" layout
   the reference (SilverDrive) uses. `min-height` is only a floor for how much
   photo shows above the copy; if translated text runs longer, the column
   grows instead of overflowing. `.box-cover-image` moves to `position:absolute;
   inset:0` so it covers the flex column's full (now content-aware) height
   instead of dictating it. `.hero-scroll-down` drops out of `position:absolute`
   for the same reason — it used to sit at a fixed distance from a bottom edge
   that content could grow past.

   Second pass: the floor itself (620/560/520/480px across the four tiers)
   was still well short of an actual phone's viewport height, so the hero
   visibly ended partway down the screen instead of reading as a full-bleed
   photo — "csak félig látszik". Replaced with `100svh` (small viewport
   height — excludes the address bar, so it doesn't jump when it hides/shows
   on scroll; `100vh` is the pre-`svh` fallback for older browsers) applied
   once and left alone across every mobile tier, matching the reference.
   Bump ?v= in layouts/frontend.blade.php on change.
   ========================================================================== */

@media (max-width: 991.98px) {
  .banner-home5 .box-banner-homepage-2 {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100svh;
  }
  .banner-home5 .box-banner-homepage-2 .box-cover-image {
    position: absolute;
    inset: 0;
    height: 100%;
    background-size: cover;
    background-position: center;
  }
  .banner-home5 .box-banner-info {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    margin: auto 0 0;
    /* padding-top floors the gap from the column's top edge at header height
       (60px, position:absolute at rest) + clearance — needed because on
       longer translations (mostly hu) the text block's own content already
       fills the whole column, leaving margin-top:auto nothing to push with;
       without this floor the audience-switch pills render at y:0, directly
       under the header. Left/right 20px matches the reference's
       .box-banner-info gutter — the text block ran edge-to-edge before. */
    padding: 96px 20px 28px;
  }
  .banner-home5 .hero-scroll-down {
    position: relative;
    left: auto;
    bottom: auto;
    transform: none;
    margin: 20px auto 28px;
  }
}

/* The black .btn-primary CTA reads as bare text on the hero's dark image —
   give it a visible edge, matching the outlined pill the reference uses.
   Scoped to the hero only; other .btn-primary buttons sit on light surfaces
   where solid black already has contrast. */
.banner-home5 .hero-actions .btn.btn-primary {
  border: 1px solid rgba(255, 255, 255, 0.65);
}

/* ==========================================================================
   Header — mobile row (rebuilt 2026-08-14, second pass)
   `.header-top-2 a` carries `d-inline-block w-50`, Bootstrap utility classes
   that do not exist in this stylesheet (no Bootstrap CSS is loaded, only its
   JS bundle) — dead classes, not a fix. The logo `<img>` has no width rule at
   all, so it rendered at the SVG's baked-in intrinsic size (502×89, see
   assets/imgs/logo/LH_logo_white.svg). Flex items default to `min-width:auto`,
   which floors a flex item's shrinkability at its content's intrinsic size —
   so `.header-top-2` refused to shrink below the logo's ~500px, squeezing
   `.header-top-3` down until "EN"/"HU" wrapped onto separate lines.

   First pass just shrank the logo and reserved space for the burger icon
   next to a still-present inline language switcher — at anything narrower
   than ~400px the row was tight again. The switcher is redundant: the
   off-canvas menu every `.burger-icon` already opens
   (`.mobile-header-active`, toggled by main.js `mobileHeaderActive()`)
   contains its own `nav.lang-switch.lang-switch-mobile` — so on mobile the
   header-bar copy is dropped entirely rather than fought for space.
   Verified live via the iframe technique at 320/360/390px: logo, language
   switch is gone from the bar, burger sits clear on its own.
   ========================================================================== */

@media (max-width: 767.98px) {
  .header-top-2 {
    display: flex;
    align-items: center;
  }
  .header-top-2 img {
    /* `display:block` kills the default inline image's baseline gap (a few
       px of phantom space below the image reserved for descenders) — without
       it the logo sat visibly off-center against the burger even though both
       are centered flex items in the same `.header-top` row. Floored at
       170px (was 120px) — read as too small next to the burger. */
    display: block;
    width: 44vw;
    min-width: 170px;
    max-width: 210px;
    height: auto;
  }
  .header-top-3 {
    flex-shrink: 0;
    display: flex;
    align-items: center;
  }
  .header-top-3 .lang-switch {
    display: none !important;
  }
  /* The burger is `position:absolute` by default (base `.burger-icon` rule),
     which pulls it out of `.header-top`'s flex flow entirely. Nothing between
     it and `.header-homepage5` sets `position`, so it was positioning itself
     against the whole floating header box via a hand-tuned `top`/`right`
     offset — not against the row that holds the logo — which is why it drifted
     out of vertical alignment whenever that row's height changed.

     First attempt set `position: static` to drop it into `.header-top-3`'s
     flex flow so `align-items:center` would place it. That broke the icon
     entirely: its two bars (`.burger-icon-mid`/`.burger-icon-bottom`) are
     `position:absolute` against *it* (base rule) — with the icon itself
     `static`, they lost their containing block and jumped to whatever
     positioned ancestor was next (the header itself), rendering as
     full-width stray lines instead of a 24×20 icon. `position: relative`
     keeps it in flex flow (so it still gets centered and aligned with the
     logo) while still being a valid containing block for its own bars. */
  .header-top-3 .burger-icon {
    position: relative;
    top: auto;
    right: auto;
  }
}

/* ==========================================================================
   Our Fleet — no inner-card image swiper on mobile
   The JS (partials/home/fleet.blade.php) skips creating the Swiper instance
   for `.card-img-swiper` below 768px, so `.card-img-pagination` never gets
   populated with bullets and the arrows never get real prev/next handlers —
   both would otherwise sit there doing nothing. Hidden here for clarity
   rather than relying on "an empty pagination renders as nothing".
   ========================================================================== */

@media (max-width: 767.98px) {
  .card-img-swiper .card-img-pagination,
  .card-img-swiper .card-img-btn-prev,
  .card-img-swiper .card-img-btn-next {
    display: none !important;
  }
}

/* ==========================================================================
   Book Your Ride — glass CTA band (2026-08-14, ügyfélkérés)
   Was a plain light-gray (.bg-1) section, a bullet list and one button — the
   reference for "attractive" here is the glass-panel CTA on silverdrive.nl.
   Section goes dark (matches the hero/services rhythm already on this page);
   content sits in a rounded, blurred "glass" card over a soft gold glow.
   Bump ?v= in layouts/frontend.blade.php on change.
   ========================================================================== */

.box-booking-cta {
  background-color: #0b0b0d;
  overflow: hidden;
}

.booking-cta-card {
  position: relative;
  max-width: 860px;
  margin: 0 auto;
  padding: 64px 60px;
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: linear-gradient(
    155deg,
    rgba(200, 169, 110, 0.1),
    rgba(255, 255, 255, 0.035) 55%,
    rgba(255, 255, 255, 0.02)
  );
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
  overflow: hidden;
}

.booking-cta-glow {
  position: absolute;
  top: -40%;
  left: 50%;
  width: 620px;
  height: 620px;
  transform: translateX(-50%);
  background: radial-gradient(circle, rgba(200, 169, 110, 0.28) 0%, rgba(200, 169, 110, 0) 68%);
  pointer-events: none;
  z-index: 0;
}

.booking-cta-card > * {
  position: relative;
  z-index: 1;
}

.booking-cta-lead {
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
  opacity: 0.8;
}

.booking-cta-ticks {
  list-style: none;
  margin: 40px 0 44px;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 24px;
}

.booking-cta-ticks li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
}

.booking-cta-ticks li svg {
  flex-shrink: 0;
  margin-top: 2px;
  color: #c8a96e;
}

.booking-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 17px 34px;
  border-radius: 999px;
  background-color: #c8a96e;
  color: #181A1F;
  font-size: 16px;
  font-weight: 600;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.booking-cta-btn:hover {
  background-color: #E95440;
  color: #fff;
  transform: translateY(-2px);
}

@media (max-width: 767.98px) {
  .booking-cta-card {
    padding: 44px 24px;
    border-radius: 22px;
  }
  .booking-cta-ticks {
    grid-template-columns: 1fr;
    margin: 30px 0 34px;
  }
  .booking-cta-btn {
    width: 100%;
  }
}

/* ==========================================================================
   Footer — compact glass treatment on mobile (2026-08-14, ügyfélkérés)
   Desktop is untouched. On a phone the four-column footer-1 block (address /
   phone / hours / quick links) collapses into a single stack already via the
   theme's own responsive grid; this only adds the glass panel and tightens
   the vertical rhythm so it reads as one compact block instead of four full-
   width stacked sections.
   ========================================================================== */

@media (max-width: 767.98px) {
  .footer-1 {
    margin: 0 16px 16px;
    padding: 28px 20px;
    border-radius: 22px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.04);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
  }
  .footer-1 .row.mb-40 {
    margin-bottom: 0;
  }
  .footer-1 .col-lg-3 {
    margin-bottom: 22px;
  }
  .footer-1 .col-lg-3:last-child {
    margin-bottom: 0;
  }
  .footer-2 .footer-bottom {
    padding: 20px 16px;
  }
}

/* ==========================================================================
   Visual redesign toward the silverdrive.nl reference (2026-08-14, package A)
   Display font + floating glass header/mobile menu on the home page.
   See .vibe/sample/001-hero.png and 002-menu.png for the target look.
   ========================================================================== */

/* LH-0xx (2026-08-15): was Playfair Display italic — read as "béna" (dorky).
   Back to the site's own DM Sans, upright; kept as a named class (rather than
   deleted) since every heading/caption that opted into the serif accent still
   marks itself with it and now just gets a heavier upright DM Sans weight. */
.font-display {
  font-family: "DM Sans", sans-serif;
  font-style: normal;
  font-weight: 700;
}

/* --- Floating glass header — home page, mobile only ----------------------
   `.header` is `position:relative` by default (in normal flow, the hero
   starts below it); only the JS-toggled `.stick` class (after scrolling)
   made it `position:fixed`. The reference floats a translucent header over
   the hero from the very first frame. `.header-homepage5` is already the
   home-only variant (routes/web.php's audience default vs. header-homepage4
   on booking/services) — that is the hook, inner pages are untouched. */
@media (max-width: 767.98px) {
  .header.header-homepage5 {
    position: fixed;
    top: 0;
    left: 0;
    width: calc(100% - 32px);
    margin: 14px 16px 0;
    border-radius: 20px;
    background: rgba(20, 20, 22, 0.45);
    border: 1px solid rgba(255, 255, 255, 0.14);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
  }
  /* The `.stick` scroll state used to be the only fixed/opaque state; now the
     resting state already is, so `.stick` only needs to not visually clash —
     same background, no extra border-bottom. */
  .header.header-homepage5.stick {
    background: rgba(20, 20, 22, 0.45);
    border: 1px solid rgba(255, 255, 255, 0.14);
  }
  /* `.header-homepage5.stick .header-top-main { display:none }` (this file,
     further up) is a desktop-only assumption: it hides the top row (logo +
     burger) once stuck because `.header-top-sub`'s desktop nav + login button
     take over as the visible row. On mobile `.header-top-sub` is itself
     `display:none` below 1199.98px, so the stuck state showed neither row —
     "sticky menü tök üres". Same specificity as the rule it overrides, so
     source order (this comes later in the file) decides. */
  .header-homepage5.stick .header-top-main {
    display: block;
  }
  .header-homepage5 .header-top-main {
    border-bottom: 0;
  }
  .header-homepage5 .header-top-1 {
    display: none;
  }
  .header-homepage5 .header-top {
    padding: 10px 4px;
  }
}

/* --- Mobile menu — dark glass panel, icon rows ---------------------------- */
.mobile-menu--glass.mobile-header-wrapper-style {
  background-color: rgba(12, 12, 14, 0.85);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
  padding-top: 96px;
}

.mobile-menu-close {
  position: absolute;
  top: 22px;
  right: 22px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  cursor: pointer;
  z-index: 2;
}

.mobile-menu--glass .mobile-menu li {
  padding: 12px 30px !important;
  border-bottom: 0 !important;
}

/* !important throughout: the theme's own rule for this link
   (`.mobile-header-wrapper-style .mobile-header-wrapper-inner
   .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li a`,
   style.css:3621) is a 6-deep chain — (0,5,3) beats this modifier-class
   selector's (0,2,2) on specificity alone, `display:inline-block` included,
   which would silently drop the icon+text flex layout. */
.mobile-menu--glass .mobile-menu li a {
  display: flex !important;
  align-items: center;
  gap: 18px;
  font-family: "DM Sans", sans-serif !important;
  font-size: 30px !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  color: #fff !important;
  text-transform: none !important;
}

.mobile-menu--glass .mobile-menu li a.active {
  color: #c8a96e !important;
}

.mobile-menu--glass .mobile-menu li a .mobile-menu-icon {
  flex-shrink: 0;
  color: rgba(255, 255, 255, 0.55);
}

.mobile-menu-social {
  margin: 20px 30px 0;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.mobile-menu-social-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}

.mobile-menu--glass .lang-switch-mobile {
  margin: 20px 30px 0;
}

/* ==========================================================================
   Package B — Hero: rounded bottom corners, single CTA on mobile
   Extends (does not replace) the "Home hero — mobile layout" block above —
   that block already made `.box-banner-homepage-2` a flex column filling
   100svh with the text anchored to the bottom; this only adds the rounded
   bottom edge, a dark section backdrop behind it, and drops the second CTA.
   See .vibe/sample/001-hero.png.
   ========================================================================== */

@media (max-width: 767.98px) {
  /* The section itself needs a dark fill, or the rounded corners of the box
     inside it would reveal the page's white default background at the curve. */
  section.banner-home5 {
    background-color: #0b0b0d;
  }
  .banner-home5 .box-banner-homepage-2 {
    border-radius: 0 0 32px 32px;
    overflow: hidden;
  }
  .banner-home5 .hero-cta-fleet {
    display: none;
  }
  .banner-home5 .hero-actions {
    justify-content: center;
  }
  /* .btn.hero-cta-book (4 classes) — matches/beats the earlier package's
     `.banner-home5 .hero-actions .btn` (style.css, "hero-actions" block
     above), which set `flex:1 1 0` for the two-button side-by-side layout;
     with only one button left that rule would still stretch it edge to edge. */
  .banner-home5 .hero-actions .btn.hero-cta-book {
    flex: 0 1 auto;
    min-width: 220px;
    border-radius: 999px;
    padding: 16px 32px;
  }
}

/* ==========================================================================
   Package C — Service tiles, shared by Home and /services
   (partials/services/card.blade.php). Full-bleed portrait photo, bottom
   scrim, name always visible (no hover-gated reveal), circular book link.
   Replaces the swiper + .cardService--reveal hover card entirely on both
   surfaces. See .vibe/sample/003-services-at-main-layout.png.
   ========================================================================== */

.service-tile-lux-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.service-tile-lux {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  aspect-ratio: 3 / 4;
}

.service-tile-lux-link {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  background-color: #14141a;
  background-size: cover;
  background-position: center;
  padding: 24px 76px 24px 24px;
  transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.service-tile-lux-scrim {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(
    to top,
    rgba(8, 8, 10, 0.92) 0%,
    rgba(8, 8, 10, 0.55) 32%,
    rgba(8, 8, 10, 0) 62%
  );
}

.service-tile-lux-name {
  position: relative;
  z-index: 1;
  color: #fff;
  font-size: 26px;
  line-height: 1.25;
}

.service-tile-lux-cta {
  position: absolute;
  z-index: 2;
  right: 20px;
  bottom: 20px;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.service-tile-lux-cta:hover,
.service-tile-lux-cta:focus-visible {
  background: #c8a96e;
  border-color: #c8a96e;
  color: #181A1F;
}

@media (hover: hover) and (pointer: fine) {
  .service-tile-lux-link:hover {
    transform: scale(1.04);
  }
}

@media (min-width: 768px) {
  .service-tile-lux-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
}

@media (min-width: 1200px) {
  .service-tile-lux-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .business .service-tile-lux-grid {
    grid-template-columns: repeat(4, 1fr);
  }

}

/* ==========================================================================
   Package D — Fleet tiles (partials/home/fleet.blade.php)

   Revised 2026-08-15 (third pass):
   - Structure now mirrors the service tiles (.service-tile-lux): an
     overflow-hidden frame (`.fleet-tile-lux`, a <div>) holds a separate,
     absolutely-positioned photo layer (`.fleet-tile-lux-media`) that scales
     on hover, plus a non-scaling CTA button as a sibling — not a nested
     anchor, same as the service card. This is what gives it the same "life"
     on hover the service tiles already had, which the single-<a> version
     (photo + scrim + text all on one element) couldn't do without the whole
     frame — border-radius and all — visibly growing on hover.
   - Caption moved from a single bottom-scrim block to three fixed slots: name
     top-left, category as a pill top-right ("Executive", "S-Class", …),
     passenger/luggage counts bottom-left — the CTA already owns bottom-right.
     Two shallow vignettes (top + bottom) light only enough to read each
     corner, leaving the middle of the frame clear — a full scrim in either
     direction had buried the car itself ("nem látszik az autó").
   - Two columns from tablet width up (was full-bleed single column at every
     size); aspect ratio unified to 4/3 at both tiers instead of switching to
     a 21/9 banner shape on desktop.
   ========================================================================== */

.box-our-fleet-home8 {
  background-color: #0b0b0d;
}

.fleet-tile-lux-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

@media (min-width: 768px) {
  .fleet-tile-lux-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
}

.fleet-tile-lux {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  background-color: #14141a;
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

@media (hover: hover) and (pointer: fine) {
  .fleet-tile-lux:hover {
    box-shadow: 0 20px 44px rgba(0, 0, 0, 0.4);
    transform: translateY(-4px);
  }
}

.fleet-tile-lux-media {
  position: absolute;
  inset: 0;
  display: block;
  background-size: cover;
  background-position: center;
  transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}

@media (hover: hover) and (pointer: fine) {
  .fleet-tile-lux:hover .fleet-tile-lux-media {
    transform: scale(1.06);
  }
}

.fleet-tile-lux-scrim-top {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(8, 8, 10, 0.85) 0%,
    rgba(8, 8, 10, 0.4) 22%,
    rgba(8, 8, 10, 0) 42%
  );
}

.fleet-tile-lux-scrim-bottom {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(8, 8, 10, 0.8) 0%,
    rgba(8, 8, 10, 0.35) 20%,
    rgba(8, 8, 10, 0) 40%
  );
}

.fleet-tile-lux-top {
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  top: 0;
  padding: 20px 22px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.fleet-tile-lux-name {
  color: #fff;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.25;
}

.fleet-tile-lux-category {
  flex-shrink: 0;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.24);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  white-space: nowrap;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.fleet-tile-lux-badges {
  position: absolute;
  z-index: 1;
  left: 0;
  bottom: 0;
  padding: 20px 22px;
  display: flex;
  gap: 8px;
}

.fleet-tile-lux-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
}

.fleet-tile-lux-cta {
  position: absolute;
  z-index: 1;
  right: 20px;
  bottom: 20px;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

@media (hover: hover) and (pointer: fine) {
  .fleet-tile-lux:hover .fleet-tile-lux-cta {
    background: #c8a96e;
    border-color: #c8a96e;
    color: #181A1F;
    transform: scale(1.08);
  }
}

/* ==========================================================================
   Package E — .theme-dark: site-wide dark theme override layer
   Applied to: home Contact section (partials/home/contact.blade.php),
   /services index + show (pages/services/*.blade.php). NOT applied to the
   booking wizard — that is package F, a separate, larger follow-up (its own
   form controls, date/time pickers, vehicle picker cards, error states).

   Mechanism: the theme's own color utilities are used everywhere and are
   `!important` (e.g. `.color-text { color:#181A1F !important }`, style.css
   line 415) — normal specificity cannot beat `!important` from a lower-
   specificity selector, so `.theme-dark .color-text` alone would lose despite
   being more specific. Matching `!important` here, on a 2-class selector,
   *does* win over the original 1-class `!important` rule (specificity is
   still compared when both sides carry `!important`). This means every
   colored utility class actually used inside a `.theme-dark` section needs
   exactly one override line here — not each individual element.
   ========================================================================== */

.theme-dark {
  background-color: #0b0b0d;
}

.theme-dark .color-text {
  color: #fff !important;
}

.theme-dark .color-grey {
  color: rgba(255, 255, 255, 0.65) !important;
}

.theme-dark .form-control {
  background-color: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.16);
  color: #fff;
}

.theme-dark .form-control::placeholder {
  color: rgba(255, 255, 255, 0.4);
}

.theme-dark .form-control:focus {
  border-color: #c8a96e;
}

/* Contact section's floating info card (box-user-info) — was a solid white
   card with `top:-240px` (deliberately overlapping the section above it);
   kept the overlap, swapped the surface for the same glass treatment used
   on the CTA band and footer (2026-08-14, earlier in this file). */
.theme-dark .box-user-info {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
}

.theme-dark .box-user-info .list-info-user li {
  border-bottom-color: rgba(255, 255, 255, 0.12);
}

/* /services/show — CTA divider and the admin-authored rich-text body
   (service-single-content: headings/lists inherit color, no override needed
   there beyond .color-text above, which already wraps it). */
.theme-dark .service-single-cta {
  border-top-color: rgba(255, 255, 255, 0.12);
}

@media (max-width: 767.98px) {
  .theme-dark .service-single-cta-actions .btn {
    flex: 1 1 100%;
    justify-content: center;
  }
}

/* Floating WhatsApp chat widget (2026-08-20) — click-to-chat via wa.me, number
   from .env WHATSAPP_NUMBER (config/services.php, components/layouts/whatsapp-widget).
   No external plugin/dependency. z-index 900 is deliberately below the sticky
   header (1004) and the mobile off-canvas menu (1003) so it never floats on
   top of either. */
.whatsapp-widget {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 900;
}

.whatsapp-widget-fab {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: #25D366;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
  transition: transform 0.2s ease;
}

.whatsapp-widget-fab:hover {
  transform: scale(1.08);
}

.whatsapp-widget-fab svg {
  width: 30px;
  height: 30px;
  fill: #fff;
}

.whatsapp-widget-pulse {
  position: absolute;
  top: -2px;
  right: -2px;
  width: 14px;
  height: 14px;
  background: #34D399;
  border: 2px solid #fff;
  border-radius: 50%;
  animation: whatsapp-pulse 1.8s infinite;
}

@keyframes whatsapp-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.6);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(52, 211, 153, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(52, 211, 153, 0);
  }
}

.whatsapp-widget-bubble {
  position: absolute;
  right: 0;
  bottom: 76px;
  width: 280px;
  background: #fff;
  color: #181A1F;
  border-radius: 16px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.3);
  padding: 18px 18px 16px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
}

.whatsapp-widget-bubble.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.whatsapp-widget-bubble-close {
  position: absolute;
  top: 10px;
  right: 12px;
  border: 0;
  background: transparent;
  font-size: 20px;
  line-height: 1;
  color: #8A8F98;
  cursor: pointer;
  padding: 4px;
}

.whatsapp-widget-bubble-close:hover {
  color: #181A1F;
}

.whatsapp-widget-bubble-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  padding-right: 20px;
}

.whatsapp-widget-avatar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background-color: #25D366;
}

.whatsapp-widget-avatar svg {
  width: 20px;
  height: 20px;
  fill: #fff;
}

.whatsapp-widget-bubble-header strong {
  display: block;
  font-size: 14px;
  color: #181A1F;
}

.whatsapp-widget-status {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: #6B7280;
}

.whatsapp-widget-status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: #34D399;
}

.whatsapp-widget-bubble-text {
  font-size: 13px;
  line-height: 1.5;
  color: #4B5157;
  margin-bottom: 14px;
}

.whatsapp-widget-cta {
  display: block;
  text-align: center;
  background-color: #25D366;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  border-radius: 40px;
  padding: 9px 16px;
  transition: background-color 0.2s ease;
}

.whatsapp-widget-cta:hover {
  background-color: #1EBE5A;
  color: #fff;
}

@media (max-width: 576px) {
  .whatsapp-widget {
    right: 16px;
    bottom: 16px;
  }

  .whatsapp-widget-bubble {
    width: calc(100vw - 32px);
    right: -8px;
  }
}