*
{
padding: 0;
margin: 0;
direction: rtl;
}

:root {
    --icon-bg-color-1: #f1a501;
    --icon-bg-color-2: #DF6951;
    --icon-bg-color-3: #006380;
    --text-on-bg-1: #000000;
    --text-on-bg-2: #ffffff;
    --text-on-bg-3: #ffffff;
}


.top-Menue{/* Buttons on the top of the header */
    float:right;
    margin: 5px;
    width: 130px;
    padding: 8px 0;
    outline: none !important;
    border: 1px solid #fff;
    border-radius: 50px;
    background: transparent;
    color: #fff;
}

.header h1{


    padding-bottom: 0;
    font-size: 55px;

}
.header p{
    margin: 18px 0;
}

.input-group{
    width:90% !important;
    max-width: 520px;
    border-radius: 30px;
    background: #fff;
    margin: auto;

}
/*
.form-control{

    border: 0 !important;
    border-radius: 30px !important;
    margin: 2px;
    box-shadow: none !important;

}

.input-group-text{
    width: 100px;
    padding: 0 30px 0 30px !important;
    border-radius: 30px !important;
    border: 0 !important;
    box-shadow: none;

}
*/
.featured{

    padding: 100px 0;

}


   .slides {


display: flex;


overflow-x: auto;


scroll-snap-type: x mandatory;


}


.slides > div {


display: flex;


flex-shrink: 0;


width: 100%;


height: 300px;


scroll-snap-align: start;


scroll-behavior: smooth;


background: #74ABE2;


justify-content: center;


align-items: center;


font-size: 100px;


}
h1{
    text-align: center;
    padding-bottom: 30px;
}

.featured-img img{

    width:100%;
    height: 270px;

}
.featured-rating{
    direction: ltr;
}
.featured-price{
    width: 70px;
    height: 65px;
    background: rgba(240, 160, 11, 0.8);
    color: #fff;
    font-weight: 600;
    border-radius: 50%;
    padding: 5px 5px 5px 5px;
    box-shadow: 0 0 10px 1px rgba(37, 73, 214, 0.2);
    text-align: center;
    position: absolute;
    right: 20px;
    bottom: -30px;
}

.featured-img{
    position: relative;
}
.featured-rating{
    padding: 3px;
    float: left;
    background: rgba(43, 48, 71, 0.2);
    position: absolute;
    left: 2px;
    bottom: 2px;

}

.featured .row .col-md-4{

    padding-bottom: 30px;
    padding-top: 30px;
}

.featured .bi{
    font-size: 15px;
    color: #ff5722;
}
.featured-description{
    padding: 20px;
    text-align: justify;
}
.featured-description h4{
    font-weight: 600;
    margin-top: 20px;
}

.featured-description .bi{
    margin-left: 5px;
}
.featured-description h5{
    font-weight: 400;
    margin-top: 10px;
}


.gallery{
    padding: 100px 0;
    background: #efefef;
}
.gallery-box img{
    height: 200px;
    width: 100%;
    border-radius: 10px;
    cursor: pointer;
}
.gallery-box img:hover{
    transform: scale(1.05);
}
.gallery-box h4{
    display: block;
    font-weight: 600;
    font-size: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    color: #fff;
    text-shadow: -2px 2px 2px #000;
    transform: translate(-50%,-50%);
}
.gallery-box {
    position: relative;
    margin: 10px;
}
.banner{
    height: 100%;
    background-image: url(https://live.staticflickr.com/4783/39751784135_f4c7c7473f_b.jpg);
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    padding-top: 14%;

}

.banner-highlights{
    padding: 70px 0;
    background:rgba(0, 0, 0, 0.7);
    text-align: center;
    color: #fff;
}
.banner-highlights img{
    width:100%;
    margin-top: 20px;
}
.footer{
    padding: 40px 20px 15px;
    background-image:linear-gradient(rgb(62, 64, 201) ,
    rgb(20, 16, 83));
    color:#fff;
}
.footer-logo{
    width: 150px;
    margin-top: 15px;
    margin-bottom: 15px;
}
.footer h4{
    text-align: right;
    margin-top: 15px;
    margin-bottom: 25px;
}
.footer p{
    font-size: 12px;
    text-align: justify;
    padding-left: 35px;
}

.footer .row .bi{
    padding-left: 20px;
    font-size: 15px;
}

.footer hr{
    margin-top: 10px;
    background: silver;
}
.footer .copyright{
    text-align: center;

}

.nav-tabs .nav-item.show .nav-link .airlines,
.nav-tabs .nav-link.active {
	color: #fff!important;
	background-color: #006280;
	border-color: #006280 #006280 #545454;
}

a.airlines-link {
	color: #950a4a;
}

.airlines .acitve,
.airlines .nav-link active {
	width: 120px;
	background: #fff!important;
	margin-left: 23px;
	color: #006280;
}

.airlines a,
.airlines a:focus,
.airlines a:hover {
	color: #006280;
}

.nav-item .airlines {
	width: 120px;
	background: #fff!important;
	margin-left: 23px;
}

.airlines-button:focus,
.airlines-button:hover {
	width: 130px;
	background: #f1a501;
	border-color: #f1a501;
}

header .overlay {
	position: absolute;
	background-color: #000;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	opacity: .5;
}

.airlines-button {
	background: #f1a501;
	width: 130px;
	border-color: #f1a501;
}

.airline-nav {
	border-bottom-style: none;
	max-width: 140px;
}

@media (min-width:768px) {
	.airline-nav {
		margin-left: -50px;
	}
}

@media (max-width:767px) {
	.align-items-sm-center {
		min-width: 200px;
		max-width: 300px;
	}
	.airlines {
		margin-left: 0!important;
	}
}

.airlines {
	width: 120px;
	background: #fff!important;
	margin-left: 23px;
	border-top-color: #006280;
	border-top-style: solid;
	border-top-right-radius: 6px;
	border-top-left-radius: 6px;
}

@media (min-width:576px) {
	.align-items-sm-center {
		align-items: center!important;
	}

  .tripSummary{
  /*margin-top: -10%;*/
  color:#fff!important;
  }
}

@media (max-width:576px) {
	.airlines {
		align-items: center!important;
	}
	.justify-content-sm-center {
		justify-content: center!important;
	}

  .tripSummary{
  margin-top: 0px;
  }

}

a {
    color: #444444;
    text-decoration: none;
}
a:hover {
    color: #062b5c !important;
    text-decoration: none;
}
.separator{
  display: none;
}
.navbar .region .nav-link {
      color: #224470 !important;
      direction: rtl;
      text-align: center;
      display: block;
      font-size: large;
      font-weight: bold;
}
.navbar .navbar-nav .region .nav-link:hover {
  color: #062b5c !important;
}
.footer p{
  color:white;
}
.footer a{
  color:white;
}
@media only screen and (max-width: 992px)
{
  a.nav-link.region.first {
    border-top-style: none;
}
  .navbar .region .nav-link{
    color: #062b5c !important;
    direction: rtl;
    font-size: medium;
    font-weight: 700;
    margin-top: 0.5rem;
    border-top-width: 2px;
    border-top-color: #51515140;
    border-top-style: solid;
    padding-top: 0.5rem;
  }
  .navbar .region .nav-link  >  li:first-child{
    color: #062b5c !important;
    direction: rtl;
    font-size: medium;
    font-weight: 700;
    margin-top: 0.5rem;
    border-top-width: 0px;
    border-top-style: none;
    padding-top: 0.5rem;
  }
  .how-to-use{
    height: 1230px;
}
}
.container-fluid {
    background-color: #ccced31f;
}
@media only screen and (min-width: 992px)
{
  .container-fluid {
      background-color: #fff;
  }
    .separator{
      display: inline-block;
}
  .navbar  .navbar-nav  .nav-link .region {
    padding: 1em 0.7em;
    font-weight: 700;

}


}


  .navbar .region {
    padding: 0;
  }
  .navbar .region .navbar-brand  {
    padding: 0 0.7em;
  }

}
.navbar .region .navbar-nav  .nav-link {
  position: relative;
}
.navbar .region .navbar-nav .nav-link::after {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  background-color: #13575a;
  color: transparent;
  width: 0%;
  content: '';
  height: 3px;
  transition: all 0.5s;
}
.navbar .region .navbar-nav  .nav-link:hover::after {
  width: 100%;
}

    .header
{

    background-image: linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.5)),url(https://www.itripsplanner.com/images/webbackground1.jpg);
    background-size:contain;
    background-position: center;
    background-attachment: fixed;
    text-align: center;
    color: #fff;

}

.navbar .region .nav-link  {
    /* background-color: #90909054; */
    color: #062b5c !important;
    direction: rtl;
    font-size: medium;
    font-weight: 700;
}

/* .indexBody .header{

  height: 100%;
} */


.header img /* logo */
{
height: 120px;
float: right;
padding-left: 5px;
}

.featured-price {
    width: 70px;
    height: 65px;
    background: #f1a501;
    color: #fff;
    font-weight: 600;
    border-radius: 50%;
    padding: 5px 5px 5px 5px;
    box-shadow: 0 0 10px 1px rgb(37 73 214 / 20%);
    text-align: center;
    position: absolute;
    right: 20px;
    bottom: -30px;
    color: white;
}
.featured-price p {
  color:#fff;
}
.featured .bi {
    font-size: 15px;
    color: #299d9a;
}
.gallery {
    padding: 100px 0;
    background: #ffffff;
}

.featured-BOX {
    box-shadow: -6px 5px 20PX 12PX rgb(59 59 59 / 20%);
    margin-bottom: 20px;
    height: 100%;
    background-color: white;
}
.gallery-box span {
      font-weight: 600;
      font-size: 17px;
      top: 30%;
      bottom: 30%;
      color: #f5f5f5;
      background-color: #42424280;
      text-shadow: 0 0 8px black;
}
  .featured-rating {
        padding: 3px;
        float: left;
        background: rgb(43 48 71 / 0%);
        position: absolute;
        left: 2px;
        bottom: 2px;
        z-index: 10;
        transform: translate(2%,100%);
  }
  .header {
    background-image: linear-gradient(rgb(0 172 212 / 9%),rgb(0 0 0 / 25%)),url(https://images.pexels.com/photos/965201/pexels-photo-965201.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940);

    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    text-align: center;
    color: #fff;
    background-repeat: no-repeat;

}
.footer {
  padding: 40px 20px 15px;
  color: #ffffff;
  background-image: linear-gradient(#292929db,#292929db),url(./images/map_background.jpg);
  background-repeat: no-repeat;
  background-size: cover;
}

.bi-star-fill {
    color: #DF6951 !important;
}
.bi-star-half{
    color: #DF6951 !important;
}
.bi-geo-alt-fill {
    color: #006380 !important;
}
.bi-cash{
      color: #5e6282 !important;
}
.bi-people-fill{
        color: #5e6282 !important;
}
.bi-calendar3{
        color: #5e6282 !important;
}
.h3{
  color: #4b473c!important;
}
p {
    margin-top: 0;
    margin-bottom: 1rem;
    color: #5e6282;
}
.header p {
    margin: 18px 0;
    color: white;
    font-size: large;
    text-shadow: peru;
}
/*.navbar-light*/ .navbar-nav .nav-link {
    color: rgb(255 255 255) !important;
}


@import url('https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.2/font/bootstrap-icons.css');

.shareing-button {
    width: 30px;
    height: 30px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 5%;
    text-align: center;
    vertical-align: middle;
    position: absolute;
    z-index: 10;
    background-color: #ffffff;
    padding-top: 8px;
    box-shadow: -4px 5px 1PX 2PX rgb(59 59 59 / 20%);
}

.bi-share{
  color: black;
}

@import url('https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.2/font/bootstrap-icons.css');
/*.body{
  background-color
}
*/
.shareing-button {
    width: 30px;
    height: 30px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 5%;
    text-align: center;
    vertical-align: middle;
    position: absolute;
    z-index: 10;
    background-color: #ffffff;
    padding-top: 8px;
    box-shadow: -4px 5px 1PX 2PX rgb(59 59 59 / 20%);
}

.bi-share{
  color: black;
}


.shareing-modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transform: scale(1.1);
    transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;
}
.shareing-modal-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    padding: 1rem 1.5rem;
    width: 24rem;
    border-radius: 0.5rem;
}
.close-button {
    float: right;
    width: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
    cursor: pointer;
    border-radius: 0.25rem;
    background-color: lightgray;
}
.close-button {
    float: right;
    width: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
    cursor: pointer;
    border-radius: 0.25rem;
    background-color: lightgray;
}
.close-button:hover {
    background-color: darkgray;
}

.show-modal {
    opacity: 1;
    visibility: visible;
    transform: scale(1.0);
    transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;
    z-index: 1000;
}


 .effect {
	 width: 100%;
	 padding: 10px 0px 10px 0px;
	 background-color: #fff ;
   color:  #212121;
}
 .effect h2 {
	 color: #fff;
	 font-family: 'Playfair Display', serif;
	 font-weight: 400;
	 font-size: 25px;
	 letter-spacing: 3px;
}
 .effect:nth-child(2) {
	 margin-top: 10px;
}

 .effect .buttons {
	 margin-top: 10px;
	 display: flex;
	 justify-content: center;
}

 .effect a {
	 text-decoration: none !important;
	 width: 60px;
	 height: 60px;
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 border-radius: 50%;
   margin: 5;
	 font-size: 25px;
	 overflow: hidden;
	 position: relative;
	 color: #212121;
	 border: 2px solid #299d9a;;
}
 .effect a i {
	 position: relative;
	 z-index: 3;
}

 .effect a:before {
	 content: "";
	 display: inline-block;
	 height: 100%;
	 vertical-align: middle;
}
 .effect a i {
	 display: inline-block;
	 vertical-align: middle;
}

.body-overflow{
  overflow:hidden;
}


.social a {
    color: #006380!important;
    text-decoration: none;
}

.social {
    position: fixed;
    left: 0;
    z-index: 100;
}

.social .ul {
    padding: 0px;
    transform: translate(-253px, 0);
}

.social .ul li {
    display: block;
    margin: 5px;
    background: rgb(241 165 1);
    width: 300px;
    text-align: right;
    padding: 10px;
    border-radius: 0 30px 30px 0;
    transition: all 1s;
}

.social .ul li:hover {
    transform: translate(110px, 0);
    background: rgb(251 228 180);
}
.social .ul li:hover a {
  color: #000;
}
.social .ul li:hover i {
    color: #fff;
    background: rgb(255 255 255);
    transform: rotate(360deg);
    transition: all 1s;
}
.social .ul li i {
  margin-left: 10px;
  color: #000;
  background: #fff;
  padding: 10px;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  font-size: 20px;
  background: #ffffff;
  transform: rotate(0deg);
}
a {
    color: #444444!important;
    text-decoration: none!important;
}


.bottom_line {
    border-bottom: white;
    border-bottom-width: medium;
    border-bottom-style: solid;
}

.bottom_line:last-child {
    border-bottom: none;
}

.photo-container {
    position: relative;
    text-align: center;
    color: white;
    font-size: x-large;
    font-weight: 500;
}

.activity-gallery {
    position: absolute;
    top: 0%;
    background: linear-gradient(#ffffff61, #85858524 100%);
    width: 100%;
    height: 40px;
    padding: 10px;
}


img.flag-border {
    margin-left: 10px;
    border-radius: 5px;
    border-color: #a9a9a9;
    border-width: thin;
    border-style: solid;
}
.f3ca07965d {
    background-color: var(--bui_color_white);
    margin-bottom: var(--bui_spacing_4x);
    padding: var(--bui_spacing_4x);
}

.f05428a2f1 {
    margin-bottom: var(--bui_spacing_4x);
}

.d4f3be4ddb {
    margin-left: calc(var(--bui_spacing_4x)*-1);
    margin-right: calc(var(--bui_spacing_4x)*-1);
    position: relative;
}

.fff8c74b55 {
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    box-sizing: border-box;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    list-style: none;
    margin: 0px;
    overflow-x: scroll;
    overflow: -moz-scrollbars-none;
    padding: 0 var(--bui_spacing_4x);
    scroll-behavior: smooth;
    scroll-padding-right: var(--bui_spacing_4x);
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    width: 100%;
    padding-bottom: 10px;
    height: 35%;
}
	.d3f3fc7c77 .ebb6d69bfc {
    width: 200px;
}

.b438834286 .ebb6d69bfc, [dir=rtl] .ebb6d69bfc {
    margin-left: var(--bui_spacing_3x);
    margin-right: 0;
}


.ebb6d69bfc {
    box-sizing: border-box;
    flex: 0 0 auto;
    margin-left: var(--bui_spacing_3x);
    scroll-snap-align: start;
}

.df30678f0e .fc63351294, .fc63351294, [dir=rtl] .fc63351294 {
    text-align: right;
}

.f3ca07965d li a {
    margin-right: 15px;
}
a:link {
    font-weight: bold;
    text-decoration: underline;
}
.dbec41ecb5 {
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
}
.fc63351294 {
    background: none;
    border: none;
    box-sizing: border-box;
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    font-size: inherit;
    font-weight: inherit;
    padding: 0;
    position: relative;
    text-decoration: none;
    vertical-align: top;
}

.d3f3fc7c77 .ebb6d69bfc {
}

.b438834286 .ebb6d69bfc, [dir=rtl] .ebb6d69bfc {
    margin-left: var(--bui_spacing_3x);
    margin-right: 0;
}
.ebb6d69bfc {
    box-sizing: border-box;
    flex: 0 0 auto;
    margin-left: var(--bui_spacing_3x);
    scroll-snap-align: start;
}

.e7726e00dd:only-child, .f7c6687c3d:only-child {
    height: 100%;
}

.f7c6687c3d {
    align-items: stretch;
    flex-direction: column;
}

.a1b3f50dcd {
    flex-shrink: 0;
    pointer-events: all;
    margin-right: 15px;
    width: 176px;
}

.e7726e00dd.ef8295f3e6>:not(:first-child), .f7c6687c3d.ef8295f3e6>:not(:last-child) {
    margin-bottom: var(--bui_spacing_1x);
}


.f8dc912cb2 {
    margin-bottom: 0!important;
    margin-top: var(--bui_spacing_2x);
}

.b3d1cacd40 {
    display: flex;
    flex-direction: column;
    z-index: 10;
}
.a1b3f50dcd>* {
    flex-shrink: 0;
    pointer-events: all;
    margin-right: 15px;
}
.f8dc912cb2 div {
    margin-bottom: var(--bui_spacing_half);
    color: white;
    font-size: 20px;
    position: absolute;
    background: linear-gradient(#00000059, #85858524 100%);
    width: 95%;
    height: 40px;
    padding-right: 10px;
    z-index: 100;
    border-radius: 10px;
    margin-right: -30px;
}

.a34d1a4138, .fda3b74d0d {
    margin: 0;
    padding: 0;
}
.ac78a73c96 {
    font-family: var(--DO_NOT_USE_bui_small_font_strong_1_font-family);
    font-size: var(--DO_NOT_USE_bui_small_font_strong_1_font-size);
    font-weight: var(--DO_NOT_USE_bui_small_font_strong_1_font-weight);
    line-height: var(--DO_NOT_USE_bui_small_font_strong_1_line-height);
}
.f0d4d6a2f5 {
    color: var(--bui_color_foreground);
}

.e7726e00dd:only-child, .f7c6687c3d:only-child {
    height: 65%;
}
.f7c6687c3d {
    align-items: stretch;
    flex-direction: column;
}
.a1b3f50dcd {
    display: flex;
    pointer-events: none;
}
.da627785d6 img, .da627785d6 picture {
    display: block;
    height: 200px;
    -o-object-fit: cover;
    object-fit: cover;
    width: 180px;
    border-radius: 10px;
}
.bcc2c1529b {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
button.btn.tiprs {
    background-color: #006380;
    color: #fff;
    box-shadow: 0px 1px 12PX 6PX rgb(69 69 69 / 15%);
    width: calc(100% - 30px);
}


.col.more {
    background: linear-gradient(#00000066, #0000004a 100%), url(https://www.itripsplanner.com/images/map_background.jpg) center / cover no-repeat;
}


@media only screen and (max-width: 991px){
  .col.more {
      height: 100%;
}



/* Categories Section Styles */
.categories-section {
    padding: 60px 0;
    background: #f8f9fa;
}

.category-card {
    background: white;
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    transition: all 0.3s ease;
    height: 100%;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.category-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

.category-icon {
    width: 60px;
    height: 60px;
    margin-bottom: 15px;
}

.category-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 10px;
    color: #333;
}

.category-count {
    color: #666;
    font-size: 0.9rem;
}

/* Featured Trips Header */
.section-header {
    text-align: center;
}

.section-header h2 {
    font-size: 2rem;
    font-weight: 700;
    position: relative;
    display: inline-block;
    padding-bottom: 15px;
}

.section-header h2:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 3px;
    background: #DF6951;
}
