html{
    scroll-behavior: smooth;
    /* background: linear-gradient(to left, #023866, rgb(20, 90, 114));*/
    /* background: linear-gradient(to right, rgb(50,50,125), rgb(128, 128, 128)); */
    background: linear-gradient(to right, rgb(31, 60, 118), rgb(86, 86, 86));
}
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    list-style: none;
    text-decoration: none;
}
body{
    font-family: 'Montserrat', sans-serif;
}
img {
    width: 100%;
}
section{
    padding: 80px 0;
}
/*HEADER*/
header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    background-color: #fff;
    background-size: auto;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
}
.nav_logo_kisim{
    width: auto;
    height: 50px;
}
.nav_menu_kisim {
    display: flex;
    justify-content: space-between;
    flex: 1;
    position: sticky;
}
.nav_menu_sol_kisim, .nav_menu_sag_kisim {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
}
.nav_menu_sol_kisim li, .nav_menu_sag_kisim li {
    margin-left: 20px;
}
.nav_menu_sag_kisim{
    margin-right: 25px;
}
.nav_menu_tusu {
    font-family: fantasy;
}
a.nav_menu_secenek {
    padding: 20px;
    text-decoration: none;
    color: black;
    font-size: 16px;
    border-radius: 25px;
    transition: background-color 0.3s;
}
a.nav_menu_secenek:hover {
    color: grey;
    border-width: 5px;
    border-radius: 25px;
    background-color: black;
}
.nav_menu_sag_kisim_ek_bolum {
    display: none;
    position: absolute;
    top: 35px;
    right: 40px;
    background-color: gray;
    list-style-type: none;
    padding: 0;
    margin: 0;
    z-index: 1;
    border-radius: 25px;
    justify-content: center;
    align-items: center;

}
.nav_menu_tusu:hover .nav_menu_sag_kisim_ek_bolum {
    display: flex;
    flex-direction: column;
}
.nav_menu_sag_kisim_ek_bolum li a {
    width: 50px;
    height: 20px;
    padding: 25px 20px;
    color: black;
    text-decoration: none;
    display: block;
    justify-content: center;
    transition: background-color 0.3s;
    border-radius: 25px;
    box-sizing: content-box !important;
}
.nav_menu_sag_kisim_ek_bolum li a:hover {
    background-color: cyan;
    border-radius: 25px;
}
/*ANASAYFA ÜST */
#anasayfa_ust_kisim{
    width: 80%;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}
#anasayfa_bos_div{
    background: linear-gradient(to right, rgb(13, 13, 86),black);
    padding: 20px;
}
.inner_anasayfa_ust_kisim{
    overflow: hidden;
    width: 100%;
    position: relative;
    margin: 0 auto;
    
}
.inner_child_anasayfa_ust_kisim_kayan_resimler{
    width: 200%;
    animation: 10s slayt infinite;
    position: relative;
    left: 0;
}
.inner_child_anasayfa_ust_kisim_kayan_resimler img{
    width: 50%;
    float: left;
}
@keyframes slayt {
    0% { left: 0%; }
    20% { left: 0%; }
    40% { left: -100%; }
    60% { left: -100%; }
    100% { left: 0%; }
}
/*ANASAYFA ORTA */
.inner_anasayfa_orta_kisim{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    width: 80%;
    margin: 0 auto;
}
.inner_child_anasayfa_orta_kisim{
    flex-basis: 24%;
    padding: 10px 10px;
}
.inner_child_anasayfa_orta_kisim_link_resim{
    transition: transform 0.3s ease;
}
.inner_child_anasayfa_orta_kisim_link_resim:hover{
    transform: scale(1.1);
}
/*ANASAYFA EN ALT*/
.inner_anasayfa_alt_kisim{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto;
    width: 80%;
    color: #fff;
}
.inner_child_anasayfa_alt_kisim{
    flex-basis: 45%;
}
.inner_child_anasayfa_alt_kisim p{
    font-size: 30px;
}
.inner_child_anasayfa_alt_kisim img{
    border-radius: 50%;
    box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.5);
}
/*HAKKIMIZDA*/
#hakkimizda_birinci_kisim{
    width: 80%;
    margin: 0 auto;
    padding: 100px 0 50px 0;
}
#hakkimizda_birinci_kisim p{
    font-size: x-large;
    color: #fff;
}
/*HAKKIMIZDA 2.KİSİM*/
#hakkimizda_ikinci_kisim, #hakkimizda_ucuncu_kisim, #hakkimizda_dorduncu_kisim{
    width: 80%;
    margin: 0 auto;
    padding: 40px 0;
}
.inner_hakkimizda_ic_kisim{
    background-color: #fff;
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-basis: 45%;
}
.inner_hakkimizda_ic_kisim p{
    color: black;
    font-size: x-large;
}
.inner_child_hakkimizda_ic_kisim img{
    padding: 10px 15px;
    width: 300px;
    border-radius: 30px;
}
.inner_child_hakkimizda_ic_kisim{
    display: flex;
    flex-direction: column;
}
.inner_child_hakkimizda_ic_kisim_button{
    font-size: small;
    align-self: flex-end;
    margin: auto 20px;
    background-color: black;
    color: #fff;
    border: 2px solid black;
    padding: 10px 15px;
    border-radius: 20px;
    width: auto;
    max-width: 200px;
    transition: 0.3s ease;
}
.inner_child_hakkimizda_ic_kisim_button:hover{
    background-color: #fff;
    color: black;
}
#urunler_ust_kisim{
    width: 80%;
    margin: 0 auto;
    padding: 110px 0;
}
.inner_urunler_ust_kisim{
    width: 80%;
    display: grid;
    grid-gap: 80px;
    grid-template-columns: repeat(2, 1fr);
    margin: 0 auto;
}
.inner_child_urunler_ust_kisim{
    width: 100%;
    justify-content: center;
    align-items: center;
}
.inner_child_urunler_ust_kisim_link_resim{
    transition: transform 0.3s ease;
    margin: 0 auto;
}
.inner_child_urunler_ust_kisim_link_resim:hover{
    transform: scale(1.1);
}
/*URUNLER SAYFA TEK TEK 1.KİSİM*/
#urunler_tek_tek_sayfa_birinci_kisim{
    width: 80%;
    margin: 0 auto;
    padding: 100px 0 10px 0;
}
.inner_urunler_tek_tek_sayfa_birinci_kisim{
    width: 70%;
    margin: 0 auto;
    flex-basis: 45%;
}
/*URUNLER SAYFA TEK TEK 2.KİSİM*/
#urunler_tek_tek_sayfa_ikinci_kisim, #urunler_tek_tek_sayfa_ucuncu_kisim, #urunler_tek_tek_sayfa_dorduncu_kisim{
    width: 80%;
    margin: 0 auto;
}
.inner_urunler_tek_tek_sayfa_ic_kisim{
    width: 80%;
    margin: 0 auto;
}
.inner_child_urunler_tek_tek_sayfa_ic_kisim{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-basis: 45%;
    margin: 0 auto;
    text-align: center;
    width: 80%;
}
.inner_child_urunler_tek_tek_sayfa_ic_kisim p, .inner_child_urunler_tek_tek_sayfa_ic_kisim h1{
    color: #fff;
    padding: 0 0 20px 0;
}
.inner_child_urunler_tek_tek_sayfa_ic_kisim p{
    font-size: 30px;
}
.inner_child_urunler_tek_tek_sayfa_ic_kisim h1{
    font-size: 50px;
}
.inner_child_urunler_tek_tek_sayfa_ic_kisim img{
    border-radius: 50px;
    width: 400px;
}
/*ONERI*/
#iletisim_birinci_kutu,#iletisim_ikinci_kutu{
    width: 80%;
    margin: 0 auto
}
#iletisim_ikinci_kutu{
    display: flex;
    justify-content: space-between;
}
.child_kisi_resim_iletisim_kutu{
    width: 200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
#iletisim_ikinci_kisim .inner_iletisim_kutu{
    width: 50%;
    /* display: flex;
    justify-content: left; */
}
.child_kisi_resim_iletisim_kutu img{
    border-radius: 50%;
    margin: 0 auto;
}
.child_kisi_resim_iletisim_kutu p{
    font-size: 30px;
    color: #fff;
    margin: 10px 0;
    text-align: center;
}
.inner_iletisim_kutu{
    width: 80%;
    margin: 0 auto;
    justify-content: center;
}
.child_iletisim_lazim_kutu{
    width: 50%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.child_iletisim_kutu{
    display: flex;
    align-items: center;
    justify-content: left;
    width: 100%;
    margin: 0 auto;
}
.child_iletisim_kutu img{
    width: 40px;
}
.child_iletisim_kutu p a{
    font-size: 20px;
    color: #fff;
    white-space: nowrap;
}
/*ONERI*/
#oneri_genel{
    width: 80%;
    margin: 0 auto;
}
.inner_oneri_genel{
    width: 80%;
    margin: 0 auto;
}
.inner_oneri_genel form{
    display: flex;
    flex-direction: column;
}
.inner_oneri_genel form label{
    font-size: 50px;
    color: #fff;
}
.inner_oneri_genel form textarea{
    height: 200px;
    font-size: 25px;
    border-radius: 10px;
    transition: all 0.3s;
    background-color: darkgray;
}
.oneri_butonlar{
    display: flex;
}
.oneri_butonlar input{
    width: 150px;
    font-size: 25px;
    border-radius: 25px;
    margin: 10px;
    transition: all 0.3s ease-in-out;
}
.inner_oneri_genel form input:hover{
    border-color: #fff;
    background-color: black;
    color: #fff;
}
/*RESPONSİVE*/
@media (max-width: 768px) {
    #anasayfa_ust_kisim{
        width: 100%;
        padding: 80px 0 0 0;
    }
    #anasayfa_bos_div{
        margin: 20px 0;
    }
    #anasayfa_orta_kisim ,#anasayfa_alt_kisim{
        padding: 10px;
    }
    .inner_anasayfa_ust_kisim{
        width: 100%;
    }
    .inner_anasayfa_orta_kisim {
        width: 80%;
    }
    .inner_child_anasayfa_orta_kisim {
        flex-basis: 48%;
    }
    .inner_child_anasayfa_alt_kisim p{
        font-size: 10px !important;
    }
    #urunler_ust_kisim{
        width: 80% !important;
    }
    .inner_urunler_ust_kisim{
        width: 90% !important;
        grid-gap: 20px !important;
        margin: 0 auto;
    }
    #hakkimizda_birinci_kisim p{
        font-size: 15px !important;
        color: #fff;
    }
    .inner_hakkimizda_ic_kisim p{
        color: black;
        font-size: 15px !important;
    }
    .inner_child_hakkimizda_ic_kisim_button{
        font-size: 10px !important;
    }
    .inner_hakkimizda_ic_kisim{
        display: flex;
        flex-direction: column;
    }
    .inner_child_hakkimizda_ic_kisim img{
        width: 200px;
    }
    #urunler_ust_kisim{
        width: 75% !important;
    }
    .inner_urunler_ust_kisim{
        width: 90% !important;
        display: flex;
        flex-direction: column;
        margin: 0 auto;
    }
    #urunler_tek_tek_sayfa_birinci_kisim{
        width: 100% !important;
        padding: 80px 0 70px 0;
    }
    #urunler_tek_tek_sayfa_ikinci_kisim, #urunler_tek_tek_sayfa_ucuncu_kisim, #urunler_tek_tek_sayfa_dorduncu_kisim{
        width: 100% !important;
        padding: 0 0 70px 0;
    }
    .inner_urunler_tek_tek_sayfa_birinci_kisim, .inner_urunler_tek_tek_sayfa_ic_kisim{
        width: 100% !important;
    }
    .inner_child_urunler_tek_tek_sayfa_ic_kisim p{
        font-size: 15px !important;
    }
    .inner_child_urunler_tek_tek_sayfa_ic_kisim h1{
        font-size: 30px !important;
    }
    .inner_child_urunler_tek_tek_sayfa_ic_kisim img{
        width: 200px !important;
    }
    #iletisim_birinci_kutu,#iletisim_ikinci_kutu{
        width: 80%;
        display: flex;
        flex-direction: column;
    }
    #iletisim_ikinci_kutu{
        padding: 0;
    }
    #iletisim_birinci_kutu{
        padding: 80px 0 0 0;
    }
    .child_kisi_resim_iletisim_kutu{
        width: 100px;
        margin: 0;
    }
    .inner_iletisim_kutu{
        width: 100%;
        padding: 40px 0 40px 0;
        margin: 0 auto;
    }
    .child_iletisim_lazim_kutu{
        width: 50%;
        margin: 0 auto;
    }
    .child_iletisim_kutu{
        width: 100%;
        margin: 0 auto;
    }
    .child_iletisim_kutu img{
        width: 25px;
    }
    .child_iletisim_kutu p,.child_kisi_resim_iletisim_kutu p{
        font-size: 10px;
    }
    .oneri_butonlar{
        flex-direction: column;
    }

}
/*HEADER*/
@media screen and (max-width: 568px) {
    .nav_menu_kisim {
        flex-direction: column;
        align-items: center;
        margin-right: 20px;
    }
    .nav_menu_sol_kisim{
        width: 100%;
        justify-content: right;
        margin: 0;
    }
    .nav_menu_sag_kisim{
        width: 100%;
        justify-content: right;
        margin-right: 0;
    }

    .nav_menu_sag_kisim li{
        margin: 10px 0 0 0;
    } 
    .nav_menu_sol_kisim li, .nav_menu_sag_kisim li {
        margin-left: 15px;
    }
    a.nav_menu_secenek {
        font-size: 14px;
        padding: 15px 5px;
    }
    .nav_menu_sag_kisim_ek_bolum {
        right: 0;
        top: 40px;
    }
    .nav_logo_kisim {
        height: 40px;
    }
}