*{
    margin: 0;
    padding: 0;
    font-family:'Poppins', sans-serif;
    box-sizing: border-box;
}

.container{
    width: 100%;
    height: 100%;
    background-image:url("Ofis.jpg");
    background-size: cover;
    background-position: center;
    position: relative;
}

.form-box{
    width: 90%;
    max-width: 450px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background: #fff;
    padding: 50px 60px 70px;
    text-align: center;
}

.form-box h1{
    font-size: 30px;
    margin-bottom: 60px;
    color: #0f60da;;
    position: relative;
}

.form-box h1::after{
    content: '';
    width: 30px;
    height: 4px;
    border-radius: 3px;
    background: #0f60da;
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
}

.input-field{
background: #eaeaea;
margin: 15px 0;
border-radius: 3px;
display: flex;    
align-items: center;
max-height: 65px;
transition: max-height 0.5;
overflow: hidden;
}

input{
    width: 100%;
    background: transparent;
    border: 0;
    outline: 0;
    padding: 18px 15px;
}

.input-field i{
    margin-left: 15px;
    color: #999;
}

form p{
    text-align: left;
    font-size: 13px;
}

form p a{
    text-decoration: none;
    color: #0f60da;;
}

#texth{margin-top: 2px;}
#textg{margin-top:2px;float: left;}
#textj{margin-top:2px;}
.btn-field{
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.btn-field button{
    flex-basis: 48%;
    background: #0f60da;;
    color: #fff;
    height: 40px;
    border-radius: 20px;
    border: 0;
    outline: 0;
    cursor: pointer;
}

.input-group{
    height: 280px;
}

.btn-field button.disable{
    background: #eaeaea;
    color: #555;
}

#Kayitol{
    background: #0f60da;;
    color: #fff;
    height: 40px;
    font-size: 25px;
    border-radius: 20px;
    border: 0;
    outline: 0;
    cursor: pointer;
    width: 100%;
}


#Girisyap{
    background: #0f60da;;
    color: #fff;
    height: 40px;
    font-size: 25px;
    border-radius: 20px;
    border: 0;
    outline: 0;
    cursor: pointer;
    width: 100%;
}


#resetle{
    background: #0f60da;;
    color: #fff;
    height: 40px;
    font-size: 25px;
    border-radius: 20px;
    border: 0;
    outline: 0;
    cursor: pointer;
    width: 100%;
}

h1{
    color: black;
    font-size: 15px;
    border-radius: 10px;
    border: 10;
}

body {
    font-family: Arial, sans-serif;
    margin: 20px;
    background-color: #f5f5f5;
}

h1 mark {
    background-color: yellow;
    padding: 0 5px;
}

#ana {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
#fffff{background-color: white;}
#yanyana, #sol, #orta, #sağ, #menü{
    border: 1px solid #ccc;
    padding: 10px;
    background-color: #fff;
}
 #menü2 {
    border: 1px solid #ccc;
    padding: 10px;
    background-color: #fff;
 }
#yanyana2{
    display: flex;
 }
#yanyana {
    display: flex;
    gap: 20px;
}

#logo img {
    width: 100px;
}

input {
    margin: 5px 0;
    padding: 5px;
    width: 150px;
}

button {
    margin: 5px 0;
    padding: 5px 10px;
    cursor: pointer;
}

select {
    margin: 5px 0;
    padding: 5px;
    width: 160px;
}

#orta2 {
    margin-top: 20px;
}

mark {
    background-color: #ff0;
}
#evrak{visibility: hidden;margin-left: 0}
#evrak2{visibility: hidden;margin-left: -165px}
#evrak3{visibility: hidden;margin-left: -159px;}
#sonuc{color: rgb(91, 172, 91); text-align: right;}
#sonuc2{color: green; text-align: right;}
#sonuc3{color: red; text-align: right;}
#veriler2{margin-top: -213px; margin-left: 320px;}

#aciklamalar{
    border: 1px solid #ccc;
    padding: 10px;
    background-color: #fff;
}
textarea{
    width: 900px;
    max-width: 900px;
    height: 80px;
    max-height: 80px;
}
#aciklamas{
    margin-top: 0px;
}
#not{color: red;}
#bilgilendirme{margin-left: 600px;margin-top: -160px;}
#solgecisarka{width: 350; height: 160; margin-top: 250px; margin-left: 400px;}
#solgecis{width: 125px;height: 150px; margin-top: 155px; margin-left: 5px;}
#solgecisyazi{font-size: 40px;margin-left: 145px; margin-top: -130px;}
#logingeri{color: red;width: 100px;height: 50px;margin-left:0px;margin-top: 50px;}
#Hesapla{background-color: rgb(13, 123, 173); color: rgb(255, 255, 255);}
#Kaydet{margin-top: -55px; margin-left: 950px; background-color: gray;}
#Sicil{width: 100px;}
#anasayfaana{background-color: wheat;width: 700px;height: 800px;margin-left: 500px;border-style: dashed;}
#arkaplan1{background-color: #0f60da;width: 500px;height: 170px; margin-left: 100px;border-style: dashed; margin-top: 10px;}
#loginegeridon{margin-left: 110px; margin-top: -50px;}