@font-face {
    font-family: 'Nunito';
    src: URL('../fonts/Nunito-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Nunito-bold';
    src: URL('../fonts/Nunito-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'Michroma-Regular';
    src: URL('../fonts/Michroma-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'ReemKufi-Bold';
    src: URL('../fonts/ReemKufi-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'ReemKufi-Medium';
    src: URL('../fonts/ReemKufi-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'ProstoOne-Regular';
    src: URL('../fonts/ProstoOne-Regular.ttf') format('truetype');
}

* {
    box-sizing: border-box;
    transition: all .3s;
    border-width: .1em;
    list-style-type: none;
    text-decoration: none;
}

*::first-letter,
html::first-letter,
body::first-letter { text-transform: capitalize; }

html, body {
    margin: 0; padding: 0;
    background: #F1F1F1;
    font-family: 'Poppins';
    font-weight: 300;
    scroll-behavior: smooth;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 500; }
p { margin: 0; }

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    box-shadow: 0 0 0 10em #fff inset !important;
}

input:-webkit-autofill { -webkit-text-fill-color: #000 !important; }

.center, .center-between, .center-left,
.center-column, .center-column-left, .center-right {
    display: flex;
    justify-content: center;
    align-items: center;
}

.center-left { justify-content: flex-start; }
.center-right { justify-content: flex-end; }
.center-column, .center-column-left { flex-direction: column; }
.center-column-left { align-items: flex-start; }
.center-between { justify-content: space-between; }

.center-custom,
.center-custom-between,
.center-custom-left,
.center-custom-column,
.center-custom-column-left,
.center-custom-right {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.center-custom-left { justify-content: flex-start; }
.center-custom-right { justify-content: flex-end; }
.center-custom-column, .center-custom-column-left { flex-direction: column; }
.center-custom-column-left { align-items: flex-start; }
.center-custom-between { justify-content: space-between; }
.input-required { color: #cf3838; }
.input-disabled { pointer-events: none; opacity: .7; }
.fw { width: 100%; }
.fh { height: 100%; }
.fill { height: 100%; width: 100%; }

table { border-collapse: separate; border-spacing: 0; width: 100%; }
th { font-family: 'Poppins'; color: #eee; height: 2.3em; font-weight: 500; }
th, td { padding: .5em 1.5em; text-align: center; }
.td-left { text-align: left; }
.td-right { text-align: right; }
tr { cursor: pointer; background: #fff; overflow: hidden; }
tbody tr:hover { background: #eeea; }

.mt-0-5 { margin-top: .5em; }
.mt-1 { margin-top: 1em; }
.mt-1-5 { margin-top: 1.5em; }
.mt-2 { margin-top: 2em; }
.mt-2-5 { margin-top: 2.5em; }
.ml-1 { margin-left: 1em; }
.ml-2 { margin-left: 2em; }
.mr-1 { margin-right: 1em; }
.mtb { margin: 1em 0; }
.mr-l1 { margin-left: 1em; }
.mr-1 { margin: 1em; }
.mr-07 { margin: .7em; }
.ml-07 { margin-left: .7em; }
.ml-05 { margin-left: .5em; }
.pd-1 { padding: 1em; }
.datepicker { position: relative; }

.datepicker input {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    opacity: 0;
}

.datepicker input::-webkit-calendar-picker-indicator {
    position: absolute;
    left: 0; top: 0;
    width: 100%; height: 100%;
    margin: 0; padding: 0;
    opacity: 0;
    cursor: pointer;
}

.datepicker-value { margin: .1em; }

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    margin: 0;
}

input,
textarea {
    border: none;
    color: #222;
    font-weight: 400;
    font-family: 'Inter';
    background: transparent;
}

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

main { position: relative; min-height: 100vh; }

.arrow {
    border: solid #345897;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 2px;
}
.arrow-right { transform: rotate(-45deg); }
.arrow-left { transform: rotate(135deg); }
.arrow-up, .arrow-active { transform: rotate(-135deg); }
.arrow-down { transform: rotate(45deg); }

.loader {
    border: 8px solid #f3f3f360;
    border-top: 8px solid #003580;
    aspect-ratio: 1/1;
    width: 64px;
    border-radius: 100%;
    animation: spin 1.2s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg);}
    100% { transform: rotate(360deg); }
}

.btn-outline {
    cursor: pointer;
    padding: .3em .7em;
    border: solid 1px #003580;
    color: #003580;
}

.btn-outline:hover,
.btn-outline-active { color: #eee; background: #003580; }
.btn-delete { cursor: pointer; color: #345897; font-size: 1.2em !important; }
.btn-delete:hover { color: #eb3f3f; }

.btn-range {
    color: #fff;
    padding: .5em 1.3em;
    cursor: pointer;
    background: #e26331;
    border: 1px solid #e26331;
}

.btn-range:hover { color: #e26331; border: 1px solid #e26331; background: #FEC32033; }
.btn-range-disbaled { color: #e26331; background: #FEC32022; opacity: .6; }

.bdg {
    padding: 2px 4px;
    color: #fff;
    white-space: nowrap;
    margin: .5em;
    width: 7.5em;
    text-align: center;
}

.bdg-A { background: #0d7324; z-index: 1; }
.bdg-S { background: #E26329; z-index: 2; }
.bdg-N { background: #bf3a25; z-index: 3; }
.bdg-A-o {
    border: 1px solid #0d7324;
    color: #0d7324;
    background: transparent;
    animation: blinking 1s linear infinite;
}

@keyframes blinking {
    0% { opacity: 1; }
    50% { opacity: .3; }
    100% { opacity: 1; }
}

.bdg-S-o { border: 1px solid #E26329; color: #E26329; background: transparent; }
.bdg-N-o { border: 1px solid #bf3a25; color: #bf3a25; background: transparent; }

.model-wrapper {
    position: fixed;
    z-index: 11;
    top: 0; left: 0;
    width: 100vw;
    height: 100vh;
    display: none;
}

.model-bg {
    position: fixed;
    top: 0; left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -1;
    background: #3333;
    backdrop-filter: blur(4px);
}

.model-wrapper-active { display: flex; }
.model {
    min-width: 18em;
    background-color: #fff;
    flex-direction: column;
    overflow: hidden;
}
.model-title { width: 100%; padding: 1em; }
.model-body { margin-top: 1em; }
.paper { background: #fff; }

/* --- reservation page ---*/
.reservation-section { background: #fff; padding: 2em; width: 100%; }
.reservation-title { margin-bottom: .5em; font-weight: 500; }
.reservation-title .fa { margin-right: .3em; }
.pagination { margin-top: 1em; }
.pagination-nbr { margin: 4px; padding: 0.3em 1em !important; }
.pagination-hide { display: none !important; }

.disable-scroll { overflow: auto; }
.input-phone { position: relative; }
.input-phone input { padding-left: 5em; }

.input-phone-country {
    position: absolute;
    top: 4px; left: 4px;
    border-right: 1px solid #a1a8b3;
    padding-right: 4px;
}

.city-arrow { position: absolute; right: 3em; bottom: 15.3em; }

.list-cities {
    position: absolute;
    top: 4.8em;
    z-index: 2;
    width: 18em;
    max-width: 18em;
    max-height: 0;
    background: #f2f5f5;
    overflow: auto;
}
.theme-icon i { text-transform: initial; }
.list-cities-active { max-height: 10em; }
.item-city { cursor: pointer; padding: .7em; }
.item-city:hover { background: #ccc7; }

@keyframes input_error {
    0% { border-color: #e11e1e; }
    50% { border-color: inherit; }
    100% { border-color: #e11e1e; }
}

@keyframes label_error {
    0% { color: #e11e1e; }
    50% { color: inherit; }
    100% { color: #e11e1e; }
}

.input-error,
.input-error+select {
    border: 1px solid #e11e1e;
    animation: input_error 1.2s linear infinite;
}

.label-error {
    color: #e11e1e;
    background: #e11e1e53 !important;
    animation: label_error 1.2s linear infinite;
}

.input-passport {
    cursor: pointer;
    display: flex !important;
    margin: 0 !important;
    margin-left: .5em !important;
    white-space: nowrap;
}

.input-passport .input-file {
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

.input-passport .fa {
    font-size: 1.5em;
    margin-left: .5em;
}

.input-passport-active {
    background: #2ad15167 !important;
}
.input-passport-active span {
    color: #38de5f;
}

.filter-fab {
    display: none;
    position: fixed;
    bottom: 1em; right: 1em;
    padding: 1.5em;
    width: 1em; height: 1em;
    z-index: 1;
    color: #222;
    cursor: pointer;
    background: #FEC320;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.sub-nav {
    position: absolute;
    top: 2em;
    z-index: 11;
    display: flex;
    flex-direction: column;
    background: #fff;
    max-height: 0;
    overflow: hidden;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}

.sub-nav-active { max-height: 5em; }

@media only screen and (min-width: 1040px) {
    html, body { cursor: url(../icons/cursor.png), pointer; }
}

@media only screen and (max-width: 720px) {
    .filter-fab { display: flex; }
}

@media only screen and (max-width: 1040px) {
    .input-passport { cursor: pointer; margin: 0 !important; }
    .disable-scroll { overflow: hidden; }
    .input-half { width: 100%; }
    .input-half-left, .input-half-right { padding: 0; margin-top: 1em; }
    .round-input { margin: 0; margin-top: .5em; }
}

/* addaxbooking */
hr { border-width: 1px; }
.pc { color: #003580; }
.hidden { display: none; }

.pb { background-color: #003580;
    background: linear-gradient(90.29deg, #003580 0.25%, #0957C6 99.35%); }
.sd { box-shadow: 8px 8px 32px 4px rgb(112 144 176 / 25%); }
.fa-star { color: #D9D9D9; }
.checked { color: #FFD84E; }

.btn {
    position: relative;
    cursor: pointer;
    padding: .75em 1.5em;
    color: #fff;
    border: solid 2px #003580;
    background: #003580;
    font-family: 'Poppins';

}

.btn .arrow { border-color: #fff; margin-left: .5em; }
.btn:hover .arrow { border-color: #003580; }
.btn:hover, .btn-active { color: #003580; background: transparent; }

.btn-pro {
    border: solid 1px #009FE3;
    color: #fff;
    background: #009FE3;
    white-space: nowrap;
}

.btn-pro:hover { color: #009FE3; background: transparent; }
.btn-offer { font-size: .86em; padding: 0.5em 1.5em; }

.sb-select,
.sb-input {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    font-size: 1.1em;
}

.sb-select select,
.sb-select .select{
    width: 100%;
    height: 2.3em;
    padding: 0em 2.3em .5em .5em;
    min-width: 6em;
    font-size: 1em;
    margin-top: .3em;
}


.sb-select .arrow {
    position: absolute;
    bottom: 1em; right: 1em;
    width: .3em; height: .3em;
    border: 2px solid #000;
    border-top: transparent;
    border-right: transparent;
    transform: rotate(-45deg);
}

.sb-input input,
.sb-input textarea,
.sb-input .input {
    border: 1px solid #000;
    width: 100%;
    padding: .5em .7em;
    font-size: 1em;
    margin-top: .3em;
}
.sb-select label,
.sb-input label {
    font-weight: 500;
    font-size: .9em;
    color: #555;
    margin-left: 1px;
}
.tree a {
    color: #061325;
}
select {
    -webkit-appearance: none;
    appearance: none;
}
.sb-inputs {
    width: 100%;
    display: flex;
    align-items: flex-end;
}
.sb-inputs .sb-input,
.sb-inputs .sb-select
{ margin: 0 .5em; }

.sb-inputs .sb-input:first-child,
.sb-inputs .sb-select:first-child
{ margin-left: 0; }

.sb-inputs .sb-input:last-child,
.sb-inputs .sb-select:last-child
{ margin-right: 0; }

.tb-4 { font-weight: 400; }
.tb-5 { font-weight: 500; }
.tree a:hover { text-decoration: underline; }

.msc {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.msc::-webkit-scrollbar {
    display: none;
}

.description {
    color: #474747;
    margin-top: .5em;
    white-space: normal;
    margin-bottom: 1em;
}
.description-more { cursor: pointer; white-space: nowrap; }
.description-full, .description-short { display: none; }
.description-active { display: block; }

.bg-green { background: #2FBE8B; color: #fff; }
.bg-yellow { background: #FFA500; color: #fff; }
.sc { color: #FFA500; }
.sb { background: #FFA500; }

@media only screen and (max-width: 1040px) {
    .sb-inputs { flex-direction: column; }
    .sb-inputs .sb-input, .sb-inputs .sb-select { margin: 0; }
    .sb-inputs label, .sb-inputs label { margin-top: 1em; }
}