@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap');
p,span,h1,h2,h3,h4,h5,h6,a {
   font-family: "Nunito", sans-serif !important;
}

.searchArea {background: #f4f5f6;border-radius: 8px;height: 100%;padding: 10px 35px;height: 400px;}
.searchArea .spot {font-weight: bold;color: #000;font-size: 14px;}
.searchArea .spot.s2 {font-size: 16px;}
.searchArea input {border: 0px;padding-left: 40px;margin: 0;}
.searchArea .icon {background: #fff;border-radius: 4px;margin-bottom: 5px;position: relative;}
.searchArea .icon i {position: absolute;left: 10px;top: 13px;font-size: 20px;}
.searchArea button {width: 100%;margin-top: 15px;}
.searchArea .person-total {height: 50px;line-height: 50px;padding-left: 40px;border-radius: 4px;}

.iconBox {display: flex;align-items: center;flex-direction: column;}
.iconBox i {font-size: 32px;margin-bottom: 10px;color: #000;}
.iconBox span {color: #000;font-weight: 600;font-size: 17px;}

/* .routes ul{margin: 0 -10px;display: grid;grid-template-columns: repeat(4,1fr);grid-template-rows: repeat(2,1fr);  grid-row-gap: 15px;}
.routes li {position: relative;min-height: 10px;height: 222px;border-radius: 8px;padding: 0 10px;overflow: hidden;}
.routes li:before {content: "";background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, .5));position: absolute;bottom: 0;left: 10px;width: calc(100% - 20px);height: 100%;z-index: 2;border-radius: 8px;}
.routes li span {position: absolute;z-index: 2;color: #fff;font-size: 18px;font-weight: 600;bottom: 0;left: 10px;padding: 9px 30px 9px 10px;}
.routes li img {height: 224px;width: 100%;object-fit: cover;border-radius: 8px;transition: all .5s ease;}
.routes .col a {position: absolute;z-index: 2;height: 100%;width: calc(100% - 20px);cursor: pointer;}
.routes .col {height: 100%;}
.routes li:nth-child(9n+3),
.routes li:nth-child(9n+3) img {height: 100%;grid-area: 1/3/3/4;}
.routes li:nth-child(9n+4) {grid-area: 2/1/3/3;} */

.routes ul {
    margin: 0 -10px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto;
    grid-row-gap: 15px;
    padding-left: unset;
  }
  
  .routes li {
    position: relative;
    min-height: 10px;
    height: 222px;
    border-radius: 8px;
    padding: 0 6px;
    overflow: hidden;
  }
  
  .routes li:before {
    content: "";
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, .5));
    position: absolute;
    bottom: 0;
    left: 6px;
    width: calc(100% - 12px);
    height: 100%;
    z-index: 2;
    border-radius: 8px;
    /* width: 100%; */
}
  
  .routes li span {
    position: absolute;
    z-index: 2;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    bottom: 0;
    left: 10px;
    padding: 9px 30px 9px 10px;
  }
  
  .routes li img {
    height: 224px;
    width: 100%;
    object-fit: cover;
    border-radius: 8px;
    transition: all .5s ease;
  }
  
  .routes .col a {
    position: absolute;
    z-index: 2;
    height: 100%;
    width: calc(100% - 20px);
    cursor: pointer;
  }
  
  .routes .col {
    height: 100%;
  }
  
  /* Üstteki 4 öğe */
  .routes li:nth-child(-n+4) {
    grid-column: span 1;
  }
  
  /* Ortadaki 4 öğe */
  .routes li:nth-child(n+5):nth-child(-n+8) {
    grid-column: span 1;
  }
  
  /* Alttaki 2 büyük öğe */
  .routes li:nth-child(n+9) {
    grid-column: span 2;
  }
  
  .routes li:nth-child(n+9) img {
    height: 100%;
  }
  

@media (max-width:768px) {
    .routes li, .routes li img{height: 224px !important; margin-bottom: 15px;}
    #oteltabs .slick-prev,  #oteltabs .slick-next{display: none !important;}
    .slick-next {display: none !important;}
    .slick-prev {display: none !important;}
}

.slick-dots,
.slick-next,
.slick-prev {}
.slick-track {margin-left: 0;}
.slick-prev, .slick-next {font-size: 0 !important;line-height: 0;position: absolute;top: 50%;display: block;padding: 0;-webkit-transform: translate(0, -50%);-ms-transform: translate(0, -50%);transform: translate(0, -50%);cursor: pointer;color: inherit;border: none;outline: none;background: transparent;}
.slick-prev,
.slick-next {z-index: 1;color: #fff;transition: all 0.2s ease-out;}
.slick-prev {
    left: 5px;
}
.slick-next {
    right: 5px;
}
.slick-prev:before,
.slick-next:before {transition: all 0.1s ease-out;text-shadow: 0px 2px rgba(0,0,0,0.3);}

.slick-prev:before,
.slick-next:before {
  font: normal normal normal 35px/1 FontAwesome;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}
.slick-prev:before {
    content: '\f053';
}
.slick-next:before {
    content: '\f054';
}
div#map-popup {
    height: 440px !important;
}
.hotelTab .ui-widget.ui-widget-content {padding: 0;border: 0;}
.hotelTab .ui-widget-header {background: transparent;border: 0;}
.hotelTab .ui-tabs .ui-tabs-panel {padding: 20px 0px;}
.hotelTab .ui-tabs .ui-tabs-nav li {background: transparent;border: 0;color: #000;margin-right: 15px;}
.hotelTab .ui-tabs .ui-tabs-nav li a {font-weight: bold;outline: none;border: 1px solid #ddd;border-radius: 20px;}
.hotelTab .ui-tabs .ui-tabs-nav li a:hover,
.hotelTab .ui-state-active a {color: #ff6700 !important;border-color: #ff6700 !important;font-weight: bold;background: #fff5ee;}
.hotelTab .ui-state-active, 
.hotelTab .ui-widget-content .ui-state-active, 
.hotelTab .ui-widget-header .ui-state-active {color: #e61b21;background: transparent;border: 0;}

.hotelTab .slick-slide {margin: 0 10px;}
.hotelTab .slick-list {margin: 0 -10px;}
.hotelTab .otelKutu {padding: 10px;border-radius: 14px;}
.hotelTab .otelKutu .image img {height: 160px;object-fit: cover;border-radius: 14px;width: 100%;}
.hotelTab .otelKutu .cont {margin-top: 15px;}
.hotelTab .otelKutu .cont h5 {margin: 0 0 10px;font-weight: bold;height: 30px;overflow: hidden;}
.hotelTab .otelKutu .cont h5 a {color: inherit;text-decoration: none;}
.hotelTab .otelKutu .cont h5 a:hover {color: #ff6700;}
.hotelTab .otelKutu .cont .inf {font-size: 12px;margin-bottom: 4px;overflow: hidden;}
.hotelTab .otelKutu .cont .inf i {color: #ff6700;}
.hotelTab .otelKutu .cont .row-flex {display: flex;align-items: center;margin-top: 14px;}
.hotelTab .otelKutu .cont .detailBtn {display: block;background: #ff6700;color: #fff;border-radius: 9px;padding: 4px 10px;text-decoration: none;border: 2px solid #ff6700;margin-top: 8px;}
.hotelTab .otelKutu .cont .detailBtn:hover {background: transparent;color: #ff6700;transition: ease-in-out all 300ms;}
.hotelTab .otelKutu .cont .oldprice {font-size: 13px;text-decoration: none;}
.hotelTab .otelKutu .cont .newprice {font-weight: bold;font-size: 15px;}

@media(max-width: 768px) {
    .routes {display: block;}
    .hotelTab .ui-tabs .ui-tabs-nav li {width: 50%;margin-bottom: 7px; margin-right: 20px; padding: 2px; margin-bottom: 5px;}
    .hotelTab .tabSlider{overflow-x: scroll;flex-wrap: inherit;transition: all .2s ease;   display: -webkit-box;}
    .hotelTab .ui-widget-header {padding-bottom: 6px;}
    .hotelTab .otelKutu {width:92%}

}
.collaps img {
    width: 55px;
}
.ucak-search-bg label {
    font-size: 14px;
}
.hotelTab .otelKutu .image img {
    height: 160px;
    object-fit: cover;
    border-radius: 5px 5px 0 0;
    width: 100%;
}

.hotelTab .otel-kutu-box {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;

}
.otel-kutu-box .cont {
    padding: 5px;
}
.otel-ara span {
  color: #f26822;
}