<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <section style="height: 100vh;"> <div style="background-image: url(images/arka.jpg); background-attachment: fixed; background-size: cover; width: 100%; height: 100vh; position: relative;" > <div class="baslik"> <b style="font-size: 101px; text-align: center; margin-bottom: -21px; display: block;">LOGO</b> <span style="font-size: 19px; text-align: center; display: block; margin-bottom: 25px;">THI Insurance app</span> </div> <section> <form method="post" action=""> <div class="arkalogin"> <div class="loginbaslik">Admin Login</div> <hr style="border: 1px solid #ccc;"> <input class="giris" type="text" name="kadi" placeholder="User"> <input class="giris" type="password" name="sifre" placeholder="•••••"> <a href="https://dogukankeskin.com" target="blank"><input class="butonlogin" type="submit" name="" value="login"></a> </div> </form> </section><br> <span style="font-size: 23px; text-align: center; display: block; color: #E6E6E6; ">Welcome To The Admin Panel</span> <span style="font-size: 24px; text-align: center; display: block; color: #fff; font-weight: bold; margin-bottom: 34px; ">LOGİN</span> <span style="font-size: 17px; text-align: center; display: block; color: #fff; ">Powered by Centric Data</span> </div> </section>

body { background: linear-gradient(132deg, #7af442, #28a51f, #e9ed1e, #d1ed1e, #edcd1e, #edb51e); background-size: 400% 400%; animation: BackgroundGradient 30s ease infinite; } @keyframes BackgroundGradient { 0% {background-position: 0% 50%;} 50% {background-position: 100% 50%;} 100% {background-position: 0% 50%;} } .baslik { color: #fff; text-align: center; font-family: 'Fira Sans', sans-serif; } .arkalogin { width: 300px; text-align: center; background: #fff; height: 300px; padding: 10px; margin: 50px auto; } .loginbaslik { color: #888888; text-align: left; font-size: 19px; margin-top: 15px; } .giris { width: 100%; height: 40px; margin-top: 10px; border: none; background: #E5E5E5; outline: none; padding: 0 10px; } .butonlogin { width: 100%; margin-top: 10px; height: 40px; font-weight: bold; background: #2196F3; border: none; color: #fff; transition: all 250ms; } .butonlogin:hover { background: #1E88E5; } body { margin: 0; }