/* static fonts */
@font-face { font-family: "Fustat"; font-style: normal; font-weight: 300; font-display: swap; src: url("../fonts/Fustat-Light.ttf") format("truetype"); }
@font-face { font-family: "Fustat"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/Fustat-Regular.ttf") format("truetype"); }
@font-face { font-family: "Fustat"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/Fustat-Medium.ttf") format("truetype"); }
@font-face { font-family: "Fustat"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/Fustat-SemiBold.ttf") format("truetype"); }
@font-face { font-family: "Fustat"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/Fustat-Bold.ttf") format("truetype"); }
@font-face { font-family: "Fustat"; font-style: normal; font-weight: 800; font-display: swap; src: url("../fonts/Fustat-ExtraBold.ttf") format("truetype"); }

:root {--bb-50: #effefa;
--bb-100: #c8fff0;
--bb-200: #90ffe1;
--bb-300: #51f7d2;
--bb-400: #1de4be;
--bb-500: #05dbb5;
--bb-600: #00a187;
--bb-700: #05806e;
--bb-800: #0a6559;
--bb-900: #0d544a;
--bb-950: #00332f;
}
html {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
   
    font-feature-settings: normal;
    font-variation-settings: normal;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    -webkit-tap-highlight-color: transparent;
}

body {
    color: #1f1f1f!important;
    font-size: 1rem;
     font-family: Fustat, sans-serif;
    font-weight: 500;
    letter-spacing: -.017em;
    line-height: 1.55;
    scroll-behavior: smooth;
}

nav ul li a { color: #1f1f1f!important; padding:10px 15px!important;}
.nav-num { color: #1f1f1f; font-size:14px; text-decoration: none; text-align: end; border:1px solid var(--bb-600); border-radius: 100px; display: flex; align-items: center; gap:10px; padding:5px 5px 5px 15px; position: relative;}
.nav-num span { font-weight:600;}
.nav-num small {font-weight:800; font-size:13px; color: var(--bb-600);}


.h-top { background: #1f1f1f; color: #fff;}
.hero { background: url(../images/hero.webp) no-repeat center bottom; padding-top: 150px; padding-bottom: 150px; height: 100%; min-height: 300px; max-height: 500px; }
.hero-title {font-size: 3rem; color: #fff; font-weight: 800; line-height: 1; text-shadow: 0px 0px 5px #00000075;}
.hero-tagline {font-size: 1.2rem; color: #fff; text-shadow: 0px 0px 5px #00000075;}
.book {    font-size: 16px;
    background: var(--bb-300);
    color: #000c5f;
    padding: 10px 40px;
    border-radius: 4px;
    display: inline-block;
    text-decoration: none;
    font-weight: 700;
    margin-top: 25px;}

.exclusive { background: var(--bb-50);}
.features { max-width: 320px; margin:0px auto;}
.features h5 { font-weight: 700; margin-top: 20px; font-size:1rem;}
.features p {}

.ports-main { background: var(--bb-100);}


.content-title { font-weight: 800; font-size: 1.4rem; margin-top: 30px;}

footer { background: #1a1a1a; color: #b9b9b9;}
footer h3 { color: #fff; font-size: 1.2rem; margin-bottom: 20px;}
footer ul {padding:0px;}
footer ul li {list-style: none;}
footer ul li a {color: #b9b9b9; text-decoration: none; padding-bottom: 5px; display: block;}

.social { display: flex; gap:20px;}
.social a { color: #fff;}

.logos { }
.hero-inner { padding-top: 150px; padding-bottom: 150px; background-size: cover;}

.mob-menu {padding:0px;}
.mob-menu li {padding:5px; list-style:none;}
.mob-menu li a { padding:10px; display: block; border-bottom: 1px solid var(--bb-100); text-decoration: none; color: #000C5F; font-weight: 700;}

.menu-btn { border:0px; background: var(--bb-200); color: var(--bb-950); padding:5px 10px; border-radius: 100px;}


.cruise-offer-box { display: flex; align-items: center; gap:15px; justify-content: space-between;}
.cruise-offer-box small {}
.cruise-offer-box span {font-size:22px; font-weight: 700;}
.cruise-offer-box a { border:2px solid var(--bb-950); padding:10px 30px; display: inline-block; text-decoration: none; color: var(--bb-950); font-weight: 700;}
.cruise-offer-box a:hover { background: var(--bb-950); color: #fff;}

.title { font-size: 22px; font-weight: 800; color: #222222;} 

.flight-box { padding:15px; border:1px solid #e6e6e6; border-radius: 20px;}

.price {
  display: inline-flex;
  align-items: center;
  gap: 2px; /* space between boxes */
  font-family: Arial, sans-serif;
}

.price span {
  background-color: var(--bb-700); /* red */
  color: white;
  font-weight: bold;
  font-size: 16px;
  padding: 4px 8px;
  border-radius: 6px;
  display: inline-block;
}



.deal-sm {
color: #868686;
display: block;line-height: 1;
}
.deal-mc {
display: block;line-height: 1.5;
font-size: 1.2rem; font-weight: 600;
}

.dest-box {    position: relative;
    border-radius: 24px;
    overflow: hidden;}
.inner-dest-box{    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    color: #fff;
    background: #00000021;
    backdrop-filter: blur(5px);
    padding: 10px;}
.dest-name {    font-size: 20px;}
.dest-frm{    font-size: 12px;}
.dest-price{    font-size: 18px;}
.dest-way{    font-size: 12px;}
.dest-book {background: #c50d4b; color: #fff;padding:5px 20px; display: inline-block; border-radius: 100px; text-decoration: none; margin-top:10px;}


.faq-box { background: var(--bb-50); padding:30px; border-radius: 24px; color: var(--bb-950);}

.faq-box h4 {font-size:18px; font-weight: 700;}
.faq-box p { margin-bottom: 40px;}



@media screen and (max-width:767px) {
    .hero { padding-top: 70px;
    padding-bottom: 70px; } 

    .hero-title {
    font-size: 2rem;
}
}