html {
    background: #6441A5; 
    font-family: arial;
    background: linear-gradient(90deg, #050505 0%, #134048 100%);
}
body{
    background-color: #ffffff00 !important;
}
.input--hide {
  position: absolute;
  left: -9999px;
  opacity: 0;
  transiton: opacity .3s ease;
}

.input--show {
  opacity: 1;
  position: static;
}

/* You can ignore this styling */
label { 
    display: block; 
    margin-bottom: 1em; 
    font-weight: bold; 
    color: white;
} 
.wrapper { 
    display: flex;
    justify-content: space-between; 
} 
form { 
    background: linear-gradient(310deg, #957709 0%, rgba(153, 153, 153, 0.10) 52%, rgba(204, 204, 204, 0.10) 100%);
    padding: 1em; width: 300px; 
} 
select, input[type=text] { 
    display: block; 
}
h2 { 
    color: #bbb; 
    margin: 0 0 1em; 
    font-style: italic; 
} 
[type=submit] { 
    appearance: none; 
    background: lightblue; 
    width: 100px;
    background: #ee0979;
    font-weight: bold;
    color: white;
    border: 0 none;
    border-radius: 25px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 5px;
}
[type=submit]:hover,[type=submit]:focus{
    box-shadow: 0 0 0 2px white, 0 0 0 3px #ee0979;
}