.wb_indexCardContainer1_okay {
    background-color: #FFFFFF;
    background-image: none;
    border: 0px solid #DDDDDD;
    border-radius: 0px;
    box-sizing: border-box;
    position: relative;
}

.indexCardContainer1_okay {
    display: flex;
    position: relative;
    padding: 10px 10px 10px 10px;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
    align-content: flex-start;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: auto;
    margin-left: auto;
    max-width: 1400px;
    box-sizing: border-box;
    font-size: 0;
}

@media all and (max-width:768px) {
    .indexCardContainer1_okay {
        flex-direction: column;
        flex-wrap: nowrap;
    }
}

.wb_indexCard1_okay {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0%;
    align-self: auto;
    box-sizing: border-box;
    margin: 10px 5px 10px 5px;
    background-color: #FFFFFF;
    background-image: none;
    border: 1px solid #DDDDDD;
    border-radius: 3px;
    text-align: center;
    max-width: 400px;
    width: 100%;
}

.indexCard1-card-body {
    padding: 0;
    flex: 1 1 auto;
    font-size: 0;
}

.indexCard1-card-header {
    box-sizing: border-box;
    border-bottom: 1px solid #DDDDDD;
    margin: 10px 10px 10px 10px;
    background-color: #008B8B;
    background-image: none;
    color: #F5F5F5;
    font-family: Roboto;
    font-weight: normal;
    font-style: normal;
    /* DEĞİŞEN VE EKLENEN KISIMLAR */
    height: 50px;
    /* Yüksekliği 30px'e sabitledik */
    font-size: 20px;
    /* 21px yazı bu kutuya büyük geleceği için ideal bir boyuta (16px) çektik */
    padding: 0 20px;
    /* Üst ve alt padding'i 0 yaptık (taşmayı önlemek için), sağ-sol 20px kaldı */

    /* Yazıyı dikeyde tam ortalamak için en pratik yöntem: */
    display: flex;
    align-items: center;
    justify-content: center;  /* Yatayda (soldan sağa) ortalar */
}

.indexCard1-card-item1 {
    box-sizing: border-box;
    margin: 0;
    padding: 10px 10px 10px 10px;
    border: 0px solid #000000;
    border-radius: 0px;
    width: 100%;
    height: auto;
}

.indexCard1-card-item2 {
    box-sizing: border-box;
    margin: 20px 20px 0 20px;
    padding: 0;
    color: #333333;
    font-family: Arial;
    font-weight: bold;
    font-style: normal;
    font-size: 16px;

    height: 50px;
    /* Yüksekliği 50px'e sabitledik */

    /* Yazıyı 50px'lik kutunun içinde dikeyde tam ortalamak için: */
    display: flex;
    align-items: center;
    justify-content: center;  /* Yatayda (soldan sağa) ortalar */
}

.indexCard1-card-item3 {
box-sizing: border-box;
    margin: 20px 20px 0 20px;
    padding: 0;
    color: #333333;
    font-family: Arial;
    font-weight: normal;
    font-style: normal;
    font-size: 14px;

    /* DEĞİŞEN VE EKLENEN KISIMLAR */
    height: 100px;            /* Yükseklik 100px sabitlendi */
    align-items: left;      /* Dikeyde (yukarıdan aşağıya) ortalar */
    /* justify-content: center;  Yatayda (soldan sağa) ortalar */
    text-align: left;       /* Çok satırlı metinlerin kendi içinde de ortalanmasını sağlar */
    overflow: hidden;         /* Metin çok uzunsa kutudan dışarı taşmasını engeller */
}

.indexCard1-card-item4 {
    box-sizing: border-box;
    margin: 20px 20px 0 20px;
    border-top: 1px #DDDDDD solid;
    border-width: 1px 0 0 0;
    height: 0;
    line-height: 0;
}

.indexCard1-card-item5 {
    display: inline-block;
    line-height: 1.0;
    height: 38px;
    box-sizing: border-box;
    margin: 25px 20px 20px 20px;
    border: 1px solid #C5C5C5;
    border-radius: 4px;
    background-color: #008B8B;
    background-image: none;
    color: #F5F5F5;
    font-family: Roboto;
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
}

.indexCard1-card-item5 a {
    color: inherit;
    display: block;
    padding: 10px 16px 10px 16px;
    text-decoration: none;
}

#supompalariCard1-card-item1 {
    object-fit: contain;
    background-color: transparent;
}

.supompalariCard1-card-item1_okay {

    box-sizing: border-box;
    padding: 10px 10px 10px 10px;
    border: 0px solid #000000;
    border-radius: 0px;

    /* Değişen ve Eklenen Kısımlar */
    height: 300px;
    /* Yükseklik 200px'de sabitlendi */
    width: auto;
    /* Genişlik orijinal orana göre otomatik ayarlanacak */
    max-width: 100%;
    /* Resim çok genişse kartın dışına taşmasını önler */
    display: block;
    /* Ortalamanın düzgün çalışması için blok element yaptık */
    margin: 0 auto;
    /* Üst/Alt margin 0, Sağ/Sol otomatik (Tam ortalar) */

}
.fiyatlisteleriCard5-card-header_okay {
   box-sizing: border-box;
   border-bottom: 1px solid #DCDCDC;
   margin: 10px 10px 10px 10px;
   background-color: #E9E9E9;
   background-image: none;
   color: #333333;
   font-family: Roboto;
   font-weight: bold;
   font-style: normal;
   font-size: 16px;

   /* DEĞİŞEN VE EKLENEN KISIMLAR */
   height: 50px;             /* Yüksekliği 50px yaptık */
   padding: 0 20px;          /* Üst ve alt padding'i (12px olanları) sıfırladık, taşmayı önledik */
   
   display: flex;
   align-items: center;      /* Yazıyı dikeyde tam ortalar */
   justify-content: center;  /* Yazıyı yatayda tam ortalar (Solda kalsın isterseniz bu satırı silin) */
}

.fiyatlisteleriCard5-card-item1_okay {
   box-sizing: border-box;
   margin: 10px auto;        /* Üst-alt 10px, sağ-sol otomatik (ortalama için) */
   padding: 0;
   border: 0px solid #000000;
   border-radius: 0px;
   max-width: 95%;
   width: 100%;

   /* DEĞİŞEN VE EKLENEN KISIMLAR */
   height: 120px;            /* Yükseklik 200px'e çıkarıldı */
   
   /* Eğer bu bir RESİM (IMG) etiketi ise görüntünün bozulmaması için: */
   object-fit: contain;      
   
   /* Eğer bu bir DIV ise ve içindekileri ortalamak isterseniz: */
   display: flex;
   align-items: center;
   justify-content: center;
}
