<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div style="opacity: 0.1;">
<center>
<audio src="unforgiven.mp3" controls autoplay></audio>
</center>
<main>
<style>
body{
background-color: rgb(32, 31, 31);
background-image: url(https://wallpapercave.com/wp/wp2661567.jpg);
}
input{
position: relative;
border: 3px solid #3498db;
left: 10px;;
bottom: 470;
width: 230px;
height: 50px;
border-radius: 24px;
outline: none;
background-color: rgb(32, 31, 31);
opacity: 0.7;
}
button{
position: relative;
left: 10px;;
bottom: 425;
width: 100px;
height: 45px;
background-color: rgb(17, 16, 16);
border-radius: 15px;
opacity: 0.7;
font-family: monospace;
}
.locater{
position: relative;
left: 10px;
bottom: 640;
width: 230px;
height: 50px;
border-radius: 24px;
outline: none;
}
.duz-cerceve{
border: 1px solid white;
width:350px;
height:400px;
margin: 250px 780px;
background-color: none;
box-shadow: 15px 15px 15px #000;
}b
h1{
color: whitesmoke;
}
:placeholder{
color: white;
text-align: center;
}
audio{
width: 100px;
}
</style>
<div>
<div class="WebContainer articles"></div>
<div class="duz-cerceve"><center><h1 style=" color: rgb(255, 255, 255); font-family: fantasy; font-weight: 50;">Giriş Yap</h1></center></div>
<div class="normal-cerceve"></div>
<form action="">
<center>
<input type="password" placeholder="Şifre" required style="color: white; text-align: center;">
<br>
<button type="submit"> <div style="color: rgb(209, 181, 181);">Giriş Yap</div> </button>
<br>
<input class="locater" type="text" placeholder="Kullanıcı Adı" required style="color: white; text-align: center;">
</center>
</div>
</form>
</main>
</body>
</html>