modifica este html para que el logo este mas grande y la interfaz de logeo este centrada <!DOCTYPE html> <html style="font-size: 16px;" lang="tr"> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta charset="utf-8"> <meta name="keywords" content=""> <meta name="description" content="mello topluluÄŸu iÃ§in geliÅŸtirilmiÅŸtir."> <meta name="page_type" content="np-template-header-footer-from-plugin"> <title>Sparrow-mta - mello</title> <link rel="stylesheet" href="mello.css" media="screen"> <script class="u-script" type="text/javascript" src="jquery.js" defer=""></script> <script class="u-script" type="text/javascript" src="mello.js" defer=""></script> <meta name="generator" content="Mello 1.0.0, sparrow-mta.blogspot.com"> <meta property="og:title" content="Sparrow-mta - mello"> <meta property="og:description" content="mello topluluÄŸu iÃ§in geliÅŸtirilmiÅŸtir."> <meta property="og:image" content="static/SparroWMTA-Scriptleri.png"> <link id="u-theme-google-font" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i|Open+Sans:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i"> <script> function closeAlert() { document.getElementById("alert").innerHTML = ""; } function login() { var username = document.getElementById("loginUser ").value; var password = document.getElementById("loginPass").value; var checksave = document.getElementById("loginSave").checked; mta.triggerEvent("submitLogin", username, password, checksave); } function register() { var username = document.getElementById("registerUser ").value; var password = document.getElementById("registerPass").value; var repassword = document.getElementById("registerRepeatPass").value; mta.triggerEvent("submitRegister", username, password, repassword); } function showPass() { var inputpass = document.getElementById("loginPass"); var eyeimg = document.getElementsByClassName("show-password")[0]; if (inputpass.type === "password") { inputpass.type = "text"; eyeimg.src = "static/fa-eye-slash.svg"; } else { inputpass.type = "password"; eyeimg.src = "static/fa-eye.svg"; } } </script> <script type="application/ld+json">{ "@context": "http://schema.org", "@type": "Organization", "name": "Mello login screen" }</script> <meta name="theme-color" content="#478ac9"> <meta property="og:type" content="website"> <style> /* Estilos para mejorar la visibilidad */ .u-input { background-color: rgba(255, 255, 255, 0.9); /* Fondo blanco con opacidad */ color: #333; /* Color de texto oscuro */ border: 1px solid #ccc; /* Borde gris claro */ border-radius: 5px; /* Bordes redondeados */ padding: 10px; /* Espaciado interno */ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Sombra para dar profundidad */ } .u-input:focus { border-color: #4CAF50; /* Color del borde al enfocar (verde) */ outline: none; /* Sin contorno */ } .u-text { color: #fff; /* Color de texto blanco para los encabezados */ } .u-button { background-color: #4CAF50; /* Color de fondo del botÃ³n (verde) */ color: #fff; /* Color de texto del botÃ³n */ padding: 10px 20px; /* Espaciado interno del botÃ³n */ border: none; /* Sin borde */ border-radius: 5px; /* Bordes redondeados */ cursor: pointer; /* Cambia el cursor al pasar sobre el botÃ³n */ } .u-button:hover { background-color: #45a049; /* Color de fondo del botÃ³n al pasar el mouse (verde mÃ¡s oscuro) */ } /* Estilo para el contenedor de inicio de sesiÃ³n */ .u-container-style { background-color: rgba(76, 175, 80, 0.8); /* Fondo verde con opacidad */ border-radius: 10px; /* Bordes redondeados */ padding: 20px; /* Espaciado interno */ box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* Sombra para dar profundidad */ } </style> </head> <body developer="mello" description="mello topluluÄŸu iÃ§in geliÅŸtirilmiÅŸtir." class="u-body u-xl-mode"> <header class="u-align-left u-clearfix u-custom-color-1 u-header u-sticky u-sticky-55d9 u-header" id="sec-3f84"> <div class="u-align-left u-expanded-height u-left-0 u-uploaded-video u-video u-video-cover u-video-1">  <div class="embed-responsive" style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;"> <video class="embed-responsive-item" data-autoplay="1" loop="" muted="" poster="static/mello.jpg" autoplay="autoplay" playsinline=""> <source src="files/video.webm" type="video/webm"> <p>Su navegador no soporta el formato webm(video).</p> </video> </div> </div>  <div class="u-container-style u-group u-group-1" style="position: relative; z-index: 1;"> <div class="u-container-layout u-container-layout-1"> <img class="u-image u-image-default u-preserve-proportions u-image-1" src="static/sparrow.png" alt="" data-image-width="48" data-image-height="48"> <h3 class="u-text u-text-default u-text-1"> <span style="font-weight: 700;">Login</span> </h3>  <div class="u-form u-form-1"> <div class="u-clearfix u-form-spacing-15 u-form-vertical u-inner-form" style="padding: 0px;"> <div class="u-form-group u-form-name u-label-none u-form-group-1"> <label for="loginUser " class="u-label"></label> <input id="loginUser " type="text" placeholder="Nombre de usuario" class="u-border-1 u-border-grey-30 u-input u-input-rectangle"> </div> <div class="u-form-password u-form-group u-label-none u-form-group-2"> <label for="loginPass" class="u-label"></label> <input id="loginPass" type="password" placeholder="ContraseÃ±a" class="u-border-1 u-border-grey-30 u-input u-input-rectangle"> </div> <div id="alert"></div> <div class="u-form-check u-form group u-label-none u-form-group-3"> <input id="loginSave" type="checkbox" class="check"> <label for="loginSave"><span class="icon"></span> RECORDAR</label> </div> <div class="u-align-right u-form-group u-form-submit u-form-group-4"> <input type="submit" class="u-form-control-hidden" value="" onclick="login()"> </div> </div>  <div class="container"> <div class="u-popup-box"> <a class="close-button popup-close" title="close">Ã—</a> <h2>Registrarse</h2>  <div class="u-clearfix u-form-spacing-15 u-form-vertical u-inner-form" style="padding: 0px;"> <div class="u-form-group u-form-name u-label-none u-form-group-1"> <label for="registerUser " class="u-label"></label> <input id="registerUser " type="text" placeholder="Nombre de usuario" class="u-border-1 u-border-grey-30 u-input u-input-rectangle"> </div> <div class="u-form-password u-form-group u-label-none u-form-group-2"> <label for="registerPass" class="u-label"></label> <input id="registerPass" type="password" placeholder="ContraseÃ±a" class="u-border-1 u-border-grey-30 u-input u-input-rectangle"> </div> <div class="u-form-password u-form-group u-label-none u-form-group-2"> <label for="registerRepeatPass" class="u-label"></label> <input id="registerRepeatPass" type="password" placeholder="Repetir ContraseÃ±a" class="u-border-1 u-border-grey-30 u-input u-input-rectangle"> </div> <div class="u-align-right u-form-group u-form-submit u-form-group-4"> <input type="submit" class="u-form-control-hidden" value="" onclick="register()"> </div> </div> </div> </div> <a class="u-button u-button-default button">Crear una cuenta</a> <h6 class="u-text u-text-default u-text-palette-5-dark-1 u-text-3">v1.0.0</h6> </div> </div> </div> </header> <script> const container = document.querySelector(".container"); const button = document.querySelector(".button"); const closeButton = document.querySelector(".close-button"); function togglecontainer() { container.classList.toggle("show-container"); } function windowOnClick(event) { if (event.target === container) { togglecontainer(); } } button.addEventListener("click", togglecontainer); closeButton.addEventListener("click", togglecontainer); window.addEventListener("click", windowOnClick); </script> </body> </html> null generate-html-from-description