/* --- 25 SÜTUNLU TAM RESPONSIVE GRID (KESİNTİSİZ) --- */

.row-25 {
    display: flex;
    flex-wrap: wrap;
    margin-right: -12px;
    margin-left: -12px;
}

    .row-25 > * {
        flex-shrink: 0;
        width: 100%;
        max-width: 100%;
        padding-right: 12px;
        padding-left: 12px;
        box-sizing: border-box;
    }

/* 1. XS (Varsayılan - Tüm Ekranlar) */
.col-25-1 {
      flex: 0 0 auto;width: 4%;
}

.col-25-2 {
      flex: 0 0 auto;width: 8%;
}

.col-25-3 {
      flex: 0 0 auto;width: 12%;
}

.col-25-4 {
      flex: 0 0 auto;width: 16%;
}

.col-25-5 {
      flex: 0 0 auto;width: 20%;
}

.col-25-6 {
      flex: 0 0 auto;width: 24%;
}

.col-25-7 {
      flex: 0 0 auto;width: 28%;
}

.col-25-8 {
      flex: 0 0 auto;width: 32%;
}

.col-25-9 {
      flex: 0 0 auto;width: 36%;
}

.col-25-10 {
      flex: 0 0 auto;width: 40%;
}

.col-25-11 {
      flex: 0 0 auto;width: 44%;
}

.col-25-12 {
      flex: 0 0 auto;width: 48%;
}

.col-25-13 {
      flex: 0 0 auto;width: 52%;
}

.col-25-14 {
      flex: 0 0 auto;width: 56%;
}

.col-25-15 {
      flex: 0 0 auto;width: 60%;
}

.col-25-16 {
      flex: 0 0 auto;width: 64%;
}

.col-25-17 {
      flex: 0 0 auto;width: 68%;
}

.col-25-18 {
      flex: 0 0 auto;width: 72%;
}

.col-25-19 {
      flex: 0 0 auto;width: 76%;
}

.col-25-20 {
      flex: 0 0 auto;width: 80%;
}

.col-25-21 {
      flex: 0 0 auto;width: 84%;
}

.col-25-22 {
      flex: 0 0 auto;width: 88%;
}

.col-25-23 {
      flex: 0 0 auto;width: 92%;
}

.col-25-24 {
      flex: 0 0 auto;width: 96%;
}

.col-25-25 {
      flex: 0 0 auto;width: 100%;
} 
@media (max-width:575px){
    .col-25-xs-1 {
        flex: 0 0 auto;
        width: 4%;
    }

    .col-25-xs-2 {
        flex: 0 0 auto;
        width: 8%;
    }

    .col-25-xs-3 {
        flex: 0 0 auto;
        width: 12%;
    }

    .col-25-xs-4 {
        flex: 0 0 auto;
        width: 16%;
    }

    .col-25-xs-5 {
        flex: 0 0 auto;
        width: 20%;
    }

    .col-25-xs-6 {
        flex: 0 0 auto;
        width: 24%;
    }

    .col-25-xs-7 {
        flex: 0 0 auto;
        width: 28%;
    }

    .col-25-xs-8 {
        flex: 0 0 auto;
        width: 32%;
    }

    .col-25-xs-9 {
        flex: 0 0 auto;
        width: 36%;
    }

    .col-25-xs--10 {
        flex: 0 0 auto;
        width: 40%;
    }

    .col-25-xs--11 {
        flex: 0 0 auto;
        width: 44%;
    }

    .col-25-xs-12 {
        flex: 0 0 auto;
        width: 48%;
    }

    .col-25-xs-13 {
        flex: 0 0 auto;
        width: 52%;
    }

    .col-25-xs-14 {
        flex: 0 0 auto;
        width: 56%;
    }

    .col-25-xs-15 {
        flex: 0 0 auto;
        width: 60%;
    }

    .col-25-xs-16 {
        flex: 0 0 auto;
        width: 64%;
    }

    .col-25-xs-17 {
        flex: 0 0 auto;
        width: 68%;
    }

    .col-25-xs-18 {
        flex: 0 0 auto;
        width: 72%;
    }

    .col-25-xs-19 {
        flex: 0 0 auto;
        width: 76%;
    }

    .col-25-xs-20 {
        flex: 0 0 auto;
        width: 80%;
    }

    .col-25-xs-21 {
        flex: 0 0 auto;
        width: 84%;
    }

    .col-25-xs-22 {
        flex: 0 0 auto;
        width: 88%;
    }

    .col-25-xs-23 {
        flex: 0 0 auto;
        width: 92%;
    }

    .col-25-xs-24 {
        flex: 0 0 auto;
        width: 96%;
    }

    .col-25-xs-25 {
        flex: 0 0 auto;
        width: 100%;
    }
}
/* 2. SM (≥576px) */
@media (min-width: 576px) {
    .col-25-sm-1 {
          flex: 0 0 auto;width: 4%;
    }

    .col-25-sm-2 {
          flex: 0 0 auto;width: 8%;
    }

    .col-25-sm-3 {
          flex: 0 0 auto;width: 12%;
    }

    .col-25-sm-4 {
          flex: 0 0 auto;width: 16%;
    }

    .col-25-sm-5 {
          flex: 0 0 auto;width: 20%;
    }

    .col-25-sm-6 {
          flex: 0 0 auto;width: 24%;
    }

    .col-25-sm-7 {
          flex: 0 0 auto;width: 28%;
    }

    .col-25-sm-8 {
          flex: 0 0 auto;width: 32%;
    }

    .col-25-sm-9 {
          flex: 0 0 auto;width: 36%;
    }

    .col-25-sm-10 {
          flex: 0 0 auto;width: 40%;
    }

    .col-25-sm-11 {
          flex: 0 0 auto;width: 44%;
    }

    .col-25-sm-12 {
          flex: 0 0 auto;width: 48%;
    }

    .col-25-sm-13 {
          flex: 0 0 auto;width: 52%;
    }

    .col-25-sm-14 {
          flex: 0 0 auto;width: 56%;
    }

    .col-25-sm-15 {
          flex: 0 0 auto;width: 60%;
    }

    .col-25-sm-16 {
          flex: 0 0 auto;width: 64%;
    }

    .col-25-sm-17 {
          flex: 0 0 auto;width: 68%;
    }

    .col-25-sm-18 {
          flex: 0 0 auto;width: 72%;
    }

    .col-25-sm-19 {
          flex: 0 0 auto;width: 76%;
    }

    .col-25-sm-20 {
          flex: 0 0 auto;width: 80%;
    }

    .col-25-sm-21 {
          flex: 0 0 auto;width: 84%;
    }

    .col-25-sm-22 {
          flex: 0 0 auto;width: 88%;
    }

    .col-25-sm-23 {
          flex: 0 0 auto;width: 92%;
    }

    .col-25-sm-24 {
          flex: 0 0 auto;width: 96%;
    }

    .col-25-sm-25 {
          flex: 0 0 auto;width: 100%;
    }
    

    
    
}

/* 3. MD (≥768px) */
@media (min-width: 768px) {
    .col-25-md-1 {
          flex: 0 0 auto;width: 4%;
    }

    .col-25-md-2 {
          flex: 0 0 auto;width: 8%;
    }

    .col-25-md-3 {
          flex: 0 0 auto;width: 12%;
    }

    .col-25-md-4 {
          flex: 0 0 auto;width: 16%;
    }

    .col-25-md-5 {
          flex: 0 0 auto;width: 20%;
    }

    .col-25-md-6 {
          flex: 0 0 auto;width: 24%;
    }

    .col-25-md-7 {
          flex: 0 0 auto;width: 28%;
    }

    .col-25-md-8 {
          flex: 0 0 auto;width: 32%;
    }

    .col-25-md-9 {
          flex: 0 0 auto;width: 36%;
    }

    .col-25-md-10 {
          flex: 0 0 auto;width: 40%;
    }

    .col-25-md-11 {
          flex: 0 0 auto;width: 44%;
    }

    .col-25-md-12 {
          flex: 0 0 auto;width: 48%;
    }

    .col-25-md-13 {
          flex: 0 0 auto;width: 52%;
    }

    .col-25-md-14 {
          flex: 0 0 auto;width: 56%;
    }

    .col-25-md-15 {
          flex: 0 0 auto;width: 60%;
    }

    .col-25-md-16 {
          flex: 0 0 auto;width: 64%;
    }

    .col-25-md-17 {
          flex: 0 0 auto;width: 68%;
    }

    .col-25-md-18 {
          flex: 0 0 auto;width: 72%;
    }

    .col-25-md-19 {
          flex: 0 0 auto;width: 76%;
    }

    .col-25-md-20 {
          flex: 0 0 auto;width: 80%;
    }

    .col-25-md-21 {
          flex: 0 0 auto;width: 84%;
    }

    .col-25-md-22 {
          flex: 0 0 auto;width: 88%;
    }

    .col-25-md-23 {
          flex: 0 0 auto;width: 92%;
    }

    .col-25-md-24 {
          flex: 0 0 auto;width: 96%;
    }

    .col-25-md-25 {
          flex: 0 0 auto;width: 100%;
    }
    
}

/* 4. LG (≥992px) */
@media (min-width: 992px) {
    .col-25-lg-1 {
          flex: 0 0 auto;width: 4%;
    }

    .col-25-lg-2 {
          flex: 0 0 auto;width: 8%;
    }

    .col-25-lg-3 {
          flex: 0 0 auto;width: 12%;
    }

    .col-25-lg-4 {
          flex: 0 0 auto;width: 16%;
    }

    .col-25-lg-5 {
          flex: 0 0 auto;width: 20%;
    }

    .col-25-lg-6 {
          flex: 0 0 auto;width: 24%;
    }

    .col-25-lg-7 {
          flex: 0 0 auto;width: 28%;
    }

    .col-25-lg-8 {
          flex: 0 0 auto;width: 32%;
    }

    .col-25-lg-9 {
          flex: 0 0 auto;width: 36%;
    }

    .col-25-lg-10 {
          flex: 0 0 auto;width: 40%;
    }

    .col-25-lg-11 {
          flex: 0 0 auto;width: 44%;
    }

    .col-25-lg-12 {
          flex: 0 0 auto;width: 48%;
    }

    .col-25-lg-13 {
          flex: 0 0 auto;width: 52%;
    }

    .col-25-lg-14 {
          flex: 0 0 auto;width: 56%;
    }

    .col-25-lg-15 {
          flex: 0 0 auto;width: 60%;
    }

    .col-25-lg-16 {
          flex: 0 0 auto;width: 64%;
    }

    .col-25-lg-17 {
          flex: 0 0 auto;width: 68%;
    }

    .col-25-lg-18 {
          flex: 0 0 auto;width: 72%;
    }

    .col-25-lg-19 {
          flex: 0 0 auto;width: 76%;
    }

    .col-25-lg-20 {
          flex: 0 0 auto;width: 80%;
    }

    .col-25-lg-21 {
          flex: 0 0 auto;width: 84%;
    }

    .col-25-lg-22 {
          flex: 0 0 auto;width: 88%;
    }

    .col-25-lg-23 {
          flex: 0 0 auto;width: 92%;
    }

    .col-25-lg-24 {
          flex: 0 0 auto;width: 96%;
    }

    .col-25-lg-25 {
          flex: 0 0 auto;width: 100%;
    }
 
}

/* 5. XL (≥1200px) */
@media (min-width: 1200px) {
    .col-25-xl-1 {
          flex: 0 0 auto;width: 4%;
    }

    .col-25-xl-2 {
          flex: 0 0 auto;width: 8%;
    }

    .col-25-xl-3 {
          flex: 0 0 auto;width: 12%;
    }

    .col-25-xl-4 {
          flex: 0 0 auto;width: 16%;
    }

    .col-25-xl-5 {
          flex: 0 0 auto;width: 20%;
    }

    .col-25-xl-6 {
          flex: 0 0 auto;width: 24%;
    }

    .col-25-xl-7 {
          flex: 0 0 auto;width: 28%;
    }

    .col-25-xl-8 {
          flex: 0 0 auto;width: 32%;
    }

    .col-25-xl-9 {
          flex: 0 0 auto;width: 36%;
    }

    .col-25-xl-10 {
          flex: 0 0 auto;width: 40%;
    }

    .col-25-xl-11 {
          flex: 0 0 auto;width: 44%;
    }

    .col-25-xl-12 {
          flex: 0 0 auto;width: 48%;
    }

    .col-25-xl-13 {
          flex: 0 0 auto;width: 52%;
    }

    .col-25-xl-14 {
          flex: 0 0 auto;width: 56%;
    }

    .col-25-xl-15 {
          flex: 0 0 auto;width: 60%;
    }

    .col-25-xl-16 {
          flex: 0 0 auto;width: 64%;
    }

    .col-25-xl-17 {
          flex: 0 0 auto;width: 68%;
    }

    .col-25-xl-18 {
          flex: 0 0 auto;width: 72%;
    }

    .col-25-xl-19 {
          flex: 0 0 auto;width: 76%;
    }

    .col-25-xl-20 {
          flex: 0 0 auto;width: 80%;
    }

    .col-25-xl-21 {
          flex: 0 0 auto;width: 84%;
    }

    .col-25-xl-22 {
          flex: 0 0 auto;width: 88%;
    }

    .col-25-xl-23 {
          flex: 0 0 auto;width: 92%;
    }

    .col-25-xl-24 {
          flex: 0 0 auto;width: 96%;
    }

    .col-25-xl-25 {
          flex: 0 0 auto;width: 100%;
    }
}



/* --- 25 SÜTUNLU TAM OFFSET SİSTEMİ (0-24 Arası Tüm Değerler) --- */

/* 1. XS Offset (Mobil - Varsayılan) */
.offset-25-0 {
    margin-left: 0;
}

.offset-25-1 {
    margin-left: 4%;
}

.offset-25-2 {
    margin-left: 8%;
}

.offset-25-3 {
    margin-left: 12%;
}

.offset-25-4 {
    margin-left: 16%;
}

.offset-25-5 {
    margin-left: 20%;
}

.offset-25-6 {
    margin-left: 24%;
}

.offset-25-7 {
    margin-left: 28%;
}

.offset-25-8 {
    margin-left: 32%;
}

.offset-25-9 {
    margin-left: 36%;
}

.offset-25-10 {
    margin-left: 40%;
}

.offset-25-11 {
    margin-left: 44%;
}

.offset-25-12 {
    margin-left: 48%;
}

.offset-25-13 {
    margin-left: 52%;
}

.offset-25-14 {
    margin-left: 56%;
}

.offset-25-15 {
    margin-left: 60%;
}

.offset-25-16 {
    margin-left: 64%;
}

.offset-25-17 {
    margin-left: 68%;
}

.offset-25-18 {
    margin-left: 72%;
}

.offset-25-19 {
    margin-left: 76%;
}

.offset-25-20 {
    margin-left: 80%;
}

.offset-25-21 {
    margin-left: 84%;
}

.offset-25-22 {
    margin-left: 88%;
}

.offset-25-23 {
    margin-left: 92%;
}

.offset-25-24 {
    margin-left: 96%;
}

/*XS<756*/
@media (max-width:575px){
    offset-25-xs-0 {
        margin-left: 0;
    }

    .offset-25-xs-1 {
        margin-left: 4%;
    }

    .offset-25-xs-2 {
        margin-left: 8%;
    }

    .offset-25-xs-3 {
        margin-left: 12%;
    }

    .offset-25-xs-4 {
        margin-left: 16%;
    }

    .offset-25-xs-5 {
        margin-left: 20%;
    }

    .offset-25-xs-6 {
        margin-left: 24%;
    }

    .offset-25-xs-7 {
        margin-left: 28%;
    }

    .offset-25-xs-8 {
        margin-left: 32%;
    }

    .offset-25-xs-9 {
        margin-left: 36%;
    }

    .offset-25-xs-10 {
        margin-left: 40%;
    }

    .offset-25-xs-11 {
        margin-left: 44%;
    }

    .offset-25-xs-12 {
        margin-left: 48%;
    }

    .offset-25-xs-13 {
        margin-left: 52%;
    }

    .offset-25-xs-14 {
        margin-left: 56%;
    }

    .offset-25-xs-15 {
        margin-left: 60%;
    }

    .offset-25-xs-16 {
        margin-left: 64%;
    }

    .offset-25-xs-17 {
        margin-left: 68%;
    }

    .offset-25-xs-18 {
        margin-left: 72%;
    }

    .offset-25-xs-19 {
        margin-left: 76%;
    }

    .offset-25-xs-20 {
        margin-left: 80%;
    }

    .offset-25-xs-21 {
        margin-left: 84%;
    }

    .offset-25-xs-22 {
        margin-left: 88%;
    }

    .offset-25-xs-23 {
        margin-left: 92%;
    }

    .offset-25-xs-24 {
        margin-left: 96%;
    }
}

/* 2. SM Offset (≥576px) */
@media (min-width: 576px) {
    .offset-25-sm-0 {
        margin-left: 0;
    }

    .offset-25-sm-1 {
        margin-left: 4%;
    }

    .offset-25-sm-2 {
        margin-left: 8%;
    }

    .offset-25-sm-3 {
        margin-left: 12%;
    }

    .offset-25-sm-4 {
        margin-left: 16%;
    }

    .offset-25-sm-5 {
        margin-left: 20%;
    }

    .offset-25-sm-6 {
        margin-left: 24%;
    }

    .offset-25-sm-7 {
        margin-left: 28%;
    }

    .offset-25-sm-8 {
        margin-left: 32%;
    }

    .offset-25-sm-9 {
        margin-left: 36%;
    }

    .offset-25-sm-10 {
        margin-left: 40%;
    }

    .offset-25-sm-11 {
        margin-left: 44%;
    }

    .offset-25-sm-12 {
        margin-left: 48%;
    }

    .offset-25-sm-13 {
        margin-left: 52%;
    }

    .offset-25-sm-14 {
        margin-left: 56%;
    }

    .offset-25-sm-15 {
        margin-left: 60%;
    }

    .offset-25-sm-16 {
        margin-left: 64%;
    }

    .offset-25-sm-17 {
        margin-left: 68%;
    }

    .offset-25-sm-18 {
        margin-left: 72%;
    }

    .offset-25-sm-19 {
        margin-left: 76%;
    }

    .offset-25-sm-20 {
        margin-left: 80%;
    }

    .offset-25-sm-21 {
        margin-left: 84%;
    }

    .offset-25-sm-22 {
        margin-left: 88%;
    }

    .offset-25-sm-23 {
        margin-left: 92%;
    }

    .offset-25-sm-24 {
        margin-left: 96%;
    }
}

/* 3. MD Offset (≥768px) */
@media (min-width: 768px) {
    .offset-25-md-0 {
        margin-left: 0;
    }

    .offset-25-md-1 {
        margin-left: 4%;
    }

    .offset-25-md-2 {
        margin-left: 8%;
    }

    .offset-25-md-3 {
        margin-left: 12%;
    }

    .offset-25-md-4 {
        margin-left: 16%;
    }

    .offset-25-md-5 {
        margin-left: 20%;
    }

    .offset-25-md-6 {
        margin-left: 24%;
    }

    .offset-25-md-7 {
        margin-left: 28%;
    }

    .offset-25-md-8 {
        margin-left: 32%;
    }

    .offset-25-md-9 {
        margin-left: 36%;
    }

    .offset-25-md-10 {
        margin-left: 40%;
    }

    .offset-25-md-11 {
        margin-left: 44%;
    }

    .offset-25-md-12 {
        margin-left: 48%;
    }

    .offset-25-md-13 {
        margin-left: 52%;
    }

    .offset-25-md-14 {
        margin-left: 56%;
    }

    .offset-25-md-15 {
        margin-left: 60%;
    }

    .offset-25-md-16 {
        margin-left: 64%;
    }

    .offset-25-md-17 {
        margin-left: 68%;
    }

    .offset-25-md-18 {
        margin-left: 72%;
    }

    .offset-25-md-19 {
        margin-left: 76%;
    }

    .offset-25-md-20 {
        margin-left: 80%;
    }

    .offset-25-md-21 {
        margin-left: 84%;
    }

    .offset-25-md-22 {
        margin-left: 88%;
    }

    .offset-25-md-23 {
        margin-left: 92%;
    }

    .offset-25-md-24 {
        margin-left: 96%;
    }
}

/* 4. LG Offset (≥992px) */
@media (min-width: 992px) {
    .offset-25-lg-0 {
        margin-left: 0;
    }

    .offset-25-lg-1 {
        margin-left: 4%;
    }

    .offset-25-lg-2 {
        margin-left: 8%;
    }

    .offset-25-lg-3 {
        margin-left: 12%;
    }

    .offset-25-lg-4 {
        margin-left: 16%;
    }

    .offset-25-lg-5 {
        margin-left: 20%;
    }

    .offset-25-lg-6 {
        margin-left: 24%;
    }

    .offset-25-lg-7 {
        margin-left: 28%;
    }

    .offset-25-lg-8 {
        margin-left: 32%;
    }

    .offset-25-lg-9 {
        margin-left: 36%;
    }

    .offset-25-lg-10 {
        margin-left: 40%;
    }

    .offset-25-lg-11 {
        margin-left: 44%;
    }

    .offset-25-lg-12 {
        margin-left: 48%;
    }

    .offset-25-lg-13 {
        margin-left: 52%;
    }

    .offset-25-lg-14 {
        margin-left: 56%;
    }

    .offset-25-lg-15 {
        margin-left: 60%;
    }

    .offset-25-lg-16 {
        margin-left: 64%;
    }

    .offset-25-lg-17 {
        margin-left: 68%;
    }

    .offset-25-lg-18 {
        margin-left: 72%;
    }

    .offset-25-lg-19 {
        margin-left: 76%;
    }

    .offset-25-lg-20 {
        margin-left: 80%;
    }

    .offset-25-lg-21 {
        margin-left: 84%;
    }

    .offset-25-lg-22 {
        margin-left: 88%;
    }

    .offset-25-lg-23 {
        margin-left: 92%;
    }

    .offset-25-lg-24 {
        margin-left: 96%;
    }
}

/* 5. XL Offset (≥1200px) */
@media (min-width: 1200px) {
    .offset-25-xl-0 {
        margin-left: 0;
    }

    .offset-25-xl-1 {
        margin-left: 4%;
    }

    .offset-25-xl-2 {
        margin-left: 8%;
    }

    .offset-25-xl-3 {
        margin-left: 12%;
    }

    .offset-25-xl-4 {
        margin-left: 16%;
    }

    .offset-25-xl-5 {
        margin-left: 20%;
    }

    .offset-25-xl-6 {
        margin-left: 24%;
    }

    .offset-25-xl-7 {
        margin-left: 28%;
    }

    .offset-25-xl-8 {
        margin-left: 32%;
    }

    .offset-25-xl-9 {
        margin-left: 36%;
    }

    .offset-25-xl-10 {
        margin-left: 40%;
    }

    .offset-25-xl-11 {
        margin-left: 44%;
    }

    .offset-25-xl-12 {
        margin-left: 48%;
    }

    .offset-25-xl-13 {
        margin-left: 52%;
    }

    .offset-25-xl-14 {
        margin-left: 56%;
    }

    .offset-25-xl-15 {
        margin-left: 60%;
    }

    .offset-25-xl-16 {
        margin-left: 64%;
    }

    .offset-25-xl-17 {
        margin-left: 68%;
    }

    .offset-25-xl-18 {
        margin-left: 72%;
    }

    .offset-25-xl-19 {
        margin-left: 76%;
    }

    .offset-25-xl-20 {
        margin-left: 80%;
    }

    .offset-25-xl-21 {
        margin-left: 84%;
    }

    .offset-25-xl-22 {
        margin-left: 88%;
    }

    .offset-25-xl-23 {
        margin-left: 92%;
    }

    .offset-25-xl-24 {
        margin-left: 96%;
    }
}