.animate-switch-container {
    position: relative;
    background: white;
    overflow: hidden;
}

.personal-information h1 {
    text-align: center;
    color: white;
    background: #0095ff;
}

.btn-pay {
    margin: 10px 0px 0 0px !important;
    height: 50px !important;
    font-size: 25px;
}

.text-white {
    color: white;
}

.animate-switch {
    padding: 0;
}

.m-b-50 {
    margin-bottom: 50px !important;
}

.m-t-50 {
    margin-top: 50px !important;
}

.m-t-30 {
    margin-top: 30px !important;
}

.m-b-30 {
    margin-bottom: 30px !important;
}

.animate-switch.ng-animate {
    transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.mp-form-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: start;
    align-items: stretch;
}

input.ng-dirty.ng-invalid {
    background: #decaca;
    border-color: red;
}

.mp-logos,
.mp-forms :not(.country-list, .selected-dial-code) {
    min-width: 100px;
    padding: 10px;
}

.mp-forms {
    background-color: #2b2525;
    width: 400px;
    flex-grow: 1;
    flex-shrink: 0;
}

.mp-forms label {
    color: white;
}

.mp-forms .row {
    margin: 0 !important;
}

.mp-logos {
    background-color: #fff;
    line-height: 20px;
    font-size: 14px;
    flex-grow: 4;
    display: flex;
    align-items: stretch;
    justify-content: stretch;
}

.mp-logos img {
    height: 100px;
    flex-grow: 1;
}

.form-header h4 {
    margin: 0 0 10px 0;
}

.guvenlik-uyarisi {
    flex-grow: 4;
    text-align: end;
    padding: 20px 0px;
}

.cogs-container {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.padd-left-0 {
    padding-left: 0px;
}

.machine {
    width: 15vmin;
    fill: var(--primary-color);
}

.small-shadow,
.medium-shadow,
.large-shadow {
    fill: rgba(0, 0, 0, 0.05);
}

.small {
    -webkit-animation: counter-rotation 2.5s infinite linear;
    -moz-animation: counter-rotation 2.5s infinite linear;
    -o-animation: counter-rotation 2.5s infinite linear;
    animation: counter-rotation 2.5s infinite linear;
    -webkit-transform-origin: 100.136px 225.345px;
    -ms-transform-origin: 100.136px 225.345px;
    transform-origin: 100.136px 225.345px;
}

.small-shadow {
    -webkit-animation: counter-rotation 2.5s infinite linear;
    -moz-animation: counter-rotation 2.5s infinite linear;
    -o-animation: counter-rotation 2.5s infinite linear;
    animation: counter-rotation 2.5s infinite linear;
    -webkit-transform-origin: 110.136px 235.345px;
    -ms-transform-origin: 110.136px 235.345px;
    transform-origin: 110.136px 235.345px;
}

.medium {
    -webkit-animation: rotation 3.75s infinite linear;
    -moz-animation: rotation 3.75s infinite linear;
    -o-animation: rotation 3.75s infinite linear;
    animation: rotation 3.75s infinite linear;
    -webkit-transform-origin: 254.675px 379.447px;
    -ms-transform-origin: 254.675px 379.447px;
    transform-origin: 254.675px 379.447px;
}

.medium-shadow {
    -webkit-animation: rotation 3.75s infinite linear;
    -moz-animation: rotation 3.75s infinite linear;
    -o-animation: rotation 3.75s infinite linear;
    animation: rotation 3.75s infinite linear;
    -webkit-transform-origin: 264.675px 389.447px;
    -ms-transform-origin: 264.675px 389.447px;
    transform-origin: 264.675px 389.447px;
}

.large {
    -webkit-animation: counter-rotation 5s infinite linear;
    -moz-animation: counter-rotation 5s infinite linear;
    -o-animation: counter-rotation 5s infinite linear;
    animation: counter-rotation 5s infinite linear;
    -webkit-transform-origin: 461.37px 173.694px;
    -ms-transform-origin: 461.37px 173.694px;
    transform-origin: 461.37px 173.694px;
}

.large-shadow {
    -webkit-animation: counter-rotation 5s infinite linear;
    -moz-animation: counter-rotation 5s infinite linear;
    -o-animation: counter-rotation 5s infinite linear;
    animation: counter-rotation 5s infinite linear;
    -webkit-transform-origin: 471.37px 183.694px;
    -ms-transform-origin: 471.37px 183.694px;
    transform-origin: 471.37px 183.694px;
}

@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(359deg);
    }
}

@-moz-keyframes rotation {
    from {
        -moz-transform: rotate(0deg);
    }

    to {
        -moz-transform: rotate(359deg);
    }
}

@-o-keyframes rotation {
    from {
        -o-transform: rotate(0deg);
    }

    to {
        -o-transform: rotate(359deg);
    }
}

@keyframes rotation {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(359deg);
    }
}

@-webkit-keyframes counter-rotation {
    from {
        -webkit-transform: rotate(359deg);
    }

    to {
        -webkit-transform: rotate(0deg);
    }
}

@-moz-keyframes counter-rotation {
    from {
        -moz-transform: rotate(359deg);
    }

    to {
        -moz-transform: rotate(0deg);
    }
}

@-o-keyframes counter-rotation {
    from {
        -o-transform: rotate(359deg);
    }

    to {
        -o-transform: rotate(0deg);
    }
}

@keyframes counter-rotation {
    from {
        transform: rotate(359deg);
    }

    to {
        transform: rotate(0deg);
    }
}

.animate-switch.ng-leave.ng-leave-active,
.animate-switch.ng-enter {
    top: -50px;
}

.animate-switch.ng-leave,
.animate-switch.ng-enter.ng-enter-active {
    top: 0;
}

/* left menu */
.static-content {
    margin-bottom: 50px;
}

.static-content-wrapper {
    margin-left: 250px;
    left: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    background-color: #eff3f6 !important;
    display: block;
    height: 100%;
}

.static-content-wrapper.triggerContent {
    margin-left: 60px;
    left: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.home-page-logo {
    height: 48px;
    padding: 10px;
}

.triggerProfil {
    display: none;
    opacity: 0;
}

.triggerModal {
    right: -320px;
}

body.infobar-offcanvas.infobar-active #wrapper,
body.infobar-offcanvas.infobar-active>header {
    -webkit-transform: translate(0, 0) !important;
    -ms-transform: translate(0, 0) !important;
    -o-transform: translate(0, 0) !important;
    transform: translate(0, 0) !important;
}

#topnav.navbar-midnightblue {
    background-color: #269cf3 !important;
    border-color: #269cf3 !important;
}

#topnav .toolbar-trigger a {
    padding: 8px 14px !important;
}

#topnav.navbar-midnightblue .navbar-nav>li>a,
#topnav.navbar-midnightblue .toolbar-trigger a,
.sidebar-midnightblue nav.widget-body>ul.acc-menu li a {
    color: #fff !important;
}

.static-sidebar>.sidebar {
    margin-right: 0 !important;
}

#topnav.navbar-midnightblue .navbar-nav>li>a.user-lapis {
    background-color: #455a64;
}

#topnav.navbar-midnightblue .toolbar-icon-bg>a.user-lapis:hover,
#topnav.navbar-midnightblue .toolbar-icon-bg>a.user-lapis:focus {
    background-color: #37474f !important;
}

#topnav.navbar-midnightblue .toolbar-icon-bg>a:focus {
    background-color: transparent !important;
}

#topnav #trigger-sidebar a {
    margin-left: 0;
}

#topnav #trigger-sidebar a.triggerA {
    margin-left: 15px;
}

#topnav.navbar-midnightblue span.user-bg a {
    background-color: #1a81ce;
    width: 100%;
}

#topnav .toolbar.pull-right li.toolbar-icon-bg>a span.icon-bg-link {
    width: 100px;
    display: inline-block;
    vertical-align: sub;
}

#topnav .toolbar.pull-right li.toolbar-icon-bg>a span.icon-bg-link p {
    display: inline-block;
    color: #fff;
    font-size: 14px;
    position: relative;
    margin-left: 2px;
    margin: 6px 0;
}

#topnav .toolbar.pull-right li.toolbar-icon-bg>span.toolbar-trigger>a span.icon-bg-img {
    display: block;
    border-radius: 2px;
    padding: 4px;
    font-size: 15px;
    text-align: center;
    height: 32px;
}

#topnav .toolbar.pull-right li.toolbar-icon-bg>span.toolbar-trigger>a span.icon-bg-img img {
    width: 26px;
    border-radius: 50%;
}

#topnav.navbar-midnightblue.navbar .navbar-collapse .open .dropdown-menu li a {
    color: #fff;
}

#topnav.navbar-midnightblue .toolbar-trigger a span.icon-bg:hover,
#topnav.navbar-midnightblue .toolbar-trigger a span.icon-bg {
    background-color: transparent !important;
}

#topnav .toolbar.pull-right li.toolbar-icon-bg>span.toolbar-trigger>a span.icon-bg-img p {
    display: inline-block;
    color: #fff;
    font-size: 14px;
    position: relative;
    margin-left: 2px;
}

#topnav .toolbar.pull-right li.toolbar-icon-bg>span.toolbar-trigger>a span.icon-bg-img p span {
    display: inline-block;
    color: #fff;
    font-size: 14px;
    position: relative;
    margin-left: 10px;
}

#topnav .toolbar.pull-right li.toolbar-icon-bg>span.toolbar-trigger>a span.icon-bg-img p span::before {
    content: '';
    display: inline;
    border-left: 1px solid #fff;
    padding: 0 4px;
}

#topnav .navbar-brand {
    background-position: 5px 5px !important;
    width: 177px;
}

#topnav .toolbar .dropdown-menu.dropdown-alternate {
    width: 260px !important;
}

#topnav .toolbar .dropdown-menu.dropdown-alternate .scrollthis {
    width: 260px !important;
}

#topnav .toolbar .dropdown-menu.messages ul li a,
#topnav .toolbar .dropdown-menu .tab-pane.messages ul li a {
    padding: 16px 25px 16px 25px !important;
}

.sidebar-midnightblue.static-sidebar-wrapper {
    background: #1d2530 !important;
    position: fixed;
    top: 48px;
    left: 0;
    width: 250px;
    margin-left: 0;
    bottom: 0;
    z-index: 100;
    border: none;
    box-shadow: 0 28px 28px rgba(0, 0, 0, 0.07);
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.sidebar-midnightblue .sidebar .widget .widget-body {
    color: #90a4ae;
    background: #1d2530;
}

.sidebar-midnightblue nav.widget-body>ul.acc-menu li a {
    color: #90a4ae;
    background: #1d2530;
}

.sidebar nav.widget-body>ul.acc-menu li.active>a {
    color: #fff !important;
    font-weight: inherit !important;
}

.sidebar-midnightblue nav.widget-body>ul.acc-menu>li.active>a {
    background: transparent !important;
    color: #ffffff;
}

.sidebar-midnightblue nav.widget-body>ul.acc-menu>li.active>a:hover {
    background-color: #455a64 !important;
    color: #cfd8dc;
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge {
    display: inline-block;
    min-width: 10px;
    padding: 0 2px;
    font-size: 11px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.5;
    vertical-align: baseline;
    white-space: nowrap;
    text-align: center;
    background-color: #90a4ae;
    border-radius: 50%;
    margin-left: 0px;
    margin-right: 15px;
}

.sidebar nav.widget-body>ul.acc-menu span.nav-badge-text {
    display: inline-block;
    font-size: 1em;
    vertical-align: top;
    font-weight: 600;
    padding-top: 10px;
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge i {
    font-size: 15px;
    margin: 7px;
}

.badge-message {
    background-color: #f44336 !important;
}

.badge-shopping {
    background-color: #ff512f !important;
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge.nav-badge-home {
    background-color: #f266c9;
    background: radial-gradient(#ff9abd, #f266c9);
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge.nav-badge-program {
    background-color: #1991eb;
    background: radial-gradient(#34befd, #1991eb);
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge.nav-badge-measure {
    background-color: #7f5be6;
    background: radial-gradient(#b5a2e8, #7f5be6);
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge.nav-badge-reservation {
    background-color: #f45438;
    background: radial-gradient(#fb9b8a, #f45438);
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge.nav-badge-membership {
    background-color: #da932c;
    background: radial-gradient(#d8b88a, #da932c);
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge.nav-badge-studio-lesson {
    background-color: #39b54a;
    background: radial-gradient(#8fda99, #39b54a);
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge.nav-badge-new-sale {
    background-color: #f4be3c;
    background: radial-gradient(#f9db96, #f4be3c);
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge.nav-badge-branch-booking {
    background-color: #38c1f4;
    background: radial-gradient(#74d3f7, #38c1f4);
}

.sidebar nav.widget-body>ul.acc-menu .nav-badge.nav-badge-sign-out {
    background-color: #af4d12;
    background: radial-gradient(#ad6d46, #af4d12);
}

.dinamic-page-wrapper {
    margin-top: 24px;
}

.infobar-wrapper {
    height: 100% !important;
    top: 48px !important;
    width: 267px !important;
}

.infobar .lp-card {
    background-color: #fff;
    border-radius: 2px;
    position: relative;
    height: calc(100vh - 48px);
}

.infobar .lp-card .lp-card-header-color {
    color: #fff !important;
    color: #fff !important;
    background: url(../img/userBackground.jpg) center center no-repeat;
    height: 100px;
    background-size: cover;
}

.infobar .lp-card .lp-card-header-color .lp-card-header-top {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}

.infobar .lp-card .lp-card-header-color .lp-card-header-top .lp-user-icon {
    justify-content: center;
    padding: 0px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    height: 35px !important;
    width: 40px !important;
    line-height: 30px;
    margin-left: auto !important;
}

.infobar .lp-card .lp-card-header-top .lp-user-icon i:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.infobar .lp-card .lp-card-header-color .lp-card-header-top .lp-user-icon i {
    position: relative;
    color: inherit;
    display: block;
    transition: all 0.4s ease;
    float: right;
    background-color: #fff;
    padding: 15px;
    border-bottom-left-radius: 75%;
}

.infobar .lp-card .lp-card-header-color img.lp-img {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.5);
    height: 100px !important;
    width: 100px !important;
    line-height: 100px;
    border-radius: 50% !important;
    margin-bottom: 1rem !important;
}

.infobar .lp-card .lp-card-body .lp-card-user h4,
.infobar .lp-card .lp-card-body .lp-card-user p {
    color: #303030 !important;
    margin-bottom: 0 !important;
    text-align: center;
}

.infobar .lp-card .lp-card-body {
    background-color: #fff;
    color: #263238 !important;
    padding: 20px;
}

.infobar .lp-card .lp-card-user {
    padding: 15px 0;
    border-bottom: 1px solid #e0e0e0;
    margin: 0 -20px;
}

.infobar .lp-card .lp-card-content {
    padding-top: 15px;
}

.infobar .lp-card .lp-card-body .lp-body-line {
    padding-bottom: 5px;
}

.infobar .lp-card .lp-card-body .lp-body-line h3 {
    font-size: 12px;
    text-transform: capitalize;
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
    font-weight: 600;
    color: #303030;
}

.infobar .lp-card .lp-card-body .lp-body-line p {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
    color: #455a64;
}

.infobar .lp-card .lp-card-content .purse p {
    color: #269cf3;
    font-weight: 700;
    font-size: 14px;
}

.infobar .lp-card .lp-card-link {
    background-color: #269cf3;
    border-color: #269cf3;
    color: #fff;
    padding: 8px 15px;
    position: relative;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    text-transform: capitalize;
    line-height: 1.2;
    border-radius: 2px;
    vertical-align: top;
    cursor: pointer;
    text-align: center;
}

.infobar .lp-card .lp-card-link:hover {
    background-color: #008ff9;
    border-color: #008ff9;
    color: #fff;
}

.page-heading {
    background: #fff;
    padding: 4px 24px !important;
    margin: 0 -12px 0;
}

.page-heading h1 {
    float: left;
    margin: 0;
    line-height: 32px;
    font-weight: 500;
    font-size: 16px;
}

.kiosk-scroll::-webkit-scrollbar {
    width: 25px;
}

.kiosk-scroll::-webkit-scrollbar-track {
    background: #4d84f1;
    border-left: 10px solid #ffffff;
    border-right: 10px solid #ffffff;
}

.kiosk-scroll::-webkit-scrollbar-thumb {
    background: #303030;
    border-left: 5px solid #ffffff;
    border-right: 5px solid #ffffff;
}

.page-top {
    background: #e1eef7;
    padding: 18px 0 !important;
    margin: 0 -12px 0;
}

.page-top .options {
    float: right;
}

.page-top .personel-training {
    display: flex;
    align-items: flex-start;
}

.page-top .personel-training .personel-media {
    padding-right: 20px !important;
}

.page-top .personel-training .personel-media img {
    width: 64px !important;
    height: 64px !important;
}

.page-top .personel-training .personel-body {
    flex: 1;
}

.page-top .personel-training .personel-body .form-control[disabled] {
    background-color: #fff;
    border: 1px solid #fff;
    border-top: 1px solid #fff;
    box-shadow: none !important;
}

.page-top .personel-training .personel-body p {
    display: inline-block;
}

.page-top .personel-description h4 {
    font-weight: bold;
    margin: 5px 0;
    font-size: 14px;
    display: inline-block;
    margin-right: 10px;
}

.page-top .personel-description p {
    display: inline-block;
}

.page-top-fluid {
    padding: 10px 0 !important;
    margin: 0 -20px 0;
}

.rezervasyon-top {
    margin: 0 -12px 0;
    background: #e1eef7;
    padding: 12px 0px;
}

.rezervasyon-top .rezervasyon-date {
    width: fit-content;
    display: inline-block;
}

.rezervasyon-top .rezervasyon-date .input-date {
    display: flex;
    background-color: transparent;
}

.rezervasyon-top .rezervasyon-date .input-date a {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    border: none;
    cursor: pointer;
    font-size: 18px;
    width: 30px;
    padding: 2px 8px;
}

.rezervasyon-top .rezervasyon-date .input-date a:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}

.rezervasyon-top .rezervasyon-date .input-date a:last-child {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}

.rezervasyon-top .rezervasyon-date .input-date a[disabled] {
    cursor: not-allowed;
    opacity: 0.4;
}

.rezervasyon-top .rezervasyon-date .input-date a i {
    color: #37474f;
    transition: 0.25s linear;
}

.rezervasyon-top .rezervasyon-date .input-date a i:hover {
    color: #07c;
}

.rezervasyon-top .rezervasyon-date .input-date input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    font-size: 18px;
    text-align: center;
    width: fit-content;
    background-color: #fff;
    color: #37474f;
    line-height: 26px;
}

.rezervasyon-top .rezervasyon-text {
    width: fit-content;
    display: table-caption;
}

.rezervasyon-top .rezervasyon-text p {
    color: #fff;
    font-weight: 600;
    margin: 0 0 5px;
    white-space: nowrap;
}

.program-card {
    position: relative;
    margin-bottom: 10px;
    background-color: #ffffff;
    color: #313534;
    border-radius: 2px;
    margin-left: 1px;
    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
}

.program-card .p-card-body {
    position: relative;
    padding: 5px 10px;
}

.p-card-body:before {
    content: '';
    position: absolute;
    display: block;
    width: 4px;
    left: 0;
    top: -1px;
    bottom: -1px;
    background: #8f77e5;
}

.program-card .p-card-body table {
    margin-bottom: 0;
}

.program-card .table>thead>tr>th {
    border-bottom: 0 solid transparent;
    width: 50px;
}

.program-card .table>thead>tr>th:first-child {
    width: 100px;
}

.program-card .table>tbody>tr:first-child>td {
    width: 160px;
}

.program-footer {
    padding: 24px 0;
    display: inline-block;
}

ul.bottom-fixed {
    position: fixed;
    bottom: 40px;
    background-color: #f8f8f8;
    width: calc(100% - 297px);
    padding: 15px;
}

ul.bottom-tab {
    position: fixed;
    bottom: 40px;
    background-color: #f8f8f8;
    width: calc(100% - 297px);
    padding: 15px;
}

ul.rhm {
    float: right;
    position: relative;
}

ul.rhm li {
    position: relative;
    display: block;
    float: left;
    margin-right: 10px;
}

ul.rhm li a {
    color: #fff !important;
    background: #7c8ca5 !important;
    margin-top: 0px;
    font-weight: bold;
    border-radius: 5px;
    border-bottom: 0px solid #fff !important;
    padding: 9px 16px;
    position: relative;
    display: block;
}

ul.rhm li a:hover {
    background-color: #919bab !important;
}

.modal-header {
    background-color: #303030;
    border-bottom: 0 solid transparent !important;
}

.modal-date {
    background-color: #e1eef7;
    padding: 20px;
}

.modal-date p {
    margin: 5px 0;
    font-size: 14px;
    font-weight: 600;
}

.modal-header .modal-title {
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    margin: 0;
    line-height: 1.54;
}

.close {
    color: #fff !important;
    text-shadow: 0 1px 0 #ffffff !important;
    opacity: 1 !important;
}

.tab-lp.tab-container>.nav-tabs>li.active>a {
    color: #263238 !important;
    background: #fff;
    padding: 20px 40px;
    margin-top: 0px;
    font-weight: bold;
}

.tab-lp.tab-container>.nav.nav-tabs>li>a {
    border: 0 solid #eff3f6;
}

.tab-lp.tab-container>.nav-tabs>li>a {
    color: #969ba1 !important;
    background: #fafbfd;
    margin-top: 22px;
    font-weight: bold;
}

.tab-lp.tab-container .tab-content {
    border: 0 solid #eff3f6;
    padding-bottom: 80px;
    padding-left: 0;
    padding-right: 0;
}

.tab-lp.tab-container img.lp-img {
    height: 125px !important;
    width: 125px !important;
    line-height: 100px;
    border-radius: 50% !important;
    margin-bottom: 1rem !important;
}

.tab-lp.tab-container .tab-footer {
    padding: 0 0 16px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border-top: 0;
    background-color: #eff3f6;
    position: fixed;
    bottom: 32px;
    width: 100%;
    z-index: 9;
}

.tab-lp.tab-container .tab-footer h5 {
    display: block;
}

.page-footer {
    padding: 0 0 16px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border-top: 0;
    background-color: #eff3f6;
    position: fixed;
    bottom: 32px;
    width: 100%;
    z-index: 9;
}

/* tab-basket */

.tab-basket.tab-container>.nav-tabs>li.active>a {
    color: #263238 !important;
    background: #fff;
    padding: 20px 40px;
    margin-top: 0px;
    font-weight: bold;
}

.tab-basket.tab-container>.nav.nav-tabs>li>a {
    border: 0 solid #eff3f6;
}

.tab-basket.tab-container>.nav-tabs>li>a {
    color: #969ba1 !important;
    background: #fafbfd;
    margin-top: 22px;
    font-weight: bold;
}

.tab-basket.tab-container .tab-content {
    border: 0 solid #eff3f6;
}

.tab-basket.tab-container img.lp-img {
    height: 125px !important;
    width: 125px !important;
    line-height: 100px;
    border-radius: 50% !important;
    margin-bottom: 1rem !important;
}

.tab-basket.tab-container .tab-footer {
    padding: 0 0 16px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border-top: 0;
    background-color: #eff3f6;
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 9;
}

.tab-basket.tab-container .tab-footer h5 {
    display: block;
}

/* tab-pro */

.tab-pro.tab-container>.nav.nav-tabs {
    padding-bottom: 20px;
    display: inline-block;
}

.tab-pro.tab-container>.nav-tabs>li {
    margin-right: 10px;
}

.tab-pro.tab-container>.nav-tabs>li.active>a {
    color: #fff !important;
    background: #f96b67 !important;
    margin-top: 0px;
    font-weight: bold;
    border-radius: 5px;
    border-bottom: 0px solid #fff !important;
}

.tab-pro.tab-container>.nav.nav-tabs>li>a {
    border: 0 solid #eff3f6;
}

.tab-pro.tab-container>.nav-tabs>li>a {
    color: #969ba1;
    background: #fafbfd;
    font-weight: bold;
    border-radius: 5px;
}

.tab-pro.tab-container .tab-content {
    border: 0 solid #eff3f6 !important;
    background-color: transparent;
    padding: 0;
    padding-bottom: 30px;
}

.tab-pro.tab-container .tab-footer {
    padding: 20px 0 20px 3px;
    border-top: 0;
    background-color: #eff3f6;
    position: fixed;
    width: 100%;
    bottom: 32px;
    z-index: 1;
    margin: 0 -2px;
}

.tab-pro.tab-container .tab-footer h5 {
    display: block;
    padding-bottom: 10px;
}

.tab-pro.tab-container .tab-footer .nav-tabs {
    border-bottom: 1px solid #eff3f6;
}

.tab-pro.tab-container .tab-footer .nav-tabs>li.active>a {
    background-color: #f96b67;
    color: #fff !important;
    cursor: default;
    border: 1px solid #f96b67;
}

.tab-pro.tab-container .tab-footer .nav-tabs>li>a {
    padding: 5px 10px;
    line-height: 1.54;
    text-decoration: none;
    color: #fff;
    background-color: #8192a6;
    border: 1px solid #8192a6;
    margin-left: 0;
}

.tab-pro.tab-container .tab-footer>.footer-fixed {
    border-bottom: 0 solid transparent;
}

.day.tab-default.tab-container.tab-bottom>.tab-footer {
    padding: 20px 25px;
    margin: 0 -24px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border-top: 0;
    background-color: #f8f8f8;
    position: fixed;
    width: 100%;
    bottom: 0;
    z-index: 1;
}

.page-fixed {
    position: fixed;
    z-index: 9;
}

.page-fixed .button-fixed {
    position: fixed;
    right: 30px;
}

/* tab-rez */

.tab-rez.tab-container>.nav.nav-tabs {
    display: inline-block;
}

.tab-rez.tab-container>.nav-tabs>li {
    margin-right: 10px;
}

.tab-rez.tab-container>.nav-tabs>li.active>a {
    color: #fff !important;
    background: #f96b67 !important;
    margin-top: 0px;
    font-weight: bold;
    border-radius: 5px;
    border-bottom: 0px solid #fff !important;
}

.tab-rez.tab-container>.nav.nav-tabs>li>a {
    border: 0 solid #eff3f6;
}

.tab-rez.tab-container>.nav-tabs>li>a {
    color: #969ba1;
    background: #fafbfd;
    font-weight: bold;
    border-radius: 5px;
}

.tab-rez.tab-container .tab-content {
    border: 0 solid #eff3f6;
    background-color: #fff;
    padding: 20px 0;
    margin-top: 20px;
}

.tab-rez.tab-container .tab-footer {
    padding: 24px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border-top: 0;
    background-color: #f8f8f8;
}

.tab-rez.tab-container .tab-footer h5 {
    display: block;
    padding-bottom: 10px;
}

/* tab-studyo */

.tab-studyo.tab-container>.nav.nav-tabs {
    display: inline-block;
}

.tab-studyo.tab-container>.nav-tabs>li {
    margin-right: -5px;
}

.tab-studyo.tab-container>.nav-tabs>li.active>a {
    color: #fff !important;
    background: #2088e0 !important;
    margin-top: 0px;
    font-weight: bold;
    border-radius: 5px;
    border-bottom: 0px solid #fff !important;
}

.tab-studyo.tab-container>.nav.nav-tabs>li>a {
    border: 0 solid #eff3f6;
}

.tab-studyo.tab-container>.nav-tabs>li>a {
    color: #cfd8dc !important;
    background: #6598c7 !important;
    font-weight: bold;
    border-radius: 5px;
}

.tab-studyo.tab-container .tab-content {
    border: 0 solid #eff3f6;
    background-color: transparent;
    padding: 0;
}

.tab-studyo.tab-container .tab-footer {
    padding: 24px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border-top: 0;
    background-color: #f8f8f8;
}

.tab-studyo.tab-container .tab-footer h5 {
    display: block;
    padding-bottom: 10px;
}

.mt-50 {
    margin-top: 50px !important;
}

.py-50 {
    padding: 50px 0;
}

.px20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.pb-10 {
    padding-bottom: 10px !important;
}

/* custom select */

/* btn-lp */

.btn-full {
    width: 100% !important;
}

.btn-lp {
    margin: 0 auto;
    font-size: 13px;
    padding: 5px 10px;
    display: inline-block;
    text-align: center;
    background-color: #009ac9;
    border: 1px solid transparent;
    color: #ffffff;
    font-weight: 500;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.btn-lp:hover {
    background-color: #ffffff;
    color: #009ac9;
    border-color: #009ac9;
}

.btn-ext {
    position: absolute;
    top: 0;
    right: 0;
    width: 100px;
    height: 32px;
    line-height: 32px;
    padding: 0;
}

.btn-lp.extra {
    color: #fff;
    background-color: #353535;
    border-color: #353535;
}

.btn-lp.extra:hover {
    color: #353535;
    background-color: #fff;
    border-color: #353535;
}

.btn-lp.login {
    color: #fff;
    background-color: #1f5480;
    border-color: #1f5480;
}

.btn-lp.login:hover {
    color: #1f5480;
    background-color: #fff;
    border-color: #1f5480;
}

.btn-lp.login-line {
    color: #fff;
    background-color: transparent;
    border-color: transparent;
}

.btn-lp.login-line:hover {
    color: #fff;
    background-color: transparent;
    border-color: #fff;
}

.btn-lp.export {
    color: #fff;
    background-color: #2ba1f8;
    border-color: #2ba1f8;
}

.btn-lp.export:hover {
    color: #0384e4 !important;
    background-color: #fff;
    border-color: #0384e4;
}

.btn-lp.user-save {
    border-color: #4fe1c4;
    background-color: #4fe1c4;
    color: #fff !important;
}

.btn-lp.user-save:hover {
    border-color: #4fe1c4;
    background-color: #fff;
    color: #4fe1c4 !important;
}

.btn-lp.program-active {
    border-color: #f96b67;
    background-color: #f96b67;
    color: #fff !important;
}

.btn-lp.program-active:hover {
    border-color: #f96b67;
    background-color: #fff;
    color: #f96b67 !important;
}

.btn-lp.program-default {
    border-color: #8192a6;
    background-color: #8192a6;
    color: #fff !important;
}

.btn-lp.program-default:hover {
    border-color: #8192a6;
    background-color: #fff;
    color: #8192a6 !important;
}

.btn-lp.geri {
    border-color: #8192a6 !important;
    background-color: #8192a6 !important;
    color: #fff !important;
}

.btn-lp.geri:hover {
    border-color: #8192a6 !important;
    background-color: #fff !important;
    color: #8192a6 !important;
}

.btn-lp.onayla {
    color: #fff !important;
    background-color: #48b754 !important;
    border-color: #48b754 !important;
}

.btn-lp.onayla:hover {
    color: #48b754 !important;
    background-color: #fff !important;
    border-color: #48b754 !important;
}

.btn-lp.credit-load {
    color: #fff;
    background-color: #48b754;
    border-color: #48b754;
}

.btn-lp.credit-load:hover {
    color: #48b754;
    background-color: #fff;
    border-color: #48b754;
}

.btn-lp.edit {
    color: #fff !important;
    background-color: #1e96ed;
    border-color: #1e96ed;
}

.btn-lp.edit:hover {
    color: #1e96ed !important;
    background-color: #fff;
    border-color: #1e96ed;
}

.btn-lp.cancel {
    color: #fff !important;
    background-color: #f15235;
    border-color: #f15235;
}

.btn-lp.cancel:hover {
    color: #f15235 !important;
    background-color: #fff;
    border-color: #f15235;
}

.btn-lp.save {
    color: #fff !important;
    background-color: #37b046;
    border-color: #37b046;
}

.btn-lp.save:hover {
    color: #37b046 !important;
    background-color: #fff;
    border-color: #37b046;
}

.btn-lp.grey {
    color: #fff !important;
    background-color: #7c8ca5 !important;
    border-color: #7c8ca5 !important;
}

.btn-lp.grey:hover {
    color: #7c8ca5 !important;
    background-color: #fff !important;
    border-color: #fff !important;
}

.btn-lp.trans {
    color: #1e96ed !important;
    background-color: transparent;
    border-color: #1e96ed !important;
}

.btn-lp.trans:hover {
    color: #fff !important;
    background-color: #1e96ed;
    border-color: transparent;
}

.btn-lp.line {
    color: #303030 !important;
    background-color: transparent !important;
    border-color: transparent !important;
}

.btn-lp.line:hover {
    color: #1e96ed !important;
    background-color: #fff !important;
    border-color: #1e96ed !important;
}

.btn-lp.nan {
    color: #fff;
    background-color: #c1c1c1;
    border-color: #c1c1c1;
}

.btn-lp.nan:hover {
    cursor: not-allowed;
}

.btn-lp.rezerveEt {
    color: #fff !important;
    background-color: #37b046 !important;
    border-color: #37b046 !important;
}

.btn-lp.rezerveEt:hover {
    color: #37b046 !important;
    background-color: #fff !important;
    border-color: #37b046 !important;
}

.btn-lp.rezervasyonlarim {
    border-color: #f96b67 !important;
    background-color: #f96b67 !important;
    color: #fff !important;
}

.btn-lp.rezervasyonlarim:hover {
    border-color: #f96b67 !important;
    background-color: #fff !important;
    color: #f96b67 !important;
}

.btn-lp.haftalik {
    color: #303030 !important;
    background-color: transparent !important;
    border-color: #d76b26 !important;
    font-weight: 600;
    border-radius: 0;
}

.btn-lp.haftalik:hover {
    color: #fff !important;
    background-color: #d76b26 !important;
    border-color: #d76b26 !important;
}

.btn-lp.next-step {
    color: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    padding: 20px 8px;
}

.btn-lp.next-step:hover {
    color: #fff !important;
    background-color: #51c57e !important;
    border-color: transparent !important;
    border-radius: 50%;
}

.btn-lp.info {
    color: #1e96ed !important;
    background-color: #fff;
    border-color: #fff;
}

.btn-lp.info:hover {
    color: #1e96ed !important;
    background-color: transparent;
    border-color: #1e96ed;
}

.coupon-form input.form-control {
    padding-right: 30%;
}

.coupon-form input.form-control:focus {
    border: 1px solid #353535 !important;
    background: #fff;
    box-shadow: 0 0px 1px 0px #c5ecfe !important;
}

.coupon-form input:focus+.input-icon>i {
    color: #353535;
    transition: 0.25s linear;
}

button.change-trainer::before {
    content: '';
    background: url(../../assets/img/iconlar/studyo_ders.png) no-repeat;
}

/* pagination-lp */

.pagination-lp {
    padding: 20px 0 36px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border-top: 0;
    background-color: #f8f8f8;
    position: fixed;
    bottom: 0;
    width: calc(100% - 295px);
    margin: 0 !important;
}

.pagination-lp.pagination>li>a,
.pagination-lp.pagination>li>span {
    position: relative;
    float: left;
    padding: 5px 10px;
    line-height: 1.54;
    text-decoration: none;
    color: #fff;
    background-color: #8192a6;
    border: 1px solid #e0e0e0;
    margin-left: -1px;
}

.pagination-lp.pagination>.active>a,
.pagination-lp.pagination>.active>span,
.pagination-lp.pagination>.active>a:hover,
.pagination-lp.pagination>.active>span:hover,
.pagination-lp.pagination>.active>a:focus,
.pagination-lp.pagination>.active>span:focus {
    z-index: 2;
    border-color: #f96b67;
    background-color: #f96b67;
    color: #fff !important;
    cursor: default;
}

.pagination-lp.pagination>li>a:hover,
.pagination-lp.pagination>li>span:hover {
    border-color: #8192a6;
    background-color: #fff;
    color: #8192a6 !important;
}

.f-bold {
    font-weight: bold;
}

.lp-md {
    padding: 5px 10px;
    line-height: 1.33;
    font-size: 12px;
}

.no-pad {
    padding: 0 !important;
}

.modal {
    text-align: center;
    padding: 0 !important;
}

.-modal:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px;
}

.modal-dialog {
    text-align: left;
    vertical-align: middle;
}

/*

.rezervasyonYap .modal-body {
    overflow: overlay;
    height: 450px;
}

.rezervasyonYap table tbody td a i.rzv-radius-i {
    color: #fff;
    background-color: #37b046;
    padding: 10px;
    border-radius: 50px;
    transition: 0.25s linear;
}
.rezervasyonYap table {
    position: static;
}

.rezervasyonYap table tbody td a i.rzv-radius-i:hover {
    background-color: #303030;
}

.rezervasyonYap table tbody tr td:last-child {
    text-align: center;
}

.rezervasyonYap .remain-table {
    background-color: #daf0ff;
    padding: 13px;
    border-radius: 5px;
    margin-bottom: 20px;
    box-shadow: 0px 0px 25px 0px rgba(50, 50, 50, 0.37);
}

.rezervasyonYap .remain-table table > thead > tr > th:nth-child(3),
.rezervasyonYap .remain-table table > tbody > tr > td:nth-child(3) {
    text-align: center;
}

.rezervasyonYap .table > thead > tr > th {
    border-bottom: 1px solid #90a4ae;
}

.rezervasyonYap .ucretsiz-servisler {
    padding: 13px;
}

.ucretsiz-servisler table > tbody > tr > td:last-child,
.ucretsiz-servisler table > thead > tr > th:last-child,
.remain-table table > tbody > tr > td:last-child,
.remain-table table > thead > tr > th:last-child {
    text-align: right;
}

*/

/* donut charts */

.donut-legend,
#donut-example {
    text-align: center;
}

.donut-legend span {
    display: block;
    border-bottom: 1px solid #cfd8dc;
}

.calendar-btn {
    float: right;
    width: 330px;
}

.calendar-btn a {
    color: #000;
    transition: all 0.5s;
    background-color: #cfd8dc;
    border-color: #269cf3;
    font-weight: 400;
    text-transform: capitalize;
    line-height: 1.2;
    border-radius: 2px;
    padding: 8px 10px;
}

.calendar-btn>.rezerve {
    color: #fff !important;
    background-color: #f15235;
}

.calendar-btn>.buy {
    color: #fff !important;
    background-color: #38b64a;
}

.charts-box {
    border: 1px solid #90a4ae;
    border-radius: 5px;
}

/* area charts */

.area-charts {
    display: block;
    width: 100%;
    height: 350px;
    position: relative;
}

.label {
    height: 16px;
    padding: 0.3em;
    background: #303030;
    position: absolute;
    display: none;
    color: #333;
}

/* donut charts */

.donut-top {
    display: block;
    height: 350px;
    position: relative;
    overflow: hidden;
}

/* charts */

.line-charts {
    display: block;
    width: 100%;
    padding: 35px;
    position: relative;
}

.area-link {
    position: absolute;
    right: 30px;
    top: -25px;
    z-index: 9;
    background-color: #fff;
}

.area-link select {
    padding: 5px;
    margin: 10px;
}

.donut-charts {
    display: block;
    width: 100%;
    padding: 35px;
    position: relative;
}

/* reservation table */

.reservation-responsive>.table>thead>tr>th,
.reservation-responsive>.table>tbody>tr>th,
.reservation-responsive>.table>tfoot>tr>th,
.reservation-responsive>.table>thead>tr>td,
.reservation-responsive>.table>tbody>tr>td,
.reservation-responsive>.table>tfoot>tr>td {
    border: 1px solid #cfd8dc !important;
}

.reservation-responsive>.table>caption+thead>tr:first-child>th,
.reservation-responsive>.table>colgroup+thead>tr:first-child>th,
.reservation-responsive>.table>thead:first-child>tr:first-child>th,
.reservation-responsive>.table>caption+thead>tr:first-child>td,
.reservation-responsive>.table>colgroup+thead>tr:first-child>td,
.reservation-responsive>.table>thead:first-child>tr:first-child>td {
    border: 0 !important;
}

.reservation-responsive>.table-condensed>tbody>tr>td {
    padding: 34px 0;
}

.reservation-responsive tbody>tr>td:first-child {
    border-left: 0 !important;
    border-bottom: 0 !important;
    border-top: 0 !important;
}

.reservation-responsive .event {
    width: 100%;
    padding: 14px 10px;
    min-height: 30px;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    display: inline-block;
}

.reservation-responsive .one {
    padding: 33px 10px !important;
}

.reservation-responsive .two {
    padding: 1.5em 10px !important;
}

.reservation-responsive .reservation {
    padding: 3.2em 10px !important;
}

.reservation-responsive .yoga {
    background: rgba(217, 187, 237, 0.3);
}

.reservation-responsive .event span.bar-yoga {
    background: rgba(217, 187, 237, 1);
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    display: block;
    transition: all 0.4s ease;
    z-index: 0;
}

.reservation-responsive .event:hover span.bar-yoga {
    width: 100%;
}

.reservation-responsive .pilates {
    background: rgba(96, 191, 97, 0.3);
}

.reservation-responsive .event span.bar-pilates {
    background: rgba(96, 191, 97, 1);
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    display: block;
    transition: all 0.4s ease;
    z-index: 0;
}

.reservation-responsive .event:hover span.bar-pilates {
    width: 100%;
}

.reservation-responsive .fitness {
    background: rgb(21, 87, 153, 0.3);
}

.reservation-responsive .event span.bar-fitness {
    background: rgb(21, 87, 153, 1);
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    display: block;
    transition: all 0.4s ease;
    z-index: 0;
}

.reservation-responsive .event:hover span.bar-fitness {
    width: 100%;
}

.reservation-responsive .event:hover p,
.reservation-responsive .event:hover h5 {
    color: #fff;
}

.reservation-responsive .event p,
.reservation-responsive .event h5 {
    font-size: 14px;
    transition: all 0.4s ease;
    text-overflow: ellipsis;
    z-index: 20;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    margin: 0;
    width: 85px;
}

.reservation-responsive .full {
    background: #f1f1f1;
}

.reservation-responsive>.table-condensed>tbody>tr>td.string {
    padding: 0;
}

.reservation-responsive .table>thead:first-child>tr:first-child>th {
    text-transform: uppercase;
    text-align: center;
    width: 120px;
}

.studyo-responsive .table>tbody>tr:hover {
    background-color: #f0f8fd !important;
}

.studyo-responsive .table>tbody>tr:hover td:first-child {
    background-color: #f0f8fd !important;
}

.reservation-responsive .table tr th:first-child {
    width: 30px !important;
}

/* studyo table */

.studyo-responsive thead {
    color: #818b98;
}

.studyo-responsive tbody {
    background-color: #fff;
    font-weight: bold;
}

.studyo-responsive tbody>tr>td:first-child {
    background-color: #deeffb;
}

.studyo-responsive tbody>tr>td:nth-child(2) {
    text-transform: uppercase;
}

.studyo-responsive .table>tbody>tr>td {
    padding: 5px 8px;
    line-height: 1.54;
    vertical-align: middle;
    border-top: 1px solid #e9e9e9;
    height: 60px;
}

.studyo-responsive .change-trainer {
    display: inline-block;
    vertical-align: sub;
    padding-left: 5px;
}

.studyo-responsive-haftalik {
    float: left;
    padding-right: 5px;
}

.studyo-responsive-haftalik:last-child {
    padding-right: 0;
}

.studyo-responsive .change-trainer span {
    display: block;
}

.studyo-responsive .change-trainer span:first-child {
    color: #aaacad;
}

.studyo-responsive-haftalik .table>tbody>tr:nth-child(odd) {
    background-color: #edd2a7;
}

.studyo-responsive-haftalik .table>tbody>tr:nth-child(odd) td {
    border-left: 3px solid #cd9342;
}

.studyo-responsive-haftalik .table>tbody>tr:nth-child(odd)>td:first-child {
    border-left: 5px solid #cd9342;
}

.studyo-responsive-haftalik .table>tbody>tr:nth-child(even) {
    background-color: #eddfc9;
}

.studyo-responsive-haftalik .table>tbody>tr:nth-child(even) td {
    border-left: 3px solid #dcae6e;
}

.studyo-responsive-haftalik .table>tbody>tr:nth-child(even)>td:first-child {
    border-left: 5px solid #dcae6e;
}

.studyo-responsive-haftalik .table>tbody>tr>td>.haftalik-detay span:nth-child(2n + 1) {
    display: block;
    font-weight: bold;
}

.studyo-responsive-haftalik .table>thead>tr>th {
    border-bottom: 0;
    padding: 0;
}

.event-card {
    padding: 1px;
    width: 100%;
    float: left;
    border-bottom: 1px solid #eee;
    margin: 15px 0;
}

.event-card .e-card-body span {
    float: right;
}

.event-card .e-card-body h6 {
    float: left;
    margin: 0;
}

.rezerve-card {
    background: #fff;
    margin-bottom: 20px;
    border: 1px solid #e2e2e2;
    border-radius: 0;
    padding: 10px;
}

.rezerve-card.yoga {
    border-left: 3px solid rgba(217, 187, 237, 1);
}

.rezerve-card.pilates {
    border-left: 3px solid rgba(96, 191, 97, 1);
}

.rezerve-card.fitness {
    border-left: 3px solid rgb(21, 87, 153, 1);
}

.rezerve-card .r-card-body .r-card-header h3 {
    display: inline-block;
    padding-right: 10px;
    font-size: 17px;
    border-right: 1px solid #9e9e9e;
    margin: 0;
}

.rezerve-card .r-card-body .r-card-header span {
    display: inline-block;
    padding-left: 10px;
}

.rezerve-card .r-card-body .r-card-header {
    margin-bottom: 10px;
}

.rezerve-card .r-card-body .align-items-center {
    align-items: center;
}

.rezerve-card .r-card-body h1 {
    display: inline-block;
    margin: 12px 0;
    font-size: 17px;
    font-weight: bold;
    width: 8em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: sub;
}

.rezerve-card .r-card-body span.sub-title {
    display: block;
    color: #868e96;
    width: 10em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.rezerve-card .r-card-body a {
    display: block;
    text-align: left;
    background-color: transparent;
    color: #212529;
    padding: 5px 0;
    width: 9em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.rezerve-card .r-card-body a i {
    font-size: 1.333333em;
    line-height: 1.2em;
    float: left;
}

.rezerve-card .r-card-body a i.fa-times {
    color: rgb(203, 45, 62);
}

.rezerve-card .r-card-body a i.fa-list {
    color: rgb(28, 181, 224);
}

.rezerve-card .r-card-body a i.fa-check {
    color: rgb(21, 153, 87);
}

.rezerve-card .r-card-body a span {
    padding-left: 5px;
}

.rezerve-filter h3 {
    margin: 5px 0;
    font-size: 14px;
    font-weight: bold;
}

.rezerve-filter label {
    width: 100%;
}

.rezerve-filter label select {
    width: 100%;
}

.wrapper {
    text-align: left;
    -webkit-transform: translateZ(0);
    -webkit-font-smoothing: antialiased;
    transform: translateZ(0);
}

.wrapper .tooltip1 {
    background: #333;
    top: 100px;
    color: #fff;
    display: block;
    left: 0px;
    margin-bottom: 12px;
    opacity: 0;
    padding: 0 20px 20px;
    pointer-events: none;
    position: absolute;
    width: 200px;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-transition: all 0.25s ease-out;
    -moz-transition: all 0.25s ease-out;
    -ms-transition: all 0.25s ease-out;
    -o-transition: all 0.25s ease-out;
    transition: all 0.25s ease-out;
    -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
}

.wrapper .tooltip1 p {
    margin: 0;
    padding: 0;
}

.wrapper .tooltip1:before {
    top: -20px;
    content: ' ';
    display: block;
    height: 20px;
    left: 0px;
    position: absolute;
    width: 100%;
}

.wrapper .tooltip1:after {
    border-left: solid transparent 10px;
    border-right: solid transparent 10px;
    border-bottom: solid #333 10px;
    top: -10px;
    content: ' ';
    height: 0;
    left: 25%;
    margin-left: -13px;
    position: absolute;
    width: 0;
}

.wrapper:hover .tooltip1 {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
}

.lte8 .wrapper .tooltip1 {
    display: none;
}

.lte8 .wrapper:hover .tooltip1 {
    display: block;
}

.wrapper .tooltip2 {
    background: #333;
    top: 130px;
    color: #fff;
    display: block;
    left: 0px;
    margin-bottom: 12px;
    opacity: 0;
    padding: 10px 0;
    pointer-events: none;
    position: absolute;
    width: 267px;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-transition: all 0.25s ease-out;
    -moz-transition: all 0.25s ease-out;
    -ms-transition: all 0.25s ease-out;
    -o-transition: all 0.25s ease-out;
    transition: all 0.25s ease-out;
    -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    -o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
}

.wrapper .tooltip2 p {
    margin: 0;
    padding: 0;
}

.wrapper .tooltip2:before {
    top: -20px;
    content: ' ';
    display: block;
    height: 20px;
    left: 0px;
    position: absolute;
    width: 100%;
}

.wrapper .tooltip2:after {
    border-left: solid transparent 10px;
    border-right: solid transparent 10px;
    border-bottom: solid #333 10px;
    top: -10px;
    content: ' ';
    height: 0;
    left: 25%;
    margin-left: -13px;
    position: absolute;
    width: 0;
}

.wrapper:hover .tooltip2 {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
}

.lte8 .wrapper .tooltip2 {
    display: none;
}

.lte8 .wrapper:hover .tooltip2 {
    display: block;
}

.wrapper .tooltip2 h5.br {
    margin: 0;
    padding: 0;
}

.br-1 {
    border-right: 1px solid #cfd8dc;
}

.tooltip-rezerve {
    padding: 0 !important;
}

.tooltip-rezerve h5 {
    color: #fff;
}

.tooltip-rezerve .tooltip-footer {
    padding-top: 20px;
}

.tooltip-rezerve button {
    width: 100%;
    text-align: left;
}

.tooltip-rezerve button b.caret {
    float: right;
    display: table;
    line-height: 1.5em;
}

/* tooltip */

.tool-tip {
    /*border: 1px solid #ccc;*/
    padding: 0 15px;
    position: absolute;
    cursor: pointer;
    margin: 0 10px;
    text-transform: uppercase;
}

.tool-tip::after {
    background-color: #323a45;
    border-radius: 2px;
    color: #fff;
    content: attr(data-tooltip-title) ' ';
    font-weight: normal;
    min-width: 100px;
    padding: 5px 8px;
    text-align: center;
    text-transform: none;
}

.tool-tip::before {
    width: 0;
    height: 0;
    content: '';
}

.tool-tip::before,
.tool-tip::after {
    position: absolute;
    transition: opacity 250ms ease 0ms, transform 250ms ease 0ms;
    transform-style: preserve-3d;
    opacity: 0;
    z-index: -1;
}

.tool-tip[data-tooltip-position='top']::after,
.tool-tip[data-tooltip-position='bottom']::after {
    left: 50%;
}

.tool-tip[data-tooltip-position='top']::after {
    transform: translate3d(-50%, 10px, 0);
}

.tool-tip[data-tooltip-position='bottom']::after {
    transform: translate3d(-50%, -10px, 0);
}

.tool-tip[data-tooltip-position='top']::after {
    bottom: calc(100% + 10px);
}

.tool-tip[data-tooltip-position='bottom']::after {
    top: calc(100% + 10px);
}

.tool-tip[data-tooltip-position='left']::after,
.tool-tip[data-tooltip-position='right']::after {
    top: 50%;
}

.tool-tip[data-tooltip-position='left']::after {
    transform: translate3d(10px, -50%, 0);
}

.tool-tip[data-tooltip-position='right']::after {
    transform: translate3d(-10px, -50%, 0);
}

.tool-tip[data-tooltip-position='left']::after {
    right: calc(100% + 10px);
}

.tool-tip[data-tooltip-position='right']::after {
    left: calc(100% + 10px);
}

/* Pointers */

.tool-tip[data-tooltip-position='top']::before,
.tool-tip[data-tooltip-position='bottom']::before {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    left: 50%;
}

.tool-tip[data-tooltip-position='top']::before {
    transform: translate3d(-50%, 10px, 0);
}

.tool-tip[data-tooltip-position='bottom']::before {
    transform: translate3d(-50%, -10px, 0);
}

.tool-tip[data-tooltip-position='top']::before {
    border-top: 7px solid #323a45;
    bottom: calc(100% + 3px);
}

.tool-tip[data-tooltip-position='bottom']::before {
    border-bottom: 7px solid #323a45;
    top: calc(100% + 3px);
}

.tool-tip[data-tooltip-position='left']::before,
.tool-tip[data-tooltip-position='right']::before {
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    top: 50%;
}

.tool-tip[data-tooltip-position='left']::before {
    transform: translate3d(10px, -50%, 0);
}

.tool-tip[data-tooltip-position='right']::before {
    transform: translate3d(-10px, -50%, 0);
}

.tool-tip[data-tooltip-position='left']::before {
    border-left: 7px solid #323a45;
    right: calc(100% + 3px);
}

.tool-tip[data-tooltip-position='right']::before {
    border-right: 7px solid #323a45;
    left: calc(100% + 3px);
}

.tool-tip:hover::before,
.tool-tip:hover::after {
    opacity: 1;
    z-index: 100;
}

.tool-tip[data-tooltip-position='top']:hover::before,
.tool-tip[data-tooltip-position='bottom']:hover::before,
.tool-tip[data-tooltip-position='top']:hover::after,
.tool-tip[data-tooltip-position='bottom']:hover::after {
    transform: translate3d(-50%, 0px, 0);
}

.tool-tip[data-tooltip-position='left']:hover::before,
.tool-tip[data-tooltip-position='right']:hover::before,
.tool-tip[data-tooltip-position='left']:hover::after,
.tool-tip[data-tooltip-position='right']:hover::after {
    transform: translate3d(0px, -50%, 0);
}

.reservation-responsive .reservation-make {
    background: rgba(247, 216, 172, 0.3);
}

.reservation-responsive .event span.bar-reservation-make {
    background: rgba(247, 216, 172, 1);
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    display: block;
    transition: all 0.4s ease;
    z-index: 0;
}

.reservation-responsive .event:hover span.bar-reservation-make {
    width: 100%;
}

#modalReservationSave .modal-body span i {
    color: green;
    padding-right: 10px;
}

#modalReservationSave .modal-body p {
    display: contents;
    padding-left: 10px;
    margin: 0;
}

.modal-body span i.fa-circle {
    color: green;
    padding-right: 10px;
}

.fail {
    color: red !important;
}

.modal-body p {
    display: contents;
    padding-left: 10px;
    margin: 0;
}

.modal-body span.first {
    display: block;
}

.modal-body span.second {
    display: block;
}

.studyo-lp-img {
    border-radius: 50px;
    width: 100px;
}

.studyo-lp-trainer {
    display: inline-block;
    vertical-align: sub;
    padding-left: 5px;
    font-size: 18px;
}

.studyo-lp-content {
    padding: 25px;
}

.studyo-lp-content span {
    font-size: 18px;
}

.studyo-lp-content h4 {
    display: inline-block;
    vertical-align: baseline;
    padding-left: 10px;
    font-size: 16px;
}

ul.timeline:before {
    content: '';
    position: absolute;
    top: 10px;
    bottom: 0;
    width: 2px;
    background: #e0e0e0;
    left: 6%;
    margin-left: 1px;
}

.timeline:before {
    top: -20px !important;
}

.timeline>li.timeline-rezervasyon .timeline-icon {
    font-size: 1.4em;
    line-height: 48px;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    color: #455a64;
    left: 6%;
    top: 0;
    padding: 0;
    width: 86px;
    height: 48px;
    background: #fff;
    border-radius: 0;
    text-align: left;
    margin: 0;
}

.timeline>li.timeline-rezervasyon-yok .timeline-icon {
    font-size: 1.4em;
    line-height: 48px;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    color: #455a64;
    left: 6%;
    top: 0;
    padding: 0;
    width: 100%;
    background: #fff;
    border-radius: 0;
    text-align: left;
    margin: 0;
}

.timeline>li.timeline-rezervasyon .timeline-body {
    margin: 24px 0 24px 25%;
    padding: 10px 24px;
    position: relative;
    border-width: 0;
    border-style: solid;
    border-radius: 2px;
    background-color: #fff;
    box-shadow: 0px 0px 25px 0px rgba(50, 50, 50, 0.37);
}

.timeline>li.timeline-rezervasyon .timeline-body:after {
    right: 100%;
    border: solid transparent;
    content: ' ';
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: transparent;
    border-width: 10px;
    top: 16px;
    border-right-color: #fff;
}

.timeline>li.timeline-rezervasyon .timeline-header {
    padding: 0;
    color: #90a4ae;
    margin-bottom: 0;
}

.timeline>li.timeline-rezervasyon .timeline-icon h4 {
    font-size: 16px;
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center h3 {
    margin: 0;
    margin-top: 5px;
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center h1 {
    font-size: 18px;
    font-weight: 400;
    margin: 5px 0 10px 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.export {
    bottom: -35px;
    display: block;
    position: relative;
    color: #868e96;
    font-weight: bold;
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.export span {
    padding-left: 5px;
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center span.sub-place {
    display: block;
    color: #868e96;
    margin: 0 0 10px 0;
    font-size: 16px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center span.sub-trainer {
    display: block;
    color: #868e96;
    font-size: 16px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.timeline>li.timeline-rezervasyon .timeline-header span.hour {
    display: inline-block;
    padding-right: 10px;
    font-size: 17px;
    border-right: 1px solid #9e9e9e;
    margin: 0;
}

.timeline>li.timeline-rezervasyon .timeline-header span.date {
    display: inline-block;
    padding-left: 10px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 11px;
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.right-button {
    display: block;
    text-align: left;
    background-color: transparent !important;
    color: #212529 !important;
    padding: 5px 0;
    width: 10em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 5px 12px;
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.right-button i {
    font-size: 1.333333em;
    line-height: 1.2em;
    float: left;
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.right-button i.fa-times {
    color: rgb(203, 45, 62);
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.right-button i.fa-list {
    color: rgb(28, 181, 224);
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.right-button i.fa-check {
    color: rgb(21, 153, 87);
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.right-button i.fa-thumbs-up {
    color: rgba(255, 152, 0, 1);
}

.timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.right-button span {
    padding-left: 5px;
}

.panel .panel-body {
    padding: 10px;
    overflow: -webkit-paged-x;
}

.rezerve-filter {
    padding-bottom: 10px;
}

.rez-menu>.list-group {
    margin-right: 24px;
    margin-top: 24px;
}

.rez-menu>.list-group>a.list-group-item:hover,
.rez-menu>.list-group>a.list-group-item:hover:focus,
.rez-menu>.list-group>.list-group-item.active {
    text-decoration: none;
    color: #455a64;
    background-color: #fef2f2;
    border-left: 3px solid #f86a66;
}

.remain-menu {
    margin-right: 24px;
}

.remain-content {
    display: inline-block;
    width: 80%;
}

.remain-button {
    display: inline-block;
    width: 15%;
}

.remain-button i {
    color: #fff;
}

.btn-radius-i {
    background-color: #269cf3;
    padding: 10px;
    border-radius: 50px;
}

#widget-remain .contextual-progress {
    margin: 0 0 24px 0;
    padding: 0;
    border: 0;
}

#widget-remain .contextual-progress .progress {
    height: 4px;
    margin: 8px 0 0 0;
    box-shadow: none;
    background: #eeeeee;
}

#widget-remain .contextual-progress .progress-title {
    font-weight: 400;
    color: #455a64;
}

#widget-remain .contextual-progress .progress .progress-bar {
    box-shadow: inset -2px 0 0 0 rgba(0, 0, 0, 0.08);
}

.progress-bar {
    float: left;
    width: 0%;
    height: 100%;
    font-size: 11px;
    line-height: 20px;
    color: #ffffff;
    text-align: center;
    background-color: #03a9f4;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
    -webkit-transition: width 0.6s ease;
    -o-transition: width 0.6s ease;
    transition: width 0.6s ease;
}

.progress-bar-lime {
    background-color: #cddc39;
}

.progress-bar-orange {
    background-color: #ff9800;
}

.progress-bar-purple {
    background-color: #9c27b0;
}

.progress-bar-unlimited {
    background-color: #159957 !important;
}

.progress-bar-danger {
    background-color: #e51c23;
}

i.fa-check.green {
    color: #159957;
}

.uyelik-islemlerim-card {
    background: #fff;
    margin-bottom: 20px;
    border: 1px solid #e2e2e2;
    border-radius: 5px;
    padding: 10px;
    border-left: 3px solid #d26a2b;
}

.uyelik-islemlerim-card .uyelik-islemlerim-description {
    padding: 0 15px;
}

.uyelik-islemlerim-card .uyelik-islemlerim-description h4 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 6px;
}

.tab-uyelik.tab-container>.nav.nav-tabs {
    margin-bottom: 10px;
    background-color: #fff;
}

.tab-uyelik.tab-container>.nav.nav-tabs>li {
    padding: 0 20px;
}

.tab-uyelik.tab-container>.nav.nav-tabs>li>a {
    border: 0 solid #eff3f6;
    color: #263238;
    border-bottom: 1px solid #fff;
    background: #fff;
    padding: 15px 15px;
    margin-top: 0px;
}

.tab-uyelik.tab-container>.nav.nav-tabs>li.active>a {
    color: #263238;
    border-bottom: 1px solid #fff;
    background: #fff;
    border-bottom: 3px solid #d26a2b;
    padding: 13px 15px;
    margin-top: 0px;
}

.tab-uyelik.tab-container>.nav.nav-tabs>li>a:hover {
    color: #263238;
    border-bottom: 3px solid #d26a2b;
    background-color: #fff;
}

.uyelik-radio input[type='radio']:checked+.uyelik-checked {
    background-color: #2a9ef5;
    color: #fff;
    padding: 15px;
}

.uyelik-radio .uyelik-checked {
    background-color: #fff;
    color: #303030;
    padding: 15px;
}

#modalUyelikCoz .modal-body p {
    display: contents;
    padding-left: 10px;
    margin: 0;
}

#modalUyelikCoz .modal-body span i {
    color: orangered;
}

/* popover */

.popover-title {
    padding: 8px 10px;
    background-color: #1d2530 !important;
    border-radius: 2px 2px 0 0;
    color: #fafafa !important;
}

.popover.bottom>.arrow:after {
    content: ' ';
    top: 1px;
    margin-left: -10px;
    border-top-width: 0;
    border-bottom-color: #1d2530 !important;
}

/* leftbarmenu */

.leftbarmenu {
    background-color: #fff;
    height: calc(100vh - 240px);
    overflow: overlay;
}

.leftbarmenu #barmenu {
    display: block;
    overflow: visible;
}

.leftbarmenu .menu-heading {
    background-color: transparent;
    border-bottom: 1px solid #eeeeee;
}

.leftbarmenu .menu-heading a {
    text-decoration: none;
    color: inherit;
}

.leftbarmenu .menu-heading a h4 {
    display: block;
    margin: 0;
    padding: 15px 12px;
    font-weight: bold;
    font-size: 11px;
    color: #303030;
    line-height: 1.5;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.leftbarmenu .menu-heading a.collapse-nan h4:after {
    content: '\f104';
    opacity: 0;
    filter: alpha(opacity=50);
}

.leftbarmenu .menu-heading a.collapsed h4:after {
    content: '\f104';
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.leftbarmenu .menu-heading a h4:after {
    opacity: 0.5;
    filter: alpha(opacity=50);
    content: '\f107';
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    float: right;
}

.leftbarmenu .menu-content {
    position: relative;
}

.leftbarmenu .menu-body {
    padding: 24px;
}

.leftbarmenu .menu-content .menu-body .content-list {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    list-style: none;
}

.leftbarmenu .menu-content .menu-body .content-list li {
    padding: 0;
    margin: 0 0 16px 0;
    border: 0;
}

.leftbarmenu .menu-content .content-list li a img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    vertical-align: top;
}

.leftbarmenu .menu-content .content-list li a span {
    padding-left: 16px;
    color: #455a64;
    text-transform: uppercase;
    font-size: 11px;
    transition: 0.25s linear;
}

.leftbarmenu .menu-content .content-list li a span:hover {
    color: #98d4e0;
}

#lesson-search {
    background: transparent;
}

#lesson-search form {
    position: relative;
}

#lesson-search form input[type='text'] {
    color: #303030;
    padding: 0 8px 0 48px;
    border-radius: 0px;
    min-height: 48px;
    line-height: 20px;
    width: 100%;
    border: none;
}

#lesson-search form button[type='submit'] {
    float: left;
    position: absolute;
    top: 0;
    left: 0;
    border: 0;
    background: none;
    padding: 14px 16px;
    margin: 0;
    visibility: visible;
}

.yeni-satis {
    background: #fff;
    color: #29303b;
    display: block;
    font-size: small;
    overflow: hidden;
    position: relative;
    margin-bottom: 25px;
}

/* add to cart */

img.item-img.move-to-cart {
    position: absolute;
    height: 200px;
    width: 200px;
    z-index: 9999;
}

img.item-img.move-to-cart.animate {
    opacity: 1;
    height: 75px;
    width: 75px;
    transition: all 0.5s ease-in-out;
}

img.item-img.move-to-cart.hide-img {
    opacity: 0.5;
    width: 0;
    height: 0;
    margin-left: 75px;
    transition: all 0.5s ease-in-out;
}

.shopping-cart-container {
    margin-top: 10px;
}

#topnav.navbar-midnightblue .toolbar.pull-right li.toolbar-icon-bg>a span.icon-bg>i.fa-shopping-cart {
    font-size: 18px;
    padding-top: 2px;
}

.yeni-satis .ys-header {
    display: block;
    position: relative;
}

.yeni-satis .ys-header .ys-img {
    height: 160px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    z-index: 9;
}

.yeni-satis .ys-header .item-img {
    position: absolute;
    top: 0;
}

.yeni-satis .ys-content {
    display: block;
}

.yeni-satis .ys-content>span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    font-weight: 600;
    font-size: 15px;
    color: #29303b;
    padding: 15px;
    display: block;
    width: 100%;
    white-space: nowrap;
}

.yeni-satis .ys-content .ys-info {
    padding: 0 15px;
}

.yeni-satis .ys-content .ys-info span {
    display: inline-block;
}

.yeni-satis .ys-content .ys-info span i {
    font-size: 16px;
}

.yeni-satis .ys-content .ys-info span ins,
.yeni-satis .ys-content .ys-info span p {
    display: inline-block;
    padding-left: 10px;
    font-size: 14px;
    text-decoration: none;
    margin: 0 0 10px;
}

.yeni-satis .ys-content .ys-info span ins {
    padding-left: 8px;
}

.yeni-satis .ys-content .ys-info ul.custom-menu {
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.yeni-satis .ys-content .ys-info ul.custom-menu li a {
    font-size: 18px;
    margin-left: 15px;
    padding: 0;
    transition: 0.25s linear;
}

.yeni-satis .ys-content .ys-info ul.custom-menu li a i.fa-info-circle {
    color: #269cf3;
    transition: 0.25s linear;
}

.yeni-satis .ys-content .ys-info ul.custom-menu li a i.fa-info-circle:hover {
    color: #303030;
}

.yeni-satis .ys-content .ys-info ul.custom-menu li a i.fa-play-circle {
    color: #c43b3c;
    transition: 0.25s linear;
}

.yeni-satis .ys-content .ys-info ul.custom-menu li a i.fa-play-circle:hover {
    color: #303030;
}

a i.fa-bell {
    color: #cb2d3e;
    transition: 0.25s linear;
}

a i.fa-bell:hover {
    color: #303030;
}

.yeni-satis .ys-content .ys-info span.cash {
    display: inline-block;
}

.yeni-satis .ys-footer {
    padding: 15px;
    text-align: center;
    text-transform: uppercase;
    display: block;
    transition: 0.25s linear;
}

.yeni-satis .ys-footer.sepete-ekle {
    background-color: #00bf6f;
}

.yeni-satis .ys-footer.rezervasyon-yap {
    background-color: #009ac9;
}

.yeni-satis .ys-footer:hover {
    background-color: #303030;
}

.yeni-satis a.ys-footer {
    color: #fff;
}

.yeni-satis-card {
    background: #fff;
    margin: 20px 0;
    border: 1px solid #e2e2e2;
    border-radius: 0;
    padding: 10px;
    border-left: 3px solid #00bf6f;
    margin-top: 0;
}

.yeni-satis-card .ysc-header {
    border-bottom: 1px solid #ddd;
}

.yeni-satis-card .ysc-header .navbar {
    margin-bottom: 5px;
    min-height: 24px;
}

.yeni-satis-card .ysc-header .card-title {
    display: inline-block;
}

.yeni-satis-card .ysc-header .card-title h4 {
    font-size: 14px;
    margin: 5px 0;
}

.yeni-satis-card .ysc-header ul.custom-menu {
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.yeni-satis-card .ysc-header ul>li>a {
    color: #00bf6f;
    font-size: 18px;
    margin-left: 15px;
    padding: 0;
}

.yeni-satis-card .ysc-header ul>li>a:hover {
    text-decoration: none;
    background-color: transparent;
    color: #303030;
}

.yeni-satis-card .ysc-header ul>li>a>i.fa-play-circle {
    color: #c43b3c;
    font-size: 20px;
    transition: 0.25s linear;
}

.yeni-satis-card .ysc-header ul>li>a>i.fa-play-circle:hover {
    color: #303030;
}

.yeni-satis-card .ysc-header ul>li>a>i.fa-info-circle {
    color: #269cf3;
    font-size: 20px;
    transition: 0.25s linear;
}

.yeni-satis-card .ysc-header ul>li>a>i.fa-info-circle:hover {
    color: #303030;
}

.yeni-satis-card .ysc-content span {
    padding-top: 10px;
    display: inline-block;
}

.yeni-satis-card .ysc-content span i {
    font-size: 16px;
}

.yeni-satis-card .ysc-content span p {
    display: inline-block;
    padding-left: 10px;
    font-size: 14px;
}

.yeni-satis-card .ysc-footer {
    text-align: left;
    position: absolute;
    bottom: -5px;
    left: 10px;
    margin-bottom: 8px;
}

.yeni-satis-card .ysc-footer span {
    width: 36px;
    height: 36px;
    display: inline-block;
    background-color: #00bf6f;
    border-radius: 50px;
    text-align: center;
    transition: 0.25s linear;
}

.yeni-satis-card .ysc-footer span:hover {
    background-color: #303030;
}

.yeni-satis-card .ysc-footer span i {
    height: 0;
    vertical-align: middle;
    color: #fff;
}

.yeni-satis-card .ysc-footer h4 {
    display: inline;
    line-height: 10px;
    padding-top: 5px;
    margin: 0;
    vertical-align: middle;
}

.data-not-found {
    text-align: center;
    margin-top: 10%;
}

.data-not-found span {
    font-size: 16px;
    padding-bottom: 5px;
}

.data-not-found-logo {
    display: block;
    margin-bottom: 50px;
}

.data-not-found-logo img {
    width: 300px;
}

.panel.new-program {
    border: 1px solid #fff;
}

.panel.new-program .panel-body {
    padding: 50px !important;
}

.panel.new-program .panel-body h4 {
    font-size: 27px;
}

.panel.new-program .panel-body p {
    font-size: 18px;
    color: #878e97;
}

.panel.new-program a.new-program-overlay:hover .npb-content.red {
    background-color: rgb(203, 45, 62, 1);
}

.panel.new-program a.new-program-overlay:hover .npb-content.blue {
    background-color: rgb(21, 87, 153, 1);
}

.panel.new-program .new-program-box {
    border: 1px solid #cfd8dc;
    border-radius: 5px;
    padding: 50px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 370px;
    position: relative;
}

.panel.new-program .new-program-box img {
    width: 180px;
    height: 160px;
}

.panel.new-program .npb-content {
    padding-bottom: 20px;
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
}

.panel.new-program .npb-content.red {
    background-color: rgb(203, 45, 62, 0.5);
    transition: 0.25s linear;
}

.panel.new-program .npb-content.blue {
    background-color: rgb(21, 87, 153, 0.5);
    transition: 0.25s linear;
}

.panel.new-program .npb-content h3 {
    font-weight: bold;
    color: #fff;
}

.panel.new-program .npb-content p {
    font-size: 16px;
    color: #fff;
}

.panel.rezervasyon-yap {
    border: 1px solid #fff;
}

.panel.rezervasyon-yap .panel-body {
    border: 1px solid #fff;
    padding: 12px;
}

.panel.rezervasyon-yap .panel-heading h4 {
    color: #fff;
}

.panel.rezervasyon-yap table tbody td a i.rzv-radius-i {
    color: #fff;
    background-color: #37b046;
    padding: 10px;
    border-radius: 50px;
    transition: 0.25s linear;
    width: 100%;
    text-align: center;
}

.panel.rezervasyon-yap table {
    position: static;
}

.panel.rezervasyon-yap table tbody td a i.rzv-radius-i:hover {
    background-color: #303030;
}

.panel.rezervasyon-yap .remain-table {
    background-color: #daf0ff;
    padding: 13px;
    border-radius: 5px;
    margin-bottom: 20px;
    box-shadow: 0px 0px 25px 0px rgba(50, 50, 50, 0.37);
}

.panel.rezervasyon-yap .ucretsiz-servisler table>tbody>tr {
    line-height: 50px;
    border-bottom: 1px solid #e9e9e9;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}

.panel.rezervasyon-yap .ucretsiz-servisler table>tbody>tr:hover {
    background-color: #f1f1f1;
}

.panel.rezervasyon-yap .ucretsiz-servisler table>tbody>tr>td {
    vertical-align: middle;
}

.panel.rezervasyon-yap .ucretsiz-servisler table>tbody>tr>td:first-child {
    font-weight: 600;
}

.panel.rezervasyon-yap .ucretsiz-servisler .table>thead>tr>th {
    border-bottom: 1px solid #90a4ae;
    color: #4a505d;
    font-size: 15px;
    line-height: 40px;
    font-weight: 600;
    font-family: 'Quicksand', sans-serif;
}

.panel.rezervasyon-yap .ucretsiz-servisler .table>thead>tr>th:nth-child(1n + 2) {
    width: 110px;
    text-align: center;
}

.panel.rezervasyon-yap .ucretsiz-servisler .table>tbody>tr>td:nth-child(1n + 2) {
    text-align: center;
}

.panel.rezervasyon-yap .ucretsiz-servisler {
    padding: 0;
}

.panel.rezervasyon-yap .kalan-kullanimlarim table>tbody>tr {
    line-height: 50px;
    border-bottom: 1px solid #e9e9e9;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}

.panel.rezervasyon-yap .kalan-kullanimlarim table>tbody>tr:hover {
    background-color: #f1f1f1;
}

.panel.rezervasyon-yap .kalan-kullanimlarim table>tbody>tr>td {
    vertical-align: middle;
}

.panel.rezervasyon-yap .kalan-kullanimlarim table>tbody>tr>td:first-child {
    font-weight: 600;
}

.panel.rezervasyon-yap .kalan-kullanimlarim .table>thead>tr>th {
    border-bottom: 1px solid #90a4ae;
    color: #4a505d;
    font-size: 15px;
    line-height: 40px;
    font-weight: 600;
    font-family: 'Quicksand', sans-serif;
}

.panel.rezervasyon-yap .kalan-kullanimlarim .table>thead>tr>th:nth-child(2) {
    width: 160px !important;
}

.panel.rezervasyon-yap .kalan-kullanimlarim .table>thead>tr>th:nth-child(1n + 2) {
    width: 75px;
}

.hidden-kalan-kullanim {
    display: none;
    visibility: hidden;
}

.full-width-ucretsiz-servisler {
    width: 100% !important;
}

.page-top .program-measure h4 {
    font-weight: bold;
    margin: 8px 0;
    font-size: 14px;
    display: inline-block;
    margin-right: 10px;
}

.page-top .program-measure p {
    display: inline-block;
}

.hazir-program-card {
    position: relative;
    margin-bottom: 10px;
    background-color: #ffffff;
    color: #313534;
    border-radius: 2px;
    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
}

.hazir-program-card .hp-card-body {
    position: relative;
    padding: 5px 10px;
}

.hazir-program-card .hp-card-body table {
    margin-bottom: 0;
}

.hazir-program-card .hp-card-body table>tbody>tr:last-child>td:first-child {
    border-bottom-left-radius: 2px;
    width: 115px;
}

.hazir-program-card .hp-card-body table>tbody>tr:first-child>td {
    border-top: 0;
    width: 120px;
}

.hazir-program-card .hp-card-body:before {
    content: '';
    position: absolute;
    display: block;
    width: 4px;
    left: -1px;
    top: -1px;
    bottom: -1px;
    background: #dc972f;
}

.hazir-program-card .hp-card-body .table thead tr th {
    border-bottom: 0;
}

.hazir-program-liste-card {
    position: relative;
    margin-bottom: 10px;
    background-color: #ffffff;
    color: #313534;
    border-radius: 2px;
    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
}

.hazir-program-liste-card .hpl-card-body {
    position: relative;
    padding: 5px 10px;
}

.hazir-program-liste-card .hpl-card-body table {
    margin-bottom: 0;
}

.hpl-card-body:before {
    content: '';
    position: absolute;
    display: block;
    width: 4px;
    left: -1px;
    top: -1px;
    bottom: -1px;
    background: #37b046;
}

.hazir-program-liste-card .hpl-card-body .table thead tr th {
    border-bottom: 0;
    width: 170px;
}

::-webkit-input-placeholder {
    color: #303030;
}

::-moz-placeholder {
    color: #303030;
}

::placeholder {
    color: #303030;
}

/* lapis clup */

.lapis-clup {
    width: 100%;
    display: block;
}

/* lapis date */

.lapis-date {
    width: 100%;
    display: block;
}

.lapis-date .input-date {
    display: flex;
    background-color: transparent;
    height: 32px;
}

.lapis-date .input-date-nan input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    font-size: 14px;
    width: 100%;
    background-color: #fff;
    color: #37474f;
    line-height: 32px;
    height: 32px;
}

.lapis-date .input-date input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    font-size: 14px;
    text-align: center;
    width: 100%;
    background-color: #fff;
    color: #37474f;
    line-height: 32px;
    height: 32px;
}

.lapis-date .input-date a {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    border: none;
    cursor: pointer;
    font-size: 16px;
    width: 32px;
    height: 32px;
    padding: 4px 8px;
}

.lapis-date .input-date a:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}

.lapis-date .input-date a:last-child {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}

.lapis-date .input-date a[disabled] {
    cursor: not-allowed;
    opacity: 0.4;
}

.lapis-date .input-date a i {
    color: #37474f;
    transition: 0.25s linear;
}

.lapis-date .input-date a i:hover {
    color: #07c;
}

.tab-pro.tab-container .panel .panel-heading {
    padding: 10px;
    line-height: 25px;
}

.modal .modal-content .lapis-date .input-date {
    background-color: transparent;
}

.modal .modal-content .lapis-date .input-date input {
    width: inherit;
}

/* lapis studio */

.lapis-studio .input-studio {
    display: block;
}

.lapis-studio .input-studio a {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    border: none;
    cursor: pointer;
    font-size: 20px;
    width: 30px;
    padding: 2px 8px;
}

.lapis-studio .input-studio a[disabled] {
    cursor: not-allowed;
    opacity: 0.4;
}

.lapis-studio .input-studio a i {
    color: #37474f;
    transition: 0.25s linear;
}

.lapis-studio .input-studio a i:hover {
    color: #07c;
}

.lapis-studio .input-studio input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    font-size: 15px;
    text-align: center;
    width: calc(100% - 77px);
    display: inline-block;
    background-color: #37474f;
    color: #fff;
}

/* stüdyo ders günler */

.studyo-measure .input-stepper {
    display: block;
    background-color: #37474f;
}

.studyo-measure .input-stepper button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    border: none;
    cursor: pointer;
    font-size: 20px;
    width: 30px;
}

.studyo-measure .input-stepper button[disabled] {
    cursor: not-allowed;
    opacity: 0.4;
}

.studyo-measure .input-stepper button i {
    color: #37474f;
    transition: 0.25s linear;
}

.studyo-measure .input-stepper button i:hover {
    color: #07c;
}

.studyo-measure .input-stepper input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    font-size: 15px;
    text-align: center;
    width: calc(100% - 67px);
    display: inline-block;
    background-color: #37474f;
    color: #fff;
}

/* stepper sepetim */

.basket-measure .input-stepper {
    display: inline-block;
    background-color: #fff;
    padding: 0;
    border-radius: 3px;
    border: 1px solid #dcdcdc;
}

.basket-measure .input-stepper button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    cursor: pointer;
    font-size: 13px;
}

.basket-measure .input-stepper button[disabled] {
    cursor: not-allowed;
    opacity: 0.4;
}

.basket-measure .input-stepper button i {
    color: #303030;
}

.basket-measure .input-stepper input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    font-size: 15px;
    text-align: center;
    width: 32px;
    border-right: 1px solid #dcdcdc;
    border-left: 1px solid #dcdcdc;
}

/* stepper hazır program */

/* stepper hazır program */

.program-measure {
    width: 100%;
    display: block;
}

.program-measure .input-stepper {
    display: flex;
    background-color: transparent;
}

.program-measure .input-stepper button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    border: none;
    cursor: pointer;
    font-size: 20px;
    padding: 0 10px;
}

.program-measure .input-stepper button[disabled] {
    cursor: not-allowed;
    opacity: 0.4;
}

.program-measure .input-stepper button i {
    color: #07c;
}

.program-measure .input-stepper input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    font-size: 20px;
    text-align: center;
    width: 100%;
}

.basket table>tbody>tr>td {
    vertical-align: middle;
    padding: 10px;
}

.basket table>thead>tr>th {
    padding: 10px;
}

.basket table>tbody>tr>td:first-child a {
    color: #ff4949;
}

.basket table>tbody>tr>td:nth-child(3),
.basket table>thead>tr>th:nth-child(3) {
    text-align: center;
}

.basket-bank table>thead>tr>th:last-child {
    text-align: right;
}

.basket table>tbody>tr>td:nth-child(4),
.basket table>thead>tr>th:nth-child(4),
.basket table>tbody>tr>td:nth-child(5),
.basket table>thead>tr>th:nth-child(5),
.basket-total>table>tbody>tr>td:last-child {
    text-align: right;
}

.basket-bank>table>tbody>tr>td:last-child {
    text-align: right;
}

.basket-bank {
    padding: 12px;
}

.panel-body.bankadan-uyari {
    padding: 24px;
}

.panel-body.bankadan-uyari .discount-bank {
    color: #f22613 !important;
}

.basket>table>tbody>tr>td:last-child p {
    margin: 0;
}

.basket>table>tbody>tr>td:last-child p del {
    display: block;
    color: #888;
    font-size: 11px;
}

.basket>table>tbody>tr>td:last-child p ins {
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    position: relative;
}

.panel.panel-default.sBar {
    transition: 1s all ease 0.15s;
    top: 0px;
    /*transition: 3s all cubic-bezier(0.18, 0.89, 0.32, 1.28) .15s;*/
    transition: 3s all ease-out 0.15s;
}

.panel.panel-default.sBar-sticky {
    width: calc(24% - 10px);
    position: fixed;
    top: calc(100% - 420px);
    transition: 3s all ease-out 0.15s;
}

.basket-summary .basket-total p {
    padding: 0 10px;
}

.basket-summary .basket table {
    margin-bottom: 5px;
}

.basket-summary .basket-total {
    border-top: 2px solid #eeeeee;
}

.basket-summary .basket-total .top>div {
    border-bottom: 0;
}

.basket-summary .basket table>tbody>tr>td:last-child,
.basket-summary .basket table>thead>tr>th:last-child {
    text-align: right;
}

.basket-total .top {
    padding-bottom: 20px;
}

.basket-total .top>div {
    padding: 5px 0;
    display: table;
    width: 100%;
    border-bottom: 1px solid #cfd8dc;
}

.basket-total p:first-child {
    text-align: left;
}

.basket-total p {
    width: 50%;
    text-align: right;
    display: table-cell;
    vertical-align: bottom;
}

.basket-total .discount-total,
.basket .discount-total {
    color: #f22613 !important;
}

/* emote */

.emote-group {
    display: table-cell;
    width: 21%;
    text-align: center;
}

.emote-group .emote-svg {
    display: block;
    text-align: center;
    margin-bottom: 15px;
}

.emote-group .emote-svg img {
    width: 30px;
}

.emote-group label.btn-midnightblue-alt {
    width: 100%;
}

.emote-group label.btn-midnightblue-alt input {
    display: none;
}

/* radio üyelik güncelleme */

input[type='radio']+label {
    color: #ccc;
    font-style: normal;
}

input[type='radio']:checked+label {
    color: #269cf3;
    font-style: normal;
}

.radioGroup {
    float: left;
    width: 100%;
}

.radioGroup4,
.radioGroup8 {
    margin-right: 0;
}

radioGroup6 {
    margin-left: 5px;
    margin-right: 25px;
}

.radioGroup7 {
    margin-left: 5px;
}

.radioGroup8 {
    margin-left: 5px;
}

.radioGroup input[type='radio'] {
    float: left;
    opacity: 1;
    margin-top: 20px;
    /*background:rgba(255,255,255,0);
opacity:0;
filter: alpha(opacity=10);*/
    outline: none;
    border: none;
}

.radioGroup input[type='radio']::before {
    /*content:attr(data-hover);*/
    border: 2px solid #22252e;
    border-radius: 40px;
    height: 50px;
    line-height: 46px;
    opacity: 0.3;
    color: #22252e;
    filter: alpha(opacity=10);
    padding: 0 24.5px;
    float: left;
    font-size: 18px;
    white-space: nowrap;
}

#map-canvas {
    height: 100%;
}

.radioGroup label.plac {
    border-radius: 0;
    height: 50px;
    line-height: 46px;
    font-weight: 400;
    color: #303030;
    padding: 0 24.5px;
    float: left;
    font-size: 18px;
    white-space: nowrap;
    -webkit-transition: all 0.6s ease;
    transition: all 0.6s ease;
    margin-left: 15px;
    margin-top: 0;
    background: transparent;
    cursor: pointer;
    width: calc(100% - 30px);
    margin-bottom: 0;
}

.radioGroup input[type='radio']:checked+label.plac+tr {
    opacity: 1;
    background: #269cf3;
    color: #fff;
}

.radioGroup input:hover>table tbody.uyelik-radio tr {
    background: #269cf3;
}

table tbody.uyelik-radio tr td:last-child {
    font-size: 18px;
    padding: 15px;
}

.olcumlerim .table>thead {
    background-color: #f6f8fc;
}

.olcumlerim .table>thead>tr>th {
    padding: 20px;
    font-size: 14px;
}

.olcumlerim .table>tbody>tr>td {
    padding: 20px;
    font-size: 14px;
}

.olcumlerim .table>tbody>tr td:first-child span {
    padding-right: 10px;
}

.olcumlerim .table>tbody>tr:hover {
    background-color: #f0f8fd;
}

.olcumlerim .table>tbody>tr td:first-child span i.blue-1 {
    color: #1d97f2;
}

.olcumlerim .table>tbody>tr td:first-child span i.blue-2 {
    color: #3c7cc2;
}

.olcumlerim .table>tbody>tr td:first-child span i.blue-3 {
    color: #3367a3;
}

/*the container must be positioned relative:*/

.custom-select {
    position: relative;
    font-family: Arial;
}

.custom-select select {
    display: none;
    /*hide original SELECT element:*/
}

.select-selected {
    background-color: DodgerBlue;
}

/*style the arrow inside the select element:*/

.select-selected:after {
    position: absolute;
    content: '';
    top: 14px;
    right: 10px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-color: #fff transparent transparent transparent;
}

/*point the arrow upwards when the select box is open (active):*/

.select-selected.select-arrow-active:after {
    border-color: transparent transparent #fff transparent;
    top: 7px;
}

/*style the items (options), including the selected item:*/

.select-items div,
.select-selected {
    color: #ffffff;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    cursor: pointer;
    user-select: none;
}

/*style items (options):*/

.select-items {
    position: absolute;
    background-color: DodgerBlue;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
}

/*hide the items when the select box is closed:*/

.select-hide {
    display: none;
}

.select-items div:hover,
.same-as-selected {
    background-color: rgba(0, 0, 0, 0.1);
}

/* login screen */

.back {
    width: 100%;
    height: 100vh;
    position: absolute;
    z-index: -999;
}

.back .back-left {
    position: absolute;
    left: 0;
    width: 50%;
    height: 100%;
    background-color: #2a2f3c;
}

.back .back-right {
    position: absolute;
    right: 0;
    width: 50%;
    height: 100%;
    background-color: #1d94ee;
}

.front {
    width: 100%;
    height: 100vh;
    display: table;
}

.front .front-left {
    right: 0;
    width: 50%;
    display: table-cell;
    vertical-align: middle;
}

.front .front-left .web-login {
    height: 200px;
}

.front .front-left .pin-login {
    height: 490px;
}

.front .front-left .kart-login {
    height: 200px;
}

.front .front-right .fr-box.registerLink {
    height: 315px;
}

.front .front-right .fr-box.newCreateLink {
    height: 380px;
}

.front .front-right .fr-box.beniAra {
    height: auto;
}

.front .front-right .fr-box.beniAra .checkbox {
    padding-left: 15px;
}

.front .front-left .fl-box {
    display: table;
    padding: 25px;
    width: 375px;
    float: right;
    background-color: #1e212c;
    position: relative;
}

.front .front-left .fl-box img {
    width: 125px;
    position: absolute;
    top: -26px;
    background-color: #1d94ee;
    padding: 14px 32px;
    border-radius: 25px;
}

.front .front-left .fl-box .fl-text {
    display: table-cell;
    vertical-align: middle;
}

.front .front-left .fl-box .fl-text h4 {
    color: #cfd8dc;
    margin: 10px 0;
}

.front .front-left .fl-box .fl-text p {
    color: #cfd8dc;
}

.front .front-right {
    left: 0;
    width: 50%;
    display: table-cell;
    vertical-align: middle;
}

.front .front-right h4 {
    color: #fff;
    font-size: 16px;
    position: absolute;
    top: -50px;
}

.front .front-right .fr-box {
    padding: 25px;
    width: 375px;
    float: left;
    background-color: #fff;
    position: relative;
    height: 200px;
}

.front .front-right .fr-box .fr-button {
    bottom: -50px;
    position: absolute;
    right: 0;
}

.front .front-right .fr-bottom {
    position: absolute;
    bottom: 10px;
    padding-left: 25px;
}

.front .front-right .fr-bottom p {
    color: #fff;
}

.front .front-right .fr-bottom p a {
    color: #fff;
    font-weight: bold;
}

.front .front-right .fr-bottom p a:hover {
    border-bottom: 1px solid #fff;
}

.front .front-center {
    right: 0;
    width: 100%;
    display: table-cell;
    vertical-align: middle;
}

.front .front-center .fc-box {
    padding: 15px 50px;
    width: 70%;
    background-color: #fff;
    position: relative;
    height: calc(100vh - 100px);
    margin: 0 auto;
}

.front .front-center .fc-box>img {
    width: 125px;
    position: absolute;
    top: -40px;
    background-color: #1d94ee;
    padding: 14px 32px;
    border-radius: 25px;
}

.front .front-center .payment-check-top {
    background-color: #776dc7;
    display: block;
    padding: 0 15px;
    border-radius: 5px;
}

.front .front-center .payment-check-top h3 {
    font-size: 16px;
    font-weight: 400;
    color: #fff;
}

.front .front-center .payment-check-top span {
    font-size: 14px;
    font-weight: 400;
    color: #fff;
}

.front .front-center .payment-check-bottom {
    background-color: #e8e9f6;
    display: block;
    padding: 5px 15px;
    border-radius: 5px;
    margin-bottom: 5px;
}

.front .front-center .payment-check-bottom input:disabled {
    background-color: #fff !important;
}

/* front center next step */

.wrapper {
    max-width: 700px;
    margin: 50px auto;
}

.back_link {
    display: block;
    text-decoration: none;
    margin-top: 70px;
    margin-bottom: 70px;
    text-align: center;
    font-family: 'opensans-regular', Helvetica, Arial, sans-serif;
    color: #515860;
    font-size: 16px;
}

.back_link .back_arrow_icon {
    vertical-align: middle;
    margin-right: 4px;
}

/*  form steps  */

.steps {
    max-width: 768px;
    height: auto;
    margin: 0 auto;
    padding: 10px 0;
    position: relative;
    text-align: left;
}

.steps:after {
    content: '';
    display: block;
    width: 16px;
    height: 8px;
    background: url('../img/arrow_icon.png') no-repeat;
    position: absolute;
    bottom: -8px;
    left: 50%;
    margin-left: -8px;
}

.steps ul {
    display: flex;
    -webkit-padding-start: 0;
}

.steps ul li {
    width: 100%;
    list-style: none;
    display: none;
    float: left;
}

.steps ul li.current_step {
    display: block;
}

.steps ul li .text_field {
    display: block;
    padding: 15px 20px;
    font-family: 'opensans-regular', Helvetica, Arial, sans-serif;
    font-size: 13px;
    color: #515860;
    letter-spacing: 1px;
    margin: 0 auto;
    border-width: 0;
    border-style: solid;
    border-color: #2a2f3c;
    border-left-width: 5px;
    background-color: #eee;
    padding-left: 10px;
    outline: 0;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.text_field:focus {
    border-color: #03a9f4 !important;
}

.steps ul li input.error {
    border-color: #ed213a;
}

.steps .form_title {
    display: inline-block;
    text-align: center;
    margin-bottom: 50px;
    font-family: 'opensans-bold', Helvetica, Arial, sans-serif;
    color: #515860;
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.steps .note {
    display: inline-block;
    font-family: 'opensans-regular', Helvetica, Arial, sans-serif;
    color: #607d8b;
    font-size: 12px;
    margin-top: 10px;
    width: 60%;
    text-align: left;
}

/*  steps navigation  */

.navigation_container ul {
    display: inline-block;
    margin-top: 25px;
}

.navigation_container li {
    list-style: none;
    position: relative;
    display: block;
    width: 10px;
    height: 10px;
    float: left;
    margin: 24px 10px 0 0;
    background: #d8e0eb;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    -ms-border-radius: 100px;
    -o-border-radius: 100px;
    border-radius: 100px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.navigation_container li:first-child {
    margin-left: 0;
}

.navigation_container .current_nav {
    width: 60px;
    height: 60px;
    position: relative;
    margin: 0 15px 0 5px;
    top: -1px;
    background: #51c57e;
    cursor: pointer;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.navigation_container .valid {
    background: #51c57e !important;
}

.navigation_container .error {
    background: #ed213a !important;
    -webkit-animation: bounce_btn 0.5s linear;
    -moz-animation: bounce_btn 0.5s linear;
    -ms-animation: bounce_btn 0.5s linear;
    -o-animation: bounce_btn 0.5s linear;
    animation: bounce_btn 0.5s linear;
}

/*  SVG icons css  */

.animate {
    -webkit-animation: bounce_btn 0.5s linear;
    -moz-animation: bounce_btn 0.5s linear;
    -ms-animation: bounce_btn 0.5s linear;
    -o-animation: bounce_btn 0.5s linear;
    animation: bounce_btn 0.5s linear;
}

.icon {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -12px;
    margin-top: -12px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.stepwizard .arrow {
    opacity: 0;
}

.current_nav .arrow {
    opacity: 1;
    display: block !important;
}

.step_nb {
    display: none;
    width: 50px;
    height: 50px;
    font-family: 'opensans-regular', Helvetica, Arial, sans-serif;
    font-size: 14px;
    letter-spacing: 1px;
    color: #515860;
    background: #f5f5f5;
    margin: 0 auto 50px auto;
    line-height: 50px;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    -ms-border-radius: 100px;
    -o-border-radius: 100px;
    border-radius: 100px;
}

/*  bounce effect animation  */

@-webkit-keyframes bounce_btn {
    0% {
        transform: scale(1);
        -webkit-transform: scale(1);
    }

    30% {
        transform: scale(1.2);
        -webkit-transform: scale(1.2);
    }

    60% {
        transform: scale(0.95);
        -webkit-transform: scale(0.95);
    }

    100% {
        transform: scale(1);
        -webkit-transform: scale(1);
    }
}

@keyframes bounce_btn {
    0% {
        transform: scale(1);
        -webkit-transform: scale(1);
    }

    30% {
        transform: scale(1.2);
        -webkit-transform: scale(1.2);
    }

    60% {
        transform: scale(0.95);
        -webkit-transform: scale(0.95);
    }

    100% {
        transform: scale(1);
        -webkit-transform: scale(1);
    }
}

/*  reponsive css  */

@media (max-width: 750px) {
    .navigation_container ul {
        display: block;
        text-align: center;
        margin-left: 0 !important;
    }

    .navigation_container li {
        display: none;
    }

    .navigation_container li.current_nav {
        display: inline-block;
        float: none;
        margin: 0;
    }

    .wrapper {
        max-width: 660px;
        margin: 50px 20px;
    }

    .step_nb {
        display: block;
    }
}

/* form steps */

/* front center next step */

.current_step.registration {
    height: 420px;
    overflow: overlay;
    margin-bottom: 16px;
}

.current_step>.row {
    margin: 5px;
}

.stepwizard-step p {
    margin-top: 0px;
    color: #666;
}

.stepwizard-row {
    display: inline-block;
    margin: 0 auto;
}

.stepwizard {
    display: flex;
    width: 100%;
    position: relative;
}

.stepwizard .btn.disabled,
.stepwizard .btn[disabled],
.stepwizard fieldset[disabled] .btn {
    opacity: 1 !important;
    color: #bbb;
    background-color: #d8e0eb;
}

.stepwizard-step {
    display: inline-block;
    text-align: center;
    position: relative;
}

.btn-circle {
    width: 10px;
    height: 10px;
    margin-left: 5px;
    text-align: center !important;
    padding: 5px 0 !important;
    font-size: 9px !important;
    line-height: 1.428571 !important;
    border-radius: 50% !important;
}

.btn-success {
    height: 60px;
    position: relative;
    margin: 0 5px 0 5px;
    top: -1px;
    background: #51c57e !important;
    border-color: #51c57e !important;
    cursor: pointer;
    -webkit-animation: bounce_btn 0.5s linear;
    -moz-animation: bounce_btn 0.5s linear;
    -ms-animation: bounce_btn 0.5s linear;
    -o-animation: bounce_btn 0.5s linear;
    animation: bounce_btn 0.5s linear;
}

.stepwizard-step.current_nav .arrow {
    opacity: 1;
    display: block !important;
    fill: transparent;
}

.next-step-1 {
    display: flex;
    position: absolute;
    bottom: 20px;
    z-index: 9;
    right: 389px;
}

.nextStepRight-1 {
    right: 384px !important;
}

.next-step-2 {
    display: flex;
    position: absolute;
    bottom: 20px;
    z-index: 9;
    right: 370px;
}

.nextStepRight-2 {
    right: 366px !important;
}

.next-step-3 {
    display: flex;
    position: absolute;
    bottom: 20px;
    z-index: 9;
    right: 352px;
}

.next-step-4 {
    display: flex;
    position: absolute;
    bottom: 20px;
    z-index: 9;
    right: 334px;
}

.nextStepRight-4 {
    right: 341px !important;
}

.next-step-5 {
    display: flex;
    position: absolute;
    bottom: 20px;
    z-index: 9;
    right: 317px;
}

.nextStepRight-5 {
    right: 324px !important;
}

.key-wrap {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.text-required {
    border-width: 0 !important;
    border-style: solid !important;
    border-color: #2a2f3c;
    border-left-width: 5px !important;
    background-color: #eee !important;
    padding-left: 10px !important;
    outline: 0 !important;
    display: block;
    width: 100%;
    height: 32px;
    padding: 5px 10px;
    font-size: 13px;
    line-height: 1.54;
    color: #263238;
    background-color: #ffffff;
    background-image: none;
    /* border: 1px solid #e0e0e0; */
    border-radius: 2px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s,
        box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input.text-required::-webkit-input-placeholder,
textarea.text-required::-webkit-input-placeholder {
    color: #90a4ae;
}

textarea.text-required {
    height: auto;
}

.has-error .text-required {
    border-color: #c41411;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.text-required:focus {
    border-color: #03a9f4 !important;
}

.btn-select {
    background-color: #51c57e;
}

.current_nav .btn-success .arrow {
    fill: #fff;
}

/* front center next step */

/* area line */

.line-chart {
    -webkit-animation: fadeIn 600ms cubic-bezier(0.57, 0.25, 0.65, 1) 1 forwards;
    animation: fadeIn 600ms cubic-bezier(0.57, 0.25, 0.65, 1) 1 forwards;
    opacity: 0;
    max-width: 640px;
    width: 100%;
}

.aspect-ratio {
    height: 0;
    padding-bottom: 50%;
}

@-webkit-keyframes fadeIn {
    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    to {
        opacity: 1;
    }
}

/* date css */

[type='date'] {
    background: #fff url(../img/calendar_2.png) 98% 50% no-repeat;
}

[type='date']::-webkit-inner-spin-button {
    display: none;
}

[type='date']::-webkit-calendar-picker-indicator {
    opacity: 0;
}

[type='date'].form-control:focus {
    background: url(../img/calendar_2.png) 98% 50% no-repeat;
}

.date-input {
    border-width: 0 !important;
    border-style: solid !important;
    border-color: #2a2f3c;
    background-color: #eee !important;
    padding-left: 10px !important;
    outline: 0 !important;
    display: block;
    width: 100%;
    height: 32px;
    padding: 5px 10px;
    font-size: 13px;
    line-height: 1.54;
    color: #263238;
    background-color: #ffffff;
    /* border: 1px solid #e0e0e0; */
    border-radius: 2px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s,
        box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    /*-webkit-transition: all .5s cubic-bezier(0.4, 0, 1, 1);
    -moz-transition: all .5s cubic-bezier(0.4, 0, 1, 1);
    -ms-transition: all .5s cubic-bezier(0.4, 0, 1, 1);
    -o-transition: all .5s cubic-bezier(0.4, 0, 1, 1);
    transition: all .5s cubic-bezier(0.4, 0, 1, 1);*/
}

.text-input {
    border-width: 0 !important;
    border-style: solid !important;
    border-color: #2a2f3c !important;
    border-left-width: 5px !important;
    background-color: #eee !important;
    padding-left: 10px !important;
    outline: 0 !important;
}

.text-input:focus {
    border-color: #03a9f4 !important;
}

/* scrollbar body */

/* width */

::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-button {
    background-size: cover;
    height: 8px;
    background-position: 7px 7px;
    width: 8px;
    -webkit-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.2);
    box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.2);
}

::-webkit-scrollbar-button:horizontal:increment {
    background-image: url(https://image.flaticon.com/icons/svg/25/25446.svg);
}

::-webkit-scrollbar-button:horizontal:decrement {
    background-image: url(https://image.flaticon.com/icons/svg/25/25184.svg);
}

::-webkit-scrollbar-button:vertical:increment {
    background-image: url(https://image.flaticon.com/icons/svg/25/25243.svg);
}

::-webkit-scrollbar-button:vertical:decrement {
    background-image: url(https://image.flaticon.com/icons/svg/25/25330.svg);
}

/* Track */

::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
}

/* Handle */

::-webkit-scrollbar-thumb {
    background: #2a2f3c;
    border-radius: 0;
}

/* Handle on hover */

::-webkit-scrollbar-thumb:hover {
    background: #1d94ee;
}

/* scrollbar modal */

/* width */

.scrollbarModal::-webkit-scrollbar {
    width: 15px;
    height: 15px;
}

.scrollbarModal::-webkit-scrollbar-button {
    background-size: cover;
    height: 11px;
    background-position: 15px 13px;
    width: 11px;
    -webkit-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.2);
    box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.2);
}

.scrollbarModal::-webkit-scrollbar-button:horizontal:increment {
    background-image: url(https://image.flaticon.com/icons/svg/25/25446.svg);
}

.scrollbarModal::-webkit-scrollbar-button:horizontal:decrement {
    background-image: url(https://image.flaticon.com/icons/svg/25/25184.svg);
}

.scrollbarModal::-webkit-scrollbar-button:vertical:increment {
    background-image: url(https://image.flaticon.com/icons/svg/25/25243.svg);
}

.scrollbarModal::-webkit-scrollbar-button:vertical:decrement {
    background-image: url(https://image.flaticon.com/icons/svg/25/25330.svg);
}

/* Track */

.scrollbarModal::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 5px;
}

/* Handle */

.scrollbarModal::-webkit-scrollbar-thumb {
    background: #2a2f3c;
    border-radius: 5px;
}

/* Handle on hover */

.scrollbarModal::-webkit-scrollbar-thumb:hover {
    background: #1d94ee;
}

/*Loading*/

/*.k-grid-footer{
    display: none;
}*/

#loader {
    bottom: 0;
    height: 175px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 175px;
    z-index: 9999999;
}

#loader .dot {
    bottom: 0;
    height: 100%;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 87.5px;
}

#loader .dot::before {
    border-radius: 100%;
    content: '';
    height: 87.5px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: scale(0);
    width: 87.5px;
}

#loader .dot:nth-child(7n + 1) {
    transform: rotate(45deg);
}

#loader .dot:nth-child(7n + 1)::before {
    animation: 0.8s linear 0.1s normal none infinite running load;
    background: #1d94ee none repeat scroll 0 0;
}

#loader .dot:nth-child(7n + 2) {
    transform: rotate(90deg);
}

#loader .dot:nth-child(7n + 2)::before {
    animation: 0.8s linear 0.2s normal none infinite running load;
    background: #1d94ee none repeat scroll 0 0;
}

#loader .dot:nth-child(7n + 3) {
    transform: rotate(135deg);
}

#loader .dot:nth-child(7n + 3)::before {
    animation: 0.8s linear 0.3s normal none infinite running load;
    background: #1d94ee none repeat scroll 0 0;
}

#loader .dot:nth-child(7n + 4) {
    transform: rotate(180deg);
}

#loader .dot:nth-child(7n + 4)::before {
    animation: 0.8s linear 0.4s normal none infinite running load;
    background: #1d94ee none repeat scroll 0 0;
}

#loader .dot:nth-child(7n + 5) {
    transform: rotate(225deg);
}

#loader .dot:nth-child(7n + 5)::before {
    animation: 0.8s linear 0.5s normal none infinite running load;
    background: #1d94ee none repeat scroll 0 0;
}

#loader .dot:nth-child(7n + 6) {
    transform: rotate(270deg);
}

#loader .dot:nth-child(7n + 6)::before {
    animation: 0.8s linear 0.6s normal none infinite running load;
    background: #1d94ee none repeat scroll 0 0;
}

#loader .dot:nth-child(7n + 7) {
    transform: rotate(315deg);
}

#loader .dot:nth-child(7n + 7)::before {
    animation: 0.8s linear 0.7s normal none infinite running load;
    background: #1d94ee none repeat scroll 0 0;
}

#loader .dot:nth-child(7n + 8) {
    transform: rotate(360deg);
}

#loader .dot:nth-child(7n + 8)::before {
    animation: 0.8s linear 0.8s normal none infinite running load;
    background: #1d94ee none repeat scroll 0 0;
}

#loader .lading {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    bottom: -40px;
    height: 20px;
    left: 0;
    position: absolute;
    right: 0;
    width: 180px;
}

@keyframes load {
    100% {
        opacity: 0;
        transform: scale(1);
    }
}

@keyframes load {
    100% {
        opacity: 0;
        transform: scale(1);
    }
}

/*Loading*/

/* modal right&left */

.modal.left .modal-dialog,
.modal.right .modal-dialog {
    position: fixed;
    margin: auto;
    width: 320px;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
}

.modal.left .modal-content,
.modal.right .modal-content {
    height: 100%;
    overflow-y: auto;
}

.modal.left .modal-body,
.modal.right .modal-body {
    padding: 15px 15px 80px;
}

/*Left*/

.modal.left.fade .modal-dialog {
    left: -320px;
    -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
    -o-transition: opacity 0.3s linear, left 0.3s ease-out;
    transition: opacity 0.3s linear, left 0.3s ease-out;
}

.modal.left.fade.in .modal-dialog {
    left: 0;
}

/*Right*/

.modal.right.fade .modal-dialog {
    right: -320px;
    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
    -o-transition: opacity 0.3s linear, right 0.3s ease-out;
    transition: opacity 0.3s linear, right 0.3s ease-out;
}

.modal.right.fade.in .modal-dialog {
    right: 0;
}

/* language switcher */

.infobar .lp-card .lp-card-body .lp-body-line.lang {
    display: flex;
    padding-top: 5px;
}

.lang-switcher {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.lang-switcher li {
    display: inline-block;
    border-right: 1px solid #009ac9;
}

.lang-switcher li:last-child {
    border-right: none;
}

.lang-switcher li a {
    padding: 3px 5px;
    color: #303030;
    transition: all 0.5s ease;
    text-decoration: none;
    display: inline-block;
    height: 100%;
    min-width: 40px;
    text-align: center;
}

.lang-switcher li a:hover {
    text-decoration: none;
}

.lang-switcher li a.is-active {
    color: #000000;
    cursor: default;
}

/* modifiers */

.lang-switcher.lang-switcher--pill,
.lang-switcher.lang-switcher--rounded-pill {
    border: 1px solid #009ac9;
    border-radius: 3px;
}

.lang-switcher.lang-switcher--pill a:hover,
.lang-switcher.lang-switcher--rounded-pill a:hover {
    background: #009ac9;
    color: #ffffff;
}

.lang-switcher.lang-switcher--pill a.is-active,
.lang-switcher.lang-switcher--rounded-pill a.is-active {
    background-color: #009ac9;
    color: #ffffff;
}

.lang-switcher.lang-switcher--rounded-pill {
    border-radius: 15px;
}

.lang-switcher.lang-switcher--rounded-pill li:first-child a {
    padding-left: 10px;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}

.lang-switcher.lang-switcher--rounded-pill li:last-child a {
    padding-right: 10px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

.mesajlar-card {
    position: relative;
    margin-bottom: 10px;
    background-color: #ffffff;
    color: #313534;
    border-radius: 2px;
    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
    transition: 0.25s linear;
}

.mesajlar-card .m-card-body:hover {
    cursor: pointer;
}

.mesajlar-card.select-msg {
    background-color: #baddc0;
}

.mesajlar-card:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

.mesajlar-card .m-card-body {
    position: relative;
    padding: 15px 20px;
    display: block;
}

.m-card-body:before {
    content: '';
    position: absolute;
    display: block;
    width: 4px;
    left: -1px;
    top: -1px;
    bottom: -1px;
    background: #4caf50;
}

.mesajlar-card .m-card-body .mc-header {
    width: 250px;
    display: table-cell;
    vertical-align: middle;
    padding: 0 20px 0 10px;
}

.mesajlar-card .m-card-body .mc-content {
    width: 100%;
    display: inline-block;
    border-left: 1px solid #455a64;
    padding: 0 10px 0 20px;
}

.mesajlar-card .m-card-body .mc-content p {
    margin: 0;
}

.mesajlar-card .m-card-body .mc-header span:first-child {
    display: block;
    font-size: 14px;
    font-weight: 600;
    padding-bottom: 5px;
}

.mesajlar-card .m-card-body .mc-header span:nth-child(2) {
    color: #607d8b;
}

.captcha {
    text-align: right;
    letter-spacing: 12px;
}

/* pin */

body.wrong {
    -webkit-animation: bg-red 1s ease-in;
    animation: bg-red 1s ease-in;
}

body.correct {
    -webkit-animation: bg-green 1s ease-in;
    animation: bg-green 1s ease-in;
}

#inspiration {
    position: fixed;
    right: 1em;
    bottom: 1em;
}

#inspiration a {
    display: inline-block;
    text-decoration: none;
    font-weight: bold;
    color: white;
    transition: all 1s ease;
}

#inspiration a:hover {
    color: #212121;
}

#inspiration p {
    margin: 0;
    padding-left: 0.4em;
    display: inline-block;
    color: rgba(255, 255, 255, 0.6);
}

#pin {
    background: #2a2f3c;
    width: 20em;
    min-width: 320px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 1em;
    border-radius: 0.3em;
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.3);
    margin: auto;
    color: rgba(255, 255, 255, 0.2);
}

.dots {
    width: 50%;
    display: flex;
    justify-content: space-around;
    padding: 1em;
    padding-top: 3em;
}

.dot {
    position: relative;
    background: rgba(255, 255, 255, 0);
    border-radius: 0.8em;
    width: 0.8em;
    height: 0.8em;
    -webkit-transform: scale3d(0.7, 0.7, 0.7);
    transform: scale3d(0.7, 0.7, 0.7);
}

.dot.active {
    -webkit-animation: growDot 0.5s ease;
    animation: growDot 0.5s ease;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

.dot.wrong {
    -webkit-animation: wrong 0.9s ease;
    animation: wrong 0.9s ease;
}

.dot.correct {
    -webkit-animation: correct 0.9s ease;
    animation: correct 0.9s ease;
}

#pin p {
    font-size: 0.8em;
}

.numbers {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: space-around;
    align-content: flex-end;
    margin: 2em 0;
}

.number,
.tClear {
    position: relative;
    width: 2.5em;
    height: 2.5em;
    margin: 0.5em;
    border-radius: 2.5em;
    border: 2px solid rgba(255, 255, 255, 0);
    text-align: center;
    line-height: 2.5em;
    font-weight: 400;
    font-size: 1.8em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: all 0.5s ease;
}

.number:hover,
.tClear:hover {
    color: rgba(255, 255, 255, 0.5);
}

.number:hover:before,
.tClear:hover:before {
    border: 2px solid rgba(255, 255, 255, 0.5);
}

.number:before,
.tClear:before {
    content: '';
    position: absolute;
    left: -2px;
    width: 2.5em;
    height: 2.5em;
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 2.5em;
    transition: all 0.5s ease;
}

.number.grow:before,
.tClear.grow:before {
    -webkit-animation: grow 0.6s ease;
    animation: grow 0.6s ease;
}

@-webkit-keyframes growDot {
    100% {
        background: white;
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }
}

@keyframes growDot {
    100% {
        background: white;
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }
}

@-webkit-keyframes grow {
    50% {
        -webkit-transform: scale3d(1.5, 1.5, 1.5);
        transform: scale3d(1.5, 1.5, 1.5);
    }

    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes grow {
    50% {
        -webkit-transform: scale3d(1.5, 1.5, 1.5);
        transform: scale3d(1.5, 1.5, 1.5);
    }

    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@-webkit-keyframes wrong {
    20% {
        background: crimson;
    }

    40% {
        -webkit-transform: translate(-15px, 0);
        transform: translate(-15px, 0);
    }

    60% {
        -webkit-transform: translate(10px, 0);
        transform: translate(10px, 0);
    }

    80% {
        -webkit-transform: translate(-5px, 0);
        transform: translate(-5px, 0);
    }
}

@keyframes wrong {
    20% {
        background: crimson;
    }

    40% {
        -webkit-transform: translate(-15px, 0);
        transform: translate(-15px, 0);
    }

    60% {
        -webkit-transform: translate(10px, 0);
        transform: translate(10px, 0);
    }

    80% {
        -webkit-transform: translate(-5px, 0);
        transform: translate(-5px, 0);
    }
}

@-webkit-keyframes correct {
    20% {
        background: limegreen;
    }

    40% {
        -webkit-transform: translate(0, -15px);
        transform: translate(0, -15px);
    }

    60% {
        -webkit-transform: translate(0, 10px);
        transform: translate(0, 10px);
    }

    80% {
        -webkit-transform: translate(0, -5px);
        transform: translate(0, -5px);
    }
}

@keyframes correct {
    20% {
        background: limegreen;
    }

    40% {
        -webkit-transform: translate(0, -15px);
        transform: translate(0, -15px);
    }

    60% {
        -webkit-transform: translate(0, 10px);
        transform: translate(0, 10px);
    }

    80% {
        -webkit-transform: translate(0, -5px);
        transform: translate(0, -5px);
    }
}

@-webkit-keyframes bg-red {
    50% {
        background: crimson;
    }
}

@keyframes bg-red {
    50% {
        background: crimson;
    }
}

@-webkit-keyframes bg-green {
    50% {
        background: limegreen;
    }
}

@keyframes bg-green {
    50% {
        background: limegreen;
    }
}

.front .front-right .fr-box.pin {
    height: auto;
    background-color: #fff;
}

.radio-inline+.radio-inline,
.checkbox-inline+.checkbox-inline {
    margin-left: 0 !important;
}

/* calc */

.lp-pin {
    width: auto;
    padding: 12px;
}

.lp-pin .lp-card {
    width: 100%;
}

.lp-pin .lp-card .calc .controllers {
    margin: auto;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: center;
    align-content: center;
}

.lp-pin .lp-card .calc .numbers {
    margin: auto;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: center;
}

.lp-pin .lp-card .calc button {
    position: relative;
    width: 2.5em;
    height: 2.5em;
    margin: 0.5em;
    border-radius: 2.5em;
    border: 2px solid rgba(30, 30, 30, 0);
    text-align: center;
    line-height: 2.5em;
    font-weight: 400;
    font-size: 1.8em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: all 0.5s ease;
    background-color: transparent;
    color: #98a8af;
}

.lp-pin .lp-card .calc .numbers button:before,
.lp-pin .lp-card .calc .controllers button:before {
    content: '';
    position: absolute;
    left: -2px;
    width: 2.5em;
    height: 2.5em;
    border: 2px solid rgba(30, 30, 30, 0.1);
    border-radius: 2.5em;
    transition: all 0.5s ease;
}

.lp-pin .lp-card .calc .numbers button:hover,
.lp-pin .lp-card .calc .controllers button:hover {
    color: #2a2f3c;
}

.lp-pin .lp-card .calc .numbers button:hover:before,
.lp-pin .lp-card .calc .controllers button:hover:before {
    border: 2px solid rgba(30, 30, 30, 0.5);
}

.lp-giris {
    margin: 0.5em;
    text-align: center;
    line-height: 2.5em;
    font-weight: 400;
    font-size: 1.8em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: all 0.5s ease;
    background-color: rgb(29, 148, 238);
    color: #fff;
    border-radius: 2.5em;
    padding: 0 50px;
}

.lp-giris:hover {
    color: #fff;
}

.lp-giris:hover {
    background-color: rgba(97, 97, 97);
}

i.fa-info-circle {
    color: #269cf3;
    transition: 0.25s linear;
    font-size: 18px;
}

i.fa-info-circle:hover {
    color: #303030;
}

i.fa-play-circle {
    color: #c43b3c;
    transition: 0.25s linear;
    font-size: 18px;
}

i.fa-play-circle:hover {
    color: #303030;
}

/* schedule modal */

.scheduleModal .modal-dialog .modal-content .modal-body {
    background-color: #333;
}

.scheduleModal .modal-dialog .modal-content .modal-body h5 {
    color: #fff;
}

.scheduleModal .modal-dialog .modal-content .modal-footer {
    background-color: #333;
    border-top: 1px solid #333;
}

/* schedule modal */

/* schedule modal filter */

.scheduleModalFilter .modal-dialog .modal-content .modal-body {
    background-color: #333;
}

.scheduleModalFilter .modal-dialog .modal-content .modal-body h5 {
    color: #fff;
}

.scheduleModalFilter .modal-dialog .modal-content .modal-body span:first-child {
    color: #fff;
    font-weight: bold;
    display: block;
}

.scheduleModalFilter .modal-dialog .modal-content .modal-body span:nth-child(2) {
    color: #fff;
    display: block;
}

.scheduleModalFilter .modal-dialog .modal-content .modal-footer {
    background-color: #333;
    border-top: 1px solid #333;
}

/* schedule modal filter */

/* schedule */

.rezervasyonFiltre {
    display: grid;
}

*,
*::after,
*::before {
    box-sizing: border-box;
}

.cd-schedule {
    position: relative;
    margin: 0 0;
}

.cd-schedule::before {
    content: 'mobile';
    display: none;
}

.schedule-page {
    padding-top: 25px;
    line-height: 15px;
    display: inline-block;
    margin: 0 auto;
}

.schedule-page .previous-page {
    float: left;
    text-align: right;
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
}

.schedule-page .previous-page button,
.schedule-page .next-page button {
    background: transparent;
    border: 0;
}

.schedule-page .previous-page button[disabled='disabled'],
.schedule-page .next-page button[disabled='disabled'] {
    cursor: no-drop;
}

.schedule-page .previous-page button i.fa-chevron-left {
    font-size: 21px;
    float: left;
    color: #269cf3;
    margin: 0 5px 0 0;
}

.schedule-page .previous-page button span {
    line-height: 20px;
    text-align: right;
    width: 42px;
}

.schedule-page .input-page {
    display: inline-block;
    padding: 4px 5px 0;
}

.schedule-page .next-page {
    float: right;
    text-align: left;
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
}

.schedule-page .next-page button i.fa-chevron-right {
    font-size: 21px;
    float: right;
    color: #269cf3;
    margin: 0 0 0 5px;
    display: block;
}

.schedule-page .next-page button span {
    float: left;
    line-height: 20px;
    text-align: left;
}

.timeline>ul.p-start-0 {
    -webkit-padding-start: 0;
}

.cd-schedule {
    width: 100%;
    margin: 0 auto;
}

.cd-schedule::after {
    clear: both;
    content: '';
    display: block;
}

.cd-schedule::before {
    content: 'desktop';
}

.cd-schedule .timeline {
    display: none;
}

.cd-schedule .timeline {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    padding-top: 50px;
}

.cd-schedule .timeline li {
    position: relative;
    height: 50px;
}

.cd-schedule .timeline li::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #eaeaea;
}

.cd-schedule .timeline li:last-of-type::after {
    display: none;
}

@media only screen and (min-width: 1000px) {}

@media (max-width: 1000px) {
    .cd-schedule .events .events-group {
        width: 100%;
    }

    .cd-schedule .timeline li::after {
        width: calc(100% - 40px);
        left: 40px;
    }

    .cd-schedule .timeline li span {
        display: inline-block;
        transform: translateY(-50%);
        vertical-align: -webkit-baseline-middle;
    }

    .cd-schedule .timeline li:nth-of-type(2n) span {
        display: inline-block;
    }

    .hidden-mobil {
        display: none !important;
        visibility: hidden !important;
    }
}

@media (min-width: 1001px) {
    .cd-schedule .events .events-group.schedule-column-5 {
        width: 20%;
    }

    .cd-schedule .events .events-group {
        width: 20%;
        float: left;
        margin-bottom: 0;
    }

    .cd-schedule .timeline li::after {
        width: calc(100% - 60px);
        left: 60px;
    }

    .cd-schedule .timeline li span {
        display: inline-block;
        transform: translateY(-50%);
        vertical-align: -webkit-baseline-middle;
    }

    .cd-schedule .timeline li:nth-of-type(2n) span {
        display: inline-block;
    }

    .visible-mobil {
        display: none !important;
        visibility: hidden !important;
    }
}

.cd-schedule .events {
    position: relative;
    z-index: 1;
}

.cd-schedule .events .events-group {
    margin-bottom: 30px;
}

.cd-schedule .events .top-info {
    width: 100%;
    padding: 0 5%;
}

.cd-schedule .events .top-info>span {
    display: inline-block;
    line-height: 1.2;
    margin-bottom: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.cd-schedule .events .events-group>ul {
    position: relative;
    padding: 0 5%;
    display: flex;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
}

.cd-schedule .events .events-group>ul::after {
    display: inline-block;
    content: '-';
    width: 1px;
    height: 100%;
    opacity: 0;
    color: transparent;
}

.cd-schedule .events .single-event {
    flex-shrink: 0;
    float: left;
    height: 150px;
    width: 70%;
    max-width: 300px;
    box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.2);
    margin-right: 20px;
    transition: opacity 0.2s, background 0.2s;
}

.cd-schedule .events .single-event:last-of-type {
    margin-right: 5%;
}

.cd-schedule .events .single-event a {
    display: block;
    height: 100%;
    padding: 0.8em;
}

@media only screen and (min-width: 550px) {
    .cd-schedule .events .single-event {
        width: 40%;
    }
}

.cd-schedule .events {
    float: left;
    width: 100%;
}

.cd-schedule .events .events-group.schedule-column-1 {
    width: 100%;
}

.cd-schedule .events .events-group.schedule-column-2 {
    width: 50%;
}

.cd-schedule .events .events-group.schedule-column-3 {
    width: 33%;
}

.cd-schedule .events .events-group.schedule-column-4 {
    width: 25%;
}

.cd-schedule .events .events-group.schedule-column-5- {
    width: 20%;
}

.cd-schedule .events .events-group.schedule-column-6 {
    width: 16.66%;
}

.cd-schedule .events .events-group.schedule-column-7 {
    width: 14.26%;
}

.cd-schedule .events .events-group.schedule-column-8 {
    width: 12.5%;
}

.cd-schedule .events .events-group.schedule-column-9 {
    width: 11.1%;
}

.cd-schedule .events .events-group.schedule-column-10 {
    width: 10%;
}

.cd-schedule .events .events-group.schedule-column-11 {
    width: 9.09%;
}

.cd-schedule .events .events-group.schedule-column-12 {
    width: 8.33%;
}

.cd-schedule .events .events-group.schedule-column-13 {
    width: 7.69%;
}

.cd-schedule .events .events-group.schedule-column-14 {
    width: 7.14%;
}

.cd-schedule .events .events-group.schedule-column-15 {
    width: 6.66%;
}

.cd-schedule .events .events-group.schedule-column-16 {
    width: 6.25%;
}

.cd-schedule .events .events-group.schedule-column-17 {
    width: 5.88%;
}

.cd-schedule .events .events-group.schedule-column-18 {
    width: 5.55%;
}

.cd-schedule .events .events-group.schedule-column-19 {
    width: 5.26%;
}

.cd-schedule .events .events-group.schedule-column-20 {
    width: 5%;
}

/* ... */
.cd-schedule .events .events-group.schedule-column-26 {
    width: 3.84%;
}

.cd-schedule .events .events-group.schedule-column-27 {
    width: 3.7%;
}

/* ... */

.cd-schedule .events .events-group.schedule-column-35 {
    width: 2.85%;
}

.cd-schedule .events .events-group:not(:first-of-type) {
    border-left-width: 0;
}

.cd-schedule .events .top-info {
    display: table;
    height: 50px;
    border-bottom: 1px solid #eaeaea;
    padding: 0;
}

.cd-schedule .events .top-info>span {
    display: table-cell;
    vertical-align: middle;
    padding: 0 0.5em;
    text-align: center;
    font-weight: 600;
    margin-bottom: 0;
    text-transform: uppercase;
}

.cd-schedule .events .events-group>ul {
    height: 1450px;
    display: block;
    overflow: visible;
    padding: 0;
    border: 1px solid #eaeaea;
}

.cd-schedule .events .events-group>ul::after {
    clear: both;
    content: '';
    display: block;
}

.cd-schedule .events .events-group>ul::after {
    display: none;
}

.cd-schedule .events .single-event {
    position: absolute;
    z-index: 3;
    width: calc(100% + 2px);
    left: -1px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), inset 0 -3px 0 rgba(0, 0, 0, 0.2);
    flex-shrink: 1;
    height: auto;
    max-width: none;
    margin-right: 0;
}

.cd-schedule .events .single-event a {
    padding: 1.2em;
}

.cd-schedule .events .single-event:last-of-type {
    margin-right: 0;
}

.cd-schedule .events .single-event.selected-event {
    visibility: hidden;
}

@media only screen and (min-width: 1000px) {
    .cd-schedule .events {
        width: calc(100% - 20px);
        margin-left: 20px;
    }
}

.cd-schedule.loading .events .single-event {
    opacity: 0;
}

.cd-schedule .event-name,
.cd-schedule .event-date {
    display: block;
    color: #fff;
    font-weight: 700;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.cd-schedule .event-name {
    font-size: 2.4rem;
    opacity: 0.9999;
}

.cd-schedule .event-name {
    font-size: 1.5rem;
    height: calc(100% - 10px);
}

.cd-schedule .event-date {
    font-size: 1.4rem;
    opacity: 0.7;
    line-height: 1.2;
    margin-bottom: 0.2em;
}

.cd-schedule .single-event[data-event='event-1'],
.cd-schedule [data-event='event-1'] .header-bg {
    background: #90a4ae;
}

.cd-schedule .event-1 {
    background: #90a4ae;
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    display: block;
    transition: all 0.4s ease;
    z-index: 0;
}

.cd-schedule .single-event:hover .event-1 {
    width: 100%;
}

.cd-schedule .single-event[data-event='event-2'],
.cd-schedule [data-event='event-2'] .header-bg {
    background: #8f94fb;
}

.cd-schedule .event-2 {
    background: #4e54c8;
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    display: block;
    transition: all 0.4s ease;
    z-index: 0;
}

.cd-schedule .event-dolu {
    padding: 15px 0 0 15px;
    font-size: 18px;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
}

.cd-schedule .single-event:hover .event-2 {
    width: 100%;
}

.cd-schedule .single-event[data-event='event-3'],
.cd-schedule [data-event='event-3'] .header-bg {
    background: #c28ce2;
}

.cd-schedule .event-3 {
    background: #a726f5;
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    display: block;
    transition: all 0.4s ease;
    z-index: 0;
}

.cd-schedule .single-event:hover .event-3 {
    width: 100%;
}

.cd-schedule .single-event[data-event='event-4'],
.cd-schedule [data-event='event-4'] .header-bg {
    background: #dd3e54;
}

.cd-schedule .event-4 {
    background: #a73737;
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    display: block;
    transition: all 0.4s ease;
    z-index: 0;
}

.cd-schedule .single-event:hover .event-4 {
    width: 100%;
}

.cd-schedule .single-event[data-event='event-5'],
.cd-schedule [data-event='event-5'] .header-bg {
    background: #44a08d;
}

.cd-schedule .event-5 {
    background: #093637;
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    display: block;
    transition: all 0.4s ease;
    z-index: 0;
}

.cd-schedule .single-event:hover .event-5 {
    width: 100%;
}

.cd-schedule .event-modal .header {
    position: relative;
    height: 70px;
    display: table;
    width: 100%;
}

.cd-schedule .event-modal .header .content {
    position: relative;
    z-index: 3;
    display: table-cell;
    vertical-align: middle;
    padding: 0.6em 5%;
}

.cd-schedule .event-modal .body {
    position: relative;
    width: 100%;
    height: calc(100% - 70px);
}

.cd-schedule .event-modal .event-info {
    position: relative;
    z-index: 2;
    line-height: 1.4;
    height: 100%;
    overflow: hidden;
}

.cd-schedule .event-modal .event-info>div {
    overflow: auto;
    height: 100%;
    padding: 1.4em 5%;
}

.cd-schedule .event-modal .event-footer {
    bottom: 30px;
    position: fixed;
}

.cd-schedule .event-modal .header-bg,
.cd-schedule .event-modal .body-bg {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.cd-schedule .event-modal .body-bg {
    z-index: 1;
    background: #fff;
    transform-origin: top left;
}

.cd-schedule .event-modal .header-bg {
    z-index: 2;
    transform-origin: top center;
}

.cd-schedule .event-modal .close {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
    background: rgba(0, 0, 0, 0.1);
    color: transparent;
    white-space: nowrap;
    text-indent: 100%;
    height: 70px;
    width: 70px;
}

.cd-schedule .event-modal .close::before,
.cd-schedule .event-modal .close::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2px;
    height: 22px;
    background: #fff;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.cd-schedule .event-modal .close::before {
    transform: translateX(-50%) translateY(-50%) rotate(45deg);
}

.cd-schedule .event-modal .close::after {
    transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}

.cd-schedule .event-modal .event-date {
    display: none;
}

.cd-schedule .event-modal.no-transition {
    transition: none;
}

.cd-schedule .event-modal.no-transition .header-bg,
.cd-schedule .event-modal.no-transition .body-bg {
    transition: none;
}

.cd-schedule .event-modal {
    right: auto;
    width: auto;
    height: auto;
    transform: translateX(0);
    will-change: transform, width, height;
    transition: height 0.4s, width 0.4s, transform 0.4s, visibility 0.4s;
    transition-timing-function: cubic-bezier(0.5, 0, 0.1, 1);
}

.cd-schedule .event-modal .header {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    height: 100%;
}

.cd-schedule .event-modal .header .content {
    display: block;
    padding: 0.8em;
}

.cd-schedule .event-modal .event-info>div {
    padding: 2em 3em 2em 2em;
}

.cd-schedule .event-modal .body {
    height: 100%;
    width: auto;
}

.cd-schedule .event-modal .header-bg,
.cd-schedule .event-modal .body-bg {
    transform: translateZ(0);
    will-change: transform;
    backface-visibility: hidden;
}

.cd-schedule .event-modal .header-bg {
    transition: transform 0.4s;
    transition-timing-function: cubic-bezier(0.5, 0, 0.1, 1);
}

.cd-schedule .event-modal .body-bg {
    opacity: 0;
    transform: none;
}

.cd-schedule .event-modal .event-date {
    display: block;
}

.cd-schedule .event-modal .close,
.cd-schedule .event-modal .event-info {
    opacity: 0;
}

.cd-schedule .event-modal .close {
    width: 40px;
    height: 40px;
    background: 0 0;
}

.cd-schedule .event-modal .close::after,
.cd-schedule .event-modal .close::before {
    background: #222;
    height: 16px;
}

@media only screen and (min-width: 1000px) {
    .cd-schedule .event-modal .header .content {
        padding: 1.2em;
    }

    .btn-lp.onayla {
        margin-top: 20px;
    }
}

.cd-schedule.modal-is-open .event-modal {
    transform: translateX(0);
    visibility: visible;
}

.cd-schedule.modal-is-open .event-modal .event-info>div {
    -webkit-overflow-scrolling: touch;
}

.cd-schedule.animation-completed .event-modal .close,
.cd-schedule.content-loaded.animation-completed .event-modal .event-info {
    opacity: 1;
    transition: opacity 0.2s;
}

.cd-schedule.modal-is-open .body-bg {
    opacity: 1;
    transition: transform 0.4s;
    transition-timing-function: cubic-bezier(0.5, 0, 0.1, 1);
}

.cd-schedule .cover-layer {
    position: fixed;
    z-index: 2;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.8);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s, visibility 0.4s;
}

.cd-schedule.modal-is-open .cover-layer {
    opacity: 1;
    visibility: visible;
}

.cd-intro h1 {
    text-align: center;
    padding: 2.6em 5% 0.8em;
    font-weight: 700;
    font-size: 3rem;
}

@media only screen and (min-width: 1000px) {
    .cd-intro h1 {
        font-size: 4rem;
        padding: 2em 5% 0.8em;
    }
}

.cd-nugget-info {
    text-align: center;
    position: absolute;
    width: 100%;
    height: 50px;
    line-height: 50px;
    top: 0;
    left: 0;
}

.cd-nugget-info a {
    position: relative;
    font-size: 14px;
    color: #a2b9b2;
    transition: all 0.2s;
}

.cd-nugget-info a:hover {
    opacity: 0.8;
}

.cd-nugget-info span {
    vertical-align: middle;
    display: inline-block;
}

.cd-nugget-info span svg {
    display: block;
}

.cd-nugget-info .cd-nugget-info-arrow {
    fill: #a2b9b2;
}

#carbonads-container,
#ui8ads-container {
    position: fixed;
    bottom: 40px;
    right: 5%;
    width: 180px;
    display: none;
    z-index: 100;
}

#carbonads-container .close-carbon-adv,
#carbonads-container .close-ui8-adv,
#ui8ads-container .close-carbon-adv,
#ui8ads-container .close-ui8-adv {
    display: inline-block;
    position: absolute;
    top: 0;
    right: 100%;
    background: rgba(68, 52, 83, 0.8);
    text-indent: 100%;
    overflow: hidden;
    width: 32px;
    height: 32px;
}

#carbonads-container .close-carbon-adv:hover,
#carbonads-container .close-ui8-adv:hover,
#ui8ads-container .close-carbon-adv:hover,
#ui8ads-container .close-ui8-adv:hover {
    background: #443453;
}

#carbonads-container .close-carbon-adv::after,
#carbonads-container .close-carbon-adv::before,
#carbonads-container .close-ui8-adv::after,
#carbonads-container .close-ui8-adv::before,
#ui8ads-container .close-carbon-adv::after,
#ui8ads-container .close-carbon-adv::before,
#ui8ads-container .close-ui8-adv::after,
#ui8ads-container .close-ui8-adv::before {
    content: '';
    background-color: #fff;
    height: 2px;
    width: 14px;
    position: absolute;
    top: 14px;
    left: 9px;
}

#carbonads-container .close-carbon-adv::after,
#carbonads-container .close-ui8-adv::after,
#ui8ads-container .close-carbon-adv::after,
#ui8ads-container .close-ui8-adv::after {
    transform: rotate(45deg);
}

#carbonads-container .close-carbon-adv::before,
#carbonads-container .close-ui8-adv::before,
#ui8ads-container .close-carbon-adv::before,
#ui8ads-container .close-ui8-adv::before {
    transform: rotate(-45deg);
}

#carbonads-container .carbonad,
#carbonads-container .ui8ad,
#ui8ads-container .carbonad,
#ui8ads-container .ui8ad {
    background: rgba(255, 255, 255, 0.9);
    border: 0;
    width: 100%;
    height: auto;
    padding: 14px;
    text-align: center;
    border-radius: 0 3px 3px 3px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}

#carbonads-container .carbonad .carbon-img img,
#carbonads-container .ui8ad .carbon-img img,
#ui8ads-container .carbonad .carbon-img img,
#ui8ads-container .ui8ad .carbon-img img {
    margin: 0 10px 10px;
    width: 130px;
}

#carbonads-container .carbonad .carbon-text,
#carbonads-container .carbonad .carbonad-tag,
#carbonads-container .carbonad .carbon-poweredby,
#carbonads-container .ui8ad .carbon-text,
#carbonads-container .ui8ad .carbonad-tag,
#carbonads-container .ui8ad .carbon-poweredby,
#ui8ads-container .carbonad .carbon-text,
#ui8ads-container .carbonad .carbonad-tag,
#ui8ads-container .carbonad .carbon-poweredby,
#ui8ads-container .ui8ad .carbon-text,
#ui8ads-container .ui8ad .carbonad-tag,
#ui8ads-container .ui8ad .carbon-poweredby {
    font-family: helvetica neue, Arial, sans-serif;
}

#carbonads-container .carbonad .carbon-wrap,
#carbonads-container .ui8ad .carbon-wrap,
#ui8ads-container .carbonad .carbon-wrap,
#ui8ads-container .ui8ad .carbon-wrap {
    display: block;
    width: 100%;
    padding: 0;
}

#carbonads-container .carbonad .carbon-wrap a,
#carbonads-container .ui8ad .carbon-wrap a,
#ui8ads-container .carbonad .carbon-wrap a,
#ui8ads-container .ui8ad .carbon-wrap a {
    color: #443453;
    font-size: 13px;
    font-weight: 700;
}

#carbonads-container .carbonad .carbon-wrap a:hover,
#carbonads-container .ui8ad .carbon-wrap a:hover,
#ui8ads-container .carbonad .carbon-wrap a:hover,
#ui8ads-container .ui8ad .carbon-wrap a:hover {
    text-decoration: underline;
}

#carbonads-container .carbonad .carbonad-tag,
#carbonads-container .carbonad .carbon-poweredby,
#carbonads-container .ui8ad .carbonad-tag,
#carbonads-container .ui8ad .carbon-poweredby,
#ui8ads-container .carbonad .carbonad-tag,
#ui8ads-container .carbonad .carbon-poweredby,
#ui8ads-container .ui8ad .carbonad-tag,
#ui8ads-container .ui8ad .carbon-poweredby {
    margin-top: 5px;
    color: #222;
}

#carbonads-container .carbonad .carbonad-tag a,
#carbonads-container .carbonad .carbon-poweredby a,
#carbonads-container .ui8ad .carbonad-tag a,
#carbonads-container .ui8ad .carbon-poweredby a,
#ui8ads-container .carbonad .carbonad-tag a,
#ui8ads-container .carbonad .carbon-poweredby a,
#ui8ads-container .ui8ad .carbonad-tag a,
#ui8ads-container .ui8ad .carbon-poweredby a {
    color: #a2b9b2;
}

#carbonads-container .carbonad .carbonad-tag a:hover,
#carbonads-container .carbonad .carbon-poweredby a:hover,
#carbonads-container .ui8ad .carbonad-tag a:hover,
#carbonads-container .ui8ad .carbon-poweredby a:hover,
#ui8ads-container .carbonad .carbonad-tag a:hover,
#ui8ads-container .carbonad .carbon-poweredby a:hover,
#ui8ads-container .ui8ad .carbonad-tag a:hover,
#ui8ads-container .ui8ad .carbon-poweredby a:hover {
    color: #a2b9b2;
}

#carbonads-container .carbonad .carbon-poweredby,
#carbonads-container .ui8ad .carbon-poweredby,
#ui8ads-container .carbonad .carbon-poweredby,
#ui8ads-container .ui8ad .carbon-poweredby {
    display: inline-block;
    font-size: 11px;
    line-height: 15px;
}

@media only screen and (min-width: 1000px) {

    #carbonads-container,
    #ui8ads-container {
        display: block;
    }
}

ol,
ul {
    list-style: none;
}

/* schedule */

/* one by one effect */

.oneByOne {
    width: 100%;
    /*-webkit-animation: load 5s infinite;*/
    animation: 0.5s ease-out 0s 1 slideInFromRight;
    display: none;
}

@keyframes slideInFromRight {
    0% {
        transform: translateX(100%);
    }

    100% {
        transform: translateX(0);
    }
}

.oneByTwo {
    width: 100%;
    /*-webkit-animation: load 5s infinite;*/
    animation: 0.8s ease-out 0s 1 slideInFromLeft;
    display: none;
}

@keyframes slideInFromLeft {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(0);
    }
}

.oneByDel {
    width: 100%;
    /*-webkit-animation: load 5s infinite;*/
    animation: 0.8s ease-out 0s 1 fadeOut;
    display: none;
}

@keyframes fadeOut {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(0);
    }
}

ul.scroll-content li {
    position: relative;
}

#topnav .toolbar .dropdown-menu.messages ul li a.msg-remove {
    position: absolute !important;
    top: 16px;
    padding: 0 !important;
    right: 16px;
    line-height: 16px;
    font-size: 11px;
    color: #cfd8dc;
    z-index: 9999;
}

/* payment card */

.input-group:before,
.input-group:after {
    content: '';
    display: table;
}

.input-group-icon {
    position: relative;
}

.input-group-icon input {
    padding-left: 4.4em;
}

.input-group-icon .input-icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 3.4em;
    height: 2.5em;
    line-height: 3.4em;
    text-align: center;
    pointer-events: none;
}

.input-group-icon .input-icon i {
    padding: 0 10px;
    margin: 10px 6px;
}

.input-group-icon>.input-icon>i {
    position: relative;
    display: block;
    margin: 10px 8px;
    line-height: 14px;
    color: #90a4ae;
    transition: 0.25s linear;
}

input:focus+.input-icon>i {
    color: #008ff9;
    transition: 0.25s linear;
}

.input-group-icon .input-icon::after {
    position: absolute;
    top: 0.6em;
    bottom: 0.6em;
    left: 3.4em;
    display: block;
    border-right: 1px solid #e5e5e5;
    content: '';
    -webkit-transition: 0.35s ease-in-out;
    -moz-transition: 0.35s ease-in-out;
    -o-transition: 0.35s ease-in-out;
    transition: 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
}

.card-list-wrapper {
    box-shadow: inset 0 20px 0 0 #fff;
    width: 100%;
    margin: 15px 0 0 0;
}

.card-list-wrapper ul.card-list {
    width: 100%;
    padding: 0;
    list-style: none;
    float: left;
}

.card-list-wrapper ul.card-list li a {
    display: block;
    font-weight: 700;
    color: #484848;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.card-list-wrapper ul.card-list li .content {
    margin-top: 15px;
    min-height: 10px;
    width: 96px;
    display: block;
}

.card-list-wrapper .content span.card-number {
    display: block;
    font-size: 9px;
}

.card-list-wrapper .content span.expire-date {
    display: block;
    font-size: 10px;
}

.card-list-wrapper ul.card-list li .credit-card-icon {
    width: 65px;
    height: 23px;
    position: absolute;
    right: 9px;
    top: 40px;
    font-size: 12px;
    margin-right: 0;
    margin: 0 5px 0 0;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #f8f8f8 !important;
}

/* odeme */
.odeme-panel {
    background: white;
    border: none;
    text-align: center;
}

.odeme-panel .flex {
    display: inline-flex;
}

.odeme-panel .flex a {
    color: #fff;
    border-radius: 25px;
    border-style: none;
    padding: 6px 12px;
    margin: 10px 0;
    background: #269cf3;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}

.odeme-panel .flex a:hover {
    opacity: 0.8;
}

.odeme-logo {
    text-align: center;
    display: block;
    margin-top: 50px;
    margin-bottom: 50px;
}

.odeme-logo img {
    width: 100px;
}

/* odeme */
.giris-panel {
    background: #fff;
    border: none;
    text-align: center;
}

.giris-panel .flex {
    display: inline-flex;
}

.giris-panel .flex a {
    color: #fff;
    border-radius: 25px;
    border-style: none;
    padding: 6px 12px;
    margin: 10px 0;
    background: #269cf3;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}

.giris-panel .flex a:hover {
    opacity: 0.8;
}

.giris-logo {
    text-align: center;
    display: block;
}

.giris-logo img {
    width: 250px;
}

/* card checkbox */

.card {
    float: left;
    margin-right: 10px;
    margin-bottom: 4px;
}

.card input[name='checkgroup'] {
    float: left;
    opacity: 0;
    /*background:rgba(255,255,255,0);
    opacity:0;
    filter: alpha(opacity=10);*/
    outline: none;
    border: none;
    display: none;
}

.card input[type='radio']::before {
    /*content:attr(data-hover);*/
    border: 2px solid #22252e;
    border-radius: 40px;
    height: 50px;
    line-height: 46px;
    opacity: 0.3;
    color: #22252e;
    filter: alpha(opacity=10);
    padding: 0 24.5px;
    float: left;
    font-size: 18px;
    white-space: nowrap;
}

.card label.selected {
    width: 190px;
    height: 105px;
    border-radius: 4px;
    border: solid 1px #979797;
    float: left;
    position: relative;
    padding: 10px;
    cursor: pointer;
    display: block;
    transition: 0.25s linear;
}

.card input[type='radio']:checked+label.selected {
    opacity: 1;
    border: 1px solid #8bd5f7;
    background-color: #8bd5f7;
}

p.note {
    display: inline-block;
    margin-left: 5px;
}

.dinamic-page-wrapper legend {
    font-weight: 500;
    font-size: 18px;
    margin: 10px;
    width: auto;
}

.form-group {
    margin-bottom: 10px !important;
}

.profile-pic {
    width: 125px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: absolute;
    margin-left: 25px;
}

.panel-heading.collapsed .fa-chevron-down,
.panel-heading .fa-chevron-right {
    display: none;
}

.panel-heading.collapsed .fa-chevron-right,
.panel-heading .fa-chevron-down {
    display: inline-block;
}

/*
i.fa {
    cursor: pointer;
    margin-right: 5px;
}
*/

.collapsed~.panel-body {
    padding: 0;
}

.panel.panel-filtre {
    border-color: #37474f;
    background-color: #37474f;
    margin: 0;
}

.panel.panel-filtre .panel-body {
    padding: 0;
}

.rezervasyonFiltre .panel-heading {
    border-color: #37474f;
    position: absolute;
    top: -48px;
    height: 38px;
    padding: 7px 20px !important;
    border-radius: 3px;
    right: 0;
}

.overlay-profile {
    align-items: center;
    box-sizing: border-box;
    color: rgba(255, 255, 255, 0.6);
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    font-size: 13px;
    height: 100%;
    -webkit-justify-content: center;
    justify-content: center;
    line-height: 15px;
    position: absolute;
    text-transform: uppercase;
    top: 0;
    width: 100%;
    opacity: 0;
    transition: 0.25s linear;
}

.overlay-bg {
    background-color: rgba(30, 30, 30, 0.5);
    border-radius: 50%;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    padding-top: 15px;
}

.profile-pic:hover .overlay-profile,
.profile-pic:hover .profile-btn-top {
    opacity: 1;
}

.profile-pic .pp-img {
    height: 123px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 50%;
}

.profile-btn-top {
    position: absolute;
    text-align: center;
    opacity: 0;
    right: 0;
    left: 0;
    align-items: center;
    box-sizing: border-box;
    color: rgba(255, 255, 255, 0.6);
    display: flex;
    height: 100%;
    justify-content: center;
    top: 0;
    width: 100%;
    transition: 0.25s linear;
    background-color: rgba(30, 30, 30, 0.5);
    border-radius: 50%;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.profile-btn-top span.btn-file {
    vertical-align: inherit;
}

.profile-btn-top span {
    position: relative;
}

.profile-btn-top span.fileinput-exists i.fa-times {
    font-size: 18px;
    padding-right: 5px;
}

.profile-btn-top span.fileinput-exists i.fa-exchange {
    font-size: 18px;
    padding-left: 5px;
}

.profile-btn-top span.fileinput-new i {
    font-size: 18px;
}

.profile-btn-top i {
    color: #fff;
}

.btn-lp.profile {
    color: #fff !important;
    background-color: #37b046;
    border-color: #37b046;
}

.btn-lp.profile:hover {
    color: #37b046 !important;
    background-color: #fff;
    border-color: #37b046;
}

.thumbnail {
    background-color: transparent !important;
    border: 1px solid transparent !important;
}

.fileinput .thumbnail>img {
    border-radius: 50%;
}

.fileinput {
    margin-bottom: 0 !important;
}

.fileinput .thumbnail {
    margin-bottom: 0 !important;
    padding: 0;
    position: absolute;
}

.fileinput .thumbnail>img {
    height: -webkit-fill-available;
}

footer {
    padding: 5px 30px;
}

/* captcha */

.ReloadBtn {
    background: url('https://cdn3.iconfinder.com/data/icons/basic-interface/100/update-64.png') left top no-repeat;
    background-size: 100%;
    width: 22px;
    height: 22px;
    border: 0px;
    /*outline none;*/
    position: absolute;
    bottom: 20px;
    outline: none;
    cursor: pointer;
}

.error {
    color: red;
    font-size: 12px;
    display: none;
}

.success {
    color: green;
    font-size: 18px;
    margin-bottom: 15px;
    display: none;
}

.hoverOpenSidebar {
    visibility: visible;
}

body.sidebar-collapsed .static-sidebar-wrapper .widget nav.widget-body>ul>li:hover+.hoverOpenSidebar {
    visibility: visible;
}

/* table */

@media only screen and (max-width: 800px) {

    /* Force table to not be like tables anymore */
    .no-more-table table,
    .no-more-table thead,
    .no-more-table tbody,
    .no-more-table th,
    .no-more-table td,
    .no-more-table tr {
        display: block;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    .no-more-table thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .no-more-table tr {
        border: 0 solid transparent;
    }

    .no-more-table td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 0 solid transparent;
        position: relative;
        padding-left: 50%;
        white-space: normal;
        text-align: left;
    }

    .no-more-table td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
    }

    /*
Label the data
*/

    .no-more-table td:before {
        content: attr(data-title);
    }
}

@media (max-height: 410px) {

    .front .front-right .front-top img,
    .front .front-right .front-top h4,
    .front .front-right .front-top p,
    .front .front-right .fr-bottom p {
        display: none;
    }
}

@media (max-height: 667px) {

    .front .front-right .front-top img,
    .front .front-right .front-top h4,
    .front .front-right .front-top p {
        display: none;
    }
}

@media (max-height: 736px) {

    .front .front-right .front-top h4,
    .front .front-right .front-top p {
        display: none;
    }
}

/* xs */

@media (max-width: 767px) {
    #topnav .navbar-brand {
        background-position: 10px 5px !important;
        width: 100px;
    }

    #topnav.navbar-midnightblue span.user-bg a {
        width: 100%;
        background-color: transparent;
    }

    #topnav #trigger-sidebar a {
        margin-left: 0;
    }

    #topnav .navbar-brand {
        background-position: center !important;
        background-size: contain !important;
        width: 60px;
        margin-left: 10px !important;
    }

    .table-responsive {
        border: 0 solid transparent !important;
    }

    .page-top .options {
        float: left;
    }

    .page-top .personel-date {
        padding-bottom: 1.3em;
    }

    .yeni-satis-nav>ul.rhm {
        float: left;
        padding-left: 12px !important;
    }

    ul.rhm {
        float: left;
        padding: 0 !important;
    }

    ul.rhm li {
        position: relative;
        display: block;
        float: left;
        margin-right: 10px;
    }

    .btn-lp.xs {
        margin: 0 10px 10px 0;
    }

    .timeline>li.timeline-rezervasyon .timeline-header {
        padding: 0;
        color: #90a4ae;
        margin-bottom: 16px;
    }

    .timeline>li.timeline-rezervasyon .timeline-body:after {
        display: none;
    }

    .timeline>li.timeline-rezervasyon {
        margin: 24px !important;
    }

    .timeline>li .timeline-body {
        margin: 1px !important;
        margin-bottom: 0px !important;
        box-shadow: 0px 0px 1px 0px rgba(50, 50, 50, 0.37) !important;
    }

    ul.timeline:before {
        display: none;
    }

    .rez-menu>.list-group {
        margin: 0 24px;
    }

    .remain-menu {
        margin: 24px;
    }

    .calendar-btn {
        float: right;
        width: 100%;
    }

    .calendar-btn a {
        font-size: 12px;
    }

    .popover-title {
        padding: 8px 10px;
        background-color: #1d2530 !important;
        border-radius: 2px 2px 0 0;
        color: #fafafa !important;
    }

    .leftbarmenu {
        height: 100%;
    }

    .m75 {
        width: 94% !important;
        margin: 30px auto;
    }

    .front .front-right {
        background-color: #1d94ee;
    }

    .front .front-right .fr-box {
        float: none;
        margin: 0 auto;
        width: 100%;
    }

    .front .front-right .front-top {
        position: absolute;
        top: 0;
        padding: 20px 25px;
        background-color: #2a2f3c;
        width: 100%;
        height: 100%;
    }

    .front .front-right .front-top h4 {
        position: initial;
        color: #cfd8dc;
    }

    .front .front-right .front-top p {
        color: #cfd8dc;
    }

    .panel.new-program .panel-body {
        padding: 10px !important;
    }

    .panel.new-program .new-program-box {
        padding: 10px;
        margin-bottom: 30px;
        height: 135px;
    }

    .panel.new-program .new-program-box img {
        width: 120px;
        height: 100px;
    }

    .panel.new-program .npb-content.blue {
        top: 0;
    }

    .panel.new-program .npb-content.red {
        top: 0;
    }

    .panel.new-program .panel-body h4 {
        font-size: 21px;
    }

    .panel.new-program .panel-body p {
        font-size: 14px;
    }

    .panel.new-program .npb-content {
        padding-bottom: 0;
    }

    .panel.new-program .npb-content h3 {
        font-size: 18px;
    }

    .panel.new-program .npb-content p {
        font-size: 15px;
    }

    .program-measure {
        padding-bottom: 20px;
    }

    .timeline>li.timeline-rezervasyon .timeline-body .align-items-center h1 {
        font-size: 16px;
        margin: 5px 0 5px 0;
    }

    .timeline>li.timeline-rezervasyon .timeline-body .align-items-center span.sub-place {
        font-size: 13px;
        margin: 0 0 5px 0;
    }

    .timeline>li.timeline-rezervasyon .timeline-body .align-items-center span.sub-trainer {
        font-size: 13px;
    }

    .timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.right-button {
        padding: 0 5px;
    }

    .studyo-responsive .table tbody tr {
        border: 1px solid #006dbf !important;
    }

    .infobar .lp-card {
        overflow: overlay;
    }

    .front .front-right .fr-box .fr-button {
        background-color: #2a2f3c;
        width: calc(100%);
        z-index: 1;
        padding-top: 19px;
        padding-bottom: 18px;
        bottom: -69px;
        padding-left: 25px;
        left: 0;
    }

    .front .front-right h4 {
        background-color: #2a2f3c;
        width: calc(100% - 25px);
        z-index: 1;
        padding: 14px 0;
        margin: 0;
        top: -48px;
    }

    .mesajlar-card .m-card-body .mc-header {
        width: 100%;
        display: inline-block;
        padding-bottom: 10px !important;
        border-bottom: 1px solid #455a64;
        padding: 0;
    }

    .mesajlar-card .m-card-body .mc-content {
        border: none;
        padding-top: 10px !important;
        padding: 0;
    }

    .timeline>li.timeline-rezervasyon .timeline-header a.export {
        position: relative;
        color: #868e96;
        font-weight: bold;
        float: right;
        top: 3px;
    }

    .tab-lp.tab-container .tab-footer {
        width: calc(100% - 24px);
    }

    ul.bottom-tab {
        width: 100px;
        right: 0;
        font-size: 12px;
    }

    ul.bottom-tab li {
        width: 70px;
    }

    /*
    .day.tab-default.tab-container.tab-bottom > .tab-footer {
        width: 100px;
        right: 0;
        font-size: 12px;
        padding: 15px;
    }

    .day.tab-default.tab-container.tab-bottom > .tab-footer ul li {
        width: 70px;
        display: block;
    }
    */

    .day.tab-default.tab-container.tab-bottom>.tab-footer {
        right: 11px;
        padding: 10px;
        bottom: 34px;
        width: 90px;
    }

    .day.tab-default.tab-container.tab-bottom>.tab-footer>.nav-tabs>li>a {
        font-size: 14px;
        width: 80px;
    }

    .front .front-center {
        background-color: #2a2f3c;
    }

    .front .front-center .fc-box {
        width: 340px;
        height: 500px;
        padding: 20px;
    }

    .front .front-center .fc-box .current_step {
        height: 384px;
    }

    .front .front-center .fc-box .next-step-1 {
        bottom: 20px;
        right: 175px;
    }

    .front .front-center .fc-box .next-step-2 {
        bottom: 20px;
        right: 156px;
    }

    .front .front-center .fc-box .next-step-3 {
        bottom: 20px;
        right: 137px;
    }

    .front .front-center .fc-box .next-step-4 {
        bottom: 20px;
        right: 121px;
    }

    .front .front-center .fc-box .next-step-5 {
        bottom: 20px;
        right: 103px;
    }

    .profile-pic {
        position: relative;
    }

    .tab-lp.tab-container>.nav-tabs>li.active>a {
        padding: 16px 10px;
    }

    .tab-lp.tab-container>.nav-tabs>li>a {
        font-weight: normal;
        margin-top: 15px;
        padding: 9px 10px;
    }

    .tab-basket.tab-container>.nav-tabs>li.active>a {
        padding: 16px 10px;
    }

    .tab-basket.tab-container>.nav-tabs>li>a {
        font-weight: normal;
        margin-top: 15px;
        padding: 9px 10px;
    }

    .card label.selected {
        width: 150px;
        height: 100px;
    }

    .card-list-wrapper ul.card-list li .content {
        width: 100%;
        margin-top: 10px;
    }

    .card-list-wrapper .content span.card-number {
        font-size: 12px;
    }

    .card-list-wrapper .content span.expire-date {
        font-size: 12px;
        padding-top: 10px;
    }

    .card-list-wrapper ul.card-list li .credit-card-icon {
        top: 65px;
    }

    .dropdown-menu.msg-uye {
        margin-right: 0 !important;
        /* üye olmadan giriş yapıldığında gizlenen üst menü için yapılan değişiklik. */
    }

    .dropdown-menu.msg-uye:before,
    .dropdown-menu.msg-uye:after {
        margin-right: 0 !important;
        /* üye olmadan giriş yapıldığında gizlenen üst menü için yapılan değişiklik. */
    }

    .panel.rezervasyon-yap table>tbody>tr {
        border-bottom: 1px solid #e9e9e9 !important;
        padding-bottom: 5px !important;
    }

    .sBar-sticky {
        width: 100% !important;
        position: inherit !important;
    }

    .donut-charts {
        padding: 10px 0;
    }

    body.sidebar-collapsed .static-sidebar-wrapper {
        opacity: 0;
    }

    .sidebar-midnightblue.static-sidebar-wrapper {
        position: initial;
    }

    .static-content-wrapper {
        margin-left: 0 !important;
    }

    #topnav #trigger-sidebar a.triggerA {
        margin-left: 0;
    }

    #topnav #trigger-sidebar a {
        margin-left: 15px;
    }

    .static-sidebar-wrapper .widget nav.widget-body>ul.acc-menu>li:hover+.static-content-wrapper {
        z-index: 99;
    }

    .static-sidebar-wrapper .widget nav.widget-body>ul.acc-menu>li:hover {
        width: 248px;
        z-index: 1512;
    }

    .tab-pro.tab-container>.nav.nav-tabs {
        padding-bottom: 0;
    }

    .dinamic-page-wrapper {
        margin-top: 10px;
    }

    .schedule-page {
        padding-top: 0;
    }

    .lapis-clup {
        padding-bottom: 15px;
    }

    .rezervasyonFiltre {
        margin-bottom: 0;
    }

    .tab-rez.tab-container .tab-content {
        margin-top: 5px;
    }

    ul.timeline:before {
        background: none;
    }
}

/* sm */

@media (min-width: 768px) {
    body.sidebar-collapsed .static-sidebar-wrapper .widget nav.widget-body>ul>li>a {
        padding: 14px 10px !important;
    }

    body.sidebar-collapsed .static-sidebar-wrapper .widget nav.widget-body>ul>li i {
        margin-right: 7px !important;
        margin-left: 7px !important;
    }

    body.sidebar-collapsed .static-sidebar-wrapper .widget nav.widget-body>ul.acc-menu>li:first-child:hover+.hoverOpenSidebar {
        visibility: visible;
    }

    body.sidebar-collapsed .static-sidebar-wrapper .widget nav.widget-body>ul>li:hover span.nav-badge-text {
        display: none;
    }

    body.sidebar-collapsed .static-sidebar-wrapper .sidebar nav.widget-body>ul.acc-menu span.nav-badge-text {
        display: none;
    }

    body.sidebar-collapsed .static-sidebar-wrapper,
    body.sidebar-collapsed .static-sidebar-wrapper>div {
        white-space: nowrap;
        width: 60px !important;
        overflow: visible;
    }

    ul.rhm {
        float: left;
        padding: 0;
    }

    .m75 {
        width: 75% !important;
        margin: 30px auto;
    }

    body.sidebar-collapsed .static-sidebar-wrapper .widget nav.widget-body>ul>li:hover {
        width: 60px;
    }

    .panel.new-program .panel-body {
        padding: 10px !important;
    }

    .panel.new-program .new-program-box {
        padding: 10px;
        margin-bottom: 30px;
    }

    .panel.new-program .new-program-box img {
        width: 120px;
        height: 100px;
    }

    .panel.new-program .npb-content h3 {
        font-size: 18px;
    }

    .panel.new-program .npb-content p {
        font-size: 15px;
    }

    .mesajlar-card .m-card-body .mc-header {
        width: 100%;
        display: inline-block;
        padding-bottom: 10px !important;
        border-bottom: 1px solid #455a64;
        padding: 0 !important;
    }

    .mesajlar-card .m-card-body .mc-content {
        border: none;
        padding-top: 10px !important;
        padding: 0;
    }

    .timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.export {
        bottom: 0;
        display: inline-block;
    }

    .timeline>li.timeline-rezervasyon .timeline-body .align-items-center h3 {
        display: inline-block;
    }

    .scheduleModal .modal-dialog {
        width: auto;
    }

    .scheduleModalFilter .modal-dialog {
        width: 400px;
    }

    .rezervasyonTarihSec .modal-dialog {
        width: fit-content;
    }

    .panel.new-program .new-program-box {
        height: 132px;
    }

    .sBar-sticky {
        width: 100%;
        position: inherit;
    }

    .yeni-satis-nav>ul.rhm {
        float: left;
    }

    .studyo-responsive-haftalik {
        width: 100%;
        display: inline-block;
    }

    .dinamic-page-wrapper {
        margin-top: 10px;
    }

    .schedule-page {
        padding-top: 0;
    }

    .lapis-clup {
        padding-bottom: 15px;
    }

    .rezervasyonFiltre {
        margin-bottom: 0;
    }

    .tab-pro.tab-container>.nav.nav-tabs {
        padding-bottom: 5px;
    }

    .panel.panel-filtre .panel-heading {
        right: 24px;
    }

    .tab-rez.tab-container .tab-content {
        margin-top: 5px;
    }
}

/* md */

@media (min-width: 992px) {
    .page-top .personel-training .personel-body h4 {
        margin: 5px 0;
    }

    .mesajlar-card .m-card-body .mc-header {
        width: 250px;
        display: table-cell;
        vertical-align: middle;
        padding: 0 20px 0 10px;
        border: none;
    }

    .mesajlar-card .m-card-body .mc-content {
        width: 75%;
        border-left: 1px solid #455a64;
        padding: 0 10px 0 20px !important;
        display: table-cell;
        vertical-align: middle;
    }

    .timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.export {
        bottom: -15px;
        float: left;
    }

    .timeline>li.timeline-rezervasyon .timeline-body .align-items-center h3 {
        display: block;
    }

    .panel.new-program .new-program-box {
        height: 250px;
    }

    .sBar-sticky {
        width: calc(24% - 10px);
        position: fixed;
        top: calc(100% - 420px);
        transition: 3s all ease-out 0.15s;
    }

    .yeni-satis-nav>ul.rhm {
        float: right;
        padding: 0 !important;
    }

    .studyo-responsive-haftalik {
        width: 14.28%;
        display: inline-block;
    }

    .rezervasyonFiltre .panel.panel-filtre .panel-body #filtrele.collapse {
        display: block;
        visibility: visible;
    }

    .rezervasyonFiltre .panel-heading {
        display: none;
        visibility: hidden;
    }

    .schedule-page {
        position: absolute;
        bottom: 100px;
        right: 0;
        background: #37474f;
        padding: 8px 2px 4px;
        border-radius: 3px;
    }

    .tab-pro.tab-container .panel .panel-heading {
        position: relative;
    }

    .lapis-clup {
        padding-bottom: 0;
    }
}

/* lg */

@media (min-width: 1200px) {
    .mesajlar-card .m-card-body .mc-header {
        width: 250px;
        display: table-cell;
        vertical-align: middle;
        padding: 0 20px 0 10px;
        border: none;
    }

    .mesajlar-card .m-card-body .mc-content {
        width: calc(100% - 250px);
        border-left: 1px solid #455a64;
        padding: 0 10px 0 20px !important;
        display: table-cell;
        vertical-align: middle;
    }

    .timeline>li.timeline-rezervasyon .timeline-body .align-items-center a.export {
        bottom: -35px;
        float: left;
    }

    .timeline>li.timeline-rezervasyon .timeline-body .align-items-center h3 {
        display: block;
        font-size: 18px;
    }

    .panel.new-program .new-program-box {
        height: 370px;
    }

    .sBar-sticky {
        width: calc(24% - 10px);
        position: fixed;
        top: calc(100% - 420px);
        transition: 3s all ease-out 0.15s;
    }

    ul.rhm {
        float: right;
        position: relative;
    }

    .studyo-responsive-haftalik {
        width: 14.28%;
        display: inline-block;
    }

    .rezervasyonFiltre .panel.panel-filtre .panel-body #filtrele.collapse {
        display: block;
        visibility: visible;
    }

    .panel.panel-filtre .panel-heading {
        display: none;
    }

    .lapis-clup {
        padding-bottom: 0;
    }
}

/* studyo responsive haftalik için width aralığı */
@media (min-width: 1300px) {
    .studyo-responsive-haftalik {
        width: 14.28%;
        display: inline-block;
    }
}

@media (max-width: 1290px) {
    #card-container {
        display: none !important;
    }
}

/* android galaxy s5 */

@media (min-width: 360px) and (max-width: 375px) {
    .card {
        margin-right: 6px;
    }

    .card label.selected {
        width: 130px;
        height: 90px;
    }

    .card-list-wrapper .content span.card-number {
        font-size: 11px;
    }

    .card-list-wrapper .content span.expire-date {
        font-size: 11px;
        padding-top: 5px;
    }

    .card-list-wrapper ul.card-list li .credit-card-icon {
        top: 53px;
    }

    .card-list-wrapper ul.card-list li .content {
        margin-top: 5px;
    }

    .tab-pro.tab-container .nav-tabs>li>a {
        font-size: 11px;
        padding: 9px 10px;
    }

    .tab-pro.tab-container ul.min-content>li>a {
        width: min-content;
    }

    .tab-pro.tab-container>.nav-tabs>li {
        margin: 0 10px 10px 0;
    }

    .tab-pro.tab-container>.nav-tabs>li:last-child {
        margin-right: 0;
    }

    ul.rhm li a {
        font-size: 12px;
        padding: 9px 14px;
    }

    .panel.panel-filtre .panel-heading {
        height: 37px;
        padding: 7px 20px !important;
    }

    .tab-pro.tab-container.yeni-satis-nav>.nav.nav-tabs>li>a {
        width: 105px;
        height: 55px;
        overflow: hidden;
    }
}

/* iphone 6/7/8 */

@media (min-width: 375px) and (max-width: 414px) {
    .card {
        margin-right: 6px;
    }

    .card label.selected {
        width: 135px;
        height: 90px;
    }

    .card-list-wrapper .content span.card-number {
        font-size: 11px;
    }

    .card-list-wrapper .content span.expire-date {
        font-size: 11px;
        padding-top: 5px;
    }

    .card-list-wrapper ul.card-list li .credit-card-icon {
        top: 53px;
    }

    .card-list-wrapper ul.card-list li .content {
        margin-top: 5px;
    }

    .tab-pro.tab-container .nav-tabs>li>a {
        font-size: 12px;
        padding: 4px 8px;
    }

    .tab-pro.tab-container ul.min-content>li>a {
        width: min-content;
    }

    .tab-pro.tab-container>.nav-tabs>li {
        margin: 0 5px 10px 0;
    }

    .tab-pro.tab-container>.nav-tabs>li:last-child {
        margin-right: 0;
    }

    ul.rhm li a {
        font-size: 12px;
        padding: 9px 14px;
    }

    .panel.panel-filtre .panel-heading {
        height: 37px;
    }

    .tab-pro.tab-container.yeni-satis-nav>.nav.nav-tabs>li>a {
        width: 115px;
        height: 45px;
        overflow: hidden;
    }
}

/* iphone 6/7/8 plus */

@media (min-width: 414px) and (max-width: 575px) {
    .card {
        margin-right: 8px;
    }

    .card label.selected {
        width: 155px;
        height: 90px;
    }

    .card-list-wrapper .content span.card-number {
        font-size: 11px;
    }

    .card-list-wrapper .content span.expire-date {
        font-size: 11px;
        padding-top: 8px;
    }

    .card-list-wrapper ul.card-list li .credit-card-icon {
        top: 58px;
    }

    .card-list-wrapper ul.card-list li .content {
        margin-top: 8px;
    }

    .tab-pro.tab-container .nav-tabs>li>a {
        font-size: 12px;
        padding: 7px 13px;
    }

    .tab-pro.tab-container ul.min-content>li>a {
        width: min-content;
    }

    .tab-pro.tab-container>.nav-tabs>li {
        margin: 0 5px 5px 0;
    }

    .tab-pro.tab-container>.nav-tabs>li:last-child {
        margin-right: 0;
    }

    ul.rhm li a {
        font-size: 14px;
        padding: 9px 14px;
    }

    .panel.panel-filtre .panel-heading {
        height: 33px;
        padding: 4px 20px !important;
    }

    .tab-pro.tab-container.yeni-satis-nav>.nav.nav-tabs>li>a {
        width: 127px;
        height: 55px;
        overflow: hidden;
    }
}

@media (min-width: 414px) and (max-width: 991px) {
    .tab-pro.tab-container ul.min-content>li>a {
        width: min-content;
    }
}

.inputQuantityHide::-webkit-inner-spin-button,
.inputQuantityHide::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.olcumTableRowColor {
    background-color: lightgrey !important;
}

/* multiple select box */

.select_box_area {
    position: relative;
    display: block;
}

.select_box_area p {
    margin-bottom: 0px;
    background: #eeeeee;
    padding: 5px 15px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    padding-right: 30px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-width: 0 !important;
    border-style: solid !important;
    border-color: #2a2f3c;
    border-left-width: 5px !important;
    background-color: #eee !important;
    padding-left: 10px !important;
    outline: 0 !important;
    display: block;
    width: 100%;
    height: 32px;
    font-size: 13px;
    line-height: 1.54;
    color: #263238;
    background-image: none;
    border-radius: 2px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s,
        box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

.select_box_area p em {
    position: absolute;
    right: 15px;
    top: 7px;
    font-size: 20px;
    transition: all 0.3s linear;
}

.select_box_area p .option {
    position: relative;
    display: inline-block;
    padding-right: 15px;
}

.select_box_area p .option::after {
    content: ',';
    position: absolute;
    right: 5px;
    top: 0;
}

.select_box_area p .option:last-of-type {
    padding-right: 0px;
}

.select_box_area p .option:last-of-type::after {
    display: none;
}

.filter_list {
    padding: 0px;
    background: #eee;
    border: 1px solid #eee;
    border-top: none;
    display: none;
    position: absolute;
    z-index: 999;
}

.filter_list li {
    list-style: none;
    width: 100%;
    display: inline-block;
}

.filter_list li label {
    display: block;
    width: 100%;
    padding: 10px;
    margin: 0px;
    font-size: 14px;
    cursor: pointer;
}

.filter_list li input[type='checkbox'] {
    margin-right: 5px;
}

.filter_list li+li {
    border-top: 1px solid #eeeeee;
}

.custom-select {
    display: none;
}

/* odeme */
.odeme-panel {
    background: white;
    border: none;
    text-align: center;
}

.odeme-panel .flex {
    display: inline-flex;
}

.odeme-panel .flex a {
    color: #fff;
    border-radius: 25px;
    border-style: none;
    padding: 6px 12px;
    margin: 10px 0;
    background: #269cf3;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}

.odeme-panel .flex a:hover {
    opacity: 0.8;
}

.odeme-logo {
    text-align: center;
    display: block;
    margin-top: 50px;
    margin-bottom: 50px;
}

.odeme-logo img {
    width: 100px;
}

.mesajlar-card .m-card-body.details {
    display: block;
}

.mesajlar-card .m-card-body.details:hover {
    cursor: auto;
}

.mesajlar-card .m-card-body.details .mc-header {
    width: 100%;
    display: inline-block;
    padding-bottom: 10px !important;
    border-bottom: 1px solid #455a64;
    padding: 0 !important;
}

.mesajlar-card .m-card-body.details .mc-content {
    width: 100%;
    border-left: 0px solid #455a64;
    padding: 5px 10px 0 0px !important;
    display: block;
}

#iyzipay-checkout-form {
    min-height: 300px;
}

.rapor {
    padding: 50px 30px;
}

/* responsive tabular data with accordion behavior */

/*Reusable parts*/
.module {
    margin-bottom: 2em;
    background: rgba(255, 255, 255, 1);
    color: rgba(37, 40, 42, 1);
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 0.5em;
}

.module [class*='col-'] .inner {
    padding: 2em 0;
}

.uppercase {
    text-transform: uppercase;
}

/*Responsive Table & Accordion Styles*/
.tabular-data {
    overflow: hidden;
    position: relative;
}

.data-group {
    border-bottom: 1px solid rgba(220, 220, 220, 1);
}

.data-inactive {
    color: rgba(120, 120, 120, 1);
    background: rgba(230, 230, 230, 1);
    padding: 1.5em;
    float: left;
    width: 100%;
}

.data-header {
    font-weight: bold;
    text-transform: uppercase;
    color: #5a5959;
    padding: 1.5em;
}

.data-group:last-child {
    border: none;
}

.data-group .data-expands,
.data-group .expandable {
    will-change: max-height, padding, opacity, background;
    transition: ease max-height 0.5s, ease padding 0.5s, ease opacity 0.5s,
        ease background 0.5s;
}

.data-group .data-expands {
    cursor: pointer;
    padding: 1.5em;
    float: left;
    width: 100%;
}

.data-group .title {
    font-weight: 600;
}

.data-group .expandable {
    transform-origin: top;
    padding: 0 1.5em;
    font-weight: 600;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
}

.data-group .expandable p {
    font-weight: 400;
    color: rgba(100, 100, 100, 1);
}

.data-group .expandable hr {
    margin: 1em 0;
}

.data-group .expandable .btn {
    margin: 0;
    padding: 0.75em 0;
    width: 100%;
}

.row-active,
.row-open {
    background: rgba(245, 245, 245, 1);
    opacity: 1 !important;
}

.row-open {
    max-height: 999px !important;
    padding: 1.5em !important;
}

.row-toggle {
    position: relative;
    cursor: pointer;
    float: right;
    display: block;
    margin: 0.3em 0.5em 0 0;
    font-size: 2em;
    transition: ease transform 0.5s;
    transform-origin: center;
    line-height: 1;
    font-weight: bold;
}

.row-toggle .horizontal,
.row-toggle .vertical {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -8px;
    content: ' ';
    width: 16px;
    height: 2px;
    background: rgba(120, 120, 120, 1);
    transition: ease transform 0.5s;
    transform-origin: center;
}

.row-toggle .vertical {
    transform: rotate(90deg);
}

.row-toggle-twist,
.row-toggle-twist .vertical {
    transform: rotate(180deg);
}

@media screen and (max-width: 992px) {
    .data-group .title {
        display: inline-block;
        padding-bottom: 1em;
    }

    .row-toggle {
        margin: -0.4em 0.5em 0 0;
    }
}

/* /responsive tabular data with accordion behavior */

.kayitliKartlarim-btn-font-size {
    font-size: 8px;
}

.krediKartiLogolari-neo {
    background-image: url(../img/krediKartiLogolari/axess.png);
}

.krediKartiLogolari-bonus {
    background-image: url(../img/krediKartiLogolari/bonus.png);
}

.krediKartiLogolari-cardFinans {
    background-image: url(../img/krediKartiLogolari/card-finans.png);
}

.krediKartiLogolari-paraf {
    background-image: url(../img/krediKartiLogolari/paraf.png);
}

.krediKartiLogolari-world {
    background-image: url(../img/krediKartiLogolari/world.png);
}

.uyelik-satis-wizard .back .back-left {
    background-color: #1e1e1b;
}

.uyelik-satis-wizard .back .back-right {
    background-color: #fed015;
}

.uyelik-satis-wizard .front .front-center .fc-box {
    padding: 30px 20px;
    width: 70%;
    background-color: #fff;
    position: relative;
    height: calc(100vh - 100px);
    margin: 0 auto;
}

.uyelik-satis-wizard .front .front-center .fc-box>img {
    background-color: #fff;
    border: 1px solid #fed015;
    padding: 7px;
    height: 64px;
    width: auto;
}

.uyelik-satis-wizard .fc-box-overlay {
    overflow: auto;
    height: 100%;
    padding-bottom: 30px;
}

.uyelik-satis-wizard .fc-box-overlay .current_step_title {
    display: none;
    visibility: hidden;
}

.uyelik-satis-wizard .btn-lp {
    background-color: #303030;
}

.uyelik-satis-wizard .btn-lp:hover {
    background-color: #ffffff;
    color: #303030;
    border-color: #303030;
}

.uyelik-satis-wizard .stepwizard {
    padding-bottom: 30px;
    padding-top: 5px;
}

.uyelik-satis-wizard .stepwizard-row {
    display: block;
    list-style: none;
    position: relative;
    width: 100%;
    padding: 0;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step {
    display: block;
    float: left;
    width: 20%;
    text-align: center;
    padding-left: 0;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step-4 {
    display: block;
    float: left;
    width: 25%;
    text-align: center;
    padding-left: 0;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step-3 {
    display: block;
    float: left;
    width: 33%;
    text-align: center;
    padding-left: 0;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step:first-child:before,
.uyelik-satis-wizard .stepwizard-row .stepwizard-step-4:first-child:before {
    left: 50%;
    max-width: 50%;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step:last-child:before,
.uyelik-satis-wizard .stepwizard-row .stepwizard-step-4:last-child:before {
    max-width: 50%;
    width: 50%;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step::before,
.uyelik-satis-wizard .stepwizard-row .stepwizard-step-4::before {
    border-top: 7px solid #c8c8c3;
    content: '';
    display: block;
    font-size: 0;
    overflow: hidden;
    position: relative;
    top: 11px;
    right: 1px;
    width: 100%;
    z-index: 1;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step .stepwizard-next,
.uyelik-satis-wizard .stepwizard-row .stepwizard-step-4 .stepwizard-next {
    width: -webkit-fill-available;
    height: 20px;
    margin-left: 0;
    text-align: center !important;
    padding: 0 0 !important;
    font-size: 9px !important;
    line-height: 1.428571 !important;
    border-radius: 50% !important;
    display: inline-block;
    vertical-align: middle;
    border: 1px solid transparent;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step .stepwizard-icon,
.uyelik-satis-wizard .stepwizard-row .stepwizard-step-4 .stepwizard-icon {
    background: #c8c8c3;
    color: #fff;
    font-weight: 700;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    position: relative;
    text-align: center;
    z-index: 2;
    transition: all 0.1s linear 0;
    margin: 5px;
    padding: 7px;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step a.current_nav .stepwizard-icon,
.uyelik-satis-wizard .stepwizard-row .stepwizard-step-4 a.current_nav .stepwizard-icon {
    background: #ffd200;
    border: 5px solid #ffd200;
    margin: 0;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step a.current_nav .stepwizard-title,
.uyelik-satis-wizard .stepwizard-row .stepwizard-step-4 a.current_nav .stepwizard-title {
    color: #303030;
    font-weight: 600;
}

.uyelik-satis-wizard .stepwizard-row .stepwizard-step .stepwizard-title,
.uyelik-satis-wizard .stepwizard-row .stepwizard-step-4 .stepwizard-title {
    color: #bfbfbf;
    display: block;
    font-size: 12px;
    line-height: 15px;
    max-width: 100%;
    position: relative;
    table-layout: fixed;
    text-align: center;
    top: 20px;
    word-wrap: break-word;
    z-index: 104;
}

@media (max-width: 767px) {

    .uyelik-satis-wizard .stepwizard-row .stepwizard-step .stepwizard-title,
    .uyelik-satis-wizard .stepwizard-row .stepwizard-step-4 .stepwizard-title {
        visibility: hidden;
    }

    .uyelik-satis-wizard .stepwizard {
        padding-bottom: 10px;
    }

    .btn-lp.onayla {
        color: #fff !important;
        background-color: #48b754 !important;
        border-color: #48b754 !important;
        margin-top: 20px;
    }
}

.uyelik-satis-wizard .next-step-button {
    display: block;
    bottom: 20px;
    z-index: 9;
}

.uyelik-satis-wizard .next-step-button.right {
    display: block;
    position: absolute;
    bottom: 10px;
    right: 20px;
    z-index: 9;
}

.uyelik-satis-wizard .next-step-button.left {
    display: block;
    position: absolute;
    bottom: 10px;
    left: 20px;
    z-index: 9;
}

.uyelik-satis-wizard .btn-lp.btn-step {
    color: #fff;
    background-color: #303030;
    border-color: #303030;
    padding: 5px 10px;
    border-radius: 3px;
}

.uyelik-satis-wizard .btn-lp.btn-step:hover {
    color: #fff;
    background-color: #616161;
    border-color: transparent;
    border-radius: 3px;
}

.uyelik-satis-wizard .btn-lp:focus {
    color: #fff;
}



@media (max-width: 767px) {
    .uyelik-satis-wizard .stepwizard-row .stepwizard-step .stepwizard-title {
        visibility: hidden;
    }

    .uyelik-satis-wizard .stepwizard {
        padding-bottom: 10px;
    }

    .uyelik-satis-wizard .front .front-center .fc-box {
        padding: 25px 10px;
        width: 100%;
        background-color: #fff;
        position: relative;
        height: calc(100vh - 125px);
        margin: 0 auto;
    }

    .uyelik-satis-wizard .next-step-button.right {
        bottom: 10px;
        left: 10px;
    }

    .uyelik-satis-wizard .next-step-button.left {
        bottom: 10px;
        left: 10px;
    }

    .uyelik-satis-wizard .front .front-center .fc-box .current_step {
        height: 100%;
    }

    .uyelik-satis-wizard .fc-box-overlay {
        height: 100%;
        padding-bottom: 30px;
    }

    .uyelik-satis-wizard .fc-box-overlay .current_step_title {
        display: block;
        visibility: visible;
    }

    .step-text {
        text-align: center;
    }
}

.modal-body .page-detail {
    word-break: break-word !important;
}

.modal-body .page-detail p {
    display: block;
    margin: 0 0 10px;
}

.modal-body .page-detail ol {
    list-style-type: decimal;
}

.step-footer {
    text-align: center;
    padding-top: 20px;
    margin: 0 auto;
    right: 0;
    left: 0;
}

.tck-error-text {
    color: red;
    font-weight: 600;
}

.step-footer img {
    width: 250px;
}

.step-footer h5 {
    margin-bottom: 0;
}

.step-text {
    font-style: italic;
    font-weight: 600;
}

/* responsive tabular data with accordion behavior studyo ders */

/*Reusable parts*/
.studyoDers-module {
    margin-bottom: 2em;
    background: rgba(255, 255, 255, 1);
    color: rgba(37, 40, 42, 1);
    float: left;
    width: 100%;
    height: 100%;
    border-radius: 0.5em;
}

.studyoDers-module [class*='col-'] .inner {
    padding: 2em 0;
}

.studyoDers-module .uppercase {
    text-transform: uppercase;
}

.studyoDers-module .uppercase strong i {
    padding-right: 10px;
}

.studyoDers-module .data-inactive {
    color: rgba(120, 120, 120, 1);
    background: rgba(230, 230, 230, 1);
    padding: 15px 20px;
    float: left;
    width: 100%;
}

.studyoDers-module .data-expands .title-hour,
.studyoDers-module .data-inactive .title-hour {
    display: block;
    font-size: 15px;
    width: 95%;
    font-weight: 600;
}

.studyoDers-module .data-inactive .title-lesson,
.studyoDers-module .data-expands .title-lesson {
    display: block;
    font-size: 15px;
    width: 95%;
    font-weight: 600;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.studyoDers-module .data-inactive .title-training,
.studyoDers-module .data-expands .title-training {
    display: block;
    font-size: 15px;
    width: 95%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/*Responsive Table & Accordion Styles*/
.studyoDers-module.tabular-data {
    overflow: hidden;
    position: relative;
}

.studyoDers-module>.data-group {
    border-bottom: 1px solid #37474f;
}

.studyoDers-module>.data-group .row {
    margin: 0;
}

.studyoDers-module>.data-header {
    font-weight: bold;
    text-transform: uppercase;
    color: #5a5959;
    padding: 15px 20px;
}

.studyoDers-module>.data-group:last-child {
    border: none;
}

.studyoDers-module>.data-group .data-expands,
.studyoDers-module>.data-group .expandable {
    will-change: max-height, padding, opacity, background;
    transition: ease max-height 0.5s, ease padding 0.5s, ease opacity 0.5s,
        ease background 0.5s;
}

.studyoDers-module>.data-group .data-expands {
    cursor: pointer;
    padding: 15px 20px;
    float: left;
    width: 100%;
    color: #2e2e2e;
}

.studyoDers-module>.data-group .data-expands>div:first-child {
    border-right: 2px solid #269cf3;
}

.studyoDers-module>.data-group .title {
    font-weight: 600;
}

.studyoDers-module>.data-group .expandable {
    transform-origin: top;
    padding: 0 1.5em;
    font-weight: 600;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
}

.studyoDers-module>.data-group .expandable p {
    font-weight: 400;
    color: rgba(100, 100, 100, 1);
}

.studyoDers-module>.data-group .expandable hr {
    margin: 1em 0;
}

.studyoDers-module>.data-group .expandable .btn {
    margin: 0;
    padding: 0.75em 0;
    width: 100%;
}

.studyoDers-module .row-active,
.row-open {
    background: rgba(245, 245, 245, 1);
    opacity: 1 !important;
}

.studyoDers-module .row-open {
    max-height: 999px !important;
    padding: 0 1.5em 1.5em !important;
}

.studyoDers-module .row-toggle {
    position: relative;
    cursor: pointer;
    float: right;
    display: block;
    margin: 0.3em 0.5em 0 0;
    font-size: 2em;
    transition: ease transform 0.5s;
    transform-origin: center;
    line-height: 1;
    font-weight: bold;
}

.studyoDers-module .row-toggle .horizontal,
.studyoDers-module .row-toggle .vertical {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -8px;
    content: ' ';
    width: 16px;
    height: 2px;
    background: rgba(120, 120, 120, 1);
    transition: ease transform 0.5s;
    transform-origin: center;
}

.studyoDers-module .row-toggle .vertical {
    transform: rotate(90deg);
}

.studyoDers-module .row-toggle-twist,
.studyoDers-module .row-toggle-twist .vertical {
    transform: rotate(180deg);
}

@media screen and (max-width: 992px) {
    .studyoDers-module>.data-group .title {
        display: inline-block;
        padding-bottom: 1em;
    }

    .studyoDers-module .row-toggle {
        margin: 0.9em 0.5em 0 0;
    }
}

/* mobil responsive table */

@media only screen and (max-width: 1024px) {

    /* Force table to not be like tables anymore */
    .studyoDers-module #mobileTable table,
    .studyoDers-module #mobileTable thead,
    .studyoDers-module #mobileTable tbody,
    .studyoDers-module #mobileTable th,
    .studyoDers-module #mobileTable td,
    .studyoDers-module #mobileTable tr {
        display: block;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    .studyoDers-module #mobileTable thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .studyoDers-module #mobileTable tr {
        border: 0 solid transparent;
    }

    .studyoDers-module .table>tbody>tr>td {
        padding: 10px 8px;
    }

    .studyoDers-module #mobileTable td {
        border: none;
        border-top: 0 solid #f5f5f5;
        border-bottom: 1px solid #bbb;
        position: relative;
        padding-left: 50%;
        white-space: normal;
        text-align: left;
    }

    .studyoDers-module #mobileTable td:last-child {
        padding-left: 0;
    }

    .studyoDers-module #mobileTable td:before {
        position: absolute;
        top: 10px;
        left: 0;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align: left;
        font-weight: bold;
    }

    .studyoDers-module #mobileTable td:before {
        content: attr(data-title);
    }
}

/* /mobil responsive table */

.studyoDers-module.accordion-group .accordion-item .accordion-title.collapsed .data-expands:after {
    content: '\f105';
    opacity: 1;
    filter: alpha(opacity=50);
    position: absolute;
    color: #303030;
    top: 30px;
}

.studyoDers-module.accordion-group .accordion-item .accordion-title .data-expands:after {
    opacity: 1;
    filter: alpha(opacity=50);
    content: '\f107';
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    float: right;
    text-decoration: none;
    position: absolute;
    color: #303030;
    top: 30px;
}

@-webkit-keyframes blink {
    0% {
        border-color: #eeeeee !important;
    }
}

@-moz-keyframes blink {
    0% {
        border-color: #eeeeee !important;
    }
}

@keyframes blink {
    0% {
        border-color: #eeeeee !important;
    }
}

.blink {
    animation: blink 1s step-start 0s infinite;
    -webkit-animation: blink 1s step-start 0s infinite;
}

.eula-box-section {
    height: calc(100% - 15px);
    overflow: overlay;
}

.eula-box-section h2 {
    font-size: 24px;
    margin-bottom: 12px;
    margin: 0;
    font-weight: 700;
    color: #455a64;
}

.eula-box-section h3 {
    color: #484848;
    font-size: 17px;
    line-height: 26px;
    margin-bottom: 0;
}

.eula-box-section .eula-group {
    margin: 20px 20px 0 0;
}

.eula-box-section .eula-container {
    padding: 6px 40px 10px 8px;
    height: 110px;
    overflow: auto;
    color: #484848;
    font-size: 13px;
    font-weight: 400;
    background-color: #f5f5f5;
    border-radius: 2px;
}

.eula-box-section .eula-alpha-list {
    list-style: lower-alpha;
}

.eula-box-section .eula-disk-list {
    list-style: disc;
}

.eula-box-section .eula-decimal-list {
    list-style: decimal;
}

.eula-box-section .eula-roman-list {
    list-style: lower-roman;
}

.eula-box-section dl.eula-sections-list {
    counter-reset: section;
}

.eula-box-section .eula-sections-list dt {
    counter-reset: subsection;
    margin: 0 0 10px;
}

.eula-box-section .eula-sections-list dt:before {
    content: ' 'counter(section) '. ';
    counter-increment: section;
}

.eula-box-section .eula-sections-list dd {
    margin: 0 0 10px;
}

.eula-box-section .eula-sections-list dd:before {
    counter-increment: subsection;
    content: counter(section) '.'counter(subsection) ' ';
    font-weight: bold;
}

.fc-box.eula a {
    display: inline;
}

.css-form input.ng-invalid.ng-touched {
    background-color: #fa787e !important;
}

.css-form input.ng-valid.ng-touched {
    background-color: #78fa89 !important;
}

.colm-left {
    position: relative;
    float: left;
    width: 300px;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    background-color: #ffffff;
}

.price-table {
    background: #e0e0e0;
}

.price-table::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    background: -webkit-linear-gradient(-135deg, #e0e0e0 50%, transparent 50%) 0 50%, -webkit-linear-gradient(-45deg, #e0e0e0 50%, transparent 50%) 0 50%, transparent;
    background-repeat: repeat-x;
    background-size: 16px 16px, 16px 16px, cover, cover;
    height: 16px;
    width: 100%;
}

.price-header {
    position: relative;
    margin: 0;
    padding: 15px 20px;
    border-bottom: 1px dashed #e6e6e6;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 2px;
    color: #344760;
}

.price-header::after,
.price-header::before {
    content: "";
    display: block;
    width: 13px;
    height: 13px;
    background-color: #fff;
    position: absolute;
    right: -6px;
    border-radius: 50%;
    z-index: 200;
    bottom: -7px;
}

.price-header::after {
    left: -6px;
}

.musteri-bilgileri-page .membership-list label {
    top: 140px;
    left: -70px;
}
.musteri-bilgileri-page .price-list label {
    top: 15px;;
    left: -63px;
}
.musteri-bilgileri-page .price-total {
    padding-bottom: 15px;
    flex-flow: column;
}
.musteri-bilgileri-page .price-total span {
    padding-bottom: 10px;
}
.musteri-bilgileri-page .price-total button {
    display: block;
    width: 100%;
}
.musteri-bilgileri-page .step-footer .masterpass-logo {
    margin: 0 auto;
    width: 150px;
}
.musteri-bilgileri-page .price-total span button.selectedTalimat,
.musteri-bilgileri-page .price-total strong button.selectedTalimat {
    color: #ffffff !important;
    background-color: #00bcd4 !important;
    border-color: #03a9f4 !important;
}

.btn-total,
.btn-total:hover {
    color: #ffffff;
    background-color: #4caf50;
    border-color: #4caf50;
}

.price-list,
.membership-list {
    position: relative;
    margin: 10px 20px 0 20px;
    padding-left: 30px;
    list-style: none;
}

.price-list label
 {
    position: absolute;
    top: 40px;
    left: -60px;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 2px;
    color: #344760;
    transform: rotate(-90deg);
}

.membership-list label {
    position: absolute;
    top: 100px;
    left: -60px;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 2px;
    color: #344760;
    transform: rotate(-90deg);
}

.price-list li {
    display: flex;
    justify-content: space-between;
    padding-bottom: 15px;
    font-size: 16px;
    letter-spacing: .8px;
}

.membership-list li {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    flex-direction: column;
    padding-bottom: 15px;
    font-size: 16px;
    letter-spacing: .8px;
}

.price-list li strong,
.membership-list li strong {
    color: #337ab7;
}

.kayitli-cards-label {
  text-transform: uppercase;
  font-weight: 600;
}

.price-total {
    display: flex;
    justify-content: space-between;
    margin: 20px;
    margin-bottom: 0;
    padding-left: 30px;
    font-size: 18px;
}

.price-total strong {
    color: #ca4168;
}

.price-footer {
    display: flex;
    justify-content: space-between;
    margin: 20px;
    padding-left: 30px;
}

.colm-right {
    position: relative;
    float: left;
    padding: 0 25px;
    width: calc(100% - 300px);
}

.tab-footer {
    padding: 20px;
    text-align: center;
}

.payment-card-wrapper {
    width: 100%;
}

.card-sil-btn {
  background-color: #d46666;
  border: none;
  color: white;
  padding: 6px 8px;
  font-size: 16px;
  cursor: pointer;
  border-radius: 5px;
  margin-bottom: 0 !important;
}

/* Darker background on mouse-over */
.card-sil-btn:hover {
  background-color: #cc0707;
}

.payment-card-wrapper .card-list-wrapper {
    display: inline-block !important;
    margin: 0;
}

.payment-card-wrapper .card-list-wrapper button {
    margin-bottom: 10px;
}

.payment-card-wrapper .form-group {
    width: 270px;
    display: inline-block;
}

.payment-card-wrapper .card {
    width: 100%;
}

.payment-card-wrapper .card label.selected {
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    width: 100%;
    margin-bottom: 10px;
    text-align: left;
    border-radius: 4px;
    cursor: pointer;
}

.payment-card-wrapper .card-list-wrapper ul.card-list li .content {
    width: 100%;
    margin: 0;
}

.payment-card-wrapper .card-list-wrapper .content h3 {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: #484848;
    margin: 10px 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.payment-card-wrapper .card-list-wrapper .content span.card-number {
    font-size: 16px;
}

.payment-card-wrapper .card input[type='radio']:checked+label.selected {
    opacity: 1;
    border: 1px solid #c8c8c3;
    background-color: #e0e0e0;
}



.payment-card-wrapper .card input[type='radio']:checked+label {
    color: #37474f;
}

.payment-card-wrapper .tab-footer {
    padding: 0;
    text-align: left;
}

.masterpass-logo {
    width: 215px;
    height: 25px;
    margin-left: 110px;
    background-image: url(/content/img/logo-masterpass.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

/* .masterpass-wrapper {
    margin-bottom: 20px;
} */

.masterpass-modal .form-group-modal {
    margin-bottom: 20px;
}

.payment-3d-odeme iframe {
    width: 100%;
    height: 400px;
    border: 0;
}

.masterpass-wrapper .masterpass-button-content {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    justify-content: start;
}

.masterpass-wrapper button {
    margin: 0;
}

.payment-card-wrapper .card input[type="radio"] {
    opacity: 0;
    outline: none;
    border: none;
    display: none;
}

body {
    background: white;
}

.masterpass-modal .modal-footer .masterpass-logo {
    margin: 0 auto;
    margin-right: 0;
}

.masterpass-modal .text-success {
    display: block;
    color: green;
    margin-top: 20px;
    padding: 0;
}

.card-logo-wrapper {
    display: inline-block;
    padding-left: 20px;
}

p label {
    display: inline;
}

.payment-3d-odeme {
    position: inherit;
    z-index: 4;
    background: #ffffff;
}
.otp_snk_5001 {
    color: black;
}
.otp_snk_5008 {
    color: green;
}
.spin-loader {
    bottom: 0;
    height: 50px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    z-index: -1;
}

.spin-loader i {
    position: relative;
    align-content: center;
    align-items: center;
    font-size: 52px;
}

.jp-card-container {
    margin-right: 0 !important;
}

section.col {
    padding: 0;
}

.text-field label {
    display: block;
}

.payment-odeme-basarili,
.payment-odeme-basarisiz {
    border: none;
    text-align: center;
}

.payment-odeme-basarili .payment-logo-wrapper,
.payment-odeme-basarisiz .payment-logo-wrapper {
    text-align: center;
    display: block;
    margin-top: 50px;
    margin-bottom: 50px;
}

.payment-odeme-basarili .payment-logo-wrapper img,
.payment-odeme-basarisiz .payment-logo-wrapper img {
    width: 100px;
}

#musterikartBilgi .jp-card-container {
    margin: 0;
}

#musterikartBilgi .selectedTalimat {
    opacity: 1;
    border: 1px solid #c8c8c3;
    background-color: #e0e0e0;
}


/*
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/
@media (min-width: 320px) and (max-width: 480px) {

    .colm-left,
    .colm-right {
        width: calc(100% - 20px);
        padding: 0;
    }

    .payment-card-wrapper .form-group {
        width: 100%;
    }

    .jp-card-container {
        display: none;
    }

    .card-logo-wrapper {
        position: absolute;
        right: 25px;
    }
}

/*
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    .colm-left {
        width: 300px;
    }

    .colm-right {
        width: calc(100% - 300px);
    }

    .jp-card-container {
        display: none;
    }

    .card-logo-wrapper {
        position: initial;
    }
}

/*
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {

    .colm-left,
    .colm-right {
        width: calc(100% - 20px);
        padding: 0;
    }

    .jp-card-container {
        display: none;
    }

    .card-logo-wrapper {
        position: absolute;
        top: 25px;
        right: 0;
    }
}

/*
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1366px
*/

@media (min-width: 1025px) and (max-width: 1366px) {
    .card-wrapper {
        display: inline-block !important;
    }
    .jp-card-container {
        transform: scale(0.93) !important;
    }
}

.taksit-wrapper {
  display: flex;
  flex-flow: column;
  align-items: stretch;
}

.taksit-wrapper a{
  padding: 8px;
  align-self: center;
  text-decoration: underline;
  color: mediumblue;
}

.flex-img-wrapper {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-evenly;
}

.taksit-flex-wrapper {
  display: flex;
  flex-flow: column wrap;
}

.flex-contanier-col-center{
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 6px;
}

.flex-item-strech {
  align-self: stretch;
}

.taksit-grid-wrapper {
  display: grid;
  margin-top: 2px;
  background: lightgray;
  grid-row-gap: 2px;
  padding: 2px;
  border-radius: 4px;
  font-family: 'Oswald', sans-serif;
  color: #222;
  grid-template-columns: 1fr 2fr;
  grid-template-rows: 40px;
}

.taksit-grid-item{
  display: flex;
  flex-direction: column;
  background: aliceblue;
  justify-content: center;
  align-items: center;
}

.taksit-value{
  color: white;
  font-size: 1.2em;
  background-color: #757575;
}

.lp-World{
  background-color: #6f6b99!important;
}

.lp-Paraf {
  background-color: #00cbeb!important;
}

.lp-Maximum {
  background-color: #f52295!important;
}

.lp-CardFinans{
  background-color: #2d5fc2!important;
}

.lp-Axess {
  background-color: #e2b631!important;
}

.lp-Bonus {
  background-color: #479279!important;
}

.lp-Param {
  background-color: #1abd9d!important;
}

.pesin {
  filter: brightness(85%);
}

.taksit-banka-gorsel {
  min-height: 25px;
  max-height: 50px;
}

.sanalpos-taksit-banka-gorsel {
  min-height: 35px;
  max-height: 50px;
}

.flex-center-self{
  align-self: center;
}

.current-sanalpos-wrapper {
  flex-direction: column;
  display: flex;
}

.current-sanalpos-grid-wrapper {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  grid-auto-rows: 40px;
  grid-row-gap: 1px;
  font-family: 'Oswald', sans-serif;
  color: #222;
  padding: 2px;
  border-radius: 5px;
  font-size: 1.3em;
  background: black;
  vertical-align: middle;
  text-align: center;
}

.current-sanalpos-grid-wrapper span {
  font-weight: 700;
}

.rowWrapper{
  display: contents;
  cursor: pointer;
}

.rowWrapper > * {
  background: #ddd;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rowWrapper:hover div{
  background-color: #ebe6e6;
}

.rowWrapper.selected div{
  background-color: #cc0000;
  color: #fff;
  transition: .15s;
}

.rowWrapper.selected div:first-child::before{
  content: "\2713";
  color: limegreen;
  margin-left: 5px;
  font-size: 2em;
  font-weight: bolder;
}

.wave-enter, .wave-leave {
  transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
}
.wave-enter {
  position:absolute;
  left:100%;
}
.wave-enter-active {
  left:0;
}
.wave-leave {
  position:absolute;
  left:0;
}
.wave-leave-active {
  left:-100%;
}

.fade-hide, .fade-show {
  transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
}
.fade-hide {
  opacity:1;
}
.fade-hide.fade-hide-active {
  opacity:0;
}
.fade-show {
  opacity:0;
}
.fade-show.fade-show-active {
  opacity:1;
}

.tab-pro.tab-container > .nav.nav-tabs > li > a:hover {
  color: #263238 !important;
}

.active-talimat::before{
  content: "\2713";
  color: limegreen;
  margin-left: 5px;
  font-size: 2em;
  font-weight: bolder;
}

.card-logo {
  height: 20px;
}

@keyframes achromatization {
  from {filter: grayscale(0%);}
  to {filter: grayscale(100%);}
}

.card-logo-gray-out {
  animation: achromatization 1s linear;
  animation-fill-mode: forwards;
}