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

body {
	font-family: 'Poppins', sans-serif !important;
}
.hero-section.cruisebanner{
        background: url(../images/cruise/cruisebanner.png) no-repeat top center;
padding-bottom: 20px ;
}

.input-section-main {
    background-color: #FFFFFF;
    box-shadow: 3px 7px 17.3px 4px #6E6E6E40;
    border-radius: 15px;
    padding: 20px;
}


.destination-input {
    input {
        width: 100%;
        padding: 11px;
        border: 0.75px solid #8D8D8D;
        border-radius: 8px;
        height: 48px ;
        color: #5E5E5E ;
        &:focus{
            outline: none ;
        }
    }
        select {
        width: 100%;
        height: 48px ;
        padding: 10.5px 0 10.5px 10px;
        border: 1px solid #8D8D8D;
        border-radius: 8px ;
        color: #5E5E5E;
        appearance: none;
        -webkit-appearance: none;
        background-image: url(../images/cruise/downarrow.png) !important;
        background-repeat: no-repeat;
        background-position: right 15px center;
        background-size: 13px;
        &:focus{
            outline: none ;
        }
    }
}

.request-btn {
    button {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #F3B718;
        height: 48px;
        border-radius: 8px;
        color: white;
        border: none;
    }
}
.flysmarter {
    margin-bottom: 100px;
}



h2 {
  margin-bottom: 30px;
  font-size: 28px;
  color: #333;
}

.cards {
  display: flex;
  gap: 20px;
  align-items: stretch;
}

/* Card Style */
.card {
  position: relative;
  flex: 1;
  height: 380px;
  overflow: hidden;
  border-radius: 25px;
  cursor: pointer;
  transition: 0.4s ease;
}

/* Image */
.card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Overlay */
.overlay {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 20px;
  color: white;
  background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
}

.overlay h3 {
  font-size: 20px;
  margin-bottom: 5px;
}

.overlay p {
  font-size: 14px;
  opacity: 0.9;
}

.price {
  margin-top: 10px;
  font-weight: bold;
}

/* Fancy Shape Effect */
.card:nth-child(1) {
  border-radius: 40px 10px 40px 10px;
}

.card:nth-child(2) {
  border-radius: 20px 40px 20px 40px;
}

.card:nth-child(3) {
  border-radius: 40px;
}

.card:nth-child(4) {
  border-radius: 10px 40px 10px 40px;
}

/* Hover Effect */
.card:hover {
  transform: translateY(-10px) scale(1.03);
}
.cruise-head{
   font-size: 32px ;
   font-weight: 500 ;
   color: #323232 ; 
}
.cruise-destination{
    width: 100% ;
    height: 520px ;
    padding: 20px 0;
    background: url(../../resources/images/cruise/bluewaterbg.png) top center no-repeat;
}
.cruise-dest-img{
    width: 100% ;
    img{
        width: 100% ;
    }
}
.carribean-txt{
    width: 25% ;
    padding: 10px 15px;
    color: #ffffff ;
}
.carribean{
    font-size: 24px ;
    font-weight: 500 ;
    line-height: 25px ;
}
.paradise{
    font-size: 13px ;
    font-weight: 400 ;
    color: #ffffff ;
}
.carribean-price{
    font-size: 20px ;
    font-weight: 600 ;
    color: #ffffff ;
}
.call_icon{
    min-width: 28px ;
    max-width: 28px ;
    img{
        width: 100% ;
    }
}
.cruise-destination-txt .carribean-txt {
    left: 1%;
    width: 26.8%;
}
.cruise-destination-txt .carribean-txt:nth-child(2) {
    left: 26.5% ;
    width: 22%;
}
.cruise-destination-txt .carribean-txt:nth-child(3) {
    left: 48.5%;
    width: 23%;
}
.cruise-destination-txt .carribean-txt:nth-child(4) {
    left: 71.5%;
    width: 23%;
    .asia{
        width: 150px ;
    }
}
.cruise-destination-txt{
    bottom: 10px ;
}
.best-dis-head{
    font-size: 24px ;
    font-weight: 600 ;
    color: #020C7D ;
    position: relative ;
   &:after{
    position: absolute ;
    bottom: -8px ;
    left: 0 ;
    width: 154px ;
    height: 2px ;
    background: #020C7D ;
    content: "";
   }
}
 .tfn-sec{
       font-size: 32px ;
       font-weight: 500 ;
       color: #020C7D ;
       text-decoration: none ;
       span{
           width: auto !important;
           padding: 0px 8px;
           border-radius: 10px ;
           white-space: nowrap ;
          border: 1px solid #020C7D;
       }
       img{
        min-width: 45px ;
        max-width: 45px ;
       }
   }

.cruise-img{
    margin-left: -94px ;
    img{
        width: 100% ;
    }
}
.best-discount{
    background: #FAFAFA !important;
    padding: 40px 0;
}
.best-dis-txt{
    p{
    font-size: 14px ;
    font-weight: 400 ;
    color: #000000 ;
    }
}
.ftr-top-txt{

}
.baja-mexico{
    font-size: 24px ;
    font-weight: 600 ;
    color: #323232 ;
}
.italian{
    font-size: 16px ;
    font-weight: 500 ;
    color: #636363 ;
}
.ftr-lft-txt{
    width: calc(100% - 200px);
}
.ftr-rgt-txt{
    width: 200px ;
}
.ftr-top-txt{
    border-bottom: 1px solid #CDCDCD;
}
.feature-img{
    width: 282px ;
    img{
        width: 100% ;
    }
}
.feature-txt-main{
    width: calc(100% - 300px);
}
.feature-main{
    padding: 10px ;
    border: 1px solid #CDCDCD;
    border-radius: 16px ;
}
.mexico-list{
    padding-left: 0 ;
    li{
        list-style: none ;
        font-size: 16px ;
        font-weight: 400 ;
        color: #636363 ;
        margin-bottom: 10px ;
        padding-left: 20px ;
        text-indent: -20px ;
        span{
            padding-left: 20px ;
            position: relative ;
            white-space: nowrap ;
            &:after{
                position: absolute ;
                top: 50%;
                left: 10px ;
                transform: translateY(-50%);
                width: 6px ;
                height: 6px ;
                border-radius: 50% ;
                background: #636363 ;
                content: "";
            }
        }
    }
}

.mexico-dollar{
    font-size: 35px ;
    line-height: 35px ;
    font-weight: 600 ;
    color: #020C7D ;
}
.night-dollar{
    font-size: 16px ;
    font-weight: 400 ;
    color: #636363 ;
}
.ftr-rgt-txt{
    .call-now{
        background: #F3B718 ;
        padding: 5px 20px;
        border-radius: 20px ;
        font-size: 16px ;
        font-weight: 500 ;
        color: #FFFFFF ;
        text-decoration: none ;
    }
}
.unforgettable{
    font-size: 28px ;
    font-weight: 600 ;
    color: #303030 ;
}
.alaska-txt{
    padding: 10px 15px;
    p{
        font-size: 24px ;
        font-weight: 600 ;
        color: #ffffff ;
    }
}
.unforget-main{
    width: 100% ;
    img{
        width: 100%;
    }
}



@media screen and (max-width:768px) {
    .hero-section.cruisebanner{
        padding-bottom: 20px ;
        background:#030d7e;
    }
    .flysmarter {
        margin-bottom: 20px;
    }
    .cruise-destination-main{
        display: none ;
    }
    .cruise-img {
        margin-left: 0;
    }
    .best-dis-head {
        font-size: 22px;
    }
    .best-dis-txt{
        p{
        font-size: 12px ;
        }
    }
    .cruise-head {
        font-size: 22px;
    }
    .feature-main{
        flex-direction: column !important;
        height: 550px ;
    }
    .feature-img {
        width: 100%;
    }
    .feature-txt-main {
        width: 100%;
        height: 100%;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: space-between !important;
    }
    .ftr-lft-txt {
        width: 100%;
    }
    .baja-mexico {
        font-size: 18px;
    }
    .italian {
        font-size: 12px;
        margin-bottom: 5px ;
    }
    .mexico-list {
        li {
            font-size: 12px;
        }
    }
    .ftr-rgt-txt{
        width: 100% ;
        justify-content: space-between !important;
        flex-direction: row !important;
     .call-now {
        padding: 5px 15px;
        font-size: 15px;
    }
    }
    .mexico-dollar {
        font-size: 20px;
        line-height: 22px;
    }
    .night-dollar {
        font-size: 11px;
    }
    .scroll-main{
        flex-wrap: nowrap ;
        overflow-x: auto ;
        padding-bottom: 10px ;
        .col-lg-12 , .col-lg-3{
            width: 90% ;
        }
    }
    .unforgettable {
        font-size: 22px;
    }
    .tfn-sec {
        img {
            min-width: 35px;
            max-width: 35px;
        }
    }
    .tfn-sec {
        font-size: 20px;
    span {
        border-radius: 5px;
    }
    }
    .alaska-txt {
        p {
            font-size: 20px;
            font-weight: 600;
            color: #ffffff;
        }
    }
    .best-discount {
        padding: 20px 0;
    }
}