@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
.base{height:100%;display: flex;justify-content: center; align-items: center; background-color: var(--scheme-background);flex-direction:column ;}
.base div.fc{background-color: var(--scheme-box); margin: 10px; text-align: center; line-height: 100px; font-size: 50px;position:relative; border:1px solid var(--scheme-border); box-shadow:0.3em 0.3em 0.4em var(--scheme-shadow);color:var(--scheme-fontcolor);font-family:"Roboto", sans-serif;font-size:14px;outline:2px solid transparent;transition: outline .50s ease-in-out}
.base span.fc{margin: 10px; text-align: center; font-size: 50px;position:relative;color:var(--scheme-fontcolor);font-family:"Roboto", sans-serif;font-size:14px;}
img.logo{display:block;margin:2em auto;width:12em}
input{box-sizing: border-box;width:15em;font-family:"Roboto", sans-serif;font-size:1.1em;color:var(--scheme-fontcolor);display:block;margin:0.25em 1em 0 1em;border:0.1em solid var(--scheme-border);border-radius:.7em;padding:0.5em;outline: none;transition: box-shadow .50s ease-in-out}
input:focus, input:hover{box-shadow:0 0 0.9em 0em var(--scheme-shadow)}
input:last-of-type{margin-bottom:1em;}
input[type=submit]{margin-top:1em}