
    




            
    #scrollToTop {
     display: none;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
            }

/* Footer - Scrool Top  CSS Sonu*/   









    /* Header CSS Başı*/   

#header {
            background-color: #007bff; /* Header arka plan rengi */
            color: white; /* Yazı rengi */
            padding: 250px 0; /* Üst ve alt boşluk */
            text-align: center; /* Ortaya hizalama */
        }
        #header-carousel .carousel-item {
    height: 500px; /* İstediğin yüksekliği buraya ayarlayabilirsin */
}

#header-carousel .carousel-item img {
    object-fit: cover; /* Resimlerin düzgün görünmesi için */
    height: 100%; /* Yüksekliği tam kapla */
    width: 100%; /* Genişliği tam kapla */
}


body {
            padding-top: 0px; /* Navbar için üst boşluk */
            
        }
        #header-carousel .carousel-item {
    height: 500px; /* Carousel yüksekliği */
}

#header-carousel .carousel-item img {
    object-fit: cover; /* Resimlerin düzgün görünmesi için */
    height: 100%; /* Yüksekliği tam kapla */
}     



#header {
    background-color: #007bff; /* Header arka plan rengi */
    color: white; /* Yazı rengi */
    padding: 250px 0; /* Üst ve alt boşluk */
    text-align: center; /* Ortaya hizalama */
}
#header-carousel .carousel-item {
height: 500px; /* İstediğin yüksekliği buraya ayarlayabilirsin */
}

#header-carousel .carousel-item img {
object-fit: cover; /* Resimlerin düzgün görünmesi için */
height: 100%; /* Yüksekliği tam kapla */
width: 100%; /* Genişliği tam kapla */
}

/* Header CSS Sonu*/   








/* Topbar - Navbar  CSS Başı*/   

#topbar {
    background-color: #f8f9fa; /* Topbar arka plan rengi */
    padding: 10px 20px; /* Üst ve alt boşluk, sağdan 20px padding */
    margin-bottom: 0; /* Navbar ile topbar arasında boşluk kaldırıldı */
    text-align: right; /* Butonları sağa yasla */
    position: sticky; /* Yapışkan özelliği */
    top: 0; /* Üstte yapışkan olması için */
    z-index: 10; /* Üstte görünmesi için */
}
.navbar-brand {
font-weight: 900; /* Yazıyı kalın yap */
text-align: center; /* Ortala */
color: #066aab; /* Kapalı mavi rengi */

}

.btn-custom {
    margin: 5px 0; /* Dikey boşluk için üst ve alt boşluk */
}

.nav-link {
position: relative; /* Pozisyonu ayarla */
font-weight: bold; /* Başlangıçta kalın yap */
text-decoration: none; /* Alt çizgiyi kaldır */
color: #555; /* Metin rengi */
}

.nav-link::after {
content: '';
display: block;
height: 3px; /* Çizgi kalınlığı */
background: #000; /* Çizgi rengi siyah */
width: 0; /* Başlangıçta görünmez */
transition: width 0.3s ease; /* Geçiş efekti */
position: absolute; /* Pozisyonu ayarla */
left: 0; /* Soldan başla */
bottom: -5px; /* Metnin altında konumlandır */
}

.nav-link:hover::after {
width: 100%; /* Üzerine gelince genişlet */
}


.navbar-collapse {
    text-align: center; /* Mobilde metin ortalama */
}

@media (max-width: 992px) { /* Mobil görünüm için */
.navbar-collapse {
background-color: rgba(0, 0, 0, 0.7); /* Daha şeffaf siyah arka plan */
position: absolute; /* Menü açıldığında tam üstte konumlandır */
top: 100%; /* Üstten aşağıya doğru açılır */
left: 0; /* Soldan başla */
right: 0; /* Sağdan bitir */
width: 100%; /* Tam genişlik */
z-index: 1000; /* Diğer öğelerin üstünde görünsün */
padding: 0; /* İç boşlukları kaldır */
}

.navbar-nav .nav-link {
color: #fff; /* Yazı rengini beyaz yap */
}
}

/* Topbar - Navbar  CSS Sonu*/   


.main-header {
    position: sticky; /* Yapışkan pozisyon */
    top: 0; /* Sayfanın üstüne yapışması için */
    background-color: #343a40; /* Arka plan rengi */
    z-index: 1000; /* Diğer öğelerin üstünde kalmasını sağlamak için */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* İsteğe bağlı gölge efekti */
}

.main-header-logo {
    display: flex; /* Esnek kutu düzeni */
    align-items: center; /* Dikey olarak ortala */
    justify-content: space-between; /* Öğeleri yan yana yerleştir */
    padding: 10px; /* Üst ve alt boşluk ekleyin */
}







/* Jumbatron CSS Başı*/   

@keyframes slideIn {
    from {
        transform: translateY(-30px); /* Yukarıdan gelmesi için */
        opacity: 0; /* Başlangıçta görünmez */
    }
    to {
        transform: translateY(0);
        opacity: 1; /* Görünür hale gelmesi */
    }
}

.jumbotron {
    animation: slideIn 0.5s ease-out; /* Animasyonu uygula */
}

.jumbotron {
    overflow: hidden; /* veya auto */
}



        .card {
    opacity: 0; /* Başlangıçta görünmez */
    transform: translateY(20px); /* 20px aşağıda */
    transition: opacity 0.5s ease, transform 0.5s ease; /* Geçiş efekti */
}

.card.show {
    opacity: 1; /* Görünür hale getir */
    transform: translateY(0); /* Yükselt */
}


/* Jumbatron CSS Sonu*/   
