* {
    background-color: rgb(10, 123, 252);
    font-family: monospace;
}

main {
    padding: 20px;
}

section {
    background-color: white;
    color: black;
    border: none;
    border-radius: 10px;
    padding: 30px;
}

section > * {
    background-color: white;
    margin-top: 5px;
    margin-bottom: 5px;
}

section > input {
    padding: 5px;
}

section > input[type=text], section > input[type=number] {
    border: solid 2px black;
    border-radius: 7px;
}

section > button {
    background-color: rgb(0, 140, 255);
    color: white;
    border: solid 2px rgb(0, 90, 163);
    border-radius: 8px;
    padding: 10px;
    transition-duration: 0.2s;
}

section > button:hover {
    cursor: pointer;
    background-color: rgb(0, 122, 223);
    border: solid 2px rgb(0, 71, 129);
}

section > button:active {
    background-color: rgb(0, 107, 194);
    border: solid 2px rgb(0, 49, 88);
}

section > span {
    background-color: whitesmoke;
    color: rgb(107, 107, 107);
    border: solid 1px rgb(63, 63, 63);
    border-radius: 7px;
    padding: 10px;
    transition-duration: 0.2s;
}

section > span:empty {
    display: none;
}

section > span:hover {
    border: solid 1px black;
}

#password-generator {
    max-width: 400px;
    margin: auto;
}

.code {
    background-color: white;
    color: gray;
    font-family: monospace;
}

.object {
    background-color: white;
    color: #019999;
}