@font-face {
    font-family: 'roboto_condensed-bold';
    src: url('/fonts/Roboto/roboto_condensed-bold.ttf') format('truetype');
}

@font-face {
    font-family: 'roboto_condensed-regular';
    src: url('/fonts/Roboto/roboto_condensed-regular.ttf') format('truetype');
}

@font-face {
    font-family: 'roboto_condensed-light';
    src: url('/fonts/Roboto/roboto_condensed-light.ttf') format('truetype');
}

@font-face {
    font-family: 'roboto_condensed-medium';
    src: url('/fonts/Roboto/roboto_condensed-medium.ttf') format('truetype');
}

/*----------------------------------------------------------------------------------------------------------------------------------*/
/* Genel Sıfırlama ve Kutu Boyutlandırma */
/*----------------------------------------------------------------------------------------------------------------------------------*/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    scroll-behavior: smooth; /* Yumuşak kaydırma sağlar */
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    scroll-behavior: smooth;
}


html {
    font-family: roboto_condensed-light, Arial, sans-serif;
    font-size: 1em;
    color: #fff;
    position: relative;
    min-height: 100%;
}

body {
    font-family: roboto_condensed-regular, Arial, sans-serif;
    line-height: 1.6;
    /* FIX: Üst tarafa kaydırma boşluğu koyarak sabit başlığın içeriği bağlantı noktalarının altına gizlemesini önlemek */
    scroll-padding-top: 100px;
    background-color: #48452a;
}

strong {
    font-family: roboto_condensed-light, Arial, sans-serif;
    font-weight: 800;
}
.mt10 {
    margin-top:10px;
}

/* MANŞETLER */

h1 {
    font-family: roboto_condensed-bold, Arial, sans-serif;
    font-size: 3.5em;
    
}

h2 {
    font-family: roboto_condensed-bold, Arial, sans-serif;
    font-size: 2.5em;
}

h3 {
    font-family: roboto_condensed-light, Arial, sans-serif;
    font-size: 1.6em;
    font-weight: 600;
    color: #fff;
    text-align: center;
}

h4 {
    font-family: roboto_condensed-light, Arial, sans-serif;
    font-size: 1.5em;
}

@media (max-width: 768px) {
    h1 {
        font-size: 2.5em;
    }

}

a {
        text-decoration: none;
        color: #fff;
    }

ul {
        list-style-type: none;
        text-align: left;
        display: inline-block;
        --icon-size: .8em;
        --gutter: .5em;
        padding: 1%;
    }

        ul li {
            display: list-item; /* Her öğenin kendi satırında olmasını sağlar */
            padding-left: 0; /* Daha önce eklenen padding'i kaldır */
            padding-left: calc(var(--icon-size) + var(--gutter)); /* İkon ve metin arasındaki boşluğu düzenlemek için padding-left ekle */
            position: relative; /* ::before konumlandırması için */
            margin-bottom: 0.5em; /* Liste öğeleri arasına boşluk */
            padding-right: 10px;
        }

            ul li::before {
                content: "\f192"; /* Solid Circle (Font Awesome 5 Free - Solid) */
                font-family: 'Font Awesome 5 Free'; /* Font Ailesini doğru tanımla */
                font-weight: 500; /* Solid ikonlar için ağırlık 900 olmalı */
                font-size: var(--icon-size);
                color: #fff;
                /* İkonu liste öğesinin soluna hizala */
                position: absolute;
                left: 0.4em;
                top: 0.1em; /* Dikey hizalama ayarı */
                padding: 11px 0;
            }

    li:nth-child(odd) {
        background-color: #787346;
        border-radius: 5px;
        padding: 10px 10px 10px 0;
        box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.5);
    }

    li:nth-child(even) {
        background-color: #615A3F;
        border-radius: 5px;
        padding: 10px 10px 10px 0;
        box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.5);
    }

    @media (min-width: 768px) {
        html {
            font-size: 16px;
        }
    }

    .btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
        box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
    }

    /* IZGARALAR */
.grid11 {
    display: grid;
    gap: 1em;
    grid-template-columns: 1fr 1fr; /* Masaüstünde 2 sütun (1fr = 1 parçalık alan) */
}

.grid111 {
    display: grid;
    gap: 1em;
    grid-template-columns: 1fr 1fr 1fr; /* Masaüstünde 3 sütun (1fr = 1 parçalık alan) */
   
}

.grid181 {
    display: flex;
    gap: 1em; /* Menü alanının yüksekliğini etkiler */
    grid-template-columns: 1fr 8fr 1fr; /* Masaüstünde 3 sütun (1fr = 1 parçalık alan) */

}