html{
    font-size: 16px;
    margin: 0;
    padding: 0;
}

body {
    background-color: #1F6195;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    margin: 1em;
}

section#splash{
    display: grid;
        grid-gap: 1em;
    margin: 0;
    padding: 0;
    position: absolute;
        top: 50%;
        left: 50%;
    text-align: center;
    transform:translate(-50%, -50%);
    width: 80%;
    max-width: 450px;
}

p {
    margin: 0;
    padding: 1em;
    text-align: center;
}

a:link, a:visited, a:active {
    color: #fff;
    text-decoration: none;
}

a:hover {
    color: #999;
}

section svg#luckier_when_prepared {
    margin: 0 auto;
    padding: 2em;
    width: 65%;
}

form{
    display: grid;
    grid-template-columns: 3fr 1fr;
    grid-gap: .5em;
    margin-top: 2em;
}

input{
    font-family: inherit;
}

input[type="email"], input[type="submit"]{
    background-color: #1F6195;
    border: none;
    color: #000;
    padding: .5em;
    margin: 0;
}

input[type="email"]{
    border-bottom: 1px solid #000;
    text-align: center;
    transition: background-color .5s;
}

input[type="email"]:focus{
    background-color: #fff;
}

input[type="email"]::placeholder{
    color: #000;
}

input[type="submit"]{
    border: 1px solid #000;
    transition: background-color .5s;
}
input[type="submit"]:active{
    background-color: #000;
    color: #1F6195;
}