*{
    box-sizing: border-box;
}
body{
    font-family: 'Nunito', sans-serif;
    margin:0;
}
#menu{
    height: 100px;
    padding:0 20px;
}

nav a img {
    width: 100px; /* İstediğiniz genişliği ayarlayın */
    height: auto; /* Orantıyı korumak için height otomatik */
}

nav{
    float:right;
    line-height:80px;
}
nav a:link{
    text-decoration: none;
    margin-right:25px;
    color:#003666;
}
nav a:hover{
    border-bottom: 3px solid;
    color:#003666;
}
nav a:visited{
    margin-right:25px;
    color:#003666;
}
#anasayfa{
    background-color: gray;
    height:600px;
    background-image: url("../images/home.png");
    background-size:cover;
    background-position: center;
    background-attachment: fixed;
}
#black{
    height:600px;
    background-color: black;
    opacity: 0.3;
}
#hakkimizda{
    background-color: #f8f9fa;
    padding:50px;
    text-align: center;
    text-transform: capitalize;
    font-weight:600
}
h2{
    font-size:55px;
    color:#003666;
    text-shadow: 0px 1px 1px black;
    font-weight:600
}
#container{
    width:1300px;
    height:auto;
    margin:auto;
}
#sol{
    float:left;
    border-right:3px solid #445c6e;
    font-size: 30px;
    width:400px;
    color: #445c6e;
}
#h5sol{
    line-height: 1.6;
    font-size:25px;
    font-weight: 600;
}
#h5sol, #sag{
    margin:0;
    padding:0;
    margin-top:20px; 
}
span{
    font-size:50px;
    margin-right: -50px;
    line-height: 50px;
    color:003666;
    font-weight:600;
    float:left;
}
#sag{
    float:right;
    width:760px;
    color:#999999;
    text-align:center;
    letter-spacing: 2px;
    font-size: 15px;
    line-height: 1.8;
    font-weight: 100;
}
.img-fluid{
    max-width: 100%;
    height: auto;
}
.mt100{
    margin-top:100px;
}
#pson{
    color:#999;
    letter-spacing:1px;
    font-size:15px;
    line-height: 1.8;
    margin-top:30px;
    font-weight:100;
}
#egitimler{
    background-color: #fff;
    padding: 50px;
    text-align: center;
    height:700px;
}
.card{
    width:320px;
    height:350px;
    border:1px solid #ddd;
    padding: 0;
    display: inline-block;
}
h3{
    font-size:55px;
    color:#003666;
    text-shadow: 0px 1px 1px black;
    font-weight:600 
}
.baslikcard{
    font-size:15px;
    color:#003666
}
.cardp{
   color:#888; 
}
.card:hover{
    border: 2px solid black;
}
#logo {
    position: absolute;
    top: 10px; /* Üstten mesafe */
    left: 10px; /* Soldan mesafe */
    z-index: 1000; /* Üstte görünmesi için z-index değeri */
}
#logo img {
    height: 90px; /* Logonun yüksekliği */
    width: auto;  /* Oranları koruyarak genişliği otomatik ayarlar */
}
#iletisim {
    background-color: #f1f1f1; /* Arka plan rengi */
    padding: 40px 0; /* Üst ve alt boşluk */
    text-align: center; /* Metin hizalama */
    width: 100%; /* Genişlik */
}
#iletisim .container {
    max-width: 1200px; /* Maksimum genişlik */
    margin: 0 auto; /* Ortaya hizalama */
    padding: 0 20px; /* Sağ ve sol boşluk */
}
.contact-content {
    background-color: #ffffff; /* İçerik arka plan rengi */
    padding: 30px; /* İçerik boşlukları */
    border-radius: 10px; /* Köşe yuvarlama */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Gölge efekti */
}
.contact-content h2 {
    margin-top: 0;
}
.contact-content img {
    width: 80%; /* Resim genişliği */
    max-width: 600px; /* Maksimum genişlik */
    height: auto; /* Yüksekliği otomatik ayarla */
    margin-top: 20px;
    border-radius: 10px; /* Köşe yuvarlama */
}
#footer {
    background-color: #333; /* Arka plan rengi */
    color: #fff; /* Yazı rengi */
    text-align: center; /* Metin hizalama */
    padding: 20px 0; /* Üst ve alt boşluk */
    position: relative;
    bottom: 0;
    width: 100%;
}
#footer .container {
    max-width: 1200px; /* Maksimum genişlik */
    margin: 0 auto; /* Ortaya hizalama */
    padding: 0 20px; /* Sağ ve sol boşluk */
}
#hizmetlerimiz{
    background-color: #fff;
    padding: 50px;
    text-align: center;
    height:700px;
}
#h3sol, #sol{
    margin:0;
    padding:0;
    margin-top:5px; 
}
.product-image {
    margin: 20px 0;
    text-align: center;
    width: 100%;
    max-width: 600px; /* Resimlerin maksimum genişliğini ayarlayın */
}
.product-image img {
    width: 1000px; /* Resimlerin maksimum genişliğini daha küçük yapın */
    height:  650px;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;
}
.egitim-image {
    margin: 20px 0;
    text-align: center;
    width: 100%;
    max-width: 600px; /* Resimlerin maksimum genişliğini ayarlayın */
}
.egitim-image img {
    width: 800px; /* Resimlerin maksimum genişliğini daha küçük yapın */
    height:  450px;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;
}

/* Mobil cihazlar için stiller */
@media only screen and (max-width: 600px) {
    nav {
        float: none;
        text-align: center;
        line-height: 50px;
    }
    nav a {
        display: block;
        margin: 10px 0;
    }
    #menu {
        height: auto;
        padding: 10px 20px;
    }
    #anasayfa {
        height: auto;
    }
    #black {
        height: auto;
        opacity: 0.7;
    }
    #hakkimizda {
        padding: 20px;
    }
    h2 {
        font-size: 35px;
    }
    #sol, #sag {
        float: none;
        width: 100%;
        border-right: none;
    }
    span {
        font-size: 30px;
    }
    #psag {
        text-align: left;
    }
    .card {
        width: 100%;
        margin-bottom: 20px;
    }
    .product-image img,
    .egitim-image img {
        width: 100%;
        height: auto;
    }
    h3 {
        font-size: 35px;
    }
    .card {
        width: 100%;
        margin-bottom: 20px;
    }
    #footer {
        position: relative; /* Mobilde esnek yerleşim için position relative yapıldı */
    }
}