@import url(https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;800&display=swap);

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
iframe,
img,
input,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
sub,
summary,
sup,
table,
tbody,
td,
textarea,
tfoot,
th,
thead,
time,
tr,
tt,
ul,
var,
video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}

body {
    font-family: Inter, sans-serif
}

button,
select {
    appearance: none;
    -webkit-appearance: none;
    outline: 0 !important
}

:root {
    --paragraf-color: #4a4a4a;
    --blue: #2b3991;
    --orange: #F7931D;
    --border-color: #efefef;
    --dd-color1: #fd4741;
    --gri-bg: #f7f9fa;
    --h-color: #4a4a4a;
    --turuncu: #fc7a2c;
    --kirmizi: #f02e35;
    --yesil: #55b17e;
    --mavi: #4a9dde;
    --p-color: #969696
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: none;
    background-color: transparent;
    padding: 5px !important
}

::-webkit-scrollbar {
    width: 5px;
    background-color: transparent
}

::-webkit-scrollbar-thumb {
    background-color: #0062ba;
    border: none;
    border-radius: 3px !important
}

ol,
ul {
    list-style: none
}

blockquote,
q {
    quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: '';
    content: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

a {
    text-decoration: none !important
}

:focus {
    outline: 0
}

.clear {
    clear: both
}

img {
    max-width: 100%;
    height: auto
}

header {
    width: 100%;
    float: left;
    background: #fff;
    position: relative
}

.container {
    width: 1300px;
    max-width: 1300px
}

.top-bar {
    width: 100%;
    float: left;
    border-bottom: 1px solid var(--border-color);
    height: 40px;
    box-sizing: border-box;
    background: #f7f9fa
}

.top-bar .container {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.top-bar-left {
    float: left;
    display: flex;
    align-items: center
}

.language {
    float: left;
    height: 40px;
    border-right: 1px solid var(--border-color);
    margin-right: 30px;
    position: relative;
    margin-left: -20px
}

.top-bar-menu {
    float: left
}

.top-bar-menu ul li {
    float: left;
    margin-right: 20px
}

.language ul li a {
    height: 38px;
    font-size: 13px;
    display: flex;
    align-items: center;
    padding-right: 20px;
    padding-left: 20px;
    background: #f7f9fa;
    color: #424242
}

.language ul li a img {
    width: 18px;
    margin-right: 10px
}

.language .dropdown-toggle::after {
    margin-left: 10px;
    content: "";
    border-top: 5px solid;
    border-right: 5px solid transparent;
    border-bottom: 0;
    border-left: 5px solid transparent;
    margin-top: 0
}

.language:hover ul {
    display: block
}

.language ul li ul {
    padding: 0;
    border: 1px solid var(--border-color);
    min-width: 100%;
    border-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.language ul li ul li:first-child {
    border-bottom: 1px solid var(--border-color)
}

.top-bar-menu ul li a {
    height: 40px;
    font-size: 13px;
    float: left;
    display: flex;
    align-items: center;
    color: #424242;
    font-weight: 400
}

.top-bar-menu ul {
    float: left;
    position: relative;
    margin-top: -3px
}

.top-bar-right {
    float: right;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.top-bar-phone {
    margin-right: 30px
}

.top-bar-phone a {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    color: var(--blue);
    text-decoration: none;
    font-size: 14px;
    font-weight: 600
}

.top-bar-phone a i {
    margin-right: 10px;
    color: var(--blue)
}

.top-bar-social {
    float: right
}

.top-bar-social a {
    width: 40px;
    height: 40px;
    display: flex;
    float: left;
    align-items: center;
    justify-content: center;
    margin-left: 2px;
    color: #fff;
    font-size: 14px;
    text-decoration: none
}

.facebook {
    background-color: #3a5897
}

.instagram {
    background-color: #396990
}

.header {
    width: 100%;
    float: left;
    padding: 15px 0
}

.logo {
    float: left
}

.header-right {
    float: right;
    display: flex;
    align-items: center
}

.menu {
    float: left;
    margin-right: 15px
}

.menu ul li {
    float: left
}

.menu ul li a {
    display: flex;
    align-items: center;
    color: var(--blue);
    font-weight: 600;
    font-size: 14px;
    padding: 0 10px;
    border-right: 1px solid var(--border-color);
    float: left;
    min-width: 90px
}

.menu ul li a img {
    max-width: 17px;
    max-height: 17px;
    margin-right: 7px;
    float: left;
    display: inline-block
}

.user-buttons {
    float: left
}

.header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative
}

.blue-btn,
.orange-btn {
    height: 45px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 25px;
    border-radius: 25px;
    background-color: var(--blue);
    float: left;
    border: 1px solid var(--blue);
    box-sizing: border-box;
    transition: all ease-in-out .3s;
    outline: 0 !important
}

.orange-btn {
    background-color: var(--orange);
    border: 1px solid var(--orange)
}

.blue-btn:hover {
    color: var(--blue);
    background-color: #fff
}

.orange-btn:hover {
    color: var(--orange);
    background-color: #fff
}

.user-buttons a {
    font-size: 14px;
    font-weight: 600;
    margin-left: 5px
}

.main-banner-right {
    text-align: center;
    position: relative;
    bottom: -15px
}

.main-banner-right h1 {
    color: #fff;
    font-weight: 800;
    margin-bottom: 15px;
    text-shadow: 0 5px 10px rgba(0, 0, 0, .3);
    font-size: 36px
}

.main-banner-right h1 span {
    font-weight: 400
}

.icon-ozellikler {
    width: 100%;
    float: left;
    position: relative
}

.ozellik-box {
    width: calc(50% - 30px);
    margin: 15px;
    float: left
}

.ozellik-box img {
    width: 48px;
    margin-bottom: 10px
}

.ozellik-box span {
    width: 100%;
    float: left;
    color: #fff;
    font-weight: 600;
    font-size: 14px
}

.dalga-icon {
    width: 100%;
    float: left;
    position: relative;
    margin-bottom: -10px
}

.main-banner {
    width: 100%;
    float: left;
    background-size: cover;
    background-position: center;
    position: relative;
    padding-top: 50px
}

.dalga-icon img {
    width: 100%
}

.menu ul li:last-child a {
    border: none
}

.main-banner:before,
.page-banner:before,
.sefer-head-row:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    float: left;
    background: #2b3991;
    background: -moz-linear-gradient(0deg, rgba(43, 57, 145, 1) 0, rgba(43, 57, 145, 0) 100%);
    background: -webkit-linear-gradient(0deg, rgba(43, 57, 145, 1) 0, rgba(43, 57, 145, 0) 100%);
    background: linear-gradient(0deg, rgba(43, 57, 145, 1) 0, rgba(43, 57, 145, 0) 100%);
    top: 0;
    left: 0
}

.main-search {
    width: 100%;
    float: left;
    margin-top: 10px;
    margin-bottom: 50px
}

.main-search .nav-tabs .nav-link {
    font-size: 14px;
    padding: 10px 20px;
    font-weight: 600;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    margin-right: 4px;
    color: var(--blue);
    border: none;
    outline: 0 !important;
    background-color: #fff;
    position: relative
}

.main-search .nav-tabs .nav-link span {
    position: absolute;
    background: var(--orange);
    padding: 2px 7px;
    font-size: 10px;
    border-radius: 15px;
    top: -11px;
    left: 50%;
    width: 42px;
    text-align: center;
    margin-left: -21px;
    color: #fff
}

.main-search .nav-tabs .nav-link.active {
    background: var(--blue);
    color: #fff
}

.main-search .tab-content {
    width: 100%;
    float: left;
    background: #fff;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-top: 7px solid var(--blue);
    border-top-right-radius: 15px;
    box-shadow: 0 15px 20px rgba(0, 0, 0, .5);
    box-sizing: border-box;
    padding: 25px 25px 80px;
    position: relative
}

.main-search .nav-tabs {
    border-bottom: none
}

.main-search .nav-tabs .nav-item {
    margin-bottom: 0
}

.neredenNereye {
    width: 100%;
    float: left;
    margin-bottom: 20px
}

.lokasyon-col {
    width: 45%;
    float: left;
    position: relative;
    display: flex;
    align-items: center
}

.locationChange {
    width: 50px;
    height: 50px;
    float: left;
    background: var(--border-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: var(--blue);
    border: 1px solid #ccc;
    box-sizing: border-box;
    margin-left: -20px;
    margin-right: -20px;
    position: relative;
    z-index: 1;
    cursor: pointer
}

.icon-input input[type=email],
.icon-input input[type=mail],
.icon-input input[type=tel],
.icon-input input[type=text],
.main-search input[type=text] {
    width: 100%;
    height: 50px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    padding-left: 50px;
    font-size: 14px;
    border-radius: 30px;
    float: left;
    color: var(--paragraf-color)
}

.icon-input select {
    width: 100%;
    height: 50px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    padding-left: 50px;
    font-size: 14px;
    border-radius: 30px;
    float: left;
    color: var(--paragraf-color)
}

.icon-input>span {
    width: 50px;
    position: relative;
    margin-right: -50px;
    text-align: center;
    color: var(--blue)
}

.lokasyon-change-btn {
    width: 10%;
    float: left;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center
}

.gidisDonusTarih {
    width: 100%;
    float: left;
    margin-bottom: 20px
}

.tarih-col {
    width: 50%;
    float: left;
    box-sizing: border-box;
    padding-right: 6px
}

.icon-input {
    display: flex;
    align-items: center;
    position: relative
}

.voucherNo,
.yolcuArac {
    width: 50%;
    float: left;
    box-sizing: border-box;
    padding-right: 6px
}

.voucherNo {
    width: 70%
}

.tarih-col:last-child {
    padding-right: 0;
    padding-left: 6px
}

.acikDonus {
    width: 110px;
    font-size: 12px;
    position: relative;
    margin-left: -110px;
    display: flex;
    align-items: center
}

.acikDonus input[type=checkbox] {
    margin-right: 5px
}

.main-search-btn,
.voucher-search-btn {
    width: 50%;
    float: left;
    box-sizing: border-box;
    padding-left: 6px
}

.main-search-btn button,
.voucher-search-btn button {
    width: 100%;
    height: 50px;
    font-weight: 600
}

.main-search-btn button i {
    margin-right: 5px
}

.voucher-search-btn {
    width: 30%
}

.autocomplete-suggestions {
    border: 1px solid #999;
    background: #fff;
    overflow: auto
}

.autocomplete-suggestion {
    padding: 2px 5px;
    white-space: nowrap;
    overflow: hidden
}

.autocomplete-selected {
    background: #f0f0f0
}

.autocomplete-suggestions strong {
    font-weight: 400;
    color: #39f
}

.autocomplete-group {
    padding: 2px 5px
}

.autocomplete-group strong {
    display: block;
    border-bottom: 1px solid #000
}

.ui-widget-content {
    padding: 15px !important;
    border-radius: 15px;
    border: 1px solid #eee !important;
    margin-top: 10px !important;
    max-height: 300px;
    overflow-y: scroll;
    color: var(--paragraf-color) !important
}

.ui-autocomplete-group {
    font-weight: 600;
    margin-top: 5px !important;
    padding-left: 5px !important
}

.ui-menu-item {
    font-size: 14px;
    padding-left: 5px !important;
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    float: left
}

.ui-menu-item .ui-menu-item-wrapper:before {
    content: "\f13d";
    font-family: 'Font Awesome 5 Pro';
    position: absolute;
    left: 14px;
    font-weight: 600;
    font-size: 12px;
    top: 7px
}

.ui-autocomplete-group:before {
    display: none
}

.ui-menu .ui-menu-item-wrapper {
    padding: 5px 35px !important;
    width: 100%
}

.ui-button.ui-state-active:hover,
.ui-button:active,
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active {
    background: #ededed !important;
    color: var(--paragraf-color) !important;
    border: 1px solid #eee !important;
    border-radius: 15px
}

.blue-date {
    --dd-color1: #2b3991 !important
}

.disabled span {
    opacity: .5
}

.index-kampanya {
    width: 100%;
    float: left;
    padding-top: 30px;
    margin-bottom: 100px;
    overflow: hidden
}

.title {
    width: 100%;
    float: left;
    text-align: center;
    margin-bottom: 50px
}

.title h2,
.video-content h2 {
    color: var(--blue);
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 10px
}

.title p {
    font-size: 18px;
    color: var(--paragraf-color)
}

.kampanya-slider {
    width: 100%;
    float: left;
    position: relative
}

.kampanya-box {
    width: 100%;
    float: left;
    border-radius: 15px;
    overflow: hidden;
    background: var(--gri-bg)
}

.kampanya-box-img {
    width: 100%;
    height: 180px;
    background-size: cover;
    background-position: center;
    float: left;
    box-sizing: border-box;
    padding: 15px 20px;
    position: relative;
    overflow: hidden
}

.kampanya-box-img span {
    background: var(--orange);
    color: #fff;
    font-size: 12px;
    padding: 5px 20px;
    display: inline-block;
    border-radius: 20px;
    position: relative;
    font-weight: 600
}

.kampanya-box-img:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    float: left;
    background: #2b3991;
    background: -moz-linear-gradient(0deg, rgba(43, 57, 145, 1) 0, rgba(43, 57, 145, 0) 100%);
    background: -webkit-linear-gradient(0deg, rgba(43, 57, 145, 1) 0, rgba(43, 57, 145, 0) 100%);
    background: linear-gradient(0deg, rgba(43, 57, 145, 1) 0, rgba(43, 57, 145, 0) 100%);
    top: 0;
    left: 0;
    opacity: .7;
    transition: all ease-in-out .3s
}

.kampanya-box:hover .kampanya-box-img:before {
    opacity: 0
}

.kampanya-box-title {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 10px 20px;
    text-align: center
}

.kampanya-box-title h3 {
    color: var(--blue);
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 5px
}

.kampanya-box-title p {
    font-size: 14px;
    color: var(--paragraf-color);
    font-weight: 300;
    line-height: 20px;
    margin-bottom: 5px;
    width: 86%;
    margin-left: 7%
}

.owl-nav {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.owl-next,
.owl-prev {
    position: absolute;
    color: var(--blue);
    font-size: 30px;
    transition: all ease-in-out .3s
}

.owl-prev {
    left: -60px
}

.owl-next {
    right: -60px
}

.owl-next:hover,
.owl-prev:hover {
    color: var(--orange)
}

.feature-box {
    width: 100%;
    float: left;
    box-sizing: border-box;
    background: var(--gri-bg);
    padding: 5px 15px;
    border-radius: 15px;
    margin-bottom: 30px;
    cursor: pointer;
    transition: all ease-in-out .3s;
    min-height: 285px
}

.feature-box img {
    width: 70% !important;
    margin-left: 15%;
    margin-right: 15%;
    margin-bottom: 10px;
    float: left
}

.feature-box h3 {
    color: var(--h-color);
    font-size: 15px;
    width: 100%;
    float: left;
    font-weight: 600;
    text-align: center;
    margin-bottom: 5px
}

.feature-box p {
    width: 100%;
    float: left;
    text-align: center;
    font-size: 12px;
    color: var(--p-color)
}

.index-ozellikler {
    width: 100%;
    float: left;
    margin-bottom: 80px
}

.feature-box:hover {
    box-shadow: 0 10px 20px rgb(0 0 0 / 10%)
}

.video-content {
    width: 100%;
    float: left;
    position: relative
}

.video-content p {
    font-size: 14px;
    color: var(--paragraf-color);
    margin-bottom: 15px
}

.tanitim-ok {
    width: 170px;
    text-align: right;
    float: right
}

.tanitim-ok strong {
    font-size: 20px;
    font-weight: 600;
    color: var(--blue)
}

.video-box {
    width: 100%;
    float: left;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .2);
    position: relative;
    margin-bottom: -30px
}

.video-box iframe {
    float: left
}

.index-seferler {
    width: 100%;
    float: left;
    position: relative;
    background-color: var(--blue);
    margin-top: -10px;
    padding-top: 100px;
    padding-bottom: 80px
}

.blue-row {
    width: 100%;
    float: left;
    margin-top: -10px;
    position: absolute;
    top: 0
}

.index-video {
    width: 100%;
    float: left;
    z-index: 1;
    position: relative
}

.index-seferler .title h2 {
    color: #fff
}

.seferler-list {
    width: calc(100% + 30px);
    float: left;
    margin-left: -15px;
    margin-right: -15px
}

.index-seferler .title {
    margin-bottom: 20px;
    margin-top: 20px
}

.sefer-box {
    width: calc(25% - 30px);
    float: left;
    height: 150px;
    margin: 15px;
    border-radius: 15px;
    background-size: cover;
    background-position: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .1);
    transition: all ease-in-out .3s
}

.sefer-box:nth-child(1) {
    width: calc(50% - 30px);
    height: 330px
}

.sefer-box:nth-child(3) {
    height: 330px
}

.sefer-box:nth-child(6) {
    margin-top: -165px
}

.sefer-box:nth-child(7) {
    width: calc(50% - 30px)
}

.sefer-box a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    padding: 15px 20px;
    color: #fff;
    position: relative
}

.sefer-box:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 80%;
    left: 0;
    bottom: 0;
    background: #000;
    background: -moz-linear-gradient(0deg, rgba(0, 0, 0, 1) 0, rgba(0, 0, 0, 0) 100%);
    background: -webkit-linear-gradient(0deg, rgba(0, 0, 0, 1) 0, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0, rgba(0, 0, 0, 0) 100%);
    opacity: .5;
    transition: all ease-in-out .3s
}

.sefer-box h3 {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 22px
}

.sefer-box:hover {
    box-shadow: 0 10px 20px rgb(0 0 0 / 20%)
}

.sefer-box:hover:before {
    opacity: .3
}

.footer-menus {
    width: 100%;
    float: left;
    padding: 50px 0
}

.footer-menu {
    width: 100%;
    float: left;
    box-sizing: border-box
}

.footer-menu strong {
    color: var(--orange);
    font-size: 16px;
    padding-bottom: 7px;
    width: calc(100% - 30px);
    float: left;
    border-bottom: 1px solid var(--orange);
    margin-bottom: 15px
}

.footer-menu ul {
    width: 100%;
    float: left;
    border-right: 1px solid var(--border-color)
}

.footer-menu ul li {
    width: 100%;
    float: left;
    padding-left: 20px;
    display: flex;
    align-items: center;
    margin-bottom: 5px
}

.footer-menu ul li a {
    font-size: 13px;
    color: var(--paragraf-color)
}

.footer-menu ul li:before {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--orange);
    left: 15px
}

.footer-orange {
    width: 100%;
    float: left;
    background: var(--orange);
    overflow: hidden;
    position: relative
}

.orange-top {
    width: 100%;
    float: left;
    position: relative
}

.orange-top img {
    width: 100%;
    float: left
}

.footer-orange-content {
    width: 100%;
    float: left;
    margin-top: 60px
}

.footer-orange-content span {
    color: #fff;
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 15px
}

.footer-orange-content p {
    color: #fff
}

.footer-orange-img {
    width: 100%;
    float: left;
    margin-top: 30px;
    margin-bottom: -50px
}

.footer-ebulten {
    width: 100%;
    float: left;
    background: var(--blue);
    padding: 30px 0
}

.ebulten-logo {
    width: 225px;
    float: left
}

.ebulten-form {
    float: right;
    display: flex;
    align-items: center
}

.ebulten-form strong {
    float: left;
    color: #fff;
    font-size: 18px;
    margin-right: 30px
}

.ebulten {
    float: left
}

.footer-ebulten .container {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.ebulten input[type=email] {
    float: left;
    height: 45px;
    font-size: 14px;
    width: 245px;
    box-sizing: border-box;
    padding: 0 30px;
    border-radius: 30px 0 0 30px
}

.ebulten input[type=submit] {
    border-radius: 0 30px 30px 0;
    font-size: 14px;
    font-weight: 600
}

.footer {
    width: 100%;
    float: left
}

.footer-vertical-menu {
    width: 100%;
    float: left;
    padding: 20px 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.footer-vertical-menu ul li {
    float: left;
    margin: 0 15px
}

.footer-vertical-menu ul li a {
    color: var(--blue);
    font-size: 14px;
    font-weight: 400
}

.footer-bottom {
    padding: 30px 0
}

.footer-social {
    width: 100%;
    float: left;
    display: flex;
    align-items: center
}

.footer-social span {
    float: left;
    color: var(--paragraf-color);
    margin-right: 15px
}

.footer-social a {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 14px;
    border-radius: 30px;
    margin-right: 5px
}

.footer-logos {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center
}

.copyright {
    width: 100%;
    float: right;
    text-align: right;
    color: var(--paragraf-color);
    line-height: 30px
}

.footer-vertical-menu ul li a:hover {
    color: var(--orange)
}

.yolcu-arac-popup {
    width: calc(100% - 50px);
    float: left;
    background: var(--gri-bg);
    position: absolute;
    top: 250px;
    border-radius: 15px;
    z-index: 8;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .2);
    box-sizing: border-box;
    padding: 25px;
    display: none
}

.arac-row,
.yolcu-row {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.yolcu-row {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 20px
}

.arac-col,
.yolcu-col {
    width: calc(33.3% - 15px);
    float: left
}

.arac-col strong,
.yolcu-col strong {
    width: 100%;
    float: left;
    font-size: 14px;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    font-weight: 600;
    color: var(--blue)
}

.arac-col strong i,
.yolcu-col strong i {
    margin-right: 5px
}

.arac-col strong span,
.yolcu-col strong span {
    color: var(--paragraf-color);
    font-size: 12px;
    margin-left: 5px;
    font-weight: 300
}

.arac-col select,
.yolcu-col select {
    width: 100%;
    height: 35px;
    padding-left: 17px;
    border-radius: 20px;
    border: 1px solid #ccc;
    font-size: 12px;
    appearance: none;
    -webkit-appearance: none;
    color: var(--paragraf-color);
    position: relative;
    background-image: url(../images/icn/arrow.svg);
    background-repeat: no-repeat;
    background-size: 10px;
    background-position: 90%;
    background-color: #fff
}

.yolcu-arac-kapat {
    width: 100%;
    height: 35px;
    background: var(--blue);
    border-radius: 30px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    cursor: pointer;
    margin-top: 25px;
    transition: all ease-in-out .3s;
    border: 1px solid var(--blue);
    box-sizing: border-box;
    font-weight: 600
}

.yolcu-arac-kapat:hover {
    background: #fff;
    color: var(--blue)
}

.mobile-menu,
.mobile-shadow {
    display: none
}

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s
}

.slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: #fff;
    -webkit-transition: .4s;
    transition: .4s
}

input:checked+.slider {
    background-color: #2b3991;
    opacity: 1 !important
}

input:focus+.slider {
    box-shadow: 0 0 1px #2b3991
}

input:checked+.slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px)
}

.slider.round {
    border-radius: 34px
}

.slider.round:before {
    border-radius: 50%
}

.breadcrumb {
    background: var(--gri-bg);
    border-radius: 30px;
    border-left: 3px solid var(--blue)
}

.breadcrumb a,
.breadcrumb span {
    font-size: 14px;
    margin-left: 10px;
    color: var(--p-color)
}

.breadcrumb a {
    color: var(--blue)
}

.content {
    width: 100%;
    float: left;
    margin-bottom: 50px
}

.page-content-title {
    width: 100%;
    float: left;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 30px;
    padding-bottom: 20px;
    margin-top: 20px
}

.content h1,
.page-content-title h1 {
    font-size: 32px;
    color: var(--blue);
    font-weight: 800
}

.content p {
    margin-bottom: 20px;
    color: var(--paragraf-color);
    font-weight: 400;
    font-size: 14px
}

.content p strong {
    font-weight: 600
}

.content h2 {
    font-size: 26px;
    margin-bottom: 10px;
    color: var(--paragraf-color);
    font-weight: 600
}

.content h3 {
    font-size: 22px;
    margin-bottom: 10px;
    font-weight: 600;
    color: var(--paragraf-color)
}

.about-head-row {
    margin-top: 20px
}

.about-head-row h1 {
    margin-bottom: 15px
}

.about-head-row img {
    margin-top: 50px
}

.about-content-row {
    margin-top: 40px
}

.about-content-row h2 {
    color: var(--orange);
    margin-bottom: 15px
}

.hizmetler {
    width: calc(100% + 30px);
    margin-left: -15px;
    margin-right: -15px;
    position: relative
}

.hizmet-box {
    width: calc(50% - 30px);
    float: left;
    margin: 15px;
    text-align: left
}

.hizmet-box h3 {
    font-size: 16px;
    width: 100%;
    height: 40px;
    border: 1px solid var(--blue);
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--blue)
}

.hizmet-box p {
    min-height: 90px;
    margin-bottom: 0;
    font-size: 14px
}

.accordion {
    width: 100%;
    float: left
}

.accordion-row {
    width: 100%;
    float: left;
    margin-top: 15px
}

.accordionButton {
    width: 100%;
    background: var(--blue);
    border-radius: 30px;
    display: flex;
    align-items: center;
    padding: 12px 40px 12px 25px;
    box-sizing: border-box;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    position: relative;
    transition: all ease-in-out .3s
}

.accordionContent {
    width: 100%;
    border: 1px solid var(--blue);
    border-radius: 0 0 15px 15px;
    box-sizing: border-box;
    padding: 15px 25px 10px 25px;
    background: #fff
}

.accordionButton.on {
    border-radius: 15px 15px 0 0
}

.accordionContent p {
    margin-bottom: 10px;
    color: var(--paragraf-color);
    font-weight: 400;
    font-size: 14px
}

.accordionButton:before {
    content: "\f107";
    position: absolute;
    right: 25px;
    font-family: 'Font Awesome 5 Free';
    font-size: 18px;
    transition: all ease-in-out .3s
}

.accordionButton.on:before {
    transform: rotate(180deg)
}

.login-bg {
    width: 100%;
    float: left;
    position: relative;
    background-image: url(../images/login-bg.jpg);
    padding: 50px 0 100px;
    margin-bottom: -15px
}

.uyelik-col h1 {
    width: 100%;
    float: left;
    margin-bottom: 30px;
    font-size: 34px;
    text-align: center;
    font-weight: 800;
    color: var(--blue)
}

.login-box {
    width: 100%;
    float: left;
    background: #fff;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .2);
    border-radius: 15px;
    box-sizing: border-box;
    padding: 30px 50px
}

.mb-20 {
    margin-bottom: 20px
}

.login-box .icon-input input {
    width: 100%;
    height: 60px;
    border: none;
    border-bottom: 2px solid var(--blue);
    font-size: 18px;
    box-sizing: border-box;
    padding-left: 45px;
    transition: all ease-in-out .3s;
    float: left;
    border-radius: 0
}

.login-box .icon-input span {
    font-size: 20px;
    width: 30px;
    margin-right: -30px
}

.login-box .icon-input input:focus {
    border-bottom: 2px solid var(--orange)
}

.login-box .icon-input {
    float: left;
    width: 100%
}

input[type=checkbox]:not(old),
input[type=radio]:not(old) {
    width: 1px;
    margin: 0;
    padding: 0;
    opacity: 0;
    height: 1px !important
}

input[type=checkbox]:not(old)+label,
input[type=radio]:not(old)+label {
    display: inline-block;
    padding-left: 25px;
    line-height: 15px;
    cursor: pointer;
    font-size: 14px;
    position: relative;
    font-weight: 500
}

input[type=checkbox]:not(old)+label:before,
input[type=radio]:not(old)+label:before {
    content: "\f0c8";
    position: absolute;
    font-family: 'Font Awesome 5 Pro';
    font-size: 18px;
    left: 0;
    font-weight: 500;
    color: var(--orange)
}

input[type=checkbox]:not(old):checked+label:before {
    content: "\f14a";
    font-weight: 800;
    font-family: 'Font Awesome 5 Free'
}

.login-box .blue-btn {
    width: 100%;
    height: 60px;
    border-radius: 30px;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 600
}

.mb-15 {
    margin-bottom: 15px
}

.orange-line-btn {
    height: 45px;
    color: var(--orange);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 25px;
    border-radius: 25px;
    background-color: #fff;
    float: left;
    border: 1px solid var(--orange);
    box-sizing: border-box;
    transition: all ease-in-out .3s
}

.orange-line-btn:hover {
    background: var(--orange);
    color: #fff
}

.login-box .orange-line-btn {
    width: 100%;
    height: 60px;
    border-radius: 30px;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 600
}

.sifremi-unuttum {
    width: 100%;
    float: left;
    text-align: center;
    border-top: 1px solid var(--border-color);
    padding-top: 20px;
    margin-top: 5px
}

.sifremi-unuttum a {
    color: var(--blue)
}

.sifremi-unuttum a:hover {
    color: var(--orange)
}

.uye-ol-right {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-top: 60px
}

.uye-ol-list {
    width: 100%;
    float: left
}

.uye-ol-box {
    width: calc(50% - 30px);
    float: left;
    margin: 15px 0 15px 30px;
    background: var(--blue);
    border-radius: 15px;
    padding: 30px;
    text-align: center
}

.uye-ol-box strong {
    color: #fff;
    width: 100%;
    float: left
}

.acikDonus label {
    font-size: 12px !important
}

.wihte-zikzak {
    width: 100%;
    float: left;
    position: absolute;
    bottom: -50px
}

.wihte-zikzak img {
    float: left;
    width: 100%
}

.p0 {
    padding: 0
}

.pl-0 {
    padding-left: 0
}

.pr-0 {
    padding-right: 0
}

.kampanya-box-img .kamp-icon {
    position: absolute;
    z-index: 2;
    right: 15px;
    width: 20px;
    top: 15px;
    height: 20px
}

.kampanya-box-img h3 {
    position: absolute;
    bottom: 15px;
    width: 100%;
    text-align: center;
    left: 0;
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    transition: all ease-in-out .5s
}

.kampanya-box:hover h3 {
    bottom: -50px
}

.kampanya-box-title strong {
    color: var(--blue)
}

.index-one-cikan-turlar {
    width: 100%;
    float: left;
    background: var(--gri-bg);
    margin-bottom: 80px;
    padding: 50px 0 80px 0
}

.tur-box {
    width: 100%;
    float: left;
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    border: 1px solid #eee;
    box-sizing: border-box
}

.tur-box-img {
    width: 100%;
    height: 180px;
    background-size: cover;
    position: relative
}

.tur-box-img:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    float: left;
    background: #2b3991;
    background: -moz-linear-gradient(0deg, rgba(43, 57, 145, 1) 0, rgba(43, 57, 145, 0) 100%);
    background: -webkit-linear-gradient(0deg, rgba(43, 57, 145, 1) 0, rgba(43, 57, 145, 0) 100%);
    background: linear-gradient(0deg, rgba(43, 57, 145, 1) 0, rgba(43, 57, 145, 0) 100%);
    top: 0;
    left: 0;
    opacity: .7;
    transition: all ease-in-out .3s
}

.tur-box:hover .tur-box-img:before {
    opacity: 0
}

.tur-gece-badge {
    position: absolute;
    background: var(--blue);
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 12px;
    border-radius: 20px;
    padding: 4px 10px 4px 5px;
    top: 10px;
    font-weight: 600;
    left: 15px
}

.tur-gece-badge i {
    width: 20px;
    height: 20px;
    background: var(--orange);
    border-radius: 50%;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    float: left;
    margin-right: 7px
}

.tur-ay {
    width: 50px;
    height: 50px;
    position: absolute;
    right: 15px;
    top: 10px;
    background: var(--orange);
    border-radius: 50%;
    color: #fff;
    font-size: 12px;
    text-align: center;
    box-sizing: border-box;
    padding-top: 10px;
    line-height: 18px;
    font-weight: 600
}

.tur-ay span {
    width: 100%;
    float: left;
    font-size: 10px;
    position: relative;
    top: -4px
}

.tur-box-title {
    width: 100%;
    float: left;
    position: relative;
    box-sizing: border-box;
    padding: 10px 15px
}

.tur-box-title h3 {
    font-size: 18px;
    font-weight: 600;
    color: var(--blue);
    margin-bottom: 8px
}

.tur-box-title ul li {
    width: 100%;
    float: left;
    font-size: 14px;
    color: var(--p-color);
    font-weight: 300;
    margin-bottom: 4px
}

.tur-box-title ul li i {
    width: 20px;
    text-align: center;
    color: var(--orange);
    margin-right: 5px
}

.tur-box-footer {
    width: 100%;
    float: left;
    border-top: 1px solid #eee;
    padding: 10px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.tur-box-btn {
    background: var(--orange);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    padding: 7px 15px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all ease-in-out .3s;
    border: 1px solid var(--orange)
}

.tur-box-btn i {
    margin-left: 6px;
    font-size: 16px;
    float: left
}

.tur-box-btn span {
    float: left
}

.tur-box-btn:hover {
    background: #fff;
    color: var(--orange)
}

.tur-box-price strong {
    font-size: 18px;
    color: var(--blue);
    float: left;
    line-height: 20px
}

.tur-box-price span {
    font-size: 10px;
    float: left;
    line-height: 12px;
    margin-left: 0;
    color: var(--p-color);
    font-weight: 300;
    width: 100%
}

.tur-box-price {
    display: block
}

.tour-search-bar {
    width: 100%;
    float: left;
    background: url(../images/top-search-bg.jpg);
    padding: 30px 0;
    background-size: cover;
    background-position: center;
    position: relative;
    top: 0;
    z-index: 2;
    min-height: 120px
}

.search-box {
    width: 100%;
    height: 60px;
    background: #fff;
    position: relative;
    border: 1px solid #dedede;
    box-sizing: border-box;
    border-radius: 40px;
    padding: 5px 20px
}

.search-box>span {
    font-size: 12px;
    width: 100%;
    float: left;
    color: grey;
    font-weight: 500;
    top: 3px;
    position: relative
}

.search-text {
    width: 100%;
    font-size: 14px;
    height: 30px;
    padding: 0;
    border: none;
    outline: 0 !important;
    box-shadow: none !important;
    appearance: none;
    color: var(--blue);
    font-weight: 700
}

.search-box i {
    position: absolute;
    right: 20px;
    font-size: 18px;
    top: 18px;
    color: #f7931d
}

.seach-btn {
    width: 100%;
    height: 60px;
    border-radius: 45px;
    outline: 0;
    background: var(--orange);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all ease-in-out .3s;
    border: 1px solid var(--orange);
    box-sizing: border-box;
    text-transform: uppercase
}

section.otel-list-row {
    width: 100%;
    float: left;
    margin: 50px 0
}

.haritada-goster {
    width: 100%;
    float: left;
    position: relative;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center
}

.haritada-goster img {
    width: 100%;
    border-radius: 0;
    border: 1px solid #dedede
}

.harita-btn {
    position: absolute;
    background: #f7931d;
    font-size: 13px;
    color: #fff;
    padding: 10px 20px;
    border-radius: 30px;
    cursor: pointer;
    transition: all ease-in-out .3s
}

.harita-btn.active,
.harita-btn:hover {
    background: #2d3993
}

.harita-btn i {
    margin-right: 7px
}

.filtreler {
    width: 100%;
    float: left;
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    border: 1px solid #dedede
}

.filtre-title {
    width: 100%;
    background: #2d3993;
    color: #fff;
    padding: 15px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.filtre-title strong {
    font-size: 16px
}

.filtre-title a {
    color: #fff;
    font-size: 14px
}

.filtre-box {
    width: 100%;
    float: left;
    padding: 20px 15px;
    border-bottom: 1px solid #eee;
    box-sizing: border-box
}

.filtre-box>strong {
    font-size: 14px;
    margin-bottom: 15px;
    width: 100%;
    float: left;
    color: var(--paragraf-color)
}

.fiyat-araligi input[type=text] {
    width: 100%;
    height: 35px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    font-size: 12px;
    padding: 0 10px;
    outline: 0 !important;
    box-shadow: none !important;
    appearance: none;
    border-radius: 25px
}

.fiyat-araligi input[type=submit] {
    width: 100%;
    height: 35px;
    border: 1px solid #f7931d;
    border-radius: 25px;
    color: #f7931d;
    background: #fff;
    cursor: pointer;
    outline: 0;
    box-shadow: none !important;
    transition: all ease-in-out .3s;
    font-size: 12px;
    font-weight: 700
}

.fiyat-araligi input[type=submit]:hover {
    background: #f7931d;
    color: #fff
}

.fiyat-araligi .col-4 {
    padding: 0 5px
}

.fiyat-araligi .row {
    margin-left: -5px;
    margin-right: -5px
}

.bolge-list {
    width: 100%;
    float: left
}

.bolge-list ul {
    margin: 0 !important;
    list-style: none;
    padding: 0
}

input[type=checkbox] {
    width: 17px;
    height: 17px;
    margin-right: 10px;
    margin-top: 0;
    cursor: pointer
}

.bolge-list ul li {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    margin-bottom: 15px
}

.bolge-list ul li label {
    margin: 0;
    font-weight: 500;
    color: grey
}

.yildiz-checkbox {
    width: 100%;
    float: left
}

.yildiz-checkbox ul {
    list-style: none;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    float: left
}

.yildiz-checkbox ul li {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20%;
    cursor: pointer;
    height: 35px;
    position: relative
}

.yildiz-checkbox ul li input {
    width: 35px;
    height: 35px;
    margin: 0;
    cursor: pointer;
    opacity: 0
}

.yildiz-checkbox ul li label {
    position: absolute;
    margin: 0;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    color: var(--orange);
    z-index: 2;
    padding: 0;
    opacity: 0
}

.otel-title-info {
    width: 100%;
    position: relative;
    margin-left: 0;
    margin-right: 0
}

.otel-title-info h1,
.otel-title-info h2 {
    color: #2d3993;
    font-weight: 700;
    letter-spacing: -1px;
    float: left;
    width: 100%;
    line-height: 50px;
    font-size: 36px;
    position: relative;
    margin-top: -10px;
    margin-bottom: 5px
}

.siralamalar {
    width: 100%;
    float: left;
    margin-top: 15px
}

.siralamalar a {
    background: #f0f0f0;
    padding: 13px 20px;
    display: inline-block;
    border-radius: 45px;
    margin-right: 5px;
    color: grey;
    font-weight: 500;
    transition: all ease-in-out .3s;
    font-size: 14px;
    font-weight: 600
}

.siralamalar a.active,
.siralamalar a:hover {
    background: #dff1ff;
    color: #2b3991
}

.otel-list {
    width: 100%;
    float: left;
    margin-top: 30px
}

.otel-list-col {
    width: 100%;
    float: left;
    border: 1px solid #dedede;
    border-radius: 15px;
    overflow: hidden;
    position: relative
}

.thumb-slider {
    height: 220px;
    overflow: hidden
}

.thumb-slider .bx-wrapper {
    margin-bottom: 0 !important
}

.bxslider.thumbSlider div img {
    height: 220px;
    width: auto;
    border-radius: 0 !important
}

.thumb-slider .bx-pager {
    padding-top: 0 !important
}

.bx-wrapper img,
.thumb-slider .bx-viewport {
    height: 220px !important;
    width: auto !important;
    border-radius: 0
}

.bxslider.thumbSlider div {
    height: 220px !important;
    width: auto !important
}

.otel-list-info h2 {
    font-size: 18px;
    color: #2d3993;
    font-weight: 600;
    margin-bottom: 5px;
    margin-top: 10px
}

.otel-location {
    width: 100%;
    float: left;
    margin-bottom: 15px;
    font-size: 12px;
    color: #2d3993
}

.otel-location i {
    margin-right: 5px
}

.otel-bilgi {
    width: 100%;
    float: left
}

.otel-bilgi ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.otel-bilgi ul li {
    color: grey;
    font-size: 12px;
    margin-bottom: 5px
}

.otel-bilgi ul li i {
    width: 20px;
    color: #f7931d
}

.otel-list-badge {
    position: absolute;
    bottom: 15px
}

.otel-list-col .row {
    display: flex;
    height: 200px;
    margin-right: 0
}

.green-badge {
    padding: 10px 15px;
    font-size: 11px;
    background: #e5f6ed;
    border-radius: 5px;
    color: #13882b;
    font-weight: 500;
    border-radius: 20px;
    font-weight: 600
}

.green-badge i {
    margin-right: 5px
}

.otel-yildiz-puan {
    width: 100%;
    float: left;
    margin-top: 10px;
    text-align: right;
    right: -15px;
    position: relative
}

.otel-yildiz-puan i {
    color: #fd8700
}

.otel-yildiz-puan i.gray {
    color: gray
}

.indirim-badge {
    float: right;
    margin-top: 7px;
    background: #13882b;
    color: #fff;
    font-size: 11px;
    padding: 5px 10px;
    border-radius: 5px;
    font-weight: 600;
    position: relative;
    right: -15px;
    border-radius: 20px
}

.indirim-badge i {
    margin-right: 5px
}

.otel-fiyat-row {
    width: 100%;
    float: left;
    padding-right: 0;
    position: absolute;
    bottom: 15px
}

.fiyat-ozet {
    width: 100%;
    font-size: 12px;
    opacity: .8
}

.otel-price {
    width: 100%;
    float: left
}

.otel-price strong {
    font-size: 20px;
    font-weight: 800
}

.otel-price del {
    font-size: 12px
}

a.otel-button {
    background: var(--orange);
    padding: 10px 15px;
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    margin-top: 10px;
    transition: all ease-in-out .3s;
    cursor: pointer;
    float: right;
    border-radius: 30px;
    border: 1px solid var(--orange)
}

a.otel-button:hover {
    background: #fff;
    color: var(--orange)
}

.pl-0 {
    padding-left: 0
}

.mb-20 {
    margin-bottom: 20px
}

a.dahaFazla {
    border: 1px solid var(--blue);
    padding: 15px 40px;
    display: block;
    color: #fff;
    background: var(--blue);
    border-radius: 40px;
    transition: all ease-in-out .3s;
    font-weight: 600;
    margin: auto;
    font-size: 14px
}

a.dahaFazla:hover {
    color: #2d3993;
    border: 1px solid #2d3993;
    background: #fff
}

.dynamic-wrap {
    transition: max-height .25s ease-in-out;
    width: 100%;
    overflow: hidden;
    position: relative;
    font-style: 14px;
}

.height-active .dynamic-wrap:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 49px;
    background: -moz-linear-gradient(top, rgba(240, 249, 255, 0) 0, #f9f9f9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(240, 249, 255, 0)), color-stop(100%, #f9f9f9));
    background: -webkit-linear-gradient(top, rgba(240, 249, 255, 0) 0, #f9f9f9 100%);
    background: -o-linear-gradient(top, rgba(240, 249, 255, 0) 0, #f9f9f9 100%);
    background: -ms-linear-gradient(top, rgba(240, 249, 255, 0) 0, #f9f9f9 100%);
    background: linear-gradient(to bottom, rgba(240, 249, 255, 0) 0, #f9f9f9 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00f0f9ff", endColorstr="#ffffff", GradientType=0);
    z-index: 1
}

.btn-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 10px 0
}

.btn-wrapper .grey-line {
    height: 1px;
    max-width: 430;
    width: 40%;
    background: #d8d8d8;
    z-index: 9
}

.dynamic-show-more {
    position: relative;
    display: block;
    margin: auto 10px 0;
    color: var(--blue);
    background: 0 0;
    z-index: 3;
    padding: 5px 10px;
    border-bottom: 1px solid transparent;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    max-width: 300px;
    width: 210px;
    text-decoration: none !important
}

.dynamic-show-more::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
    mix-blend-mode: screen
}

.dynamic-show-more::after {
    content: "";
    display: block;
    position: absolute;
    width: 40px;
    height: 29px;
    top: 0;
    right: -8px
}

.dynamic-max-height.height-active .dynamic-show-more {
    display: inline-block;
    display: block
}

.dynamic-max-height .dynamic-show-more {
    display: none
}

.otel-detail-card {
    width: 100%;
    float: left;
    background: var(--gri-bg);
    padding: 50px 0;
    text-align: justify
}

.otel-detail-card h1,
.otel-detail-card h2 {
    width: 100%;
    float: left;
    text-align: center;
    margin-bottom: 15px;
    color: var(--blue);
    font-size: 32px;
    font-weight: 700
}

.otel-map {
    display: none;
    width: 100%;
    float: left;
    margin-top: 30px;
    position: relative
}

.otel-map iframe {
    width: 100%;
    height: 600px;
    border-radius: 15px
}

.otel-map.otel-detay-map iframe {
    height: 450px
}

.harita-close {
    display: none
}

.ui-widget.ui-widget-content {
    border-radius: 10px;
    box-shadow: 0 5px 10px rgb(0 0 0 / 10%) !important;
    border: none !important;
    z-index: 9999;
    max-width: 250px !important
}

.ui-menu .ui-menu-item-wrapper {
    padding: 5px 15px
}

.ui-menu .ui-menu-item-wrapper:hover {
    background: #2b3991 !important;
    border: none !important
}

.konuk-sayisi-popup {
    width: calc(100% - 14px);
    background: #fff;
    position: absolute;
    z-index: 6;
    margin-top: -10px;
    border-radius: 0 0 15px 15px;
    box-shadow: 0 10px 15px rgba(0, 0, 0, .1);
    box-sizing: border-box;
    padding: 15px 15px;
    display: none
}

.konuk-row {
    float: left;
    width: 100%;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.konuk-row strong {
    width: 50%;
    float: left;
    font-size: 14px;
    font-weight: 500;
    color: grey
}

.sayi-input {
    width: 50%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.sayi-text {
    width: 70px
}

.sayi-text input {
    width: 100%;
    text-align: center !important;
    padding: 0;
    height: 20px !important;
    font-weight: 800;
    border: none !important;
    color: var(--blue) !important;
    padding: 0 !important
}

.islem-btn {
    width: 20px;
    height: 20px;
    background: var(--blue);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 400;
    border-radius: 15px;
    cursor: pointer;
    border: none;
    outline: 0
}

.konuk-row select {
    width: 110px;
    float: right;
    background: #f0f0f0;
    border: none;
    height: 25px;
    font-size: 12px;
    outline: 0 !important;
    border-radius: 5px;
    padding: 0 10px
}

.konuk-submit {
    width: 100%;
    float: left;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--orange);
    color: var(--orange);
    text-transform: uppercase;
    font-weight: 600;
    border-radius: 30px;
    cursor: pointer;
    transition: all ease-in-out .3s
}

.konuk-submit:hover {
    background: #f7931d;
    color: #ffff
}

.islem-btn[disabled] {
    opacity: .3;
    cursor: no-drop
}

.yaslar {
    display: none
}

.mobil-black-shadow {
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, .7);
    z-index: 999;
    width: 100%;
    height: 100vh;
    display: none
}

.mobil-sirala-popup {
    position: fixed;
    z-index: 999;
    width: 100%;
    background: #fff;
    bottom: 0;
    border-radius: 20px 20px 0 0;
    box-sizing: border-box;
    left: 0;
    transition: all ease-in-out .5s;
    bottom: -100vh
}

.sirala-title {
    width: 100%;
    float: left;
    border-bottom: 1px solid #ccc;
    box-sizing: border-box;
    padding: 20px 50px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.sirala-title strong {
    font-size: 20px
}

.sirala-kapat {
    font-size: 20px
}

.mobil-sirala-popup ul {
    width: 100%;
    float: left;
    margin-bottom: 15px;
    padding: 0;
    list-style: none;
    margin-top: 15px
}

.mobil-sirala-popup ul li {
    width: 100%;
    float: left;
    padding: 10px 50px;
    display: flex;
    font-weight: 400;
    font-size: 16px;
    justify-content: space-between;
    align-items: center
}

.mobil-sirala-popup ul li input {
    width: 20px;
    height: 20px
}

.mobil-sirala-popup ul li label {
    color: grey;
    font-weight: 500
}

.mobil-otel-patlangac {
    display: none
}

.otel-title-info p {
    text-align: left;
    color: var(--paragraf-color);
    font-size: 14px
}

.tour-details-row {
    width: 100%;
    float: left;
    position: relative;
    margin-top: -50px;
    z-index: 2;
    margin-bottom: 50px
}

.tour-details-sidebar .haritada-goster img {
    box-shadow: none
}

.tour-details-excerpt {
    width: 100%;
    float: left;
    margin-bottom: 10px
}

.tour-details-excerpt ul {
    list-style: none;
    padding: 0;
    display: inline-block
}

.tour-details-excerpt ul li {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 5px 15px;
    color: grey;
    font-size: 12px;
    display: flex;
    align-items: center
}

.tour-details-excerpt ul li i {
    color: #f7931d;
    width: 20px;
    margin-right: 10px
}

.rezervasyon-btn {
    width: calc(100% - 50px);
    height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 25px 20px;
    border: 1px solid #f7931d;
    color: #fff;
    font-weight: 700;
    border-radius: 40px;
    background: #f7931d;
    outline: 0;
    transition: all ease-in-out .3s;
    font-size: 14px
}

.rezervasyon-btn:hover {
    background: #f7931d;
    color: #fff
}

.line-blue-btn {
    font-family: Inter, sans-serif;
    font-size: 14px;
    color: #2b3991;
    background-color: #fff;
    padding: 13px 19px;
    display: block;
    text-align: center;
    border-radius: 30px;
    position: relative;
    margin-bottom: 10px;
    float: left;
    width: 100%;
    border: 1px solid #2b3991;
    box-sizing: border-box;
    transition: all ease-in-out .3s
}

.line-blue-btn i {
    margin-right: 7px
}

.hotel-foto-gallery {
    width: 100%;
    float: left;
    position: relative
}

.hotel-foto-gallery a:nth-child(1) {
    width: calc(66.7% - 10px);
    height: 300px;
    display: block;
    background-size: cover;
    background-position: center;
    border-radius: 10px;
    margin: 5px;
    float: left
}

.hotel-foto-gallery a:nth-child(2),
.hotel-foto-gallery a:nth-child(3),
.hotel-foto-gallery a:nth-child(4),
.hotel-foto-gallery a:nth-child(5),
.hotel-foto-gallery a:nth-child(6) {
    width: calc(33.3% - 10px);
    height: 145px;
    display: block;
    float: left;
    background-size: cover;
    background-position: center;
    margin: 5px;
    border-radius: 10px
}

.tour-details-full p {
    text-align: left;
    margin-bottom: 15px;
    font-size: 14px;
    color: var(--paragraf-color)
}

.hotel-foto-gallery a:before {
    font-family: "Font Awesome 5 Free";
    content: "\f002";
    width: 100%;
    height: 100%;
    font-weight: 600;
    float: left;
    background: rgba(0, 0, 0, .5);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    color: #fff;
    position: absolute;
    opacity: 0;
    transition: all ease-in-out .3s
}

.hotel-foto-gallery a {
    overflow: hidden;
    position: relative
}

.hotel-foto-gallery a:hover:before {
    opacity: 1
}

.hotel-tags .otel-yildiz-puan {
    width: auto;
    margin-top: 0;
    font-size: 16px;
    right: -5px
}

.tags-right {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    box-sizing: border-box;
    float: right;
    padding-right: 5px
}

.hotel-detay-baslik {
    width: 100%;
    float: left;
    margin-bottom: 0;
    box-sizing: border-box;
    padding: 0 5px
}

.hotel-detay-baslik h1 {
    font-size: 28px;
    font-weight: 700;
    margin-top: 5px;
    color: var(--blue);
    margin-bottom: 5px
}

.tour-details-title {
    width: 100%;
    float: left;
    border-bottom: 1px solid #ccc;
    margin-bottom: 20px;
    padding-bottom: 10px;
    margin-top: 20px
}

.tour-details-title h2 {
    font-size: 22px;
    font-weight: 700;
    color: var(--blue)
}

.tour-content-list {
    width: 100%;
    float: left
}

.tour-content-list ul {
    padding-left: 0;
    list-style: none;
    width: 100%;
    float: left
}

.tour-content-list ul li {
    width: 50%;
    float: left;
    margin-bottom: 5px;
    box-sizing: border-box;
    padding-right: 15px;
    font-size: 14px;
    color: var(--paragraf-color)
}

.tour-content-list ul li i {
    margin-right: 5px
}

.detail-room-col {
    width: calc(100% - 10px);
    margin: 15px 5px;
    float: left;
    border: 1px solid #dedede;
    border-radius: 15px;
    overflow: hidden
}

.detail-room-gallery {
    width: 30%;
    float: left;
    position: relative
}

.detail-room-gallery .bx-viewport,
.detail-room-gallery .bx-wrapper {
    height: 195px !important;
    margin-bottom: 0;
    border-radius: 0
}

.tour-details-rooms {
    width: 100%;
    float: left;
    margin-top: 15px
}

.detail-room-info {
    width: 45%;
    float: left;
    position: relative;
    box-sizing: border-box;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 15px
}

.detail-room-info h3 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 5px;
    color: var(--blue)
}

.yatak-bilgisi {
    width: 100%;
    float: left;
    font-size: 12px;
    color: #f7931d;
    font-weight: 700;
    margin-bottom: 10px
}

.yatak-bilgisi i {
    margin-right: 7px
}

.konaklama-bilgisi {
    width: 100%;
    float: left;
    font-size: 12px;
    color: grey;
    margin-bottom: 10px
}

.ozellik-list {
    width: 100%;
    float: left
}

.ozellik-list ul {
    list-style: none;
    padding-left: 0
}

.ozellik-list ul li {
    position: relative;
    font-size: 12px;
    color: grey;
    margin-bottom: 5px;
    width: 50%;
    float: left;
    padding-left: 20px
}

.ozellik-list ul li:before {
    font-family: 'Font Awesome 5 Free';
    content: "\f00c";
    left: 0;
    font-weight: 600;
    color: #f7931d;
    position: absolute
}

.detail-room-info a {
    color: #000;
    font-size: 12px;
    font-weight: 600;
    text-decoration: underline !important
}

.detail-room-info a:hover {
    color: #2b3991
}

.detail-room-price {
    width: 25%;
    float: left;
    height: 195px;
    border-left: 1px dashed #eee;
    box-sizing: border-box;
    padding: 15px;
    display: flex;
    align-items: end;
    text-align: right;
    position: relative;
    justify-content: flex-end
}

.detail-room-price .indirim-badge {
    position: absolute;
    top: 5px;
    right: 15px;
    background: #fee;
    border: 1px solid #d32f2f;
    color: #d32f2f;
    font-size: 11px
}

.oda-modal-slider {
    width: 100%;
    float: left;
    position: relative;
    margin-bottom: 15px;
    border-radius: 10px;
    overflow: hidden
}

#odaDetayModalTitle {
    font-size: 18px;
    font-weight: 600
}

.owl-theme .owl-nav {
    position: absolute;
    top: 50%;
    margin-top: -35px !important;
    display: flex;
    justify-content: space-between;
    width: 100%
}

.owl-theme .owl-nav [class*=owl-] {
    width: 50px;
    height: 50px;
    border-radius: 50% !important;
    background: rgb(255 255 255 / 80%) !important;
    color: transparent !important;
    position: relative;
    padding: 0 !important;
    transition: all ease-in-out .3s
}

.owl-next:before,
.owl-prev:before {
    font-family: 'Font Awesome 5 Free';
    content: "\f054";
    position: absolute;
    color: #2b3991;
    font-weight: 600;
    font-size: 18px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.owl-prev:before {
    content: "\f053"
}

.owl-theme .owl-nav [class*=owl-]:hover {
    background: rgba(255, 255, 255, 1)
}

.oda-modal-content {
    width: 100%;
    text-align: left
}

.oda-modal-content p {
    text-align: left;
    margin-bottom: 15px;
    font-size: 14px;
    color: var(--paragraf-color)
}

.oda-modal-content h6 {
    font-size: 16px;
    margin-bottom: 15px;
    font-weight: 700
}

.oda-modal-content ul {
    padding: 0;
    list-style: none
}

.oda-modal-content ul li {
    width: 100%;
    display: inline-block;
    box-sizing: border-box;
    padding-left: 20px;
    margin-bottom: 7px;
    position: relative;
    font-size: 12px;
    color: var(--paragraf-color)
}

.oda-modal-content ul li:before {
    font-family: 'Font Awesome 5 Free';
    content: "\f00c";
    left: 0;
    font-weight: 600;
    color: #f7931d;
    position: absolute
}

.detail-room-col.active {
    border: 1px solid #f7931d;
    background: rgb(247 147 29 / 5%)
}

.mt-0 {
    margin-top: 0
}

.comment-row {
    width: 100%;
    float: left;
    position: relative;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px dashed #ccc
}

.comment-avatar {
    width: 70px;
    height: 70px;
    background: #eee;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
    float: left;
    margin-right: 30px
}

.comment-right {
    width: calc(100% - 100px);
    float: left
}

.comment-title {
    width: 100%;
    float: left;
    margin-bottom: 15px
}

.comment-title strong {
    font-size: 18px;
    width: 100%;
    float: left
}

.comment-title span {
    color: grey;
    font-size: 14px;
    font-style: italic
}

.comment-yildiz {
    width: 100%;
    float: left;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    color: grey;
    justify-content: space-between;
    text-align: center
}

.comment-yildiz span {
    font-size: 12px;
    width: 19%;
    border: 1px solid #ccc;
    border-radius: 10px;
    box-sizing: border-box;
    padding: 7px 8px
}

.comment-yildiz span i,
.comment-yildiz span strong {
    color: #f7931d;
    margin-right: 3px;
    font-weight: 800
}

.comment-text {
    width: 100%;
    float: left;
    background: #f7f7f7;
    border-radius: 10px;
    box-sizing: border-box;
    padding: 10px 20px;
    font-size: 14px
}

span.comment-date {
    float: right
}

span.comment-date i {
    margin-right: 5px
}

.yorum-yap-btn {
    float: right;
    background: #f7931d;
    margin-right: 5px;
    padding: 15px 30px;
    color: #fff;
    font-weight: 800;
    border-radius: 40px;
    cursor: pointer;
    margin-bottom: 30px;
    transition: all ease-in-out .3s
}

.yorum-yap-btn i {
    margin-right: 10px
}

.yorum-yap-btn:hover {
    background: #2b3991
}

.yorum-form {
    width: 100%
}

.yorum-form ul {
    padding: 0;
    list-style: none;
    width: calc(100% + 20px);
    margin-left: -10px
}

.yorum-form ul li {
    width: calc(100% - 20px);
    display: inline-block;
    margin-bottom: 15px;
    margin-left: 10px;
    margin-right: 10px;
    float: left
}

.yorum-form ul li:nth-child(2),
.yorum-form ul li:nth-child(3) {
    width: calc(50% - 22px)
}

.yorum-form ul li input[type=email],
.yorum-form ul li input[type=text] {
    width: 100%;
    height: 45px;
    font-size: 12px;
    padding: 0 15px;
    border-radius: 5px;
    border: 1px solid #ccc;
    outline: 0;
    border-radius: 30px
}

.yorum-form ul li textarea {
    width: 100%;
    height: 100px;
    border: 1px solid #ccc;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 10px 15px;
    font-size: 12px
}

.yorum-form ul li input[type=submit] {
    background: var(--blue);
    border: none;
    padding: 13px 25px;
    color: #fff;
    font-size: 12px;
    border-radius: 35px;
    cursor: pointer;
    font-weight: 600;
    margin: auto;
    display: block
}

.galeri-tumu {
    float: right;
    position: relative;
    margin-top: -98px;
    margin-right: 59px
}

.galeri-tumu a {
    background: #fff;
    padding: 10px 20px;
    border-radius: 30px !important;
    font-size: 12px;
    font-weight: 800;
    display: flex !important;
    align-items: center;
    color: #2b3991;
    text-decoration: none !important;
    height: auto !important;
    width: auto !important
}

.galeri-tumu a i {
    font-size: 16px;
    margin-right: 10px
}

.hotel-foto-gallery a:nth-child(6):before {
    content: "";
    opacity: .7
}

.oneri-badge {
    position: absolute;
    z-index: 3;
    background: #2d3993;
    color: #fff;
    font-size: 11px;
    padding: 5px 15px;
    border-radius: 30px;
    top: 10px;
    left: 25px
}

.otel-yildiz-puan span {
    font-size: 12px
}

.otel-yildiz-puan strong {
    background: #2d3993;
    color: #fff;
    font-size: 14px;
    padding: 4px 10px;
    border-radius: 20px;
    margin-left: 10px
}

.mobil-tour-search-bar {
    display: none
}

.breacrumb {
    width: 100%;
    float: left;
    margin-bottom: 15px;
    box-sizing: border-box;
    padding-left: 10px
}

.breacrumb a,
.breacrumb span {
    color: #2b3991;
    margin-right: 20px;
    position: relative;
    font-size: 14px
}

.breacrumb a:before {
    font-family: "Font Awesome 5 Free";
    content: "\f054";
    position: absolute;
    font-weight: 600;
    right: -16px;
    font-size: 12px;
    top: 0
}

.hotel-tags .otel-yildiz-puan strong {
    margin-left: 0;
    margin-right: 10px
}

.tour-details-sidebar .haritada-goster {
    margin-bottom: 15px
}

.sidebar-countdown,
.tour-details-sidebar {
    margin-top: 0;
    background: #fff;
    border-radius: 15px;
    border: 1px solid #dedede;
    margin-bottom: 30px;
    overflow: hidden
}

.sticky-sidebar {
    position: sticky;
    top: 20px
}

.hotel-detail-form {
    width: 100%;
    float: left;
    border-radius: 55px;
    padding: 10px 20px;
    box-sizing: border-box;
    margin-top: 15px;
    position: sticky;
    top: 0;
    background: var(--gri-bg);
    z-index: 6;
    border: 1px solid #dedede
}

.hotel-detail-form .col-sm-4 {
    padding: 0 5px
}

.hotel-detail-form .search-box i {
    right: 13px
}

.hotel-detail-form .konuk-sayisi-popup {
    width: calc(100% - 12px)
}

.oda-sayisi {
    width: 100%;
    float: left
}

.selectOdaSayisi {
    margin-right: 10px;
    float: right;
    margin-top: 10px;
    height: 39px;
    text-align: center;
    border: 1px solid #dedede;
    outline: 0 !important;
    border-radius: 30px;
    font-size: 12px;
    font-weight: 600;
    color: var(--paragraf-color);
    justify-content: center;
    display: flex;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #fff
}

.thumb-bottom-badge {
    position: absolute;
    bottom: 15px;
    z-index: 2;
    left: 10px
}

.thumb-bottom-badge span {
    padding: 7px 10px;
    font-size: 10px;
    background: #fee;
    border-radius: 20px;
    color: #d32f2f;
    font-weight: 700;
    border: 1px solid #d32f2f
}

.thumb-top-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    z-index: 3
}

.thumb-top-badge span {
    font-size: 11px;
    font-weight: 700;
    background: #2b3991;
    color: #fff;
    padding: 7px 12px;
    border-radius: 20px
}

.musait-degil {
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    padding: 0 15px
}

.musait-degil i {
    font-size: 30px;
    color: #d32f2f;
    margin-bottom: 5px
}

.musait-degil p {
    font-size: 14px;
    text-align: center;
    color: #d32f2f
}

.tour-details-excerpt ul li span {
    width: 100%;
    float: left;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1
}

.tour-details-excerpt ul li i {
    float: left;
    margin-right: 3px
}

.tour-details-excerpt ul li strong {
    float: right;
    width: 30%;
    text-align: right
}

.tour-detail-total {
    width: 100%;
    float: left;
    border-top: 1px dashed #ccc;
    border-bottom: 1px dashed #ccc;
    margin-bottom: 15px;
    padding: 15px;
    color: #2b3991;
    font-size: 13px;
    display: flex;
    justify-content: space-between
}

.input-icon {
    width: 45px;
    height: 50px;
    background: #dbe0e2;
    display: flex;
    align-items: center;
    justify-content: center
}

.index-one-cikan-oteller {
    width: 100%;
    float: left;
    position: relative;
    margin-bottom: 80px
}

.index-otel-slider {
    width: 100%;
    float: left
}

.otel-slider-box {
    width: 100%;
    float: left;
    background: var(--gri-bg);
    border: 1px solid var(--border-color);
    box-sizing: border-box;
    border-radius: 15px;
    overflow: hidden
}

.otel-slider-box-img {
    width: 180px;
    height: 180px;
    float: left;
    background-size: cover;
    background-position: center;
    margin-right: 20px
}

.otel-slider-box-content {
    width: calc(100% - 200px);
    float: left;
    height: 180px;
    position: relative
}

.otel-slider-box-content h3 {
    font-size: 17px;
    color: var(--blue);
    font-weight: 600;
    margin-bottom: 6px;
    margin-top: 10px
}

.otel-slider-box-content .otel-col-info {
    height: 180px
}

.otel-slider-box-content .otel-location {
    margin-bottom: 10px
}

.otel-slider-box-content .otel-bilgi ul li {
    margin-bottom: 2px
}

.otel-slider-box-content .otel-list-badge {
    bottom: 10px
}

.otel-slider-box-content .green-badge {
    font-weight: 600;
    padding: 7px 13px
}

.otel-col-total {
    padding-left: 0
}

.otel-slider-box-content .otel-yildiz-puan {
    margin-top: 10px;
    right: 15px
}

.otel-slider-box-content .otel-yildiz-puan span {
    font-size: 11px
}

.otel-slider-box-content .otel-yildiz-puan strong {
    margin-left: 5px;
    font-size: 12px
}

.otel-slider-box-content .indirim-badge {
    right: 15px;
    font-size: 11px
}

.otel-slider-box-content .otel-fiyat-row {
    bottom: 10px;
    right: 15px;
    padding-right: 15px
}

.otel-slider-box-img a {
    width: 100%;
    height: 100%;
    display: block
}

.owl-dots {
    width: 100%;
    float: left;
    margin-top: 30px;
    display: flex;
    align-items: center;
    justify-content: center
}

.owl-dot {
    width: 15px;
    height: 15px;
    background: var(--blue);
    border-radius: 15px;
    margin: 4px;
    opacity: .5;
    transition: all ease-in-out .3s
}

.owl-dot.active {
    opacity: 1;
    width: 30px
}

.blue-row-banner {
    width: 100%;
    float: left;
    padding: 40px 0;
    background-image: url(../images/top-search-bg.jpg);
    background-size: cover;
    text-align: center;
    background-position: center;
    margin-bottom: 30px
}

.blue-row-banner h1 {
    color: #fff;
    font-size: 36px;
    font-weight: 800
}

.campaign-contents {
    width: 100%;
    float: left;
    margin-bottom: 80px
}

.campaign-list-bg {
    width: 100%;
    float: left;
    border-radius: 15px;
    box-shadow: 0 15px 25px rgba(0, 0, 0, .15);
    margin-bottom: 30px;
    box-sizing: border-box;
    padding: 30px;
    background-position: center;
    background-size: cover
}

.campaign-title {
    width: 100%;
    float: left;
    text-align: center;
    margin-bottom: 30px
}

.campaign-title h2 {
    color: #fff;
    font-size: 36px;
    font-weight: 600
}

.campaign-title p {
    color: #fff;
    font-size: 20px;
    font-weight: 300
}

.campaign-box {
    width: 100%;
    float: left;
    box-shadow: 0 15px 20px rgba(0, 0, 0, .3);
    margin-bottom: 30px;
    border-radius: 15px;
    overflow: hidden
}

.campaign-box-img {
    width: 100%;
    height: 180px;
    background-size: cover;
    background-position: center;
    position: relative
}

.campaign-box-img a {
    width: 100%;
    height: 100%;
    display: block;
    box-sizing: border-box;
    padding: 15px
}

.blue-badge {
    background: var(--blue);
    display: inline-block;
    font-size: 9px;
    color: #fff;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 20px;
    float: left;
    margin-right: 6px
}

.red-circle {
    background: #f02e35;
    width: 55px;
    height: 55px;
    position: absolute;
    bottom: 15px;
    right: 15px;
    border-radius: 50%;
    color: #fff;
    font-weight: 600;
    text-align: center;
    font-size: 16px;
    line-height: 18px;
    box-sizing: border-box;
    padding-top: 10px
}

.red-circle span {
    width: 100%;
    float: left;
    font-size: 9px
}

.campaign-box-content {
    width: 100%;
    float: left;
    background: #fff;
    padding: 10px 0;
    margin: 0
}

.campaign-box-content h3 {
    font-size: 16px;
    font-weight: 800;
    color: var(--blue);
    margin-bottom: 5px
}

.campaign-box-content ul li {
    float: left;
    font-size: 9px;
    display: block;
    align-items: center;
    margin-right: 9px;
    line-height: 18px;
    margin-bottom: 10px;
}

.campaign-box-content ul li img {
    margin-right: 4px;
    float: left
}

.campaign-price span {
    font-size: 8px;
    width: 100%;
    float: left;
    color: var(--p-color);
    position: relative;
    top: -3px
}

.campaign-price strong {
    color: var(--blue);
    font-size: 24px;
    font-weight: 800;
    line-height: 16px
}

.campaign-price strong #currency {
    width: auto;
    float: right;
    font-size: 13px;
    color: var(--blue);
    position: relative;
    top: 3px
}

.campaign-price strong #text {
    width: auto;
    float: right;
    font-size: 9px;
    color: var(--blue);
    position: relative;
    top: 3px
}

.campaign-rez-btn {
    width: 100%;
    float: left
}

.campaign-rez-btn a {
    width: 100%;
    float: left;
    background: var(--blue);
    color: #fff;
    padding: 10px 0;
    text-align: center;
    font-size: 14px
}

.campaign-price {
    width: 100%;
    float: left;
    margin-top: 5px
}

.custom-tooltip {
    --bs-tooltip-bg: var(--blue) !important
}

.vize-content-row {
    width: 100%;
    float: left;
    position: relative;
    margin-top: -50px;
    margin-bottom: 50px
}

.vize-sutun {
    width: 100%;
    float: left;
    background: var(--gri-bg);
    border-radius: 0 0 15px 15px;
    padding-bottom: 30px
}

.vize-sutun-title {
    width: 100%;
    float: left;
    margin-bottom: 30px;
    text-align: center;
    box-sizing: border-box;
    padding: 0 30px;
    position: relative;
    margin-top: -70px
}

.vize-sutun-title img {
    width: 140px;
    box-shadow: 0 15px 25px rgb(246 136 20 / 30%);
    border-radius: 50%;
    margin-bottom: 15px
}

.vize-sutun-title h2 {
    width: 80%;
    font-size: 22px;
    background: var(--orange);
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 800;
    border-radius: 30px;
    box-shadow: 0 15px 25px rgb(246 136 20 / 30%);
    float: left;
    margin-left: 10%;
    margin-right: 10%;
    margin-bottom: 30px
}

.vize-sutun-title p {
    font-size: 14px;
    color: var(--paragraf-color)
}

.vize-form {
    width: 100%;
    float: left;
    background: var(--blue);
    border-radius: 15px;
    box-sizing: border-box;
    padding: 30px 20px
}

.vize-form-input {
    width: 100%;
    float: left
}

.vize-form-input strong,
.vize-form-toplam-fiyat strong {
    width: 100%;
    float: left;
    color: #fff;
    font-weight: 500;
    margin-bottom: 5px;
    font-size: 14px
}

.vize-form .icon-input {
    width: 100%;
    float: left
}

.vize-form .icon-input select {
    width: 100%;
    float: left;
    height: 50px;
    font-size: 13px;
    box-sizing: border-box;
    padding-left: 45px;
    border-radius: 50px;
    background: #fff;
    border: none;
    color: var(--paragraf-color);
    background-image: url(../images/icn/arrow.svg);
    background-repeat: no-repeat;
    background-size: 10px;
    background-position: 93%;
    -webkit-appearance: none;
    appearance: none
}

.vize-fiyat-yetiskin {
    width: 100%;
    float: left
}

.vize-fiyat-yetiskin input {
    width: calc(100% - 70px);
    height: 50px;
    background: #fff;
    border-radius: 30px;
    text-align: center;
    font-weight: 800;
    color: var(--blue);
    float: left;
    margin-right: 20px
}

.vize-fiyat-yetiskin button {
    width: 50px;
    height: 50px;
    background: var(--orange);
    border-radius: 50%;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 11px;
    position: relative;
    outline: 0 !important
}

.vize-fiyat-yetiskin button:before {
    content: "";
    position: absolute;
    border-color: transparent var(--orange) transparent transparent;
    border-style: solid;
    border-width: 10px;
    width: 0;
    height: 0;
    left: -17px
}

.vize-form-input .icon-input input {
    font-size: 12px;
    padding-left: 45px
}

.vize-form-toplam-fiyat input {
    width: 100%;
    float: left;
    height: 50px;
    font-size: 13px;
    box-sizing: border-box;
    border-radius: 50px;
    background: #fff;
    border: none;
    color: var(--paragraf-color);
    background-color: #fff;
    text-align: center;
    font-weight: 800;
    color: var(--blue);
    font-size: 20px
}

.vize-form-toplam-fiyat strong {
    text-align: center
}

.vize-form-btn {
    height: 55px;
    font-weight: 800;
    font-size: 18px;
    width: 70%;
    margin-left: 15%;
    margin-top: 15px;
    box-shadow: 0 10px 20px rgb(247 147 29 / 30%);
    margin-bottom: 15px;
    border-radius: 30px
}

.vize-kurallar,
.vize-sss {
    width: 100%;
    float: left;
    margin-top: 40px;
    box-sizing: border-box;
    padding: 0 30px
}

.vize-kurallar h2,
.vize-sss h2 {
    font-size: 22px;
    font-weight: 700;
    width: 100%;
    float: left;
    text-align: center;
    color: var(--blue);
    margin-bottom: 20px
}

.vize-sss .accordion-row {
    margin-top: 7px
}

.vize-kurallar ul {
    width: 100%;
    float: left;
    position: relative
}

.vize-kurallar ul li {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding-left: 30px;
    font-size: 14px;
    color: var(--paragraf-color);
    margin-bottom: 10px;
    position: relative
}

.vize-kurallar ul li:before {
    content: "\f06a";
    position: absolute;
    left: 0;
    font-family: "Font Awesome 5 Pro";
    font-size: 16px
}

.mt-50 {
    margin-top: 50px
}

.mb-50 {
    margin-bottom: 50px
}

.mb-0 {
    margin-bottom: 0
}

.mt-80 {
    margin-top: 80px
}

.vize-person-popup {
    position: absolute;
    top: 75px;
    background: #fff;
    z-index: 2;
    width: calc(100% - 36px);
    left: 15px;
    box-shadow: 0 15px 25px rgba(0, 0, 0, .3);
    border-radius: 0 0 15px 15px;
    box-sizing: border-box;
    padding: 15px;
    display: none;
    border: 1px solid #ccc;
    border-top: 0
}

.vize-person-popup label {
    width: 100%;
    float: left;
    font-size: 14px;
    font-weight: 600;
    color: var(--blue);
    margin-bottom: 5px;
    text-align: center
}

.vize-person-popup select {
    width: 100%;
    height: 35px;
    margin-bottom: 10px;
    border-radius: 20px;
    border: 1px solid #ccc;
    color: var(--paragraf-color);
    font-size: 14px;
    text-align: center
}

.vize-person-close {
    width: 100%;
    height: 40px;
    background: var(--blue);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer
}

.vizePersonInput {
    transition: all ease-in-out .3s
}

.vizePersonInput.active {
    border-radius: 15px 15px 0 0 !important
}

.tab-icerik {
    display: none
}

.tab-icerik.open {
    display: block
}

.mobil-vize-col {
    display: block
}

.page-banner,
.sefer-head-row {
    width: 100%;
    float: left;
    background-image: url(../images/top-search-bg.jpg);
    background-size: cover;
    background-position: center;
    position: relative
}

.seferler-content {
    width: 100%;
    float: left;
    margin: 100px 0
}

.page-banner h1,
.sefer-head-row h1 {
    position: relative;
    color: #fff;
    margin-top: 35px;
    width: 100%;
    text-align: center;
    font-weight: 800;
    font-size: 34px;
    margin-bottom: 35px
}

.sefer-head-form {
    width: 100%;
    float: left;
    position: relative;
    background: #fff;
    border-radius: 45px;
    box-sizing: border-box;
    padding: 20px 20px 0 20px;
    margin-bottom: -50px;
    box-shadow: 0 15px 25px rgba(0, 0, 0, .15)
}

.page-banner h1 {
    margin-bottom: 10px;
    margin-top: 0;
    font-size: 40px
}

.page-banner {
    padding: 30px 0;
    margin-bottom: 50px
}

.page-banner .breadcrumb {
    position: relative;
    justify-content: center;
    padding: 0;
    color: #fff;
    background: 0 0;
    margin-bottom: 0
}

.page-banner .breadcrumb a,
.page-banner .breadcrumb span {
    color: #fff
}

.page-banner .breadcrumb a {
    font-weight: 700
}

.sefer-head-form .neredenNereye {
    width: 32%
}

.sefer-head-form .lokasyon-change-btn {
    width: 33px
}

.sefer-head-form .neredenNereye .lokasyon-col:first-child input {
    border-radius: 25px 0 0 25px;
    border-right: 0
}

.sefer-head-form .neredenNereye .lokasyon-col:last-child input {
    border-radius: 0 25px 25px 0;
    border-left: 0;
    padding-left: 20px
}

.sefer-head-form .lokasyon-change-btn span {
    border-radius: 0;
    background: #fff;
    border-left: 0;
    border-right: 0;
    font-size: 16px
}

.sefer-head-form .gidisDonusTarih {
    width: 30%;
    margin-left: 5px
}

.sefer-head-form .yolcuArac {
    width: 20%;
    margin-left: 10px
}

.sefer-head-form .main-search-btn {
    width: auto
}

.sefer-head-form .main-search-btn button {
    width: 50px;
    text-align: center
}

.sefer-head-form .main-search-btn button i {
    margin: auto
}

.sefer-head-form .yolcu-arac-popup.active {
    top: 90px;
    width: 90%;
    left: 5%;
    right: 5%;
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.seferGunler {
    width: 100%;
    float: left;
    background: var(--gri-bg);
    border: 1px solid #dedede;
    border-radius: 15px 15px 0 0;
    overflow: hidden;
    border-bottom: none
}

.sefer-gun-btn {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #dedede;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 600;
    color: var(--blue);
    cursor: pointer
}

.sefer-gun-btn.active {
    background: var(--blue);
    color: #fff
}

.sefer-gidis-donus {
    width: 100%;
    float: left;
    height: 50px;
    background: var(--blue);
    box-sizing: border-box;
    border: 1px solid #dedede;
    border-top: none;
    color: #fff;
    display: flex;
    align-items: center;
    padding: 0 20px;
    border-radius: 0 0 15px 15px;
    margin-bottom: 20px
}

.sefer-gidis-donus strong {
    margin-right: 15px;
    font-size: 18px
}

.sefer-gidis-donus p {
    display: flex;
    align-items: center
}

.sefer-gidis-donus p img {
    margin: 0 10px
}

.sefer-list-content {
    width: 100%;
    float: left;
    margin-bottom: 30px
}

.sefer-list-day-content {
    width: 100%;
    float: left;
    position: relative;
    display: none
}

.open {
    display: block
}

.sefer-list-row {
    width: 100%;
    float: left;
    border: 1px solid #dedede;
    margin-bottom: 15px;
    border-radius: 15px;
    background: #fff
}

.sefer-list-row.active {
    box-shadow: 0 0 20px rgb(43 57 145 / 50%)
}

.seferGunler ul li:last-child {
    border: none
}

.firma-info {
    width: 23%;
    float: left;
    height: 140px;
    box-sizing: border-box;
    padding: 20px;
    display: flex;
    align-items: center
}

.firma-logo {
    max-width: 75px;
    float: left;
    margin-right: 20px
}

.firma-name {
    width: 120px;
    float: left
}

.firma-name strong {
    width: 100%;
    float: left;
    color: var(--orange);
    font-size: 16px;
    line-height: 18px
}

.firma-name span {
    font-size: 12px;
    color: var(--paragraf-color)
}

.sefer-clock-info {
    width: 30%;
    float: left;
    display: flex;
    justify-content: space-between;
    margin-left: 1%;
    margin-right: 3%;
    padding: 11px 0;
    min-height: 140px;
    align-items: center;
}

.sefer-clock-col {
    width: 80px;
    text-align: center
}

.sefer-clock-col span,
.sefer-clock-total span {
    width: 100%;
    float: left;
    font-size: 11px;
    color: var(--paragraf-color);
    text-align: center
}

.sefer-clock-col strong {
    width: 100%;
    float: left;
    font-size: 20px;
    color: var(--blue)
}

.sefer-clock-total {
    width: 100px
}

.clock-total {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.clock-total strong {
    font-size: 14px;
    float: left;
    color: var(--blue);
    position: relative
}

.sefer-price {
    width: 140px;
    float: left;
    text-align: center;
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center
}

.sefer-durum-info {
    width: 100%;
    float: left;
    border-top: 1px solid #ededed
}

.price-camp {
    width: 100%;
    float: left;
    font-size: 12px;
    color: #39b54a;
    font-weight: 600
}

.sefer-price strong {
    width: 90%;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--blue);
    border-radius: 20px;
    color: var(--blue);
    margin-top: 3px
}

.price-excerpt {
    width: 100%;
    font-size: 12px;
    color: var(--paragraf-color);
    float: left;
    margin-top: 2px
}

.sefer-tooltips {
    width: 120px;
    float: left;
    text-align: center;
    height: 140px;
    box-sizing: border-box;
    padding: 15px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 2%;
    margin-top: 0px;
}

.son-koltuk {
    font-size: 11px;
    display: inline-block;
    color: #e05555;
    border: 1px solid #e05555;
    padding: 3px 10px;
    border-radius: 15px;
    margin-bottom: 5px
}

.fiyat-detayi {
    font-size: 12px;
    color: var(--blue);
    font-weight: 600
}

.sefer-btn {
    width: 150px;
    float: right;
    margin-right: 20px;
    height: 40px;
    border-radius: 30px;
    background: var(--orange);
    border: 1px solid var(--orange);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    transition: all ease-in-out .3s;
    appearance: none;
    outline: 0 !important
}

.sefer-btn.active,
.sefer-btn:hover {
    background: #fff;
    color: var(--orange)
}

.sefer-durum {
    width: 100%;
    float: left;
    padding: 10px 25px;
    font-size: 12px;
    color: var(--blue);
    font-weight: 600;
    display: flex;
    align-items: center;
    cursor: pointer
}

.sefer-durum i {
    margin-left: 10px;
    position: relative;
    top: 1px
}

.sefer-durum-aciklama {
    width: 100%;
    float: left;
    padding: 0 25px 15px;
    display: none
}

.sefer-durum-aciklama p {
    font-size: 12px;
    color: var(--paragraf-color);
    margin-bottom: 7px
}

.sefer-button {
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    float: right
}

.sefer-list-row:nth-child(odd) {
    background: #f6fff7
}

.sefer-list-row.pasif {
    pointer-events: none;
    opacity: .5;
    filter: blur(2px);
    border: 1px solid #918d8d
}

.acik-donus-sefer {
    border-radius: 15px
}

.sefer-head-form .gidisDonusTarih input,
.sefer-head-form .neredenNereye input,
.sefer-head-form .yolcuArac input {
    color: var(--blue);
    font-weight: 600
}

.duyuru-row {
    width: 100%;
    float: left;
    margin-bottom: 30px;
    background: #f7f9fa;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
    border-radius: 15px
}

.duyuru-row p {
    font-size: 14px;
    width: 100%;
    line-height: 24px;
    color: var(--blue)
}

.duyuru-row p img {
    float: left;
    margin-right: 15px
}

.duyuru-row .blue-btn {
    font-size: 12px;
    padding: 10px 25px;
    height: auto;
    font-weight: 600
}

.sefer-gun-btn.deactive {
    color: rgb(43 57 145 / 50%);
    pointer-events: none;
    cursor: not-allowed
}

.acik-donus-sefer-text {
    width: 100%;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center
}

.acik-donus-sefer-text span {
    font-size: 18px;
    color: var(--blue);
    margin-left: 15px;
    font-weight: 600
}

.sefer-reklam {
    width: 80%;
    background: var(--blue);
    float: left;
    margin-bottom: 15px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 10px 10px 30px;
    margin-left: 10%;
    margin-right: 10%;
    overflow: hidden;
    position: relative
}

.sefer-reklam p {
    font-size: 14px;
    color: #fff;
    line-height: 24px
}

.sefer-reklam p img {
    float: left;
    max-height: 22px;
    margin-right: 15px
}

.sefer-reklam .orange-btn {
    font-size: 12px;
    font-weight: 600;
    height: auto;
    padding: 10px 30px
}

.sefer-indirim:before,
.sefer-reklam:before {
    position: absolute;
    top: 0;
    left: -100%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .3) 100%);
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .3) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg);
    -webkit-animation: shine 4s infinite;
    animation: shine 4s infinite
}

@-webkit-keyframes shine {
    100% {
        left: 125%
    }
}

@keyframes shine {
    100% {
        left: 125%
    }
}

.alternatif-list {
    width: 100%;
    float: left;
    margin-top: 20px
}

.alternatif-list-button {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--blue);
    font-weight: 600;
    font-size: 14px;
    cursor: pointer
}

.alternatif-list-button i {
    margin: 0 10px
}

.alternatif-list-button i:first-child {
    font-size: 16px
}

.alternatif-list-button i.fa-chevron-down {
    transition: all ease-in-out .3s
}

.alternatif-list-button.active i.fa-chevron-down {
    transform: rotate(180deg)
}

.alternatif-list-content .sefer-button {
    height: 180px;
    float: none
}

.alternatif-list-content {
    width: 100%;
    float: left;
    margin-top: 20px;
    display: none
}

.mobil-fixed-sefer-sepet {
    position: fixed;
    z-index: 9;
    bottom: 0;
    background: var(--blue);
    width: 100%;
    padding: 10px 15px;
    box-sizing: border-box;
    box-shadow: 0 -5px 10px rgb(0 0 0 / 20%)
}

.mobil-sefer-sepet {
    width: 45%;
    float: left;
    color: #fff
}

.mobil-sefer-sepet-popup-btn {
    width: 100%;
    float: left;
    font-size: 12px;
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer
}

.orange-tooltip,
.red-tooltip {
    position: absolute;
    background: var(--orange);
    width: auto;
    display: block;
    font-size: 10px;
    padding: 3px 10px;
    border-radius: 15px;
    font-weight: 600;
    top: -30px;
    left: 0
}

.red-tooltip {
    background: #e05555
}

.orange-tooltip:before,
.red-tooltip:before {
    content: '';
    position: absolute;
    left: 15px;
    bottom: -8px;
    border-style: solid;
    border-top-width: 5px;
    border-right-width: 5px;
    border-left-width: 5px;
    border-top-color: var(--orange);
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent
}

.red-tooltip:before {
    border-top-color: #e05555
}

.mobil-sefer-sepet-popup-btn i {
    float: left;
    margin-left: 6px;
    position: relative;
    transition: all ease-in-out .3s;
    top: -2px
}

.mobil-sefer-sepet-fiyat {
    width: 100%;
    float: left;
    font-size: 20px;
    font-weight: 800
}

.mobil-sefer-sepet-fiyat span {
    font-size: 11px;
    position: relative;
    top: -6px;
    margin-left: 4px
}

.mobil-sefer-odeme-btn {
    width: 51%;
    float: right;
    height: 48px;
    display: flex;
    align-items: center
}

.mobil-sefer-odeme-btn a,
.mobil-sefer-odeme-btn button {
    background: var(--orange);
    color: #fff;
    width: 100%;
    height: 35px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 600;
    border-radius: 30px;
    border: none
}

.mobil-sefer-odeme-btn a i,
.mobil-sefer-odeme-btn button i {
    float: left;
    margin-left: 10px
}

.mobil-fixed-sepet-popup {
    position: fixed;
    z-index: 8;
    background: #fff;
    width: 100%;
    bottom: -100vh;
    padding-bottom: 100px;
    padding-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
    box-shadow: 0 -10px 10px rgba(0, 0, 0, .2);
    transition: all ease-in-out .5s
}

.mobil-fixed-sepet-popup ul li {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    line-height: 26px;
    color: var(--blue)
}

.mobil-fixed-sepet-popup.active {
    bottom: 0
}

.mobil-sefer-sepet.active .mobil-sefer-sepet-popup-btn i {
    transform: rotate(180deg);
    top: 2px
}

.mobil-sefer-odeme-btn a span {
    float: left;
    position: relative;
    top: -2px
}

.tur-head {
    width: 100%;
    float: left;
    background: #2b3991;
    background: -moz-linear-gradient(90deg, rgba(43, 57, 145, 1) 0, rgba(52, 120, 230, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(43, 57, 145, 1) 0, rgba(52, 120, 230, 1) 100%);
    background: linear-gradient(90deg, rgba(43, 57, 145, 1) 0, rgba(52, 120, 230, 1) 100%);
    padding: 15px 0;
    margin-bottom: 30px
}

.tur-head-left {
    width: 65%;
    float: left;
    display: flex;
    align-items: center
}

.tur-head-right {
    width: 35%;
    float: left;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.tur-head-left p {
    color: #fff;
    font-weight: 600;
    margin-right: 20px
}

.tur-head-menu {
    display: inline-flex;
    align-items: center
}

.tur-head-menu a {
    color: #fff
}

.tur-head-menu .switch span {
    width: 100%;
    height: 100%;
    background: #fff;
    display: block;
    border-radius: 30px;
    position: relative;
    border: 2px solid var(--orange);
    box-sizing: border-box
}

.tur-head-menu .switch {
    margin: 0 10px;
    cursor: pointer
}

.tur-head-menu .switch span:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    background: var(--orange);
    border-radius: 50%;
    transition: all ease-in-out .3s;
    left: 0;
    top: 0
}

.tur-head-menu .switch.active span:before {
    left: 26px
}

.tur-olustur {
    width: 100%;
    float: left;
    margin-bottom: 30px;
    background: var(--gri-bg);
    border: 1px solid #dedede;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.tur-olustur-icerik {
    width: 80%;
    float: left
}

.tur-olustur-icerik img {
    width: 45px;
    float: left;
    margin-right: 15px
}

.tur-olustur-text {
    width: calc(100% - 60px);
    float: left
}

.tur-olustur-text strong {
    font-size: 18px;
    color: var(--blue)
}

.tur-olustur-text p {
    font-size: 14px;
    color: var(--blue)
}

.tur-olustur-button .orange-btn {
    font-weight: 600
}

.tur-list-title-banner {
    width: 100%;
    float: left;
    background: #2b3991;
    background: -moz-linear-gradient(90deg, rgba(43, 57, 145, 1) 0, rgba(52, 120, 230, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(43, 57, 145, 1) 0, rgba(52, 120, 230, 1) 100%);
    background: linear-gradient(90deg, rgba(43, 57, 145, 1) 0, rgba(52, 120, 230, 1) 100%);
    padding: 20px 20px 70px;
    text-align: center;
    border-radius: 15px 15px 0 0
}

.tur-list-title-banner h1 {
    color: #fff;
    font-weight: 800
}

.tur-list-title-banner p {
    color: #fff
}

.tur-list-aylar {
    width: 96%;
    float: left;
    position: relative;
    margin-left: 2%;
    margin-top: -40px;
    margin-bottom: 20px
}

.tur-ay-button {
    width: 100%;
    float: left;
    border-right: 1px solid #dedede;
    box-sizing: border-box;
    padding: 5px;
    text-align: center;
    min-height: 76px;
    transition: all ease-in-out .3s;
    cursor: pointer;
    position: relative
}

.turListAylarSlider .owl-item:last-child .tur-ay-button {
    border-right: 0
}

.tur-aylar {
    width: 100%;
    float: left;
    color: var(--blue);
    font-weight: 700
}

.tur-program-adet {
    width: 100%;
    float: left;
    font-size: 12px;
    color: var(--blue)
}

.tur-ay-fiyat {
    width: 100%;
    float: left;
    font-weight: 700;
    color: var(--blue)
}

.tur-ay-button.pasif,
.tur-ay-button:hover {
    background: #f0f0f4
}

.tur-ay-button.pasif {
    pointer-events: none
}

.tur-program-adet i {
    font-size: 16px;
    position: relative;
    margin-top: 2px;
    bottom: -2px
}

.turListAylarSlider .owl-item:last-child .tur-ay-button {
    border-top-right-radius: 15px
}

.turListAylarSlider .owl-item:first-child .tur-ay-button {
    border-top-left-radius: 15px
}

.tur-ay-button.active {
    background: var(--blue)
}

.tur-ay-button.active .tur-ay-fiyat,
.tur-ay-button.active .tur-aylar,
.tur-ay-button.active .tur-program-adet {
    color: #fff
}

.tur-ay-button.active:before {
    content: '';
    position: absolute;
    right: 50%;
    margin-right: -8px;
    bottom: -11px;
    border-style: solid;
    border-top-width: 8px;
    border-right-width: 8px;
    border-left-width: 8px;
    border-top-color: var(--blue);
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent
}

.owl-carousel.turListAylarSlider .owl-stage-outer {
    padding-bottom: 35px;
    box-sizing: border-box
}

.owl-carousel.turListAylarSlider .owl-stage-outer .owl-stage {
    background: var(--gri-bg);
    border-radius: 15px
}

.tur-list-aylar:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 76px;
    float: left;
    box-shadow: 0 15px 20px rgb(0 0 0 / 10%);
    border-radius: 15px;
    left: 0;
    top: 0
}

.tarihe-gore-listele {
    width: 100%;
    float: left;
    position: relative
}

.tarihe-gore-turlar {
    width: 100%;
    float: left;
    position: relative;
    display: none
}

.tarihe-gore-turlar.open {
    display: block
}

.tarihe-gore-row {
    width: 100%;
    float: left;
    background: var(--gri-bg);
    margin-bottom: 15px;
    border: 1px solid #ededed;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 15px
}

.tarihe-gore-gallery {
    width: calc(23% - 25px);
    height: 140px;
    float: left;
    margin-right: 25px
}

.tur-list-gallery {
    width: 100%;
    height: 140px;
    display: block;
    float: left;
    position: relative;
    background-size: cover;
    background-position: center;
    border-radius: 15px
}

.tarihe-gore-gallery .owl-dots {
    margin-top: -25px;
    position: relative
}

.tarihe-gore-gallery .owl-dots .owl-dot {
    background: #fff;
    width: 10px;
    height: 10px;
    box-shadow: 0 0 15px rgb(0 0 0 / 50%)
}

.tarihe-gore-content {
    width: calc(37% - 30px);
    float: left;
    height: 140px;
    position: relative;
    margin-right: 30px
}

.tarihe-gore-content h2 {
    font-size: 18px;
    font-weight: 800;
    color: var(--blue);
    margin-bottom: 10px
}

.tarihe-gore-content h2 a {
    font-size: 18px;
    font-weight: 800;
    color: var(--blue);
    margin-bottom: 10px
}

.tur-list-gece-sayisi {
    background: var(--blue);
    display: inline-block;
    color: #fff;
    font-size: 12px;
    padding: 3px;
    border-radius: 30px;
    margin-bottom: 10px
}

.tur-list-gece-sayisi i {
    background: var(--orange);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    float: left;
    margin-right: 5px
}

.tur-list-gece-sayisi span {
    line-height: 20px;
    margin-right: 10px
}

.tur-list-tarih-info {
    width: 100%;
    float: left;
    font-size: 13px;
    color: var(--blue);
    margin-bottom: 15px
}

.tarih-tur-list-aciklama {
    width: 100%;
    float: left;
    font-size: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: absolute;
    bottom: 0;
    color: var(--paragraf-color)
}

.tarihe-gore-oteller {
    width: 40%;
    float: left;
    height: 140px;
    display: flex;
    align-items: center
}

.ortala {
    width: 100%;
    float: left
}

.tarihe-gore-otel-row {
    width: 100%;
    float: left;
    margin: 25px 0 15px;
    background: var(--blue);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px
}

.tarih-tur-otel-name {
    width: 60%;
    float: left;
    position: relative;
    color: #fff;
    display: flex;
    align-items: center
}

.tarih-tur-otel-name>i {
    width: 25px;
    height: 25px;
    background: var(--orange);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    float: left;
    margin-right: 5px
}

.tarih-tur-otel-name>strong {
    font-size: 13px;
    font-weight: 500;
    float: left;
    position: relative
}

.tur-list-otel-aracli {
    float: left;
    margin-left: 5px;
    background: #7cb900;
    font-size: 11px;
    border-radius: 20px;
    padding: 3px 8px 3px 3px;
    display: flex;
    align-items: center
}

.tur-list-otel-aracli i {
    width: 18px;
    height: 18px;
    background: #fff;
    border-radius: 50%;
    float: left;
    color: #7cb900;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    margin-right: 3px
}

.tarih-tur-otel-fiyat {
    width: 40%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: end
}

.tur-otel-fiyat {
    position: relative;
    color: #fff;
    width: 85px;
    text-align: right;
    margin-right: 10px
}

.tur-otel-fiyat strong {
    float: right
}

.tur-detay-btn {
    background: var(--orange);
    font-size: 10px;
    color: #fff;
    border-radius: 15px;
    padding: 5px 10px;
    font-weight: 600;
    border: 1px solid var(--orange);
    box-sizing: border-box;
    transition: all ease-in-out .3s
}

.tur-otel-fiyat .red-tooltip {
    float: right;
    right: 0;
    left: auto
}

.tur-otel-fiyat .red-tooltip:before {
    left: 50%;
    margin-left: -5px
}

.tur-detay-btn:hover {
    background: #fff;
    color: var(--orange)
}

.tur-content {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 0 5%;
    margin-top: 50px;
    text-align: justify;
    margin-bottom: 50px
}

.tur-content ol li,
.tur-content p,
.tur-content ul li {
    color: var(--paragraf-color);
    margin-bottom: 15px;
    font-size: 14px
}

.tur-content h1,
.tur-content h2,
.tur-content h3 {
    color: var(--blue);
    margin-bottom: 10px
}

.tur-content ul {
    list-style: disc;
    margin-left: 20px;
    margin-bottom: 15px
}

.tur-content ol li,
.tur-content ul li {
    margin-bottom: 5px
}

.tur-content ol {
    list-style: decimal;
    margin-left: 20px;
    margin-bottom: 15px
}

.tur-kategori-content {
    width: 100%;
    float: left;
    position: relative;
    display: none
}

.tur-kategori-content.open {
    display: block
}

.tura-gore-tur-col {
    width: 96%;
    float: left;
    margin-left: 2%;
    margin-right: 2%;
    position: relative;
    margin-bottom: 30px
}

.tura-gore-tur-row {
    width: 100%;
    background: #fff;
    box-shadow: 0 15px 25px rgba(0, 0, 0, .1);
    border-radius: 15px;
    float: left
}

.tura-gore-tur-col:first-child {
    margin-top: -40px
}

.tura-gore-row-content {
    width: 65%;
    float: left;
    box-sizing: border-box;
    padding: 20px 25px
}

.tura-gore-row-gallery {
    width: 35%;
    float: left;
    margin-right: 0;
    box-sizing: border-box;
    padding: 20px;
    height: auto
}

.tura-gore-aylar {
    width: 100%;
    float: left
}

.tura-gore-aylar .tur-ay-button {
    background: var(--gri-bg)
}

.tura-gore-aylar .tur-ay-button.active {
    background: var(--blue)
}

.tura-gore-aylar .owl-carousel .owl-stage-outer {
    padding-bottom: 10px;
    margin-bottom: -10px
}

.tura-gore-row-content h2 {
    font-size: 22px;
    font-weight: 800;
    color: var(--blue);
    margin-bottom: 10px;
    text-transform: uppercase
}

.tura-gore-row-content h2 a {
    font-size: 22px;
    font-weight: 800;
    color: var(--blue);
    margin-bottom: 10px;
    text-transform: uppercase
}

.tura-gore-row-content p {
    font-size: 14px;
    color: var(--paragraf-color)
}

.tura-gore-galery-badge {
    position: absolute;
    z-index: 2;
    width: 50px;
    background: #e05555;
    right: 35px;
    top: 35px;
    padding: 5px;
    box-sizing: border-box;
    border-radius: 10px;
    color: #fff
}

.tura-gore-galery-badge strong {
    width: 100%;
    float: left;
    text-align: center;
    line-height: 20px
}

.tura-gore-galery-badge span {
    font-size: 11px;
    width: 100%;
    float: left;
    text-align: center;
    line-height: 16px
}

.tura-gore-row-gallery .tur-list-gallery {
    height: 180px
}

.tura-gore-aylar .owl-item:last-child .tur-ay-button {
    border-right: 0;
    border-bottom-right-radius: 15px
}

.tura-gore-aylar .owl-item:first-child .tur-ay-button {
    border-bottom-left-radius: 15px
}

.tura-gore-aylar .tur-ay-button.pasif,
.tura-gore-aylar .tur-ay-button:hover {
    background: #f4f5ff
}

.tura-gore-turlar {
    width: 100%;
    float: left;
    margin-top: 30px
}

.tura-gore-turlar .tarihe-gore-content {
    width: 50%;
    height: auto
}

.tura-gore-turlar .tarihe-gore-oteller {
    width: 47%;
    height: auto
}

.tura-gore-aylar .tur-ay-button.active:hover {
    background: var(--blue)
}

.ui-menu .ui-menu-item-wrapper:hover {
    color: #fff !important
}

.tur-head-left p i {
    display: none
}

.landing-content {
    width: 100%;
    float: left;
    margin: 80px 0 30px
}

.landing-icerik {
    width: 100%;
    float: left;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 20px 30px 0
}

.landing-icerik p {
    font-size: 14px;
    line-height: 24px;
    margin-bottom: 15px;
    color: var(--paragraf-color)
}

.landing-icon-list {
    width: 100%;
    float: left;
    margin-bottom: 50px
}

.landing-icon-box {
    width: 100%;
    float: left;
    border: 1px solid #dedede;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 0 0;
    overflow: hidden
}

.landing-icon {
    width: 100%;
    float: left;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gri-bg);
    padding: 15px
}

.landing-icon img {
    width: auto !important;
    max-width: none;
    max-height: 100%
}

.landing-icon-title {
    width: 100%;
    float: left;
    text-align: center;
    color: #5a5a5a;
    text-transform: uppercase;
    font-size: 14px;
    height: 55px;
    border-bottom: 1px solid #dedede;
    box-sizing: border-box;
    padding: 0 15px 15px;
    background: var(--gri-bg)
}

.landing-icon-icerik {
    width: 100%;
    float: left;
    text-align: center;
    color: var(--blue);
    font-weight: 700;
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    padding: 15px;
    flex-direction: column
}

.landing-icon-icerik a {
    color: var(--blue);
    padding: 10px 0
}

.landing-map-row {
    padding-top: 50px;
    margin-top: 30px
}

.landing-map {
    width: 95%;
    height: 550px;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .3)
}

.landing-map iframe {
    width: 100%;
    height: 100%
}

.landing-gezilecek-yerler-row {
    width: 100%;
    float: left;
    padding: 50px 0
}

.landing-img {
    width: 100%;
    float: left
}

.landing-img img {
    border-radius: 15px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, .15);
    width: 95%
}

.landing-gezilecek-yerler-row h2 {
    font-size: 30px;
    width: 100%;
    float: left;
    font-weight: 600;
    text-align: center;
    margin-bottom: 30px;
    margin-top: 30px;
    color: var(--blue)
}

.toollist {
    width: 100%;
    float: left;
    border-radius: 15px;
    overflow: hidden;
    border: 2px solid #000;
    margin-bottom: 30px
}

.toollist-title {
    width: 100%;
    height: 50px;
    background: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff
}

.toollist-title img {
    max-height: 35px;
    max-width: 35px;
    margin-right: 15px
}

.toollist-title strong {
    font-size: 14px
}

.toollist-content {
    width: 100%;
    float: left;
    text-align: center
}

.toollist-content ul {
    width: 100%;
    float: left
}

.toollist-content ul li {
    width: 100%;
    float: left;
    border-bottom: 1px solid var(--border-color);
    padding: 10px 0;
    font-size: 14px;
    color: var(--paragraf-color)
}

.toollist.turuncu {
    border: 2px solid var(--turuncu)
}

.toollist.turuncu .toollist-title {
    background: var(--turuncu)
}

.toollist.kirmizi {
    border: 2px solid var(--kirmizi)
}

.toollist.kirmizi .toollist-title {
    background: var(--kirmizi)
}

.toollist.yesil {
    border: 2px solid var(--yesil)
}

.toollist.yesil .toollist-title {
    background: var(--yesil)
}

.toollist.mavi {
    border: 2px solid var(--mavi)
}

.toollist.mavi .toollist-title {
    background: var(--mavi)
}

.landing-vize-row {
    width: 100%;
    float: left;
    margin-bottom: 80px
}

.landing-vize-widget {
    width: 100%;
    float: left;
    padding: 35px 40px;
    background-size: cover;
    background-position: center right;
    border-radius: 15px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .15);
    overflow: hidden;
    position: relative
}

.landing-vize-widget:before {
    content: "";
    position: absolute;
    width: 85%;
    height: 100%;
    background: #fff;
    background: -moz-linear-gradient(90deg, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 0) 100%);
    background: -webkit-linear-gradient(90deg, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 0) 100%);
    left: 0;
    top: 0
}

.vize-widget-content {
    width: 70%;
    float: left;
    position: relative
}

.vize-widget-content h3 {
    font-weight: 800;
    color: var(--blue);
    font-size: 24px;
    margin-bottom: 10px
}

.vize-widget-content p {
    color: var(--paragraf-color);
    font-size: 14px;
    width: 70%;
    margin-bottom: 15px
}

.vize-widget-content a {
    background: var(--orange);
    color: #fff;
    padding: 12px 30px;
    display: inline-block;
    border-radius: 30px;
    font-weight: 600;
    font-size: 14px;
    border: 1px solid var(--orange);
    transition: all ease-in-out .3s
}

.vize-widget-content a:hover {
    background: #fff;
    color: var(--orange)
}

.landing-gezi-rehberi {
    width: 100%;
    float: left;
    margin-top: 30px;
    margin-bottom: 80px
}

.landing-gezi-rehberi .title {
    margin-bottom: 20px
}

.landing-gezi-rehberi p {
    font-size: 14px;
    line-height: 24px;
    margin-bottom: 15px;
    text-align: justify;
    color: var(--paragraf-color)
}

.landing-gezi-rehberi h3 {
    font-size: 18px;
    font-weight: 700;
    color: var(--blue);
    margin-bottom: 15px
}

.landing-gezi-rehberi a {
    color: var(--blue);
    font-weight: 600
}

.search-text-date {
    width: 40%;
    float: left;
    font-weight: 700;
    font-size: 14px;
    color: var(--blue);
    margin-top: 5px
}

.search-text-seperator {
    width: 8%;
    float: left;
    font-size: 14px;
    color: var(--p-color);
    margin-top: 5px
}

.thumbSlider {
    width: 100%;
    float: left
}

.otelListThumb {
    width: 100%;
    float: left;
    height: 200px;
    background-size: cover;
    background-position: center;
}

.thumbSlider .owl-dots {
    margin-top: -25px
}

.thumbSlider .owl-dots .owl-dot {
    background: #fff;
    width: 10px;
    height: 10px;
    opacity: .7;
    margin: 3px
}

.thumbSlider .owl-dots .owl-dot.active {
    opacity: 1;
    background: #fff;
    z-index: 2;
    width: 20px
}

.thumbSlider .owl-prev {
    left: 10px
}

.thumbSlider .owl-theme .owl-nav [class*=owl-] {
    width: 30px;
    height: 30px;
    background: rgb(255 255 255 / 70%) !important;
    opacity: 0
}

.thumbSlider .owl-next:before,
.thumbSlider .owl-prev:before {
    font-size: 14px
}

.thumbSlider .owl-next {
    right: 10px
}

.thumbSlider .owl-theme .owl-nav {
    margin-top: -15px !important
}

.thumbSlider .owl-theme .owl-nav [class*=owl-]:hover {
    background: rgb(255 255 255 / 100%) !important
}

.thumbSlider:hover .owl-theme .owl-nav [class*=owl-] {
    opacity: 1
}

.yildiz-checkbox ul li:before {
    content: "\f005";
    position: absolute;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    border-radius: 50%;
    font-family: "Font Awesome 5 Pro";
    color: var(--orange);
    font-size: 32px
}

.yildiz-checkbox ul li:after {
    content: "\f005";
    position: absolute;
    width: 35px;
    height: 35px;
    transition: all ease-in-out .3s;
    opacity: 0;
    font-family: "Font Awesome 5 Free";
    font-size: 32px;
    display: flex;
    align-items: center;
    color: var(--orange)
}

.yildiz-checkbox ul li.active:after {
    opacity: 1
}

.yildiz-checkbox ul li.active label {
    color: #fff
}

.otel-detail-card p {
    font-weight: 400;
    color: var(--paragraf-color);
    margin-bottom: 15px;
    font-size: 14px
}

.konukSayisi {
    transition: all ease-in-out .3s
}

.konukSayisi.active {
    border-radius: 15px 15px 0 0
}

.otel-search {
    margin-left: -7px;
    margin-right: -7px
}

.otel-search .col-md-4 {
    padding: 0 7px
}

.tour-slider-container {
    width: 100%;
    float: left;
    background: #fff;
    border-radius: 15px;
    border: 1px solid #dedede;
    box-sizing: border-box;
    padding: 15px
}

.rezervasyon-btn:hover {
    background: #fff;
    color: var(--orange)
}

.hotel-tags .icon {
    background: #2b3991;
    padding-right: 15px;
    color: #fff;
    border-radius: 25px;
    margin-left: 10px;
    font-size: 12px;
    display: flex;
    align-items: center
}

.hotel-tags .icon img {
    margin-right: 5px
}

.hotel-tags {
    width: 100%;
    float: left;
    margin-bottom: 25px;
    margin-top: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.galeri-tumu a:before {
    display: none
}

.tour-details-full {
    width: 100%;
    float: left;
    padding: 0 5px;
    box-sizing: border-box
}

.hotel-detail-form .col-md-6 {
    padding: 0 5px
}

.hotel-detail-form .col-md-2 {
    padding: 0 5px
}

.seach-btn:hover {
    background: #fff;
    color: var(--orange)
}

.big-blue-but {
    font-family: Inter, sans-serif;
    font-size: 14px;
    color: #fff;
    background-color: var(--blue);
    padding: 13px 19px;
    display: block;
    text-align: center;
    border-radius: 30px;
    position: relative;
    margin-bottom: 10px;
    float: left;
    width: 100%;
    border: 1px solid var(--blue);
    box-sizing: border-box;
    transition: all ease-in-out .3s
}

.big-blue-but i {
    margin-right: 5px
}

.big-blue-but:hover {
    background: var(--orange);
    color: #fff;
    border: 1px solid var(--orange)
}

.line-blue-btn:hover {
    border: 1px solid var(--orange);
    color: var(--orange)
}

.otelDetayModal .modal-content {
    border-radius: 15px;
    overflow: hidden
}

.otelDetayModal .modal-header {
    background: var(--blue);
    color: #fff
}

.otelDetayModal .modal-header .modal-title {
    font-size: 18px;
    font-weight: 600
}

.otelDetayModal .modal-header .close {
    color: #fff;
    text-shadow: none
}

.otelDetayModal .form-group label {
    font-size: 14px;
    color: var(--paragraf-color);
    margin-bottom: 5px
}

.otelDetayModal .form-group .form-control {
    height: 45px;
    border-radius: 30px;
    font-size: 12px;
    padding: 0 20px;
    outline: 0 !important;
    box-shadow: none !important
}

.otelDetayModal .blue-btn {
    margin: auto;
    float: none
}

.otelDetayModal .form-group .form-control:focus {
    border: 1px solid var(--orange)
}

.otelDetayModal .otelListThumb {
    height: 250px;
    border-radius: 15px
}

.oda-modal-slider .owl-prev {
    left: 10px
}

.oda-modal-slider .owl-next {
    right: 10px
}

.oda-modal-slider .owl-theme .owl-nav [class*=owl-] {
    width: 35px;
    height: 35px;
    font-size: 20px !important
}

.oda-modal-slider .owl-theme .owl-nav {
    margin-top: -15px !important
}

.oda-modal-slider .owl-dots {
    margin-top: 10px
}

.oda-modal-slider .owl-dots .owl-dot {
    width: 10px;
    height: 10px
}

.otel-detay-sidebar-ozet {
    width: 100%;
    float: left
}

.otel-list-row .haritada-goster img {
    border-radius: 15px
}

.tur-detay-slider {
    width: 100%;
    float: left;
    position: relative;
    margin-bottom: 15px
}

.turDetaySliderImg {
    width: 100%;
    height: 400px;
    float: left;
    background-size: cover;
    background-position: center;
    border-radius: 15px
}

.turDetaySlider .owl-next {
    right: 15px
}

.turDetaySlider .owl-prev {
    left: 15px
}

.tour-details-full>h3 {
    font-size: 16px;
    font-weight: 600;
    color: var(--blue);
    margin-bottom: 8px;
    width: 100%;
    float: left;
    margin-top: 10px
}

.tur-detay-tab .nav-link {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    margin-right: 2px;
    background: var(--gri-bg);
    font-weight: 600;
    font-size: 14px;
    color: var(--blue)
}

.tur-detay-tab .nav-link.active {
    margin-bottom: -1px;
    background: #fff
}

.tur-detay-tab {
    margin-top: 15px;
    width: 100%;
    float: left
}

.tur-detay-tab-content {
    border: 1px solid #dee2e6;
    float: left;
    width: 100%;
    border-top: 0;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    box-sizing: border-box;
    padding: 15px;
    max-height: 500px;
    overflow-x: scroll;
    margin-bottom: 20px
}

.tur-detay-tab-content ol,
.tur-detay-tab-content ul {
    list-style: disc;
    width: calc(100% - 20px);
    float: left;
    margin-left: 20px
}

.tur-detay-tab-content ol {
    list-style: decimal
}

.tur-detay-tab-content ol li,
.tur-detay-tab-content ul li {
    font-size: 14px;
    color: var(--paragraf-color);
    line-height: 24px
}

.tur-detay-tab-content h4 {
    color: var(--blue);
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px
}

.tur-detay-room .otelListThumb {
    height: 150px
}

.tur-detay-room .ozellik-list ul li {
    width: 100%
}

.tur-detay-room .detail-room-price {
    height: 150px;
    align-items: center
}

.tur-detay-room .detail-room-price .otel-button {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px
}

.popupOdaEkleRow {
    width: 100%;
    float: left;
    border-top: 1px solid #eee
}

.popupOdaBaslik {
    width: 100%;
    float: left;
    font-size: 14px;
    padding: 10px 0;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.popupOdaBaslik strong {
    color: var(--blue)
}

.popupOdaBaslik span {
    color: red;
    cursor: pointer
}

.oda-ekle-row {
    border-top: 1px solid #eee;
    padding-top: 15px;
    align-items: center
}

.oda-ekle-btn {
    color: var(--blue);
    font-weight: 600;
    font-size: 14px;
    cursor: pointer
}

.oda-ekle-row .konuk-submit {
    font-size: 14px
}

.ui-menu .ui-menu-item img {
    padding: 0 !important;
    margin-right: 10px;
    float: left;
    width: 18px
}

.iti {
    width: 100%
}

.iti__selected-flag {
    padding-left: 5px !important;
    padding-right: 0 !important
}

.iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag {
    background: 0 0 !important
}

.iti__country-list {
    overflow-x: hidden
}

.iti__country-name {
    font-size: 14px !important;
    margin-left: 10px;
    color: var(--paragraf-color)
}

.iti__dial-code {
    font-size: 14px !important;
    margin-right: 0 !important;
    width: auto !important;
    float: right
}

.iti input[type=tel] {
    padding-left: 55px !important
}

.app-buttons {
    width: 100%;
    float: left;
    margin-top: 25px
}

.app-buttons a {
    float: left;
    margin-right: 10px
}

.app-buttons a img {
    height: 40px;
    width: auto
}

.explanation-widget {
    width: 100%;
    float: left;
    margin: 50px 0;
    background: var(--gri-bg);
    border-radius: 15px;
    box-sizing: border-box;
    box-shadow: 0 15px 25px rgba(0, 0, 0, .1);
    padding: 50px 15%;
    position: relative;
    text-align: center
}

.explanation-widget a {
    display: inline-flex;
    float: none;
    position: relative;
    margin: 0 5px;
    font-weight: 600
}

.explanation-widget h3 {
    color: var(--blue);
    font-size: 26px;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 15px
}

.explanation-widget p {
    font-size: 18px;
    font-weight: 300;
    line-height: 28px;
    margin-bottom: 25px;
    width: 100%;
    float: left
}

.explanation-widget a i {
    margin-right: 10px
}

.user-login-popup {
    width: 300px;
    position: absolute;
    z-index: 8;
    background: #fff;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 15px;
    top: 90px;
    right: 0;
    box-shadow: 0 15px 25px rgba(0, 0, 0, .1)
}

.user-login-popup-head {
    width: 100%;
    float: left;
    margin-bottom: 10px
}

.user-login-popup-head img {
    width: 35px;
    float: left;
    margin-right: 15px
}

.user-login-popup-head strong {
    font-size: 15px;
    line-height: 35px;
    color: #424242
}

.user-login-popup-head strong span {
    font-size: 8px;
    background: var(--blue);
    color: #fff;
    padding: 5px 10px;
    border-radius: 20px;
    display: inherit;
    position: relative;
    margin-left: 5px;
    top: -2px
}

.user-login-close {
    float: right;
    line-height: 35px;
    cursor: pointer
}

.user-login-close:hover {
    color: var(--blue)
}

.user-login-popup p {
    font-size: 14px;
    color: var(--paragraf-color)
}

.user-login-popup:before {
    content: "";
    position: absolute;
    border-color: transparent transparent #fff transparent;
    border-style: solid;
    border-width: 10px;
    width: 0;
    height: 0;
    top: -20px;
    left: 50%;
    margin-left: -10px
}

.tur-search-btn .orange-btn {
    float: none;
    margin: auto
}

.otel-search-row {
    margin: 0
}

.yetiskin-row {
    width: 100%;
    float: left;
    border-bottom: 1px solid #ccc;
    margin-bottom: 20px;
    padding-bottom: 20px
}

.oda-sayisi-name {
    width: 100%;
    float: left;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.oda-sayisi-name strong {
    color: var(--paragraf-color)
}

.yetiskin-col {
    width: calc(50% - 10px);
    margin-right: 10px
}

.yetiskin-col:last-child {
    margin-right: 0;
    margin-left: 10px
}

.oda-sayisi-name span {
    color: var(--kirmizi);
    font-size: 14px;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer
}

.yetiskin-footer-row {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    justify-content: space-between
}

.otel-search-oda-ekle {
    width: calc(50% - 15px);
    float: left;
    font-weight: 700;
    color: var(--blue);
    text-decoration: underline;
    cursor: pointer;
    transition: all ease-in-out .3s
}

.yetiskin-footer-row .yolcu-arac-kapat {
    margin-top: 0;
    width: calc(50% - 10px)
}

.otel-search-oda-ekle:hover {
    color: var(--orange)
}

.mobil-fixed-sepet-popup-shadow {
    display: none
}

.odeme-banner {
    width: 100%;
    float: left;
    background: url(../images/top-search-bg.jpg);
    padding: 30px 0;
    background-size: cover;
    background-position: center;
    position: relative;
    margin-bottom: 30px
}

.odeme-banner .container {
    display: flex;
    align-items: center;
    justify-content: center
}

.odeme-banner a {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    position: relative;
    margin: 0 60px;
    display: flex;
    align-items: center;
    opacity: .8
}

.odeme-banner a span {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    float: left;
    margin-right: 10px;
    background: rgba(255, 255, 255, .8);
    border-radius: 50%;
    color: var(--blue);
    font-weight: 800;
    font-size: 16px
}

.odeme-banner a.deactive {
    opacity: 1;
    color: var(--orange);
    text-shadow: 0 0 10px rgb(43 57 145)
}

.odeme-banner a.deactive span {
    background: var(--orange);
    color: #fff;
    text-shadow: none
}

.odeme-banner a.active {
    opacity: 1
}

.odeme-banner a.active span {
    background: 0 0;
    border: 2px solid #fff;
    color: #fff
}

.odeme-banner a:before {
    width: 90px;
    height: 1px;
    position: absolute;
    content: "";
    right: -105px;
    display: block;
    background: #fff;
    opacity: .5
}

.odeme-banner a:last-child:before {
    display: none
}

.odeme-title {
    width: 100%;
    float: left;
    margin-bottom: 30px;
    display: flex;
    align-items: center
}

.odeme-title h1 {
    color: var(--blue);
    font-weight: 700;
    font-size: 30px;
    margin-right: 15px
}

.odeme-title h1 i {
    color: var(--orange);
    margin: 0 15px
}

.title-badge {
    background: #f2f2f2;
    color: var(--paragraf-color);
    padding: 5px 20px;
    border-radius: 25px
}

.odeme-box {
    width: 100%;
    float: left;
    background: #fdfdfd;
    border: 1px solid #f0f0f4;
    border-radius: 15px;
    margin-bottom: 30px;
    box-sizing: border-box;
    padding: 15px 20px
}

.odeme-box-title {
    width: 70%;
    float: left;
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    position: relative
}

.odeme-form-row {
    width: 100%;
    float: left
}

.odeme-box-title h2 {
    font-size: 16px;
    font-weight: 700;
    color: var(--blue);
    margin-left: 5px
}

.odeme-box-title i {
    color: var(--orange);
    width: 25px;
    text-align: center
}

.kart-input label,
.odeme-form-row label {
    font-size: 14px;
    color: var(--paragraf-color);
    width: 100%;
    float: left;
    margin-bottom: 5px
}

.kart-input input,
.kart-input select,
.odeme-form-row input,
.odeme-form-row select {
    width: 100%;
    height: 40px;
    border: 1px solid #e3e3e3;
    border-radius: 30px;
    font-size: 13px;
    padding: 0 20px;
    box-sizing: border-box;
    background-color: #fff;
    color: var(--paragraf-color)
}

.odeme-tel {
    width: 100%;
    float: left
}

.odeme-tel .iti {
    width: calc(100% - 110px);
    float: left;
    margin-right: 15px
}

.tel-badge {
    width: 95px;
    float: left;
    height: 40px;
    font-size: 10px;
    display: flex;
    align-items: center;
    background: var(--blue);
    border-radius: 30px;
    justify-content: center;
    color: #fff;
    font-weight: 600;
    position: relative
}

.tel-badge:before {
    content: "";
    position: absolute;
    left: -14px;
    border-color: transparent var(--blue) transparent transparent;
    border-style: solid;
    border-width: 8px;
    width: 0;
    height: 0
}

.mb-10 {
    margin-bottom: 10px
}

.odeme-form-row p {
    color: var(--paragraf-color);
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center
}

.dogumTarihiRow,
.ulke-row {
    width: calc(100% + 10px);
    float: left;
    position: relative;
    margin-left: -5px;
    margin-right: -5px
}

.dogum-col {
    width: calc(33.3% - 10px);
    float: left;
    margin: 5px
}

.uyruk-col {
    width: calc(33.3% - 10px);
    float: left;
    position: relative;
    margin: 5px
}

.tc-col {
    width: calc(66.7% - 10px);
    float: left;
    margin: 5px
}

.kart-input select,
.odeme-form-row select {
    background-image: url(../images/icn/select-arrow.svg);
    background-repeat: no-repeat;
    background-position: 90% center
}

.odeme-yolcu-liste-btn {
    float: right;
    background: #f0f0f4;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    height: 30px;
    padding: 0 15px;
    cursor: pointer;
    border-radius: 25px
}

.odeme-yolcu-liste-btn img {
    margin-right: 5px;
    float: left
}

.odeme-yolcu-liste-btn span {
    font-weight: 600
}

input[type=radio]:not(old)+label:before {
    content: "\f111"
}

input[type=radio]:not(old):checked+label:before {
    content: "\f2f8";
    font-weight: 800;
    font-family: 'Font Awesome 5 Pro'
}

.cinsiyet {
    display: flex;
    align-items: center
}

.cinsiyet span {
    color: var(--paragraf-color);
    font-size: 14px;
    margin-right: 15px
}

.cinsiyet-col {
    float: left;
    margin-right: 15px;
    display: flex;
    align-items: center;
    font-size: 12px
}

.cinsiyet-col label {
    margin-bottom: 0
}

.kayitli-yolcu-list {
    position: absolute;
    background: #fff;
    z-index: 2;
    border: 1px solid #e3e3e3;
    width: calc(100% - 30px);
    box-sizing: border-box;
    padding: 10px 0 !important;
    max-height: 200px;
    overflow-x: scroll;
    border-radius: 0 0 15px 15px;
    display: none
}

.kayitli-yolcu-list ul li {
    font-size: 14px;
    line-height: 30px;
    cursor: pointer;
    width: 100%;
    float: left;
    padding: 0 20px
}

.kayitli-yolcu-list ul li:hover {
    background: #f0f0f4
}

.odeme-form-row input.active {
    border-radius: 15px 15px 0 0
}

.odeme-box-row {
    width: 100%;
    float: left
}

.odeme-box-title input[type=checkbox]:not(old)+label:before {
    font-size: 20px;
    top: 2px
}

.sigortaContent p,
.sigortaContent ul li {
    font-size: 14px;
    color: var(--paragraf-color);
    margin-bottom: 5px
}

.sigortaContent a {
    color: var(--p-color);
    font-size: 14px;
    border-bottom: 1px solid
}

.sigorta-chechkbox {
    width: 100%;
    float: left;
    margin-top: 20px
}

.sigorta-chechkbox input[type=checkbox]:not(old)+label:before {
    font-size: 16px;
    top: 2px
}

.sigorta-chechkbox label {
    font-size: 12px !important;
    color: var(--paragraf-color)
}

.sigorta-chechkbox label a {
    font-size: 12px;
    color: var(--blue);
    border: none
}

.odeme-box-fiyat {
    width: 100%;
    float: left;
    text-align: right
}

.odeme-box-fiyat strong {
    color: var(--paragraf-color)
}

.odeme-box-fiyat span {
    font-size: 12px;
    width: 100%;
    float: left;
    color: var(--p-color);
    font-weight: 600
}

.sigorta-firma-logo {
    position: absolute;
    bottom: 0;
    right: 15px;
    width: 85px
}

.sigortaContent ul {
    width: 100%;
    float: left;
    margin-bottom: 10px
}

.sigortaContent ul li {
    margin-bottom: 3px;
    box-sizing: border-box;
    padding-left: 20px;
    position: relative
}

.sigortaContent ul li:before {
    content: "\f00c";
    position: absolute;
    font-family: 'Font Awesome 5 Pro';
    left: 0;
    color: var(--orange)
}

.fatura-button {
    float: right
}

.odeme-bottom-info {
    width: 100%;
    float: left;
    margin-bottom: 80px;
    display: flex;
    align-items: center;
    justify-content: right;
    margin-top: 20px
}

.odeme-bottom-price {
    text-align: right;
    float: left;
    margin-right: 20px
}

.odeme-bottom-price p {
    color: var(--paragraf-color)
}

.odeme-bottom-price strong {
    font-size: 26px;
    color: var(--paragraf-color)
}

.odeme-bottom-price strong span {
    font-size: 15px;
    position: relative;
    top: -7px
}

.odeme-ilerle-btn {
    background: var(--blue);
    color: #fff;
    padding: 12px 30px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 18px;
    box-shadow: 0 8px 20px rgb(43 57 145 / 25%);
    border: none;
    transition: all ease-in-out .3s
}

.odeme-ilerle-btn i {
    font-size: 24px;
    margin-left: 10px;
    position: relative;
    top: 2px;
    right: 0
}

.odeme-ilerle-btn:hover {
    background: var(--orange);
    color: #fff
}

.badge-blue {
    position: absolute;
    background: var(--blue);
    z-index: 2;
    color: #fff;
    font-size: 11px;
    padding: 3px 15px;
    border-radius: 30px;
    left: 0;
    display: inline-block
}

.badge-blue:before {
    content: "";
    position: absolute;
    left: 10px;
    border-color: var(--blue) transparent transparent transparent;
    border-style: solid;
    border-width: 8px;
    width: 0;
    height: 0;
    bottom: -14px
}

.badge-blue.left-top-badge {
    top: -30px
}

.fatura-detay-content {
    width: 100%;
    float: left;
    margin-top: 20px;
    display: none
}

.fatura-tipi span {
    font-size: 14px;
    color: var(--paragraf-color);
    width: 100%;
    float: left;
    margin-bottom: 7px
}

.fatura-tipi {
    width: 100%;
    float: left;
    margin-bottom: 15px
}

.fatura-tipi-radio {
    width: 100%;
    float: left
}

.fatura-detay-content .row {
    margin-left: -5px;
    margin-right: -5px
}

.fatura-detay-content .row .col-md-10,
.fatura-detay-content .row .col-md-2,
.fatura-detay-content .row .col-md-4 {
    padding: 0 5px
}

.faturaTipiContent {
    display: none;
    width: 100%;
    float: left
}

.faturaTipiContent.open {
    display: flex;
}

.odeme-sidebar {
    width: 100%;
    float: left;
    position: sticky;
    top: 0;
    margin-bottom: 165px
}

.odeme-ozet-box {
    width: 100%;
    float: left;
    background: #fdfdfd;
    border: 1px solid #f0f0f4;
    border-radius: 15px;
    margin-bottom: 30px;
    padding-top: 15px;
    overflow: hidden
}

.odeme-ozet-row {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 0 15px;
    margin-bottom: 7px
}

.odeme-ozet-row span,
.odeme-ozet-row strong {
    font-weight: 400;
    color: var(--paragraf-color)
}

.odeme-ozet-row strong label {
    font-size: 16px !important
}

.odeme-ozet-top-row {
    width: 100%;
    float: left;
    height: 55px;
    background: var(--blue);
    color: #fff;
    box-sizing: border-box;
    padding: 0 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px
}

.odeme-ozet-top-row strong {
    font-size: 20px
}

.odeme-ozet-top-row strong span {
    font-size: 14px;
    position: relative;
    top: -5px;
    margin-right: 4px
}

.sidebar-sefer-box {
    width: 100%;
    float: left;
    background: #fdfdfd;
    border: 1px solid #f0f0f4;
    border-radius: 15px;
    margin-bottom: 30px;
    box-sizing: border-box
}

.sidebar-sefer-box-title {
    background: #f0f0f4;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 0 15px;
    border-radius: 15px 15px 0 0
}

.sidebar-sefer-title {
    float: left;
    display: flex;
    align-items: center
}

.sidebar-sefer-title img {
    float: left;
    margin-right: 10px
}

.sidebar-sefer-title strong {
    color: var(--blue);
    font-size: 18px
}

.sidebar-sefer-box-title a {
    background: #fdfdfd;
    font-size: 11px;
    color: var(--paragraf-color);
    padding: 5px 10px;
    border-radius: 20px;
    display: flex;
    align-items: center
}

.sidebar-sefer-box-title a i {
    font-size: 14px;
    float: left;
    margin-right: 5px
}

.sidebar-sefer-content {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 15px
}

.sidebar-sefer-firma-row {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px
}

.sidebar-sefer-firma-title {
    width: calc(100% - 100px);
    float: left
}

.sidebar-sefer-firma-title i {
    width: 30px;
    font-size: 18px;
    float: left;
    color: var(--orange);
    position: relative;
    top: 5px
}

.sidebar-sefer-firma-title p {
    width: calc(100% - 30px);
    float: left;
    position: relative
}

.sidebar-sefer-firma-title p i {
    font-size: 12px;
    width: 100%;
    color: var(--paragraf-color);
    margin-top: 2px;
    position: relative;
    top: 0
}

.sidebar-sefer-firma-title p strong {
    color: var(--paragraf-color);
    float: left;
    margin-right: 5px
}

.sidebar-sefer-firma-title p span {
    color: var(--blue);
    font-weight: 700
}

.sidebar-sefer-firma-logo {
    width: 100px;
    border: 1px solid #eee;
    box-sizing: border-box;
    padding: 5px;
    background: #fff;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center
}

.sidebar-sefer-bilgi {
    width: 100%;
    float: left;
    margin-bottom: 10px;
    box-sizing: border-box;
    position: relative;
    padding-left: 30px
}

.sidebar-sefer-bilgi-row {
    width: 100%;
    float: left;
    margin-bottom: 10px
}

.sidebar-sefer-bilgi-row>strong {
    color: var(--paragraf-color);
    position: relative
}

.sidebar-sefer-bilgi-row p {
    font-size: 14px;
    color: var(--paragraf-color)
}

.sidebar-sefer-bilgi-row p span {
    background: var(--blue);
    color: #fff;
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 15px;
    display: inline-block
}

.sidebar-sefer-bilgi-row>strong:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--orange);
    left: -25px;
    top: 5px
}

.sidebar-sefer-bilgi:before {
    content: "";
    position: absolute;
    width: 2px;
    height: 85px;
    background: var(--orange);
    left: 9px;
    top: 10px
}

.sidebar-sefer-badge {
    width: 100%;
    float: left
}

.icon-badge {
    background: var(--blue);
    float: left;
    font-size: 12px;
    color: #fff;
    height: 30px;
    display: flex;
    align-items: center;
    border-radius: 15px;
    margin-right: 10px;
    box-sizing: border-box;
    padding: 2px 15px 2px 2px;
    font-weight: 600;
    cursor: pointer;
    position: relative
}

.badge-icon {
    width: 26px;
    height: 26px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 7px
}

.badge-icon img {
    width: 18px
}

.sidebar-sefer-box-footer {
    width: 100%;
    height: 40px;
    float: left;
    background: #f0f0f4;
    box-sizing: border-box;
    padding: 0 15px;
    display: flex;
    align-items: center;
    border-radius: 0 0 15px 15px
}

.sidebar-sefer-box-footer p {
    color: var(--paragraf-color);
    font-size: 15px
}

.sidebar-sefer-box-footer p i {
    color: var(--orange);
    margin-right: 3px
}

.acik-donus-sefer-content {
    width: 100%;
    float: left;
    text-align: center
}

.acik-donus-sefer-content strong {
    width: 100%;
    float: left;
    color: var(--blue)
}

.acik-donus-sefer-content p {
    font-size: 14px;
    color: var(--paragraf-color);
    font-weight: 300;
    line-height: 20px;
    margin-top: 5px;
    width: 100%;
    float: left;
    margin-bottom: 5px
}

.yildiz-checkbox ul li label:before {
    display: none
}

.badge-popover {
    position: absolute;
    background: var(--blue);
    width: 235px;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 15px;
    text-align: center;
    display: none;
    z-index: 2;
    bottom: 40px;
    left: 50%;
    margin-left: -117px
}

.badge-popover:before {
    content: "";
    position: absolute;
    left: 50%;
    border-color: var(--blue) transparent transparent transparent;
    border-style: solid;
    border-width: 8px;
    width: 0;
    height: 0;
    bottom: -14px;
    margin-left: -10px
}

.badge-popover p {
    font-size: 12px;
    font-weight: 400
}

.icon-badge:hover .badge-popover {
    display: block
}

.iti__country-list {
    max-width: 300px
}

.odeme-form-row input:disabled,
.odeme-form-row select:disabled {
    background-color: #c1c1c1 !important;
    opacity: 1
}

.odeme-box-footer {
    width: 100%;
    float: left;
    border-top: 1px solid #f0f0f4;
    padding-top: 15px;
    font-size: 14px;
    color: var(--blue);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500
}

.rqMessage {
    float: left;
    width: 100%;
    font-size: 12px;
    margin: 5px 0 10px 0;
    color: #ff4949
}

.inputRow {
    float: left;
    width: 100%;
    margin: 0 0 10px 0
}

.formStyle3 .formTitle {
    color: #000;
    margin: 0 0 20px 0;
    font-size: 18px;
    font-weight: 700
}

.formStyle3 .inputGroup {
    padding: 0;
    margin: 0 0 10px 0
}

.formStyle3 .inputGroup label {
    font-weight: 600;
    font-size: inherit
}

.formStyle3 .inputGroup .radioBtn {
    margin: 10px 0
}

.formStyle3 .inputGroup .chckBox {
    margin: 6px 0;
    font-weight: 500
}

.formStyle3 .inputGroup .chckBox input {
    margin-top: 2px
}

.formStyle3 .inputRow {
    margin: 0 0 15px 0
}

.formStyle3 .inputRow .txt {
    width: 100%
}

.formStyle3 .inputRow .txt.uyeTel {
    width: 13%;
    float: left
}

.formStyle3 .inputRow .txt.uyeTel2 {
    width: 83%;
    margin-left: 13%;
    display: inherit;
    position: relative;
    left: 23px
}

.formStyle3 .inputRow .chckBox {
    margin: 5px 0;
    font-weight: 500
}

.formStyle3 .inputs {
    width: 100%;
    display: inline-block
}

.formStyle3 .inputs.innerText {
    text-align: center
}

.formStyle3 .inputs.innerText .txt {
    width: 43%;
    float: left
}

.formStyle3 .inputs.innerText .txt:nth-last-child(1) {
    float: right
}

.formStyle3 .inputs.innerText .text {
    display: inline-block;
    margin: 12px 0 0 0
}

.formStyle3 .inputs.oneCol .txt {
    width: 100%;
    margin: 0 0 10px 0
}

.formStyle3 .inputs.twoCol .wrapper {
    display: inline-block;
    width: 48%
}

.formStyle3 .inputs.twoCol .wrapper:nth-last-child(1) {
    float: right
}

.formStyle3 .inputs.treeCol .wrapper {
    display: inline-block;
    width: 31%
}

.formStyle3 .inputs.treeCol .wrapper:nth-child(1) {
    margin: 0 3% 0 0
}

.formStyle3 .inputs.treeCol .wrapper:nth-last-child(1) {
    float: right
}

.formStyle3 .inputs.fourCol .wrapper {
    display: inline-block;
    width: 22%
}

.formStyle3 .inputs.fourCol .wrapper:nth-child(1) {
    margin: 0 3% 0 0
}

.formStyle3 .inputs.fourCol .wrapper:nth-child(2) {
    margin: 0 3% 0 0
}

.formStyle3 .inputs.fourCol .wrapper:nth-last-child(1) {
    float: right
}

.formStyle3 .input {
    width: 100%
}

.cartProto {
    -webkit-perspective: 1000;
    -moz-perspective: 1000;
    -o-perspective: 1000;
    perspective: 1000
}

.cartProto .cartProtoInner {
    -webkit-transition: .6s;
    -webkit-transform-style: preserve-3d;
    -moz-transition: .6s;
    -moz-transform-style: preserve-3d;
    -o-transition: .6s;
    -o-transform-style: preserve-3d;
    transition: .6s;
    transform-style: preserve-3d;
    position: relative;
    width: 350px;
    height: 220px;
    max-width: 100%;
    margin: 0 auto
}

.cartProto .cart {
    width: 100%;
    height: 190px;
    max-width: 100%;
    margin: 0 auto;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    border-radius: 15px;
    padding: 0;
    background: var(--blue);
    position: relative;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    top: 4%;
    color: #fff;
    left: 0;
    font-size: 14px;
    box-shadow: 0 10px 20pxhsl(231deg 55% 37% / 27%);
    background-size: cover !important
}

.cartProto .cart.front {
    z-index: 2;
    background: url(../images/card-front.jpg)
}

.cartProto .cart.front .content {
    width: 90%;
    position: absolute;
    left: 7%;
    bottom: 25px;
    margin-bottom: 0
}

.cartProto .cart.front .shiny {
    width: 50px;
    height: 35px;
    border-radius: 5px;
    background: #ccc;
    position: relative
}

.cartProto .cart.front .shiny:before {
    content: " ";
    display: block;
    width: 70%;
    height: 60%;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background: #d9d9d9;
    position: absolute;
    top: 20%
}

.cartProto .cart.front .cvc {
    float: right;
    position: relative;
    bottom: 5px;
    opacity: 0
}

.cartProto .cart.front .cardNumber {
    font-size: 18px;
    clear: both;
    margin-bottom: 15px
}

.cartProto .cart.front .fullName {
    text-transform: uppercase;
    font-size: 14px;
    max-height: 45px;
    position: absolute;
    bottom: 0;
    width: 65%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: horizontal;
    overflow: hidden;
    text-overflow: ellipsis
}

.cartProto .cart.front .cardExpiry {
    letter-spacing: 0;
    position: relative;
    float: right;
    width: 25%;
    font-size: 13px
}

.cartProto .cart.front .cardExpiry>.inner {
    padding-top: 3px
}

.cartProto .cart.front .cardExpiry:before {
    content: attr(data-before);
    margin-bottom: 2px;
    text-transform: uppercase;
    font-size: 7px;
    white-space: pre;
    display: block;
    opacity: .5;
    padding: 0 0 0 6px
}

.cartProto .cart.front .cardExpiry:after {
    position: absolute;
    content: attr(data-after);
    text-align: right;
    right: 100%;
    margin-right: 5px;
    margin-top: 2px;
    bottom: 5px;
    font-size: 7px;
    display: block;
    opacity: .5;
    width: 18px;
    line-height: 1
}

.cartProto .cart.back {
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
    z-index: 2
}

.cartProto .cart.back .cardBar {
    background-color: #c1c1c1;
    width: 100%;
    height: 20%;
    position: absolute;
    top: 10%
}

.cartProto .cart.back .cvc {
    position: absolute;
    top: 42%;
    left: 85%;
    -webkit-transition-delay: .6s;
    -moz-transition-delay: .6s;
    transition-delay: .6s;
    font-size: 14px
}

.cartProto .cart.back .shiny {
    width: 50px;
    height: 35px;
    border-radius: 5px;
    background: #ccc;
    position: relative;
    position: absolute;
    top: 66%;
    left: 2%
}

.cartProto .cart.back .shiny:before {
    content: " ";
    display: block;
    width: 70%;
    height: 60%;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background: #d9d9d9;
    position: absolute;
    top: 20%
}

.cartProto .cart.back .shiny:after {
    content: "This card has been issued by Jesse Pollak and is licensed for anyone to use anywhere for free.AIt comes with no warranty.A For support issues, please visit: github.com/jessepollak/card.";
    position: absolute;
    left: 120%;
    top: 5%;
    color: #fff;
    font-size: 7px;
    width: 230px;
    opacity: .5
}

.cartProto .cart.back:after {
    content: " ";
    display: block;
    background-color: #fff;
    width: 80%;
    height: 16%;
    position: absolute;
    top: 40%;
    left: 2%
}

.cartProto .cart span.inner {
    padding: 0 5px;
    display: inline-block;
    opacity: .8
}

.cartProto .cart span.inner.active {
    border: 1px solid #fff
}

.cartProto.hover .cartProtoInner {
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}

.cartProto.hover .cart.back {
    z-index: 3
}

.kredi-karti {
    width: 100%;
    float: left
}

.sonKullanma {
    width: 60% !important;
    float: left
}

.slas {
    width: 20px;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px
}

.sonKullanma select {
    width: calc(50% - 10px);
    float: left
}

.cvvNo {
    width: calc(40% - 20px);
    float: left;
    margin-left: 20px !important
}

.guvenlik-uyari {
    width: 100%;
    float: left;
    background: #f0f0f4;
    box-sizing: border-box;
    padding: 15px 25px;
    margin-top: 30px;
    border-radius: 10px;
    display: flex
}

.guvenlik-uyari img {
    width: 25px;
    float: left;
    margin-right: 20px
}

.guvenlik-uyari p {
    width: calc(100% - 45px);
    float: left;
    font-size: 12px;
    color: #8b8b8b
}

.taksit-message {
    border: 1px solid #f0f0f4;
    width: 100%;
    float: left;
    border-radius: 10px;
    font-size: 12px;
    color: grey;
    margin-top: 20px;
    padding: 10px 10px;
    text-align: center;
    background: #fff
}

.taksit-message p {
    font-size: 11px
}

.taksit-secenekleri {
    width: 100%;
    float: left;
    margin-top: 20px
}

.taksit-secenekleri table {
    width: 100%
}

.taksit-secenekleri table thead tr {
    border-bottom: 2px solid #f0f0f4
}

.taksit-secenekleri table thead tr td {
    font-size: 14px;
    font-weight: 600;
    height: 30px;
    color: var(--paragraf-color)
}

.taksit-secenekleri table tbody tr {
    border-bottom: 1px solid #f0f0f4
}

.taksit-secenekleri table tbody tr td {
    height: 30px;
    vertical-align: middle;
    font-size: 13px;
    color: var(--paragraf-color)
}

.taksit-secenekleri table tbody tr td label {
    top: -15px
}

.card-tutar {
    width: 100%;
    float: left;
    margin-top: 10px
}

.card-tutar-row {
    width: 100%;
    float: left;
    margin-bottom: 10px;
    text-align: center
}

.card-tutar-row>span {
    width: 100%;
    float: left;
    font-size: 14px;
    color: var(--paragraf-color)
}

.card-tutar-row strong {
    font-size: 26px;
    color: var(--paragraf-color);
    position: relative
}

.card-tutar-row strong span {
    font-size: 14px;
    position: relative;
    top: -10px;
    margin-right: 5px
}

.sozlesme-checkbox-row {
    width: 100%;
    float: left;
    margin-top: 10px
}

.sozlesme-checkbox-row label {
    font-size: 11.5px !important;
    padding-left: 20px !important
}

.sozlesme-checkbox-row label:before {
    font-size: 14px !important
}

.sozlesme-checkbox-row label a {
    color: var(--paragraf-color);
    font-weight: 600
}

.guvenli-odeme-btn {
    width: 100%;
    height: 48px;
    background: #7cb900;
    border: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 50px;
    color: #fff !important;
    font-size: 16px;
    box-sizing: border-box;
    padding: 0 0 0 15px;
    box-shadow: 0 12px 20px rgb(124 185 0 / 34%);
    cursor: pointer;
    float: left;
    margin-top: 10px
}

.guvenli-odeme-btn span {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #75ad02;
    border-radius: 50%;
    font-size: 20px
}

.guvenli-odeme-btn i {
    font-size: 20px
}

.kartOdeme {
    margin-bottom: 100px
}

.kart-odeme-sidebar {
    margin-bottom: 70px
}

.mobil-kart-tutar {
    width: 100%;
    float: left
}

.tebrikler-blue-box {
    width: 100%;
    background: var(--blue);
    height: 190px;
    color: #fff;
    box-sizing: border-box;
    padding: 15px;
    border-radius: 15px;
    margin-top: 20px
}

.tebrikler-blue-box h2 {
    font-size: 16px;
    width: 100%;
    float: left;
    text-align: center;
    font-weight: 800;
    margin-bottom: 10px
}

.tebrikler-blue-box h2 img {
    margin-left: 5px;
    width: 18px;
    position: relative;
    top: 3px
}

.tebrikler-blue-box p {
    font-size: 12px;
    width: 100%;
    text-align: center;
    margin-bottom: 10px
}

.tebrikler-blue-box .orange-btn {
    height: 30px;
    margin: auto;
    float: none;
    width: 186px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.tebrikler-blue-box .orange-btn span {
    width: calc(100% - 20px);
    font-weight: 600
}

.tebrikler-blue-box .orange-btn:hover {
    background: var(--orange);
    color: #fff
}

.tebrikler-uygulama-butons {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.tebrikler-mesaj {
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 20px
}

.tebrikler-mesaj h1 {
    color: #7cb900;
    font-size: 24px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 5px
}

.tebrikler-mesaj h1 img {
    margin-right: 10px
}

.tebrikler-mesaj p {
    width: 100%;
    float: left;
    margin-bottom: 15px;
    font-size: 14px;
    color: var(--paragraf-color)
}

.tebrikler-voucher {
    background: var(--blue);
    color: #fff;
    height: 35px;
    display: inline-flex;
    align-items: center;
    padding: 0 50px;
    border-radius: 25px;
    font-size: 14px
}

.tebrikler-voucher span {
    margin-right: 5px
}

.text-link {
    width: 100%;
    float: left;
    color: var(--blue);
    text-decoration: underline !important;
    font-size: 14px;
    margin: 10px 0
}

.tebrikler-uyelik-bilgileriniz {
    width: 100%;
    float: left;
    background: #f7f9fa;
    padding: 11px 25px;
    display: flex;
    align-items: center;
    border-radius: 30px;
    justify-content: space-between
}

.tebrikler-uyelik-bilgileriniz strong {
    font-size: 14px;
    color: var(--blue)
}

.tebrikler-uyelik-bilgileriniz p {
    width: auto;
    margin-bottom: 0
}

.tebrikler-uyelik-bilgileriniz p span {
    color: var(--blue)
}

.tebrikler-slider-box {
    width: 100%;
    float: left;
    background: #fff;
    border: 2px solid #f0f0f4;
    box-sizing: border-box;
    padding: 15px;
    border-radius: 15px;
    position: relative;
    margin-top: 30px;
    min-height: 330px;
    margin-bottom: 30px
}

.tebrikler-slider-box h2 {
    font-size: 18px;
    width: 100%;
    float: left;
    text-align: center;
    font-weight: 600;
    color: var(--blue);
    margin-bottom: 5px
}

.tebrikler-slider-box h2 img {
    width: 17px;
    margin-right: 5px
}

.tebrikler-slider-box p {
    font-size: 12px;
    color: var(--paragraf-color);
    text-align: center;
    margin-bottom: 10px
}

.tebrikler-slider {
    width: 80%;
    float: left;
    margin-left: 10%;
    box-shadow: 0 10px 15px rgba(0, 0, 0, .15);
    border-radius: 15px
}

.tebrikler-slide {
    width: 100%;
    float: left;
    background: #fff;
    border-radius: 15px
}

.tebrikler-slide-img {
    width: 100%;
    height: 130px;
    background-size: cover;
    background-position: center;
    position: relative;
    border-radius: 15px 15px 0 0
}

.tebrikler-slide-img a {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 10px
}

.tebrikler-slide-img a span {
    background: #7cb900;
    font-size: 10px;
    display: inline-flex;
    float: left;
    height: 24px;
    color: #fff;
    font-weight: 500;
    align-items: center;
    padding: 0 15px;
    border-radius: 25px
}

.yildiz-badge {
    font-size: 10px;
    background: #fff;
    height: 24px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    border-radius: 25px;
    color: var(--p-color)
}

.yildiz-badge i {
    margin: 0 1px
}

.yildiz-badge i.orange {
    color: var(--orange)
}

.tebrikler-slide-content {
    width: 100%;
    float: left;
    border-radius: 0 0 15px 15px;
    overflow: hidden
}

.tebrikler-slide-title {
    width: 100%;
    float: left;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.tebrikler-slide-title h3 {
    font-size: 14px;
    font-weight: 700;
    color: var(--blue);
    line-height: 24px
}

.tebrikler-slide-total strong {
    font-size: 14px;
    color: var(--blue)
}

.tebrikler-slide-total span {
    font-size: 12px;
    color: var(--blue)
}

.tebrikler-slide-btn {
    width: 100%;
    float: left;
    padding: 5px 0 10px;
    display: flex;
    align-items: center;
    justify-content: center
}

.tebrikler-slide-btn a {
    height: 29px;
    font-size: 11px;
    background: var(--orange);
    align-items: center;
    display: flex;
    padding: 0 20px;
    border-radius: 25px;
    color: #fff;
    font-weight: 600
}

.tebrikler-slide-footer {
    width: 100%;
    float: left;
    border-top: 1px solid #f0f0f4;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.tebrikler-slide-footer span {
    font-size: 12px;
    color: var(--paragraf-color)
}

.tebrikler-slide-footer a {
    background: var(--orange);
    font-size: 10px;
    height: 26px;
    padding: 0 20px;
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 600
}

.tebrikler-hemen-kartlar {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 0 15px
}

.tebrikler-card {
    width: 100%;
    height: 155px;
    background: var(--blue);
    margin-top: 30px;
    position: relative;
    border-radius: 15px;
    overflow: hidden
}

.tebrikler-card img {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 130px
}

.tebrikler-card h3 {
    width: 100%;
    float: left;
    text-align: center;
    padding: 15px 10px;
    font-size: 20px;
    color: #fff
}

.tebrikler-card a {
    position: absolute;
    right: 15px;
    bottom: 15px;
    background: var(--orange);
    color: #fff;
    font-size: 14px;
    padding: 5px 20px;
    border-radius: 50px;
    font-weight: 600;
    transition: all ease-in-out .3s
}

.tebrikler-card a:hover {
    background: #fff;
    color: var(--orange)
}

.tebriklerSlider .owl-next {
    right: -40px;
    background: 0 0 !important;
    width: 35px !important;
    height: 35px !important
}

.tebriklerSlider .owl-prev {
    left: -40px;
    background: 0 0 !important;
    width: 35px !important;
    height: 35px !important
}

.tekYonBtn {
    font-size: 14px !important;
    bottom: 30px !important;
    left: 15px;
    position: relative;
    color: var(--blue);
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer
}

.landing-sss .accordionButton {
    background: var(--orange)
}

.landing-sss .accordionContent {
    border: 1px solid var(--orange)
}

.landing-sss .accordion-row {
    margin-top: 0;
    margin-bottom: 10px
}

.map-kapat {
    position: absolute;
    z-index: 2;
    width: 35px;
    height: 35px;
    background: var(--orange);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    right: -10px;
    top: -10px;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
    font-size: 18px;
    transition: all ease-in-out .3s
}

.map-kapat:hover {
    background: var(--blue)
}

.green-alert {
    width: 100%;
    float: left;
    margin-bottom: 0;
    text-align: center;
    background: #e5f6ed;
    color: #13882b;
    border: none;
    font-weight: 500;
    font-size: 14px;
    padding: 20px 0;
    font-weight: 600
}

.form-textarea {
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    width: 100%;
    height: 100px !important;
    padding-top: 10px !important;
    border-radius: 15px !important;
    font-size: 12px;
    padding: 0 20px;
    outline: 0 !important;
    box-shadow: none !important
}

.yildiz-form-row {
    width: calc(50% - 15px);
    float: left;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px
}

.yildiz-form-row:nth-child(even) {
    margin-left: 30px
}

.yildiz-form-row span {
    font-weight: 600;
    color: var(--paragraf-color)
}

.yildiz-form-row select {
    width: 100px;
    padding: 0 10px;
    border: 1px solid #ccc;
    border-radius: 15px;
    height: 30px;
    font-size: 12px;
    background-image: url(../images/icn/select-arrow.svg);
    background-repeat: no-repeat;
    background-size: 8px;
    background-position: 90%;
    appearance: none;
    -webkit-appearence: none;
    background-color: #fff
}

.green-del span,
.green-del strong {
    color: var(--yesil);
    font-weight: 600
}

.green-del {
    background: #e5f6ed;
    padding: 5px 15px
}

.switch-row {
    display: flex;
    align-items: center
}

.switch-row label {
    margin-right: 10px
}

.cruise-search-btn {
    display: flex;
    justify-content: end
}

.feribot-alt-tab-content {
    display: none;
    width: 100%;
    float: left
}

.feribot-alt-tab-content.open {
    display: block
}

.feribot-alt-tab {
    width: 100%;
    float: left;
    position: relative;
    margin-top: -10px;
    margin-bottom: 20px
}

.feribot-alt-tab a {
    position: relative;
    color: var(--blue);
    padding-left: 25px;
    margin-right: 30px;
    font-weight: 600;
    font-size: 14px;
    display: flex;
    align-items: center;
    float: left
}

.feribot-alt-tab a:before {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    border: 2px solid var(--orange);
    left: 0;
    border-radius: 50%
}

.feribot-alt-tab a.active:after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    background: var(--orange);
    border-radius: 50%;
    left: 4px
}

.island-hopping-form-row {
    width: 100%;
    float: left;
    margin-bottom: 15px;
    display: flex;
    align-items: center
}

.island-hopping-number {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--blue);
    font-weight: 600;
    border-radius: 50%;
    color: #fff;
    font-size: 12px
}

.island-hopping-form-row .neredenNereye {
    width: calc(65% - 40px);
    margin-bottom: 0;
    margin-left: 10px;
    margin-right: 10px;
    position: relative
}

.island-hopping-form-row .tarih-col {
    width: calc(35% - 20px)
}

.island-hopping-remove {
    width: 20px
}

.island-hopping-remove button {
    background: 0 0;
    border: none;
    font-size: 20px;
    color: var(--paragraf-color);
    appearance: none;
    cursor: pointer;
    opacity: .5
}

.island-hopping-form-row input[type=text] {
    padding-left: 40px
}

.island-hopping-form-row .lokasyon-col:first-child input[type=text] {
    border-radius: 30px 0 0 30px
}

.island-hopping-form-row .lokasyon-col:last-child input[type=text] {
    border-radius: 0 30px 30px 0
}

.island-hopping-form-row .lokasyon-change-btn {
    position: absolute;
    left: 50%;
    margin-left: -15px
}

.island-hopping-form-row .lokasyon-change-btn span {
    width: 30px;
    height: 30px;
    top: 10px
}

.island-hopping-form-row .lokasyon-col {
    width: 50%
}

.island-hopping-footer {
    width: 100%;
    float: left;
    display: flex;
    align-items: center
}

.island-hopping-add {
    width: calc(33.3% - 10px);
    float: left;
    margin-right: 10px;
    border: 1px dashed var(--blue);
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
    color: var(--blue);
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

.island-hopping-footer .yolcuArac {
    width: calc(33.3% - 20px);
    margin-right: 10px;
    padding-right: 0
}

.island-hopping-footer .main-search-btn {
    width: 34%;
    padding-left: 0
}

.island-hopping-add i {
    margin-right: 5px
}

.overflow {
    overflow: hidden
}

.tur-olustur-popup {
    position: fixed;
    z-index: 9;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: start;
    justify-content: center;
    display: none
}

.popup-shadow {
    width: 100%;
    position: absolute;
    height: 100vh;
    background: rgba(0, 0, 0, .2);
    left: 0;
    top: 0;
    backdrop-filter: blur(15px)
}

.tur-olustur-popup-content {
    width: 800px;
    background: #fff;
    position: relative;
    border-radius: 15px;
    box-shadow: 0 15px 25px rgba(0, 0, 0, .5);
    margin-top: 50px;
    float: left;
    left: 50%;
    margin-left: -400px
}

.tur-popup-title {
    width: 100%;
    height: 60px;
    background: var(--blue);
    margin-bottom: 15px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 0 30px;
    border-radius: 15px 15px 0 0
}

.tur-popup-content {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 15px 30px 30px
}

.tur-popup-title strong {
    text-transform: uppercase
}

.tur-popup-title span {
    font-size: 20px;
    cursor: pointer;
    opacity: .5;
    transition: all ease-in-out .3s
}

.tur-popup-title span:hover {
    opacity: 1
}

.tur-popup-content .main-search-btn {
    width: 50%;
    padding-left: 6px
}

.tur-kisi-sayisi {
    width: 50%;
    float: left;
    position: relative;
    padding-right: 6px
}

.tur-popup-content .konuk-sayisi-popup {
    max-height: 295px;
    overflow-x: scroll
}

.tur-hareket-tarihi.active {
    border-radius: 15px 15px 0 0
}

.tur-detay-tarih-araligi {
    width: 75%;
    font-size: 12px;
    color: var(--blue);
    font-weight: 600;
    height: 30px
}

.tur-detay-fiyat {
    width: 25%;
    float: right;
    text-align: right;
    color: var(--blue);
    font-weight: 700;
    font-size: 14px;
    height: 30px
}

.tur-detay-hareket-tarihi-list {
    width: calc(100% - 14px);
    background: #fff;
    position: absolute;
    z-index: 2;
    margin-top: -10px;
    border-radius: 0 0 15px 15px;
    box-shadow: 0 10px 15px rgb(0 0 0 / 10%);
    box-sizing: border-box;
    max-height: 270px;
    overflow: scroll;
    display: none
}

.tur-detay-hareket-tarihi-list strong {
    width: 100%;
    float: left;
    border-bottom: 1px solid #eee;
    margin-bottom: 10px;
    font-size: 14px;
    color: var(--blue);
    padding: 10px 15px
}

.tur-detay-hareket-tarihi-list ul li {
    width: 100%;
    float: left;
    padding: 7px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer
}

.hareket-tarihleri {
    width: 35%;
    font-size: 12px;
    color: var(--paragraf-color)
}

.hareket-tarih-gece {
    font-size: 11px;
    background: var(--blue);
    color: #fff;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 20px
}

.hareket-tarih-price {
    font-size: 14px;
    color: var(--blue);
    font-weight: 700
}

.tur-detay-hareket-tarihi-list ul li:hover {
    background: #f0f0f0
}

.mobile-ara-tab-btn span i {
    font-style: normal !important;
    background: var(--orange);
    margin-left: 5px;
    font-size: 10px;
    padding: 2px 5px;
    border-radius: 15px;
    font-weight: 600
}

.tesekkur-seferler-box {
    width: 100%;
    float: left;
    background: #fff;
    border: 2px solid #f0f0f4;
    box-sizing: border-box;
    padding: 15px;
    border-radius: 15px;
    position: relative;
    margin-bottom: 30px;
    min-height: 185px
}

.tesekkur-seferler-box h2 {
    font-size: 16px;
    width: 100%;
    float: left;
    text-align: center;
    font-weight: 600;
    color: var(--blue);
    margin-bottom: 5px
}

.tesekkur-seferler-box h2 img {
    margin-right: 5px
}

.tesekkurler-seferler-slider {
    width: 90%;
    float: left;
    margin-left: 5%;
    margin-top: 5px;
    position: relative
}

.tesekkurler-seferler-slider a {
    width: 100%;
    height: 115px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    color: #fff;
    box-sizing: border-box;
    padding: 10px;
    border-radius: 15px;
    position: relative;
    background-position: center;
    background-size: cover
}

.tesekkurler-seferler-slider a:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--blue);
    top: 0;
    left: 0;
    opacity: .5;
    border-radius: 15px
}

.tesekkurler-seferler-slider a strong {
    position: relative
}

.tesekkurler-seferler-slider .owl-nav {
    position: absolute;
    margin-top: 0 !important
}

.tesekkurler-seferler-slider .owl-nav [class*=owl-] {
    position: absolute;
    width: 30px;
    height: 30px;
    top: 50%;
    margin-top: -15px
}

.tesekkurler-seferler-slider .owl-prev {
    left: -35px
}

.tesekkurler-seferler-slider .owl-next {
    right: -35px
}

.tesekkur-oneri {
    width: 100%;
    float: left;
    margin-bottom: 30px;
    height: 185px;
    background-size: cover;
    background-position: center;
    border-radius: 15px;
    position: relative;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center
}

.tebrikler-card:last-child {
    margin-top: 20px
}

.tesekkur-oneri:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: var(--blue);
    left: 0;
    top: 0;
    border-radius: 15px;
    opacity: .7
}

.tesekkur-oneri .ortala {
    position: relative;
    color: #fff
}

.tesekkur-oneri h3 {
    font-size: 18px;
    font-weight: 800;
    margin-bottom: 10px
}

.tesekkur-oneri p {
    font-size: 14px;
    margin-bottom: 15px
}

.tesekkur-oneri a {
    background: var(--orange);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    padding: 5px 25px;
    border-radius: 15px;
    display: inline-block
}

.tesekkurler-liman-box {
    width: 100%;
    float: left;
    background: #fff;
    border: 2px solid #f0f0f4;
    box-sizing: border-box;
    padding: 15px;
    border-radius: 15px;
    position: relative;
    margin-bottom: 30px
}

.liman-box {
    width: 50%;
    float: left;
    box-sizing: border-box
}

.liman-box:first-child {
    border-right: 2px solid #f0f0f4;
    padding-right: 15px
}

.liman-box:last-child {
    padding-left: 15px
}

.liman-box h2 {
    width: 100%;
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 700;
    color: var(--blue);
    margin-bottom: 10px
}

.liman-box h2 img {
    margin-right: 10px
}

.liman-box-content {
    width: 100%;
    float: left
}

.liman-box-content p {
    font-size: 14px;
    color: var(--paragraf-color);
    margin-bottom: 5px
}

.liman-box-content p strong {
    color: var(--blue);
    font-weight: 500
}

.liman-box-content p a {
    color: var(--blue);
    font-weight: 700;
    margin-left: 10px
}

.piri-kesfet-box {
    width: 100%;
    float: left;
    margin-bottom: 50px;
    background: var(--blue);
    border-radius: 15px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 20px 15px
}

.piri-kesfet-img {
    width: 35%;
    float: left
}

.piri-kesfet-content {
    width: 65%;
    float: left;
    text-align: center;
    color: #fff
}

.piri-kesfet-content h3 {
    font-size: 18px;
    font-weight: 800;
    margin-bottom: 5px
}

.piri-kesfet-content p {
    font-size: 14px;
    margin-bottom: 15px
}

.piri-kod {
    width: 100%;
    float: left
}

.piri-kod span {
    width: 100%;
    float: left;
    font-size: 12px
}

.piri-kod strong {
    background: #fff;
    color: var(--blue);
    font-size: 14px;
    padding: 3px 25px;
    border-radius: 15px;
    display: inline-block
}

.otel-list-ferry {
    font-size: 10px;
    padding: 10px
}

.feribot-otel-price {
    border-left: 2px dashed #eee
}

.feribot-otel-price-info strong {
    width: 100%;
    float: left;
    line-height: 28px
}

.feribot-otel-price-info span {
    font-size: 12px;
    color: var(--pragaraf-color);
    line-height: 10px;
    width: 100%;
    float: left;
    opacity: .8
}

.feribot-otel-kampanya {
    width: 100%;
    float: left;
    margin-bottom: 30px;
    border: 1px solid var(--orange);
    border-radius: 15px;
    background: rgb(247 147 29 / 5%);
    box-sizing: border-box;
    padding: 15px 20px;
    display: flex;
    align-items: center
}

.feribot-otel-kampanya-content {
    width: calc(45% - 30px);
    float: left;
    border-right: 1px solid var(--orange);
    margin-right: 30px;
    box-sizing: border-box;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px
}

.feribot-otel-kampanya-content h2 {
    font-size: 18px;
    font-weight: 700;
    color: var(--blue);
    margin-bottom: 5px
}

.feribot-otel-kampanya-content h2 i {
    color: var(--orange);
    margin-right: 8px
}

.feribot-otel-kampanya-content p {
    color: var(--paragraf-color);
    font-size: 14px
}

.feribot-otel-kampanya-content p a {
    color: var(--blue);
    font-weight: 600
}

.feribot-ptel-kampanya-detaylari {
    width: 55%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.kamp-ozellik-col {
    width: calc(25% - 30px);
    box-sizing: border-box;
    padding: 0 15px
}

.kamp-ozellik-col span {
    width: 100%;
    float: left;
    text-align: center;
    font-size: 24px;
    color: var(--orange)
}

.kamp-ozellik-col span i {
    margin: 0 5px
}

.kamp-ozellik-add {
    width: 30px;
    text-align: center;
    color: var(--blue)
}

.kamp-ozellik-col strong {
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    width: 100%;
    float: left;
    text-align: center
}

.feribot-hotel-ozet-row {
    position: sticky;
    width: 100%;
    float: left;
    background: #f7f9fa;
    border-bottom: 1px solid var(--border-color);
    top: 0;
    left: 0;
    display: block;
    z-index: 3
}

.packet-detail-row {
    width: 100%;
    float: left;
    position: relative
}

.packet-detail-col {
    width: calc(50% - 30px);
    float: left;
    padding: 20px 0 20px 0
}

.packet-detail-col:last-child {
    border-left: 2px solid #fff;
    box-sizing: border-box;
    width: calc(50% - 30px);
    margin-left: 40px;
    padding-left: 30px
}

.packet-detail-title {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px
}

.packet-detail-title strong {
    color: var(--blue)
}

.packet-detail-title a {
    font-size: 12px;
    color: var(--blue);
    text-decoration: underline !important
}

.packet-detail-content {
    width: 100%;
    float: left
}

.packet-detail-content p {
    margin-bottom: 5px;
    font-size: 14px;
    color: var(--paragraf-color);
    font-weight: 600
}

.packet-detail-content p i {
    width: 15px;
    margin-right: 10px;
    text-align: center;
    color: var(--orange)
}

.packet-detail-content p strong {
    font-weight: 600
}

.packet-detail-content p strong span {
    font-weight: 400
}

.packet-detail-col ul li {
    width: 100%;
    float: left;
    margin-bottom: 15px
}

.packet-detail-col ul li:last-child {
    margin-bottom: 0
}

.packet-detail-col ul li i {
    color: var(--orange);
    width: 30px;
    float: left;
    position: relative;
    margin-top: 5px
}

.packet-detail-col ul li p {
    width: calc(100% - 30px);
    float: left
}

.packet-detail-col ul li p strong {
    width: 100%;
    float: left
}

.packet-detail-col ul li p span {
    font-size: 12px;
    font-weight: 400;
    width: 100%;
    float: left
}

.pasket-detail-price {
    height: 100%;
    float: left;
    width: 100%;
    border-left: 2px dashed #eee;
    box-sizing: border-box;
    padding-left: 20px;
    padding-top: 30px;
    position: relative;
    text-align: center
}

.pasket-detail-price strong {
    font-size: 26px;
    color: var(--blue)
}

.pasket-detail-price p {
    font-size: 12px;
    color: var(--paragraf-color)
}

.pasket-detail-price a {
    position: absolute;
    bottom: 20px;
    background: var(--orange);
    color: #fff;
    width: calc(100% - 30px);
    height: 45px;
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600
}

.feribot-ozet-form {
    display: none;
    margin-top: 15px;
    width: 100%;
    float: left
}

.tour-search-bar.height-auto {
    padding: 15px 0
}

.feribot-otel-ozet-banner {
    width: 100%;
    float: left;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #fff;
    font-size: 14px
}

.feribot-otel-ozet-banner a {
    color: #fff;
    display: flex;
    align-items: center
}

.feribot-otel-ozet-banner a i,
.search-degistir-btn i,
.search-vazgec-btn i {
    color: var(--orange);
    margin-right: 10px;
    font-size: 16px
}

.search-degistir-btn,
.search-vazgec-btn {
    display: flex;
    align-items: center;
    cursor: pointer
}

.otel-bilgi-row {
    width: 100%;
    float: left;
    margin-top: 30px;
    margin-bottom: 50px
}

.height-auto {
    min-height: auto;
    height: auto
}

.search-vazgec-btn {
    display: none
}

.active .search-vazgec-btn {
    display: block
}

.active .search-degistir-btn {
    display: none
}

.feribot-otel-bilgi-content {
    width: 100%;
    float: left
}

.feribot-otel-bilgi-content .otel-yildiz-puan {
    text-align: left;
    right: 0;
    margin-bottom: 10px
}

.feribot-otel-bilgi-content .otel-yildiz-puan strong {
    margin-left: 0;
    margin-right: 10px
}

.feribot-otel-bilgi-content h1 {
    width: 100%;
    float: left;
    color: var(--blue);
    font-weight: 600;
    margin-bottom: 10px
}

.feribot-otel-bilgi-content .otel-location {
    font-size: 16px
}

.feribot-otel-bilgi-content .otel-bilgi ul li {
    font-size: 14px
}

.feribot-otel-bilgi-content .hotel-tags {
    display: block;
    margin-top: 20px
}

.feribot-otel-bilgi-content .tags-right {
    width: 100%;
    display: block;
    float: left
}

.feribot-otel-bilgi-content .tags-right .icon {
    margin-left: 0;
    display: inline-flex;
    margin-right: 5px
}

.feribot-bilgi-row {
    width: 100%;
    float: left;
    background: #f7f9fa;
    padding-top: 50px;
    padding-bottom: 80px
}

section.feribot-bilgi-row .sefer-list-row .firma-info {
    width: 27%
}

.feribot-bilgi-row .sefer-clock-info {
    margin-right: 8%
}

.feribot-bilgi-row .sefer-tooltips {
    float: right;
    margin-right: 15px
}

.feribot-bilgi-row-title {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px
}

.feribot-bilgi-row-title h2 {
    font-weight: 700;
    font-size: 22px;
    color: var(--blue);
    margin-bottom: 5px
}

.feribot-bilgi-row-title p {
    font-size: 14px;
    color: var(--paragraf-color)
}

.feribot-diger-btn {
    display: inline-block;
    border: 1px solid var(--orange);
    color: var(--orange);
    padding: 10px 25px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer
}

.feribot-bilgi-row .sefer-list-day-content {
    margin-bottom: 50px
}

.feribot-bilgi-otel-name {
    width: 100%;
    float: left;
    background: #eee;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 30px;
    margin-bottom: 10px
}

.feribot-bilgi-otel-name strong {
    width: 60%;
    font-size: 14px;
    color: var(--paragraf-color)
}

.feribot-bilgi-otel-name .otel-yildiz-puan {
    margin-top: 0
}

.feribot-bilgi-otel-name .otel-yildiz-puan strong {
    color: #fff;
    display: inline-block;
    float: right;
    width: auto
}

.feribot-bilgi-row .detail-room-col {
    background: #fff;
    margin-bottom: 50px
}

.feribot-bilgi-row .detail-room-info {
    padding-left: 25px;
    padding-right: 25px;
    width: 50%
}

.feribot-bilgi-row .detail-room-price {
    align-items: center;
    width: 20%;
    justify-content: center
}

.oda-degistir-btn {
    border: 1px solid var(--blue);
    font-size: 14px;
    font-weight: 600;
    padding: 13px 30px;
    border-radius: 30px;
    background: rgb(43 57 145 / 5%);
    color: var(--blue);
    cursor: pointer;
    transition: all ease-in-out .3s
}

.oda-degistir-btn:hover {
    border: 1px solid var(--orange);
    color: var(--orange);
    background: rgb(247 147 29 / 5%)
}

.otel-bilgileri-row {
    width: 100%;
    background: #fff;
    float: left;
    border-radius: 15px;
    box-shadow: 0 15px 25px rgba(0, 0, 0, .1);
    box-sizing: border-box;
    padding: 15px 30px
}

.otel-info-content {
    width: 100%;
    float: left;
    margin-top: 20px;
    display: none
}

.otel-info-content p {
    font-size: 14px;
    margin-bottom: 10px;
    color: var(--paragraf-color)
}

.otel-info-accordion {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer
}

.otel-info-accordion strong {
    color: var(--paragraf-color);
    font-size: 16px
}

.otel-info-accordion i {
    transition: all ease-in-out .3s;
    color: var(--paragraf-color)
}

.otel-info-accordion.active i {
    transform: rotate(180deg)
}

.otel-info-content .tour-details-title h2 {
    font-size: 16px;
    color: var(--paragraf-color)
}

.diger-seferler-fixed {
    position: fixed;
    z-index: 8;
    width: 100%;
    height: 100vh;
    right: 0;
    top: 0;
    right: -100vw;
    transition: all ease-in-out .5s
}

.box-shadow {
    width: 100%;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, .5);
    cursor: pointer;
    display: none
}

.diger-seferler-bg {
    width: 1000px;
    height: 100vh;
    position: relative;
    background: #fff;
    float: right;
    box-shadow: 0 10px 15px;
    overflow-x: scroll;
    right: 0
}

.secilen-sefer-row {
    width: 100%;
    float: left;
    background: var(--gri-bg);
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 30px;
    box-sizing: border-box;
    padding: 30px;
    position: relative
}

.diger-sefer-title {
    width: 100%;
    float: left;
    position: relative
}

.diger-sefer-title h3 {
    font-size: 18px;
    font-weight: 600;
    color: var(--blue)
}

.diger-sefer-title>p {
    font-size: 14px;
    color: var(--paragraf-color)
}

.diger-sefer-title span {
    position: absolute;
    right: 0;
    top: 0;
    font-size: 26px;
    opacity: .5;
    cursor: pointer;
    color: var(--paragraf-color)
}

.diger-sefer-title span:hover {
    opacity: 1
}

.diger-seferler-fixed .alternatif-list-content {
    display: block
}

.diger-seferler-fixed .firma-info {
    width: 23% !important
}

.diger-seferler-fixed .sefer-clock-info {
    margin-right: 2%
}

.diger-seferler-fixed .sefer-tooltips {
    float: left;
    margin-right: 10px;
    margin-left: 1%
}

.diger-sefer-right {
    border-left: 2px dashed #eee;
    padding: 0 10px;
    text-align: center;
    box-sizing: border-box
}

.diger-sefer-right p {
    font-size: 12px;
    color: var(--orange);
    font-weight: 600;
    font-style: italic
}

.alternatif-seferler-row {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 0 30px 30px
}

.alternatif-seferler-row h4 {
    font-size: 14px;
    font-weight: 600;
    color: var(--blue)
}

.diger-sefer-right>div {
    width: 100%;
    float: left
}

.sefer-ek-ucret {
    width: 100%;
    float: left;
    text-align: center;
    margin-bottom: 15px
}

.sefer-ek-ucret strong {
    width: 100%;
    float: left;
    font-size: 18px;
    color: var(--paragraf-color)
}

.sefer-ek-ucret span {
    width: 100%;
    float: left;
    font-size: 11px;
    color: var(--paragraf-color)
}

.diger-sefer-right .sefer-btn {
    margin: 0;
    width: 90%;
    float: none
}

.diger-seferler-fixed.active {
    right: 0
}

.alternatif-seferler-row .sefer-list-row:nth-child(odd) {
    background: #fff
}

.feribot-bilgi-row .sefer-list-row:nth-child(odd) {
    background: #fff
}

.secilen-sefer-row .sefer-list-row:nth-child(odd) {
    background: #f6fff7
}

.diger-seferler-fixed .detail-room-col {
    margin-bottom: 10px
}

.kabin-cinsiyet {
    float: left;
    border: 1px solid var(--orange);
    margin-right: 15px;
    padding: 10px 15px 3px;
    border-radius: 25px
}

.select-list-input {
    width: 100%;
    float: left;
    position: relative
}

.select-list-button {
    float: left;
    width: 100%;
    height: 55px;
    border: 1px solid #e3e3e3;
    border-radius: 30px;
    font-size: 13px;
    padding: 0 20px;
    box-sizing: border-box;
    background: #fff;
    display: flex;
    align-items: center;
    transition: all ease-in-out .3s;
    color: var(--paragraf-color)
}

.yolcuTipiText {
    padding: 0;
    width: 60%;
    border: none
}

.select-list-button i {
    width: 5%;
    font-size: 22px;
    color: var(--paragraf-color)
}

.select-list-button p {
    width: 35%;
    text-align: right;
    box-sizing: border-box;
    padding-right: 15px;
    display: block
}

.select-list-button p strong {
    width: 100%;
    float: left
}

.select-list-button p span {
    font-size: 10px;
    width: 100%;
    float: left;
    color: var(--yesil);
    font-weight: 600
}

.select-list-button.active {
    border-radius: 15px 15px 0 0
}

.select-list-button.active i {
    transform: rotate(180deg)
}

.select-list-dropdown {
    width: 100%;
    float: left;
    z-index: 3;
    background: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 0 0 15px 15px;
    max-height: 250px;
    overflow-x: overlay;
    padding: 0 !important;
    overflow-y: scroll;
    display: none;
    position: absolute;
    top: 54px
}

.select-list-dropdown>strong {
    font-size: 12px;
    padding: 10px 15px;
    color: var(--p-color);
    background: #f7f9fa;
    width: 100%;
    float: left
}

.select-list-dropdown ul li {
    width: 100%;
    float: left;
    padding: 10px 15px;
    border-bottom: 1px solid #e3e3e3;
    cursor: pointer;
    font-size: 14px;
    color: var(--paragraf-color);
    display: flex;
    align-items: center;
    justify-content: space-between
}

.select-list-dropdown ul li span {
    font-size: 14px;
    width: 75%
}

.select-list-dropdown p {
    width: 25%;
    text-align: right;
    display: block
}

.select-list-dropdown ul li:hover {
    background: rgb(240 240 244)
}

.select-list-dropdown p strong {
    width: 100%;
    float: left
}

.select-list-dropdown p span {
    width: 100% !important;
    float: left;
    font-size: 10px !important;
    font-weight: 600
}

.profilim-bg {
    width: 100%;
    float: left;
    border-top: 1px solid var(--border-color);
    padding: 30px 0 50px
}

.profilim-sidebar {
    width: 100%;
    float: left
}

.profil-sidebar-user-info {
    width: 100%;
    float: left;
    margin-bottom: 25px;
    display: flex;
    align-items: center
}

.sidebar-pp {
    width: 40px;
    height: 40px;
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    border: 2px solid var(--blue);
    float: left;
    margin-right: 15px
}

.sidebar-user-info {
    width: calc(100% - 55px);
    float: left
}

.sidebar-user-info span {
    width: 100%;
    float: left;
    color: var(--p-color);
    font-size: 11px;
    font-weight: 600
}

.sidebar-user-info strong {
    width: 100%;
    float: left;
    font-size: 15px;
    color: var(--paragraf-color)
}

.profilim-sidebar-menu {
    width: 100%;
    float: left
}

.profilim-sidebar-menu ul li {
    margin-bottom: 15px;
    width: 100%;
    float: left
}

.profilim-sidebar-menu ul li a {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    font-size: 15px;
    color: var(--paragraf-color);
    font-weight: 500
}

.profilim-sidebar-menu ul li a img {
    margin-right: 10px
}

.profilim-sidebar-menu ul li a:hover {
    color: var(--blue)
}

.profilim-sidebar-menu ul li.active a {
    font-weight: 600;
    color: var(--blue)
}

.profilim-bg h1 {
    font-size: 20px;
    font-weight: 700;
    color: var(--blue);
    width: 100%;
    float: left;
    margin-bottom: 15px
}

.profilim-bg h1 i {
    margin-right: 8px
}

.profil-content-box {
    width: 100%;
    float: left;
    border: 2px solid #f0f0f4;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 20px
}

.profilim-banner {
    width: 100%;
    float: left;
    padding: 10px 30px;
    background: #3478e6;
    background: -moz-linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    background: -webkit-linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    background: linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    border-radius: 15px;
    color: #fff
}

.profilim-banner-row {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px
}

.profilim-foto-edit {
    width: 90px;
    height: 90px;
    display: block;
    border-radius: 50%;
    background: #fff
}

.profilim-banner-center {
    width: 50%;
    text-align: center
}

.destinasyon-row {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px
}

.toplam-destinasyon {
    background: #fff;
    color: var(--blue);
    border-radius: 20px;
    font-size: 12px;
    padding: 4px 10px;
    display: flex;
    align-items: center;
    margin-right: 10px
}

.toplam-destinasyon strong {
    font-size: 15px;
    float: left;
    margin-right: 8px
}

.destinasyon-col {
    padding: 0 8px;
    display: flex;
    align-items: center;
    border-right: 1px solid #91bbff
}

.destinasyon-col strong {
    width: 30px;
    height: 30px;
    background: #fff;
    color: var(--blue);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    float: left;
    margin-right: 5px
}

.destinasyon-col span {
    font-size: 12px
}

.destinasyon-col:last-child {
    border-right: none
}

.profilim-banner-center p {
    font-size: 11px
}

.profilim-banner-center p strong {
    font-size: 14px
}

.profilim-fl-puan-info {
    width: 110px;
    text-align: right
}

.fl-puan {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: end;
    font-size: 15px;
    font-weight: 600
}

.fl-puan strong {
    width: auto;
    height: 35px;
    background: var(--orange);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
    padding: 0 7px;
    min-width: 35px
}

.profilim-fl-puan-info a {
    font-size: 12px;
    color: #fff;
    text-decoration: underline !important
}

.fl-nedir {
    width: 100%;
    float: left;
    position: relative;
    margin-bottom: -10px
}

.fl-nedir a {
    font-size: 10px;
    color: #fff;
    opacity: .5;
    text-decoration: none !important
}

.fl-nedir a:hover {
    opacity: 1
}

.ada-kesif-row {
    width: 100%;
    float: left
}

.ada-kesif-row strong {
    width: 22%;
    float: left;
    text-align: center;
    box-sizing: border-box;
    padding: 0 20px;
    font-size: 12px;
    font-weight: 400
}

.ada-kesif-row ul {
    width: 78%;
    float: left
}

.ada-kesif-row ul li {
    width: 11.1%;
    float: left;
    font-size: 11px;
    text-align: center;
    border-right: 1px solid #91bbff;
    margin-bottom: 5px;
    color: #91bbff
}

.ada-kesif-row ul li.active {
    color: var(--orange)
}

.ada-kesif-row ul li:nth-child(9n) {
    border-right: 0
}

.profil-form label {
    font-size: 12px !important
}

.profil-form {
    margin-top: 20px
}

.profil-form .col-6,
.profil-form .col-md-12,
.profil-form .col-md-4,
.profil-form .col-md-6 {
    padding: 0 5px
}

.profil-form .row {
    margin-left: -5px;
    margin-right: -5px
}

.profil-form input,
.profil-form select {
    font-size: 12px;
    padding: 0 15px
}

.profil-form .dogum-col,
.profil-form .tc-col,
.profil-form .uyruk-col {
    margin: 0 5px
}

.profil-form .cinsiyet span {
    font-size: 12px
}

.sifre-degistir-btn {
    width: auto;
    display: inline-flex;
    align-items: center;
    font-weight: 600;
    padding: 0 20px;
    height: 50px
}

.sifre-degistir-btn img {
    margin-right: 10px;
    width: 20px
}

.sifre-degistir-btn:hover {
    color: var(--blue);
    border: 1px solid var(--blue);
    background: var(--gri-bg)
}

.blue-shadow-btn {
    background: var(--blue);
    border: none;
    color: #fff;
    min-width: 150px;
    height: 50px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 12px 20px rgb(43 57 145 / 36%);
    transition: all ease-in-out .3s;
    padding: 0 20px
}

.blue-shadow-btn:hover {
    background: var(--orange);
    box-shadow: 0 12px 20px rgb(247 147 29 / 36%)
}

.avatar-upload {
    position: relative;
    max-width: 90px;
    float: right
}

.avatar-upload .avatar-edit {
    position: absolute;
    right: 50%;
    z-index: 1;
    bottom: 0;
    margin-right: -12px
}

.avatar-upload .avatar-edit input {
    display: none
}

.avatar-upload .avatar-edit input+label {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-bottom: 0;
    border-radius: 100%;
    background: 0 0;
    cursor: pointer;
    font-weight: 400;
    transition: all .2s ease-in-out;
    background-image: url(../images/icn/pp-upload-icon.svg);
    background-size: cover;
    background-position: center
}

.avatar-upload .avatar-edit input+label:hover {
    border: 1px solid #d6d6d6
}

.avatar-upload .avatar-preview {
    width: 90px;
    height: 90px;
    position: relative;
    border-radius: 100%;
    border: 3px solid #fff
}

.avatar-upload .avatar-preview>div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center
}

.pass-input {
    position: relative;
    width: 100%;
    float: left
}

.pass-input i {
    cursor: pointer;
    position: absolute;
    right: 15px;
    color: var(--orange);
    top: 12px
}

.sifre-botom-button .blue-shadow-btn {
    float: right
}

.sifre-degistir-box {
    margin-bottom: 20px
}

.profil-main-title {
    align-items: center;
    margin-bottom: 15px
}

.profil-main-title .blue-btn {
    font-size: 12px;
    font-weight: 600;
    padding: 10px 20px;
    height: 40px;
    display: inline-block
}

.profil-main-title .blue-btn i {
    margin-right: 5px
}

.profil-main-title h1 {
    margin-bottom: 0
}

.yolcu-list-row {
    width: 100%;
    float: left;
    position: relative
}

.yolcu-list-title {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
    padding: 0 20px
}

.yolcu-list-title-col {
    width: 25%;
    text-align: center;
    font-size: 13px;
    color: var(--blue)
}

.yolcu-list-title-col strong {
    font-weight: 600
}

.yolcu-list-content {
    width: 100%;
    float: left
}

.yolcu-list-box {
    width: 100%;
    float: left;
    border: 1px solid #f0f0f4;
    border-radius: 30px;
    margin-bottom: 10px;
    box-shadow: 0 1px 2px rgb(72 72 72 / 8%);
    box-sizing: border-box;
    padding: 10px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.yolcu-list-box-col {
    font-size: 14px;
    color: var(--paragraf-color)
}

.yolcu-list-box-col i {
    color: var(--blue);
    margin-right: 5px
}

.yolcu-list-box-col:nth-child(1) {
    width: 25%
}

.yolcu-list-box-col:nth-child(2) {
    width: 20%;
    text-align: center
}

.yolcu-list-box-col:nth-child(3) {
    width: 25%;
    text-align: center
}

.yolcu-list-box-col:nth-child(4) {
    width: 25%;
    text-align: center
}

.yolcu-list-box-col:nth-child(5) {
    width: 5%;
    text-align: right
}

.yolcu-list-title-col:nth-child(1) {
    text-align: left;
    box-sizing: border-box;
    padding-left: 25px
}

.yolcu-list-title-col:nth-child(2) {
    width: 20%
}

.yolcu-list-title-col:nth-child(4) {
    width: 30%;
    box-sizing: border-box;
    padding-right: 5%
}

.yolcu-list-box-col button {
    border: none;
    background: 0 0;
    appearance: none;
    cursor: pointer
}

.yolcu-list-box-col button i {
    margin-right: 0
}

.yolcu-list-box-col .dropdown-item {
    font-size: 12px;
    color: var(--paragraf-color)
}

.yolcu-list-box-col .dropdown-menu {
    min-width: 100px;
    border: none;
    border-radius: 10px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .3)
}

.yolcu-list-box-col .dropdown-item:active {
    background-color: var(--gri-bg)
}

.yolcu-ekle-cinsiyet {
    padding-top: 35px !important
}

.kredi-karti-title-center {
    width: 100%;
    float: left;
    text-align: center;
    margin-bottom: 15px
}

.kredi-karti-title-center h2 {
    font-size: 20px;
    font-weight: 700;
    color: var(--blue)
}

.kredi-karti-title-center p {
    font-size: 14px;
    color: var(--blue)
}

.kredi-karti-puan-form {
    width: 100%;
    float: left;
    background: #fdfdfd;
    border: 2px solid #f0f0f4;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 20px
}

.kart-input {
    width: 100%;
    float: left;
    margin-bottom: 20px
}

.son-kullanma-tarihi {
    width: 65%;
    box-sizing: border-box;
    padding-right: 10px
}

.son-kullanma-tarihi select {
    width: calc(50% - 10px);
    float: left
}

.cvv-input {
    width: calc(35% - 30px);
    padding-left: 10px
}

.nedir-popover {
    width: 20px;
    float: left;
    margin-left: 10px;
    margin-top: 30px;
    font-size: 22px
}

.nedir-popover button {
    padding: 0;
    background: 0 0;
    border: none;
    color: var(--p-color);
    float: right
}

.kart-puan-yukle-btn {
    width: 100%;
    float: left;
    margin-top: 25px
}

.yesil-shadow-btn {
    background: #7cb900;
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    height: 40px;
    padding: 0 30px;
    border: none;
    border-radius: 30px;
    box-shadow: 0 12px 20px rgb(124 185 0 / 36%);
    cursor: pointer;
    display: flex;
    align-items: center
}

.kart-puan-yukle-btn .yesil-shadow-btn {
    float: right
}

.kart-puan-yukle-aciklama {
    width: 100%;
    float: left;
    margin-top: 20px;
    margin-bottom: 20px
}

.guvenle-yukleyin {
    width: 55%;
    float: left;
    display: flex;
    align-items: center
}

.guvenle-yukleyin-text {
    width: calc(100% - 50px);
    float: left;
    margin-left: 20px
}

.guvenle-yukleyin-text strong {
    font-size: 14px;
    color: #7cb900
}

.guvenle-yukleyin-text p {
    font-size: 11px;
    width: 100%;
    float: left;
    line-height: 15px;
    color: var(--paragraf-color)
}

.guvenle-yukleyin-kart-logos {
    width: 45%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding-left: 50px
}

.gri-info-row {
    width: 100%;
    float: left;
    background: var(--gri-bg);
    border-radius: 15px;
    text-align: center;
    padding: 7px 10px;
    font-size: 12px;
    color: var(--p-color);
    margin-bottom: 20px;
    line-height: 18px
}

.gri-info-row p i {
    font-size: 16px;
    margin-right: 8px;
    display: inline-block
}

.gri-info-row p a {
    color: var(--p-color);
    font-weight: 600;
    text-decoration: underline !important
}

.kart-puan-yukle-footer {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.hediye-karti-banner {
    background: #3478e6;
    background: -moz-linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    background: -webkit-linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    background: linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    padding: 15px 15px;
    box-sizing: border-box;
    color: #fff;
    border-radius: 15px;
    display: flex;
    align-items: center;
    margin-bottom: 20px
}

.hediye-karti-banner-content {
    width: 80%;
    float: left
}

.hediye-karti-banner-content p {
    font-size: 14px
}

.hediye-karti-banner-content strong {
    margin-bottom: 3px;
    width: 100%;
    float: left
}

.hediye-karti-banner-toplam-tutar {
    width: 20%;
    float: left;
    text-align: right
}

.hediye-karti-banner-toplam-tutar span {
    width: 100%;
    float: left;
    font-size: 14px
}

.icon-title {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    margin-bottom: 15px
}

.icon-title img {
    margin-right: 10px
}

.icon-title h2 {
    color: var(--blue);
    font-size: 18px;
    font-weight: 600
}

.hediye-karti-tutarlari {
    width: 100%;
    float: left;
    margin-bottom: 30px
}

.tutar-radio {
    float: left;
    margin-right: 30px
}

.tutar-radio label {
    font-size: 13px !important
}

.kart-slider {
    width: 100%;
    float: left;
    overflow: hidden
}

.kart-slider-overflow {
    width: 150%;
    float: left;
    margin-left: -25%
}

.kartSlider .owl-item.active {
    opacity: .5;
    transition: all ease-in-out .3s
}

.kartSlider .owl-item.active.center {
    opacity: 1
}

.kartSlider .owl-item img {
    float: left;
    border-radius: 15px
}

.kartSlider .owl-item.active.center img {
    border: 2px solid var(--orange)
}

.kartSlider .owl-item span {
    width: 100%;
    float: left;
    text-align: center;
    margin-top: 10px;
    font-size: 14px;
    color: var(--orange);
    opacity: 0;
    transition: all ease-in-out .3s
}

.kartSlider .owl-item.center span {
    opacity: 1
}

.kartSlider .owl-nav [class*=owl-] {
    position: absolute;
    background: rgb(255 255 255) !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .35)
}

.kartSlider .owl-prev {
    left: 18%
}

.kartSlider .owl-next {
    right: 18%
}

.kartSlider .owl-nav {
    margin-top: -25px !important
}

.kart-mesaj {
    width: 100%;
    float: left;
    margin-top: 20px;
    position: relative;
    margin-bottom: 30px
}

.kart-mesaj label {
    width: 100%;
    float: left;
    font-size: 14px;
    color: var(--paragraf-color);
    margin-bottom: 10px;
    font-weight: 600
}

.kart-mesaj textarea {
    width: 100%;
    border: 1px solid #e3e3e3;
    border-radius: 15px;
    padding: 10px 15px;
    box-sizing: border-box;
    font-size: 14px;
    color: var(--paragraf-color);
    box-shadow: 0 4px 8px rgb(83 83 83 / 8%)
}

#karakter {
    position: absolute;
    right: 15px;
    bottom: 15px;
    font-size: 12px;
    color: var(--p-color)
}

.hediye-kart-form h3 {
    font-size: 15px;
    width: 100%;
    float: left;
    margin-bottom: 20px;
    margin-top: 10px;
    color: var(--blue);
    font-weight: 600
}

.mt-10 {
    margin-top: 10px
}

.hediye-kart-form {
    margin-bottom: 20px
}

.onizleme-row {
    width: 100%;
    float: left;
    margin-bottom: 30px;
    text-align: center
}

.onizleme-kart {
    display: inline-block;
    position: relative;
    margin-bottom: 10px
}

.onizleme-kart strong {
    position: absolute;
    bottom: 15px;
    left: 15px;
    color: #fff;
    font-size: 20px
}

.onizleme-kart img {
    border-radius: 15px
}

.onizleme-mesaj {
    width: 100%;
    float: left;
    font-size: 14px;
    color: var(--paragraf-color)
}

.hediye-kart-bilgiler {
    width: 100%;
    float: left;
    text-align: center;
    margin-bottom: 15px
}

.hediye-kart-bilgiler-row {
    width: 80%;
    border: 1px solid #e3e3e3;
    float: left;
    margin-left: 10%;
    border-radius: 15px
}

.hediye-cart-bilgi-col {
    width: 50%;
    float: left;
    padding: 15px;
    box-sizing: border-box;
    font-size: 14px
}

.hediye-cart-bilgi-col:nth-child(1) {
    border-right: 1px solid #e3e3e3
}

.hediye-cart-bilgi-col strong {
    font-weight: 600;
    color: var(--blue);
    margin-bottom: 5px;
    width: 100%;
    float: left
}

.hediye-cart-bilgi-col p {
    width: 100%;
    float: left;
    color: #707070;
    font-size: 13px;
    line-height: 18px
}

.profil-content-box .odeme-bottom-info {
    margin-bottom: 20px
}

.hediye-ceki-box {
    margin-top: 0
}

.hediye-ceki-box h2 {
    font-size: 16px;
    font-weight: 600;
    width: 100%;
    float: left;
    margin-bottom: 20px;
    color: var(--blue)
}

.hediye-ceki-buton .blue-shadow-btn {
    width: 100%;
    height: 40px;
    margin-top: 23px
}

.biletlerim-top-col {
    width: 100%;
    float: left;
    box-sizing: border-box;
    background: #f7f9fa;
    border-radius: 15px;
    padding: 10px 5px;
    border: 2px solid #f0f0f4;
    text-align: center;
    min-height: 110px;
    margin-bottom: 30px
}

.biletlerim-top-title {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px
}

.biletlerim-top-title h2 {
    font-size: 16px;
    color: var(--blue);
    font-weight: 600
}

.biletlerim-top-title img {
    margin-right: 7px
}

.biletlerim-top-ticket-sayiisi {
    display: inline-flex;
    background: #3478e6;
    background: -moz-linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    background: -webkit-linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    background: linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    padding: 0 30px;
    height: 26px;
    align-items: center;
    color: var(--orange);
    border-radius: 30px;
    margin-bottom: 8px
}

.biletlerim-top-ticket-sayiisi i {
    transform: rotate(-55deg);
    margin: 0 4px;
    font-size: 12px
}

.biletlerim-top-col p {
    font-size: 12px;
    color: var(--blue)
}

.biletlerim-top-col a {
    background: var(--orange);
    color: #fff;
    height: 24px;
    padding: 0 30px;
    font-size: 14px;
    display: inline-block;
    line-height: 24px;
    border-radius: 15px;
    margin-top: 10px;
    cursor: pointer;
    transition: all ease-in-out .3s
}

.biletlerim-top-col a:hover {
    background: var(--blue)
}

.biletlerimSliderBox {
    background: #3478e6;
    background: -moz-linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    background: -webkit-linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    background: linear-gradient(270deg, rgba(52, 120, 230, 1) 0, rgba(43, 57, 145, 1) 100%);
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    height: 130px;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 10px;
    justify-content: center;
    text-align: center
}

.biletlerimSliderBox h3 {
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    margin-bottom: 7px
}

.biletlerimSliderBox h3 strong {
    background: var(--orange);
    width: 25px;
    height: 25px;
    display: inline-flex;
    border-radius: 50%;
    align-items: center;
    justify-content: center
}

.biletlerimSliderBox p {
    color: #fff;
    font-size: 12px;
    width: 100%;
    float: left;
    line-height: 16px
}

.biletler-icon {
    font-size: 12px;
    color: #d3d9ff;
    margin-top: 10px;
    width: 100%;
    float: left
}

.biletler-icon i {
    transform: rotate(-55deg);
    margin: 0 3px
}

.biletler-icon i.orange {
    color: var(--orange)
}

.biletlerim-kesfet {
    width: 100%;
    float: left;
    text-align: center
}

.biletlerim-kesfet img {
    width: 28px !important;
    display: inline-block;
    margin: auto
}

.biletlerim-kesfet strong {
    color: #fff;
    font-size: 13px;
    width: 100%;
    float: left;
    margin-top: 5px
}

.biletlerim-kesfet a {
    background: var(--orange);
    color: #fff;
    font-size: 12px;
    height: 24px;
    display: inline-flex;
    padding: 0 30px;
    align-items: center;
    margin-top: 10px;
    border-radius: 15px;
    font-weight: 600
}

.biletlerim-tebrikler {
    width: 100%;
    float: left
}

.biletlerim-tebrikler h3 img {
    width: 22px !important;
    display: inline-block !important;
    margin-left: 7px
}

.biletlerim-tebrikler h3 {
    font-size: 18px;
    display: inline-flex;
    width: 100%;
    float: left;
    justify-content: center
}

.biletlerim-tebrikler p {
    font-weight: 600
}

.biletlerim-tebrikler span {
    color: #91bbff;
    font-size: 10px;
    width: 100%;
    float: left;
    margin-top: 10px
}

.biletlerim-slider {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 0 20px
}

.biletlerim-list-content {
    width: 100%;
    float: left;
    position: relative
}

.biletlerim-list-row {
    width: 100%;
    float: left;
    background: #fff;
    border: 1px solid #f0f0f4;
    box-shadow: 0 1px 2px rgb(72 72 72 / 8%);
    border-radius: 15px;
    box-sizing: border-box;
    padding: 15px 20px;
    transition: all ease-in-out .3s;
    margin-bottom: 15px
}

.biletlerim-list-accordion-button {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.biletlerim-nerden-nereye {
    width: 20%;
    float: left
}

.biletlerim-nerden-nereye h4 {
    font-size: 13px;
    font-weight: 600;
    color: var(--paragraf-color)
}

.biletlerim-nerden-nereye h4 i {
    color: var(--blue);
    margin: 0 5px
}

.biletlerim-voucher {
    width: 18%;
    font-size: 12px;
    color: var(--paragraf-color)
}

.biletlerim-voucher p,
.biletlerim-voucher span {
    color: var(--p-color)
}

.biletlerim-voucher p strong {
    color: var(--paragraf-color)
}

.biletlerim-yon {
    width: 20%;
    text-align: center
}

.mt-30 {
    margin-top: 30px
}

.biletlerim-yon span {
    background: #fdfdfd;
    font-size: 12px;
    padding: 8px 20px;
    border-radius: 30px;
    color: var(--paragraf-color)
}

.biletlerim-yon span i {
    color: var(--blue);
    margin-right: 10px
}

.biletlerim-durum {
    width: 20%;
    float: left;
    text-align: center
}

.biletlerim-durum strong {
    color: var(--paragraf-color);
    font-size: 12px;
    padding: 8px 20px;
    border-radius: 30px;
    min-width: 150px;
    display: inline-block;
    font-weight: 700
}

.bilet-kullanildi strong {
    background: #dafada
}

.bilet-kullanildi strong i {
    width: 18px;
    height: 18px;
    background: #16e38a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    border-radius: 50%;
    margin-right: 7px
}

.biletlerim-fiyat {
    width: 11%;
    text-align: right
}

.biletlerim-fiyat strong {
    width: 100%;
    float: left;
    color: #7cb900;
    font-size: 15px
}

.biletlerim-fiyat span {
    width: 100%;
    float: left;
    font-size: 12px;
    color: var(--p-color)
}

.biletlerim-arrow {
    width: 32px;
    height: 32px;
    background: var(--blue);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    margin-left: 20px
}

.biletlerim-arrow:before {
    content: "\f078";
    color: #fff;
    font-family: 'Font Awesome 5 Free';
    left: 0;
    top: 1px;
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.biletlendi strong {
    background: #fae9da
}

.degistirildi strong {
    background: #efdafa
}

.bilet-acikta strong {
    background: #daebfa
}

.donus-acikta strong {
    background: #fafada
}

.iptal-edildi strong {
    background: #fadada
}

.biletlerim-list-row.disabled .biletlerim-list-accordion-button div {
    opacity: .3
}

.biletlerim-list-row.disabled .biletlerim-list-accordion-button .biletlerim-durum {
    opacity: 1
}

.biletlerim-list-row.disabled span {
    opacity: 1
}

.biletlerim-list-accordion-content {
    width: 100%;
    float: left;
    padding: 30px 0 0;
    display: none
}

.biletlerim-action-button {
    width: 60%;
    float: left;
    margin-bottom: 20px
}

.biletlerim-action-button a {
    width: 75px;
    float: left;
    margin-right: 30px;
    text-align: center
}

.biletlerim-action-button a span {
    width: 100%;
    float: left;
    font-size: 12px;
    color: var(--paragraf-color)
}

.biletlerim-action-button a:hover span {
    color: var(--blue)
}

.biletlerim-sefer-row {
    width: 100%;
    float: left;
    border: 1px solid #f0f0f4;
    border-radius: 15px;
    margin-bottom: 10px
}

.biletlerim-sefer-left {
    width: 50%;
    float: left;
    border-right: 1px solid #f0f0f4;
    box-sizing: border-box;
    padding: 20px
}

.biletlerim-sefer-left h3 {
    width: 100%;
    float: left;
    font-size: 14px;
    display: flex;
    align-items: center;
    font-weight: 700;
    color: var(--blue);
    margin-bottom: 10px
}

.biletlerim-sefer-left h3 img {
    margin-right: 5px
}

.biletlerim-sefer-left p {
    color: var(--paragraf-color);
    font-size: 13px;
    width: 100%;
    float: left;
    margin-bottom: 5px
}

.firma {
    font-weight: 600;
    color: var(--blue)
}

.saat {
    background: var(--blue);
    color: #fff;
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 10px;
    margin-left: 5px
}

.biletlerim-sefer-left a {
    color: var(--paragraf-color);
    font-size: 13px;
    font-weight: 700
}

.biletlerim-sefer-left a i {
    color: var(--orange);
    margin-right: 3px
}

.biletlerim-sefer-left a:hover {
    color: var(--blue)
}

.biletlerim-sefer-right {
    width: 50%;
    float: left;
    box-sizing: border-box;
    padding: 20px;
    border-radius: 0 15px 15px 0;
    background: #fdfdfd
}

.sefere-kalan-sure {
    width: 100%;
    float: left;
    padding-bottom: 15px;
    border-bottom: 1px solid #f0f0f4;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px
}

.kalan-sure-title {
    color: #16e38a;
    font-weight: 600;
    margin-right: 3px
}

.kalan-sure-geri-sayim {
    color: var(--paragraf-color)
}

.biletlerim-sefer-buttons {
    width: 100%;
    float: left;
    padding: 20px 0;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.biletlerim-sefer-buttons button {
    font-size: 12px;
    background: var(--blue);
    display: inline-flex;
    align-items: center;
    color: #fff;
    min-width: 175px;
    height: 30px;
    padding: 0 16px;
    box-sizing: border-box;
    justify-content: center;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    transition: all ease-in-out .3s
}

.biletlerim-sefer-buttons button img {
    margin-right: 5px
}

.biletlerim-sefer-buttons button:hover {
    background: var(--orange)
}

.biletlerim-sefer-buttons .btn-reschedule,
.biletlerim-sefer-buttons a.btn-reschedule {
    font-size: 12px;
    background: var(--blue);
    display: inline-flex;
    align-items: center;
    color: #fff;
    min-width: 175px;
    height: 30px;
    padding: 0 16px;
    box-sizing: border-box;
    justify-content: center;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    transition: all ease-in-out .3s;
    text-decoration: none;
}

.biletlerim-sefer-buttons .btn-reschedule img {
    margin-right: 5px
}

.biletlerim-sefer-buttons .btn-reschedule:hover {
    background: var(--orange);
    color: #fff;
}

.biletlerim-sefer-info {
    width: 100%;
    float: left;
    background: #f0f0f4;
    font-size: 12px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    color: var(--paragraf-color)
}

.biletlerim-sefer-info i {
    margin-right: 7px
}

.biletlerim-list-row.active {
    box-shadow: 0 8px 32px rgb(72 72 72 / 8%)
}

.active .biletlerim-arrow {
    background: 0 0
}

.active .biletlerim-arrow:before {
    color: var(--paragraf-color);
    content: "\f00d";
    font-size: 22px;
    font-weight: 400;
    font-family: 'Font Awesome 5 Pro'
}

.biletlerimModal .modal-body {
    text-align: center;
    padding: 20px
}

.uyari-content {
    width: 100%;
    float: left
}

.uyari-content h4 {
    font-size: 32px;
    font-weight: 600;
    color: var(--paragraf-color);
    margin-bottom: 15px;
    margin-top: 10px
}

.uyari-content p {
    color: var(--paragraf-color)
}

.biletlerimModal .modal-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    padding-top: 5px;
    padding-bottom: 25px
}

.onay-btn,
.swal-button.swal-button--confirm {
    background: var(--blue);
    color: #fff;
    height: 45px;
    border: none;
    padding: 0 20px;
    border-radius: 30px;
    margin: 0 5px;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600
}

.onay-btn:hover,
.onay-btn:focus,
.onay-btn:active {
    color: #fff
}

a.onay-btn:hover,
a.onay-btn:focus,
a.onay-btn:active {
    text-decoration: none;
    color: #fff
}

.vazgec-btn {
    background: #d33;
    height: 45px;
    padding: 0 30px;
    color: #fff;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    margin: 0 5px;
    font-size: 15px;
    font-weight: 600
}

.modal-sefer-title {
    width: 100%;
    float: left;
    text-align: left;
    padding: 20px 0;
    display: flex;
    align-items: center
}

.modal-sefer-title h5 {
    font-size: 18px;
    font-weight: 600;
    color: var(--blue);
    display: flex;
    align-items: center
}

.modal-sefer-title h5 img {
    margin-right: 8px
}

.biletlerimModal h4 {
    font-weight: 700;
    color: var(--paragraf-color)
}

.modal-table {
    width: 100%;
    float: left;
    margin-bottom: 10px
}

.modal-table table tr td {
    border: 1px solid #f0f0f4;
    padding: 10px 15px;
    font-size: 14px;
    color: var(--paragraf-color)
}

.modal-table table tr td:nth-child(2) {
    font-weight: 600
}

.modal-table table {
    width: 100%;
    text-align: left;
    margin-bottom: 5px
}

.modal-input {
    width: 100%;
    float: left;
    margin-bottom: 20px;
    text-align: center
}

.border {
    float: left;
    width: 100%
}

.modal-input label {
    width: 100%;
    float: left;
    font-size: 14px;
    font-weight: 600;
    color: var(--blue)
}

.modal-input input {
    width: 300px;
    height: 37px;
    border: 2px solid #f0f0f4;
    border-radius: 20px;
    margin-top: 8px;
    text-align: center;
    background-image: url(../images/icn/select-arrow.svg);
    background-repeat: no-repeat;
    background-size: 10px;
    background-position: 95%;
    font-size: 14px
}

.biletlerimModal .modal-content {
    border-radius: 15px !important
}

.bilet-acikta-col {
    background: #daebfa;
    border-radius: 0 15px 15px 0;
    padding: 17px 20px;
    min-height: 187px;
}

.sefer-acik-bilet-aciklama {
    width: 100%;
    float: left;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: var(--paragraf-color)
}

.bilet-acikta-col .biletlerim-sefer-buttons {
    justify-content: center
}

.bilet-kullanildi-col {
    height: 168px;
    background: #dafada;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center
}

.bilet-kullanildi-col span {
    width: 40px;
    height: 40px;
    background: #16e38a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    border-radius: 50%;
    margin-bottom: 5px
}

.bilet-kullanildi-col p {
    width: 100%;
    float: left;
    font-size: 14px;
    font-weight: 600
}

.donus-acikta-col {
    background: #fafada
}

.donus-acikta-col .biletlerim-sefer-buttons {
    justify-content: center
}

.degistirildi-col {
    min-height: 168px;
    background: #efdafa;
    text-align: center;
    display: flex;
    align-items: center;
    border-radius: 0 15px 15px 0
}

.degistirildi-col p {
    font-size: 12px;
    margin-bottom: 8px;
    color: var(--paragraf-color)
}

.degistirildi-col .biletlerim-sefer-buttons {
    justify-content: center;
    float: none
}

.iptal-edildi-col {
    background: #fadada;
    display: flex;
    align-items: center;
    min-height: 187px
}

.iptal-edildi-col h5 {
    width: 100%;
    float: left;
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 700;
    color: var(--paragraf-color);
    display: flex;
    align-items: center;
    justify-content: center
}

.iptal-edildi-col h5 span {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    list-style: ce;
    font-size: 30px;
    font-weight: 400;
    background: #e05555;
    border-radius: 50%;
    justify-content: center;
    color: #fff;
    margin-right: 10px
}

.iptal-edildi-col p {
    font-size: 12px;
    line-height: 16px;
    color: var(--paragraf-color)
}

.campaign-box-content ul li span {
    float: left;
    line-height: 11px
}

.tur-popup-content .green-alert {
    font-size: 12px;
    padding: 10px 15px;
    margin-bottom: 15px;
    border-radius: 15px;
    border: 1px solid #13882b;
    font-weight: 500
}

.bay-input input[type=radio]:not(old)+label:before {
    content: "\f221";
    font-family: 'Font Awesome 5 Free'
}

.bay-input input[type=radio]:not(old)+label,
.bayan-input input[type=radio]:not(old)+label {
    padding-left: 20px
}

.bayan-input input[type=radio]:not(old)+label:before {
    content: "\f222";
    font-family: 'Font Awesome 5 Free'
}

.kabin-cinsiyet.active {
    background: rgb(247 147 29 / 13%)
}

.odeme-bilgilendirme p {
    justify-content: start;
    font-size: 14px
}

.iti__flag-container {
    margin-left: 10px !important
}

.login-box .iti__flag-container {
    margin-left: 0 !important
}

.login-box .iti input[type=tel] {
    padding-left: 45px !important
}

#otel-tab-pane .yolcu-arac-popup {
    top: 230px
}

.sefer-mobil-detay-row,
.sefer-price .son-koltuk {
    display: none
}

.sefer-yok {
    background: #fee !important
}

.sefer-yok a {
    border: 1px solid #d32f2f;
    color: #d32f2f;
    font-size: 16px;
    padding: 5px 15px;
    border-radius: 30px;
    background: #fff;
    margin: 0 5px
}

.acik-donus-sefer-text img {
    max-width: 60px
}

.sefer-yok span {
    color: #d32f2f;
    font-size: 16px
}

.sefer-seciniz {
    width: 35%;
    float: right;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative
}

.sefer-seciniz i {
    position: absolute;
    font-size: 22px;
    left: -11px;
    color: #d32f2f
}

.sefer-seciniz span {
    font-size: 13px;
    color: var(--paragraf-color)
}

.sefer-seciniz:after,
.sefer-seciniz:before {
    content: "";
    position: absolute;
    width: 1px;
    height: 28px;
    border-left: 1px dashed #dedede;
    top: 0;
    left: 0
}

.sefer-seciniz:after {
    top: auto;
    bottom: 0
}

.deactive .firma-info,
.deactive .sefer-clock-info,
.deactive .sefer-durum-info {
    opacity: .5
}

.sefer-list-row.deactive {
    background: #fff
}

.sefer-indirim {
    width: 100%;
    float: left;
    background: var(--yesil);
    color: #fff;
    text-transform: uppercase;
    font-size: 12px;
    padding: 7px;
    border-radius: 15px 15px 0 0;
    overflow: hidden;
    text-align: center;
    font-weight: 600;
    position: relative
}

.sefer-indirim strong {
    font-size: 18px;
    margin: 0 3px
}

.landing-ozellikler-slider {
    width: 100%;
    float: left;
    margin-bottom: 50px;
    margin-top: 30px
}

.landing-slider-img {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 15px 10px
}

.landing-slider-img img {
    box-shadow: 0 7px 10px rgb(43 57 145 / 26%);
    border-radius: 15px
}

.landing-ozellikler-slider .owl-theme .owl-nav [class*=owl-] {
    background: var(--gri-bg) !important
}

.landing-ozellikler-slider .owl-theme .owl-nav {
    margin-top: -25px !important
}

.landing-ozellikler-slider .owl-prev {
    left: -50px
}

.landing-ozellikler-slider .owl-next {
    right: -50px
}

.hotel-galeri-popup {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    display: none
}

.hotel-galeri-popup-bg {
    width: calc(100% - 350px);
    height: 100vh;
    background: rgb(0 0 0 / 70%);
    box-sizing: border-box;
    padding: 50px 100px;
    display: flex;
    align-items: center;
    float: left;
    position: relative;
    z-index: 99
}

.hotel-galeri-popup-yorum {
    width: 350px;
    height: 100vh;
    background: #fff;
    float: left;
    z-index: 99;
    position: relative;
    box-shadow: 0 0 15px;
    padding: 0 15px;
    overflow-x: scroll
}

.hotel-galeri-popup-yorum .comment-avatar {
    width: 50px;
    height: 50px;
    margin-right: 15px
}

.hotel-galeri-popup-yorum .comment-right {
    width: calc(100% - 65px)
}

.hotel-galeri-popup-yorum .comment-title strong {
    font-size: 16px
}

.hotel-galeri-popup-yorum .comment-title span {
    font-size: 12px;
    float: left
}

.hotel-galeri-popup-yorum .comment-title span.comment-date {
    float: right
}

.hotel-galeri-popup-yorum .comment-yildiz {
    display: block;
    float: left
}

.hotel-galeri-popup-yorum .comment-yildiz span {
    width: auto;
    display: inline-block;
    float: left;
    font-size: 11px;
    padding: 5px 7px;
    margin-bottom: 7px;
    margin-right: 5px
}

.hotel-galeri-popup-yorum .tour-details-full p {
    font-size: 12px
}

.hotel-galeri-popup-yorum .tour-details-title h2 {
    text-align: center
}

.hotel-galeri-popup-bg img {
    max-height: 90% !important;
    max-width: 100%;
    width: auto !important;
    height: auto !important
}

.hotel-galeri-popup-bg .item {
    height: 90vh;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center
}

.hotel-galeri-close {
    position: absolute;
    z-index: 99999;
    color: #fff;
    right: 380px;
    font-size: 34px;
    top: 15px;
    opacity: .5;
    cursor: pointer
}

.hotel-galeri-close:hover {
    opacity: 1
}

.iletisim-bilgileri {
    width: 100%;
    float: left;
    box-sizing: border-box
}

.iletisim-bilgileri ul {
    width: 90%;
    float: left;
    margin-top: 10px
}

.iletisim-bilgileri ul li {
    margin-bottom: 25px;
    width: 100%;
    float: left;
    display: flex;
    align-items: center
}

.iletisim-bilgileri ul li i {
    font-size: 30px;
    width: 50px;
    float: left;
    color: var(--blue)
}

.iletisim-bilgileri ul li p,
.iletisim-bilgileri ul li p a {
    width: calc(100% - 50px);
    float: left;
    font-size: 18px;
    font-weight: 300;
    color: var(--paragraf-color);
    margin: 0
}

.iletisim-formu {
    width: 100%;
    float: left;
    position: relative
}

.iletisim-formu .form-text {
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    width: 100%;
    height: 40px !important;
    border-radius: 20px !important;
    font-size: 12px;
    padding: 0 20px;
    outline: 0 !important;
    box-shadow: none !important;
    float: left
}

.iletisim-formu form>ul>li {
    width: calc(100% - 14px);
    float: left;
    margin: 7px
}

.iletisim-formu form>ul>li:nth-child(3) .iletisim-formu form>ul>li:nth-child(4) .iletisim-formu form>ul>li:nth-child(5),
.iletisim-formu form>ul>li:nth-child(6) {
    width: calc(50% - 14px);
    margin: 7px
}

.form-submit {
    background: var(--blue);
    color: #fff;
    font-size: 14px;
    padding: 12px 30px;
    border-radius: 30px;
    float: right;
    cursor: pointer;
    transition: all ease-in-out .3s
}

.form-submit:hover {
    background: var(--orange)
}

.map {
    width: 100%;
    float: left;
    margin-top: 50px;
    margin-bottom: 30px;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .2)
}

.map iframe {
    width: 100%;
    float: left;
    height: 350px
}

.biletlerim-wallet {
    width: 40%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: end;
    margin-bottom: 15px;
    height: 56px
}

.biletlerim-wallet img {
    width: 45px;
    border-radius: 10px;
    margin-left: 8px
}

.head-profile {
    width: 200px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    float: right
}

.head-pp {
    width: 50px;
    height: 50px;
    background-size: cover;
    background-position: center;
    position: relative;
    margin-left: 20px
}

.head-user-info {
    width: calc(100% - 70px);
    float: left;
    text-align: right
}

.head-user-info span {
    width: 100%;
    float: left;
    font-size: 10px;
    opacity: .5;
    color: var(--paragraf-color)
}

.head-user-info strong {
    width: 100%;
    float: left;
    font-size: 14px;
    color: var(--paragraf-color)
}

.head-pp:before {
    content: "";
    position: absolute;
    width: 58px;
    height: 58px;
    border: 2px solid var(--blue);
    border-radius: 50%;
    left: -4px;
    top: -4px
}

.bilet-form {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 15px 0
}

.bilet-form>ul {
    display: block;
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 0 25px;
    margin-top: 10px
}

.bilet-form>ul li {
    display: block;
    width: 100%;
    float: left;
    position: relative;
    margin-bottom: 10px
}

.bilet-form .yolcuArac {
    width: 100%
}

.bilet-form .yolcu-arac-popup {
    top: 50px;
    width: 100%;
    padding: 15px
}

.bilet-form .yolcu-col {
    width: 100%;
    margin-bottom: 10px
}

.bilet-form .yolcu-row {
    display: block;
    padding-bottom: 0;
    margin-bottom: 0
}

.bilet-form .arac-col {
    width: 100%
}

.bilet-form .yolcu-arac-kapat {
    margin-top: 5px
}

.bilet-form h3,
.sidebar-countdown h3 {
    width: 100%;
    float: left;
    font-size: 18px;
    text-align: center;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px dashed #ccc;
    font-weight: 700;
    color: var(--blue);
    text-transform: uppercase
}

.bilet-form .inputRow label {
    font-size: 14px;
    margin-bottom: 5px
}

.bilet-form .inputRow input,
.bilet-form .inputRow select {
    width: 100%;
    height: 37px;
    border: 1px solid #ccc;
    border-radius: 30px;
    font-size: 14px
}

.bilet-form .inputRow input {
    padding: 0 20px
}

.bilet-form .panMonth,
.bilet-form .panYear {
    width: calc(50% - 10px) !important;
    box-sizing: border-box;
    padding: 0 10px
}

.tour-details-sidebar .odeme-ozet-top-row {
    border: none;
    outline: 0 !important
}

.locationSelect {
    width: 100% !important;
    float: left;
    height: 50px !important;
    z-index: 0;
    left: 0;
    top: 0
}

span.select2 {
    width: 100% !important
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 50px;
    font-size: 14px;
    padding-left: 50px
}

.select2-container .select2-selection--single {
    height: 50px;
    text-align: left;
    border: 1px solid #ccc;
    border-radius: 30px
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 50px;
    display: none
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--blue);
    border-radius: 7px;
    margin: 0 10px
}

.select2-results__option {
    font-size: 14px
}

.select2-container--default .select2-results__option .select2-results__option {
    padding-left: 30px !important;
    margin: 0 10px
}

.select2-container--default .select2-results__group {
    padding-left: 10px
}

.select2-container--default .select2-selection--single .select2-selection__rendered:before {
    content: "\f124";
    position: absolute;
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    color: var(--blue);
    left: 17px;
    font-size: 16px
}

.select2-container--default .select2-results__group img {
    width: 20px;
    margin-right: 10px
}

.select2-container--default .select2-results__group span {
    display: flex;
    align-items: center
}

.locationIslandNereden .select2-container .select2-selection--single {
    border-radius: 30px 0 0 30px
}

.locationIslandNereden .select2-container .select2-selection--single span {
    padding-left: 40px
}

.locationIslandNereye .select2-container .select2-selection--single {
    border-radius: 0 30px 30px 0;
    border-left: 0
}

.locationIslandNereye .select2-container .select2-selection--single span {
    padding-left: 30px
}

.locationIslandNereye .select2-container .select2-selection--single span:before {
    display: none
}

.mobile-lokasyon-col .select2-container--default .select2-selection--single .select2-selection__rendered,
.mobile-tarih .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: 0;
    text-align: center;
    padding-right: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--blue);
    line-height: 30px
}

.mobile-lokasyon-col .select2-container .select2-selection--single {
    height: 40px;
    border: none
}

.mobile-lokasyon-col .select2-container--default .select2-selection--single .select2-selection__rendered:before {
    display: none
}

.select2-results__option--disabled {
    display: none
}

.select2-container--default .select2-selection--single .select2-selection__rendered.wait:before {
    content: "\f110";
    position: absolute;
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    color: var(--blue);
    left: 17px;
    font-size: 16px;
    -webkit-animation: fa-spin 2s linear infinite;
    animation: fa-spin 2s linear infinite
}

.select2-dropdown {
    padding-bottom: 20px
}

body>div.sefer-head-row.mobil-sefer-row>div>div.sefer-head-form.mobil-sefer-head-form>form>div.neredenNereye>div:nth-child(3)>span.select2.select2-container.select2-container--default>span.selection>span,
body>div.sefer-head-row>div>div.sefer-head-form>form>div.neredenNereye>div:nth-child(3)>span.select2.select2-container.select2-container--default>span.selection>span {
    border-radius: 0 30px 30px 0
}

body>div.sefer-head-row.mobil-sefer-row>div>div.sefer-head-form.mobil-sefer-head-form>form>div.neredenNereye>div:nth-child(1)>span.select2.select2-container.select2-container--default>span.selection>span,
body>div.sefer-head-row>div>div.sefer-head-form>form>div.neredenNereye>div:nth-child(1)>span.select2.select2-container.select2-container--default>span.selection>span {
    border-radius: 30px 0 0 30px;
    padding-right: 0
}

div#countdown .number {
    display: inline-block;
    text-align: center;
    position: relative;
    width: 21%;
    font-family: sans-serif;
    font-size: 18px
}

div#countdown .number span {
    font-family: sans-serif;
    font-size: 10px;
    clear: both;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -8px
}

div#countdown {
    display: inline-block
}

.biletlerim-teklifler {
    width: 100%;
    float: left;
    border: 1px solid #f0f0f4;
    margin-bottom: 20px;
    border-radius: 15px;
    overflow: hidden
}

.bilet-teklif-title {
    width: 100%;
    float: left;
    border-bottom: 1px solid #f0f0f4;
    box-sizing: border-box;
    padding: 18px 30px;
    background: #f7f9fa;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer
}

.bilet-teklif-title h3 {
    font-size: 16px;
    font-weight: 600;
    color: #2b3991
}

.bilet-teklif-list-row-content {
    width: 100%;
    float: left
}

.bilet-teklif-list-row {
    width: 100%;
    float: left;
    border-bottom: 1px solid #f0f0f4;
    box-sizing: border-box
}

.bilet-teklif-list-row:last-child {
    border-bottom: 0
}

.bilet-teklif-list-row a {
    width: 100%;
    display: flex;
    padding: 10px 30px;
    float: left;
    align-items: center;
    transition: all ease-in-out .3s
}

.teklf-list-img {
    width: 35px;
    height: 35px;
    float: left;
    background: #e9f1fe;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px
}

.teklf-list-img img {
    width: 15px;
    max-height: 15px
}

.teklif-list-title {
    width: calc(100% - 220px);
    float: left
}

.teklif-list-title h4 {
    font-size: 14px;
    color: #000
}

.teklif-list-btn {
    background: var(--orange);
    float: right;
    font-size: 11px;
    color: #fff;
    padding: 8px 15px;
    min-width: 170px;
    border-radius: 30px;
    text-align: center;
    font-weight: 600
}

.bilet-teklif-list-row a:hover {
    background: #e8f1fe
}

.countdown {
    width: fit-content;
    display: inline-grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    gap: 1rem;
    margin-bottom: 20px
}

.countdown>.part {
    display: grid;
    gap: .5rem
}

.countdown>.part>.number {
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1px solid hsl(0 0% 50% / .5);
    font-size: 1.5rem;
    position: relative;
    color: #f7931d;
    font-weight: 600
}

.countdown>.part.days {
    --num: 365
}

.countdown>.part.hours {
    --num: 24
}

.countdown>.part:where(.minutes, .seconds) {
    --num: 60
}

.countdown>.part>.number::after {
    content: "";
    position: absolute;
    inset: calc(var(--border-size) * -.5);
    border-radius: inherit;
    --degree: calc(360deg / var(--num) * (var(--num) - var(--value, 0)));
    background-image: conic-gradient(var(--accent) var(--degree), transparent calc(var(--degree) + .1deg));
    --border-size: 4px;
    --mask-image: radial-gradient(100% 100%, transparent calc(50% - var(--border-size)), black calc(50% - var(--border-size) + 1px));
    -webkit-mask-image: var(--mask-image);
    mask-image: var(--mask-image)
}

.countdown>.part>.text {
    text-align: center;
    opacity: 1;
    text-transform: uppercase;
    font-size: 13px;
    color: #2b3991;
    font-weight: 600
}

.sidebar-countdown h3 {
    padding-top: 15px
}

.sidebar-countdown {
    text-align: center
}

.tour-details-sidebar .inputRow {
    padding: 0 20px
}

.tour-details-sidebar .inputRoe {
    float: left;
    width: 100%;
    box-sizing: border-box;
    padding-left: 20px
}

.teklif-iste-head-left {
    display: flex;
    align-items: center
}

.teklif-iste-head-left img {
    margin-right: 15px;
    width: 25px
}

.teklif-iste-head-right {
    color: var(--blue)
}

.teklif-iste-head-right i {
    transform: rotate(180deg);
    transition: all ease-in-out .3s
}

.bilet-teklif-title.active .teklif-iste-head-right i {
    transform: rotate(0)
}

.error-message {
    width: 100%;
    float: left;
    border: 1px solid var(--orange);
    font-size: 14px;
    box-sizing: border-box;
    padding: 10px 20px;
    border-radius: 30px;
    color: var(--orange);
    background: #fff;
    font-weight: 500;
    margin-top: 15px
}

.error-message i {
    margin-right: 7px
}

.teklifler-list {
    padding: 0;
    overflow: hidden
}

.teklifler-list .bilet-teklif-list-row a {
    padding: 15px 30px
}

.teklif-sayac {
    width: calc(100% + 40px);
    float: left;
    background: #f7f9fa;
    border-bottom: 1px solid #f0f0f4;
    position: relative;
    margin-top: -20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 10px;
    margin-bottom: 30px;
    margin-left: -20px;
    border-radius: 15px 15px 0 0;
    padding-bottom: 10px
}

.teklif-sayac h3 {
    font-size: 16px;
    font-weight: 700;
    color: var(--blue);
    margin-right: 20px
}

.teklif-sayac .countdown>.part>.text {
    font-size: 14px
}

.teklif-sayac .countdown>.part>.number {
    font-size: 16px;
    display: inline-block;
    border: none !important;
    aspect-ratio: auto !important;
    float: left;
    font-weight: 700
}

.teklif-sayac .countdown {
    margin-bottom: 0;
    width: auto;
    display: inline-block
}

.teklif-detay-content {
    width: 100%;
    float: left
}

.teklif-detay-content p {
    color: var(--paragraf-color);
    margin-top: 10px;
    margin-bottom: 20px
}

.teklif-kod {
    display: inline-block;
    border: 1px solid var(--orange);
    padding: 10px 10px 10px 20px;
    border-radius: 30px
}

.teklif-kod span {
    text-transform: uppercase;
    font-size: 14px;
    margin-right: 15px;
    color: var(--orange);
    font-weight: 600
}

.teklif-kod strong {
    background: var(--orange);
    color: #fff;
    padding: 6px 20px;
    border-radius: 20px;
    font-size: 14px
}

.voucher-tab-accordion {
    width: 100%;
    position: absolute;
    z-index: 3;
    background: #fff;
    height: 0;
    top: calc(100% - 51px);
    left: 0;
    transition: all ease-in-out .3s
}

.voucher-tab-button {
    width: 100%;
    background: #2a388e;
    color: #fff;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    border-radius: 0 0 15px 15px
}

.voucher-tab-content {
    width: 100%;
    float: left;
    padding: 20px;
    box-sizing: border-box;
    display: none
}

.voucher-tab-accordion.active {
    bottom: auto;
    top: 0;
    height: 100%;
    border-radius: 0 15px 15px 15px
}

.voucher-tab-button strong {
    font-size: 14px
}

.voucher-tab-accordion.active .voucher-tab-button i {
    transform: rotate(0)
}

.voucher-tab-accordion .voucher-tab-button i {
    transform: rotate(180deg);
    transition: all ease-in-out .3s
}

.aracSaat .select2-container--default .select2-selection--single .select2-selection__rendered:before {
    content: "\f017"
}

.pl-6 {
    padding-left: 6px
}

.pr-6 {
    padding-right: 6px
}

div#arac-kiralama-tab-pane {
    margin-bottom: -50px
}

.select2-results__option {
    margin: 0 10px !important
}

.mobile-tarih .select2-selection.select2-selection--single {
    height: auto;
    border: none;
    padding: 0
}

.mobile-tarih .select2-container--default .select2-selection--single .select2-selection__rendered:before {
    display: none
}

.searchCarDate {
    width: 60%;
    float: left;
    border-right: 1px solid #ccc
}

.searchClock {
    width: 40%;
    text-align: center;
    padding-left: 15px;
    box-sizing: border-box
}

.car-list {
    width: 100%;
    float: left;
    margin-top: 30px
}

.car-row {
    width: 100%;
    float: left;
    border: 1px solid #dedede;
    border-radius: 15px;
    box-sizing: border-box;
    overflow: hidden;
    margin-bottom: 20px
}

.car-col-img {
    width: 37%;
    box-sizing: border-box;
    height: 260px;
    float: left;
    display: flex;
    align-items: center;
    border-right: 1px solid #dedede;
    position: relative;
    justify-content: center
}

.car-col-img img {
    max-height: 75%;
    max-width: 65%
}

.car-col-img h2 {
    font-size: 16px;
    position: absolute;
    top: 15px;
    left: 20px;
    font-weight: 600
}

.car-col-img h2 span {
    font-weight: 300
}

.car-col-badge {
    position: absolute;
    left: 20px;
    bottom: 15px;
    background: var(--green);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 10px 20px;
    border-radius: 20px
}

.car-col-badge i {
    font-size: 14px;
    margin-right: 7px
}

.car-col-info {
    width: 42%;
    float: left;
    height: 260px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 5%;
    position: relative;
    border-right: 1px solid #dedede;
    justify-content: center
}

.car-col-info-footer {
    position: absolute;
    width: 100%;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    left: 0;
    background: #f7f9fa
}

.car-col-info-footer-col {
    width: 50%;
    height: 50px;
    border-top: 1px solid #dedede;
    border-right: 1px solid #dedede;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--blue);
    font-weight: 600;
    font-size: 14px
}

.car-col-info-footer-col i {
    font-size: 18px;
    margin-right: 10px;
    color: var(--mavi)
}

.car-col-info-footer-col:last-child {
    border-right: 0;
    FONT-VARIANT: JIS04;
    FONT-VARIANT: JIS04;
    FONT-VARIANT: JIS04;
    FONT-VARIANT: JIS04
}

.car-col-info ul {
    margin-bottom: 50px
}

.car-col-info ul li {
    font-size: 13px;
    padding: 7px 0;
    border-bottom: 1px dashed #dedede;
    color: var(--paragraf-color)
}

.car-col-info ul li:last-child {
    border-bottom: none
}

.car-col-prices {
    width: 21%;
    float: left;
    height: 260px;
    background: #f7931d14;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative
}

.car-col-prices a {
    position: absolute;
    bottom: 20px;
    background: var(--orange);
    color: #fff;
    padding: 10px 25px;
    font-weight: 600;
    font-size: 14px;
    border-radius: 30px;
    border: 1px solid var(--orange);
    transition: all ease-in-out .3s
}

.car-col-prices a:hover {
    background-color: #f7931d14;
    color: var(--orange)
}

.car-col-prices ul {
    width: 150px;
    text-align: right;
    margin-bottom: 45px
}

.car-col-prices ul li {
    padding: 10px 0;
    border-bottom: 1px dashed #dedede;
    color: var(--paragraf-color)
}

.car-col-prices ul li:last-child {
    border-bottom: 0;
    color: var(--orange);
    font-weight: 600
}

.car-filter-box {
    float: left;
    margin-right: 15px;
    position: relative;
    border-radius: 30px
}

.car-filter-button {
    padding: 12px 25px;
    font-size: 14px;
    border: 1px solid #dedede;
    border-radius: 30px;
    background: #f7f9fa;
    transition: all ease-in-out .3s;
    cursor: pointer
}

.car-filter-button strong {
    font-weight: 600;
    margin-right: 30px
}

.car-filter-content {
    width: 100%;
    position: absolute;
    z-index: 3;
    background: #f7f9fa;
    padding: 0 15px 5px;
    border-radius: 0 0 15px 15px;
    border: 1px solid #dedede;
    border-top: 0;
    display: none
}

.car-filter-button i {
    opacity: .5;
    font-size: 12px;
    transition: all ease-in-out .3s
}

.car-filter-content ul li {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    margin-bottom: 10px
}

.active .car-filter-button {
    border-radius: 15px 15px 0 0;
    border-bottom: 0
}

.active .car-filter-button i {
    transform: rotate(180deg)
}

.car-input {
    width: calc(50% - 5px);
    font-size: 11px;
    float: left;
    margin-right: 5px;
    height: 35px;
    text-align: center;
    border-radius: 30px;
    border: 1px solid #dedede
}

.car-input:last-child {
    margin-right: 0;
    margin-left: 5px
}

.car-filtrele-button {
    float: left
}

.car-filtrele-button button {
    height: 47px;
    border: 1px solid var(--orange);
    background: var(--orange);
    color: #fff;
    border-radius: 30px;
    padding: 0 30px;
    font-size: 14px;
    transition: all ease-in-out .3s
}

.car-filtrele-button button i {
    margin-right: 10px
}

.car-filtrele-button button:hover {
    background: #fff;
    color: var(--orange)
}

.car-filter-button span {
    display: none
}

.bilet-teklif-list-row.disabled {
    background-color: #e8f1fe;
    opacity: .5
}

.bilet-teklif-list-row.disabled a {
    pointer-events: none
}

.teklif-sayac .countdown>.part {
    display: flex;
    align-items: center;
    float: left;
    width: auto !important;
    margin-right: .5em;
    gap: .3rem
}

.teklif-sayac .countdown>.part>.number::after {
    display: none
}

.teklif-detay-footer {
    width: 100%;
    float: left;
    margin-top: 40px;
    display: flex;
    align-items: center;
    justify-content: center
}

.teklif-detay-footer a {
    display: inline-flex;
    align-items: center;
    justify-content: center
}

.teklif-detay-footer a:hover {
    color: #fff
}

#map {
    width: 100%;
    height: 780px;
    position: relative;
    z-index: 1
}

.map-title {
    width: 100%;
    float: left;
    background: var(--blue);
    padding: 20px 0
}

.map-title h1 {
    font-size: 24px;
    color: #fff;
    font-weight: 700
}

.map-title h1 i {
    margin-right: 15px
}

.map-row {
    width: 100%;
    float: left;
    position: relative
}

.map-content {
    position: absolute;
    top: 70px;
    z-index: 4;
    width: 550px;
    float: left;
    right: 7%
}

.map-location {
    width: 100%;
    float: left;
    margin-bottom: 15px;
    position: relative
}

.map-location select {
    width: calc(100% - 50px) !important;
    height: 50px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    padding-left: 20px;
    font-size: 14px;
    border-radius: 30px;
    float: left;
    color: var(--paragraf-color);
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.map-location-number {
    width: 50px;
    height: 50px;
    float: left;
    border: 1px solid #ccc;
    border-radius: 25px 0 0 25px;
    background: #f7f7f7;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 0
}

.map-location-number span {
    width: 25px;
    height: 25px;
    background: var(--orange);
    color: #fff;
    font-weight: 700;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    border: 2px solid #fff
}

.map-location:first-child:before {
    content: "";
    position: absolute;
    width: 2px;
    height: 15px;
    background: #ccc;
    bottom: -15px;
    left: 25px
}

.mapTarih .tarih-col {
    display: block
}

.map-label {
    width: 100%;
    float: left;
    background: #f7f7f7;
    border: 1px solid #ccc;
    border-bottom: 0;
    border-radius: 15px 15px 0 0;
    box-sizing: border-box;
    padding: 10px 20px;
    font-size: 13px;
    color: var(--blue);
    font-weight: 600
}

.map-label i {
    margin-right: 10px
}

.mapTarih input {
    border-radius: 0 0 15px 15px !important;
    padding-left: 20px !important
}

.mapTarih {
    margin-bottom: 15px
}

.map-search-btn {
    width: 100%;
    float: left;
    margin-top: 15px
}

.map-search-btn .orange-btn {
    width: 100%;
    font-weight: 600;
    height: 55px;
    border-radius: 30px
}

.map-search-btn .orange-btn i {
    margin-right: 7px
}

.map-content .tab-content {
    padding-bottom: 30px
}

.cokluRotaRow .map-location {
    margin-bottom: 0
}

.cokluRotaRow .map-location:first-child .map-location-number {
    border-bottom-left-radius: 0;
    border-top-left-radius: 15px;
    border-bottom: 0
}

.cokluRotaRow .map-location:last-child .map-location-number {
    border-top-left-radius: 0;
    border-bottom-left-radius: 15px
}

.cokluRotaRow .map-location:first-child select {
    border-top-right-radius: 15px !important;
    border-bottom-right-radius: 0;
    border-bottom: 0
}

.cokluRotaRow .map-location:last-child select {
    border-top-right-radius: 0;
    border-bottom-right-radius: 15px
}

.cokluRotaRow .col-md-4 {
    padding-left: 0
}

.cokluRotaRow .mapTarih {
    width: 100%;
    float: left
}

.cokluRotaRow .mapTarih .tarih-col {
    width: 100%
}

.cokluRotaRow .mapTarih .tarih-col .map-label {
    height: 50px;
    display: flex;
    align-items: center
}

.w100 {
    width: 100%;
    padding: 0
}

.routeAdd,
.routeDel {
    width: 100%;
    float: left;
    margin-bottom: 15px;
    color: var(--blue);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: all ease-in-out .3s
}

.routeAdd i,
.routeDel i {
    margin-right: 7px
}

.routeAdd:hover,
.routeDel:hover {
    color: var(--orange)
}

.routeAdd {
    display: none
}

.endDateClose {
    position: absolute;
    right: 5px;
    top: 8px;
    font-size: 18px;
    cursor: pointer;
    transition: all ease-in-out .3s
}

.endDateClose:hover {
    color: var(--orange)
}

.pl-5 {
    padding-left: 5px !important
}

.cokluRotaRow.disabled {
    opacity: .5;
    pointer-events: none
}

.voucher-tab-accordion.active .voucher-tab-button {
    border-radius: 0 10px 0 0
}

.bilet-form .icon-input,
.bilet-form .iti,
.bilet-form label {
    box-sizing: border-box;
    margin-left: 15px;
    float: left;
    width: calc(100% - 30px)
}

.bilet-form .form-control {
    width: calc(100% - 30px);
    margin-left: 15px;
    height: 40px;
    margin-bottom: 20px;
    border-radius: 20px;
}

.bilet-form .sonKullanma,
.bilet-form .cvvNo {
    margin-top: 0px !important;
    padding: 0px 15px;
}

.bilet-form .sonKullanma label,
.bilet-form .cvvNo label {
    margin-left: 0px;
}

.payment-tab-buttons {
    border: 2px solid var(--blue);
    border-radius: 50px;
    float: right;
}

.payment-tab-buttons .btn-dark {
    background: var(--blue);
    border: none;
    border-radius: 50px;
    font-size: 14px;
    display: flex;
    align-items: center;
    padding: 10px 30px !important;
    color: #fff !important;
}

.payment-tab-buttons .btn-white {
    font-size: 14px;
    display: flex;
    align-items: center;
    color: var(--blue);
    font-weight: 600;
    padding: 10px 20px;
}

.payment-option-content {
    margin-top: 20px;
    float: left;
    padding: 0px 5px;
}

.payment-option-content p {
    margin-top: 0px !important;
    margin-bottom: 10px !important;
    width: 100%;
    float: left;
    font-size: 14px;
    color: var(--paragraf-color);
}

.payment-option-content p:last-child {
    margin-top: 15px !important;
}

.payment-tab-buttons .btn-white.btn-dark {
    color: #fff;
    padding: 10px 20px;
}

.payment-tab-buttons .btn {
    color: var(--blue);
    font-size: 14px;
    display: flex;
    align-items: center;
    font-weight: 600;
    padding: 0px 20px;
    height: 45px;
}

.odeme-box-title.payment-options-box {
    justify-content: space-between;
}

.partialpayment {
    width: 100%;
    float: left;
    background: #cbd2ff;
    border-radius: 15px 15px 0px 0px;
    padding: 10px;
    text-align: center;
    color: var(--blue);
    font-size: 14px;
    display: none;
}

.partialpayment span {
    font-weight: 900;
    color: var(--blue);
}

.card-custom {
    margin: auto;
    border-radius: 20px;
    border: none;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
    background-color: #2b3991;
    color: #fff;
    margin-bottom: 20px;
}

.emoji-section {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
}

.text-section {
    padding: 20px 40px 20px 0;
}

.card-title-custom {
    font-size: 1.5rem;
    color: #007bff;
    margin-bottom: 15px;
}

.card-text-custom {
    font-size: 1rem;
    text-align: justify;
}

.row.advantage-msg-row {
    clear: both
}

/* Mobile Search Tabs */
.mobile-search-tabs {
    width: 100%;
    float: left;
    margin-top: 30px;
    margin-bottom: 40px;
}

.mobile-tab-buttons {
    width: calc(100vw - 40px);
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-around;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    padding: 15px 10px;
    margin-bottom: 20px;
    margin-left: calc(-50vw + 50% + 20px);
    margin-right: calc(-50vw + 50% + 20px);
    position: relative;
    left: 0;
    right: 0;
}

.mobile-tab-btn {
    background: transparent;
    border: none;
    color: #fff;
    text-align: center;
    padding: 12px 6px;
    border-radius: 12px;
    transition: all ease-in-out 0.3s;
    cursor: pointer;
    flex: 1;
    margin: 0 3px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.mobile-tab-btn img {
    width: 40px;
    height: 40px;
    margin-bottom: 8px;
    transition: all ease-in-out 0.3s;
}

.mobile-tab-btn span {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
}

.mobile-tab-btn.active {
    background: rgba(255, 255, 255, 0.2);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.mobile-tab-btn.active img {
    transform: scale(1.1);
}

.mobile-tab-contents {
    width: 100%;
    float: left;
}

.mobile-tab-content {
    width: 100%;
    float: left;
    display: none;
}

.mobile-tab-content.active {
    display: block;
}

.mobile-search-form {
    width: 100%;
    float: left;
    padding: 0 30px;
    box-sizing: border-box;
    max-width: 100%;
}

/* Otel formu için özel stiller */
#otel-content .mobile-lokasyon-col {
    width: 100% !important;
    text-align: left;
}

#otel-content .mobile-nerden-nereye {
    justify-content: center;
    padding: 0 20px;
}

/* Placeholder color fixes for mobile forms */
.mobile-lokasyon-col input::placeholder,
.mobile-tarih-col input::placeholder,
.mobile-popup-input input::placeholder {
    color: var(--blue);
    opacity: 1;
}

.mobile-lokasyon-col input::-webkit-input-placeholder,
.mobile-tarih-col input::-webkit-input-placeholder,
.mobile-popup-input input::-webkit-input-placeholder {
    color: var(--blue);
    opacity: 1;
}

.mobile-lokasyon-col input::-moz-placeholder,
.mobile-tarih-col input::-moz-placeholder,
.mobile-popup-input input::-moz-placeholder {
    color: var(--blue);
    opacity: 1;
}

.mobile-lokasyon-col input:-ms-input-placeholder,
.mobile-tarih-col input:-ms-input-placeholder,
.mobile-popup-input input:-ms-input-placeholder {
    color: var(--blue);
    opacity: 1;
}

/* Safari form-control fixes */
.form-control,
select.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 40px;
}

/* Tour tab select general styling */
#tur-tab-pane select.form-control {
    height: 50px;
    border: 2px solid #e8ecef;
    border-radius: 25px;
    padding: 0 40px 0 20px;
    font-size: 16px;
    color: var(--blue);
    font-weight: 600;
    background-color: #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

#tur-tab-pane select.form-control:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 0.2rem rgba(43, 57, 145, 0.25);
    outline: none;
}

/* Mobile tour select specific fixes */
.mobile-popup-input select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url('data:image/svg+xml;charset=US-ASCII,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 5"><path fill="%232b3991" d="M2 0L0 2h4zm0 5L0 3h4z"/></svg>');
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 12px;
    padding-right: 40px;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 12px 40px 12px 12px;
    font-size: 16px;
    color: var(--blue);
    background-color: #fff;
}

/* Safari specific select fixes */
@media screen and (-webkit-min-device-pixel-ratio: 0) {

    /* Tour tab select specific fix for Safari */
    #tur-tab-pane select.form-control {
        height: 50px;
        border: 2px solid #e8ecef;
        border-radius: 25px;
        padding: 0 40px 0 40px;
        font-size: 16px;
        color: var(--blue);
        font-weight: 600;
        background-color: #fff;
        -webkit-appearance: none;
        background-image: url('data:image/svg+xml;charset=US-ASCII,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 5"><path fill="%232b3991" d="M2 0L0 2h4zm0 5L0 3h4z"/></svg>');
        background-repeat: no-repeat;
        background-position: right 15px center;
        background-size: 12px;
    }

    #tur-tab-pane select.form-control:focus {
        border-color: var(--blue);
        box-shadow: 0 0 0 0.2rem rgba(43, 57, 145, 0.25);
        outline: none;
    }
}

/* Ferry Search Page */
.ferry-list {
    contain: layout style;
    will-change: contents
}

.ferry-box {
    contain: layout style paint;
    will-change: transform, opacity
}

.ferry-accordion-content,
.modal-accordion-content {
    contain: content
}

.ferry-content {
    width: 100%;
    float: left;
    margin-bottom: 100px;
    margin-top: 100px
}

.ferry-head {
    width: 100%;
    float: left;
    background: #edf7ff;
    height: 60px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 0 20px;
    margin-bottom: 20px
}

.ferry-name {
    font-weight: 600;
    color: var(--title-color);
    font-size: 16px
}

.ferry-name i {
    margin: 0 10px;
    color: var(--orange)
}

.ferry-date {
    display: flex;
    align-items: center
}

.ferry-date a,
.ferry-date button {
    padding: 0;
    border: none;
    background: 0 0;
    color: var(--blue);
    font-size: 20px;
    text-decoration: none
}

.ferry-date strong {
    margin: 0 20px;
    color: var(--blue);
    font-size: 16px;
    font-weight: 600
}

.ferry-result {
    width: 100%;
    float: left;
    text-align: center;
    margin-bottom: 20px;
    font-size: 14px
}

.ferry-list {
    width: 100%;
    float: left
}

.ferry-box {
    width: 100%;
    float: left;
    border: 1px solid #d4d4d4;
    border-radius: 10px;
    margin-bottom: 15px;
    cursor: pointer;
    transition: all ease-in-out .3s
}

.ferry-box-content {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    padding: 15px 15px
}

.ferry-company {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    float: left;
    border-radius: 10px;
    overflow: hidden
}

.ferry-company img {
    float: left;
    max-width: 100%
}

.ferry-time {
    width: calc(55% - 70px);
    float: left;
    margin-left: 10px;
    display: flex;
    align-items: center
}

.ferry-clock {
    width: 30%;
    float: left;
    text-align: center
}

.ferry-clock strong {
    width: 100%;
    float: left;
    font-size: 18px;
    text-align: center;
    font-weight: 600
}

.ferry-clock span {
    font-size: 12px;
    float: left;
    text-align: center;
    width: 100%;
    opacity: .5
}

.ferry-second {
    width: 40%;
    text-align: center;
    font-size: 12px;
    opacity: .5
}

.ferry-second span {
    margin: 0 5px
}

.ferry-icons {
    width: 22%;
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.ferry-icons button {
    padding: 0;
    border: none;
    background: 0 0;
    font-size: 12px;
    margin-right: 7px;
    transition: all ease-in-out .3s;
    outline: 0
}

.ferry-icons button:hover {
    color: var(--blue)
}

.ferry-icons button.deactive {
    opacity: .3;
    position: relative
}

.ferry-icons button.deactive:before {
    content: "";
    position: absolute;
    width: 140%;
    height: 2px;
    background: #000;
    transform: rotate(-45deg);
    top: 7px;
    left: -3px;
    border: .5px solid #fff
}

.ferry-info {
    width: 30px;
    float: left;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-left: 0
}

.ferry-info:before {
    content: "";
    position: absolute;
    width: 1px;
    height: 60px;
    background: #d4d4d4;
    left: 0
}

.ferry-info button {
    background: #fff;
    border: none;
    color: var(--blue);
    position: relative;
    transition: all ease-in-out .3s
}

.ferry-info button:hover {
    transform: scale(1.1)
}

.ferry-price {
    width: calc(22% - 30px);
    float: left;
    box-sizing: border-box;
    padding-left: 5px
}

.ferry-price strong {
    width: 100%;
    float: left;
    text-align: right;
    font-size: 16px;
    color: var(--blue)
}

.ferry-price span {
    font-size: 12px;
    float: left
}

.ferry-price .badge {
    font-size: 10px;
    margin-bottom: 3px;
    display: block
}

.ferry-box.active {
    border: 1px solid var(--blue);
    box-shadow: 0 0 10px rgb(45 57 147 / 30%)
}

.ferry-box:hover {
    box-shadow: 0 0 10px rgb(0 0 0 / 20%)
}

.ferry-box-campaign {
    border: 2px solid #f6931d;
    border-left: 2px solid #f6931d;
    background: linear-gradient(135deg, #f0f4ff 0%, #e8eeff 100%);
    box-shadow: 0 2px 12px rgb(43 57 145 / 15%);
    position: relative;
    overflow: visible;
    contain: layout style
}

.ferry-box-campaign .ferry-company {
    width: 70px;
    height: 70px;
    border-color: #f6931d
}

.ferry-box-campaign .ferry-company picture {
    width: 100%;
    height: 100%;
    display: block
}

.ferry-box-campaign .ferry-company picture img,
.ferry-box-campaign .ferry-company img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center;
    display: block
}

.ferry-box-campaign .ferry-info button {
    background: transparent
}

.ferry-campaign-badge {
    position: absolute;
    top: -10px;
    left: 15px;
    background: #f6931d;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 10px;
    border-radius: 4px
}

.ferry-campaign-badge i {
    margin-right: 4px
}

.ferry-box-campaign:hover {
    box-shadow: 0 4px 20px rgb(43 57 145 / 25%)
}

.ferry-box-campaign.active {
    border: 2px solid #f6931d;
    box-shadow: 0 0 10px rgb(246 147 29 / 30%)
}

.ferry-box.deactive {
    border: 1px solid #eee;
    cursor: not-allowed
}

.ferry-box.deactive * {
    opacity: .6;
    pointer-events: none
}

.ferry-box.deactive:hover {
    box-shadow: none
}

.ferry-box.disabled {
    opacity: .5;
    pointer-events: none;
    cursor: not-allowed;
    border: 1px solid #eee
}

.ferry-box.disabled:hover {
    box-shadow: none
}

.ferry-box.disabled .ferry-box-content {
    opacity: .6
}

.ferry-box-accordion {
    width: 100%;
    float: left;
    border-top: 1px dashed #eee;
    box-sizing: border-box
}

.ferry-accordion-button {
    width: 100%;
    float: left;
    font-size: 12px;
    padding: 10px 15px;
    font-weight: 600;
    opacity: .7;
    display: flex;
    align-items: center;
    cursor: pointer
}

.ferry-accordion-button i {
    margin-left: 8px;
    transition: all ease-in-out .3s
}

.ferry-accordion-button.active i {
    transform: rotate(180deg)
}

.ferry-accordion-button strong {
    font-weight: 500
}

.ferry-accordion-content {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 0 15px 5px;
    display: none
}

.ferry-accordion-content p {
    font-size: 12px;
    opacity: .7;
    margin-bottom: 10px
}

.ferry-show-btn,
.ferry-alternatif-url {
    width: 100%;
    float: left;
    margin: 15px 0;
    display: none;
    align-items: center;
    justify-content: center;
    text-align: center
}

.ferry-show-btn.visible,
.ferry-alternatif-url.visible {
    display: flex
}

.ferry-show-btn button,
.ferry-alternatif-url button {
    background: 0 0;
    border: none;
    font-size: 14px;
    color: var(--orange);
    display: inline-block;
    font-weight: 600;
    float: none;
    cursor: pointer
}

.ferry-show-btn i,
.ferry-alternatif-url i {
    margin: 0 5px
}

.ferry-show-btn button:hover,
.ferry-alternatif-url button:hover {
    text-decoration: underline
}

.next-btn-row {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 50px
}

.odeme-ilerle-btn {
    background: var(--blue);
    color: #fff;
    padding: 12px 30px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 18px;
    box-shadow: 0 8px 20px rgb(43 57 145 / 25%);
    border: none;
    transition: all ease-in-out .3s;
    text-decoration: none
}

.odeme-ilerle-btn i {
    font-size: 24px;
    margin-left: 10px;
    position: relative;
    top: 3px;
    right: 0
}

.odeme-ilerle-btn:hover {
    background: var(--orange);
    color: #fff
}

.ferryDetailModal .modal-dialog {
    max-width: 800px
}

.ferryDetailModal .modal-content {
    border-radius: 15px;
    border: none;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .3)
}

.ferryDetailModal .modal-header {
    border-bottom: 1px solid #eee;
    padding: 15px 20px
}

.ferryDetailModal .modal-header .modal-title {
    font-size: 16px;
    font-weight: 600
}

.ferryDetailModal .modal-header .btn-close {
    font-size: 12px;
    background: none;
    border: none;
    padding: 5px
}

.ferryDetailModal .modal-body {
    padding: 20px;
    max-height: 70vh;
    overflow-y: auto
}

.modal-ferry-detail-box {
    width: 100%;
    border: 1px solid #eee;
    border-radius: 10px;
    overflow: hidden
}

.modal-ferry-head {
    width: 100%;
    background: #ddf6ff;
    padding: 15px;
    display: flex;
    justify-content: space-between
}

.modal-ferry-info {
    width: 70%
}

.modal-ferry-name {
    width: 100%;
    font-weight: 700;
    color: var(--title-color);
    margin-bottom: 10px;
    display: flex;
    align-items: center
}

.modal-ferry-name i {
    margin: 0 10px
}

.modal-ferry-company-row {
    display: flex;
    align-items: center
}

.modal-ferry-company-logo {
    width: 45px;
    height: 45px;
    background: #fff;
    border-radius: 10px;
    margin-right: 10px;
    overflow: hidden;
    border: 1px solid #eee;
    display: flex;
    align-items: center;
    justify-content: center
}

.modal-ferry-company-logo img {
    max-width: 100%;
    max-height: 100%
}

.modal-ferry-company-info strong {
    display: block;
    color: var(--title-color);
    font-weight: 600;
    font-size: 14px
}

.modal-ferry-company-info span {
    display: block;
    font-size: 12px;
    opacity: .6
}

.modal-ferry-time {
    width: 30%;
    text-align: right
}

.modal-ferry-time strong {
    display: block;
    color: var(--title-color);
    margin-bottom: 5px
}

.modal-ferry-time span {
    font-size: 14px
}

.modal-ferry-price {
    width: 100%;
    padding: 15px 20px;
    border-bottom: 1px solid #eee
}

.modal-ferry-price h3 {
    font-size: 13px;
    color: var(--title-color);
    margin-bottom: 10px;
    opacity: .7;
    font-weight: 500
}

.modal-ferry-price-row {
    display: flex;
    align-items: center;
    justify-content: space-around
}

.ferry-price-col {
    text-align: center;
    padding: 8px
}

.ferry-price-col i {
    display: block;
    font-size: 18px;
    margin-bottom: 5px;
    opacity: .7
}

.ferry-price-col span {
    font-weight: 600;
    font-size: 14px;
    display: block
}

.ferry-price-col small {
    font-size: 11px;
    opacity: .6;
    display: block;
    margin-top: 3px
}

.ferry-price-col.deactive {
    opacity: .4
}

.modal-ferry-accordion {
    width: 100%;
    padding: 0 20px;
    border-top: 1px solid #eee
}

.modal-ferry-accordion .accordion-row {
    width: 100%
}

.modal-accordion-button {
    padding: 15px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    transition: all .3s
}

.modal-accordion-button strong {
    font-size: 13px;
    font-weight: 600;
    color: var(--title-color)
}

.modal-accordion-button i {
    transition: transform .3s;
    color: #999
}

.modal-accordion-button.active i {
    transform: rotate(180deg)
}

.modal-accordion-content {
    display: none;
    padding-bottom: 15px
}

.modal-accordion-content p {
    font-size: 12px;
    color: #666;
    line-height: 1.6;
    margin: 0
}

.modal-ferry-sidebar {
    width: 100%;
    background: #f8f9fa;
    border-radius: 10px;
    padding: 20px
}

.modal-ferry-duration {
    width: 100%;
    text-align: center;
    font-size: 13px;
    color: #666;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #e0e0e0
}

.modal-ferry-duration i {
    margin-right: 5px;
    color: var(--blue)
}

.modal-ferry-route-visual {
    width: 100%;
    position: relative;
    padding-left: 15px
}

.modal-ferry-route-port {
    width: 100%;
    position: relative;
    padding-left: 20px;
    margin-bottom: 0
}

.modal-ferry-route-port:before {
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    background: var(--blue);
    border-radius: 50%;
    left: 0;
    top: 5px;
    z-index: 2
}

.modal-ferry-route-port.route-start:after {
    content: "";
    position: absolute;
    width: 2px;
    height: calc(100% + 20px);
    background: var(--blue);
    left: 5px;
    top: 10px;
    z-index: 1
}

.modal-ferry-route-port.route-end {
    margin-top: 20px
}

.modal-ferry-route-port.route-end:before {
    background: #fff;
    border: 2px solid var(--blue)
}

.modal-ferry-route-port .route-time {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 3px
}

.modal-ferry-route-port .route-time strong {
    font-size: 15px;
    font-weight: 700;
    color: var(--title-color)
}

.modal-ferry-route-port .route-time span {
    font-size: 11px;
    color: #999
}

.modal-ferry-route-port .route-location strong {
    font-size: 13px;
    font-weight: 500;
    color: #555
}

.ferryDetailModal .modal-footer {
    border-top: 1px solid #eee;
    padding: 15px 20px
}

.ferryDetailModal .modal-footer .btn-select {
    background: var(--orange);
    border: none;
    padding: 10px 25px;
    color: #fff;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 600;
    transition: all .3s
}

.ferryDetailModal .modal-footer .btn-select:hover {
    background: var(--blue)
}

.no-ferry-alert {
    width: 100%;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 15px;
    padding: 30px;
    text-align: center;
    border: 1px solid #dee2e6
}

.no-ferry-alert .alert-icon {
    width: 70px;
    height: 70px;
    margin: 0 auto 20px;
    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center
}

.no-ferry-alert .alert-icon i {
    font-size: 28px;
    color: #fff
}

.no-ferry-alert h4 {
    font-size: 16px;
    font-weight: 600;
    color: #495057;
    margin-bottom: 10px
}

.no-ferry-alert p {
    font-size: 14px;
    color: #6c757d;
    margin-bottom: 15px
}

.no-ferry-alert .nearest-date {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--blue);
    color: #fff;
    padding: 12px 20px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: all .3s;
    border: none;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(45, 57, 147, 0.25)
}

.no-ferry-alert .nearest-date:hover {
    background: var(--orange);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(255, 107, 0, 0.3)
}

.no-ferry-alert .nearest-date i {
    font-size: 16px
}

.no-ferry-alert .nearest-date span {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.3
}

.no-ferry-alert .nearest-date span small {
    font-size: 11px;
    opacity: .85;
    font-weight: 400
}

.search-banner {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 0 20px;
    margin-bottom: 15px
}

.search-banner a {
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    position: relative;
    margin: 0 30px;
    display: flex;
    align-items: center;
    opacity: .5;
    text-decoration: none;
    transition: all .3s;
    cursor: default
}

.search-banner a span {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    background: rgba(255, 255, 255, .2);
    border-radius: 50%;
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    transition: all .3s
}

.search-banner a.active {
    opacity: 1
}

.search-banner a.active span {
    background: var(--orange);
    color: #fff;
    box-shadow: 0 4px 12px rgba(255, 107, 0, 0.4)
}

.search-banner a.completed {
    opacity: 1
}

.search-banner a.completed span {
    background: #4caf50;
    color: #fff
}

.search-banner a:after {
    width: 50px;
    height: 2px;
    position: absolute;
    content: "";
    left: calc(100% + 5px);
    display: block;
    background: rgba(255, 255, 255, .25);
    border-radius: 2px
}

.search-banner a:last-child:after {
    display: none
}