*{padding:0;margin:0;box-sizing:border-box}html{--color-border:#fff}body{background-image:url(download.jpg);background-size:cover}.navbar{width:100%;backdrop-filter:blur(5px)}.logo{color:#fff;font-size:40px;font-weight:900;font-family:monospace}.contaner{width:80%;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:20px 30px}.navagatione ul{display:flex;column-gap:10px}.navagatione ul li{list-style-type:none}.navagatione ul li a{text-decoration:none;color:#fff;padding:10px 15px;background-color:#000;border-radius:10px;font-size:18px;transition:.5s}.navagatione ul li a:hover{color:#000;background-color:#fff}@font-face{font-family:'RobotoMonoo';src:url('RobotoMono-Regular.ttf') format('truetype')}@font-face{font-family:'OpenSans';src:url('OpenSans_Condensed-Regular.ttf') format('truetype')}.navagatione ul li a{font-family:'RobotoMonoo',sans-serif}.title-pra{width:45%;padding:30px}.title-pra h1{font-family:'RobotoMonoo',sans-serif;font-size:65px;color:#fff}.title-pra p{font-family:'RobotoMonoo',sans-serif;font-size:45px;font-weight:500;color:#fff}.background{height:100vh;display:flex;justify-items:center}.login{width:50%;margin:auto;border:3px #fff solid;border-radius:20px;backdrop-filter:blur(5px);height:60vh;align-content:space-evenly;justify-content:center}.login .contaner{width:auto;display:flex;flex-direction:column}.login .contaner .title-login{text-align:center;font-size:25px;font-weight:900;width:100%;margin-bottom:20px}.information-login form{width:auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;margin-top:20px;margin-bottom:20px}.information-login .info{padding:10px}.information-login input{padding:10px;border-radius:15px}.forgit_password a{font-size:18px;padding:10px;text-decoration:none;color:#000;transition:1s}.forgit_password a:hover{color:#fff;text-decoration:underline #fff solid;cursor:pointer}.info input[type="text"]{background:#fff0;border:2px solid #fff;padding:10px;border-radius:8px;font-size:16px;color:#fff;outline:none}.info input[type="email"]{background:#fff0;border:2px solid #fff;padding:10px;border-radius:8px;font-size:16px;color:#fff;outline:none}.info input[type="password"]{background:#fff0;border:2px #fff solid;border-radius:8px;font-size:16px;color:#fff;outline:none}.info input[type="submit"]{width:460px;background:linear-gradient(#6d6d6d,#443939,#3f2c2c);border:none;border-radius:8px;font-size:16px;color:#fff;outline:none;cursor:pointer;transition:1s}.info input[type="submit"]:hover{color:#000;background:linear-gradient(#fff,#3a3535)}.info{margin-top:10px;margin-bottom:10px}input::placeholder{color:#fff}footer .end{width:100%;font-size:20px;color:#fff;text-align:center;font-weight:500;background-color:rgb(0 0 0 / .801);padding:15px 20px}@media (min-width:320px) and (max-width:480px){.navbar .contaner ul li a{padding:7px;font-size:16px}.navbar .contaner{width:100%;justify-content:space-between;padding:10px}.title-pra{width:auto;padding:20px}.title-pra h1{font-size:40px}.title-pra p{font-size:25px}.background{height:auto;display:flex;flex-direction:column;justify-content:space-around}.information-login form{display:flex;flex-direction:column;flex-wrap:nowrap}.login{width:auto;height:auto;margin-top:25px;margin-bottom:25px}.info input[type="submit"]{width:200px}}@media (min-width:481px) and (max-width:700px){.navbar .contaner ul li a{padding:7px;font-size:16px}.navbar .contaner{width:100%;justify-content:space-between;padding:10px}.title-pra{width:auto;padding:20px}.title-pra h1{font-size:40px}.title-pra p{font-size:25px}.background{height:auto;display:flex;flex-direction:column;justify-content:space-around}.information-login form{display:flex;flex-direction:column;flex-wrap:nowrap}.login{width:auto;height:auto;margin-top:25px;margin-bottom:25px}.info input[type="submit"]{width:220px}}@media (min-width:701px) and (max-width:900px){.navbar .contaner ul li a{padding:7px;font-size:16px}.navbar .contaner{width:100%;justify-content:space-between;padding:10px}.title-pra{width:auto;padding:20px}.title-pra h1{font-size:50px}.title-pra p{font-size:30px}.background{height:auto;display:flex;flex-direction:column;justify-content:space-around;align-items:center}.login{width:70%;height:auto;margin-top:30px;margin-bottom:30px}}@media (min-width:901px) and (max-width:1200px){.navbar .contaner ul li a{padding:10px;font-size:20px}.navbar .contaner{width:95%;justify-content:space-between;padding:15px 20px}.title-pra{width:auto;padding:20px}.title-pra h1{font-size:55px}.title-pra p{font-size:40px}.background{height:100vh;display:flex;justify-items:center}.login{width:auto;height:auto;margin-right:20px}}@media (min-width:1201px) and (max-width:1320px){.login{height:auto}}@media (min-width:1321px){.login{height:auto}}