Untitled

<html><head><style>
@import url('https://fonts.googleapis.com/css?family=Montserrat:200&display=swap');
@import url('https://fonts.googleapis.com/css?family=Raleway:300&display=swap');
@import url('https://fonts.googleapis.com/css?family=Raleway&display=swap');

.title {
  font-family: 'Montserrat', sans-serif;
}
.sub {
  font-family: 'Raleway', sans-serif;
}
.ui {
  font-family: 'Raleway', sans-serif;
}
input[type=text]{
    width:100%;
    border:2px solid #aaa;
    border-radius:4px;
    margin:8px 0;
    outline:none;
    padding:8px;
    box-sizing:border-box;
    transition:.3s;
  }

  input[type=text]:focus{
    border-color:dodgerBlue;
    box-shadow:0 0 8px 0 dodgerBlue;
  }
input[type=password]{
    width:100%;
    border:2px solid #aaa;
    border-radius:4px;
    margin:8px 0;
    outline:none;
    padding:8px;
    box-sizing:border-box;
    transition:.3s;
  }

  input[type=password]:focus{
    border-color:dodgerBlue;
    box-shadow:0 0 8px 0 dodgerBlue;
  }

</style></head>
    <body>
    <div style="background-color:#383838;padding: 15px; width:350px; height:340px; border:3px solid #73AD21; position:absolute; left:300px; top:200px;">
        <h1 style="color:#E8E8E8; text-align:center; font-size:40px;"><span class="title">Welcome!</span></h1>
        <h2 style="color:#B0B0B0; text-align:center; font-size:15px;"><span class="sub">Enter the required information to continue</span></h2><br>
        <b><p style="font-size:90%;"><font color="#BEBEBE"><span class="ui">USERNAME</span></font></p></b>
        <input type="text" value="" id="username" placeholder="Enter usernmane here: "><br><br>
        <input type="submit" value="Submit">
    </div>

    <div style="height:1000px; border-left: 6px red solid; right: 400px; position:absolute;"></div>

    </body></html>