@import url(https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400;600;700;900&display=swap);

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

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

body {
    font-family: 'Source Sans Pro',sans-serif;
    background-color: #f5f7f9;
    overflow-x: hidden
}

:root {
    --shadow: 0 0 20px 0 rgba(216,221,226,.31);
    --border: solid 1px rgba(229,231,235,.27);
    --color-blue: #004a97;
    --color-light-blue: #00acc8;
    --border-blue: solid 1px #004a97;
    --color-black: #001932
}

.table-bordered td, .table-bordered th {
    border: initial;
}

ol, ul {
    list-style: none
}

blockquote, q {
    quotes: none
}

h1 {
    font-size: 24px;
    font-weight: 600
}

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

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

a {
    text-decoration: none
}

:focus {
    outline: 0 !important
}

.clear {
    clear: both
}

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

::-webkit-scrollbar-track {
    background-color: #f5f5f5
}

::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    background-color: #666;
    opacity: .3
}

::-webkit-scrollbar-thumb {
    background-color: #666
}

::-webkit-input-placeholder {
    color: #8da0b1 !important;
    font-weight: 400
}

:-moz-placeholder {
    color: #8da0b1 !important;
    font-weight: 400
}

::-moz-placeholder {
    color: #8da0b1 !important;
    font-weight: 400
}

:-ms-input-placeholder {
    color: #8da0b1 !important
}

.login-col {
    border-radius: 20px;
    box-sizing: border-box;
    padding: 55px 50px;
    margin-top: 10%;
    margin-left: 0;
    margin-right: 0
}

.border-default {
    border: var(--border) !important
}

.shadow-sm {
    box-shadow: var(--shadow) !important
}

.login-content {
    width: 100%;
    height: 100vh;
    background-image: url(../images/login-bg.png);
    background-size: cover;
    background-position: center
}

.login-button-row {
    margin-top: 50px;
    padding: 0;
    margin-bottom: 40px
}

    .login-button-row ul li {
        width: 33.3%;
        text-align: center;
        padding: 0 10px
    }

        .login-button-row ul li a {
            height: 50px;
            border-radius: 10px !important;
            box-shadow: var(--shadow);
            border: solid 1px rgba(188,191,198,.33);
            background-color: #fff;
            box-sizing: border-box;
            padding: 0;
            line-height: 50px;
            color: #2e2e2e;
            font-size: 14px
        }

            .login-button-row ul li a.active {
                background-color: #eff6ff !important;
                color: var(--color-blue) !important;
                border: var(--border-blue) !important;
                position: relative
            }

                .login-button-row ul li a.active:before {
                    border-style: solid;
                    border-width: 0 6px 6px 6px;
                    border-color: transparent transparent #eff6ff transparent;
                    content: "";
                    position: absolute;
                    bottom: -6px;
                    transform: rotate(180deg);
                    left: 50%;
                    margin-left: -6px;
                    z-index: 2
                }

                .login-button-row ul li a.active:after {
                    border-style: solid;
                    border-width: 0 8px 8px 8px;
                    border-color: transparent transparent #004a97 transparent;
                    content: "";
                    position: absolute;
                    bottom: -8px;
                    transform: rotate(180deg);
                    left: 50%;
                    margin-left: -8px;
                    z-index: 1
                }

.login-content .form-control {
    height: 50px;
    border-radius: 10px;
    border: solid 1px #c8c8c8;
    padding-left: 25px;
    color: #000
}

.login-input {
    position: relative;
    margin-bottom: 30px !important
}

    .login-input label {
        font-size: 14px;
        background: #fff;
        padding: 0 10px;
        position: absolute;
        top: -10px;
        left: 15px;
        bottom: auto
    }

.btn-blue {
    width: 100%;
    height: 60px;
    background-color: var(--color-blue);
    color: #fff;
    border-radius: 10px;
    font-size: 18px
}

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

.login-action {
    margin: 40px -15px 25px 0
}

    .login-action label {
        font-size: 14px;
        color: #000;
        line-height: 20px
    }

    .login-action a {
        font-size: 14px;
        line-height: 20px;
        color: var(--color-blue)
    }

.btn-white {
    height: 60px;
    border-radius: 10px;
    border: solid 1px #d8d8d8;
    background-color: #fff;
    width: 100%;
    line-height: 60px;
    padding: 0;
    color: #000;
    opacity: .5;
    font-size: 16px
}

    .btn-white:hover {
        border: var(--border-blue);
        opacity: 1;
        color: var(--color-blue)
    }

.login-footer {
    margin: 30px 0;
    height: 30px
}

.login-copyright {
    padding-left: 0;
    font-size: 14px;
    color: #000;
    opacity: .5
}

.login-designer {
    padding-right: 0;
    justify-content: flex-end
}

    .login-designer img {
        display: inline-block;
        margin-left: 40px
    }

.top-header {
    background: #fff;
    padding: 15px 8%;
    border-bottom: 1px solid #e5e7eb;
    position: relative;
    z-index: 10
}

.logo img {
    width: 176px
}

#menu a {
    color: #000;
    font-size: 16px
}

#menu li {
    margin: 0 10px
}

.cart-green {
    background-color: #28a745 !important;
}

.flying-cart {
    position: fixed !important;
    width: 40px;
    height: 40px;
    z-index: 999999 !important;
    background-size: contain;
    background-repeat: no-repeat;
    pointer-events: none;
    transition: transform 1.2s ease-in-out, opacity 0.5s ease-in-out;
    opacity: 1;
}

.sepet-btn {
    width: 130px;
    height: 50px;
    border-radius: 25px;
    background-color: var(--color-blue);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    margin-left: 35px;
    position: relative;
    transition: all ease-in-out .2s
}

    .sepet-btn .badge {
        width: 30px;
        height: 30px;
        border-radius: 30px;
        border: solid 2px #fff;
        background-color: #00acc8;
        position: absolute;
        right: -7px;
        top: -11px;
        font-size: 12px;
        line-height: 19px;
    }

.header-actions a {
    margin-left: 35px;
    display: inline-flex;
    position: relative
}

    .header-actions a:first-child {
        margin-left: 0px;
    }

#bildirimler, #accountsoptions {
    position: absolute;
    width: 250px;
    right: 145px;
    z-index: 9;
    top: 55px
}

    #bildirimler ul, #accountsoptions ul {
        border-radius: 10px;
        text-align: left
    }

.sepet-btn .desktop-icn {
    margin-right: 10px
}

.icn-bildirim .badge {
    width: 8px;
    height: 8px;
    border-radius: 5px;
    border: solid 1px #fff;
    background-color: #a3abb2;
    position: absolute;
    display: block;
    padding: 0;
    right: 1px;
    top: 1px
}

    .icn-bildirim .badge.active {
        background-color: #00acc8
    }

.sepet-btn:hover {
    color: #fff;
    text-decoration: none;
    background-color: var(--color-black)
}

.header-search.row {
    height: 60px;
    background: #fff;
    box-shadow: var(--shadow);
    box-sizing: border-box;
    padding: 0 8%;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 9;
    border-bottom: 1px solid #e5e7eb
}

header {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99
}

.icn-search {
    padding: 0 15px;
    width: 50px;
    box-sizing: border-box
}

.search-form {
    width: calc(100% - 300px)
}

.search-filter-btn {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #f5f7f9;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer
}

    .search-filter-btn span {
        position: absolute;
        width: 20px;
        height: 2px;
        background: #858585;
        top: 0
    }

        .search-filter-btn span:nth-child(2) {
            width: 14px;
            top: 25px
        }

        .search-filter-btn span:nth-child(3) {
            top: 30px;
            width: 6px
        }

        .search-filter-btn span:nth-child(1) {
            top: 20px
        }

.search-form input {
    width: 100%;
    font-size: 16px;
    font-family: 'Source Sans Pro',sans-serif;
    color: #000;
    text-transform: capitalize
}

.container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 1410px
}

.mainCarousel {
    margin: 30px 0;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow);
    border: var(--border)
}

    .mainCarousel .carousel-item {
    }

        .mainCarousel .carousel-item a {
            width: 100%;
            height: 100%;
            display: block
        }

.slide-img {
    width: 60%;
    height: 450px;
    background-size: cover;
    background-position: center;
    float: right
}

.slide-content {
    position: absolute;
    z-index: 2;
    background: #fff;
    height: 450px;
    width: 50%;
    box-sizing: border-box;
    padding: 0 100px;
    display: flex;
    align-items: center
}

    .slide-content:before {
        content: "";
        position: absolute;
        width: 250px;
        height: 550px;
        background: #fff;
        right: -60px;
        border-radius: 50%;
        z-index: -1
    }

    .slide-content .badge {
        font-size: 18px;
        font-weight: 600;
        background: var(--color-blue);
        color: #fff;
        padding: 8px 12px;
        margin-bottom: 20px
    }

    .slide-content h2 {
        color: #000;
        font-size: 35px;
        font-weight: 600;
        line-height: 1.29;
        margin-bottom: 15px
    }

        .slide-content h2 span {
            color: var(--color-blue)
        }

    .slide-content p {
        font-size: 18px;
        line-height: 1.78;
        color: #000;
        opacity: .5;
        font-weight: 500
    }

.mainSlider .carousel-control-next, .mainSlider .carousel-control-prev {
    width: 50px;
    height: 50px;
    background: #fff;
    opacity: 1;
    border-radius: 50%;
    box-shadow: var(--shadow);
    border: var(--border);
    top: 50%;
    margin-top: -25px;
    transition: all ease-in-out .3s
}

    .mainSlider .carousel-control-next svg path, .mainSlider .carousel-control-prev svg path {
        fill: #004a97
    }

    .mainSlider .carousel-control-prev svg {
        transform: rotate(180deg)
    }

    .mainSlider .carousel-control-next:hover, .mainSlider .carousel-control-prev:hover {
        background: var(--color-blue);
        border: var(--border-blue)
    }

        .mainSlider .carousel-control-next:hover svg path, .mainSlider .carousel-control-prev:hover svg path {
            fill: #fff
        }

.mainSlider .carousel-control-next {
    right: -10px
}

.mainSlider .carousel-control-prev {
    left: -10px
}

.card {
    border-radius: 20px;
    border: var(--border);
    box-shadow: var(--shadow)
}

.card-header {
    background-color: transparent;
    border: none;
    padding-top: 25px;
    padding-bottom: 0
}

    .card-header h2 {
        font-size: 24px;
        font-weight: 600
    }

.carousel-indicators li {
    background-color: var(--color-blue);
    width: 4px !important;
    height: 4px !important;
    border-radius: 15px !important;
    border: none;
    opacity: .2;
    margin: 5px
}

.slide-img-card {
    height: 400px;
    border-radius: 20px;
    border: solid 1px #e9eef2;
    background-color: #fcfcfc;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 70px 0
}

    .slide-img-card img {
        max-height: 100% !important
    }

    .slide-img-card span {
        position: absolute;
        z-index: 2;
        height: 25px;
        border-radius: 14px;
        background-color: #a3abb2;
        top: 20px;
        left: 20px;
        font-size: 12px;
        color: #fff;
        line-height: 25px;
        padding: 0 15px;
        font-weight: 600
    }

        .slide-img-card span.active {
            background-color: #73c50e
        }

.slide-ilac-content h3 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.39
}

    .slide-ilac-content h3 img {
        position: relative;
        top: 4px;
        margin-left: 10px
    }

.slide-ilac-content table {
    border-top: 1px solid #e9eef2;
    margin-top: 15px;
    border-bottom: 1px solid #e9eef2
}

    .slide-ilac-content table td {
        padding: 2px 0;
        font-size: 14px;
        color: #666
    }

    .slide-ilac-content table tr:first-child td {
        padding-top: 12px
    }

    .slide-ilac-content table tr:last-child td {
        padding-bottom: 12px
    }

.slide-ilac-content {
    box-sizing: border-box;
    padding-right: 20px
}

.adetler {
    width: calc(100% + 10px);
    float: left;
    margin: 0 -5px
}

    .adetler span {
        width: calc(25% - 10px);
        height: 30px;
        display: flex;
        float: left;
        margin: 5px;
        border-radius: 10px;
        border: solid 1px rgba(0,74,151,.27);
        background-color: #f1f6f9;
        cursor: pointer;
        align-items: center;
        justify-content: center;
        color: var(--color-blue);
        font-size: 12px;
        font-weight: 600
    }

.siparis-detay-adet .adetler span {
    width: initial;
}

.color-blue, tr.color-blue td {
    color: var(--color-blue) !important;
    font-weight: 600
}

.manuel-adet {
    width: 100%;
    float: left;
    overflow: hidden;
    margin-top: 5px;
    margin-bottom: 10px
}

    .manuel-adet span {
        width: 66px;
        float: right;
        background: #b0c8de;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 12px;
        color: #fff;
        font-weight: 600;
        height: 35px;
        border-radius: 0 10px 10px 0;
        border: solid 1px #b0c8de;
        transition: all ease-in-out .3s
    }

    .manuel-adet input {
        width: calc(100% - 66px);
        font-size: 12px;
        padding-left: 15px;
        line-height: 35px;
        box-sizing: border-box;
        background: #f1f6f9;
        transition: all ease-in-out .3s;
        height: 35px;
        border-radius: 10px 0 0 10px;
        border: solid 1px #b0c8de;
        font-weight: 600;
        color: var(--color-blue)
    }

.btn-line-blue {
    width: 100%;
    height: 40px;
    border-radius: 10px;
    border: var(--border-blue);
    color: var(--color-blue);
    font-size: 14px;
    font-weight: 600;
    transition: all ease-in-out .3s
}

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

.tooltip-inner {
    background-color: var(--color-blue);
    font-size: 11px
}

.bs-tooltip-auto[x-placement^=top] .arrow::before, .bs-tooltip-top .arrow::before {
    border-top-color: var(--color-blue)
}

.bs-tooltip-auto[x-placement^=left] .arrow::before, .bs-tooltip-left .arrow::before {
    border-left-color: var(--color-blue)
}

.altSlider .carousel-control-next svg path, .altSlider .carousel-control-prev svg path {
    fill: #ccdbea
}

.altSlider .carousel-control-next svg, .altSlider .carousel-control-prev svg {
    width: 13px;
    height: 12px
}

.altSlider .carousel-control-next, .altSlider .carousel-control-prev {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(216,221,226,.31);
    border: solid 1px transparent;
    background-color: #fff;
    opacity: 1;
    transition: all ease-in-out .2s;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-items: center
}

    .altSlider .carousel-control-next:hover, .altSlider .carousel-control-prev:hover {
        box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
        border: solid 1px rgba(229,231,235,.27)
    }

        .altSlider .carousel-control-next:hover svg path, .altSlider .carousel-control-prev:hover svg path {
            fill: var(--color-blue)
        }

    .altSlider .carousel-control-prev svg {
        transform: rotate(180deg)
    }

.carousel-indicators {
    position: relative;
    display: inline-flex;
    height: 34px;
    margin: 0 10px 0 10px;
    top: -3px
}

.manuel-adet input::-webkit-input-placeholder {
    color: #B5C6D6;
    font-weight: 600
}

.manuel-adet input :-moz-placeholder {
    color: #B5C6D6;
    font-weight: 600
}

.manuel-adet input::-moz-placeholder {
    color: #B5C6D6;
    font-weight: 600
}

.manuel-adet input:-ms-input-placeholder {
    color: #B5C6D6
}

.manuel-adet input.active {
    background: #fff;
    border-color: var(--color-blue)
}

.manuel-adet span.active {
    background: var(--color-blue);
    border-color: var(--color-blue);
}

.fullWidthSlider {
    margin: 30px 0;
}

    .fullWidthSlider .slide-img-card {
        height: 150px;
        padding: 20px 0 0 0;
        border-radius: 20px 20px 0 0;
        border: none;
        background-color: #ffff;
    }

    .fullWidthSlider .info-btn {
        position: absolute;
        left: auto;
        right:15px;
        top: 15px;
        margin-left: 0
    }

    .fullWidthSlider .slide-img-card span {
        width: 10px;
        height: 10px;
        padding: 0;
        right: auto;
        left: 15px;
    }

    .fullWidthSlider .slide-ilac-content {
        padding-left: 20px;
        display: inline-block;
        min-height: 330px
    }

    .fullWidthSlider .adetler span {
        width: calc(33.3% - 10px)
    }

    .fullWidthSlider .adetler.ilac-disi-adetler span {
        width: 100%;
        margin: 0;
    }

    .fullWidthSlider .adetler.ilac-disi-adetler adet-box {
        width: calc(33.3% - 10px);
    }

.urun-card-footer {
    width: 100%;
    float: left;
    padding: 20px;
    box-sizing: border-box;
    padding-top: 0px;
}

.adetTitle {
    font-size: 12px;
    color: #666;
    width: 100%
}

.fullWidthSlider .slide-ilac-content h3 {
    font-size: 14px
}

.title-row h2 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 25px;
    margin-top: 25px
}

.swiper-pagination {
    position: relative !important;
    display: inline-flex;
    margin: 0 15px
}

.swiper-pagination-bullet {
    width: 5px !important;
    height: 5px !important;
    opacity: .2 !important;
    background-color: var(--color-blue) !important;
    margin: 6px
}

.swiper-pagination-bullet-active {
    opacity: 1 !important
}

.swiper-button-next, .swiper-button-prev {
    position: relative !important;
    top: 0 !important;
    width: 40px !important;
    height: 40px !important;
    margin-top: 0 !important;
    z-index: 10;
    cursor: pointer;
    background-image: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center;
    background: 0 0 !important;
    border-radius: 50%;
    box-shadow: 0 0 20px 0 transparent;
    border: solid 1px transparent;
    transition: all ease-in-out .3s
}

    .swiper-button-next svg path, .swiper-button-prev svg path {
        fill: #ccdbea
    }

    .swiper-button-next svg, .swiper-button-prev svg {
        width: 13px;
        height: 12px
    }

.swiper-button-next {
    right: 0 !important
}

.swiper-button-prev {
    left: 0 !important
}

    .swiper-button-prev svg {
        transform: rotate(180deg)
    }

    .swiper-button-next:hover, .swiper-button-prev:hover {
        box-shadow: 0 0 20px 0 rgba(216,221,226,.31) !important;
        border: solid 1px rgba(229,231,235,.27) !important;
        background-color: #fff !important
    }

        .swiper-button-next:hover svg path, .swiper-button-prev:hover svg path {
            fill: var(--color-blue) !important
        }

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

.sayfalama {
    margin-bottom: 50px
}

.page-link {
    background-color: transparent !important;
    width: 35px;
    height: 35px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-blue);
    border-radius: 50% !important;
    box-sizing: border-box;
    line-height: 33px;
    border-color: transparent !important;
    margin: 5px;
    transition: all ease-in-out .2s
}

.nextPrevBtn svg {
    width: 13px;
    height: 12px
}

    .nextPrevBtn svg path {
        fill: #004a97;
        opacity: .5
    }

.active .page-link {
    background-color: #eff6ff !important;
    border-color: var(--color-blue) !important;
    color: var(--color-blue) !important
}

.nextPrevBtn:hover {
    background-color: #fff !important;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
    border: solid 1px rgba(229,231,235,.27)
}

    .nextPrevBtn:hover svg path {
        opacity: 1
    }

.navPrevBtn svg {
    transform: rotate(180deg)
}

footer {
    background-color: #001932
}

.top-footer {
    padding: 30px 0;
    border-bottom: 1px solid rgb(240 240 240 / .17)
}

.footer-menu a {
    font-size: 14px;
    font-weight: 600;
    opacity: .7;
    color: #fff;
    margin-right: 70px;
    transition: all ease-in-out .2s
}

    .footer-menu a:hover {
        opacity: 1;
        text-decoration: none
    }

.bizeUlasin, .bizeUlasin a {
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    text-decoration: none
}

.bottom-footer {
    padding: 30px 0
}

.copyright {
    font-size: 14px;
    color: #fff;
    opacity: .7
}

.logo-name {
    text-align: right;
}

.logos a {
    display: inline-block;
    margin-left: 40px;
    opacity: .4;
    transition: all ease-in-out .2s
}

    .logos a:hover {
        opacity: .5
    }

.login-content .form-control:focus {
    border-color: #000;
    outline: 0 !important;
    box-shadow: none !important
}

.dropdown-menu, .list-group {
    border-radius: 10px;
    border: none;
    box-shadow: 0 0 20px 0 #d8dde2
}

    .dropdown-menu a, .list-group li {
        color: #282828;
        font-size: 14px;
        line-height: 20px;
        padding: 15px 25px;
        border: none
    }

        .dropdown-menu a:hover, .list-group li:hover {
            background-color: #eff6ff;
            color: var(--color-blue) !important
        }

    .dropdown-menu:before, .list-group:before {
        /*border-style: solid;*/
        border-width: 0 10px 10px 10px;
        border-color: transparent transparent #fff transparent;
        content: "";
        position: absolute;
        top: -8px;
        left: 20%;
        z-index: 99
    }

    .list-group:before {
        left: auto;
        right: 35px
    }

#accountsoptions .list-group:before {
    right: 93px;
}

.adetler span.active {
    color: #fff;
    background-color: var(--color-blue);
    border-color: var(--color-blue)
}

.selectbox button {
    background: #fff;
    width: 220px;
    height: 40px;
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
    border: solid 1px rgba(229,231,235,.27);
    text-align: left;
    padding: 0 15px;
    font-size: 14px;
    color: #666
}

    .selectbox button:after {
        right: 15px;
        position: absolute;
        border-top: .4em solid #666;
        border-right: .4em solid transparent;
        border-bottom: 0;
        border-left: .4em solid transparent;
        top: 17px;
        border-radius: 5px
    }

    .selectbox button:before {
        content: "";
        position: absolute;
        width: 40px;
        height: 40px;
        border-left: 1px solid #f8f9fa;
        right: 0;
        top: -1px;
        border-radius: 0 20px 20px 0
    }

    .selectbox button:hover {
        color: #666;
        background: #fff;
        border-color: #fff
    }

        .selectbox button:hover:before {
            background-color: var(--color-blue);
            border-radius: 0 20px 20px 0
        }

        .selectbox button:hover:after {
            border-top: .4em solid #fff
        }

    .selectbox button:focus, .show > .btn-outline-secondary.dropdown-toggle {
        box-shadow: 0 0 20px 0 rgba(216,221,226,.31) !important;
        background-color: #fff !important;
        color: #666 !important;
        border: solid 1px rgba(229,231,235,.27) !important;
        border-radius: 20px 20px 0 0;
        z-index: 1002 !important;
        border-bottom-color: #f8f9fa !important
    }

        .selectbox button:focus:after {
            transform: rotate(180deg)
        }

.selectbox-menu {
    top: -3px !important;
    border-radius: 0 0 20px 20px;
    width: 220px;
    overflow: hidden
}

    .selectbox-menu:before {
        display: none
    }

.dropdown-menu a {
    padding: 10px 10px;
    color: #666
}

.selectbox button:focus:before {
    border-radius: 0 20px 0 0
}

.ml-20 {
    margin-left: 20px
}

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

.title h1 {
    font-size: 24px;
    color: #000;
    font-weight: 600
}

.content {
    min-height: calc(100vh - 323px);
    margin-top: 147px;
    position: relative;
    width: 100%;
    display: inline-block
}

.btn-blue-40 {
    width: 216px;
    height: 40px;
    border-radius: 10px;
    background-color: var(--color-blue);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    outline: 0;
    box-shadow: none !important
}

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

.siparis-detay-modal {
    position: fixed;
    background: #fff;
    width: 100%;
    float: left;
    left: 0;
    bottom: -500px;
    z-index: 100;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
    transition: all ease-in-out .5s
}

    .siparis-detay-modal.active {
        bottom: 0
    }

.urun-foto {
    width: 50px;
    height: 50px;
    border-radius: 5px;
    border: solid 1px #f0f0f0;
    background-color: #fff;
    display: flex;
    align-items: center;
    vertical-align: middle;
    float: left;
    margin: 25px 10px 25px 0;
    position: relative
}

.urun-adi {
    width: calc(100% - 60px);
    float: left;
    margin: 25px 0
}

    .urun-adi h2 {
        font-size: 16px;
        font-weight: 600;
        margin-top: 5px
    }

.urun-kodu {
    width: 100%;
    float: left;
    color: #666;
    font-family: "Source Sans Pro";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    margin-top: 3px
}

.info-btn {
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background-color: #f5f7f9;
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    margin-left: 10px;
    position: relative;
    cursor: pointer;
    padding: 0;
    border: none;
    outline: 0 !important;
    box-shadow: none !important
}

    .info-btn svg {
        display: inline-block;
        width: 6px;
        text-align: center;
        margin: auto
    }

    .info-btn:hover svg path {
        fill: #000
    }

    .info-btn svg path {
        transition: all ease-in-out .2s
    }

.item-note-area {
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background-color: #f5f7f9;
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    margin-left: 10px;
    position: relative;
    cursor: pointer;
    padding: 0;
    border: none;
    outline: 0 !important;
    box-shadow: none !important
}

    .item-note-area svg {
        display: inline-block;
        width: 6px;
        text-align: center;
        margin: auto
    }

        .item-note-area svg path {
            transition: all ease-in-out .2s
        }

.badge-md {
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background: #d6d6d6;
    position: absolute;
    display: inline-block;
    top: -5px;
    left: -5px
}

    .badge-md.active {
        background: #73c50e
    }

.siparis-detay-adet {
    padding-top: 25px;
    padding-bottom: 25px
}

    .siparis-detay-adet .adetTitle {
        font-size: 14px;
        float: left;
        width: auto;
        color: #000;
        height: 50px;
        display: flex;
        align-items: center
    }

    .siparis-detay-adet .adetler {
        width: auto;
        margin-left: 15px
    }

        .siparis-detay-adet .adetler span {
            min-width: 35px;
            margin-top: 10px;
            margin-bottom: 10px
        }

    .siparis-detay-adet .manuel-adet {
        width: auto;
        margin-left: 10px;
        margin-top: 10px
    }

        .siparis-detay-adet .manuel-adet input, .siparis-detay-adet .manuel-adet span {
            height: 30px;
            line-height: 30px;
        }

        .siparis-detay-adet .manuel-adet input {
            width: 120px;
            padding-left: 10px
        }

.btn-gray {
    min-width: 90px;
    height: 40px;
    border-radius: 10px;
    background-color: #f5f7f9;
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-blue);
    box-shadow: none !important;
    outline: 0 !important
}

.btn-line {
    min-width: 90px;
    height: 40px;
    border-radius: 10px;
    border: solid 1px #004a97;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-blue);
    outline: 0 !important;
    box-shadow: none !important
}

.ml-20 {
    margin-left: 20px
}

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

.btn-gray:hover {
    border: 1px solid var(--color-blue);
    color: var(--color-blue);
    background: #fff
}

.siparis-detay-butons {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.siparis-detay-bilgiler {
    border-top: 1px solid #f0f0f0
}

    .siparis-detay-bilgiler .col-lg-3 {
        border-left: 1px solid #f0f0f0;
        padding: 15px 65px 20px 10px
    }

        .siparis-detay-bilgiler .col-lg-3:nth-child(1) {
            border-left: 0;
            padding-left: 15px
        }

    .siparis-detay-bilgiler ul li {
        font-size: 14px;
        line-height: 22px;
        color: #666;
        display: flex;
        align-items: center;
        justify-content: space-between
    }

    .siparis-detay-bilgiler .col-lg-3:nth-child(4) {
        padding-right: 15px
    }

.close-modal {
    width: 32px;
    height: 32px;
    border-radius: 20px;
    border: solid 2px #f8f8fa;
    background-color: #fff;
    position: absolute;
    right: -30px;
    top: -15px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

.siparis-detay-modal .container {
    position: relative
}

.close-modal span {
    width: 13px;
    height: 1px;
    background-color: #5b667a;
    position: absolute;
    transition: all ease-in-out .3s
}

    .close-modal span:nth-child(1) {
        transform: rotate(45deg)
    }

    .close-modal span:nth-child(2) {
        transform: rotate(-45deg)
    }

.close-modal:hover span {
    background-color: #000
}

.icn-download {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31) !important;
    border: solid 1px rgba(229,231,235,.27);
    background-color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    outline: 0 !important
}

    .icn-download:hover svg path {
        fill: #000
    }

    .icn-download svg path {
        transition: all ease-in-out .2s
    }

#urunDetay .modal-dialog {
    max-width: 950px;
    width: 950px;
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.45);
    border: solid 1px rgba(229,231,235,.27);
    background-color: #fff
}

#urunDetay .modal-content {
    border: none;
    border-radius: 20px;
    background-color: transparent;
    padding: 30px;
    box-sizing: border-box
}

#modalSearchDetay .close, .siparisOnay .close, #urunDetay .close {
    width: 36px;
    height: 36px;
    border-radius: 25px;
    background-color: #b8bec8;
    position: absolute;
    right: -15px;
    top: -15px;
    opacity: 1;
    color: #fff
}

.urun-detay-img {
    height: 230px;
    border-radius: 20px;
    background-color: #fdfdfd;
    border: 1px solid #ececec;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%
}
    .urun-detay-img img {
        max-width: 100% !important;
        max-height: 100% !important;
    }

#urunDetayTitle {
    font-size: 18px;
    font-weight: 600;
    margin: 4px 0 7px
}

.urun-detay-kod {
    width: 100%;
    float: left;
    color: #000;
    opacity: .5;
    font-size: 14px
}

    .urun-detay-kod span {
        margin-right: 17px
    }

#urun-detay-tabs {
    width: 100%;
    float: left;
    margin-top: 26px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--color-blue);
    margin-bottom: 25px
}

    #urun-detay-tabs li {
        width: 25%;
        float: left;
        box-sizing: border-box;
        height: 40px;
        border-left: 1px solid var(--color-blue)
    }

        #urun-detay-tabs li:first-child {
            border-left: none
        }

        #urun-detay-tabs li a {
            width: 100%;
            height: 100%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 14px;
            color: var(--color-blue);
            border: none;
            border-radius: 0;
            font-weight: 400
        }

            #urun-detay-tabs li a img {
                max-height: 30px
            }

            #urun-detay-tabs li a.active {
                background-color: var(--color-blue);
                color: #fff;
                font-weight: 400
            }

#urunDetayContent {
    width: 100%;
    float: left;
    padding-bottom: 30px;
    border-bottom: 1px solid #e9eef2;
    margin-bottom: 30px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding-right: 15px
}

    #urunDetayContent::-webkit-scrollbar-track {
        background-color: #fff
    }

    #urunDetayContent::-webkit-scrollbar {
        width: 2px;
        height: 2px;
        background-color: #fff;
        opacity: 0
    }

    #urunDetayContent::-webkit-scrollbar-thumb {
        background-color: #666
    }

    #urunDetayContent ul li {
        width: 100%;
        float: left;
        font-size: 14px;
        display: flex;
        align-items: center
    }

        #urunDetayContent ul li strong {
            font-weight: 700;
            opacity: .82;
            width: 65%;
            box-sizing: border-box;
            padding-right: 15px
        }

        #urunDetayContent ul li span {
            font-weight: 400;
            opacity: .5
        }

        #urunDetayContent ul li.color-blue span {
            opacity: 1
        }

.urun-detay-left {
    width: 260px;
    padding: 0 15px;
    box-sizing: border-box
}

.urun-detay-right {
    width: calc(100% - 260px);
    padding: 0 15px
}

.urun-detay-adetler {
    width: 100%;
    float: left;
    margin-bottom: 20px
}

    .urun-detay-adetler .adetTitle {
        width: 100%;
        float: left
    }

    .urun-detay-adetler .adetler {
        width: auto
    }

        .urun-detay-adetler .adetler span {
            height: 30px;
            min-width: 66px
        }

    .urun-detay-adetler .manuel-adet {
        width: auto;
        margin-left: 10px
    }

        .urun-detay-adetler .manuel-adet input {
            height: 30px;
            line-height: 30px;
            max-width: 120px;
            padding-left: 10px
        }

        .urun-detay-adetler .manuel-adet span {
            height: 30px;
            max-width: 66px
        }

.urun-detay-right .btn-blue-40 {
    width: 160px
}

#firma ul li {
    border-bottom: 1px solid #e9eef2;
    align-items: start;
    padding: 5px 0
}

    #firma ul li strong {
        width: 60%
    }

    #firma ul li span {
        width: 40%
    }

    #firma ul li:last-child {
        border: none
    }

.full-li {
    border-top: 1px solid #e9eef2
}

    .full-li strong {
        width: 175px !important
    }

    .full-li span {
        width: calc(100% - 175px) !important
    }

#firma ul li span a {
    opacity: 1 !important;
    color: var(--color-blue)
}

#modalSearchDetay .close span, .siparisOnay .close span, #urunDetay .close span {
    position: absolute;
    width: 14px;
    height: 2px;
    background: #fff;
    left: 11px;
    top: 16px
}

    #modalSearchDetay .close span:nth-child(1), .siparisOnay .close span:nth-child(1), #urunDetay .close span:nth-child(1) {
        transform: rotate(45deg)
    }

    #modalSearchDetay .close span:nth-child(2), .siparisOnay .close span:nth-child(2), #urunDetay .close span:nth-child(2) {
        transform: rotate(-45deg)
    }

.mobil-icon, .mobil-title {
    display: none
}

#odemeModal, .siparisOnay.modal.oldmodal .modal-content {
    max-width: 1210px;
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.45);
    border: solid 1px rgba(229,231,235,.27);
    background-color: white !important;
}

#odemeModal {
    max-width: 810px
}

    #odemeModal .modal-v2inner, .siparisOnay .modal-content {
        border: none;
        padding: 30px;
    }

.modal-content h5 {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 25px
}

.siparisOnay table {
    margin-bottom: 0
}

    .siparisOnay table thead tr td {
        font-size: 12px;
        font-weight: 600;
        color: #949494;
        border-top: 0
    }

        .siparisOnay table thead tr td:first-child {
            padding-left: 22px;
            width: 35%
        }

.sepetOnayTableRow {
    width: 100%;
    border: 1px solid #f0f0f0;
    border-radius: 10px 0 10px 10px;
    margin-bottom: 20px
}

.siparisOnay table tbody tr td {
    border-color: #f0f0f0;
    font-size: 14px
}

    .siparisOnay table tbody tr td:first-child {
        padding-left: 10px;
        font-weight: 600
    }

.taksit1 {
    color: #497baa
}

.taksit2 {
    color: #284f74
}

.taksit3 {
    color: #14314c
}

.sepetOnayTableRow table tbody tr:hover td {
    background-color: rgb(237 239 242 / .6)
}

.taksitSecenekleri {
    width: 270px;
    float: right;
    border: 1px solid #f0f0f0;
    padding: 15px 7px 10px;
    background: #fff;
    border-radius: 20px 20px 0 0;
    border-bottom: 0;
    position: relative;
    bottom: -1px;
    z-index: 2
}

    .taksitSecenekleri span {
        width: 72px;
        height: 30px;
        border-radius: 15px;
        background-color: #497baa;
        display: inline-flex;
        margin: 0 5px;
        font-size: 12px;
        color: #fff;
        align-items: center;
        justify-content: center;
        font-weight: 600
    }

        .taksitSecenekleri span:nth-child(2) {
            background-color: #284f74
        }

        .taksitSecenekleri span:nth-child(3) {
            background-color: #14314c
        }

.taksitSecenekleri {
    width: 270px;
    float: right;
    border: 1px solid #f0f0f0;
    padding: 15px 7px 10px;
    background: #fff;
    border-radius: 20px 20px 0 0;
    border-bottom: 0;
    position: relative;
    margin-top: -56px;
    z-index: 2
}

    .taksitSecenekleri span {
        width: 72px;
        height: 30px;
        border-radius: 15px;
        background-color: #497baa;
        display: inline-flex;
        margin: 0 5px;
        font-size: 12px;
        color: #fff;
        align-items: center;
        justify-content: center;
        font-weight: 600
    }

        .taksitSecenekleri span:nth-child(2) {
            background-color: #284f74
        }

        .taksitSecenekleri span:nth-child(3) {
            background-color: #14314c
        }

.sepet-total {
    width: 96%;
    float: right;
    border: 1px solid #f0f0f0;
    border-radius: 20px;
    overflow: hidden
}

    .sepet-total tr td:first-child {
        width: 50%;
        background-color: #f5f7f9;
        text-align: left
    }

    .sepet-total tr td {
        text-align: center
    }

    .sepet-total tr:first-child td {
        border-top: 0;
        font-weight: 400
    }

        .sepet-total tr:first-child td:first-child {
            color: #3f3f3f
        }

    .sepet-total tr:last-child td {
        font-weight: 600
    }

.sepet-taksitler {
    width: 96%;
    float: right;
    margin-top: 15px;
    display: inline-block;
    height: 30px;
    margin-bottom: 15px
}

    .sepet-taksitler table {
        width: 100%;
        float: left
    }

        .sepet-taksitler table tr td:first-child {
            width: 50%
        }

        .sepet-taksitler table tr td {
            text-align: center
        }

.notunuz input {
    width: 100%;
    height: 50px;
    font-size: 14px;
    border: 1px solid #f0f0f0;
    border-radius: 10px;
    transition: all ease-in-out .3s;
    padding-left: 22px
}

    .notunuz input:focus {
        border-color: #000
    }

.siparisOnay .form-check {
    margin-left: 22px !important;
    font-size: 14px;
    color: #666;
    line-height: 23px
}

.sepetOnayContent.row {
    margin-left: 0;
    margin-right: 0
}

#odemeModal .close-modal {
    right: -15px;
    background-color: #b8bec8;
    border-color: #b8bec8
}

    #odemeModal .close-modal span {
        background-color: #fff
    }

.form-control {
    height: 50px;
    border-radius: 10px;
    border: solid 1px #dbdbdb;
    font-size: 14px;
    font-weight: 400;
    padding-left: 25px;
    transition: all ease-in-out .3s
}

label {
    font-size: 14px;
    color: #000;
    background: #fff;
    bottom: -10px;
    position: relative;
    left: 15px;
    padding: 0 10px;
    font-weight: 600;
    z-index: 2
}

.form-group {
    margin-bottom: 0
}

.form-check-label {
    background: 0 0;
    left: 0;
    bottom: 0;
    padding: 0;
    font-weight: 400
}

#odemeModal .modal-content {
    padding: 0;
    background-color: #fcfcfc;
    border-radius: 20px
}

.odeme-left {
    padding: 30px !important;
    background: #fff;
    border-radius: 20px 0 0 20px;
    border-right: 1px solid #e9eef2
}

#odemeModal .row {
    margin: 0
}

.kart-content ul li {
    width: 100%;
    float: left;
    margin-bottom: 10px;
    position: relative
}

    .kart-content ul li:nth-child(3) {
        width: calc(50% - 15px);
        margin-right: 15px
    }

    .kart-content ul li:nth-child(4) {
        width: calc(50% - 15px);
        margin-left: 15px
    }

.guvenlik-info {
    position: absolute;
    right: 15px;
    top: 36px
}

.odeme-right {
    padding: 30px 20px
}

    .odeme-right h5 {
        width: 70%;
        float: left;
        padding-left: 10px;
        margin-bottom: 40px
    }

.taksit {
    width: 70px;
    height: 25px;
    border-radius: 14px;
    float: right;
    background-color: var(--color-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #fff;
    margin-right: 10px
}

.odeme-right table {
    width: 100%;
    float: left;
    border-bottom: 1px solid #e9eef2;
    margin-bottom: 10px
}

    .odeme-right table tr td {
        font-size: 14px;
        padding: 3px 0
    }

        .odeme-right table tr td:nth-child(1) {
            font-weight: 600;
            padding-left: 10px
        }

        .odeme-right table tr td:nth-child(2) {
            text-align: right;
            padding-right: 10px
        }

    .odeme-right table tr:last-child td {
        padding-bottom: 10px
    }

    .odeme-right table tr:nth-child(3) td {
        font-weight: 600
    }

.color-gray {
    color: #7f7f7f
}

.odeme-right .form-check {
    width: calc(100% - 20px);
    float: left;
    margin-left: 10px;
    margin-bottom: 35px;
    margin-top: 10px
}

    .odeme-right .form-check label {
        font-size: 13px
    }

        .odeme-right .form-check label a {
            color: var(--color-blue)
        }

.odeme-right .btn-blue-40 {
    width: 100%
}

.form-control:focus {
    outline: 0 !important;
    border-color: #000;
    box-shadow: none
}

.profil-left {
    padding: 40px
}

.profil-name {
    width: 100%;
    float: left;
    margin-bottom: 70px;
    height: 60px;
    display: flex;
    align-items: center
}

.profil-img {
    width: 60px;
    height: 60px;
    background-color: #eee;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 600;
    float: left;
    margin-right: 16px
}

.profil-name h1 {
    font-size: 16px;
    font-weight: 600;
}

.profil-menu {
    float: left;
    margin-left: 20px
}

    .profil-menu li {
        width: 100%;
        float: left;
        margin-bottom: 28px
    }

        .profil-menu li svg {
            width: 21px;
            margin-right: 13px;
            height: 24px
        }

        .profil-menu li a {
            color: #484848;
            font-size: 18px;
            font-weight: 600;
            transition: all ease-in-out .2s;
            display: list-item;
            align-items: center;
            text-decoration: none;
            line-height: 24px
        }

        .profil-menu li.active a, .profil-menu li:hover a {
            color: var(--color-blue)
        }

        .profil-menu li svg path {
            transition: all ease-in-out .2s
        }

        .profil-menu li.active a svg path, .profil-menu li:hover a svg path {
            fill: var(--color-blue)
        }

.profil-right h2 {
    font-size: 24px;
    font-weight: 600;
    margin: 50px 0 35px 0
}

.profil-content {
    border-top: 1px solid #f0f0f0;
    padding-top: 30px;
    margin-left: 0;
    padding-right: 115px;
    padding-bottom: 60px
}

    .profil-content .form-group {
        margin-bottom: 15px
    }

.form-control:disabled {
    background-color: #fff !important;
    opacity: .5
}

.form-add {
    position: absolute;
    right: 70px;
    top: 40px;
    cursor: pointer;
    z-index: 3
}

.input-group {
    display: inline-block
}

    .input-group .form-control {
        width: calc(100% - 50px);
        border-radius: 10px 0 0 10px !important;
        border-right: 0;
        float: left;
        border-color: #dbdbdb;
        z-index: 1 !important;
        box-sizing: border-box
    }

.input-group-prepend span {
    background: #fff;
    border-color: #dbdbdb;
    height: 50px;
    width: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 0 10px 10px 0 !important;
    transition: all ease-in-out .3s;
    box-sizing: border-box
}

.input-group-prepend {
    float: left
}

.form-add svg path {
    transition: all ease-in-out .3s
}

.form-add:hover svg path {
    fill: #000
}

.focus span {
    border-color: #000
}

    .focus span svg path {
        fill: #000
    }

.input-group .form-control:focus {
    border-color: #000
}

.form-delete {
    position: absolute;
    right: 70px;
    top: 40px;
    z-index: 3;
    transform: rotate(45deg);
    cursor: pointer
}

    .form-delete svg path {
        transition: all ease-in-out .2s
    }

    .form-delete:hover svg path {
        fill: #000
    }

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

.profil-right .btn-blue-40 {
    width: 130px;
    margin-top: 20px
}

.notunuz {
    margin-bottom: 10px
}

.dataTables_length {
    display: none
}

.dataTable {
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.45);
    border: solid 1px rgba(229,231,235,.27);
    background-color: #fff;
    margin-top: 20px !important;
    padding-bottom: 30px !important;
    width: 100% !important;
    overflow: hidden
}

    .dataTable thead tr td, .dataTable thead tr th {
        border-top: 0;
        color: #949494;
        font-size: 12px;
        font-weight: 600;
        padding-left: 45px
    }

#siparislerim thead tr td:first-child {
    width: 35% !important
}

.dataTable tbody tr td {
    border-top: 1px solid #f0f0f0;
    padding-left: 20px;
    font-size: 14px;
    color: #666
}

    .dataTable tbody tr td:first-child {
        font-weight: 600
    }

.dataTable tbody tr:hover {
    background-color: rgb(237 239 242 / .6)
}

    .dataTable tbody tr:hover td {
        color: #000
    }

#tableTotal {
    float: left;
    margin-top: 30px
}

.total {
    float: left;
    margin-right: 50px;
    font-size: 14px;
    font-weight: 600;
    color: #666
}

.dataTables_paginate {
    float: right;
    margin-top: 20px !important;
    margin-bottom: 40px !important
}

    .dataTables_paginate a {
        width: 35px;
        height: 35px;
        display: inline-flex;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
        margin: 2px
    }

.paginate_button.next.disabled, .paginate_button.previous.disabled {
    opacity: .5;
    background: 0 0;
    box-shadow: none
}

.paginate_button.previous svg {
    transform: rotate(180deg);
    width: 13px;
    height: 12px
}

    .paginate_button.next svg path, .paginate_button.previous svg path {
        fill: var(--color-blue)
    }

.paginate_button.next svg {
    width: 13px;
    height: 12px
}

.paginate_button.next, .paginate_button.previous {
    background-color: #fff;
    box-shadow: var(--shadow)
}

.paginate_button {
    color: var(--color-blue);
    text-decoration: none !important;
    cursor: pointer
}

    .paginate_button.current, .paginate_button.active {
        border: solid 1px #004a97;
        background-color: #eff6ff;
        box-sizing: border-box
    }

.dataTableHeadLeft {
    margin-bottom: 25px
}

    .dataTableHeadLeft h1 {
        float: left;
        margin-right: 35px;
        line-height: 40px
    }

.dataTableSearch {
    width: 220px;
    float: left;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
    border: solid 1px rgba(229,231,235,.27)
}

    .dataTableSearch .input-group-prepend {
        width: 40px;
        height: 40px;
        float: left;
        border-right: 1px solid #f8f9fa
    }

        .dataTableSearch .input-group-prepend span {
            border: none;
            height: 40px;
            border-radius: 0 !important;
            background: 0 0
        }

            .dataTableSearch .input-group-prepend span svg {
                width: 16px;
                height: 16px
            }

                .dataTableSearch .input-group-prepend span svg path {
                    fill: #adadad
                }

    .dataTableSearch input {
        height: 40px;
        border-radius: 0 !important;
        border: none;
        background: 0 0;
        padding-left: 14px;
        font-size: 14px
    }

    .dataTableSearch.active .input-group-prepend span svg path {
        fill: #000
    }

.dataTables_filter {
    opacity: 0;
    z-index: -1;
    position: absolute
}

.selectList {
    width: 220px;
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
    border: solid 1px rgba(229,231,235,.27);
    background-color: #fff;
    display: inline-block;
    text-align: left;
    position: absolute;
    z-index: 3;
    overflow: hidden
}

    .selectList ul {
        display: none;
        width: 100%
    }

.selected {
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    padding-left: 15px;
    font-size: 14px;
    color: #666;
    box-sizing: border-box;
    cursor: pointer
}

    .dateFilter:before, .selected:before {
        content: "";
        position: absolute;
        width: 40px;
        height: 40px;
        right: 0;
        top: 0;
        background-image: url(../images/icn-down.png);
        background-position: center;
        background-repeat: no-repeat;
        transition: all ease-in-out .3s;
        cursor: pointer
    }

.active.dateFilter:before {
    transform: rotate(180deg)
}

.dateFilter:after, .selected:after {
    content: "";
    position: absolute;
    width: 40px;
    height: 40px;
    border-left: 1px solid #f0f0f0;
    right: 0;
    top: 0;
    cursor: pointer
}

.active .selected:before {
    transform: rotate(180deg)
}

.selectList ul li {
    width: 100%;
    float: left;
    box-sizing: border-box;
    padding: 7px 15px;
    border-top: 1px solid #f0f0f0;
    font-size: 14px;
    color: #666;
    cursor: pointer
}

    .selectList ul li:hover {
        background: #f0f0f0
    }

.dataFilter {
    width: 220px;
    display: inline-block;
    position: relative;
    min-height: 40px;
    margin-right: 20px;
    margin-left: 20px
}

.dateFilter {
    width: 220px;
    height: 40px;
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
    border: solid 1px rgba(229,231,235,.27);
    background-color: #fff;
    padding-left: 15px;
    position: relative
}

    .dateFilter input {
        color: #666;
        font-size: 14px;
        height: 38px;
        font-family: 'Source Sans Pro',sans-serif
    }

        .dateFilter input::-webkit-input-placeholder {
            color: #666 !important;
            font-weight: 400
        }

        .dateFilter input:-moz-placeholder {
            color: #666 !important;
            font-weight: 400
        }

        .dateFilter input::-moz-placeholder {
            color: #666 !important;
            font-weight: 400
        }

        .dateFilter input:-ms-input-placeholder {
            color: #666 !important
        }

.daterangepicker .calendar-table thead tr:nth-child(2) th {
    color: #b0c8de;
    font-size: 11px;
    font-weight: 400
}

.daterangepicker {
    border-radius: 20px !important;
    margin-left: -15px !important;
    border-color: #f0f0f0 !important;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31)
}

    .daterangepicker:before {
        left: 20px !important;
        border-bottom: 7px solid #f0f0f0 !important
    }

    .daterangepicker:after {
        left: 21px !important
    }

    .daterangepicker td.active, .daterangepicker td.active:hover, .daterangepicker th.available:hover {
        background-color: var(--color-blue) !important;
        border-radius: 50% !important;
        padding: 0 5px !important;
        color: #fff !important
    }

    .daterangepicker td.available:hover, th.next.available:hover, th.prev.available:hover {
        background: #eff6ff !important;
        border-radius: 50% !important;
        position: relative !important;
        color: var(--color-blue) !important
    }

th.next.available span, th.prev.available span {
    border-color: var(--color-blue) !important
}

.daterangepicker td.available:hover:before, th.next.available:hover:before, th.prev.available:hover:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    border: 1px solid var(--color-blue);
    left: 0;
    top: 0;
    border-radius: 50%
}

.daterangepicker td.in-range.available {
    background-color: #eff6ff
}

.daterangepicker .calendar-table td, .daterangepicker .calendar-table th {
    padding: 3px
}

.daterangepicker .drp-buttons {
    border-top-color: #f0f0f0 !important;
    text-align: center !important;
    color: #001932;
    line-height: 28px !important
}

.cancelBtn {
    float: left;
    color: #7f7f7f
}

.applyBtn {
    float: right;
    background: 0 0;
    border: none;
    color: var(--color-blue)
}

    .applyBtn:hover {
        background: 0 0;
        color: var(--color-black)
    }

    .applyBtn.disabled, .applyBtn:disabled {
        background: 0 0;
        color: var(--color-blue)
    }

.dateMoments {
    margin-right: 20px
}

    .dateMoments span {
        height: 40px;
        border-radius: 20px;
        box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
        border: solid 1px rgba(229,231,235,.27);
        background-color: #fff;
        display: inline-flex;
        padding: 0 15px;
        align-items: center;
        margin-left: 10px;
        font-size: 14px;
        color: #666;
        border: 1px solid #fff;
        box-sizing: border-box;
        cursor: pointer
    }

        .dateMoments span.active {
            border: solid 1px #004a97;
            background-color: #eff6ff;
            color: var(--color-blue)
        }

.search-form input::-webkit-input-placeholder {
    font-weight: 400 !important
}

.search-form input:-moz-placeholder {
    font-weight: 400 !important
}

.search-form input::-moz-placeholder {
    font-weight: 400 !important
}

.manuel-adet span.tooltip-inner {
    display: none
}

.collapse-popup {
    position: absolute;
    top: 60px;
    right: 0;
    background: #fff;
    padding: 10px 20px;
    border-radius: 20px;
    box-shadow: 0 0 20px 0 #d8dde2;
    z-index: 4;
    text-align: left
}

#search-filter {
    right: 8%
}

.collapse-popup:before {
    border-style: solid;
    border-width: 0 10px 10px 10px;
    border-color: transparent transparent #fff transparent;
    content: "";
    position: absolute;
    top: -8px;
    right: 35px;
    z-index: 99
}

#search-filter .form-group {
    padding: 10px 20px;
    border-bottom: 1px solid #f0f0f0
}

    #search-filter .form-group:last-child {
        border-bottom: 0
    }

.saydam {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    z-index: 3
}

.select-ara {
    border-bottom: 1px solid #f8f9fa
}

    .select-ara .input-group-prepend {
        width: 30px;
        height: 40px;
        float: left
    }

        .select-ara .input-group-prepend span {
            border: none;
            height: 40px;
            justify-content: flex-end
        }

            .select-ara .input-group-prepend span svg {
                width: 14px;
                height: 14px
            }

                .select-ara .input-group-prepend span svg path {
                    fill: #666
                }

    .select-ara input {
        height: 40px;
        padding-left: 10px;
        border-radius: 0;
        border: none
    }

.select-filter-content {
    max-height: 150px;
    overflow-y: scroll
}

.kart-logos {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px 0 0;
    float: left
}

.collapse-popup ul li {
    width: 100%;
    padding: 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
}

    .collapse-popup ul li:last-child {
        border-bottom: 0
    }

#indir {
    padding: 0
}

.collapse-popup ul li a {
    color: var(--color-black);
    text-decoration: none;
    padding: 10px 40px 7px 15px;
    display: block
}

.collapse-popup ul li:hover a {
    background-color: #eff6ff;
    color: var(--color-blue)
}

.collapse-popup ul {
    border-radius: 20px;
    overflow: hidden;
    width: max-content;
}

#indir:before {
    right: 26px;
    top: -10px
}

.kargo-bildiri {
    position: fixed;
    z-index: 5;
    bottom: 30px;
    left: 30px;
    width: 80px;
    transition: all ease-in-out .3s
}

.kargo-btn {
    width: 80px;
    height: 80px;
    background: #004a97;
    background: -moz-linear-gradient(328deg,rgba(0,74,151,1) 0,rgba(0,172,200,1) 100%);
    background: -webkit-linear-gradient(328deg,rgba(0,74,151,1) 0,rgba(0,172,200,1) 100%);
    background: linear-gradient(328deg,rgba(0,74,151,1) 0,rgba(0,172,200,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#004a97", endColorstr="#00acc8", GradientType=1);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    float: left;
    transition: all ease-in-out .3s;
    z-index: 2;
    position: relative
}
    .kargo-btn.warning {
        background: rgba(255, 193, 7, 1);
        background: -webkit-linear-gradient(328deg,rgba(255, 193, 7, 1) 0,rgba(239, 114, 21, 1) 100%);
        background: linear-gradient(328deg,rgba(255, 193, 7, 1) 0,rgba(239, 114, 21, 1) 100%);
    }

.kargo-action {
    position: absolute;
    right: -5px;
    z-index: 4;
    top: -5px
}

.kargo-close {
    display: none
}

.kargo-content {
    width: calc(100% - 80px);
    overflow: hidden;
    height: 80px;
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 0 20px 20px 0;
    box-shadow: 0 0 15px 0 rgba(3,31,60,.1);
    transition: all ease-in-out .3s;
    position: relative;
    z-index: 1
}

    .kargo-content .row {
        margin: 0;
        padding: 0 20px;
        width: 300px;
        display: block
    }

    .kargo-content span {
        font-size: 14px;
        width: 100%;
        float: left
    }

    .kargo-content strong {
        color: var(--color-blue);
        font-weight: 600;
        font-size: 18px
    }

.active .kargo-btn {
    border-radius: 20px 0 0 20px
}

.active .kargo-content {
    left: 0
}

.active .kargo-close {
    display: block
}

.active .ok {
    display: none
}

.kargo-action img {
    cursor: pointer
}

.kargo-bildiri.active {
    width: 380px
}

.dataTable tfoot tr td {
    padding-left: 20px;
    color: #fff;
    font-weight: 600
}

.dataTable tfoot tr td {
    background-color: #6589aa
}

.dataTable tfoot tr:hover td {
    background-color: #365571
}

.dataTable thead.color-black tr td {
    color: #000
}

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

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

.pass-show {
    position: absolute;
    right: 20px;
    top: 25px;
    cursor: pointer;
    display: none
}

.pShow {
    display: block
}

.pHide {
    display: none
}

.valid-mess {
    position: absolute;
    right: 20px;
    top: 20px;
    display: none
}

.valid-error .valid-mess, .valid-success .valid-mess, .valid-warning .valid-mess {
    display: block
}

.valid-error label {
    color: #e84545
}

.valid-error input {
    border-color: #e84545 !important
}

.valid-success label {
    color: #00b8a9
}

.valid-success input {
    border-color: #00b8a9 !important
}

.valid-warning label {
    color: #f6c944
}

.valid-warning input {
    border-color: #f6c944 !important
}

.error-tooltip .tooltip-inner {
    background-color: #e84545;
    font-size: 11px
}

.error-tooltip .arrow::before {
    border-top-color: #e84545
}

.warning-tooltip .tooltip-inner {
    background-color: #f6c944;
    font-size: 11px
}

.warning-tooltip .arrow::before {
    border-top-color: #f6c944
}

.mr-20 {
    margin-right: 20px
}

.result-table tbody tr td:nth-child(3) {
    font-weight: 600
}

.table-adet {
    margin: 0 3px;
    transition: all ease-in-out .2s
}

    .table-adet:hover {
        color: var(--color-blue)
    }

.kart-logo-title {
    width: 100%;
    font-size: 14px;
    float: left;
    margin-top: 20px;
    font-weight: 600;
    color: var(--color-blue)
}

.mainSlider .carousel-indicators {
    margin-left: 80px;
    position: absolute;
    z-index: 2;
    text-align: left;
    float: left;
    justify-content: flex-start;
    bottom: 50px;
    top: auto
}

.custommodal .modal-dialog {
    max-width: 570px
}

.custommodal.large .modal-dialog {
    max-width: 930px;
}

.custommodal.extralarge .modal-dialog {
    max-width: 100%;
}

.custommodal .modal-dialog .modal-content {
    padding: 40px 110px 45px 110px;
    text-align: center;
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.45);
    border: solid 1px rgba(229,231,235,.27)
}

.custommodal .modal-dialog .close {
    position: absolute;
    right: -10px;
    top: -10px;
    opacity: 1
}

.custommodal .modal-dialog .modal-content img {
    margin-bottom: 18px
}

.custommodal .modal-dialog .modal-content h3 {
    font-size: 24px;
    font-weight: 600;
    color: #001932;
    margin-bottom: 20px
}

.custommodal .modal-dialog .modal-content p {
    font-size: 16px;
    line-height: 1.56;
    color: #000;
    opacity: .5;
    margin-bottom: 30px
}

.modal-buttons .btn {
    display: inline-block;
    width: 90px;
    margin: 0 10px;
    outline: 0 !important;
    box-shadow: none !important;
}

.custommodal .modal-dialog .form-group {
    text-align: left;
    position: relative;
}

    .custommodal .modal-dialog .form-group .valid-mess {
        top: 36px;
        right: 7px;
    }

.oldmodal .form-group .valid-mess {
    top: 36px;
    right: 40px;
}

.readonlyformarea .form-group .valid-mess {
    top: 36px;
    right: 40px;
}

.readonlyformarea .form-group.long-phone .valid-mess {
    top: 17px;
    right: 40px;
}

.custommodal .modal-dialog .modal-buttons .btn.large {
    width: 43%;
}

.table thead th {
    border-width: 1px;
}

.dt-buttons {
    display: none !important;
}

.dataTables_wrapper {
    display: block;
}

.dataTables_paginate {
    width: auto !important;
    margin-bottom: 40px !important;
}

    .dataTables_paginate li {
        border-radius: 50%;
    }

.tabbable ul.nav.nav-tabs > li {
    text-align: center;
    padding: 0 10px;
}

    .tabbable ul.nav.nav-tabs > li:first-child {
        padding-left: 0px;
    }

    .tabbable ul.nav.nav-tabs > li > a {
        height: 50px;
        border-radius: 10px !important;
        box-shadow: var(--shadow);
        border: solid 1px rgba(188,191,198,.33);
        background-color: #fff;
        box-sizing: border-box;
        padding: 0;
        line-height: 50px;
        color: #2e2e2e;
        font-size: 14px;
        display: block;
        padding: 0px 10px;
    }

.tabbable ul.nav.nav-tabs {
    border: none;
}

    .tabbable ul.nav.nav-tabs > li > a.active {
        background-color: #eff6ff !important;
        color: var(--color-blue) !important;
        border: var(--border-blue) !important;
        position: relative;
    }

    .tabbable ul.nav.nav-tabs > li > a:focus, .tabbable ul.nav.nav-tabs > li > a:hover {
        text-decoration: none;
    }

    .tabbable ul.nav.nav-tabs > li > a.active:before {
        border-style: solid;
        border-width: 0 6px 6px 6px;
        border-color: transparent transparent #eff6ff transparent;
        content: "";
        position: absolute;
        bottom: -6px;
        transform: rotate(180deg);
        left: 50%;
        margin-left: -6px;
        z-index: 2;
    }

    .tabbable ul.nav.nav-tabs > li > a.active:after {
        border-style: solid;
        border-width: 0 8px 8px 8px;
        border-color: transparent transparent #004a97 transparent;
        content: "";
        position: absolute;
        bottom: -8px;
        transform: rotate(180deg);
        left: 50%;
        margin-left: -8px;
        z-index: 1;
    }

.container > h5 {
    margin-top: 35px;
    margin-right: 35px;
    margin-bottom: 15px;
    line-height: 40px;
    font-size: 24px;
    font-weight: 600;
}

.tabbable {
    width: 100%;
}

.dataTables_paginate {
    float: right;
    margin-top: 20px !important;
    margin-bottom: 40px !important
}

.pagination li {
    margin-left: 3px;
    margin-right: 3px;
}

    .pagination li a {
        width: 35px;
        height: 35px;
        display: inline-flex;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
        margin: 2px;
    }

    .pagination li.disabled {
        opacity: .5;
        background: 0 0;
        box-shadow: none
    }

    .pagination li a[aria-label='Previous'] svg {
        transform: rotate(180deg);
        width: 13px;
        height: 12px
    }

    .pagination li a svg path {
        fill: var(--color-blue)
    }

    .pagination li a[aria-label='Next'] svg {
        width: 13px;
        height: 12px
    }

    .pagination li a[aria-label='Previous'], .pagination li a[aria-label='Next'] {
        background-color: #fff;
        box-shadow: var(--shadow)
    }

.pagination li {
    color: var(--color-blue);
    text-decoration: none !important;
    cursor: pointer
}

    .pagination li.current, .pagination li.active {
        border: solid 1px #004a97;
        background-color: #eff6ff;
        box-sizing: border-box;
        border-radius: 50%;
    }

.pagination-wrapper {
    padding-bottom: 40px;
}

.dataTables_wrapper {
    overflow: auto;
}

.dataTable tr td, .dataTable tr th {
    white-space: nowrap;
}

.no-padding-grid.dataTable tbody tr td, .no-padding-grid.dataTable tbody tr th {
    padding-left: 10px;
}

    .no-padding-grid.dataTable tbody tr td:first-child, .no-padding-grid.dataTable tbody tr th:first-child {
        padding-left: 20px;
    }

.download-einvoices-container {
    height: 50px;
}

.usesmallfont.dataTable tbody tr td, .usesmallfont.dataTable tfoot tr td, .usesmallfont.dataTable thead tr th, .usesmallfont.dataTable thead tr td {
    font-size: 12px;
    padding: 5px 5px;
}

    .usesmallfont.dataTable tbody tr td:first-child, .usesmallfont.dataTable tfoot tr td:first-child, .usesmallfont.dataTable thead tr th:first-child, .usesmallfont.dataTable thead tr td:first-child {
        padding-left: 20px;
    }

.showDataTableFilter .dataTables_filter {
    opacity: 1;
    z-index: initial;
    position: initial;
    width: 382px;
    background-color: white;
    border-radius: 20px;
    float: right;
    margin-bottom: 10px;
}

    .showDataTableFilter .dataTables_filter > label {
        margin: 0px 0px 0px !important;
        padding: 0;
        width: auto !important;
        background-color: transparent;
        left: 0;
        bottom: 0;
    }

        .showDataTableFilter .dataTables_filter > label:before {
            width: 20px;
            content: '\f002';
            display: inline-block;
            font: normal normal normal 14px/1 FontAwesome;
            font-size: 20px;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
            color: #dbdbdb;
            height: 25px;
            padding-top: 2px;
            padding-left: 12px;
            padding-right: 4px;
        }

        .showDataTableFilter .dataTables_filter > label > input {
            height: 34px !important;
            width: 93% !important;
            margin-left: 16px;
            border-top-left-radius: 0px;
            border-bottom-left-radius: 0px;
            border: none;
            border-left: 1px solid #dedede;
        }

.dataTable.hasrowfilter {
    margin-top: 10px !important;
}

tr .numeric_column {
    text-align: right !important;
}

tr .text_column {
    text-align: left !important;
}

tr .centerColumn, td.text-center {
    text-align: center !important;
}

label.check-style-selector {
    position: initial;
    left: initial;
    bottom: initial;
    background-color: transparent;
}

.oldmodal.modal {
    background-color: rgba(0, 0, 0, 0.5) !important;
}

    .oldmodal.modal .modal-content {
        width: auto !important;
        background-color: #f5f7f9 !important;
        border-radius: 20px !important;
        box-shadow: 0 0 20px 0 rgba(216,221,226,.45);
        border: solid 1px rgba(229,231,235,.27);
    }

        .oldmodal.modal .modal-content .close {
            right: -10px !important;
            top: -10px !important;
            opacity: 1;
        }

.oldmodal .close:not(:disabled):not(.disabled):focus, .oldmodal .close:not(:disabled):not(.disabled):hover {
    opacity: .75;
}

.content {
    margin-bottom: 40px;
}

tr td[onclick] {
    text-decoration: underline;
}

.ignoretdunderline tr td[onclick] {
    text-decoration: none;
}

#urunDetayContent ul li span {
    width: calc(35%);
}

.readonlyformarea {
    background-color: white;
    padding: 20px;
    border-radius: 20px;
    margin-top: 15px;
}

.modal-v2area {
    display: none;
    height: 100%;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9998;
    background-color: rgba(0, 0, 0, 0.6) !important;
    padding: 10px !important;
}

.modal-v2close {
    display: inline-block;
    position: absolute;
    right: 0px;
    top: 0;
    cursor: pointer;
    right: -10px !important;
    top: -10px !important;
    opacity: 1;
}

.modal-v2 {
    z-index: 9999;
    position: fixed;
    margin: 0 auto;
    opacity: 1;
    left: 0;
    right: 0;
    top: 0;
    min-height: 300px;
    max-height: 600px;
    padding-top: 20px;
    padding-bottom: 20px;
    outline: 0;
    width: auto !important;
    background-color: #f5f7f9 !important;
    border-radius: 20px !important;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.45);
    border: solid 1px rgba(229,231,235,.27);
}

.modal-v2inner {
    max-height: 525px;
    overflow-y: auto;
    min-height: 200px;
    -webkit-overflow-scrolling: touch;
}

.readonlyformarea .form-control:disabled {
    opacity: 1 !important;
    background-color: #e9ecef;
}

#accountsoptions a {
    display: block;
    width: 100%;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    color: #000;
    font-size: 16px;
    text-decoration: none;
    padding: 0;
}

#accountsoptions .list-group {
    padding: 8px 0px;
}

#accountsoptions .list-group-item {
    padding: 10px 20px;
}

#accountsoptions a:hover {
    text-decoration: none;
    color: initial;
}

.btn-blue-large {
    width: 180px !important;
}

.form-control:disabled, .form-control[readonly] {
    background-color: white;
}

.custommodal {
    z-index: 10001;
}

.container.page-view {
    margin-top: 35px;
    border-radius: 20px;
    background-color: white;
    padding-top: 20px;
    padding-bottom: 20px;
}

.sepet-table {
    background: #fff;
    width: 100%;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.45);
    border: solid 1px rgba(229,231,235,.27);
    background-color: #fff;
    border-radius: 20px;
    margin: 20px 0;
    overflow: hidden
}

    .sepet-table thead {
        font-size: 12px;
        color: #949494;
        font-weight: 600
    }

        .sepet-table thead td {
            vertical-align: middle
        }

    .sepet-table tbody {
        color: #666;
        font-size: 14px
    }

    .sepet-table thead tr td {
        border: none;
        border-bottom: 1px solid #f0f0f0;
        border-top: initial;
        color: inherit;
        font-size: inherit;
        font-weight: inherit;
        padding-left: 0.75em;
    }

    .sepet-table tbody tr td {
        border: none;
        border-bottom: 1px solid #f0f0f0;
        padding: .75rem;
    }

    .sepet-table tbody tr:last-child td {
        border: none;
    }

    .sepet-table tbody tr {
        cursor: pointer
    }

        .sepet-table tbody tr.active, .sepet-table tbody tr:hover {
            background-color: rgb(237 239 242 / .6);
            color: #000
        }

.color-black {
    color: #000 !important;
    font-weight: 600
}

.badge-sm {
    width: 5px;
    height: 5px;
    background-color: #FF0000;
    display: inline-block;
    border-radius: 50%
}

    .badge-sm.active {
        background-color: #73c50e
    }

.result-table tbody tr td:nth-child(2), .sepet-table tbody tr td:nth-child(1) {
    text-align: center;
    vertical-align: middle
}

.sepet-table tbody tr td:nth-child(2) {
    font-weight: 600
}

.sepet-footer-table {
    border-radius: 20px;
    background-color: #fff;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.45);
    border: solid 1px rgba(229,231,235,.27);
    text-align: center;
    font-size: 14px;
    color: #666
}

    .sepet-footer-table tr td {
        border: none;
        font-size: 14px;
    }

.sepet-table thead tr td {
    white-space: initial;
}

.sepet-table tbody tr.active .info-btn, .sepet-table tbody tr:hover .info-btn {
    background: #fff
}

.search-result {
    background: #fff;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
    z-index: 8;
    position: absolute;
    width: 100%;
    display: none
}

.result-table {
    margin: 0;
    box-shadow: none;
    border: none;
    border-radius: 0
}

    .result-table tr td:first-child, .result-table tr td:last-child {
        width: 8%
    }

.sepete-ekle {
    background: 0 0;
    border: none;
    padding: 0;
    font-size: 14px;
    color: #666;
    font-weight: 600;
    outline: 0 !important;
    box-shadow: none !important
}

    .sepete-ekle:hover {
        color: var(--color-blue)
    }

.result-close {
    background: rgba(0,0,0,.3);
    position: fixed;
    width: 100%;
    height: 100vh;
    z-index: 6;
    top: 0;
    left: 0;
    display: none
}

.active .icn-search svg path {
    fill: #000
}

.search-close {
    width: 14px;
    height: 14px;
    position: relative;
    margin-right: 30px;
    cursor: pointer;
    opacity: 0;
    transition: all ease-in-out .2s
}

    .search-close span {
        width: 100%;
        height: 2px;
        background: #858585;
        position: absolute;
        border-radius: 1px;
        top: 7px;
        transition: all ease-in-out .2s
    }

        .search-close span:nth-child(1) {
            transform: rotate(45deg)
        }

        .search-close span:nth-child(2) {
            transform: rotate(-45deg)
        }

    .search-close:hover span {
        background: #000
    }

.active .search-close {
    opacity: 1
}

.search-result-row.current {
    background-color: rgba(237, 239, 242, 0.6) !important;
}

.basket-operation-buttons {
    display: block !important;
}

table.basketdetail {
    margin-bottom: 0px;
}

    table.basketdetail thead tr th {
        vertical-align: middle;
    }

.w40 {
    width: 40px !important;
}

.w250 {
    width: 250px !important;
}

.w50 {
    width: 50px !important;
}

.w70 {
    width: 70px !important;
}

.w100 {
    width: 100px !important;
}

.w80 {
    width: 80px !important;
}

.w30 {
    width: 30px !important;
}

.wauto {
    width: auto !important;
}

.fullWidthSlider .slide-ilac-content h3 > button {
    display: none;
}

.itempricearea.passive .partial-loading {
    width: 20px;
}

.btn-line-blue .partial-loading {
    height: 26px;
}

#odemeModal.modal-v2 {
    z-index: 10005;
}

.muadiller-table table {
    box-shadow: none;
    margin: 0
}

    .muadiller-table table tbody tr td:nth-child(1) {
        position: relative;
        align-items: center;
        justify-content: center
    }

        .muadiller-table table tbody tr td:nth-child(1) span {
            position: relative;
            top: 0;
            left: 0;
            margin: 0;
            padding: 0
        }

    .muadiller-table table tr td {
        padding: 7px;
        min-height: 35px
    }

.muadiller-table-detay {
    margin-top: 30px;
    display: none
}

    .muadiller-table-detay table tr td {
        font-size: 14px;
        padding: 5px;
        border-color: #ececec
    }

    .muadiller-table-detay table tr:first-child td {
        border-top: 0
    }

    .muadiller-table-detay table tr td:nth-child(1) {
        font-weight: 600
    }

    .muadiller-table-detay table tr td:nth-child(2) {
        opacity: .5
    }

.onceki-alimlar-table {
    width: 100%;
    float: left;
    overflow-x: scroll
}

    .onceki-alimlar-table table {
        width: 1200px;
        border-radius: 0;
        border: none;
        box-shadow: none;
        margin-top: 0
    }

.onceki-alimlar-table {
    width: 100%;
    float: left;
    overflow-x: scroll
}

    .onceki-alimlar-table table {
        width: 1200px;
        border-radius: 0;
        border: none;
        box-shadow: none;
        margin-top: 0
    }

.tooltip[x-placement='bottom'] {
    z-index: 10001;
}

.btn.btn-blue-auto {
    width: auto !important;
}

.btn-line.addbackorder {
    border-color: #4D81B7;
    background-color: white;
    color: #4D81B7;
}

    .btn-line.addbackorder:hover {
        color: white;
        background-color: #4D81B7;
    }

#bildirimler ul {
    max-height: 380px;
    height: auto;
    overflow: auto;
}

li.note.list-group-item {
    border-bottom: 1px solid #f5f6f7;
}

    li.note.list-group-item a {
        color: #282828;
        font-size: 14px;
        line-height: 20px;
        position: relative;
        display: block;
        text-decoration: none !important;
    }

    li.note.list-group-item:not(.read):before {
        content: "\f27a";
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        position: absolute;
        left: 8px;
        top: 18px;
        color: var(--color-blue);
    }

@media only screen and (max-width: 768px) {
    li.note.list-group-item a {
        color: white;
    }

    li.note.list-group-item {
        border-bottom: 1px solid var(--border-blue);
    }

    #bildirimler ul {
        height: calc(100% - 80px);
        max-height: calc(100% - 80px);
    }
}

input:-internal-autofill-selected,
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    background-color: white !important;
    background-image: none !important;
    -webkit-box-shadow: 0 0 0px 1000px white inset;
    transition: background-color 5000s ease-in-out 0s;
}

table.color-black td:not(.color-blue):not(.color-gray) {
    color: black !important;
}

.m-filter-content.d-flex {
    position: relative;
}

    .m-filter-content.d-flex .collapse-popup {
        right: -16px;
    }

.dataTable tbody tr td.text-center {
    text-align: left !important;
}

.slide-ilac-content h3 {
}

.search-result {
    overflow: hidden;
    max-height: 500px;
    overflow-y: auto;
}

.thead-aligncenter thead tr td, .thead-aligncenter thead tr th {
    text-align: center;
}

.modal-dialog .urun-detay-adetler .manuel-adet {
    margin-left: 0px;
}

.modal-dialog .urun-detay-adetler {
    margin-bottom: 0px;
    width: 100%;
}

    .modal-dialog .urun-detay-adetler .adetler {
        width: 100%;
    }

        .modal-dialog .urun-detay-adetler .adetler span {
            width: calc(15%)
        }

.no-data-found-card {
    text-align: center;
    vertical-align: middle;
    padding: 150px;
    color: var(--gray);
    opacity: 0.65;
}

    .no-data-found-card .icon {
        font-size: 33px;
        margin-bottom: 20px;
    }

    .no-data-found-card .no-data-found-message {
        max-width: 600px;
        font-size: 27px;
        margin: 0 auto;
    }

.kategori-menu {
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.45);
    border: solid 1px rgba(229,231,235,.27);
    background-color: #fff;
    width: 100%;
    float: left;
    margin-top: 30px;
    overflow: hidden;
    position: relative
}

    .kategori-menu strong {
        width: 100%;
        float: left;
        height: 50px;
        display: flex;
        align-items: center;
        box-sizing: border-box;
        padding: 0 18px;
        border-bottom: 1px solid #f0f0f0;
        font-size: 16px;
        position: relative
    }

    .kategori-menu ul li {
        width: 100%;
        height: auto;
        float: left;
        position: relative;
        border-bottom: 1px solid #f0f0f0;
        box-sizing: border-box;
        transition: all ease-in-out .3s
    }

        .kategori-menu ul li a {
            width: 100%;
            float: left;
            height: 50px;
            box-sizing: border-box;
            padding: 0 30px 0px 18px;
            display: block;
            color: #484848;
            font-size: 16px;
            transition: all ease-in-out .3s;
            white-space: nowrap;
            line-height: 50px;
            text-overflow: ellipsis;
            overflow: hidden;
        }

            .kategori-menu ul li a:after {
                right: 18px;
                top: 22px;
                position: absolute;
                border-top: .4em solid !important
            }

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

        .kategori-menu ul li a:hover {
            text-decoration: none;
            background-color: #e0e5ed
        }

        .kategori-menu ul li ul {
            display: none;
            width: calc(100% - 30px);
            margin-left: 15px;
            margin-top: 10px;
            margin-bottom: 10px;
            float: left
        }

        .kategori-menu ul li.active > a {
            background-color: #004a97;
            color: #fff
        }

        .kategori-menu ul li ul li {
            border-bottom: 0
        }

            .kategori-menu ul li ul li a {
                height: 36px;
                line-height: 36px;
                border-radius: 20px
            }

                .kategori-menu ul li ul li a:hover {
                    background-color: #f4f6f9
                }

            .kategori-menu ul li ul li.active > a {
                background-color: #e0e5ed;
                color: #000
            }

            .kategori-menu ul li ul li ul li a {
                padding-left: 30px;
                box-sizing: border-box;
                border: solid 1px transparent
            }

        .kategori-menu ul li.active ul {
            display: block
        }

        .kategori-menu ul li ul li ul li a:before {
            content: "";
            position: absolute;
            width: 5px;
            height: 5px;
            background-color: #e0e5ed;
            left: 15px;
            border-radius: 50%;
            transition: all ease-in-out .3s
        }

        .kategori-menu ul li ul li ul li a:hover {
            border: solid 1px #e0e5ed;
            background-color: transparent;
            box-sizing: border-box
        }

        .kategori-menu ul li ul li ul li.active a {
            color: #000;
            background-color: #f4f6f9
        }

            .kategori-menu ul li ul li ul li.active a:before {
                background-color: #000
            }

        .kategori-menu ul li a.dropdown-toggle {
            pointer-events: none;
            cursor: pointer
        }

.ilac-disi-slider #main-slider {
    margin-top: 0
}

.ilac-disi-slider .mainCarousel .carousel-item {
}

.ilac-disi-slider .slide-content {
    padding: 0 0 0 53px;
    height: 358px;
    width: 52%
}

    .ilac-disi-slider .slide-content:before {
        height: 430px
    }

    .ilac-disi-slider .slide-content .badge {
        font-size: 14px
    }

    .ilac-disi-slider .slide-content .row {
        margin-left: 0
    }

    .ilac-disi-slider .slide-content p {
        font-size: 16px
    }

.ilac-disi-slider .slide-img {
    height: 358px
}

.psf-table {
    margin-top: 15px !important;
    color: #000;
    border-bottom: none !important;
    width: 100%;
    float: left;
    margin-bottom: 0
}

    .psf-table td {
        color: #000 !important;
        font-weight: 600
    }

.ilac-disi-urun-liste .slide-ilac-content {
    min-height: 335px
}

.icn-uyari {
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background-color: #a3abb2;
    border: none;
    text-align: center;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    z-index: 2;
    top: 15px;
    left: 45px;
    transition: all ease-in-out .3s
}

    .icn-uyari svg {
        position: relative;
        right: -1px
    }

    .icn-uyari:hover {
        background: #000
    }

.ilac-disi-urun-liste .selectbox-menu {
    width: calc(100% - 30px)
}

.selectListTop button {
    width: 100% !important
}

.ilac-disi-slider .carousel-indicators {
    margin-left: 50px !important;
    bottom: 10px !important
}

.ilac-disi-alt-slider {
    margin-bottom: 30px
}

    .ilac-disi-alt-slider .slide-img-card {
        border-radius: 20px !important;
        border: solid 1px rgba(221,221,221,.3) !important;
        height: 200px !important;
        position: relative;
        padding: 0 !important
    }

    .ilac-disi-alt-slider .slide-ilac-content {
        padding: 0 10px 0 0 !important
    }

.ilac-breadcrumb {
    position: relative;
    width: 100%
}

    .ilac-breadcrumb span {
        font-size: 24px;
        line-height: 24px;
        font-weight: 600;
        margin-right: 10px
    }

    .ilac-breadcrumb img {
        width: 12px;
        margin-right: 10px
    }

.firsat-badge, .kampanya-badge {
    position: absolute;
    border-radius: 10px;
    background-color: #00acc8;
    font-size: 12px;
    padding: 0 10px;
    height: 20px;
    color: #fff;
    font-weight: 300;
    top: 15px;
    line-height: 20px;
    left: 45px
}

.kampanya-badge {
    background-color: #f59917
}

.ilac-breadcrumb.active {
    border-bottom: 1px solid #f0f0f0
}

.ilac-disi-urun-liste .slide-img-card {
    height: 200px;
    border-bottom: 1px solid #e9eef2;
    margin-bottom: 15px
}

.kategori-menu ul li.active a:after {
    transform: rotate(180deg)
}

.ilac-disi-alt-slider .btn-line-blue {
    margin-top: 20px
}

.login-bg {
    width: 100%;
    height: 820px;
    background-size: cover;
    background-position: center;
    max-height: 100vh
}

.login-form {
    width: 500px;
    background: #fff;
    box-sizing: border-box;
    padding: 35px 50px 45px;
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
    border: solid 1px rgba(229,231,235,.27)
}

.login-baslik {
    font-size: 30px;
    line-height: 1.5;
    font-weight: 600;
    width: 80%;
    margin-bottom: 50px
}

.login-logo {
    width: 100%;
    float: left;
    margin-top: 100px;
    margin-bottom: 26px
}

.line-black-btn {
    width: 114px;
    height: 50px;
    margin: 195px 694px 116px 1px;
    padding: 15px 24px 15px 25px;
    border-radius: 10px;
    border: solid 1px #000;
    color: #000;
    font-weight: 600;
    font-size: 16px;
    text-decoration: none !important;
    transition: all ease-in-out .3s
}

    .line-black-btn:hover {
        background-color: #000;
        color: #fff
    }

.login-form-head {
    width: 100%;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

    .login-form-head a {
        float: right
    }

    .login-form-head h1 {
        float: left
    }

#yenilikler {
    width: 100%;
    float: left;
    background-color: #fff
}

#yenilik-slider-1 {
    width: 100%;
    height: 700px;
    border-radius: 0 20px 20px 0;
    overflow: hidden;
    position: relative;
    max-height: 100vh
}

    #yenilik-slider-1 .carousel-item {
        width: 100%;
        height: 700px;
        float: left;
        background-size: cover;
        background-position: center
    }

#yenilik-slider-2 {
    width: 100%;
    height: 700px;
    border-radius: 20px 0 0 20px;
    overflow: hidden;
    position: relative;
    max-height: 100vh
}

    #yenilik-slider-2 .carousel-item {
        width: 100%;
        height: 700px;
        float: left;
        background-size: cover;
        background-position: center
    }

.yenilik-content {
    width: 100%;
    box-sizing: border-box;
    padding-left: 180px;
    padding-right: calc((100vw - 1300px) / 2);
}

.ml-100 {
    margin-left: 100px
}

.mr-100 {
    margin-right: 100px
}

.yenilik-content h2 {
    font-size: 45px;
    font-weight: 700;
    margin-bottom: 40px
}

.yenilik-content strong {
    font-size: 26px;
    font-weight: 600;
    line-height: 1.35;
    color: #8e949d;
    margin-bottom: 45px;
    width: 100%;
    float: left
}

.yenilik-content p {
    font-size: 20px;
    line-height: 1.5;
    padding-bottom: 30px;
    color: #8e949d
}

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

#sancak-ozellikler {
    width: 100%;
    float: left;
    background-color: #fff;
    padding-top: 135px
}

    #sancak-ozellikler h2 {
        font-size: 40px;
        width: 100%;
        float: left;
        text-align: center;
        margin-bottom: 75px;
        font-weight: 800
    }

.ozellik-box {
    margin-bottom: 100px
}

.ozellik-icn {
    width: 70px;
    float: left;
    margin-right: 20px
}

.ozellik-content {
    float: left;
    width: calc(100% - 90px);
    box-sizing: border-box
}

    .ozellik-content h3 {
        font-size: 24px;
        font-weight: 600;
        line-height: 1.25;
        color: #000;
        margin-bottom: 10px
    }

    .ozellik-content p {
        font-size: 18px;
        line-height: 1.65;
        color: #8e949d;
        width: 75%
    }

#merak-ettiginiz {
    width: 100%;
    float: left;
    background: #fff
}

.merak-bg {
    width: 100%;
    border-radius: 20px;
    background-color: #eaf0f4;
    float: left;
    overflow: hidden
}

.merak-content {
    width: 60%;
    float: left;
    height: 455px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 120px
}

.merak-img {
    width: 40%;
    float: left;
    height: 455px;
    display: flex;
    align-items: flex-end;
    right: -10px;
    position: relative;
    bottom: -10px
}

.giris-footer {
    width: 100%;
    float: left;
    background: #fff
}

    .giris-footer .bottom-footer {
        padding: 80px 0
    }

    .giris-footer .copyright {
        color: #000;
        font-size: 16px;
        font-weight: 600
    }

.merak-content h2 {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.29;
    color: #000;
    margin-bottom: 10px
}

.merak-content p {
    font-size: 20px;
    line-height: 1.46;
    color: #474747
}

.merak-tel {
    width: 240px;
    height: 50px;
    border-radius: 25px;
    background-color: #004a97;
    color: #fff !important;
    text-decoration: none !important;
    text-align: center;
    font-size: 18px;
    line-height: 50px;
    margin-top: 20px
}

.merak-img img {
    border-top-left-radius: 20px
}

.giris-footer .logos a {
    opacity: 1
}

.leftYenilikSlider .carousel-control-next, .leftYenilikSlider .carousel-control-prev, .rightYenilikSlider .carousel-control-next, .rightYenilikSlider .carousel-control-prev {
    border-radius: 20px;
    box-shadow: 0 0 20px 0 rgba(216,221,226,.31);
    border: solid 1px rgba(229,231,235,.27);
    background-color: #fff;
    width: 40px;
    height: 40px;
    opacity: 1;
    top: auto;
    bottom: 30px
}

    .leftYenilikSlider .carousel-control-next svg path, .leftYenilikSlider .carousel-control-prev svg path, .rightYenilikSlider .carousel-control-next svg path, .rightYenilikSlider .carousel-control-prev svg path {
        fill: var(--color-blue);
        opacity: .7;
        transition: all ease-in-out .3s
    }

.leftYenilikSlider .carousel-control-prev {
    left: auto;
    right: 90px;
    transform: rotate(180deg)
}

.rightYenilikSlider .carousel-control-prev {
    right: auto;
    left: 30px;
    transform: rotate(180deg)
}

.rightYenilikSlider .carousel-control-next {
    left: 90px
}

.leftYenilikSlider .carousel-control-next {
    right: 30px
}

    .leftYenilikSlider .carousel-control-next:hover svg path, .leftYenilikSlider .carousel-control-prev:hover svg path, .rightYenilikSlider .carousel-control-next:hover svg path, .rightYenilikSlider .carousel-control-prev:hover svg path {
        opacity: 1
    }

.ilac-disi-adetler {
    width: calc(100% + 10px);
    margin-left: -5px;
    position: relative;
    float: left
}

.adet-box {
    width: calc(33.3% - 10px);
    float: left;
    margin: 5px;
    cursor: pointer
}

    .adet-box span {
        margin: 0 !important;
        width: 100%;
        height: 30px;
        float: left;
        border: solid 1px rgba(0,74,151,.27);
        background-color: #f1f6f9;
        text-align: center;
        border-radius: 10px 10px 0 0;
        font-size: 12px;
        font-weight: 600;
        color: #004a97;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .adet-box strong {
        width: 100%;
        float: left;
        height: 30px;
        background-color: #b0c8de;
        border-radius: 0 0 10px 10px;
        color: #01376f;
        font-size: 12px;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .adet-box.active span {
        border: solid 1px #004a97
    }

    .adet-box.active strong {
        background-color: #004a97;
        color: #fff
    }

.kategori-menu > ul {
    width: 100%;
    float: left;
    height: calc(100vh - 250px);
    overflow-y: scroll;
    position: relative;
    padding-bottom: 50px
}

.kategori-menu:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 50px;
    background: #fff;
    background: -moz-linear-gradient(0deg,rgba(255,255,255,1) 0,rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(0deg,rgba(255,255,255,1) 0,rgba(255,255,255,0) 100%);
    background: linear-gradient(0deg,rgba(255,255,255,1) 0,rgba(255,255,255,0) 100%);
    bottom: 0;
    left: 0;
    z-index: 9
}

.ilac-sidebar {
    will-change: min-height;
    padding: 0 !important
}

    .ilac-sidebar .sidebar__inner {
        position: relative;
        transform: translate(0,0);
        transform: translate3d(0,0,0);
        will-change: position,transform;
        margin: 0 !important;
        padding-bottom: 30px
    }

.ilac-disi-urun-liste {
    margin-bottom: 0
}

.landing-container {
    width: 1300px;
    margin: auto;
    position: relative
}

.yenilikSliderRow {
    width: 100%;
    margin-bottom: 100px
}

.yenilikSliderImgs {
    width: 100%;
    height: 700px;
    float: left;
    background-size: cover;
    background-position: center
}

.leftYenilikSlider .yenilikSliderImgs {
    border-radius: 0 20px 20px 0
}

.rightYenilikSlider {
    float: right;
    margin-bottom: 0
}

    .rightYenilikSlider .yenilik-content {
        padding-left: calc((100vw - 1300px) / 2);
        padding-right: 200px;
    }

    .rightYenilikSlider .yenilikSliderImgs {
        border-radius: 20px 0 0 20px
    }

.loginFormCol {
    justify-content: flex-end;
}

.kategori-menu > ul > li > a::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
}

.item-note-detail {
    font-size: 12px;
    margin-bottom: 10px;
    color: #666;
}

.shownotesinmodel .urun-foto, .shownotesinmodel .urun-adi, .shownotesinmodel .siparis-detay-adet {
    margin-bottom: 10px;
    padding-bottom: 0px;
}

.tag-badge {
    border-radius: 10px;
    background-color: #00acc8;
    font-size: 12px;
    padding: 3px 10px;
    color: #fff;
    font-weight: normal;
    top: 3px;
    position: relative;
    margin-left: 5px;
}

.badge-sm.notavailable, .badge-md.notavailable, .slide-img-card span.notavailable {
    background-color: #212529;
}

.badge-sm.hasquatoproblem, .badge-md.hasquatoproblem, .slide-img-card span.hasquatoproblem {
    background-color: #FF0000
}

.slide-img-card svg.maximize-icon {
    position: absolute;
    top: 40px;
    left: auto;
    right:14px;
}

.smallslider .slide-img-card svg.maximize-icon {
    position: absolute;
    top: 40px;
    right: 14px;
    left: unset;
}

.line-black-btn.goto:hover svg path {
    fill: white;
}

.info-btn.small-slider-button {
    position: absolute;
    top: 15px;
    right: 15px;
    border: 1px solid #aaa;
}

.smallslider .slide-ilac-content h3 button {
    display: none;
}

.slide-ilac-content .tevzili-urun {
    border-radius: 14px;
    color: #FF0000;
    background-color: white;
    border: 1px solid #FF0000;
    padding: 15px 15px;
    text-align: center;
}

.fullWidthSlider .slide-img-card span.bigmesssage {
    width: auto;
    height: auto;
    padding: 0 15px;
    top: 0;
    right: 0;
    border-bottom-right-radius: 0px;
    border-top-left-radius: 0px;
}

.siparis-detay-message {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.siparis-detay-message-info {
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    min-width: 90px;
    height: 40px;
    border-radius: 10px;
    border: solid 1px #FF0000;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 600;
    color: #FF0000;
    outline: 0 !important;
    box-shadow: none !important;
}

.not-supported-browser {
    text-align: center;
    padding: 40px;
}

    .not-supported-browser h2 {
        color: #004a97;
        margin-bottom: 40px;
    }

    .not-supported-browser .p {
        font-size: 18px;
    }

.browsers {
    margin-top: 40px;
}

    .browsers .browser {
        display: inline-block;
        margin: auto 10px;
    }

.not-supported-browser span {
    background: url(/Content/images/browsers-bg.png) no-repeat;
    background-size: auto 200px;
    width: 100px;
    display: flex;
    height: 100px;
}

.not-supported-browser #chrome {
    width: 100px;
}

    .not-supported-browser #chrome span {
        background-position: 0 -100px;
    }

        .not-supported-browser #chrome span:hover {
            background-color: #f2b635;
            background-position: 0 0px;
        }

.not-supported-browser #firefox {
    width: 100px;
}

    .not-supported-browser #firefox span {
        background-position: -100px -100px;
    }

        .not-supported-browser #firefox span:hover {
            background-color: #f19a2a;
            background-position: -100px 0px;
        }

.not-supported-browser #safari {
    width: 100px;
}

    .not-supported-browser #safari span {
        background-position: -300px -100px;
    }

        .not-supported-browser #safari span:hover {
            background-color: #00a0e6;
            background-position: -300px 0px;
        }

.not-supported-browser #opera {
    width: 100px;
}

    .not-supported-browser #opera span {
        background-position: -400px -100px;
    }

        .not-supported-browser #opera span:hover {
            background-color: #f25648;
            background-position: -400px 0px;
        }

.star-svg path {
    fill: rgb(245, 153, 23);
}

.star-svg {
    transform: scale(0.4);
    position: relative;
    top: -10px;
    right: 9px;
}

    .star-svg.mf {
        right: 30px;
        top: 0px;
        position: absolute;
    }

.table.sepet-table.result-table .star-svg.mf {
    position: relative;
    top: -10px;
    right: 3px;
}

.slide-ilac-content .flagstar {
    position: relative;
}

    .slide-ilac-content .flagstar svg {
        transform: scale(0.4);
        position: absolute;
        top: -1px;
        right: -20px;
    }

    .slide-ilac-content .flagstar.itemsalesprice.ilacdisifiyat svg {
        top: 10px;
    }

.altSlider .carousel-control-next, .altSlider .carousel-control-prev {
    width: 45px;
    height: 45px;
}

    .altSlider .carousel-control-next svg, .altSlider .carousel-control-prev svg, .swiper-button-next svg, .swiper-button-prev svg {
        width: 18px;
        height: 18px;
    }

.carousel-indicators li {
    height: 8px !important;
    width: 8px !important;
}

.swiper-pagination-bullet {
    width: 8px !important;
    height: 8px !important;
}

.badge-sm {
    width: 8px;
    height: 8px;
}

.daysdue-selection {
    margin-top: -11px;
}

    .daysdue-selection .daysdue-box {
        width: calc(50% - 10px);
        height: 30px;
        display: flex;
        float: left;
        background-color: white;
        margin: 5px;
        color: slateblue;
        border-radius: 10px;
        border: solid 1px rgba(106, 90, 205,.50);
        cursor: pointer;
        align-items: center;
        justify-content: center;
        font-size: 12px;
        font-weight: 600;
    }

        .daysdue-selection .daysdue-box.active {
            background-color: slateblue;
            color: whitesmoke;
        }

.table.sepet-table.result-table .daysdue-selection {
    display: none;
}

.siparis-detay-modal .daysdue-selection {
}

.relativeanlasma {
    position: absolute;
    top: 0.75rem;
}

.anlasma-kolonu.hasmultiple {
    vertical-align: middle;
    position: relative;
}

    .anlasma-kolonu.hasmultiple .anlasmagroup {
        position: relative;
        display: inline-flex;
        border: 1px solid gold;
        border-radius: 100%;
        padding: 5px;
        width: 30px;
        height: 30px;
        align-items: center;
    }

        .anlasma-kolonu.hasmultiple .anlasmagroup + .anlasmagroup {
            margin-left: 15px;
        }

        .anlasma-kolonu.hasmultiple .anlasmagroup .anlasma-deger {
            margin: 0px;
        }

        .anlasma-kolonu.hasmultiple .anlasmagroup .anlasma-gun {
            position: absolute;
            font-size: 9px;
            top: -10px;
            right: -21px;
        }

.notification-label {
    top: 0;
    color: #fff;
    left: 0;
    background: #00acc8;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    text-align: center;
    line-height: 17px;
    font-size: 11px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-transition: all .3s;
    transition: all .3s;
}

.dataTable tbody tr td {
    border-top: 1px solid #f0f0f0;
    padding-left: 40px;
    font-size: 14px;
    color: #666;
}

.dataTable tfoot tr td {
    padding-left: 40px;
    color: #fff;
    font-weight: 600
}

.dataTable tfoot tr.bg-blue-dark td {
    background-color: #ebf4ff;
    color: #191919
}

.dataTable tfoot tr.bg-blue-dark:hover td {
    background-color: #ccdef3
}

.dataTable thead.color-black tr td {
    color: #000
}

#faliyet1 thead td {
    font-size: 16px;
    background: #2484ff;
    color: #fff
}

#faliyet1_wrapper .dataTable {
    padding-bottom: 0px !important;
}

#faliyet1 {
    border: 1px solid #2484ff;
    box-shadow: none
}

    #faliyet1 tr td {
        font-size: 16px;
        text-align: right;
        vertical-align: middle
    }

        #faliyet1 tr td:first-child {
            text-align: left
        }

        #faliyet1 tr td:last-child {
            padding-right: 50px
        }

    #faliyet1 tbody tr td:first-child {
        color: #000;
        font-weight: 400
    }

.genelToplam span {
    background-color: #2484ff;
    color: #fff;
    padding: 4px 15px;
    box-sizing: border-box;
    border-radius: 20px;
    line-height: 14px
}

#faliyet2_wrapper .dataTable {
    padding-bottom: 0px !important;
}



#faliyet2 thead td {
    background-color: #004a97;
    color: #fff;
    height: 50px;
    box-sizing: border-box;
    font-size: 16px;
    vertical-align: middle;
    font-weight: 600
}

#faliyet2 {
    border: 1px solid #004a97
}

    #faliyet2 td:first-child {
        width: 80% !important;
        text-align: left
    }

    #faliyet2 td {
        text-align: right;
        padding-right: 40px;
        font-size: 16px;
        font-weight: 500
    }

.row-black td {
    color: #000 !important;
    font-weight: 600 !important
}

    .row-black td img {
        display: inline-block;
        margin-left: 7px
    }

    .row-black td span {
        background-color: #f0f0f0;
        padding: 5px 20px;
        border-radius: 20px
    }

#faliyet2 tfoot tr td {
    vertical-align: middle;
    font-weight: 600;
    color: #191919
}

#faliyet3 thead td, #faliyet4 thead td {
    background-color: #002c5a;
    color: #fff;
    font-size: 16px;
    box-sizing: border-box;
    text-align: right;
    padding: 0;
    height: 50px;
    vertical-align: middle;
    padding: 0 40px
}

    #faliyet3 thead td:first-child, #faliyet4 thead td:first-child {
        text-align: left
    }

#faliyet2 tbody td {
    box-sizing: border-box;
    height: 42px;
    padding: 0 40px;
    vertical-align: middle
}

#faliyet1 tbody td {
    height: 42px;
    box-sizing: border-box;
    padding-top: 0;
    padding-bottom: 0;
    vertical-align: middle
}

.pieID {
    display: inline-block;
    vertical-align: top
}

.pie {
    height: 300px;
    width: 300px;
    position: relative;
    margin: 0 100px 0 0
}

    .pie::before {
        content: "";
        display: block;
        position: absolute;
        z-index: 1;
        width: 180px;
        height: 180px;
        background: #fff;
        border-radius: 50%;
        top: 60px;
        left: 60px
    }


.pieID2 {
    display: inline-block;
    vertical-align: top
}

.pie2 {
    height: 300px;
    width: 300px;
    position: relative;
    margin: 0 100px 0 0
}

    .pie2::before {
        content: "";
        display: block;
        position: absolute;
        z-index: 1;
        width: 180px;
        height: 180px;
        background: #fff;
        border-radius: 50%;
        top: 60px;
        left: 60px
    }

.legend2 {
    width: 395px;
    height: 250px;
    padding: 64px 20px 20px 30px;
    border-radius: 20px;
    background-color: #f5f7f9
}

    .legend2 span:before {
        content: "%";
        font-size: 16px;
        font-weight: 600;
        color: #000;
        position: absolute;
        left: -15px
    }

    .legend2 li {
        width: 100%;
        height: 20px;
        margin-bottom: 30px
    }

    .legend2 em {
        font-style: normal;
        font-size: 16px;
        font-weight: 600;
        line-height: 20px;
        float: left
    }

    .legend2 span {
        float: right;
        font-weight: 600;
        position: relative
    }

@media (max-width: 768px) {
    .grafik-content {
        flex-direction: column;
        align-items: center;
    }

    .grafik-content .pie,
    .grafik-content .legend {
        width: 100%;
        text-align: center;
        margin-left: auto;
        margin-bottom: 15px;
    }

    .grafik-content .pie2,
    .grafik-content .legend2 {
        width: 100%;
        text-align: center;
        margin-left: auto;
        margin-bottom: 15px;
    }

    .legend {
        padding: 40px 10px 20px 15px !important;
    }

    .legend2 {
        padding: 60px 10px 20px 15px;
    }
}


.slice {
    position: absolute;
    width: 300px;
    height: 300px;
    clip: rect(0,300px,300px,150px);
    animation: bake-pie 1s
}

    .slice span {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        background-color: #000;
        width: 300px;
        height: 300px;
        border-radius: 50%;
        clip: rect(0,300px,300px,150px)
    }

.legend {
    width: 395px;
    height: 250px;
    padding: 39px 36px 40px 38px;
    border-radius: 20px;
    background-color: #f5f7f9
}

    .legend li {
        width: 100%;
        height: 20px;
        margin-bottom: 30px
    }

    .legend em {
        font-style: normal;
        font-size: 16px;
        font-weight: 600;
        line-height: 20px;
        float: left
    }

    .legend span {
        float: right;
        font-weight: 600;
        position: relative
    }

.faaliyet-raporu-grafik {
    border-radius: 20px;
    border: solid 1px rgba(0,44,90,.14);
    background-color: #fff;
    width: 100%;
    float: left;
    margin-bottom: 100px
}

.grafik-head {
    width: 100%;
    height: 50px;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: space-between
}

    .grafik-head h2, .grafik-head strong {
        color: #002c5a;
        font-weight: 700;
        font-size: 16px;
        margin-left: 27px
    }

    .grafik-head strong {
        margin-right: 30px
    }

.grafik-content {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 70px 0
}

.renk {
    width: 20px;
    height: 20px;
    float: left;
    border-radius: 50px;
    margin-right: 15px
}

.legend span:before {
    content: "%";
    font-size: 16px;
    font-weight: 600;
    color: #000;
    position: absolute;
    left: -15px
}

.blue-link a {
    color: #004a97 !important;
    display: flex
}

.blue-link img {
    margin-right: 8px
}

.color-red {
    color: red !important;
}

.color-orange {
    color: orange !important;
}

.insert-bildiri {
    position: fixed;
    z-index: 5;
    bottom: 30px;
    right: 30px;
    width: 80px;
    transition: all ease-in-out .3s
}

.insert-btn {
    width: 80px;
    height: 80px;
    background: #ff5858;
    background: -moz-linear-gradient(347deg,rgba(255,88,88,1) 0,rgba(240,152,25,1) 100%);
    background: -webkit-linear-gradient(347deg,rgba(255,88,88,1) 0,rgba(240,152,25,1) 100%);
    background: linear-gradient(347deg,rgba(255,88,88,1) 0,rgba(240,152,25,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff5858", endColorstr="#f09819", GradientType=1);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    float: left;
    transition: all ease-in-out .3s;
    z-index: 2;
    position: relative
}

.insert-action {
    position: absolute;
    right: -5px;
    z-index: 4;
    top: -5px
}

.insert-close {
    display: none
}

.insert-content {
    width: calc(100% - 80px);
    overflow: hidden;
    height: 80px;
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 0 20px 20px 0;
    box-shadow: 0 0 15px 0 rgba(3,31,60,.1);
    transition: all ease-in-out .3s;
    position: relative;
    z-index: 1
}

    .insert-content .row {
        margin: 0;
        padding: 0 20px;
        width: 300px;
        display: block
    }

    .insert-content span {
        font-size: 14px;
        width: 100%;
        float: left
    }

    .insert-content a {
        color: var(--color-blue);
        font-weight: 600;
        font-size: 18px
    }

.active .insert-btn {
    border-radius: 20px 0 0 20px
}

.active .insert-content {
    left: 0
}

.active .insert-close {
    display: block
}

.active .ok {
    display: none
}

.insert-action img {
    cursor: pointer
}

.insert-bildiri.active {
    width: 380px
}

.insert-bildiri.mobilPasif {
    opacity: 0;
    z-index: -1;
}

.kargo-bildiri.mobilPasif {
    opacity: 0;
    z-index: -1;
}

.coin {
    position: absolute;
    top: 140px;
    right: 10px;
    width: 50px;
    height: 50px;
    background: url(/assets/images/point.svg);
    border-radius: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

.altSlider .card .coin {
    top: 12px;
    right: 40px;
}

.card .coin {
    top: 14px;
    right:40px;
}

.ilac-disi-urun-liste.ilac-disi-slider .card .coin {
    top: 14px;
    right:40px;
}

.coin .coin-value {
    width: 88%;
    height: 88%;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(255, 123, 0);
    font-size: 12px;
}
.coin-place {
    position: relative;
    display: inline;
    margin-left: 10px;
    top: 2px;
    padding: 0 10px;
}
    .coin-place .coin {
        left: 0px;
        width: fit-content;
        min-width: auto;
        height: auto;
        display: inline-flex;
        position: absolute;
        top: -5px;
        background: var(--color-blue);
        border-radius: 5px;
        padding: 0 10px;
        border-color: #00acc8;
        border: 3px solid rgb(176, 200, 222);
        color: rgb(255, 123, 0);
    }
    .point-summary .point, .point-summary .pointtotal {
    background: var(--color-blue);
    border-radius: 5px;
    padding: 0 5px;
    border-color: #00acc8;
    border: 3px solid rgb(176, 200, 222);
    color: rgb(255, 123, 0);
    font-weight:bold;

    }
.coin-place .coin .coin-value {
    font-size: 14px;
}
.point-summary .coin {
    position:initial;
    display:inline-flex;
}
/*Düzenleme 1*/
div#siparisOnay {
    margin-left: -60px;
}
#siparisOnay table tr td, #siparisOnay table tr th {
    padding:10px;
}

.dropdown-menu.largereportmenu {
    width: 480px;
}
.largereportmenu li.nav-item.dropdown.parentevent {
    width: fit-content;
    float: left;
    margin: 0px !important;
}
    .largereportmenu li.nav-item.dropdown.parentevent .dropdown-menu {
        display: block;
        position: relative;
        display:block;
    }
            .largereportmenu li.nav-item.dropdown.parentevent .dropdown-menu::before {
            display:none;
        }
.largereportmenu > ul > li > div.dropdown-menu {
    box-shadow: none;
}
.largereportmenu .dropdown-toggle::after {
    display: none;
}
.largereportmenu .dropdown-toggle {
    border-bottom: 1px solid #e5e7eb;
}
#loyaltymenu svg#giftico {
    color: #004a97;
    width: 25px;
    position: relative;
    top: -5px;
}
    #loyaltymenu svg#giftico path {
        fill: #004a97;
    }
div#search-detay.loading {
    background-color: #fefefe;
}
    div#search-detay.loading .container, div#search-detay.loading .siparis-detay-bilgiler {
        visibility: hidden;
    }
    div#search-detay.loading .adetler, div#search-detay.loading .manuel-adet {
        display: none;
    }
        div#search-detay.loading .search-detay-loading {
        width: 100%;
        height: 100%;
        text-align: center;
        position: absolute;
        display: flex !important;
        align-items: center;
        justify-content: center;
        color: rgba(0,74,151,0.8);
        font-size: 24px;
        font-weight: bold;
    }
.siparis-detay-modal .container {

}
.modal-dialog .urun-detay-right .coin {

}
li.list-group-item.has-spacer {
    border-bottom: 1px solid #e5e7eb;
}

.muadil-alim-btn {
    margin-right: 8px;
    background: #ffffff;
    border-radius: 5px;
    border-style: solid;
    border-color: #004a97;
    border-width: 1px;
    padding: 4px 8px 4px 8px;
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    width: 30%;
    color: #004a97;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

    .muadil-alim-btn:hover {
        background: #003366;
        color: #ffffff;
    }


.muadiller-alimlar {
    text-align: center;
    font-family: "SourceSansPro-Regular", sans-serif;
    font-size: 12px;
    font-weight: 400;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.copied {
    display: flex;
    padding: 4px 6px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    background: #FFF;
    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25);
    position: absolute;
    visibility: hidden;
    pointer-events: none;
}

.siparis-detay-modal .siparis-detay-bilgiler .urun-kodu {
    width: 12%;
}

@media (max-width: 972px) {
    .grafik-container {
        display: flex;
        flex-direction: column;
        align-items: anchor-center;
    }
}

@media (max-width: 1500px) {
    .legend {
        margin-top:10px;
    }

    .legend2 {
        margin-top: 10px;
    }

    .grafik-content {
        flex-direction: column;
    }

    .pie {
        margin: 0px 100px 0px 100px;
    }

    .pie2 {
        margin: 0px 100px 0px 92px;
    }
}