@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&display=swap");
/* 1. Theme default css */

@import url('https://fonts.googleapis.com/css2?family=Caveat+Brush&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');

:root {
    --renk-turuncu: #F15B2B;
    --renk-acik-turuncu: #FDEEE;
    --renk-turkuaz: #54BAB5;
    --renk-acik-turkuaz: #E7F4F4;
    --renk-mavi: #4BB8E9;
    --renk-acik-mavi: #E9F1FD;
    --renk-yesil: #79B891;
    --renk-acik-yesil: #E9FAEB;
    --renk-kirmizi: #F14D5D;
    
    
    --renk-logo: #776b60;
}


.color-turuncu {
    color: var(--renk-turuncu) !important
}

.color-turkuaz {
    color: var(--renk-turkuaz) !important
}

.color-mavi {
    color: var(--renk-mavi) !important
}

.color-yesil {
    color: var(--renk-yesil) !important
}

.color-kirmizi {
    color: var(--renk-kirmizi) !important
}


.bg-acik-turuncu {
    background-color: var(--renk-acik-turuncu) !important;
}

.bg-turkuaz {
    background-color: var(--renk-turkuaz) !important;
}

.bg-acik-turkuaz {
    background-color: var(--renk-acik-turkuaz) !important;
}



.bg-mavi {
    background-color: var(--renk-mavi) !important;
}

.bg-acik-mavi {
    background-color: var(--renk-acik-mavi) !important;
}


.bg-yesil {
    background-color: var(--renk-yesil) !important;
}

.bg-acik-yesil {
    background-color: var(--renk-acik-yesil) !important;
}


.bg-logo {
    background-color: var(--renk-logo) !important;
    color:#fff;
}


.font-light {
    font-family: "Rubik", sans-serif;
    font-optical-sizing: auto;
    font-weight: normal !important;
    font-style: normal;
}

.font-todi {
    font-family: "Rubik", sans-serif;
    font-optical-sizing: auto;
    font-weight: 800;
    font-style: normal;
}

.font-hr {
    font-family: "Caveat Brush", cursive;
    font-weight: 400;
    font-style: normal;
}



body {
   margin:0px;
   font-family: 'Nunito', sans-serif; 
   color:#333;
   font-size:18px ; 
    }
    a, a:hover, a:active, a img {
     text-decoration:none !important; color:inherit; border:none
    }
  [data-target] {
    cursor:pointer;
   }
header {
 background:#fff; border-top:solid 2px #00213d; border-bottom:solid 1px #00213d;  height:auto;
}
.form-control {
 border-radius:0px !important; box-shadow:none; border:none; border-bottom:solid 1px #00213d
}
.form-control:focus {
box-shadow:none;  border-bottom:solid 1px #00869f
}
.tablo-header {
 background:#dfdfdf; font-size:14px; font-weight:bold; padding-top:10px; padding-bottom:10px;text-align:center
}

.sm-baslik-tablo {
     display:none; margin-top:15px
    }
.siparis-ozet {
    font-size:14px; padding-bottom:10px; padding-top:10px;   text-align:center; border-bottom:solid 1px #bababa
}
.siparis-detay-container {
background:#f2f2f2;padding-top:15px; display:none

}
.ortala {
    position: relative;
    top: 50%;
    transform:translateY(-50%);
}
.ust-bar {
      text-align:right
}
.ust-bar-menu {
display:inline-block
}
.login-ust-menu {
 display:inline-block; margin-left:25px
}
.logo-box {
   line-height:80px
}
    .logo-box img {
        max-height:60px; max-width:95%; 
       
        }

.account-col {
    text-align:right; 
    height:80px; font-size:14px
    }

.slider-container {
    width:100%;
    height:calc(100vh - 110px);
    overflow:hidden;
    position:relative;
    }
    .slider-container img {
       min-height:100%;
       width:100%;
    }

.slider-bottom {
     position:absolute; top:0px; z-index:10;
        left:0px; right:0px;
     height:50px;
     background:#fff
    }
.slider-bottom-icon {
     position:absolute; top:-40px;z-index:11;
         left:0px; right:0px;
     margin:auto;
     height:50px;
     text-align:center
    }
.slider-bottom-icon img {
    width:auto !important;
    }

.urun-menu-container {
 text-align:center; margin-top:50px; margin-bottom:50px;
}
.urun-menu-list {
 display:inline-block; padding-left:15px; padding-right:15px; font-size:18px; font-weight:600
}
.urun-menu-list.active {
 font-weight:800
}
.urun-menu-list.disable {
 color:#bababa; text-decoration:line-through
}

.urun-list {
 margin-bottom:15px;
}
.urun-img {
    width: 100%;
    position: relative;
    border: solid 1px #dfdfdf;
    height: 300px;
    text-align: center;
    object-fit: contain;
    overflow: hidden;
}
.urun-img img{
    height:100%;
    width:auto;
    }
    .urun-img .overlay  {
        position:absolute;
        top:0px; left:0px;right:0px;
        bottom:0px;
        background:rgba(0, 0, 0, 0.60) url(../img/sepeteat.png) center center no-repeat;
        background-size:30% auto; opacity:0; transition:0.40s
        }
      .urun-img:hover .overlay {
       display:block; opacity:0.9
        }

.urun-bilgi {
 font-size:15px;
 border-bottom:solid 1px #dfdfdf;
 transition:0.40s ease-in-out;
 -webkit-transition:0.40s ease-in-out;
 -moz-transition:0.40s ease-in-out;
  padding:10px 5px
}

.urun-list:hover .urun-bilgi {
    border-bottom:solid 1px #ff6c00;
}

.urun-ad {
 font-weight:800; font-size:18px; margin-bottom:3px;
}
.urun-fiyat {
 font-size:14px
}
.alt-banner {
     background:url(../img/bg-ananas.jpg) no-repeat center bottom;
     background-size:100% auto; 
     padding-top:60px;
     padding-bottom:50px; color:#fff; font-size:20px
}

.btn-orange {
 background:#ff6c00; border-radius:0px !important; letter-spacing:0.70px;
  transition:0.40s ease-in-out;
 -webkit-transition:0.40s ease-in-out;
 -moz-transition:0.40s ease-in-out;
 color:#fff
}
    .btn-orange:hover {
        background:#d15b03; 
        color:#fff
    }


.social-icon-row {
 background:#f4f4f4; color:#a7a7a7; text-align:center; font-size:18px; padding-top:15px; padding-bottom:15px
}
.row-space {
 margin-top:50px; margin-bottom:50px
}
h2 {
  font-weight:600;
  margin-top:0px
}

.blog-list {
      max-width:300px;
      width:100%;
      margin:15px auto;
      overflow:hidden;
    }
    .default-blog-img {
        width:100%;
        overflow:hidden;
        border:solid 1px #dfdfdf;
        height:300px
    }
    .default-blog-img img {
        width:100%;
    }
    .blog-ad {
        font-size:15px;
        margin-top:15px;
        margin-bottom:15px
    }

footer {
    background:#1e1e1e;
}
    .page-content {
        padding-top:50px;
        padding-bottom:100px
      }

.blog-icerik img {
  margin:10px; margin-top:0px; float:left; max-width:500px
}
.tutar-box {
 background:#f2f2f2; border:solid 1px  #e9e9e9; padding:15px; font-size:13px
}
    .tutar-box td {
     padding:5px
    }


 .sepet-list {
    border-bottom: solid 1px #dedede;
    margin-bottom: 15px;
    padding-bottom: 15px;
}
    .sepet-urunimg-col {
    display: inline-block;
    vertical-align: top;
}
    .sepet-urunimg {
    border: solid 1px #dedede;
    line-height: 100px;
    text-align: center;
}
    .sepet-urunimg img {
    max-height: 100px;
    max-width: 100px;
}
    .sepet-bilgi-col {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 265px);
    padding-left: 15px;
}
    .sepet-urun-ad {
    font-weight: bold;
    margin-bottom: 15px;
}
    .sepet-odeme-col {
    font-size: 12px;
    display: inline-block;
    text-align: right;
    width: 150px;
}
    .sepet-fiyat {
    color: #026993;
    font-weight: 600;
    font-size: 18px;
}
    .sepet-fiyat .kdvdahil {
    color: #606060;
    font-size: 12px;
    font-weight: 400;
}
    .btn-gray {
    border-radius:0px;
    border:solid 1PX #d5d5d5;
    background-color:#d5d5d5;
    padding:7px 15px;
    color:#fff;
    transition:0.40s ease-in-out;
    -webkit-transition:0.40s ease-in-out;
    -moz-transition:0.40s ease-in-out
}
    .btn-gray:hover {
        background-color:#ff6c00;
        color:#fff;
    }

.right-center {
 text-align:right
}

.uye-ol-bg {
 background:url(../img/bg-ananas.jpg) no-repeat right bottom; background-size:auto 100%;
 color:#fff;
  height:288px;
  font-size:24px; font-weight:800;
  text-align:center
}
    .uye-ol-bg .uye-aciklama {
         font-size:16px; font-weight:600; max-width:80%;  margin:5px auto 
    }
.uyegirisi-box {
 max-width:300px; width:90%; margin-left:auto; margin-right:auto
}
.btn-filtrele {
     display:none
    }
 .sm-hidden {
     display:block
    }
     .md-hidden {
     display:none
    }

.urun-detay-img {
 width:100%; border:solid 1px #dfdfdf
}
    .urun-detay-img img {
     width:100%; border:solid 1px #dfdfdf
    }

.urun-ad {
 font-size:20px; font-weight:600; margin-bottom:15px;
}
.urun-aciklama {
 margin-top:15px; margin-bottom:15px;
}


.kucuk-urun-detay-container {
    margin-top:2px; text-align:justify
}
.kucuk-urun-detay-img {
    width: 23%;
    height: 60px;
    overflow: hidden;
    border: solid 1px #e8e8e8;
    display: inline-block;
    margin: 0.50px;
    vertical-align: top;
    object-fit: contain;
    text-align: center;
}
    .kucuk-urun-detay-img img {
        height:100%; 
    }
.slider-text {
 color:#fff; font-weight:800; position:absolute; bottom:60px; right:30px; text-align:right;font-family: 'Nunito Sans', sans-serif;
}
.slider-text .ilk-satir {
      font-size:30px;
}
.slider-text .alt-satir {
      font-size:50px;
}
.tasarim-form {
 padding:30px; background:#f2f2f2; display:none
}
    .tasarim-form .form-control {
     background:transparent
    }

 .btn-border {
    border-radius:0px;
    border:solid 1PX #333;
    padding:7px 15px;
   color:#333;
   transition:0.40s ease-in-out; -webkit-transition:0.40s ease-in-out;-moz-transition:0.40s ease-in-out
}
    .btn-border:hover {
        background-color:#ff6c00;
        color:#fff;
    }
    .pay-content {
    border: solid 1px #ddd;
    background-color: #fff;
    padding: 10px;
    margin-left: 0px;
    margin-right: 0px;
}
@media (max-width:992px) {
    .logo-box {
   line-height:60px; text-align:center
}
    .logo-box img {
        max-height:50px; max-width:95%; 
       
        }
    .ust-bar {
      text-align:center
}

.login-ust-menu {
 display:inline-block; margin-left:25px
}
    .urun-menu-container {
 text-align:center; margin-top:0px; margin-bottom:20px; /*background:#f8f8f8;*/ padding:10px; text-align:center; 
}
.urun-menu-list {
 display:inline-block; padding-left:15px; padding-right:15px; font-size:18px; font-weight:600; width:auto; margin-bottom:10px;
}
    .urun-menu-list:first-child {
        width:auto;
    }
    .urun-aciklama {
 margin-top:15px; margin-bottom:15px; font-size:14px
}
    .btn-filtrele {
     display:block; 
    }
    .sm-hidden {
     display:none
    }
     .md-hidden {
     display:block
    }
    .account-col {
     text-align:center;
         height: 45px; border-top:solid 1px #dedede
    }
}
@media (max-width:768px) {
    .tablo-header { display:none
    }
    .sm-baslik-tablo {
     display:block
    }
    .siparis-detay-tutar {
         text-align:right !important; width:100%; 
     }
        .siparis-detay-tutar .sepet-fiyat {
          width:100%; text-align:right;float:right
        }
        .siparis-detay-tutar .sepet-fiyat div {
         display:inline-block;  margin-left:10px
        }
    .ust-bar-menu {
     display:none !important
    }
    .ust-bar-menu {
     display:inline-block;
    }
    .login-ust-menu {
    margin-left:auto; margin-right:auto;
    }
    .slider-container img {
     width:auto;height:calc(100vh - 110px);
    }
    .sepet-bilgi-col {
      display: inline-block;
      vertical-align: top;
      width: calc(100% - 115px); 
      padding-left: 15px;
    }
       .sepet-odeme-col {
        font-size: 12px;
        display: inline-block;
        text-align: right;
        width: 100%;
       }
    .sepet-fiyat {
     float:left;width:60%; text-align:left
    }
     .sepet-btn-col {
     float:right; width:40%
    }
    .right-center .btn {
      width:100%; margin-bottom:0px
    }
    footer {
     text-align:center
    }
    .alt-banner {
     background:url(../img/bg-ananas.jpg) no-repeat center bottom;
     background-size:auto 100% ; 
     padding-top:60px;
     padding-bottom:50px; color:#fff; font-size:20px
}
    .slider-text .ilk-satir {
      font-size:20px;
}
.slider-text .alt-satir {
      font-size:25px;
}
}



.satin-al-container {
    padding-top: 70px;
    padding-bottom: 50px
}

.tab-btn {
    border: 1px solid #eaeaea;
    background: #f8f8f8;
    padding: 15px 15px;
    float: left;
    width: 50%;
    text-align: center;
    height: 75px;
    color: #d8d8d8;
    cursor: pointer;
}

    .tab-btn:hover {
        background: #f5f5f5;
        color: #cccccc;
    }

    .tab-btn i {
    }

    .tab-btn.active {
        border: 1px solid #f89043;
        background: #f89043;
        color: #fff;
        padding: 15px 15px;
        float: left;
        width: 50%;
        text-align: center;
    }

        .tab-btn.active i {
            display: block;
        }

.xs-text {
    font-size: 14px;
}

.tab-content {
    border: 1px solid #eaeaea;
    padding-bottom: 15px;
    margin-bottom: 15px;
    padding: 15px;
}

.tab-title {
    border: 1px solid #eaeaea;
    background: #f8f8f8;
    padding-top: 7px;
    padding-bottom: 7px;
    margin-bottom: 15px;
}

.address-add-box {
    border: 1px solid #eaeaea;
    background: #f8f8f8;
    color: #b1b1b1;
    height: 150px;
    cursor: pointer;
}

    .address-add-box i {
        color: #d8d8d8;
        font-size: 28px;
    }

.entered-address, .entered-invoice-address {
    border: 1px solid #eaeaea;
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 16PX;
    height: 150px;
}

.address-name {
    color: #ff6c00;
}

.edit-col {
    text-align: right;
    color: #b1b1b1;
}

.person-name {
    font-weight: 600;
}

.teslimat-adresi, fatura-adresi {
    margin-bottom: 30px;
}

.fatura-adresi {
    display: none;
}

.satin-al-container .form-control {
    border: 1px solid #eaeaea;
    background: #f8f8f8;
}

#address-form {
    display: none;
}

.kurumsal-bilgiler {
    display: none;
}

.btn-tab-arrow {
    border-bottom: solid 2px #eaeaea;
    position: relative;
    text-align: center;
    cursor: pointer;
}

    .btn-tab-arrow:hover {
        background: #f5f5f5;
    }

    .btn-tab-arrow .arrow {
        display: none;
    }

    .btn-tab-arrow.active {
        border-bottom: solid 2px #f89043;
        position: relative;
        color: #f89043;
    }

        .btn-tab-arrow.active .arrow {
            position: absolute;
            bottom: -17px;
            width: 100%;
            text-align: center;
            color: #f89043;
            font-size: 24px;
            display: block;
        }

.price-box {
    border: 1px solid #eaeaea;
}

@media (max-width:768px) {
    .tab-btn {
        font-size: 16px
    }

    .satin-al-container {
        padding-top: 20px;
        padding-bottom: 20px
    }

    .entered-address {
        height: auto;
        margin-bottom: 15px
    }

    .address-add-box {
        height: 80px
    }
}

.sepet-urunimg {
    min-width: 100px;
    text-align: center;
}

.entered-address.active, .entered-invoice-address.active {
    border-bottom: solid 5px #f89043;
}

.taksit-secenegi-button {
    text-align: center;
    border: solid 1px #ccc;
    margin-bottom: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    cursor: pointer;
}

    .taksit-secenegi-button.active {
        border-left: solid 5px #f89043;
        background: #f89043;
        color: #fff;
    }

.sepet-fiyat {
    text-align: left !important
}

.sepet-adet-col input {
    width: 105px;
    display: inline-block;
}

.sepet-odeme-col {
    margin-top: 15px
}