@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');


header .menu2 li .openMenu .item span:hover {
    color: #f27a1a !important;
}

:root {
    --label-color: #f27a1a;
}
body {
    font-family: 'Roboto', serif !important;
}

header .logo{
    padding:25px 0 !important;
}





header {
    background: #fff;
    box-shadow: 0 2px 4px 0 rgba(177,177,177,.5);
    border: none;
    margin-bottom:10px !important;
}

    header .searchArea .form-group input,
    #main .product-item:hover, #main .product-item:focus,
    header .menu2 li .openMenu .item:hover img,
    header .menu2 li .openMenu, header .menu2 li.mega-menu > a::before {
        border-color: #000 !important;
    }

    header .searchArea .submit-btn, header .menu > li > a {
        color: #000 !important;
    }

    #main .login-page .form-box .nav-tabs li.active,
    .btn, footer .bottom .scrollTop,
    #main .homeSlider .item .bar,
    header .socialMedia li a {
        background: #686868 !important;
    }



    header .menuOpen, header .searchArea .form-group input,
    #main .product-item a .price, header .menu2 li > a:hover,
    .item a, .item a:hover, header .menu2 li .openMenu .item:hover span {
        color: #000 !important;
    }

#main .product-item .bagBox a:hover, #main .product-item .starBox a:hover {
    background-color: #686868 !important;
    border-color: #f41919 !important;
}






header .menu2 li .openMenu .item span{
    text-align:left !important;
}

footer {
    background: #202020 !important;
}

    footer .top {
        background: #202020 !important;
    }

.buyProduct {
    background-color: #f27a1a !important;
    border-radius:5px !important;
    min-width:350px;
}

@media only screen and (min-width: 600px) {
 
}

.stock {
    margin: 18px 0 !important;
    height: 37px !important;
}

#main .product-detail .image-area .image-box .zoomBox {
    background-color: #e8e8e8 !important;
}



.brandImg{
vertical-align:central !important;
}


.btn-checkout, .buyProduct {
    background-color: #f27a1a !important;
    border: none !important;
    border-radius: 10px !important;
}
    .btn-checkout:hover, .buyProduct:hover {
        background-color: #ff9c4e !important;
        color: #FFF !important;
    }

#main .user-page .summaryBox {
    background: #686868 !important;
    
}



@media (max-width: 1200px) {
    .headerTop > .container > .searchArea {
      max-width: 100% !important;
      padding-top: 0px !important;
      padding-bottom: 20px !important;
    }
  }
  
  @media (max-width: 1100px) {
    .headerTop > .container > .searchArea {
      max-width: 90% !important;
      padding-top: 0px !important;
      margin-top: -30px !important;
      padding-bottom: 20px !important;
    }
  }
  
  @media only screen and (max-width: 1100px) {
    header .menu {
      /* width: 75%!important;  */
      /* kubilay */
    }
  }
  
  header .menuOpen span {
    display:none;
  }




  /* Ürün Liste css kodları   */

/* Üst tarafta bulunan resimlerin  css kodları   */
.product-list > .pageHeader.mb50 > .hidden-xs > img {
    width: 100%;
    height: auto;
    object-fit: cover;
    margin: auto;
  }
  
  .product-list > .pageHeader.mb50 > .visible-xs > img {
    width: 100%;
    height: auto;
    object-fit: cover;
    margin: auto;
  }
  
  /* Filterlerin genel css kodları   */
  form[name="productList"] > ul > li > .dropdown > a {
    background-color: var(--label-color) !important;
    padding: 0px !important;
    padding: 3px 20px !important;
    color: white !important;
    border-radius: 0px !important;
    border-radius: 9px !important;
    margin-bottom: 16px;
  }
  /* Tümünü listele kısmının css kodları   */
  form[name="productList"] > ul > .filter-all {
    padding-left: 0px !important;
  }
  form[name="productList"] > ul > .filter-all > a {
    background-color: var(--label-color) !important;
    padding: 0px !important;
    padding: 3px 20px !important;
    color: white !important;
    border-radius: 0px !important;
    border-radius: 9px !important;
  }
  
  /* Sıralama kısmının css kodları   */
  form[name="productList"] > ul > .order {
    padding: 0px !important;
    margin-top: 33px;
  }
  form[name="productList"] > ul > .order > .form-area > .form-group > div {
    background-color: var(--label-color) !important;
    padding: 0px !important;
    padding: 2px 20px !important;
    color: white !important;
    border-radius: 0px !important;
    border-radius: 9px !important;
  }
  form[name="productList"] > ul > .order > .form-area > .form-group > div > ul {
    border-radius: 0px !important;
  }
  form[name="productList"] > ul > .order > .form-area > .form-group > div::after {
    border-color: white !important;
  }
  form[name="productList"] > ul > .order > .form-area > .form-group > div > span {
    color: white !important;
  }
  form[name="productList"] > ul > .order > .form-area > .form-group > div > span {
    color: white !important;
  }
  
  /* Genel olarak filtrelerin responsive düzenlerinin css kodları   */
  @media (max-width: 1100px) {
    form[name="productList"] > ul > .filter-all {
      margin-top: 10px !important;
    }
  
    form[name="productList"] > ul > .order {
      margin-top: 10px !important;
    }
  }
  @media (max-width: 600px) {
    form[name="productList"] > ul > li > .dropdown > a {
      width: 100% !important;
      display: flex !important;
      flex-direction: row !important;
      justify-content: space-between !important;
    }
    form[name="productList"] > ul > li > .dropdown {
      width: 100% !important;
      margin-bottom: 16px;
    }
  
    form[name="productList"] > ul > li > .dropdown > a {
      padding: 6px 20px !important;
    }
  }
  
  form[name="productList"] > .open-filter {
    max-width: 100% !important;
  }
  
  /* Filtrelerin genel css düzenelmeleri css kodları   */
  
  @media (max-width: 620px) and (min-width: 600px) {
    .product-list > .filters {
      margin-top: -20px !important;
    }
  }
  
  @media (max-width: 800px) and (min-width: 768px) {
    .product-list > .filters {
      margin-top: -100px !important;
    }
  }
  
  @media (min-width: 800px) and (max-width: 1100px) {
    .product-list > .filters {
      margin-top: -75px !important;
    }
  }
  
  @media (min-width: 1100px) and (max-width: 1200px) {
    .product-list > .filters {
      margin-top: -65px !important;
    }
  }
  
  /* Ürün Liste css kodları  Bitti  */

  input[type="select"]{
    height: 50px !important;
  }





  :root {
  --label-color: #005daf;
  --border-color: #e8e8e8;
}

header {
  display: block;
  width: 100%;
  position: relative;
  margin: auto;
}

header .menu2 li .openMenu {
  position: absolute;
  left: 0;
  top: 100%;
  width: auto;
  background: #fff;
  padding: 30px 0;
  padding-top: 30px;
  opacity: 0;
  z-index: -1;
  visibility: hidden;
  transition: all 0.2s ease-in-out;
  border: 2px solid #005daf;
  padding-top: 40px;
  display: inline-block;
  max-width: 1540px;
  padding: 30px !important;
}

@media (max-width: 1100px) {
  .headerBottom.active {
-webkit-box-shadow: 200px 70px 49px 73px rgba(0,0,0,0.38);
-moz-box-shadow: 200px 70px 49px 73px rgba(0,0,0,0.38);
box-shadow: 200px 70px 49px 73px rgba(0,0,0,0.38);
  }
  .openMenu {
    display: none !important;
  }
}

footer {
  display: block;
  width: 100%;
  height: auto;
  background: #0c0c0c;
  position: relative;
}
@media only screen and (min-width: 1100px) {
  footer > .center {
    margin-top: -18px;
  }
}
.InformationFooter {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
}
.InformationFooterItems {
  width: 200px;
}

footer .top {
  margin-bottom: 0px !important;
}

.etiket {
  position: absolute !important;
  left: 5px;
  top: 5px !important;
  z-index: 99999 !important;
}

.etiket .badge {
  position: unset !important;
  display: block !important;
  margin-bottom: 3px !important;
  left: 0px !important;
  float: unset !important;
}

.products {
  display: flex !important;
  flex-wrap: wrap !important;
}

.product-item {
  display: flex !important;
  flex-direction: column !important;
  height: 500px !important;
  text-align: center !important;
}

@media only screen and (min-width: 800px) {
  footer .center {
    position: relative !important;
    display: block !important;
    padding-top: 100px !important;
  }
}
.badge {
  opacity: 0.9 !important;
  font-size: 0.8em !important;
  border-radius: 0 !important;
}

.badge2x {
  font-size: 0.9em !important;
  margin: 10px !important;
}

.badge-primary,
.badge-warning {
  border-radius: unset !important;
  top: 20px !important;
  left: 15px !important;
}

.badge-primary {
    background-color: #1b1b1b00 !important;
    color: black;
    padding: 5px 0px !important;
    font-size: 17px !important;
    border-top: 1px solid #db363c;
    border-bottom: 1px solid #db363c;
}

.badge-warning {
  background-color: #f27a1a !important;
}

.form-area .form-group .nice-select {
  margin-bottom: unset !important;
  height: 40px !important;
}

.giftBtn {
  color: #db0404 !important;
  font-weight: bold !important;
}

.banka-info-table {
  background: #fbfcfd;
  border: 1px solid #d0dcec;
  border-radius: 5px;
  font-family: sans-serif;
}

.snapwidget-widget {
  height: 465px !important;
}

.product-item img {
  object-fit: contain !important;
}

/*  */

@media only screen and (max-width: 600px) {
  .product-item img {
    width: unset !important;
    width: 100% !important;
    height: 250px !important;
    object-fit: contain !important;
  }

  #main .product-item {
    height: unset !important;
    min-height: 425px !important;
  }

  .snapwidget-widget {
    height: 240px !important;
  }
}

.topBanner {
  background: linear-gradient(
    90.26deg,
    #de4f0b 26.62%,
    #f90716 61.69%,
    #ff874e 79.64%
  );
  width: 100%;
  height: 60px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.topBanner * {
  font-family: Poppins, sans-serif;
}
/* Ortadaki alan */
.InSideBanner {
  max-width: 1000px;
  width: 100%;
  margin: auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.headerBottom > .container {
}

/* Buton ve büyük Text'in olduğu alan */
.TopBannerLeft {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  width: 100%;
}
/* Büyük Text alan */
.TopBannerLeft > p {
  font-weight: 800;
  font-size: 26px;
  color: #ffffff;
  text-align: center;
  height: 100%;
}
/* Button alan */
.TopBannerLeft > a {
  all: unset;
  box-sizing: border-box;
  font-weight: bold;
  font-size: 16px;
  line-height: 24px;
  color: #333333;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  filter: drop-shadow(0px 2px 10px rgba(0, 0, 0, 0.25));
  background: #ffffff;
  border-radius: 10px;
  cursor: pointer;
  padding: 12px;
}
/* Sağ Taraftaki küçük spanın olduğu alan */
.TopBannerRight {
  display: flex;
  justify-content: center;
  align-items: center;
}
/* Sağ Tarafta olan spanın css kodları alan */
.TopBannerRight > .right {
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
  color: #ffffff;
  text-align: center;
}

.TopBannerRight > a {
  display: none;
}

@media only screen and (max-width: 920px) {
  .InSideBanner {
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
  }
  /* Büyük Text alan */
  .TopBannerLeft > p {
    font-weight: 800;
    font-size: 18px;
    color: #ffffff;
    text-align: center;
    text-overflow: clip;
  }
  /* Button alan */
  .TopBannerLeft > a {
    display: none;
  }
  .TopBannerRight {
    width: 100%;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    flex-direction: column-reverse;
  }
  .TopBannerRight > a {
    all: unset;
    box-sizing: border-box;
    font-weight: bold;
    font-size: 12px;
    color: #333333;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    filter: drop-shadow(0px 2px 10px rgba(0, 0, 0, 0.25));
    background: #ffffff;
    border-radius: 10px;
    cursor: pointer;
    padding: 4px 8px;
  }
  .TopBannerRight > .right {
    font-weight: 500;
    font-size: 10px;
    line-height: 10px;
    color: #ffffff;
    text-align: center;
  }
}

@media only screen and (max-width: 540px) {
  .InSideBanner {
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
  }
  /* Büyük Text alan */
  .TopBannerLeft > p {
    font-weight: 800;
    font-size: 14px;
    color: #ffffff;
    text-align: center;
    text-overflow: clip;
  }
  /* Button alan */
  .TopBannerLeft > a {
    display: none;
  }
  .TopBannerRight {
    width: 100%;
    flex-direction: column-reverse;
    justify-content: center;
    gap: 6px;
    padding: 6px;
  }
  .TopBannerRight > a {
    all: unset;
    box-sizing: border-box;
    font-weight: bold;
    font-size: 12px;
    color: #333333;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    filter: drop-shadow(0px 2px 10px rgba(0, 0, 0, 0.25));
    background: #ffffff;
    border-radius: 10px;
    cursor: pointer;
    padding: 4px 6px;
  }
  .TopBannerRight > a > svg {
    width: 12px;
    height: 12px;
  }
  .TopBannerRight > .right {
    font-weight: 500;
    font-size: 9px;
    line-height: 10px;
    color: #ffffff;
    text-align: center;
  }
}

/* Menü Tasarımlarının css kodları */

@media only screen and (min-width: 1100px) {
  .MobileCollapse {
    display: none !important;
  }
  .FixCollapse{
    display: none !important;
  }
}

@media only screen and (max-width: 1100px) {
  .WebTopMenu {
    display: none !important;
  }
  .collapse {
    max-width: 265px !important;
  }
  .MobileMenuContainer {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 16px;
    padding: 20px;
  }

  .MobileMenuContainer > div > div > a {
    color: black !important;
    font-weight: 600;
  }

  a[aria-expanded="true"] > .TitleContainer > svg {
    fill: black !important;
    transform: rotate(90deg);
    transition: all 0.2s ease-in-out !important;
  }
  a[aria-expanded="false"] > .TitleContainer > svg {
    fill: black !important;
  }

  .TitleContainer {
    gap: 12px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    min-height: 35px;
  }

  .TitleContainerImage {
    width: 27px;
    height: 27px;
    object-fit: contain;
  }
}

/* Ana Sayfa Kategoriler kısmı css kodları. */

.hype-categories,
.hype-categories * {
  box-sizing: border-box;
}
.hype-categories {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
  padding: 12px;
}
@media only screen and (max-width: 540px) {
  .hype-categories {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
  }
}

.hype-categories-item {
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 400ms;
  overflow: hidden;
  border-radius: 15px;
  filter: drop-shadow(0px 2px 10px rgba(0, 0, 0, 0.15));
}

.hype-categories-item img {
  transition: all 400ms;
  border-radius: 5px;
  width: 100%;
  max-width: 100%;
}
.hype-categories-item:hover img {
  transform: scale(1.05);
}

#main .brands {
  display: flex;
  flex-direction: column;
  margin-top: 10px !important;
}
#main .brands {
  display: flex;
  flex-direction: column;
  margin-top: 10px !important;
}

#main .brands > h3 {
  display: flex;
  flex-direction: column;
  margin-bottom: 30px !important;
}

#main .brands .container .row {
  display: none !important;
}

/* Ana Sayfa Kategoriler kısmı css kodları. BİTTİ  */

/* Footer kısmı css kodları.  */
#main > .selects > h3 {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  border: 0.5px solid #b9b9b9 !important;
  box-sizing: border-box !important;
  border-radius: 5px !important;
  align-self: center !important;
  font-family: Roboto, sans-serif !important;
  font-weight: 500 !important;
  font-size: 18px !important;
  line-height: 21px !important;
  color: #005dae !important;
  padding: 8px 32px !important;
  letter-spacing: revert !important;
  margin-bottom: 30px !important;
  height: 40px !important;
  width: fit-content !important;
  margin: auto !important;
  margin-bottom: 30px !important;
}

.FooterMenuItems {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  justify-content: center;
  align-items: center;
}

.EachRow {
  display: flex;
  flex-direction: column;
  align-content: center;
  justify-content: space-around;
  align-items: baseline;
  width: 100%;
}

.EachRow > h5 {
  margin-bottom: 0px !important;
}

/* Screen larger than 0 to 375px? 2 column */
@media (max-width: 375px) {
  .FooterMenuItems {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    justify-content: center;
    align-items: start;
    justify-items: center;
    row-gap: 24px;
  }
  .EachRow {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
}

/* Screen larger than 375- 900px? 3 columns */
@media (min-width: 375px) {
  .FooterMenuItems {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    justify-content: center;
    align-items: start;
    justify-items: center;
    row-gap: 24px;
  }
}

/* Screen larger than 900px? 3 columns */
@media (min-width: 900px) {
  .FooterMenuItems {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    justify-content: center;
    align-items: start;
    justify-items: center;
    row-gap: 24px;
  }
}

/* Screen larger than 1200x? 5 columns */
@media (min-width: 1200px) {
  .FooterMenuItems {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    justify-content: center;
    align-items: start;
    justify-items: center;
    row-gap: 24px;
  }
}

footer .center .newsletter {
  width: 84%;
  height: auto;
  position: relative;
  background: none !important;
  background-color: none !important;
  padding: 30px;
  margin-top: 60px;
}

.formEBulten > .form-group {
  background-color: wheat !important;
  color: black !important;
}

.EachRow > .footer-img {
  float: none;
  margin: 0px !important;
  margin-bottom: 30px !important;
}

/* Footer kısmı css kodları. BİTTİ  */

/* Ana Sayfa Ürün Kartlarının css kodları.*/

.ProductTitleInformation {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  min-height: 100px !important;
}

.PriceContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 15px;
  flex-wrap: wrap;
}

@media (max-width:400px) {
  .PriceContainer {
  flex-direction: column;
  gap: 0px;
  height: 60px !important;
}
}


.OldPrice {
  font-weight: 700;
  text-decoration: line-through;
}
.price {
  font-weight: 700;
  color: #023ba1;
}
/* Ana Sayfa Ürün Kartlarının css kodları. BİTTİ  */

/* Story kısmı css kodları.   */

.swiper.StorySwiper {
  width: 100%;
  height: 130%;
  margin-top: 10px;
  margin-bottom: 10px !important;
  padding: 12px !important;
}
.StorySwiper > .swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 0px !important;
  left: 0;
  width: 100%;
}
.swiper-slide.SoloStorySwiper {
  text-align: center;
  font-size: 18px;
  background: #fff;

  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.ersa-story-container,
.ersa-story-container * {
  box-sizing: border-box;
}
.ersa-story-container {
  --space: 15px;
  --width: 90px;
  --bag-height: 0;
  position: relative;
  margin-top: calc(var(--bag-height));
}
.ersa-story-container .ersa-stories {
  scroll-behavior: smooth;
  display: grid;
  grid-auto-columns: var(--width);
  grid-auto-flow: column;
  gap: var(--space);
  -ms-scroll-snap-type: x mandatory;
  scroll-snap-type: x mandatory;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  width: 100%;
  padding: 10px 20px;
}
.ersa-story-container .ersa-stories-item {
  width: var(--width);
  min-width: var(--width);
  margin: 0;
  scroll-snap-align: center;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.ersa-story-container .ersa-stories-item a {
  display: block;
  text-decoration: none;
}
.ersa-story-container .ersa-stories-item-image {
  display: block;
  border-radius: 10px;
  background: #ffffff;
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  overflow: hidden;
  margin-bottom: 5px;
}
.ersa-story-container .ersa-stories-item-image img {
  max-width: 100%;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
}
.ersa-story-container .ersa-stories-item figcaption {
  font-family: Roboto, sans-serif;
  font-weight: 500;
  font-size: 11px;
  line-height: 15px;
  text-align: center;
  color: #333;
}
.ersa-story-container .ersa-stories-item:last-child:after {
  content: "";
  position: absolute;
  width: calc(var(--space) * 2);
  height: 100%;
  right: calc((var(--space) * 2) * -1);
  inline-size: calc(var(--space) * 2);
  block-size: 100%;
  inset-block-start: 0;
}
.ersa-story-container .btn {
  all: unset;
  border: none !important;
  position: absolute;
  top: 45%;
  left: 5px;
  transform: translateY(-50%);
  background: #2e2c2d !important;
  cursor: pointer;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  z-index: 1;
}
.ersa-story-container .btn svg {
  transform: translate(-2px);
}
.ersa-story-container .btn.right {
  left: revert;
  right: 5px;
}
.ersa-story-container .btn.right svg {
  transform: rotate(180deg);
}
.ersa-story-container .btn {
  display: none;
}
.ersa-stories {
  padding-inline: 0 !important;
  justify-content: center;
}

/* Story kısmı css kodları. bitti   */

/* Giriş Yap Kayıt ol kısmı css kodları.    */
.NameSurnameInputGroup {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.DayMounthYearsContainer {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 358px !important;
  margin-left: 12px !important;
}

@media (max-width: 800px) {
  .DayMounthYearsContainer {
    max-width: 100% !important;
  }
}

.DayMounthYearsContainer > .DayContainer,
.MounthContainer,
.YearContainer {
  width: 30% !important;
}

.DayMounthYearsContainer > div > select {
  width: 100% !important;
}

/* Giriş Yap Kayıt ol kısmı css kodları  Bitti  */

/* Header kısmının css kodları  Bitti  */

@media (min-width: 1200px) {
  .headerTop > .container > .searchArea {
    max-width: 580px !important;
  }
}

@media (max-width: 1200px) {
  .headerTop > .container > .searchArea {
    max-width: 100% !important;
    padding-top: 0px !important;
    padding-bottom: 20px !important;
  }
}

@media (max-width: 1100px) {
  .headerTop > .container > .searchArea {
    max-width: 90% !important;
    padding-top: 0px !important;
    margin-top: -30px !important;
    padding-bottom: 20px !important;
  }
}

/* Header kısmının css kodları  Bitti  */

/* Ürün Liste css kodları   */

/* Üst tarafta bulunan resimlerin  css kodları   */
.product-list > .pageHeader.mb50 > .hidden-xs > img {
  width: 100%;
  height: auto;
  object-fit: cover;
  margin: auto;
}

.product-list > .pageHeader.mb50 > .visible-xs > img {
  width: 100%;
  height: auto;
  object-fit: cover;
  margin: auto;
}

/* Filterlerin genel css kodları   */
form[name="productList"] > ul > li > .dropdown > a {
  background-color: var(--label-color) !important;
  padding: 0px !important;
  padding: 3px 20px !important;
  color: white !important;
  border-radius: 0px !important;
  border-radius: 9px !important;
  margin-bottom: 16px;
}
/* Tümünü listele kısmının css kodları   */
form[name="productList"] > ul > .filter-all {
  padding-left: 0px !important;
}
form[name="productList"] > ul > .filter-all > a {
  background-color: var(--label-color) !important;
  padding: 0px !important;
  padding: 3px 20px !important;
  color: white !important;
  border-radius: 0px !important;
  border-radius: 9px !important;
}

/* Sıralama kısmının css kodları   */
form[name="productList"] > ul > .order {
  padding: 0px !important;
  margin-top: 33px;
}
form[name="productList"] > ul > .order > .form-area > .form-group > div {
  background-color: var(--label-color) !important;
  padding: 0px !important;
  padding: 2px 20px !important;
  color: white !important;
  border-radius: 0px !important;
  border-radius: 9px !important;
}
form[name="productList"] > ul > .order > .form-area > .form-group > div > ul {
  border-radius: 0px !important;
}
form[name="productList"] > ul > .order > .form-area > .form-group > div::after {
  border-color: white !important;
}
form[name="productList"] > ul > .order > .form-area > .form-group > div > span {
  color: white !important;
}
form[name="productList"] > ul > .order > .form-area > .form-group > div > span {
  color: white !important;
}

/* Genel olarak filtrelerin responsive düzenlerinin css kodları   */
@media (max-width: 1100px) {
  form[name="productList"] > ul > .filter-all {
    margin-top: 10px !important;
  }

  form[name="productList"] > ul > .order {
    margin-top: 10px !important;
  }
}
@media (max-width: 600px) {
  form[name="productList"] > ul > li > .dropdown > a {
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
  }
  form[name="productList"] > ul > li > .dropdown {
    width: 100% !important;
    margin-bottom: 16px;
  }

  form[name="productList"] > ul > li > .dropdown > a {
    padding: 6px 20px !important;
  }
}

form[name="productList"] > .open-filter {
  max-width: 100% !important;
}

/* Filtrelerin genel css düzenelmeleri css kodları   */

@media (max-width: 620px) and (min-width: 600px) {
  .product-list > .filters {
    margin-top: -20px !important;
  }
}

@media (max-width: 800px) and (min-width: 768px) {
  .product-list > .filters {
    margin-top: -100px !important;
  }
}

@media (min-width: 800px) and (max-width: 1100px) {
  .product-list > .filters {
    margin-top: -75px !important;
  }
}

@media (min-width: 1100px) and (max-width: 1200px) {
  .product-list > .filters {
    margin-top: -65px !important;
  }
}

/* Ürün Liste css kodları  Bitti  */

/* Ürün Detay css kodları    */

/* Ersaya özgü durumların Düzenlemeleri  */

.DetailCargoTitle{
  margin-top: 12px;
}
.DetailCargoTitle>span{
  color: red;
  opacity: 32%;
  font-size: 12px;
  margin-top: 8px !important;
  font-size: 1.2142857143em;

}

.AboutErsaProducts {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 4px;
  max-width: 653px;
  flex-wrap: wrap;
  row-gap: 20px;
}

.AboutErsaProducts > .BoxContainer {
  box-shadow: (0px 1px 5px rgba(0, 0, 0, 0.15));
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  align-self: center;
  align-content: center;
  border-radius: 15px;
  width: 140px;
  height: 140px;
  background: #fff;
  filter: drop-shadow(0px 1px 5px rgba(0, 0, 0, 0.15));
}
.AboutErsaProducts > .BoxContainer > .MainBox {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100%;
  height: 100%;
  padding: 16px 12px;
}
.AboutErsaProducts > .BoxContainer > .MainBox > .icon {
  width: 100%;
  height: 100%;
}
.AboutErsaProducts > .BoxContainer > .MainBox > .text {
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: 600;
  margin: 0px !important;
  line-height: 20px !important;
}
.AboutErsaProducts > .BoxContainer > .MainBox {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100%;
  height: 100%;
}
.AboutErsaProducts > .BoxContainer:hover > .HoverBox {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.AboutErsaProducts > .BoxContainer:hover > .MainBox {
  display: none;
}
.AboutErsaProducts > .BoxContainer > .HoverBox {
  position: absolute;
  top: 0;
  left: 0;
  background-color: white;
  display: none;
  text-align: center;
  width: 100%;
  height: 100%;
  border-radius: 15px;
  margin: auto;
}
.AboutErsaProducts > .BoxContainer:hover > .HoverBox > span {
  font-size: 13px !important;
  text-align: center !important;
  padding: 4px !important;
}

/* Ersaya özgü durumların Düzenlemeleri Bitti  */

/* Ürün Sayısı ve Sepete Ekle Css Düzenlemeleri  */
.SizeAndAddBasket {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  align-content: center;
}
.SizeAndAddBasket > .buyProduct {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background: #06a77d !important;
  border-radius: 10px !important;
  gap: 20px !important;
  font-family: "Roboto", sans-serif !important;
  font-style: normal !important;
  font-weight: 500 !important;
  font-size: 24px !important;
  line-height: 28px !important;
  color: #f5f5f5 !important;
  height: 45px !important;
  flex: 1;
  width: 50%;
  max-width: 306px;
  outline: none;
  margin-bottom: 0px !important;
}
.SizeAndAddBasket > .buyProduct:hover {
  border: noen !important;
}
.SizeAndAddBasket > .pieceBox {
  border: 2px solid #dddddd !important;
  border-radius: 10px !important;
  background: #fff !important;
  padding: 0 !important;
  height: 45px !important;
  display: flex !important;
  flex-direction: row !important;
}
.SizeAndAddBasket > .pieceBox > * {
  height: 100%;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  float: revert !important;
  width: 45px !important;
}
.SizeAndAddBasket > .pieceBox > span {
  background: #f5f5f5 !important;
  width: 45px !important;
}

/* Ürün Sayısı ve Sepete Ekle Css Düzenlemeleri bitti */

/* Erşeltirilmiş ürünlerin Css Düzenlemeleri  */
.ersa-product-color-variant {
  padding-bottom: 40px !important;
}
.ersa-product-color-variant-solo > a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 12px;
  text-align: center;
}
.ersa-product-color-variant-solo > a > img {
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  max-width: 70px;
}
.ProductVariantSlider {
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
}
.ProductVariantSlider > div:nth-child(2) {
  margin-top: 20px;
  margin-left: 15px;
}
.swiper-button-next,
.swiper-button-prev {
  all: unset !important;
  display: block !important;
  position: relative !important;
  --swiper-navigation-size: 28px !important;
  margin-top: -20px !important;
}
.swiper-button-next::after,
.swiper-button-prev::after {
  --swiper-navigation-size: 28px !important;
}

#main .product-detail .image-area .image-box {
  display: flex !important;
  position: relative;
  height: auto;
  border: 1px solid #e8e8e8;
  margin-bottom: 30px;
  border-radius: 0;
  height: 620px !important;
  justify-content: center;
  align-items: center;
  max-width: 560px;
}

/* Erşeltirilmiş ürünlerin Css Düzenlemeleri bitti */

/* Taksit Tablosu Css Düzenlemeleri */

.HireTable > tbody > .tableImage > tr > td {

  width: 100%;
}

.TablesContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 20px;
  column-gap: 5px;
  padding: 12px;
  width: 100%;
  align-content: center;
}

.TablesContainer > .EachTable {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
  width: 370px;
  height: 230px;
  align-items: center;
  border-radius: 5px;
}

.TablesContainer > .EachTable > .ImageContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 60px;
}

.TablesContainer > .EachTable > table > tbody > .TableTitle > th {
  padding: 12px;
  text-align: center;
}
.TablesContainer > .EachTable > table > tbody > .TableContent > td {
  padding: 12px;
  text-align: center;
}

.TablesContainer > .EachTable > table > tbody > .TableTitle {
  border-bottom: 1px solid gray;
}

.TablesContainer > .EachTable > table > tbody > .TableContent:not(:last-child) {
  border-bottom: 1px solid gray;
}

/* Taksit Tablosu Css Düzenlemeleri Bitti */

/* Ürün Detay alanının Düzenlemeleri  */

.fiyati-dusunce-haber-ver,
.fiyati-dusunce-haber-ver * {
  box-sizing: border-box;
}
.fiyati-dusunce-haber-ver {
  display: flex;
  align-items: center;
  justify-content: center;
}
.fiyati-dusunce-haber-ver-btn {
  all: unset;
  border: 1.5px solid #045eae !important;
  border-radius: 5px !important;
  padding: 5px;
  font-family: Roboto, sans-serif !important;
  font-weight: bold !important;
  font-size: 14px !important;
  line-height: 16px !important;
  color: #045eae !important;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
.fiyati-dusunce-haber-ver-btn svg:first-child {
  margin-left: 7px;
}
.fiyati-dusunce-haber-ver-btn span {
  margin: 0 10px;
}
.hangi-magazada-var-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 42px;
  border: 2px solid #dddddd;
  border-radius: 5px;
  padding: 12px 40px;
  cursor: pointer;
  background: transparent;
  white-space: nowrap;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: #333333;
}
.InStockArea{
  width: 100%;
}
.when-it-in-stock {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 42px;
  border: 2px solid #dddddd;
  border-radius: 10px;
  padding: 12px 40px;
  cursor: pointer;
  background: transparent;
  white-space: nowrap;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: #333333;
  width: 100% !important;
}
.PriceAreaContainer {
  display: flex;
  flex-direction: column;
  gap: 23px;
  width: 100% !important;
}
.PriceAreaContainer >.price-area {
  display: flex !important;
  align-content: space-between !important;
  justify-content: space-between !important;
  align-items: stretch !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  width: 100% !important;
}

.PriceAreaContainer > .Price-modals {
  display: flex !important;
  align-content: space-between !important;
  justify-content: space-between !important;
  align-items: stretch !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
}
.PriceAreaContainer > .price-area > .price {
  display: inline-block;
  font-size: 1.9285714286em;
  font-weight: 700;
  padding: 16px 0;
  float: none !important;
  margin-right: 30px;
  color: #1f5ea9 !important;
  font-size: 32px !important;
}

.PriceAreaContainer>.price-area >.pricesContainer{
  width: 100% !important;
}
.PriceAreaContainer>.price-area >.ProductStatusContainer{
    width: 100% !important;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-end;
}

.NearBottonStock {
  display: flex !important;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  align-content: center;
  color: green;
  gap: 4px;
}
.NearBottonStock>.Text {
  font-size: 14px;
}
.PriceAreaContainerNoStock > .price-area > .stocknone {
  display: flex !important;
  background: red;
  padding: 8px 22px;
  border-radius: 5px;
  color: #fff;
  font-size: 18px;
  margin: 28px 0;
  align-content: center;
  justify-content: center;
  align-items: center;
  width: 100% !important;
}
.PriceAreaContainerNoStock>.Price-modals{
    display: flex ;
    align-content: space-between ;
    justify-content: space-around ;
    align-items: stretch ;
    flex-direction: row ;
    flex-wrap: nowrap ;
    width: 100% !important;
}


.ProductInformationArea {
  display: flex;
  flex-direction: column;
}

.ProductDetailSlider {
  margin: auto !important;
}

@media (max-width: 1100px) {
  .ProductInformationArea > form > .PriceAreaContainer {
    display: flex !important;
    flex-direction: column !important;
  }
  .ProductInformationArea > form > .PriceAreaContainer > .price-area {
    display: none !important;
  }
  .ProductInformationArea > form > .PriceAreaContainer > .Price-modals {
    display: flex !important;
    flex-direction: column !important;
    gap: 23px;
    padding: 0px 12px;
  }
  .ProductInformationArea
    > form
    > .PriceAreaContainer
    > .Price-modals
    > .fiyati-dusunce-haber-ver-btn {
    max-height: 42px !important;
    height: 39px !important;
    padding: 0px 5px !important;
    border-radius: 5px !important;
  }
  .ProductInformationArea
    > form
    > .PriceAreaContainer
    > .Price-modals
    > .hangi-magazada-var-btn {
    max-height: 42px !important;
    height: 42px !important;
    border-radius: 10px !important;
  }
  .SizeAndAddBasket {
    display: none !important;
  }
  .PriceAreaContainer + br,
  .SizeAndAddBasket + br {
    display: none !important;
  }
  .PriceAreaWrapper {
    display: none !important;
  }

  /* Stockta yoksa olacak olan ekranın css kodları*/
  .ProductInformationArea > .PriceAreaContainerNoStock {
    display: flex !important;
    flex-direction: column !important;
  }
   .ProductInformationArea > .PriceAreaContainerNoStock > .price-area {
    display: none !important;
  }
  .ProductInformationArea>.PriceAreaContainerNoStock>.Price-modals{
    display: flex !important;
    flex-direction: column !important;
    gap: 23px;
    padding: 0px 12px;
    align-items: stretch !important;
  }
  .ProductInformationArea>.PriceAreaContainerNoStock>.Price-modals>button:first-child{
    height: 30px !important;
  }
  .NoStockBottomBanner{
    display: flex;
    justify-content: space-around;
    align-items: center;
    align-content: center;
    flex-direction: row;
    width: 100%;
  }
  .NoStockBottomBanner>.stocknone{
    width: 90% !important;
    border-radius: 5px !important;
    text-align: center;
    font-size: 16px;
  }
}

@media (max-width: 540px) {
  .DetailPageProductTitle {
    padding: 0px 5px;
  }
  .DetailPageProductTitle + .features {
    padding: 0px 5px;
  }
  .AboutErsaProducts {
    flex-wrap: wrap;
    justify-content: space-around !important;
  }
  .PriceAreaWrapper {
    display: none !important;
  }
}

@media (max-width: 540px) {
  .ProductDetailSliderImage {
    max-height: 300px;
    height: 100% !important;
    width: auto;
    object-fit: contain;
  }
  #main .product-detail .image-area .image-box img {
    width: 100% !important;
    max-height: 300px !important;
    object-fit: contain !important;
  }
}

.SpecialtyFix {
  margin-bottom: 70px !important;
}

.discountContainer {
  margin: 0px !important;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
  height: 52px;
}
.discountContainer > span {
  margin: 0px !important;
}
.AddbasketBtn {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-content: center;
  align-items: center;
  gap: 10px;
}

#modalStokBilgi .stokTitle,
#modalFiyatBilgi .stokTitle {
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 16px !important;
  text-align: center;
  color: #045eae !important;
  margin-bottom: 10px !important;
}
#modalStokBilgi p.alert-msg,
#modalFiyatBilgi p.alert-msg {
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  text-align: center;
  color: #000;
  margin-bottom: 16px !important;
  line-height: 16px;
}
#modalStokBilgi input[name="prodMail"],
#modalFiyatBilgi input[name="prodPrMail"] {
  border: 2px solid #045eae !important;
  border-radius: 15px;
  text-align: center;
  width: 100%;
  margin: 0 auto;
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  color: #c0bfc0;
  height: 42px !important;
}
#modalStokBilgi input[name="prodMail"]::placeholder,
#modalFiyatBilgi input[name="prodPrMail"]::placeholder {
  color: #c0bfc0;
}
#modalStokBilgi .btnStokBilgi,
#modalFiyatBilgi .btnFiyatBilgi {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 5px;
  background: #045eae !important;
  border: 2px solid #045eae !important;
  border-radius: 15px !important;
  margin: 0 auto;
  color: #ffffff !important;
  width: 145px;
  height: 30px;
  box-sizing: border-box;
  padding: 0px !important;
  margin-bottom: 30px;
}
#modalStokBilgi .form-area .form-group:not(:last-child),
#modalFiyatBilgi .form-area .form-group:not(:last-child) {
  margin-bottom: 16px !important;
}
#modalStokBilgi .modal-body .text-center,
#modalHangiMağaza
  .modal-body
  .text-center
  #modalFiyatBilgi
  .modal-body
  .text-center {
  color: #045eae !important;
  margin-bottom: 0px !important;
}
#modalStokBilgi .close,
#modalHangiMağaza .close,
#modalFiyatBilgi .close {
  opacity: 1 !important;
  color: #045eae !important;
  position: absolute;
  top: 10px;
  right: 15px;
}
.HangiMagazaModalBody {
  margin-top: 10px;
  width: 95%;
  padding: 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.HangiMagazaModalBody > h3 {
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  text-align: center;
  color: #045eae;
  margin-bottom: 10px;
}
.HangiMagazaModalBody > span {
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  text-align: start;
  color: #000;
  margin-bottom: 16px !important;
  line-height: 16px;
}
.HangiMagazaModalBody > table {
  margin-top: 30px;
}
.HangiMagazaModalBody > table > thead > tr > th {
  padding: 5px;
  text-align: center;
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 700;
}
.HangiMagazaModalBody > table > tbody > tr > th {
  padding: 5px;
  text-align: center;
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 500;
}
.ModalPhoneInfo {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  align-content: center;
  gap: 10px;
}

/* Ürün Detaya sayfasının alt kısımında bulunan özelliklerin olduğu alan  */

.PropertyList {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 30px;
}
@media (max-width:540px) {
 .PropertyList {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
} 
.PropertyList > .EachProperty {
  height: 90px !important;
}
.PropertyList > .EachProperty>span>img {
  height: 40px !important;
  width: auto !important;
  object-fit: contain !important;
}
.PropertyList > .EachProperty>span:last-child {
font-size: 13px !important;
}
}

.PropertyList > .EachProperty {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 110px;
  width: 100%;
  height: 130px;
  border: 2px solid #e8e8e8;
  border-radius: 5px;
  padding-top: 5px;
}
.PropertyList > .EachProperty>span>img {
 max-width: 80px !important;
 height: auto;
}


.PropertyList > .EachProperty > span {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.PropertyList > .EachProperty > span > img {
}

/* Ürün Detaya sayfasının alt kısımında bulunan özelliklerin olduğu alan Bitti  */

/* Ürün Detay Alanı Düzenlemeleri Bitti  */

/* Sepet CSS kodları    */

.SetListOrder {
  display: flex;
  flex-direction: column;
}
.firsatlar-container {
  order: 1;
}
.ProductCardList {
  order: 0;
}
.MobileModal {
  display: none;
}
.DesktopModal {
  display: block;
  margin-top: 30px;
  width: 100%;
}
.MobileBasket {
  display: none !important;
}
.PageTitle {
  display: block !important;
}

.IndirimBox{
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-start;
  align-items: flex-start;
  align-content: flex-start;
  align-self: flex-start;
  gap: 4px;
}

.SepetteIndırım>b{
  color: red !important;
  font-size: 8px;
}
.SepetteIndırım{
 font-size: 10px !important;
}
.IndirimBox>.bask-new-price{
  color: var(--label-color) !important;
  font-size: 16px !important;
}
.DesktopBasket2{
  display: flex;
}

@media (max-width: 540px) {
  .firsatlar-container {
    order: 0;
  }
  .ProductCardList {
    order: 1;
  }

  .MobileModal {
    background: #ffffff !important;
    border: 2px solid #005dae !important;
    border-radius: unset !important;
    padding: 1px 12px !important;
    font-family: Roboto, sans-serif !important;
    font-style: normal !important;
    font-weight: bold !important;
    font-size: 14px !important;
    line-height: 16px !important;
    color: #333 !important;
    display: flex !important;
    justify-content: space-around;
    gap: 14px;
    align-items: center;
    width: 100%;
    height: 40px;
  }
  .DesktopModal {
    display: none;
  }
  .MobileBasket {
    display: block !important;
  }
  .MobileBasket2{
    display: flex !important;
  }
  .DesktopBasket2{
    display: none;
  }
  .PageTitle {
    display: none !important;
  }
  .firsatlar-container {
    margin-top: -10px !important;
    margin-bottom: 30px !important;
  }
  .ProductCard {
  }
 
}

.firsatlar-container,
.firsatlar-container * {
  box-sizing: border-box;
}
.firsatlar-container {
  margin-top: 30px;
  margin-bottom: 40px;
  display: flex;
  gap: 8px;
  background: #fff;
}
.colorSelect + .firsatlar-container {
  border-top: 1px solid #e8e8e8;
}
.firsatlar-container > .firsat-item {
  width: 105px;
  padding: 10px 5px;
  border-radius: 10px;
  border: 1.5px solid #005dae;
  display: grid;
  grid-template-rows: 1fr 0.8fr;
  overflow: hidden;
  background: #fff;
  filter: drop-shadow(0px 1px 5px rgba(0, 0, 0, 0.15));
  cursor: pointer;
}
.firsatlar-container > .firsat-item .icon {
  display: grid;
  place-items: center;
  background: #fff;
}
@supports not (aspect-ratio: auto) {
  .firsatlar-container > .firsat-item .icon {
    min-height: 50px;
  }
}
.firsatlar-container > .firsat-item .text {
  display: grid;
  place-items: center;
  font-family: Roboto, sans-serif !important;
  font-weight: bold !important;
  font-size: 10px !important;
  text-align: center !important;
  color: #333;
  margin-top: 5px;
}
@media (max-width: 355px) {
  .firsatlar-container > .firsat-item .text {
    font-size: 8px !important;
  }
}
.firsatlar-container > .firsat-item .text p {
  padding: 0 !important;
  margin: 0 !important;
  line-height: revert !important;
}
@media (min-width: 355px) and (max-width: 378px) {
  .firsatlar-container > .firsat-item .text p {
    font-size: 9px !important;
  }
}

.ProductCardList {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin-bottom: 35px;
}
.SummaryDesktop {
  margin-bottom: 40px;
}

.ProductCard {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 30px 15px;
  position: relative;
  background: #ffffff;
  border: 1px solid #dddddd;
  box-shadow: 0 2px 10px #0000001a;
  border-radius: 6px;
  margin-inline: 10px;
  width: 100%;
}
.ProductCard > .product-image > a > img {
  width: 100px;
  height: 100px;
  object-fit: contain;
}
.ProductCard > .ProductNameAndPrice {
  display: flex;
  flex-direction: column;
  max-width: 330px;
}
.ProductCard > .PriceContainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap: 0px;
}
.ProductCard > .PriceContainer > span {
  all: unset !important;
  font-size: 16px !important;
}
.ProductCard > .PriceContainer > strong {
  all: unset !important;
  font-size: 16px !important;
  color: var(--label-color) !important;
}
.ProductCard > .ProductNameAndPrice > .ProductName {
  all: unset;
  font-size: 16px;
}
.ProductCard > .ProductNameAndPrice > .ProductPriceContainer {
  display: flex;
  flex-direction: column;
}
.ProductCard > .ProductNameAndPrice > .ProductPriceContainer > .bask-old-price {
  color: red !important;
  font-size: 14px !important;
}
.ProductCard > .ProductNameAndPrice > .ProductPriceContainer > .bask-new-price {
  color: var(--label-color) !important;
  font-size: 16px !important;
}
.DeleteButton > a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: red;
  color: white !important;
  width: 20px;
  height: 20px;
  border-radius: 100%;
  font-size: 16px;
}
.ProductCard > .ProductSizeButton > .pieceBox {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  gap: 10px;
  width: 100px;
  height: 100px;
  border-radius: 5px;
}
.ProductCard > .ProductSizeButton > .pieceBox > .sour,
.plus {
  font-size: 24px;
  text-align: center;
}
.ProductCard > .ProductSizeButton > .pieceBox > .sour,
.plus > span {
  font-size: 24px;
}
.ProductCard > .ProductSizeButton > .pieceBox > span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  align-content: center;
  font-size: 20px;
}
.ProductCard > .ProductSizeButton {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  align-content: center;
}
.MobileProductInfo {
  display: none;
}
.ProductCard > .product-image {
  position: relative;
}
.ProductCard > .product-image > .badge {
  position: absolute;
  top: 0;
  left: 0;
  background-color: red !important;
}
.DeleteButton {
  position: absolute;
  top: 4px;
  right: 4px;
}

.MobileBasket {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  display: grid;
  grid-template-rows: 30px 100px;
  z-index: 9999;
}
.MobileBasket .top-banner {
  background: #52b69a;
  box-shadow: 2px 2px 10px #0000001a;
  display: flex;
  justify-content: space-around;
  padding-left: 26px;
  padding-right: 26px;
  align-items: center;
  font-family: Roboto, sans-serif !important;
  font-weight: bold;
  font-size: 14px;
  line-height: 16px;
  color: #fff;
  height: 30px !important;
}
.MobileBasket .bottom-banner {
  background: #fff;
  box-shadow: 2px 2px 10px #0000001a;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  padding: 14px;
  align-items: center;
  border: 1px solid #dddddd;
}
.MobileBasket .bottom-banner .btn-next-step {
  background: #005dae;
  box-shadow: 2px 2px 10px #00000026;
  border-radius: 5px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: Roboto, sans-serif !important;
  font-weight: bold;
  font-size: 16px;
  line-height: 19px;
  color: #fff;
  gap: 5px;
  width: 100%;
  height: 40px;
  padding-right: 30px;
  padding-left: 30px;
}

.MobileBasket2 {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 9999;
  background-color: white;
  height: 40px !important;
  padding: 30px 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  align-items: center;
  border:- 1px solid var(--label-color ) !important;
  display: none;
}
.MobileBasket2>.MobileBasketBtn{
 background: #005dae;
    box-shadow: 2px 2px 10px #00000026;
    border-radius: 5px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: Roboto, sans-serif !important;
    font-weight: bold;
    font-size: 16px;
    line-height: 19px;
    color: #fff;
    gap: 5px;
    width: 100%;
    height: 40px;
    padding-right: 30px;
    padding-left: 30px;
    border: none !important;
    outline: none !important;

}

.basketSaleInfoDetail{
  display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-content: center;
    text-align: center;
    gap: 9px;
    border: 1px solid var(--label-color) !important;
}
.basketSaleInfoDetail>p{
  color: red !important;
}
.MobileBottomDetailsArea{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  align-content: center;
  align-self: center;
}

@media (max-width: 376px) {
  .MobileBasket .bottom-banner .btn-next-step {
    font-size: 14px;
  }

}
.MobileBasket .bottom-banner .total-area {
  display: flex;
  padding-right: 12px;
  padding-left: 12px;
  width: 100%;
  font-family: Roboto, sans-serif !important;
  font-weight: bold;
  font-size: 16px;
  line-height: 19px;
  color: #333;
  justify-content: space-around;
  margin-bottom: 12px;
}

@media (min-width: 100px) and (max-width: 540px) {
  .MobileProductInfo {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-content: center;
  }
  .ProductCard > .ProductNameAndPrice {
    display: none;
  }
  .ProductCard > .PriceContainer {
    display: none;
  }
  .MobileProductInfo {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    gap: 6px;
  }
  .MobileProductInfo > .ProductNameAndPrice {
    all: unset;
    font-size: 12px !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
  }
  .MobileProductInfo > .PriceContainer {
    display: flex;
    flex-direction: column;
    gap: 0;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    flex-wrap: nowrap !important;
  }
  .MobileProductInfo > .PriceContainer > span {
    display: none;
  }
   .MobileProductInfo > .PriceContainer > .bask-old-price {
   font-size: 12px !important;
   color: red !important;
  }
  .MobileProductInfo > .PriceContainer > strong {
    font-size: 15px !important;
    font-weight: 800;
    color: var(--label-color) !important;
  }
  .ProductCard > .product-image > a > img {
    width: 100px;
    height: 100px;
    object-fit: contain;
  }

  .ProductCard > .ProductSizeButton > .pieceBox > .sour,
  .plus {
    font-size: 20px !important;
  }
  .ProductCard > .ProductSizeButton > .pieceBox > .sour,
  .plus > span {
    font-size: 20px !important;
  }

  .DeleteButton > a {
    width: 18px;
    height: 18px;
    font-size: 14px !important;
  }
  .ProductCard > .ProductSizeButton > .pieceBox {
    gap: 5px;
    width: 60px;
    height: 60px;
  }
  .SummaryDesktop {
    display: none !important;
  }
  .MobileSummaryBox {
    display: flex !important;
  }
  .SummaryBoxContainer {
    padding: 20px;
  }
   .IndirimBox{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap !important;
  }
  .bask-new-price{
    color: var(--label-color) !important;
    font-size: 16px !important;
  }


}

@media (min-width: 540px) and (max-width: 1100px) {
  .MobileSummaryBox {
    display: none !important;
  }
  .summaryBox {
    display: block !important;
  }
  .ProductCard > .product-image > a > img {
    width: 80px;
    height: 80px;
  }
  .ProductCard > .PriceContainer > span {
    font-size: 12px !important;
  }
  .ProductCard > .PriceContainer > strong {
    font-size: 16px !important;
    font-weight: 800;
  }
  .ProductCard > .ProductNameAndPrice > .ProductName {
    font-size: 14px;
    max-width: 150px !important;
  }
  .ProductCard > .ProductNameAndPrice > .ProductPriceContainer {
    display: flex;
    flex-direction: column;
  }
  .ProductCard
    > .ProductNameAndPrice
    > .ProductPriceContainer
    > .bask-old-price {
    font-size: 12px !important;
  }
  .ProductCard
    > .ProductNameAndPrice
    > .ProductPriceContainer
    > .bask-new-price {
    font-size: 15px !important;
  }
  .ProductCard > .ProductSizeButton > .pieceBox {
    gap: 5px;
    width: 80px;
    height: 80px;
  }
  .ProductCard > .ProductSizeButton > .pieceBox > .sour,
  .plus {
    font-size: 24px;
  }
  .ProductCard > .ProductSizeButton > .pieceBox > .sour,
  .plus > span {
    font-size: 20px;
  }
  .ProductCard > .ProductSizeButton > .pieceBox > span {
    font-size: 18px;
  }
  .MobileProductInfo {
    display: none;
  }
}

/* Sepet CSS kodları  Bitti  */

/* Kullanıcı bilgilerinin olduğu alanın CSS kodları   */

.UserInfoContainer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 23px;
}
.UserInfoContainer > .form-box {
  width: 100% !important;
}
form[name="UserUpdate"] > .form-area {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap: 10px;
}
form[name="UserUpdate"] > .form-area > .form-group {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap: 0;
}
form[name="UserUpdate"] > .form-area > .form-group > .row > label {
  margin-bottom: 12px !important;
  line-height: 0px !important;
}
form[name="UserUpdate"] > .form-area > .form-group > .row {
  width: 100%;
  max-width: 430px;
}
form[name="UserUpdate"] > .form-area > .form-group > .row {
  width: 100%;
  max-width: 430px;
}
.CenterButton > .row {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
form[name="UserUpdate"] > .form-area > .form-group > .row > input {
  height: 40px !important;
  border-radius: 5px !important;
}
form[name="UserUpdate"] > .form-area > .form-group > .row > select {
  height: 40px !important;
  border-radius: 10px !important;
}
/* Kullanıcı bilgilerinin olduğu alanın CSS kodları  Bitti  */

/* Adres bilgilerinin olduğu alanın CSS kodları   */

.AdresBox {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 20px;
  justify-content: center;
  align-items: center;
  align-content: center;
  max-width: 1200px;
  margin: auto;
  border: 1px solid var(--border-color);
  padding: auto;
  margin-bottom: 30px;
}

.AdresListContaner {
  width: 100%;
  margin-top: 50px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  gap: 40px;
  align-items: stretch;
  margin-bottom: 30px;
}

.AdresListContaner > .AddressContainer {
  width: 232px !important;
  border-radius: 5px;
  border: 2px solid var(--border-color);

}
.AdresListContaner > .AddressContainer > .AddressHeader {
  height: 46px;
  background-color: #f8f8f8;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
  border: 1px solid var(--border-color);
  border-bottom: 0px;
}
.AdresListContaner > .AddressContainer > .AddressBody {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  align-content: flex-start;
  gap: 12px;
  height: 100%;
  padding: 10px;

  position: relative;
}
.AdresListContaner > .AddressContainer > .AddressBody > span {
  font-size: 14px;
  display: flex;
  flex-direction: column;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.AdresBox > .AdresListContaner > .AddressContainer > .AddressBody > span > b {
  all: unset !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}

@media (min-width: 1200px) {
  .AdresListContaner {
    width: 100%;
    margin-top: 50px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 40px;
    align-items: stretch;
  }
}

@media (max-width: 540px) {
  .AdresListContaner > .AddressContainer {
    width: 100% !important;
    border: 1px solid var(--border-color);
    border-radius: 5px;
  }
  
  .OrderAdresListContaner>.addressListBox>.AddressContainer>.AddressBody>span{
    max-width: 100% !important;
  }
}

form[name="UserNewAddress"] > .form-area > .form-group > input {
  width: 100%;
  height: 40px !important;
  border-radius: 5px !important;
}
form[name="UserNewAddress"] > .form-area > .form-group > select {
  width: 100%;
  height: 40px !important;
  border-radius: 5px !important;
}
form[name="UserNewAddress"] > .form-area > .form-group > label {
  color: #0c0c0c;
  font-size: 1.0714285714em;
  font-weight: 600;
}
form[name="UserNewAddress"] > .NewAdressBtnContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 20px;
}

@media (max-width: 540px) {
  .NewAdressBtnContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 20px;
  }
  .NewAdressBtnContainer > * {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100% !important;
  }
  .NewAdressBtnContainer > div {
    width: 100% !important;
  }
  .NewAdressBtnContainer > div > button {
    width: 100% !important;
  }
}

/* Adres bilgilerinin olduğu alanın CSS kodları Bitti   */

/* Kullanıcı bilgilerinin olduğu alanın CSS kodları  Bitti */

/* Kullanıcının Sipariş oluşturduğu  CSS kodları */

.OrderAdresListContaner {
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;

}
@media (min-width: 1200px) {
  .OrderAdresListContaner {
    justify-content: flex-start;
  }
}

@media (max-width: 540px) {
  .OrderAdresListContaner > .AddressContainer {
    width: 100% !important;
    border: 1px solid var(--border-color);
    border-radius: 5px;
  }
}
.OrderAdresListContaner > .addressListBox > .AddressContainer {
  border-radius: 5px;
  position: relative;
  height: 100%;
  height: fit-content !important;
}
.OrderAdresListContaner > .addressListBox > .AddressContainer > .AddressHeader {
  height: 46px;
  background-color: #f8f8f8;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  align-content: center;
  border: 1px solid var(--border-color) !important;
  border-bottom: none !important;
}
.OrderAdresListContaner > .addressListBox > .AddressContainer > .AddressHeader>.AddressHeaderTitle {
  width: 100% !important;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  align-content: center;
}
.OrderAdresListContaner > .addressListBox > .AddressContainer > .AddressBody {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  align-content: flex-start;
  gap: 12px;
  height: 100%;
  padding: 10px;
  border: 1px solid var(--border-color) !important;
}
.OrderAdresListContaner
  > .addressListBox
  > .AddressContainer
  > .AddressBody
  > span {
  font-size: 13px;
  display: flex;
  flex-direction: column;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.AdresBox
  > .OrderAdresListContaner
  > .addressListBox
  > .AddressContainer
  > .AddressBody
  > span
  > b {
  all: unset !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}
.addressListBox.addressActive > .AddressContainer > .AddressHeader {
  background-color: green !important;
  color: white !important;
}
.addressListBox.addressActive > .AddressContainer > .AddressBody {
  color: black !important;
}
.addressListBox {
  border: none !important;
}
.addressListBox.addressActive {
  border: none !important;
}
.AddresDesktop {
  border: none !important;
}
.AddresDesktop.addressActive {
  border: none !important;
}

.addressListBox > .AddAddress > .AddressContainer {
  min-height: 200px;
}

.AddressContainerWithTitle {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.OrderAdresListContaner>.addressListBox{
  max-width: none !important;
  width: 100% !important;
  height: fit-content !important;
}

.OrderAdresListContaner > .addressListBox > a > .AddressContainer {
  border: 1px solid var(--border-color);
  border-radius: 5px;
  position: relative;
  height: 100%;
}
.OrderAdresListContaner
  > .addressListBox
  > a
  > .AddressContainer
  > .AddressHeader {
  height: 46px;
  background-color: #f8f8f8;
  border-bottom: 1px solid var(--border-color);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
}
.OrderAdresListContaner
  > .addressListBox
  > a
  > .AddressContainer
  > .AddressBody {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
  height: 100%;
}
.OrderAdresListContaner
  > .addressListBox
  > a
  > .AddressContainer
  > .AddressBody
  > i {
  margin-top: -50px;
}

.AddresDesktop{
  display: flex;
  border: none !important;
}
.AddresMobile{
  display: none;
    border: none !important;
    }

@media (max-width: 768px) {
  .OrderAdresListContaner > .addressListBox > a > .AddressContainer {
    width: 232px !important;
    border: 1px solid var(--border-color);
    border-radius: 5px;
    position: relative;
    height: 100%;
  }
  .OrderAdresListContaner
    > .addressListBox
    > a
    > .AddressContainer
    > .AddressHeader {
    height: 46px;
    background-color: #f8f8f8;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-content: center;
  }
  .OrderAdresListContaner
    > .addressListBox
    > a
    > .AddressContainer
    > .AddressBody {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-content: center;
    height: 100%;
  }
  .OrderAdresListContaner
    > .addressListBox
    > a
    > .AddressContainer
    > .AddressBody
    > i {
    margin-top: -50px;
  }
 
}

@media (max-width: 540px) {
  .OrderAdresListContaner > .addressListBox {
    width: 100% !important;
  }
  .OrderAdresListContaner > .addressListBox > .AddressContainer {
    width: 100% !important;
  }
  .OrderAdresListContaner > .addressListBox > .AddAddress {
    width: 100% !important;
  }
  .OrderAdresListContaner > .addressListBox > .AddAddress > .AddressContainer {
    width: 100% !important;
  }
   .AddresDesktop{
    display: none;
  }
  .AddresMobile{
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    align-content: center;
  }
  .AddresMobile>a{
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    align-content: center;
    width: 100% !important;
    background-color: #4a5f75e0 !important;
    gap: 8px;
    align-items: center;
    align-content: center;
    justify-content: center;
    text-align: center;
  }
  .FullWidthButton{
    width: 100% !important;
  }
}

.AddressTitle2,
.AddressTitle {
  padding-left: 24px;
}

.address-box {
  margin: 0px !important;
}

/* Kullanıcının Sipariş oluşturduğu  CSS kodları  Bitti */

/* Ödeme Adımlarının olduğu alanın içinde bulunan input alanının CSS kodları */

.wapp-float.socialobj {
  width: 40px !important;
  height: 40px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  align-content: center !important;
  align-self: center !important;
  bottom: 60px !important;
  left: 3px !important;
}

.giftDiv {
  margin-bottom: 20px !important;
}


.SozlesmeFormContainer{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  align-content: center;
  width: 100%;
}
.SozlesmeContainer{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap: 20px;
  width: 100% !important;
}

.SozlesmeContainer>label{
  all: unset !important;
}

.SozlesmeContainer>input[type=checkbox]{
  margin: 0px !important;
  padding: 4px !important;
}

.giftPackInput {
  border-radius: 5px !important;
}
/* Ödeme Adımlarının olduğu alanın içinde bulunan input alanının CSS kodları  Bitti */

/* Ödeme Adımlarının hediye paketi seçim alanının CSS kodları */
.GiftwrapContainer {
  width: 100%;
  display: flex !important;
  flex-direction: row;
  justify-content: space-around;
  flex-wrap: wrap;
}
.GiftwrapContainer > .Giftwrap {
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.GiftwrapContainer > .Giftwrap > .SliderContainer {
  max-width: 100px;
}
.swiper {
  width: 100%;
  height: 100%;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;

  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.swiper.GiftSwiper.ersa-GiftSwiper-container {
  min-height: 130px !important;
  max-width: 130px !important;
}

.GiftInputContainer {
  border-radius: 5px !important;
  max-height: 1292px !important;
  resize: none;
}

/* Ödeme Adımlarının hediye paketi seçim alanının CSS kodları */

.hype-payment-detail-info,
.hype-payment-detail-info * {
  box-sizing: border-box !important;
}
.hype-payment-detail-info {
  display: flex;
  width: 100%;
  margin: 0 auto;
  flex-direction: row;
  justify-content: center;
  align-content: center;
  align-items: center;
  border-radius: 6px;
  gap: 10px;
  height: 40px;
}

@media (max-width: 400px) {
  
  .hype-payment-detail-info-text {
    font-size: 12px;
  }
}
.hype-payment-detail-info-text {
  font-family: Roboto, sans-serif !important;
  font-weight: 500;
  font-size: 14px;
  line-height: 14px;
  color: #005ca9;
}

.guvenli-banner {
  width: 100%;
  margin-bottom: 20px;
}
.guvenli-banner > img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.BankInfoContainer {
  background: #fbfcfd;
  border: 1px solid #d0dcec;
  border-radius: 5px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 20px;
  padding: 20px;
}

.BankInfoContainer > .EachBankInfo {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.BankInfoContainer > .EachBankInfo > strong {
  font-weight: 700px !important;
  font-size: 14px;
}
.BankInfoContainer > .EachBankInfo > span {
  font-weight: 400px;
  font-size: 12px;
}

.CardSelect{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  gap: 30px;
  border-radius: 5px !important;
  width: 100% !important;
}

.CardSelect>ul{
  border-radius: 5px !important;
}

.CardInput{
  height: 40px !important;
  border-radius: 5px !important;
}
.TaksitContainer>div:last-child{
  border-radius: 10px !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-content: center;
}
.TaksitContainer>div:last-child>ul{
    border-radius: 5px !important;
}

.IbanTableContainer{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-content: center;
  align-content: center;
  flex-wrap: wrap;
  row-gap: 20px;
}
@media (max-width:1100px) {
  .IbanTableContainer{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-content: center;
  align-content: center;
  flex-wrap: wrap;
  row-gap: 20px;
}
  .TableEachRow{
    width: 100%;
  }
  
}
.TableEachRow{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  align-content: flex-start;
  border: 1px solid gray;
  border-radius: 5px;
  padding: 12px;
  
}

.TableInfoContainer{
  display: flex;
  flex-direction: column;
    justify-content: flex-start;
  align-items: flex-start;
  align-content: flex-start;
  gap: 12px;
  padding: 20px;
}

.ImageContainer>.ImageContainer{
  width: 100%;
  display: flex;
  justify-content: center;
  align-content: center;
  align-content: center;
}

.InfoContainer{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  align-content: flex-start;
}

.Ibancopy-button {
    width: 25px;
    height: 25px;
    border-radius: 5px;
    border: 1px solid #efefef;
    display: -webkit-box;
    display: -ms-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #19181c;
    position: relative;
    cursor: pointer;
    background-color: #efefef;
    -webkit-transition: .3s ease;
    transition: .3s ease;
}



.btn{
  border-radius: 5px !important;
}

.btn.red-btn {
    background: #df3041;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    align-content: center;
    padding: 14px;
}

.menu2>li:last-child>a{
  color: red !important;
}




.pricesContainer>.OldPriceContainer{
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-start;
  align-items: flex-start;
}



.pricesContainer{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  align-content: center !important;
}

.pricesContainer>.OldPriceContainer>.OldPrice{
    font-size: 20px;
    color: #9b9b9b;
    line-height: 30px;
    text-decoration: line-through;
    margin-right: 8px;
    font-weight: 400;
}
.pricesContainer>.OldPriceContainer>.discount-amount-new{
    font-size: 20px !important;
    line-height: 30px !important; 
    color: white !important;
    font-weight: 700 !important;
    margin-bottom: 0px !important;
      background-color: #06a77d !important;
          padding: 2px 20px;
    text-align: center;
    border-radius: 5px ;
}

.pricesContainer>.discount_in_cart_Container>.NewPriceContainer>.NewPrice{
    font-size: 28px;
    color: var(--label-color);
    font-weight: 700;
    line-height: 42px;
    letter-spacing: .33px;
}

.pricesContainer>.discount_in_cart_Container{
  display: flex;
  flex-direction: column;
}
.pricesContainer>.discount_in_cart_Container>.OldPrice{
    font-size: 22px;
    color: #9b9b9b;
    font-weight: 700;
    line-height: 42px;
    letter-spacing: .33px;
}


.ProductStatusContainer{
  display: flex !important;
  flex-direction: column !important;
  justify-content: center;
  align-items: flex-end;
  align-content: center;

}


.price-area>.ProductStatusContainer>.discount_in_cart_Container{
  display: flex;
  flex-direction: column !important;
}
.price-area>.ProductStatusContainer>.discount_in_cart_Container>.discount_in_cart{
     display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: flex-end;
}
.price-area>.ProductStatusContainer>.discount_in_cart_Container>.discount_in_cart>p{
    font-size:24px !important; 
    background-color: var(--label-color) !important;
    font-weight: 700 !important;
    line-height: 42px !important;
    letter-spacing: .33px !important;
    margin-bottom: 0px !important;
    color: white !important;
    padding: 2px 12px;
    width: 260px;
    border-radius: 5px !important;
    text-align: center !important;
}
.price-area>.ProductStatusContainer>.discount_in_cart_Container>.discount_in_cart>span{
    color: red !important;
}
.price-area>.ProductStatusContainer>.discount_in_cart_Container>.OldPrice{
    font-size: 22px;
    color: #9b9b9b;
    font-weight: 700;
    line-height: 42px;
    letter-spacing: .33px;
}

.PriceAreaContainer>.pricesContainer{
  display: flex;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: flex-start !important;
}


.PageSizeTitle{
  font-size: 1.7em;
}


.SizeAndAddBasket>.pieceBox{
  display: none !important;
}


.basketSaleInfo {
    background-color: #F44336 !important;
    color: white !important;
    border: none !important;
}

@media (max-width:480px) {
  .basketSaleInfo{

}
}





.BankInfoContainer{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
}
.BankInfoContainer>p{
  margin-top: 12px;
}



.AddAddressBtn{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding-top: 12px !important;
  border: 1px solid var(--border-color) !important;
  outline: none !important;
}



.AddAddressBtn > .AddressContainer > .AddressHeader {
  height: 46px;
  background-color: #f8f8f8;
  border-bottom: 1px solid var(--border-color);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
}
.AddAddressBtn > .AddressContainer > .AddressBody {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap: 12px;
  height: 60%;
  padding: 10px;
}
.AdresListContaner > .AddressContainer > .AddressBody > span {
  font-size: 14px;
  display: flex;
  flex-direction: column;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.AdresBox > .AdresListContaner > .AddAddressBtn> .AddressContainer > .AddressBody > span > b {
  all: unset !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}


.AdressModalFormArea>.form-group{
margin-bottom: 10px !important;
}

.editAdress{
  border: none !important;
  background-color: none !important;
  background: none;
  color: black !important;
  outline: none !important;
}

.addressListBox.addressActive>.AddressContainer>.AddressHeader>.AddressHeaderTitle>.editAdress{
  color: white !important;
}

.AddressHeaderTitle{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  align-content: center;
}

.missingAddress.addressActive>.AddressContainer>.AddressHeader{
  background-color: #f8f8f8 !important;
  color: black !important;
}

div[id="modalEditAdres"]{
  z-index: 999999 !important;
}


.AdresContainerV2{
display: flex;
flex-direction: row;
flex-wrap: nowrap;
}

.AdresContainerV2 .LeftContainerV2 .RightContainerV2{
  flex: 1;
}



.AddressContainer{
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  align-content: center;
  border: 1px solid gray;
  border-radius: 5px;
  padding: 4px 12px;
}

.addressActive>.AddressContainer{
  background-color: #e8f5f2;
  border: 1px solid #77cfb9;
}
.addressActive>.AddressContainer>span{
  color: black !important;
}
.addressActive{
  color: unset !important;
}


.AddressContainer>.AddressBody2{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
 width: 80% !important;
}

.AddressContainer>.AddressBody2>.AdressInfoContainer{
  width: 100% !important;
  display: flex;  
  flex-direction: column;
  justify-content: flex-start;
  gap: 5px;
}

.AddressContainer>.AddressBody2>.AdressInfoContainer>.AdressTitle{
  font-weight: bold;
  font-size: 18px;
  color:black;
    max-width: 90%;
  overflow: hidden;
}

.AddressContainer>.AddressBody2>.AdressInfoContainer>.AddressInfo .AddressPhone{
  font-weight: normal;
  font-size: 16px;
  color: #1d1d1b;
}

.AddressContainer>.AddressBody2>.button-content{
  width: 20%;
}
.AddressContainer>.AddressHeaderTitle>.button-content>button{
  background-color: #5cb85c;
  color: white !important;
  font-size: 16px;
  padding: 5px 10px;
  border-radius: 5px;
  outline: none;
  border: none;
}


@media (max-width: 540px) {
  .AddressContainer>.AddressBody2>.AdressInfoContainer>.AdressTitle{
  font-weight: bold;
  font-size: 14px !important;
  max-width: 90%;
  overflow: hidden;
}

.AddressContainer>.AddressBody2>.AdressInfoContainer>.AddressInfo .AddressPhone{
  font-weight: normal;
  font-size: 12px !important;
}

.OrderAdresListContaner>.AddresMobile>button{
      display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    align-content: center;
    width: 100% !important;
    background-color: #4a5f75e0 !important;
    gap: 8px;
    align-items: center;
    align-content: center;
    justify-content: center;
    text-align: center;
}
.OrderAdresListContaner>.AddresMobile>button:hover{
    border: 1px solid #4a5f75e0;
    color: #4a5f75e0;
    background-color: white !important;
}

}

.OrderAdresListContaner>.AddresMobile{
  display: block !important;
}
.OrderAdresListContaner>.AddresMobile>button{
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    align-content: center;
    width: 100% !important;
    background-color: #4a5f75e0 !important;
    gap: 8px;
    align-items: center;
    align-content: center;
    justify-content: center;
    text-align: center;
}
.OrderAdresListContaner>.AddresMobile>button:hover{
    border: 1px solid #4a5f75e0;
    color: #4a5f75e0;
    background-color: white !important;
}

.AdresBox>.AddresMobile{
  display: block !important;
  width: 100% !important;
}
.AdresBox>.AddresMobile>button{
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    align-content: center;
    width: 100% !important;
    background-color: #4a5f75e0 !important;
    gap: 8px;
    align-items: center;
    align-content: center;
    justify-content: center;
    text-align: center;
}
.AdresBox>.AddresMobile>button:hover{
    border: 1px solid #4a5f75e0;
    color: #4a5f75e0;
    background-color: white !important;
}
.AdresBox{
  width: 100% !important;
}
.AdresBox>.OrderAdresListContaner>.AddressContainer>.AddressHeaderTitle>.button-content{
  display: none;
}


.modal{
  z-index: 99999;
}

.form-area .form-group textarea {
  height: 100px !important; 
  padding: 25px;
  resize: none;
}

.FormAlertContainer{
  display: flex;
  flex-direction: column;
  background-color: #efefef;
  margin-bottom: 20px;
  gap: 12px;
  padding: 6px 12px;
  color: red;
  font-weight: 600;
}


input[id="AcikAdres"]::placeholder{
color: #d2d0d0 !important;
}


.wapp-float.socialobj {
  width: 40px !important;
  height: 40px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  align-content: center !important;
  align-self: center !important;
  bottom: 60px !important;
  left: 3px !important;
}



/* Ürün Detay alanının Düzenlemeleri  */

.fiyati-dusunce-haber-ver,
.fiyati-dusunce-haber-ver * {
  box-sizing: border-box;
}
.fiyati-dusunce-haber-ver {
  display: flex;
  align-items: center;
  justify-content: center;
}
.fiyati-dusunce-haber-ver-btn {
  all: unset;
  border: 1.5px solid #045eae !important;
  border-radius: 5px !important;
  padding: 5px;
  font-family: Roboto, sans-serif !important;
  font-weight: bold !important;
  font-size: 14px !important;
  line-height: 16px !important;
  color: #045eae !important;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
.fiyati-dusunce-haber-ver-btn svg:first-child {
  margin-left: 7px;
}
.fiyati-dusunce-haber-ver-btn span {
  margin: 0 10px;
}
.hangi-magazada-var-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 42px;
  border: 2px solid #dddddd;
  border-radius: 5px;
  padding: 12px 40px;
  cursor: pointer;
  background: transparent;
  white-space: nowrap;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: #333333;
}
.InStockArea{
  width: 100%;
}
.when-it-in-stock {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 42px;
  border: 2px solid #dddddd;
  border-radius: 10px;
  padding: 12px 40px;
  cursor: pointer;
  background: transparent;
  white-space: nowrap;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: #333333;
  width: 100% !important;
}
.PriceAreaContainer {
  display: flex;
  flex-direction: column;
  gap: 23px;
  width: 100% !important;
}
.PriceAreaContainer >.price-area {
  display: flex !important;
  align-content: space-between !important;
  justify-content: space-between !important;
  align-items: stretch !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  width: 100% !important;
}

.PriceAreaContainer > .Price-modals {
  display: flex !important;
  align-content: space-between !important;
  justify-content: space-between !important;
  align-items: stretch !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
}
.PriceAreaContainer > .price-area > .price {
  display: inline-block;
  font-size: 1.9285714286em;
  font-weight: 700;
  padding: 16px 0;
  float: none !important;
  margin-right: 30px;
  color: #1f5ea9 !important;
  font-size: 32px !important;
}

.PriceAreaContainer>.price-area >.pricesContainer{
  width: 100% !important;
}
.PriceAreaContainer>.price-area >.ProductStatusContainer{
    width: 100% !important;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-end;
}

.NearBottonStock {
  display: flex !important;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  align-content: center;
  color: green;
  gap: 4px;
}
.NearBottonStock>.Text {
  font-size: 14px;
}
.PriceAreaContainerNoStock > .price-area > .stocknone {
  display: flex !important;
  background: red;
  padding: 8px 22px;
  border-radius: 5px;
  color: #fff;
  font-size: 18px;
  margin: 28px 0;
  align-content: center;
  justify-content: center;
  align-items: center;
  width: 100% !important;
}
.PriceAreaContainerNoStock>.Price-modals{
    display: flex ;
    align-content: space-between ;
    justify-content: space-around ;
    align-items: stretch ;
    flex-direction: row ;
    flex-wrap: nowrap ;
    width: 100% !important;
}


.ProductInformationArea {
  display: flex;
  flex-direction: column;
}

.ProductDetailSlider {
  margin: auto !important;
}

@media (max-width: 1100px) {
  .ProductInformationArea > form > .PriceAreaContainer {
    display: flex !important;
    flex-direction: column !important;
  }
  .ProductInformationArea > form > .PriceAreaContainer > .price-area {
    display: none !important;
  }
  .ProductInformationArea > form > .PriceAreaContainer > .Price-modals {
    display: flex !important;
    flex-direction: column !important;
    gap: 23px;
    padding: 0px 12px;
  }
  .ProductInformationArea
    > form
    > .PriceAreaContainer
    > .Price-modals
    > .fiyati-dusunce-haber-ver-btn {
    max-height: 42px !important;
    height: 39px !important;
    padding: 0px 5px !important;
    border-radius: 5px !important;
  }
  .ProductInformationArea
    > form
    > .PriceAreaContainer
    > .Price-modals
    > .hangi-magazada-var-btn {
    max-height: 42px !important;
    height: 42px !important;
    border-radius: 10px !important;
  }
  .SizeAndAddBasket {
    display: none !important;
  }
  .PriceAreaContainer + br,
  .SizeAndAddBasket + br {
    display: none !important;
  }
  .PriceAreaWrapper {
    display: none !important;
  }

  /* Stockta yoksa olacak olan ekranın css kodları*/
  .ProductInformationArea > .PriceAreaContainerNoStock {
    display: flex !important;
    flex-direction: column !important;
  }
   .ProductInformationArea > .PriceAreaContainerNoStock > .price-area {
    display: none !important;
  }
  .ProductInformationArea>.PriceAreaContainerNoStock>.Price-modals{
    display: flex !important;
    flex-direction: column !important;
    gap: 23px;
    padding: 0px 12px;
    align-items: stretch !important;
  }
  .ProductInformationArea>.PriceAreaContainerNoStock>.Price-modals>button:first-child{
    height: 30px !important;
  }
  .NoStockBottomBanner{
    display: flex;
    justify-content: space-around;
    align-items: center;
    align-content: center;
    flex-direction: row;
    width: 100%;
  }
  .NoStockBottomBanner>.stocknone{
    width: 90% !important;
    border-radius: 5px !important;
    text-align: center;
    font-size: 16px;
  }
}

@media (max-width: 540px) {
  .DetailPageProductTitle {
    padding: 0px 5px;
  }
  .DetailPageProductTitle + .features {
    padding: 0px 5px;
  }
  .AboutErsaProducts {
    flex-wrap: wrap;
    justify-content: space-around !important;
  }
  .PriceAreaWrapper {
    display: none !important;
  }
}

@media (max-width: 540px) {
  .ProductDetailSliderImage {
    max-height: 300px;
    height: 100% !important;
    width: auto;
    object-fit: contain;
  }
  #main .product-detail .image-area .image-box img {
    width: 100% !important;
    max-height: 300px !important;
    object-fit: contain !important;
  }
}

.SpecialtyFix {
  margin-bottom: 70px !important;
}

.discountContainer {
  margin: 0px !important;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
  height: 52px;
}
.discountContainer > span {
  margin: 0px !important;
}
.AddbasketBtn {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-content: center;
  align-items: center;
  gap: 10px;
}

#modalStokBilgi .stokTitle,
#modalFiyatBilgi .stokTitle {
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 16px !important;
  text-align: center;
  color: #045eae !important;
  margin-bottom: 10px !important;
}
#modalStokBilgi p.alert-msg,
#modalFiyatBilgi p.alert-msg {
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  text-align: center;
  color: #000;
  margin-bottom: 16px !important;
  line-height: 16px;
}
#modalStokBilgi input[name="prodMail"],
#modalFiyatBilgi input[name="prodPrMail"] {
  border: 2px solid #045eae !important;
  border-radius: 15px;
  text-align: center;
  width: 100%;
  margin: 0 auto;
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  color: #c0bfc0;
  height: 42px !important;
}
#modalStokBilgi input[name="prodMail"]::placeholder,
#modalFiyatBilgi input[name="prodPrMail"]::placeholder {
  color: #c0bfc0;
}
#modalStokBilgi .btnStokBilgi,
#modalFiyatBilgi .btnFiyatBilgi {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 5px;
  background: #045eae !important;
  border: 2px solid #045eae !important;
  border-radius: 15px !important;
  margin: 0 auto;
  color: #ffffff !important;
  width: 145px;
  height: 30px;
  box-sizing: border-box;
  padding: 0px !important;
  margin-bottom: 30px;
}
#modalStokBilgi .form-area .form-group:not(:last-child),
#modalFiyatBilgi .form-area .form-group:not(:last-child) {
  margin-bottom: 16px !important;
}
#modalStokBilgi .modal-body .text-center,
#modalHangiMağaza
  .modal-body
  .text-center
  #modalFiyatBilgi
  .modal-body
  .text-center {
  color: #045eae !important;
  margin-bottom: 0px !important;
}
#modalStokBilgi .close,
#modalHangiMağaza .close,
#modalFiyatBilgi .close {
  opacity: 1 !important;
  color: #045eae !important;
  position: absolute;
  top: 10px;
  right: 15px;
}
.HangiMagazaModalBody {
  margin-top: 10px;
  width: 95%;
  padding: 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.HangiMagazaModalBody > h3 {
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  text-align: center;
  color: #045eae;
  margin-bottom: 10px;
}
.HangiMagazaModalBody > span {
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  text-align: start;
  color: #000;
  margin-bottom: 16px !important;
  line-height: 16px;
}
.HangiMagazaModalBody > table {
  margin-top: 30px;
}
.HangiMagazaModalBody > table > thead > tr > th {
  padding: 5px;
  text-align: center;
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 700;
}
.HangiMagazaModalBody > table > tbody > tr > th {
  padding: 5px;
  text-align: center;
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: 500;
}
.ModalPhoneInfo {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  align-content: center;
  gap: 10px;
}

/* Ürün Detaya sayfasının alt kısımında bulunan özelliklerin olduğu alan  */

.PropertyList {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 30px;
}
@media (max-width:540px) {
 .PropertyList {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
} 
.PropertyList > .EachProperty {
  height: 90px !important;
}
.PropertyList > .EachProperty>span>img {
  height: 40px !important;
  width: auto !important;
  object-fit: contain !important;
}
.PropertyList > .EachProperty>span:last-child {
font-size: 13px !important;
}
}

.PropertyList > .EachProperty {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 110px;
  width: 100%;
  height: 130px;
  border: 2px solid #e8e8e8;
  border-radius: 5px;
  padding-top: 5px;
}
.PropertyList > .EachProperty>span>img {
 max-width: 80px !important;
 height: auto;
}


.PropertyList > .EachProperty > span {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.PropertyList > .EachProperty > span > img {
}

/* Ürün Detaya sayfasının alt kısımında bulunan özelliklerin olduğu alan Bitti  */

/* Ürün Detay Alanı Düzenlemeleri Bitti  */



/* Taksit Tablosu Css Düzenlemeleri */

.HireTable > tbody > .tableImage > tr > td {

  width: 100%;
}

.TablesContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 50px;
  column-gap: 5px;
  padding: 12px;
  width: 100%;
  align-content: center;
}

    .TablesContainer > .EachTable {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-content: center;
        width: 370px;
        height: 230px;
        align-items: center;
        border-radius: 5px;
        height: fit-content
    }

.TablesContainer > .EachTable > .ImageContainer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 60px;
}

.TablesContainer > .EachTable > table > tbody > .TableTitle > th {
  padding: 12px;
  text-align: center;
}
.TablesContainer > .EachTable > table > tbody > .TableContent > td {
  padding: 12px;
  text-align: center;
}

.TablesContainer > .EachTable > table > tbody > .TableTitle {
  border-bottom: 1px solid gray;
}

.TablesContainer > .EachTable > table > tbody > .TableContent:not(:last-child) {
  border-bottom: 1px solid gray;
}

/* Taksit Tablosu Css Düzenlemeleri Bitti */



/* Giriş Yap Kayıt ol kısmı css kodları.    */
.NameSurnameInputGroup {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.DayMounthYearsContainer {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 358px !important;
  margin-left: 12px !important;
}

@media (max-width: 800px) {
  .DayMounthYearsContainer {
    max-width: 100% !important;
  }
}

.DayMounthYearsContainer > .DayContainer,
.MounthContainer,
.YearContainer {
  width: 30% !important;
}

.DayMounthYearsContainer > div > select {
  width: 100% !important;
}

/* Giriş Yap Kayıt ol kısmı css kodları  Bitti  */



#main .pageHeader {
  margin-bottom: 0px !important;
}



@media (max-width: 540px) {
  .SummaryDesktop{
    display: none  !important;
  }
    .icon-badge > img { 
        width: 40px !important;
    }
    .homepage > .icon-badge {
        top: 7% !important;
    }
        .homepage > .icon-badge > img {
            width: 40px !important;
        }
}


@media only screen and (min-width: 1100px) {
  .MobileCollapse {
    display: none !important;
  }
  .FixCollapse{
    display: none !important;
  }
}


.FixContainerMobile{
display: flex;
flex-direction: column;
gap: 12px;
}





.btn .sipOnayBtn{
  background-color: white !important;
  color: black !important;
}

.icon-badge {
    position: absolute;
    right: 0px;
    width: 40px;
    opacity: 1;
    height: 40px;
    z-index: 99999 !important;
    top: 0;
    margin-top: 5px;
    margin-right: 5px;
    display: inline-table;
}
    .icon-badge > img {
        height: auto !important;
        width: 50px !important;
    }
.ProductDetailSliderImage > .icon-badge {
    margin-top: 15px;
    margin-right: 15px;
    width: 60px;
}
    .ProductDetailSliderImage > .icon-badge > img {
        max-height: 60px !important;
    }
.homepage > .icon-badge { 
    top: 10%; 
}

.dot-typing {
    position: relative;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #9880ff;
    color: #9880ff;
    box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    animation: dot-typing 1.5s infinite linear;
}

@keyframes dot-typing {
    0% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }

    16.667% {
        box-shadow: 9984px -10px 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }

    33.333% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }

    50% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px -10px 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }

    66.667% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }

    83.333% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px -10px 0 0 #9880ff;
    }

    100% {
        box-shadow: 9984px 0 0 0 #9880ff, 9999px 0 0 0 #9880ff, 10014px 0 0 0 #9880ff;
    }
}
#main .product-item .badge.percent {
    float: right;
    background: #d20d0d;
}