html, body {
    font-family: 'Muli', sans-serif;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type="number"] {
    -moz-appearance: textfield;
}

.clearfix {
    clear: both;
    width: 100%;
}

:focus {
    outline: none
}

.basgislarWrap .bagislarLeft .boxs .box .info .bottom .fiyat span.sayi input {
    width: 100%;
    text-align: center;
    font-weight: 700;
    font-size: 16px;
    color: var(--theme-color);
    border-style: none;
    margin-right: 2px;
    margin-left: 2px
}

.whatsapp a {
    color: #212529
}

.whatsapp a:hover {
    color: #358924
}

.boxbackground {
    border-radius: 10px 10px 0 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center
}

.boxbackground:hover {
    transform: scale(0.97);
    transition: 2s
}

.sayikucult {
    width: 32% !important
}

.tlkucult {
    width: 68% !important
}

.ozelbuton {
    font-size: 16px
}

.iletisimBilgileri, .siparisTamamla {
    display: none
}

.foto_galeri h2 a {
    color: var(--theme-color);
}

.foto_galeri h6 a {
    color: var(--theme-color);
}

.foto_galeri h2 a:hover {
    text-decoration: underline
}

.foto_galeri h6 a:hover {
    text-decoration: underline
}

.kurgoster {
    background: #fafafa;
    text-align: center;
    font-weight: 700;
    font-size: 16px;
    color: #666;
    line-height: 38px;
    border-left: 1px solid #c1c1c1 !important
}

.sepetItems:last-child .cizgi {
    display: none
}

.modal {
    z-index: 9999999 !important
}

.bagisresim {
    width: 60%;
    display: table-cell;
    vertical-align: middle;
}

.bagisresim img {
    width: 100%
}

@media only screen and (max-width: 1199px) {
    .bagisConteiner {
        width: 100% !important
    }

    .bagis .bagisConteiner .bagisContent h1 {
        margin-bottom: 20px !important
    }
}

@media only screen and (max-width: 999px) {
    .bagisConteiner {
        width: 100% !important
    }


    .bagis .bagisConteiner .bagisContent h1 {
        margin-bottom: 20px !important
    }

    .bagis .bagisConteiner {
        display: block !important;
        margin: 0 0 20px !important;
    }
    .bagisresim {
        width: 100%;
        float: none;
        display: block;
        vertical-align: inherit;
    }

    .bagisContent {
        padding: 0 !important;
        width: 100% !important;
        display: block;
        vertical-align: inherit;
    }

    .bagis .bagisConteiner .bagisContent {
        padding: 20px 0 0 !important;
    }

    .bagis .bagisConteiner .bagisContent h1 {
        font-size: 26px !important
    }

    .whatsapp {
        width: 40px
    }

    .whatsapp a span {
        display: none
    }

    .whatsapp a img {
        margin-right: 0
    }
}

.bagisDetay iframe {
    width: 100% !important
}

.bagisContent .sayi input {
    width: 100%;
    text-align: center;
    font-weight: 700;
    font-size: 16px;
    color: var(--theme-color);
    border-style: none;
    margin-right: 2px;
    margin-left: 2px
}

.bagissozlesmepopup {
    margin: 0 auto;
    width: 792px;
    height: auto;
    border-radius: 5px;
    overflow: hidden;
    background: #fff;
    margin-top: 20px
}

@media only screen and (max-width: 800px) {
    .bagissozlesmepopup {
        display: inline
    }
}

.bagissozlesmepopup .top {
    height: 50px;
    width: 100%;
    background: var(--theme-color);
    display: flex;
    align-items: center;
    padding: 0 13px 0 5px
}

.bagissozlesmepopup .top .sayi {
    width: 43px;
    height: 39px;
    border: 2px solid #fff;
    border-radius: 5px;
    font-weight: 400;
    font-size: 25px;
    text-align: center;
    color: #fff
}

.bagissozlesmepopup .top .baslik {
    font-weight: 700;
    font-size: 20px;
    text-align: center;
    color: #fff;
    width: 100%;
    cursor: pointer
}

.bagissozlesmepopup .top .cikis {
    color: #fff;
    font-size: 20px
}

.bagissozlesmepopup .content {
    padding: 27px 22px 27px 28px;
    /*display: flex;*/
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between
}

.bagissozlesmepopup .top .cikisTik {
    color: #fff;
    font-size: 20px
}

.modaltoplam {
    margin-top: 20px;
    border-radius: 5px;
    background-color: var(--theme-color);
    overflow: hidden
}

.modaltoplam .geneltoplam {
    width: 100%;
    background-color: #fff;
    padding: 10px;
    font-size: 23px;
    color: var(--theme-color);
    text-align: center;
    font-weight: 700
}

.modaltoplam .modalsepeteklebtn {
    width: 50%;
    float: right
}

.modaltoplam .modalsepeteklebtn a {
    display: inline-block;
    text-align: center;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    padding: 10px;
    width: 100%
}

.modaltoplam .modalsepeteklebtn a:hover {
    background: #fff;
    color: var(--theme-color);
    transition: .3s
}

.modalsepeteklebtn:hover {
    outline: 2px solid var(--theme-color);
}

@media only screen and (max-width: 768px) {
    .modaltoplam .geneltoplam {
        float: none;
        width: 100%;
        font-size: 18px
    }

    .modaltoplam .modalsepeteklebtn {
        width: 49%
    }

    .modaltoplam .modalsepeteklebtn a {
        font-size: 16px
    }
}

.bottomtplm {
    float: right;
    width: 50%;
    text-align: center;
    color: var(--theme-color);
    font-weight: 700;
    font-size: 21px;
    line-height: 40px;
    border-right: .5px solid #cacaca
}

.bagisbuton {
    overflow: hidden;
    margin-bottom: 20px;
    margin-top: 20px;
    text-align: center
}

.bagisbuton .fiyat {
    width: 125px;
    height: 50px;
    border-radius: 5px;
    border: .5px solid #b6b6b6;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
    overflow: hidden
}

.bagisbuton .fiyat span.sayi {
    background: #fff;
    width: 60%;
    height: 100%;
    float: left
}

.bagisbuton .sayi input {
    width: 100%;
    text-align: center;
    font-weight: 700;
    font-size: 16px;
    color: var(--theme-color);
    border-style: none;
    margin-right: 2px;
    margin-left: 2px;
    height: 50px
}

.bagisbuton .fiyat span.tl {
    float: right;
    background: #fafafa;
    height: 100%;
    border-left: .5px solid #bdbdbd;
    width: 40%;
    line-height: 50px
}

.bagisbuton .fiyat span {
    font-weight: 700;
    font-size: 16px;
    color: var(--theme-color);
}

.bagisbuton .siparisver {
    width: 125px;
    height: 50px;
    background: var(--theme-color);
    border-radius: 5px;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    line-height: 50px;
    margin-left: 10px;
    display: inline-block;
    margin-top: 5px
}

.img-responsive {
    width: 100% !important;
    height: auto !important
}

.proje_hedef {
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    overflow: hidden;
    background-position: 50%;
    height: auto !important;
    position: relative;
    padding: 0 !important;
    margin-bottom: 50px
}

@media (max-width: 479.98px) {
    .proje_hedef {
        height: 600px;
        padding: 20px
    }
}

@media (max-width: 374.98px) {
    .proje_hedef {
        height: 500px;
        padding: 15px
    }
}

.proje_hedef:after {
    content: "";
    width: 100%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0
}

.proje_hedef .content {
    position: relative;
    z-index: 2;
    color: #FFF;
    text-align: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 600px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

@media (max-width: 479.98px) {
    .proje_hedef .content {
        height: 550px
    }
}

@media (max-width: 374.98px) {
    .proje_hedef .content {
        height: 450px
    }
}

.proje_hedef .content .baslik {
    font-size: 40px;
    font-weight: 600
}

@media (max-width: 479.98px) {
    .proje_hedef .content .baslik {
        font-size: 30px
    }
}

@media (max-width: 374.98px) {
    .proje_hedef .content .baslik {
        font-size: 25px
    }
}

.proje_hedef .content .proje_adi {
    border: 2px solid #fff;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    padding: 10px;
    font-size: 24px
}

@media (max-width: 479.98px) {
    .proje_hedef .content .proje_adi {
        font-size: 20px
    }
}

@media (max-width: 374.98px) {
    .proje_hedef .content .proje_adi {
        font-size: 16px
    }
}

.proje_hedef .content .chart {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media (max-width: 479.98px) {
    .proje_hedef .content .chart .c100 {
        font-size: 150px
    }
}

@media (max-width: 374.98px) {
    .proje_hedef .content .chart .c100 {
        font-size: 120px
    }
}

.proje_hedef .content .bagis {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #FFF;
    background-color: transparent !important;
    padding-top: 10px !important
}

.proje_hedef .content .bagis-baslik {
    font-weight: 600;
    font-size: 12px
}

.proje_hedef .content .bagis-miktar {
    font-size: 24px;
    font-weight: 700;
    text-shadow: 2px 2px #040404
}

.proje_hedef .content .bagis .mevcut {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 60px;
    margin-right: 10px;
    padding-right: 10px;
    border-right: 1px solid #FFF
}

.proje_hedef .content .bagis .mevcut .bagis-baslik {
    text-align: right
}

.proje_hedef .content .bagis .hedef {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 60px
}

.proje_hedef .content .bagis .hedef .bagis-baslik {
    text-align: left
}

.proje_hedef .content .bagis_yap {
    padding-right: 20px;
    padding-left: 20px;
    font-weight: 600;
    margin-bottom: 40px
}

.proje_hedef .content .bagis_yap:hover i {
    -webkit-animation: fadeOutDown 1.5s infinite;
    animation: fadeOutDown 1.5s infinite
}

.proje_hedef .content .bagis_yap i {
    margin-right: 10px
}

.itembackground {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top
}

.bagisPopup .content .formGrup.telefon .formGrupWrap {
    width: calc(100% - 55px)
}

.bagisPopup .content .formGrup.telefon .formGrupWrap .inputdelete {
    top: 2px;
    right: 5px;
    background-color: #fff
}

.bagisPopup .content .formGrup .inputdelete {
    right: 5px;
    background-color: #fff0
}

.bagisPopup .content .formGrup.telefon .sms_checkbox {
    width: 42px;
    height: 42px;
    font-weight: 400;
    font-size: 15px;
    text-align: left;
    color: #000;
    padding-left: 0;
    margin-bottom: 0;
    border-radius: 5px;
    background: #fff;
    border: .5px solid var(--theme-color);
    outline: none;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    cursor: pointer
}

.bagisPopup .content .formGrup.telefon .sms_checkbox::before {
    content: "SMS";
    position: absolute;
    top: -30px
}

.bagisPopup .content .formGrup.telefon .sms_checkbox i {
    opacity: 0;
    transform: scale(.5);
    color: green;
    color: #22bd22;
    font-size: 22px;
    transition: .3s
}

.bagisPopup .content .formGrup.telefon .sms_checkbox input {
    display: none
}

.bagisPopup .content .formGrup.telefon .sms_checkbox input:checked+i {
    opacity: 1;
    transform: scale(1)
}

.bagiskartlari {
    margin-top: 50px
}

.widget_9 {
    border: 1px solid #ccc;
    padding: 20px;
    margin-bottom: 20px;
    margin-top: 20px;
    border-radius: 5px;
    clear: both;
    overflow: hidden
}

.widget_9 .widget_bagis {
    float: right
}

.widget_9 .widget_baslik {
    float: left;
    width: 600px;
    font-size: 22px;
    font-weight: 700;
    color: #1e1e1e
}

.widget_9 .widget_baslik span {
    display: block;
    font-size: 15px;
    color: #909090
}

.widget_10 {
    margin-bottom: 20px;
    margin-top: 20px;
    clear: both;
    overflow: hidden
}

.widget_10 .widget_bagis {
    width: 100% !important
}

.widget_10 .widget_bagis .siparisver {
    width: 100% !important;
    margin-left: 0;
    font-size: 18px
}

.widget_bagis .siparisver:hover {
    background: #fff;
    color: var(--theme-color);
    border: 2px solid var(--theme-color);
    transition: .3s
}

.widget_bagis .siparisver:active {
    -webkit-box-shadow: 0 0 18px 0 var(--theme-color);
    -moz-box-shadow: 0 0 18px 0 var(--theme-color);
    box-shadow: 0 0 18px 0 var(--theme-color);
}

.widget_10 .widget_bagis .fiyat {
    display: none
}

.widget_bagis {
    width: 250px;
    display: flex;
    flex-direction: row;
    align-content: space-between;
    justify-content: space-between
}

.widget_bagis .fiyat span.sayi {
    background: #fff;
    width: 60%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

.widget_bagis .fiyat span {
    font-weight: 700;
    font-size: 16px;
    color: var(--theme-color);
}

.widget_bagis .sayi input {
    width: 100%;
    text-align: center;
    font-weight: 700;
    font-size: 16px;
    color: var(--theme-color);
    border-style: none;
    margin-right: 2px;
    margin-left: 2px
}

.widget_bagis .fiyat span.tl {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fafafa;
    height: 100%;
    border-left: .5px solid #bdbdbd;
    width: 40%
}

.widget_bagis .fiyat {
    width: 125px;
    height: 50px;
    border-radius: 5px;
    border: .5px solid #b6b6b6;
    overflow: hidden;
    display: flex
}

.widget_bagis .siparisver {
    width: 180px;
    height: 50px;
    background: var(--theme-color);
    border-radius: 5px;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 10px
}

.masaustu {
    text-align: center !important
}

@media only screen and (max-width: 768px) {
    .widget_9 .widget_bagis {
        float: none;
        margin-right: auto;
        margin-left: auto
    }

    .widget_9 .widget_baslik {
        float: none;
        width: 100%;
        text-align: center;
        margin-bottom: 20px
    }

    .iletisimBilgileri .formItem a {
        display: block !important
    }

    .masaustu {
        display: none
    }
}

.iletisimBilgileri .formItem {
    position: relative
}

.iletisimBilgileri .formItem:hover a {
    display: block !important
}

.inputdelete {
    position: absolute;
    width: 20px;
    height: 35px;
    right: 2px;
    top: 31px;
    background-color: #ffffff;
    background-image: url(../img/input-delete.png);
    background-repeat: no-repeat;
    background-position: center center;
    display: none
}

.kurlar {
    text-align: right
}

.kurlar a {
    display: inline-block;
    padding: 5px 15px;
    border: 1px solid #d6d6d6;
    margin-right: 7px;
    color: #7b7b7b;
    border-radius: 5px
}

.kurlar a:last-child {
    margin-right: 0
}

.kurlar a:hover, .kurlar .active {
    background-color: var(--theme-color);
    color: #fff;
    transition: 0.3s;
}

select.selectkur {
    display: none;
    background: #fafafa;
    height: 100%;
    border-top: none;
    border-bottom: none;
    width: 40%;
    color: var(--theme-color);
    font-size: 19px !important;
    text-align: justify;
    text-align-last: center
}

select.selectkur-sol {
    border-left: none;
}

select.selectkur-sag {
    border-right: none;
}

.floatleft {
    float: left
}

.boximage {
    display: block
}

.tablar {
    background-color: #f8f8f6
}

.tablar ul {
    margin: 0;
    padding: 0 5px;
    list-style: none;
    width: 100%
}

.tablar ul li {
    float: left;
    width: 100%;
    position: relative;
    padding: 0 0;
}

.tablar ul li a {
    display: block;
    padding: 12px 20px;
    text-align: center;
    width: 100%;
    font-weight: 900;
    color: #848380;
    background-color: #f8f8f6;
    font-size: 17px;
    position: relative;
    margin: 0;
    border-right: 2px solid #fff
}

.tablar ul li a:hover {
    color: var(--theme-color);
}

.tablar ul li a span {
    position: absolute;
    width: 100%;
    height: 5px;
    background-color: var(--theme-color);
    top: 0;
    left: 0;
    display: none
}

.tablar ul li a label {
    width: 30px;
    height: 30px;
    display: block;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% auto;
    vertical-align: middle;
    cursor: pointer;
    margin: auto auto 5px
}

.tablar ul li.aktiftab span {
    display: block
}

.tablar ul li.aktiftab a {
    background-color: #fff;
    color: var(--theme-color);
}

#sifirla {
    border: none;
    padding: 0
}

.borderpadding {
    border: 5px solid #efefef;
    padding: 15px 15px 0
}

.tablar .owl-prev {
    position: absolute;
    left: 0;
    top: -5px;
    z-index: 9999
}

.tablar .owl-next {
    position: absolute;
    right: 0;
    top: -5px;
    z-index: 9999
}

.tablar .owl-prev span, .tablar .owl-next span {
    font-size: 30px
}

.icerikyok {
    color: #848380;
    width: 100%;
    font-size: 18px;
    text-align: center;
    font-weight: 600;
    margin-bottom: 15px
}

@media only screen and (max-width: 768px) {
    .box .info .fiyat .tl {
        display: none !important
    }

    .box .info .fiyat .selectkur {
        display: block !important
    }

    .bagis .bagisConteiner .bagisContent .bottom .fiyat span.tl {
        display: none !important
    }

    .bagis .bagisConteiner .bagisContent .bottom .fiyat .selectkur {
        display: block
    }

    .widget_9 .fiyat .tl {
        /*display:none!important*/
    }

    .widget_9 .fiyat .selectkur {
        display: block
    }

    .widget2 .fiyat .selectkur {
        display: block
    }

    .widget5 .fiyat .selectkur {
        display: block
    }

    .tablar ul li a {
        text-align: center
    }

    .tablar ul li a label {
        display: block !important;
        margin: 0 auto 5px
    }
}

.bagisslider {
    margin-bottom: 20px
}

.boxload {
    margin: 10px 7px 0;
    background-color: #fff;
    border: 3px solid var(--theme-color);
    border-radius: 7px
}

.boxload span {
    display: block;
    min-width: 25px;
    padding: 5px;
    color: #fff;
    padding: 3px;
    font-size: 13px;
    font-weight: 700;
    background-color: var(--theme-color);
    text-align: right;
    margin: 2px;
    border-radius: 7px
}

.header-button {
    font-size: 15px !important
}

.login-button {
    background-color: #fff;
    color: var(--theme-color);
    font-size: 15px;
    padding: 5px 10px !important;
    text-align: center;
    overflow: hidden
}

.login-button:hover {
    background-color: var(--theme-color);
    color: var(--header-btn-text-color);
    border: 1px solid var(--theme-color);
    transition: 0.3s;
}

.login-button:active, .login-button:focus {
    outline: none !important
}

.login-button .usericon {
    float: left;
    margin-right: 20px
}

.login-button .arrowicon {
    float: right;
    margin-left: 20px
}

.mobil-login-button {
    color: #fff !important;
    font-size: 15px;
    padding: 15px !important;
    text-align: center;
    width: 100%;
    font-size: 19px;
    font-weight: 700;
    display: none;
    -webkit-box-shadow: 0px -1px 11px 3px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px -1px 11px 3px rgba(0, 0, 0, 0.1);
    box-shadow: 0px -1px 11px 3px rgba(0, 0, 0, 0.1);
}

.mobil-login-button .usericon {
    float: left;
}

.mobil-login-button .arrowicon {
    float: right;
    margin-left: 20px
}

.uyepopupmodal {
    position: fixed
}

.positionrelative {
    position: relative
}

.uyepopup {
    background-color: #fff;
    border: 1px solid var(--theme-color);
    border-radius: 5px;
    padding: 5px;
    position: absolute;
    top: 55px;
    width: 300px;
    right: 13px;
    height: auto;
    z-index: 999
}

.uyepopup .uyepopup_header {
    color: var(--theme-color);
    font-weight: 700;
    font-size: 14px;
    text-align: center;
    padding: 5px 0;
    margin: 5px;
    border-bottom: 1px solid #faf0e3;
    overflow: hidden
}

.uyepopup_header a.geridon {
    float: left;
    color: var(--theme-color);
}

.uyepopup_header a.kapat {
    float: right;
    color: var(--theme-color);
}

.uyepopup_header a:hover {
    color: var(--theme-color);
}

.uyepopup .uyepopup_row {
    margin: 10px 10px 0
}

.uyepopup .uyepopup_row label {
    color: var(--theme-color);
    font-size: 13px;
    margin-bottom: 3px
}

.uyepopup .uyepopup_input {
    border: 1px solid var(--theme-color);
    padding: 2px;
    border-radius: 5px;
    background-color: #fff
}

.uyepopup .uyepopup_input input {
    border: none;
    border-style: none;
    width: 100%;
    font-size: 14px;
    padding: 5px
}

.uyepopup_row .hatirla {
    font-size: 12px;
    color: var(--theme-color);
}

.uyepopup_row .hatirla input {
    vertical-align: middle
}

.uyepopup_row .remember_link {
    color: var(--theme-color);
    float: right;
    font-size: 13px;
    vertical-align: middle
}

.uyepopup_row .remember_link:hover {
    color: #e19011
}

.uyepopup .popuploginbtn {
    width: 269px;
    display: block;
    text-align: center;
    color: var(--theme-color);
    font-size: 13px;
    font-weight: 700;
    background-color: #fff;
    border: 1px solid var(--theme-color);
    border-radius: 5px;
    margin: 15px auto 0;
    padding: 5px 0
}

.uyepopup .popuploginbtn:hover {
    cursor: pointer;
    background-color: var(--theme-color);
    color: #fff
}

.uyepopup .popupregisterbtn {
    width: 269px;
    display: block;
    text-align: center;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    background-color: var(--theme-color);
    border: 1px solid var(--theme-color);
    border-radius: 5px;
    margin: 25px auto 10px;
    padding: 5px 0
}

.uyepopup .popupregisterbtn:hover {
    cursor: pointer;
    background-color: #fff;
    color: var(--theme-color);
}

.uyepopup .popuploginbtn:focus, .uyepopup .popupregisterbtn:focus {
    outline: none !important
}

.uyepopup input[type=number]::-webkit-inner-spin-button, .uyepopup input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.width50 {
    width: 123px;
    float: left
}

.uyepaciklama {
    background-color: #fff3e0;
    border: 1px solid var(--theme-color);
    border-radius: 5px;
    color: var(--theme-color);
    padding: 10px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    text-align: left;
    margin: 10px
}

.uyepaciklama i {
    padding-right: 15px;
    color: var(--theme-color);
}

.uyepopupmenu {
    background-color: #fffcf5;
    border: 1px solid var(--theme-color);
    border-radius: 5px;
    position: absolute;
    top: 55px;
    width: 200px;
    right: 13px;
    height: auto;
    z-index: 999;
    font-size: 14px;
    padding-left: 5px;
    padding-right: 5px;
    display: none
}

.uyepopupmenu a {
    display: block;
    width: 100%;
    text-align: center;
    color: var(--theme-color);
    padding: 10px 0;
    border-bottom: 1px solid #e3c19c
}

.uyepopupmenu a:hover {
    color: var(--theme-color);
}

.uyedetaytop {
    margin-top: 50px
}

#uyepopupmenumobil {
    margin: 10px 0 0;
    width: 100%;
    height: auto;
    display: none
}

#uyepopupmenumobil a {
    display: block;
    width: 100%;
    text-align: left;
    color: #fff;
    padding: 15px 0;
    font-size: 17px;
    font-weight: 700;
    -webkit-box-shadow: 0px -1px 11px 3px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px -1px 11px 3px rgba(0, 0, 0, 0.1);
    box-shadow: 0px -1px 11px 3px rgba(0, 0, 0, 0.1);
    margin: 0 0 10px;
}

#uyepopupmenumobil a i {
    margin-right: 15px;
    margin-left: 25px;
    font-size: 21px;
}

#uyepopupmenumobil a:hover {
    color: var(--theme-color);
}

@media only screen and (max-width: 768px) {
    .positionrelative {
        position: static !important
    }

    .mobil-login-button {
        display: block
    }

    .uyepopup {
        left: 0;
        right: 0;
        margin-right: auto;
        margin-left: auto;
        top: 25%
    }

    #uyepopupmenumobil {
        display: block
    }
}

.uyesolmenu {
    border: 1px solid var(--theme-color);
    border-radius: 5px;
    margin-bottom: 20px
}

.uyesolmenu span {
    display: block;
    color: #fff;
    font-size: 16px;
    background-color: var(--theme-color);
    padding: 10px 0;
    text-align: center
}

.uyesolmenu a {
    display: block;
    text-align: center;
    color: #000;
    font-size: 16px;
    font-weight: 700;
    padding: 10px 0;
    border-bottom: 1px solid #ccc
}

.uyesolmenu a i {
    font-size: 18px;
    float: right;
    margin-right: 15px;
    margin-top: 2px
}

.uyeicerik {
    background-color: #fffcf5;
    border-radius: 5px;
    color: var(--theme-color);
    padding: 15px;
    border: 1px solid #ccc
}

.uyeicerik .icerikbaslik {
    font-size: 22px;
    font-weight: 700;
    color: var(--theme-color);
    margin-bottom: 10px
}

.uyeformsatir {
    margin-bottom: 15px
}

.uyeformsatir label {
    display: block;
    font-weight: 700;
    color: var(--theme-color);
    font-size: 16px
}

.uyeformsatir input {
    width: 100%;
    border: 1px solid var(--theme-color);
    padding: 5px;
    border-radius: 5px;
    font-size: 15px
}

.uyeformsatir span {
    font-size: 14px
}

.uyeformsatir .intl-tel-input {
    width: 100%
}

.basarilikutu {
    background-color: #fffcf5;
    border: 1px solid var(--theme-color);
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 20px
}

.basarilikutu label {
    display: block;
    font-size: 20px;
    font-weight: 700;
    color: var(--theme-color);
    margin-bottom: 0
}

.basarilikutu label i {
    margin-right: 8px
}

.bagiscisecimi {
    overflow: hidden;
    width: 100%;
    border-bottom: 1px solid var(--theme-color);
    padding-bottom: 5px;
    margin-bottom: 10px
}

.bagiscisecimi label {
    display: inline-block;
    width: 49%;
    text-align: right;
    padding: 0 15px;
    font-size: 14px;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.bagiscisecimi label input {
    position: absolute;
    opacity: 0;
    cursor: pointer
}

.bagiscisecimi .checkmark {
    position: absolute;
    top: 3px;
    height: 18px;
    width: 18px;
    background-color: #fffcf5;
    border: 2px solid var(--theme-color);
    border-radius: 50%
}

.bagiscisecimi .checkmark:after {
    content: "";
    position: absolute;
    display: none
}

.bagiscisecimi label:hover input~.checkmark {
    background-color: var(--theme-color);
}

.bagiscisecimi label input:checked~.checkmark {
    background-color: #fffcf5
}

.bagiscisecimi label input:checked~.checkmark:after {
    display: block
}

.bagiscisecimi label .checkmark:after {
    top: 4px;
    left: 4px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--theme-color);
}

.bagiscisecimi label:last-child {
    text-align: left;
    border-left: 1px solid var(--theme-color);
    padding-left: 35px
}

.sepet .sepetBottom {
    background-color: #fafafa;
    border-top: 1px solid #e2e2e2
}

.sepet .sepetBottom .toplam {
    border-right: 1px solid #e2e2e2
}

.odemesayfasibaslik {
    font-size: 25px;
    font-weight: 700;
    color: #000;
    text-align: center;
    margin-bottom: 30px
}

.bagistablobaslik {
    margin-bottom: 10px;
    font-weight: 700;
    font-size: 23px
}

.henuzbagisyok {
    text-align: center;
    font-size: 25px;
    color: #ccc;
    font-weight: 700;
    margin-top: 50px
}

.henuzbagisyok i {
    font-size: 60px
}

.bagisodemetablosu {
    overflow: hidden;
    border: 1px solid #d4d4d4;
    border-radius: 5px;
    margin-bottom: 30px
}

.bagisodemetablosu table {
    border-bottom: 1px solid #d4d4d4
}

.bagisodemetablosu th {
    padding: 8px;
    font-size: 18px;
    font-weight: 700;
    color: var(--theme-color);
    text-align: center;
    border: 1px solid #d4d4d4
}

.bagisodemetablosu td {
    text-align: center;
    border: 1px solid #d4d4d4;
    padding: 8px;
    font-size: 18px
}

.bagisodemetablosu td a {
    color: #707070
}

.bagisodemetablosu tr:hover td {
    background-color: #f3f3f3
}

.tablotoplamtutar {
    font-size: 23px;
    font-weight: 700;
    text-align: right;
    padding-right: 100px;
    margin-top: 20px;
    margin-bottom: 20px
}

.odemeiletisimmesaj {
    font-size: 15px;
    margin-bottom: 20px
}

.odemeiletisimbilgileri {
    border: 1px solid #c9c9c9;
    border-radius: 5px;
    background-color: #f7f7f7;
    padding: 15px 20px
}

.odemeiletisimbilgileri label {
    display: block;
    font-size: 16px
}

.odemeiletisimbilgileri input {
    border: 1px solid #dcdcdc;
    padding: 5px 10px;
    width: 100%;
    border-radius: 5px
}

.odemetelefon {
    width: 100%
}

.odemeiletisimbilgileri .intl-tel-input {
    width: 100%
}

.odemeiletisimbilgileri .formcon {
    position: relative
}

.odemeiletisimbilgileri .formcon:hover a {
    display: block
}

.odemeiletisimbilgileri .inputdelete {
    right: 20px;
    background-color: #fff0;
    top: 33px;
    height: 34px
}

.sozlesmeler {
    margin-top: 35px
}

.odemeyontemisec {
    font-size: 23px;
    font-weight: 700
}

.marginTop {
    margin-top: 20px;
    margin-bottom: 20px
}

.odemetab {
    border: 4px solid #f7f7f7;
    margin-top: 20px
}

.tablarbasliklari {
    overflow: hidden;
    background-color: var(--theme-color);
}

.odemetab .tabbaslik {
    float: left;
    width: 50%
}

.odemetab .tabbaslik a {
    color: #fff;
    padding-top: 10px;
    text-align: center;
    display: block;
    font-weight: 700;
    height: 73px
}

.odemetab .tabbaslik a img {
    display: block;
    margin-right: auto;
    margin-left: auto
}

.imgmrgtop {
    margin-top: 16px
}

.aktifodeme {
    color: #000 !important;
    background-color: #fff;
    position: relative
}

.aktifodeme::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 5px;
    background-color: var(--theme-color);
    left: 0;
    top: 0
}

.odemetab .hide {
    display: none
}

.odemetab .odemetabcontainer {
    padding: 20px
}

.marginBottom10 {
    margin-bottom: 10px
}

.kartbilgileri .row label {
    font-weight: 700;
    font-size: 15px
}

.odemeyitamamla {
    margin-top: 10px;
    background-color: #6fc049;
    color: #fff;
    padding: 10px;
    width: 100%;
    border: 1px solid #6fc049;
    border-radius: 5px;
    font-weight: 700
}

.odemeyitamamla:hover {
    cursor: pointer
}

.paypaltamamla {
    margin-top: 10px;
    background: radial-gradient(circle at 0 0, #0070ba, #1546a0);
    color: #fff;
    padding: 10px;
    width: 100%;
    border: 1px solid #6fc049;
    border-radius: 100px;
    font-weight: 700;
}

.paypaltamamla:hover {
    cursor: pointer;
    background: radial-gradient(circle at 0 0, #0070bacc, #1546a0d1);
}

.paypaltamamla:focus{
    outline: 0px auto -webkit-focus-ring-color;
    border: 1px solid black;
}

.paypalbtnimg{
    width: 23px;
    height: 23px;
    vertical-align: middle;
    margin-bottom: 3px;
    margin-right: 5px;
}

.odemegeneltoplam {
    text-align: center;
    margin-top: 18px;
    margin-bottom: 10px;
    font-size: 25px;
    font-weight: 700
}

.creditcard {
    margin-top: 35px
}

.card-icons {
    margin-top: 50px;
    text-align: center
}

.cardmobil {
    display: none
}

.carddesktop {
    display: inline-block;
    margin-top: 25px
}

.security-icon {
    text-align: center;
    margin-top: 20px
}

.mobilsepet {
    background-color: #f7f7f7;
    border: 1px solid #dfdfdf;
    font-size: 14px;
    display: none
}

.mobilsepetsatir {
    overflow: hidden
}

.mobilsepet .mobilsepetsil {
    width: 10%;
    float: left
}

.mobilsepet .mobilsepetbilgi {
    width: 70%;
    float: left
}

.mobilsepet .mobilsepetfiyat {
    width: 20%;
    float: right;
    text-align: right
}

.mobilsepet .mobilsepetsil, .mobilsepet .mobilsepetbilgi, .mobilsepet .mobilsepetfiyat {
    padding: 10px
}

.mobilsepet .mobilsepetsil a {
    text-align: center;
    display: block;
    line-height: 40px
}

.mobilsepet .urun {
    font-weight: 700
}

.mobilsepet .mobilsepetsil a {
    color: #707070
}

.mobilsepetfiyat .sptfiyat, .mobilsepetfiyat .sptadet {
    padding-right: 10px
}

.mobilsepetcizgi {
    clear: both;
    width: 90%;
    height: 1px;
    background-color: #dfdfdf;
    margin: 10px auto
}

.mobilgeneltoplamtutar {
    font-size: 25px;
    text-align: center;
    font-weight: 700;
    margin-top: 15px;
    margin-bottom: 15px;
    display: none
}

.mobilkurlar {
    display: none
}

.mobilkurlar .kurlar {
    text-align: center;
    margin-bottom: 15px
}

.odemelogo {
    width: 100px !important;
    margin-top: 15px;
    margin-bottom: 15px;
    display: inline-block
}

@media only screen and (max-width: 450px) {
    .mobilsepet .mobilsepetsil a {
        line-height: 20px
    }

    .mobilsepet .mobilsepetsil {
        padding-bottom: 0
    }

    .mobilsepet .mobilsepetbilgi {
        width: 200px
    }

    .mobilsepet .mobilsepetfiyat {
        width: 80px
    }

    .odemelogo {
        width: 100% !important
    }

    .cardmobil {
        display: inline-block;
        margin-top: 15px;
        font-size: 18.7px
    }

    .carddesktop {
        display: none
    }

    .sozlesmeicerik {
        margin-bottom: 37px
    }

    .sozlesmeler {
        margin-top: 20px
    }

    .security-img {
        width: 100%
    }
}

@media only screen and (max-width: 408px) {
    .cardmobil {
        font-size: 17px
    }
}

@media only screen and (max-width: 353px) {
    .cardmobil {
        font-size: 14px
    }
}

.digerodemeler {
    width: 100%
}

.siparisInfo {
    margin-top: 20px
}

.bagis_yap i {
    background-color: red;
    border: 1px solid #fff;
    color: #fff;
    font-style: normal;
    padding: 2px 5px;
    border-radius: 75px;
    font-size: 13px
}

.sepetgeridon {
    margin-top: 15px;
    margin-bottom: 15px;
    display: none
}

.sepetgeridon a {
    display: block;
    text-align: center;
    border: 1px solid var(--theme-color);
    border-radius: 5px;
    color: var(--theme-color);
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #fff
}

.formbilgi {
    color: var(--theme-color);
    margin-top: 10px;
    margin-bottom: 10px;
    display: block
}

.uyeicerik .bagisodemetablosu {
    border: none;
    border-radius: 0;
    display: block !important;
    margin-bottom: 0 !important
}

.uyeicerik .bagisodemetablosu th {
    background-color: #f8f8f6;
    font-size: 16px;
    border-color: var(--theme-color);
    color: var(--theme-color);
}

.uyeicerik .bagisodemetablosu td {
    text-align: center;
    border: 1px solid var(--theme-color);
    padding: 8px;
    font-size: 16px;
    color: #000;
    background-color: #fff
}

.uyeicerik .bagisodemetablosu td a {
    color: var(--theme-color);
    font-size: 18px
}

@media only screen and (max-width: 992px) {
    .sepetgeridon {
        display: block
    }

    .odemeiletisimbilgileri .formcon {
        margin-bottom: 5px
    }

    .mobilkurlar, .mobilgeneltoplamtutar, .mobilsepet {
        display: block
    }

    .bagisodemetablosu, .masaustukurlar {
        display: none
    }

    .bagistablobaslik, .odemeyontemisec {
        font-size: 18px
    }

    .creditcard {
        display: none
    }

    .imgmrgtop {
        margin-top: 0
    }

    .odemetab .tabbaslik a {
        padding: 10px;
        height: 80px;
        font-size: 14px
    }

    .odemetab .tabbaslik a img {
        width: 30px;
        height: auto
    }

    .guvenlikkodu {
        margin-top: 10px
    }

    .digerodemeler {
        width: 100%
    }

    .bagislarRight {
        display: none
    }

    .odemesatir {
        width: 100%;
        float: none;
        -webkit-flex: none;
        -ms-flex: none;
        flex: none;
        max-width: 100%
    }

    .uyeicerik .bagistabloscroll {
        overflow: auto
    }

    .uyeicerik .bagisodemetablosu {
        width: 992px
    }
}

#kartad {
    background-image: url(../img/kart-sahibi.jpg);
    background-repeat: no-repeat;
    background-position: 10px center;
    padding-left: 40px !important
}

#kartnumarasi {
    background-image: url(../img/kart-bilgileri.jpg);
    background-repeat: no-repeat;
    background-position: 10px center;
    padding-left: 40px !important
}

.cvvinput {
    background-image: url(../img/cvv-bilgi.jpg);
    background-repeat: no-repeat;
    background-position: 10px center;
    padding-left: 40px !important
}

.admingiris {
    background-color: #e74c3c;
    position: relative;
    text-align: center;
    color: #fff;
    padding: 10px;
    font-size: 14px
}

.admingiris a {
    font-weight: 700;
    color: #fff
}

.adminodeme {
    padding: 10px;
    color: #000;
    margin-top: 10px
}

.aktifodemebaslik {
    font-weight: bolder
}

.pasifodeme:hover {
    background-color: var(--theme-color);
    transition: all .3s ease-in-out
}

@media (min-width: 768px) {
    .seven-cols .col-md-1, .seven-cols .col-sm-1, .seven-cols .col-lg-1 {
        width: 14.285714285714%;
        *width: 14.285714285714%;
        max-width: 14.285714285714% !important;
        flex: none !important
    }

    .dernek-bilgi {
        color: #fff;
        text-align: left
    }
}

@media (min-width: 992px) {
    .seven-cols .col-md-1, .seven-cols .col-sm-1, .seven-cols .col-lg-1 {
        width: 14.285714285714%;
        *width: 14.285714285714%;
        max-width: 14.285714285714% !important;
        flex: none !important
    }
}

@media (min-width: 1200px) {
    .seven-cols .col-md-1, .seven-cols .col-sm-1, .seven-cols .col-lg-1 {
        width: 14.285714285714%;
        *width: 14.285714285714%;
        max-width: 14.285714285714% !important;
        flex: none !important
    }
}

.footer-odeme-desktop {
    background-color: #ebebeb;
    height: 6em;
    margin: auto;
    text-align: center;
    align-items: center;
    margin: auto
}

.footer-odeme-mobil {
    background-color: #ebebeb;
    height: 10em;
    margin: auto;
    text-align: center;
    align-items: center
}

.odeme-image-row {
    margin: auto
}

.footer-img {
    height: 100%
}

@media (min-width: 768px) {
    #anasayfatab {
        padding: 0 5px !important
    }
}

@media (max-width: 768px) {
    .dernek-bilgi {
        color: #fff;
        text-align: center
    }

    .tablar {
        position: sticky;
        top: 0;
        z-index: 49
    }

    .tablar ul {
        padding: 0
    }

    .tablar ul li a {
        border-right: 2px solid #fff;
        border-bottom: 2px solid #fff;
        background-color: var(--theme-color);
        color: #fff;
        padding: 12px 20px;
        font-size: 14px
    }

    .tablar ul li a label {
        display: none !important
    }

    .mobil-sepet {
        position: sticky;
        bottom: 0;
        z-index: 50;
        background-color: #008B64;
        color: #fff;
        margin: auto;
        height: 3em;
        align-items: center
    }

    .fa-stack[data-count]:after {
        position: absolute;
        right: 0;
        top: 0;
        content: attr(data-count);
        font-size: 70%;
        padding: .5em;
        border-radius: 999px;
        line-height: .75em;
        color: #fff;
        text-align: center;
        min-width: 1em;
        font-weight: 700;
        background: red
    }

    .fa-shopping-bag {
        font-size: 1.3em
    }

    .sepet-tutar {
        font-weight: 700;
        font-size: 1.3em;
        float: right
    }

    .sepet-odeme {
        text-align: center;
        color: #fff;
        border-radius: 5px;
        border: 2px solid #fff;
        float: right;
        padding: 2% 7%;
        margin-right: 5%;
        background-color: #008B64;
        font-size: .95em
    }

    .sepet-odeme:active, .sepet-exit:active, .sepet-odeme:hover {
        background-color: #fff;
        color: #008B64;
        border: 2px solid #000
    }

    .mobil-sepet:active {
        background-color: #3ac89f;
        transition: .2s
    }

    .sepet-icon-div {
        border-right: 2px solid #fff
    }

    .sepet-icerik {
        display: none;
        bottom: 3em;
        position: absolute;
        background-color: #fff;
        right: 0;
        left: 0;
        margin: 0 2% !important;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        height: 30em
    }

    .sepet-icerik-blocker {
        display: none;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        overflow: auto;
        box-sizing: border-box;
        background-color: rgba(0, 0, 0, 0.75);
        text-align: center;
        padding: 0 !important;
        z-index: 50 !important
    }

    #mobil-sepet-tumu {
        position: fixed;
        width: 100%;
        bottom: 0;
        z-index: 50
    }

    .sepet-baslik {
        height: 10%;
        align-items: center
    }

    .sepet-sol-img {
        height: 1.5em;
        width: 1.5em
    }

    .sepet-hr {
        margin-top: 0;
        margin-bottom: 0;
        border-top: 2px solid rgba(21, 20, 20, 0.14)
    }

    .msepet-title {
        color: #008B64;
        font-weight: 700;
        font-size: 1.3em
    }

    .msepet-color {
        color: #008B64
    }

    .b-adi, .b-baskasi {
        float: left;
        text-align: left
    }

    .b-tutar, .b-adet {
        float: right;
        text-align: right
    }

    .b-adi, .b-tutar {
        font-weight: 700;
        color: var(--theme-color);
        font-size: 16px
    }

    .b-baskasi, .b-adet {
        font-size: 14px
    }

    .b-mesaj{
        font-size: 14px;
        word-break: break-all;
        float: left;
        text-align: left
    }

    .sepet-item {
        height: auto;
        align-items: center;
        margin: 5% !important
    }

    .sepet-sil {
        float: left;
        font-size: 18px
    }

    .sepet-items {
        overflow: auto !important;
        height: 87%;
        margin: auto;
        display: block
    }

    .sepetara-hr {
        margin-top: 0;
        margin-bottom: 0;
        width: 85%;
        border-top: .5px solid #707070;
    }

    .sepet-exit {
        font-size: 1em;
        border: 2px solid #fff;
        padding: 7% 10%;
        border-radius: 5px;
        display: none
    }

    .overflow-hidden {
        height: 100%;
        overflow: hidden !important
    }

    .overflow-hidden-no {
        overflow: hidden !important
    }
}

@media (max-width: 400px) {
    .sepet-icerik {
        height: 23em
    }

    .sepet-baslik {
        height: 13%
    }
}

.yorumbaslik {
    text-align: center;
    margin-top: 80px;
    margin-bottom: 15px;
}

.yorumbaslik h6 {
    font-size: 25px;
    color: #000 !important;
    text-align: center;
}

.yorumeklenti {
    overflow: hidden;
    margin-top: 30px;
    margin-bottom: 15px;
}

.yorumeklenti .yorumtoplamyildiz {
    float: left;
    width: 49%;
}

.yorumtoplamyildiz b {
    color: #eb7100;
    font-size: 50px;
    font-weight: normal;
}

.yorumtoplamyildiz span {
    margin-left: 10px;
}

.yorumtoplamyildiz span i {
    color: #95a5a6;
    font-size: 25px;
}

.yorumtoplamyildiz label {
    color: #707070;
    font-size: 18px;
    margin-left: 10px;
}

.yorumfiltre {
    float: right;
    width: 24%;
    text-align: right;
    margin-top: 38px;
}

.yorumfiltre span {
    font-weight: bold;
    font-size: 14px;
    margin-right: 10px;
}

.yrmfiltre {
    width: 130px;
    font-size: 12px;
    color: #0088fd;
    padding: 2px;
    border-color: #ccc;
    margin-right: 2px;
}

.yorumlar {}

.yorumu {
    font-size: 17px;
}

.yorumkutu {
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #ccc
}

.yorumgonderen {
    overflow: hidden;
}

.yorumgonderen strong {
    font-weight: bold;
}

.yorumgonderen span {
    color: #95a5a6;
    font-size: 13px;
}

.turuncu {
    color: #eb7100 !important;
}

.verilenyildiz {
    display: block;
    float: right;
}

.yorumbegeni {
    margin-top: 5px;
}

.yorumbegeni a {
    color: #000;
}

.yorumbegeni i {
    color: red;
}

.yorumbegeni span {
    color: #95a5a6 !important;
    font-size: 13px;
}

.yorumdevam {
    text-align: center;
    font-size: 18px;
}

.yorumdevam span {
    display: block;
    text-align: center;
    color: #0088fd;
}

.yorumdevam a {
    font-weight: bold;
}

.yorumcizgi {
    border-bottom: 1px solid #ccc;
    margin-top: 20px;
    margin-bottom: 20px;
}

.yorumslogan {
    font-size: 21px;
    font-weight: bold;
    text-align: center;
}

/** yorum star **/
.stars [type="radio"]:not(:checked),
.stars [type="radio"]:checked {
    position: absolute;
    left: -9999px;
    opacity: 0;
}

.stars [type="radio"]:not(:checked)+label,
.stars [type="radio"]:checked+label {
    position: relative;
    padding-left: 35px;
    cursor: pointer;
    display: inline-block;
    height: 25px;
    line-height: 25px;
    font-size: 1rem;
    transition: none;
    /* webkit (konqueror) browsers */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.stars [type="radio"]+label:before,
.stars [type="radio"]+label:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    margin: 4px;
    width: 16px;
    height: 16px;
    z-index: 0;
    transition: none;
}

/* Unchecked styles */
.stars [type="radio"]:not(:checked)+label:before,
.stars [type="radio"]:not(:checked)+label:after,
.stars [type="radio"]:checked+label:before,
.stars [type="radio"]:checked+label:after,
.stars [type="radio"].with-gap:checked+label:before,
.stars [type="radio"].with-gap:checked+label:after {
    border-radius: 50%;
}

.stars [type="radio"]:not(:checked)+label:before,
.stars [type="radio"]:not(:checked)+label:after {
    border: 2px solid #5a5a5a;
}

.stars [type="radio"]:not(:checked)+label:after {
    z-index: -1;
    -webkit-transform: none;
    transform: none;
}

/* Checked styles */
.stars [type="radio"]:checked+label:before {
    border: none;
}

.stars [type="radio"]:checked+label:after,
.stars [type="radio"].with-gap:checked+label:before,
.stars [type="radio"].with-gap:checked+label:after {
    border: none;
}

.stars [type="radio"]:checked+label:after,
.stars [type="radio"].with-gap:checked+label:after {
    background-color: #26a69a;
    z-index: 0;
}

.stars [type="radio"]:checked+label:after {
    -webkit-transform: none;
    transform: none;
}

/* Radio With gap */
.stars [type="radio"].with-gap:checked+label:after {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
}

/* Focused styles */
.stars [type="radio"].tabbed:focus+label:before {
    box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
}

.stars [type="radio"]:not(:checked)+label::before,
.stars [type="radio"]:not(:checked)+label::after {
    border: none;
}

.stars [type="radio"]:checked+label::after,
.with-gap[type="radio"]:checked+label::after {
    background-color: transparent;
    z-index: 0;
    border: none;
}

form .stars {
    background: url(../img/yorum-star.png) repeat-x 0 0;
    width: 150px;
}

.ie7 form .stars {
    *zoom: 1;
}

form .stars:before,
form .stars:after {
    display: table;
    content: "";
}

form .stars:after {
    clear: both;
}

form .stars input[type="radio"] {
    position: absolute;
    opacity: 0;
    filter: alpha(opacity=0);
}

form .stars input[type="radio"].star-5:checked~span {
    width: 100%;
}

form .stars input[type="radio"].star-4:checked~span {
    width: 80%;
}

form .stars input[type="radio"].star-3:checked~span {
    width: 60%;
}

form .stars input[type="radio"].star-2:checked~span {
    width: 40%;
}

form .stars input[type="radio"].star-1:checked~span {
    width: 20%;
}

form .stars label {
    display: block;
    width: 30px;
    height: 30px;
    margin: 0 !important;
    padding: 0 !important;
    text-indent: -999em;
    float: left;
    position: relative;
    z-index: 10;
    background: transparent !important;
    cursor: pointer;
}

form .stars label:hover~span {
    background-position: 0 -30px;
}

form .stars label.star-5:hover~span {
    width: 100% !important;
}

form .stars label.star-4:hover~span {
    width: 80% !important;
}

form .stars label.star-3:hover~span {
    width: 60% !important;
}

form .stars label.star-2:hover~span {
    width: 40% !important;
}

form .stars label.star-1:hover~span {
    width: 20% !important;
}

form .stars span {
    display: block;
    width: 0;
    position: relative;
    top: 0;
    left: 0;
    height: 30px;
    background: url(../img/yorum-star.png) repeat-x 0 -60px;
    -webkit-transition: -webkit-width 0.5s;
    -moz-transition: -moz-width 0.5s;
    -ms-transition: -ms-width 0.5s;
    -o-transition: -o-width 0.5s;
    transition: width 0.5s;
}

/** yorum star **/
.yorumsatir {
    margin-top: 15px;
    margin-bottom: 15px;
}

.yorumad {
    width: 100%;
    border: 1px solid #b7b7b7;
    padding: 5px;
    font-size: 15px;
}

.yorumtext {
    width: 100%;
    border: 1px solid #b7b7b7;
    padding: 5px;
    font-size: 15px;
    font-family: Arial;
    height: 80px;
    resize: none;
}

.yorumgonder {
    width: 100%;
    background-color: #5aae5b;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    border: none;
    border-style: none;
    margin-bottom: 5px;
    line-height: 36px;
}

.yorumgonder:hover {
    cursor: pointer;
}

.kalankarakter {
    color: #707070;
    /* float:right; */
}

#kalankarakter {
    width: 28px;
    font-size: 15px;
    padding: 0;
    margin: 0;
    border: none;
    border-style: none;
    color: #707070;
    text-align: center;
}

.textuyar {
    background-color: red;
    color: #fff !important;
}

.areauyari, .textuyari {
    color: red;
    display: none;
}

.henuzyok {
    text-align: center;
    font-size: 20px;
    margin-top: 30px;
    margin-bottom: 30px;
    color: #eb7100;
}

.henuzyok i {
    font-size: 40px;
    margin-bottom: 4px;
}

.begenmis i {
    color: red;
}

.begenmis i:before {
    content: "\f004" !important;
}

.emojiler a {
    padding: 1px;
    border: 1px solid #ccc;
}

/* bağış içerik alanı */
.bagis .bagisConteiner {
    position: relative;
}

.bagis .bagisConteiner .bagisContent {
    padding-left: 25px;
    padding-right: 25px;
    width: 40%;
    display: table-cell;
    vertical-align: middle;
    position: relative;
}

.bagis .bagisConteiner .bagisContent h1 {
    /* font-weight: 400; */
    text-align: center;
    color: #000000 !important;
    margin-bottom: 15px;
    font-size: 40px;
}

.bagis .bagisConteiner .bagisContent p {
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    text-align: left;
    color: #fff;
}

.bagis .bagisConteiner .bagisContent .bottom {
    padding: 10px 9px 16px;
    width: 275px;
    display: flex;
    flex-direction: row;
    align-content: space-between;
    justify-content: space-between;
    margin: 0 auto;
}

.bagis .bagisConteiner .bagisContent .bottom .fiyat {
    width: 125px;
    height: 50px;
    border-radius: 5px;
    border: 0.5px solid #b6b6b6;
    overflow: hidden;
    display: flex;
}

.bagis .bagisConteiner .bagisContent .bottom .fiyat span {
    font-weight: 700;
    font-size: 16px;
    color: var(--theme-color);
}

.bagis .bagisConteiner .bagisContent .bottom .fiyat span.sayi {
    background: #fff;
    width: 60%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.tl-sag {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fafafa;
    height: 100%;
    border-left: 0.5px solid #bdbdbd;
    width: 40%;
}

.tl-sol {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fafafa;
    height: 100%;
    border-right: 0.5px solid #bdbdbd;
    width: 40%;
}

.bagis .bagisConteiner .bagisContent .bottom .siparisver {
    width: 180px;
    height: 50px;
    background: var(--theme-color);
    border-radius: 5px;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 10px;
    border: 2px solid #fff;
}

.bagis .bagisConteiner .bagisContent .bottom .siparisver i {
    padding-right: 4px;
}

.bagis .bagisConteiner .bagisContent .bottom .siparisver:hover {
    background: var(--theme-color);
    color: #ffffff;
    border-color: var(--theme-color);
    transition: 0.3s;
}

.bagis .bagisConteiner .bagisContent .bottom .siparisver:active {
    -webkit-box-shadow: 0 0 18px 0 var(--theme-color);
    -moz-box-shadow: 0 0 18px 0 var(--theme-color);
    box-shadow: 0 0 18px 0 var(--theme-color);
}

/* bağış içerik alanı */
.altsosyalalan {
    width: 100%;
    text-align: center;
    position: absolute;
    bottom: 30px;
    right: 0;
    left: 0;
    margin: 0 auto;
}

.altsosyalalan ul {
    margin: 0;
    padding: 0;
}

.altsosyalalan ul li {
    display: inline-block;
    color: #fff;
    width: 80px;
    border-right: 1px solid #000000;
}

.altsosyalalan ul li .yooki {
    display: block;
    width: 100%;
    color: #000000;
}

.altsosyalalan ul li:last-child {
    border-right: none;
}

.altsosyalalan ul li span {
    display: block;
    width: 100%;
    text-align: center;
}

.altsosyalbutonlar {
    background-color: #fff;
    border: 1px solid #000;
    padding: 0px 4px;
    width: 150px;
    border-radius: 75px;
    position: relative;
    top: -20px;
    right: 103%;
    display: none;
    -webkit-box-shadow: 0px 0px 7px -3px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 7px -3px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 7px -3px rgba(0, 0, 0, 0.75);
}

.altsosyalbutonlar::before {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #000000 transparent transparent transparent;
    position: absolute;
    bottom: 0;
    bottom: -10px;
    right: 14px;
}

.altsosyalbutonlar a {
    font-size: 20px;
    width: 30px;
    display: inline-block;
    color: #000;
}

/* css ribbon */
.ribbonwrap {
    width: 100%;
    height: 89px;
    position: absolute;
    overflow: hidden;
}

.ribbon6 {
    width: 140px;
    height: 38px;
    line-height: 38px;
    position: absolute;
    top: 14px;
    left: -41px;
    z-index: 2;
    overflow: hidden;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    /* border: 1px dashed; */
    /* box-shadow:0 0 0 3px #57DD43,  0px 21px 5px -18px rgba(0,0,0,0.6); */
    /* background: #57DD43; */
    text-align: center;
}

/* css ribbon */
/* menü */
.header-menu {
    width: 100%;
    /*
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
	*/
    padding: 20px 0;
    background: var(--header-bg-color);
}

.header-menu+.header_menu_mobil_kapat {
    display: none;
    position: absolute;
    top: 0;
    right: -30px;
    width: 30px;
    height: 30px;
    font-size: 20px;
    padding: 5px;
    z-index: 4;
    background-color: #444;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #fff;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

@media (max-width: 767.98px) {
    .header-menu {
        position: absolute;
        height: 100vh;
        background-color: #fff;
        z-index: 999;
        top: 0;
        left: -263px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        padding: 0;
        margin-top: 0;
        width: 263px;
        overflow: hidden;
    }

    .header-menu.open {
        /* border-right: 2px solid var(--theme-color); */
        border-right: 0;
        background-color: var(--theme-color);
        overflow-y: scroll;
        overflow-x: hidden;
        max-height: 100vh;
        width: 263px;
        left: 0;
        -webkit-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
    }

    .header-menu.open .container {
        padding: 0;
        margin-bottom: 39px;
    }

    .header-menu.open::-webkit-scrollbar {
        width: 3px;
        background: #fff;
    }

    .header-menu.open::-webkit-scrollbar-thumb {
        background: #bbb;
    }

    .header-menu.open::-webkit-scrollbar-thumb:window-inactive {
        background: transparent;
    }
}

.header-menu-link_group {
    position: relative;
    display: inline-block;
}

@media (max-width: 767.98px) {
    .header-uye-menu {
        display: none;
        position: absolute;
        height: 100vh;
        background-color: #fff;
        z-index: 999;
        top: 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        padding: 0;
        margin-top: 0;
        overflow: hidden;
        border-right: 0;
        background-color: var(--theme-color);
        overflow-y: scroll;
        overflow-x: hidden;
        max-height: 100vh;
        width: 263px;
        right: -263px;
    }
    .header-uye-menu.open {
        display: block;
        /* border-right: 2px solid var(--theme-color); */
        border-right: 0;
        background-color: var(--theme-color);
        overflow-y: scroll;
        overflow-x: hidden;
        max-height: 100vh;
        width: 263px;
        right: 0;
        -webkit-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
    }

    .header-menu-link_group {
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        width: 100%;
        display: none;
    }

    .diller {
        display: none;
    }

    .header-mobile-logo, .header-mobile-menu, .mobil_uye_ikon {
        display: block !important;
    }
    .header-menu.open .mobil-dil {
        display: block;
    }
    .header-uye-menu.open .mobil-dil {
        display: block;
    }
}

.header-menu-link_group.active .header-menu-content {
    height: auto;
}

@media (max-width: 767.98px) {
    .header-menu-link_group .header-menu-link:after {
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        content: "\f107";
        position: absolute;
        right: 10px;
        top: -webkit-calc(50% - 10px);
        top: calc(50% - 10px);
    }
}

.header-menu-link_group:hover .header-menu-link a {
    text-decoration: underline;
}

.header-menu-link_group:hover .header-menu-content {
    visibility: visible
}

.header-menu-link_group .header-menu-content {
    width: 600px;
    margin-top: 0;
    position: absolute;
    visibility: hidden;
    /* -webkit-box-shadow: 0 0 10px -3px rgba(0, 0, 0, 0.3), 0 10px 10px -10px rgba(0, 0, 0, 0.2); */
    /* box-shadow: 0 0 10px -3px rgba(0, 0, 0, 0.3), 0 10px 10px -10px rgba(0, 0, 0, 0.2); */
    padding-top: 15px;
    left: -220px;
    z-index: 99999;
}

.menu-content-ic {
    background: var(--header-bg-color);
    border: 1px solid var(--theme-color);
    border-radius: 5px;
    position: relative;
    display: inline-block;
}

.menu-content-ic:after, .menu-content-ic:before {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.menu-content-ic:after {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #fff;
    border-width: 10px;
    margin-left: -10px;
}

.menu-content-ic:before {
    border-color: rgba(214, 109, 28, 0);
    border-bottom-color: var(--theme-color);
    border-width: 11px;
    margin-left: -11px;
}

.ustmenubasliklar {
    width: 300px;
    float: left;
    border-right: 1px solid #fff;
}

.ustmenubasliklar a {
    display: block;
    color: #000;
    padding: 7px 5px;
    border-bottom: 1px solid var(--theme-color);
    overflow: hidden;
}

.ustmenubasliklar a:last-child {
    border-bottom: none;
}

.ustmenubasliklar a i {
    font-size: 27px;
    display: block;
    width: 30px;
    float: left;
    margin-right: 8px;
    margin-top: 6px;
    text-align: center;
    cursor: pointer;
}

.ustmenubasliklar a label {
    float: left;
    width: 250px;
    font-size: 12px;
    margin: 0;
    cursor: pointer;
}

.ustmenubasliklar a label strong {
    display: block;
    font-size: 15px;
}

.ustmenubasliklar a:hover {
    background-color: var(--theme-color);
    color: var(--header-menu-hover-text-color);
}

.aktifustmenu {
    background-color: #fffffa;
    color: var(--theme-color);
}

.ustmenuicerikalani {
    color: #fff;
    width: 298px;
    float: left;
    padding: 8px;
}

.ustmenuicerikalani h3 {
    font-size: 18px;
    font-weight: bold;
    display: block;
    text-align: center;
    margin-top: 5px;
    margin-bottom: 5px;
}

.ustmenuicerikalani img {
    width: 100%;
    border-radius: 5px;
}

.ustmenuicerikalani p {
    font-size: 13px;
    margin-bottom: 9px;
    margin-top: 9px;
    display: block;
}

.ustmenuicerikalani a {
    display: block;
    width: 100%;
    padding: 5px;
    border-radius: 5px;
    background-color: #fff;
    text-align: center;
    color: var(--theme-color);
    font-size: 13px;
    font-weight: bold;
}

.header-menu-link_group .div_kisalt {
    width: 300px;
    left: -70px;
}

.header-menu-link_group .div_kisalt .ustmenuicerikalani {
    display: none;
}

@media (max-width: 767.98px) {
    .header-menu-link_group .header-menu-content {
        position: static;
        opacity: 1;
        -webkit-box-shadow: none;
        box-shadow: none;
        height: 0;
        overflow: hidden;
    }
}

.header-menu-link_group .header-menu-content .header-menu-content-link {
    display: block;
    padding: 10px;
    color: #444;
    text-decoration: none;
}

@media (max-width: 767.98px) {
    .header-menu-link_group .header-menu-content .header-menu-content-link {
        border: 0 !important;
    }
}

.header-menu-link_group .header-menu-content .header-menu-content-link.active,
.header-menu-link_group .header-menu-content .header-menu-content-link:hover {
    color: #fffffa;
}

.header-menu-link_group .header-menu-content .header-menu-content-link+.header-menu-content-link {
    border-top: 1px solid #eee;
}

.header-menu-link_group .header-menu-content:hover {
    opacity: 1;
    pointer-events: all;
}

.header-menu .header-menu-link {
    font-size: 14px;
    font-weight: bold;
    display: inline-block;
    cursor: pointer;
    position: relative;
    text-decoration: none;
    border-right: 1px solid #444;
    padding-left: 30px;
    padding-right: 30px;
}

.header-menu-link_group a {
    color: var(--header-text-color);
}

.header-menu .header-menu-link i {
    margin-right: 5px;
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .header-menu .header-menu-link {
        font-size: 13px;
    }
}

@media (max-width: 767.98px) {
    .header-menu .header-menu-link {
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        font-weight: 700;
        color: var(--theme-color);
        border-bottom: 1px solid #ddd;
        width: 100%;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        height: 60px;
        padding: 0 10px;
    }

    .header-menu .header-menu-link.hesap_numaralari {
        color: #fff;
        background-color: var(--theme-color);
    }

    .header-menu .header-menu-link.hesap_numaralari:hover {
        color: #fff !important;
        background-color: #bf7b0f;
    }
}

@media (max-width: 767.98px) {
    .header-menu .header-menu-link.diller {
        padding: 0;
        margin-top: 15px;
    }
}

.header-menu .header-menu-link.diller .diller-item {
    font-size: 15px;
    color: #444;
    text-decoration: none;
}

@media (max-width: 767.98px) {
    .header-menu .header-menu-link.diller .diller-item {
        width: 100%;
        text-align: center;
        font-size: 16px;
        padding: 15px 0;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .header-menu .header-menu-link.diller .diller-item {
        font-size: 13px;
    }
}

.header-menu .header-menu-link.diller .diller-item.active,
.header-menu .header-menu-link.diller .diller-item:hover {
    color: var(--theme-color);
}

@media (max-width: 767.98px) {

    .header-menu .header-menu-link.diller .diller-item.active,
    .header-menu .header-menu-link.diller .diller-item:hover {
        background-color: var(--theme-color);
        color: #fff;
    }
}

.header-menu .header-menu-link.diller .ayrac {
    width: 10px;
    height: 78%;
    border-right: 1px solid #ccc;
    margin-right: 10px;
}

@media (max-width: 767.98px) {
    .header-menu .header-menu-link.diller .ayrac {
        display: none;
    }
}

.header-menu .header-menu-link:hover {
    text-decoration: none;
    /* color: var(--theme-color); */
}

.header-menu .header-menu-link:hover+.header-menu-content {
    opacity: 1;
    pointer-events: all;
}

.header_mobil_top_menu {
    width: 100%;
    color: #000;
    display: none;
    z-index: 4;
    background-color: #fff;
}

@media (max-width: 767.98px) {
    .header_mobil_top_menu {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-border-radius: 5px 5px;
        border-radius: 5px 5px;
    }

    .header_mobil_top_menu .item {
        width: 20%;
        background-color: #fff;
        border: 1px solid var(--theme-color);
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 10px;
        font-size: 22px;
        color: var(--theme-color);
        -webkit-border-radius: 5px 0 0 5px;
        border-radius: 5px 0 0 5px;
        height: 48px;
        position: relative;
        text-decoration: none;
    }

    .header_mobil_top_menu .item.yer::after {
        content: "";
        width: 50px;
        height: 50px;
        position: absolute;
        right: -46px;
        top: -0.12em;
        -webkit-transform: scale(0.96);
        -ms-transform: scale(0.96);
        transform: scale(0.96);
        background-color: #fff;
        -webkit-clip-path: polygon(0 0, 0% 100%, 100% 100%);
        clip-path: polygon(0 0, 0% 100%, 100% 100%);
        -webkit-border-radius: 2px;
        border-radius: 2px;
    }

    .header_mobil_top_menu .item.telefon {
        -webkit-border-radius: 0 5px 5px 0;
        border-radius: 0 5px 5px 0;
    }

    .header_mobil_top_menu .item.telefon::after {
        content: "";
        width: 50px;
        height: 50px;
        position: absolute;
        left: -46px;
        top: -0.06em;
        -webkit-transform: scale(0.95);
        -ms-transform: scale(0.95);
        transform: scale(0.95);
        background-color: #fff;
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%);
        clip-path: polygon(0 0, 100% 0, 100% 100%);
        -webkit-border-radius: 2px;
        border-radius: 2px;
    }

    .header_mobil_top_menu .item .centik {
        width: 48px;
        height: 48px;
        background: var(--theme-color);
        position: absolute;
        right: -48px;
        -webkit-clip-path: polygon(0 0, 3% 100%, 100% 100%);
        clip-path: polygon(0 0, 3% 100%, 100% 100%);
    }

    .header_mobil_top_menu .item .centik.telefon {
        left: -48px;
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%);
        clip-path: polygon(0 0, 100% 0, 100% 100%);
    }

    .header_mobil_top_menu .bagis_yap {
        width: -webkit-calc(60% - 104px);
        width: calc(60% - 104px);
        background-color: var(--theme-color);
        color: #fff;
        text-decoration: none;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        height: 48px;
        position: relative;
        font-weight: 700;
    }

    .header_mobil_top_menu .bagis_yap span {
        position: absolute;
        z-index: 2;
    }

    .header_mobil_top_menu .bagis_yap::before {
        content: "";
        position: absolute;
        top: 0;
        left: -48px;
        width: 0;
        border: 48px solid transparent;
        border-top-color: var(--theme-color);
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    .header_mobil_top_menu .bagis_yap::after {
        content: "";
        position: absolute;
        top: -48px;
        right: -48px;
        width: 0;
        border: 48px solid transparent;
        border-bottom-color: var(--theme-color);
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

@media (max-width: 479.98px) {
    .header_mobil_top_menu .bagis_yap {
        font-size: 14px;
    }
}

@media (max-width: 374.98px) {
    .header_mobil_top_menu .item {
        width: 17%;
    }

    .header_mobil_top_menu .bagis_yap {
        width: -webkit-calc(66% - 100px);
        width: calc(66% - 100px);
    }
}

/* menü */
.clearfixx {
    clear: both;
    width: 100%;
}

.hide {
    display: none;
}

.diller {
    width: 80px;
    height: 24px;
    line-height: 21px;
    overflow: hidden;
    padding-left: 3px;
    padding-right: 3px;
    padding-bottom: 3px;
    border: 1px solid #000;
    border-radius: 5px;
    background-color: #fff;
    position: absolute;
    right: 16px;
    z-index: 99;
    top: 0;
}

.diller:hover {
    height: auto;
    transition: 0.3s;
}

.diller a {
    color: #000;
    font-weight: bold;
    font-size: 13px;
    display: block;
    width: 100%;
}

.diller a:hover {
    color: var(--theme-color);
}

.diller i {
    right: 5px;
    top: 0px;
    position: absolute;
}

.diller .diller-item img {
    width: 21px;
    border-radius: 2px;
}

/* widget 1 */
.widget1 {
    background-color: #f6f6f6;
    padding: 30px 10px;
}

.widget1 h1 {
    display: block;
    text-align: center;
    width: 100%;
    /* color:#333333!important; */
    font-size: 25px;
    font-weight: bold;
}

.widget1kutular {
    width: 700px;
    margin-right: auto;
    margin-left: auto;
    overflow: hidden;
    margin-top: 20px;
}

.widget1kutu {
    width: 340px;
    float: left;
    margin-bottom: 25px;
}

.floatright {
    float: right;
}

.widget1kutu span {
    background-color: #fd9d27;
    border-radius: 3px;
    width: 40px;
    height: 40px;
    display: inline-block;
    text-align: center;
    line-height: 40px;
    transform: rotate(45deg);
    margin-left: 10px;
    margin-right: 15px;
    margin-bottom: 15px;
    margin-top: 15px;
}

.widget1kutu span i {
    color: #fff;
    font-size: 20px;
    transform: rotate(-45deg);
}

.widget1kutu label {
    font-weight: bold;
    font-size: 14px;
}

/* widget 1 */
/* widget 2 */
.widget2 {
    background-color: #f19b2c;
    overflow: hidden;
}

.widget2 img {
    float: left;
}

.widget2sag {
    float: left;
    width: 420px;
    margin-top: 80px;
    margin-left: 40px;
    color: #fff;
}

.widget2sag h2 {
    display: block;
    width: 100%;
    text-align: left !important;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
}

.widget2sag span {
    margin-bottom: 15px;
    font-size: 15px;
}

.widget2satir {
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 5px;
    letter-spacing: 1px;
}

.widget2satir i {
    margin-right: 5px;
}

.widget2 .widget_bagis {
    margin-left: auto;
    margin-right: auto;
    margin-top: 60px;
}

.widget2 .widget_bagis .siparisver {
    border: 3px solid #ffff;
    -webkit-box-shadow: 0px 10px 11px -12px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 10px 11px -12px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 10px 11px -12px rgba(0, 0, 0, 0.75);
}

.widget2 .widget_bagis .fiyat {
    -webkit-box-shadow: 0px 10px 11px -12px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 10px 11px -12px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 10px 11px -12px rgba(0, 0, 0, 0.75);
}

/* widget 2 */
/* widget 3 */
.widget3 {
    overflow: hidden;
    padding-top: 45px;
    padding-bottom: 45px;
    background-color: #f6f6f6;
}

.widget3satirlar {
    margin-top: 20px;
    width: 765px;
    margin-left: auto;
    margin-right: auto;
}

.widget3 h1 {
    font-size: 27px;
    color: #000;
    display: block;
    text-align: center;
    font-weight: bold;
    width: 100%;
}

.widget3satir {
    color: #808080;
    font-weight: bold;
    margin-bottom: 8px;
    font-size: 15px;
}

.widget3satir i {
    color: #f19b2c;
    margin-right: 10px;
    font-size: 18px;
}

/* widget 3 */
/* widget 4 */
.widget4 {
    overflow: hidden;
    padding-top: 80px;
    padding-left: 80px;
    padding-right: 80px;
    background-color: #30353a;
    text-align: center;
    color: #fff;
}

.widget4 img {
    width: auto;
}

.widget4 span {
    display: block;
    color: #a3a5a6;
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 35px;
    width: 700px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.widget4 h1 {
    color: #fff;
    font-weight: bold;
    font-size: 25px;
    color: #fff;
    margin-bottom: 9px;
}

/* widget 4 */
/* widget 5 */
.widget5 {
    overflow: hidden;
    color: #fff;
    background-position: top center;
    background-repeat: no-repeat;
    width: 100%;
    height: 565px;
}

.widget5kutu {
    width: 450px;
    margin-top: 160px;
    margin-left: 415px;
}

.widget5kutu h1 {
    color: #fff;
    font-size: 30px;
    font-weight: bold;
}

.widget5kutu .widget_bagis {
    margin-top: 60px;
}

.widget5kutu .widget_bagis .sayi input {
    color: #674a25;
}

.widget5kutu .widget_bagis .fiyat span {
    color: #674a25;
}

.widget5kutu .widget_bagis .siparisver {
    background-color: #6e5028;
    border: 2px solid #fff;
}

.widget5kutu .widget_bagis .siparisver:hover {
    background-color: #fff;
}

/* widget 5 */
/* widget 6 */
.widget6kutu {
    background-color: #f6f6f6;
    padding: 40px 10px;
    overflow: hidden;
    width: 100%;
}

.widget6kutu h1 {
    color: #000 !important;
    display: block;
    width: 100%;
    text-align: center;
    font-weight: bold;
    font-size: 26px;
    margin-bottom: 30px;
}

.widget6kutular {
    width: 700px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}

.widget6ickutu {
    width: 33.3%;
    float: left;
    text-align: center;
    padding-left: 5px;
    padding-right: 5px;
}

.widget6ickutu i {
    color: #f19b2c;
    font-size: 40px;
}

.widget6ickutu span {
    display: block;
    width: 100%;
    text-align: center;
    font-weight: bold;
    margin-top: 8px;
    margin-bottom: 8px;
}

.widget6ickutu label {
    display: block;
    text-align: center;
    width: 100%;
    font-size: 15px;
}

/* widget 6 */
/* Sık sorulan sorular*/
.siksorulansorular {
    overflow: hidden;
}

.siksorulansorular h6 {
    font-weight: bold;
    font-size: 30px;
    text-align: center;
    display: block;
    margin-bottom: 15px;
}

.sorusatir {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    margin-bottom: 6px;
}

.sorusatir .sorusu {
    background-color: #ebebeb;
    cursor: pointer;
    /* margin-bottom:5px; */
}

.sorusatir .sorusu a {
    display: block;
    overflow: hidden;
    padding: 6px;
}

.sorusatir .sorusu a span {
    display: inline-block;
    border-left: 3px solid red;
    padding-left: 5px;
    font-size: 36px;
    line-height: 36px;
    color: var(--theme-color);
    vertical-align: middle;
    margin-right: 10px;
}

.sorusatir .sorusu a h2 {
    display: inline-block;
    font-weight: bold;
    font-size: 19px;
    color: #000;
    margin-bottom: 0;
}

.sorusatir .sorusu a i {
    color: #000;
    float: right;
    font-size: 20px;
    margin-top: 8px;
    margin-right: 6px;
}

.sorusatir .cevabi {
    overflow: hidden;
    padding: 6px;
    display: none;
    margin-top: 5px;
}

.sorusatir .cevabi span {
    border-left: 3px solid red;
    padding-left: 5px;
    font-size: 36px;
    line-height: 36px;
    color: var(--theme-color);
    margin-right: 10px;
    vertical-align: top;
    display: inline-block;
}

.sorusatir .cevabi label {
    font-size: 16px;
    display: inline-block;
    width: 860px;
}

.aktifsoru .cevabi {
    display: block;
}

.aktifsoru .sorusu a i {
    transform: rotate(-90deg)
}

/* Sık sorulan sorular*/
/* widget haberler */
.widget_haberler {
    overflow: hidden;
    background-color: #f6f6f6;
    padding-top: 40px;
    padding-bottom: 40px;
}

.widget_haberler h1 {
    color: var(--theme-color);
    display: block;
    width: 100%;
    margin-bottom: 35px;
    font-size: 29px;
    font-weight: bold;
    text-align: center;
}

.widget_haberler_kutusu {
    overflow: hidden;
    width: 610px;
    margin-left: auto;
    margin-right: auto
}

.widget_haber_kutu {
    margin-right: 20px;
    width: 295px;
    float: left;
}

.widget_haber_kutu img {
    width: 100%;
}

.widget_haber_kutu span {
    color: #f2a94a;
    font-weight: bold;
    font-size: 12px;
    display: block;
    margin-top: 8px;
    margin-bottom: 4px;
}

.widget_haber_kutu .widget_haber_baslik {
    color: #464646;
    font-weight: bold;
    font-size: 17px;
    margin-bottom: 10px;
    display: block;
}

.widget_haber_kutu .widget_haber_baslik:hover {
    color: #f1a038;
}

.widget_haber_kutu p {
    font-size: 14px;
}

/* widget haberler */
.fligran {
    display: none;
    position: fixed;
    top: 0;
    left: 260px;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.75);
    z-index: 999
}

.fligran2 {
    display: none;
    position: fixed;
    top: 0;
    right: 263px;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.75);
    z-index: 999
}

.header-mobile-logo {
    width: 100%;
    text-align: center;
    margin-bottom: 15px;
    -webkit-box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.2);
    padding: 10px;
    display: none;
}

.header-mobile-logo img {
    width: 240px;
}

.header-mobile-menu {
    padding: 10px;
    display: none;
}

.header-mobile-menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.header-mobile-menu ul li a {
    display: block;
    overflow: hidden;
    color: #fff;
    padding: 10px 5px;
    border-bottom: 1px solid #fff;
    font-weight: bold;
    font-size: 14px;
}

.header-mobile-menu ul li a .ilkikon {
    margin-right: 5px;
}

.header-mobile-menu ul li a .menuok {
    float: right;
    margin-top: 4px;
}

.header-mobile-menu ul li ul {
    margin-left: 25px;
    display: none;
}

.header-mobile-menu ul li ul li a {
    display: block;
    overflow: hidden;
}

.header-mobile-menu ul li ul li a i {
    display: block;
    width: 10px;
    height: 10px;
    background-color: #fff;
    border-radius: 75px;
    float: left;
    margin-right: 10px;
}

.header-mobile-menu ul li ul li a label {
    width: 184px;
    float: left;
    margin-bottom: 0;
    margin-top: -5px;
}

.header-mobile-menu ul li ul li a label span {
    font-weight: normal;
}

.header-mobile-menu ul li ul li a label span strong {
    font-weight: bold;
}

.header-mobile-menu .header-mobil-menu-aktif .header-menu-top {
    background-color: #fff;
    color: var(--theme-color);
}

.header-mobile-menu .header-mobil-menu-aktif .menuok {
    transform: rotate(-90deg);
}

/*.header-mobile-menu .header-mobil-menu-aktif ul{
	display:block;
}*/
.mobil-dil {
    background-color: #fff;
    position: fixed;
    bottom: 0;
    width: 263px;
    height: 39px;
    overflow: hidden;
    z-index: 21;
    display: none;
}

.mobil-dil a {
    display: block;
    padding: 10px;
    width: 100%;
    color: #000;
    font-weight: bold;
    font-size: 14px;
    overflow: hidden;
}

.mobil-dil a img {
    width: 25px;
    margin-right: 10px;
}

.mobil-dil i {
    position: absolute;
    right: 10px;
    top: 10px;
}

.mobil-dil-acik {
    height: auto;
}

.mobil-dil-acik i {
    transform: rotate(-180deg);
}

.mobil_uye_ikon {
    position: absolute;
    top: 10px;
    right: 30px;
    font-size: 30px;
    color: var(--theme-color);
    display: none;
    z-index: 1;
    cursor: pointer;
}

@media only screen and (max-width: 768px) {


    .yorumtoplamyildiz label {
        display: inline-block;
        font-size: 13px;
        margin-left: 5px;
        float: left;
    }

    .yorumtoplamyildiz b {
        font-size: 39px;
        vertical-align: text-top;
        line-height: 39px;
        float: left;
    }

    .yorumtoplamyildiz span {
        margin-left: 5px;
    }

    .yorumtoplamyildiz span i {
        font-size: 12px;
    }

    .yorumfiltre {
        margin-top: 0;
        width: 132px;
        text-align: left;
    }

    .altsosyalalan {
        background-color: #fff;
        padding-top: 15px;
        padding-bottom: 15px;
        margin-bottom: -1px;
    }

    .altsosyalalan {
        width: 100%;
        text-align: center;
        position: relative;
        bottom: -1px;
        right: inherit;
        left: inherit;
        margin: inherit;
    }

    .altsosyalalan ul {
        margin-bottom: 0;
    }

    .altsosyalalan ul li .yooki {
        color: #333;
        font-size: 16px;
        font-weight: bold;
    }

    .altsosyalalan ul li {
        border-right-color: #333;
        width: 66px;
    }

    .altsosyalbutonlar {
        top: -46px;
        left: 45%;
        position: absolute;
    }

    .bagisConteiner {
        -webkit-box-shadow: 0px 10px 5px -6px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0px 10px 5px -6px rgba(0, 0, 0, 0.1);
        box-shadow: 0px 10px 5px -6px rgba(0, 0, 0, 0.1);
    }

    /* widget 1 */
    .widget1kutular {
        width: 100%;
    }

    .widget1kutu {
        width: 100%;
        float: none;
    }

    /* widget 2 */
    .widget2 img {
        width: 90%;
        margin-left: 20px;
        float: none;
    }

    .widget2sag {
        float: none;
        width: 100%;
        padding: 10px;
        margin-left: 0;
        margin-top: 30px;
    }

    .widget2 .widget_bagis {
        margin-top: 40px;
        margin-bottom: 20px;
    }

    /* widget 3 */
    .widget3satirlar {
        width: 100%;
        padding: 10px
    }

    .widget3satir {
        margin-bottom: 10px;
    }

    /* widget 4 */
    .widget4 {
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 20px;
    }

    .widget4 span {
        width: 100%;
    }

    .widget4 img {
        width: 100%;
    }

    /* widget 5 */
    .widget5 {
        height: auto;
        padding: 10px;
        background-size: cover;
    }

    .widget5kutu {
        width: 100%;
        margin-top: 30px;
        margin-left: 0;
        text-align: center;
    }

    .widget5kutu .widget_bagis {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px;
    }

    /* sıkça sorulan sorular */
    .widget6kutular {
        width: 100%;
    }

    .widget6ickutu {
        width: 100%;
        float: none;
        margin-bottom: 20px;
    }

    .sorusatir .cevabi span {
        display: none;
    }

    .sorusatir .cevabi label {
        width: 100%;
    }

    /* haberler */
    .widget_haberler_kutusu {
        width: 100%;
    }

    .widget_haber_kutu {
        float: none;
        margin-right: auto !important;
        margin-left: auto !important;
        margin-bottom: 20px;
    }
    .tl-sag{
        display: none
    }

    .tl-sol{
        display: none
    }
}

.yukleniyor {
    width: 20px;
    float: left;
    display: none;
    margin-right: 5px;
}

.fiyat form{
    display: flex;
}

.swal2-styled.swal2-confirm{
    background-color: var(--theme-color);
}

.select2-selection__rendered {
    line-height: 40px !important;
}
.select2-container .select2-selection--single {
    height: 40px !important;
}
.select2-selection__arrow {
    height: 40px !important;
}

#preloader{
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    position: fixed;
    z-index: 9999;
}
.spinner {
    width: 40px;
    height: 40px;
    position: relative;
    left: 50%;
    top: 50%;
    margin: -20px 0 0 -20px;
}

.double-bounce1, .double-bounce2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: var(--theme-color);
    opacity: 0.6;
    position: absolute;
    top: 0;
    left: 0;

    -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
    animation: sk-bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

@-webkit-keyframes sk-bounce {
    0%, 100% { -webkit-transform: scale(0.0) }
    50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
    0%, 100% {
        transform: scale(0.0);
        -webkit-transform: scale(0.0);
    } 50% {
          transform: scale(1.0);
          -webkit-transform: scale(1.0);
      }
}

.sk-cube-grid {
    width: 40px;
    height: 40px;
    margin: 100px auto;
}

.sk-cube-grid .sk-cube {
    width: 33%;
    height: 33%;
    background-color: var(--theme-color);
    float: left;
    -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
    animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
}
.sk-cube-grid .sk-cube1 {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s; }
.sk-cube-grid .sk-cube2 {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s; }
.sk-cube-grid .sk-cube3 {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s; }
.sk-cube-grid .sk-cube4 {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s; }
.sk-cube-grid .sk-cube5 {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s; }
.sk-cube-grid .sk-cube6 {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s; }
.sk-cube-grid .sk-cube7 {
    -webkit-animation-delay: 0s;
    animation-delay: 0s; }
.sk-cube-grid .sk-cube8 {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s; }
.sk-cube-grid .sk-cube9 {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s; }

@-webkit-keyframes sk-cubeGridScaleDelay {
    0%, 70%, 100% {
        -webkit-transform: scale3D(1, 1, 1);
        transform: scale3D(1, 1, 1);
    } 35% {
          -webkit-transform: scale3D(0, 0, 1);
          transform: scale3D(0, 0, 1);
      }
}

@keyframes sk-cubeGridScaleDelay {
    0%, 70%, 100% {
        -webkit-transform: scale3D(1, 1, 1);
        transform: scale3D(1, 1, 1);
    } 35% {
          -webkit-transform: scale3D(0, 0, 1);
          transform: scale3D(0, 0, 1);
      }
}

.odemetabayrac{
    border-right:3px solid #fff;
}

.pay-exterior{
    border: 1px solid #bebebe;
    border-radius: 5px;
    padding: 0.9em;
}

.pay-exterior .pay-box{
    border: 1px solid #bebebe;
    border-radius: 5px;
    margin-bottom: 15px;
    transition: 0.5s;
}

.pay-exterior .pay-box:hover{
    border: 1px solid #000000;
    transition: 0.5s;
}

.pay-exterior .pay-head{
    cursor: pointer;
    padding: 0.5em 0.5em 0.5em 1em;
    margin: 0 -15px 0 -15px;
    transition: 0.5s;
}

.pay-exterior .pay-head.active{
    background-color: var(--theme-color);
    color: #ffffff;
}

.pay-exterior .pay-head:hover{
    padding-left: 2em;
    transition: 0.5s;
}

.pay-exterior .pay-content{
    display: none;
}

.pay-exterior .pay-box:last-child{
    margin-bottom: 0;
}

.pay-box .pay-sec-info{
    width: 20%;
}

.pay-box *{
    vertical-align: middle;
}

.pay-box .pay-sec-amounts{
    width: 75%;
    font-size: 18px;
}
.pay-box .pay-sec-toggle{
    width: 4%;
}

.pay-box .pay-sec-info,.pay-sec-amounts,.pay-sec-toggle{
    display:inline-block;
}

.pay-sec-info .pay-name{
    font-size: 18px;
    font-weight: bold;
    color: #000000;
}

.pay-sec-info .pay-name.active{
    color: white;
}

.pay-sec-info .pay-icon{
    width: 37px;
}

.pay-sec-amounts .fa-money-bill{
    color: #bebebe;
}

.pay-sec-amounts .pay-flat-sum{
    color: #000000;
}

.pay-sec-amounts .pay-flat-sum.active{
    color: #ffffff;
}

.pay-sec-amounts .pay-plus{

}

.pay-sec-amounts .pay-deduction{
    color: #ff0000;
}

.pay-sec-amounts .pay-deduction.active{
    color: #ffffff;
}

.pay-sec-amounts .pay-equal{
    color: #000000;
}

.pay-sec-amounts .pay-equal.active{
    color: #ffffff;
}

.pay-sec-amounts .pay-total{
    color: var(--theme-color);
    font-weight: bold;
}

.pay-sec-amounts .pay-total.active{
    color: #ffffff;
}

.pay-sec-toggle .pay-plus{
    line-height: 0;
    font-size: 50px;
    height: 4px;
    color: #bebebe;
    user-select: none;
    transition: 0.5s;
}

.pay-sec-toggle .pay-plus.active{
    color: #ffffff;
    transform: rotate(-135deg);
    transition: 0.5s;
}

@media (max-width: 768px) {
    .pay-box .pay-sec-info,.pay-sec-amounts,.pay-sec-toggle{
        display: block;
    }

    .pay-box .pay-sec-info{
        width: unset;
    }

    .pay-box .pay-sec-amounts{
        width: unset;
        font-size: 15px;
    }

    .pay-box .pay-sec-toggle{
        width: unset;
    }

    .pay-sec-toggle .pay-plus {
        position: absolute;
        top: 20px;
        right: 7px;
    }
}

.iti.iti--allow-dropdown.iti--show-flags {
    width: 100%;
}