/* copied, shortened, and adapted from https://codepen.io/markmurray/pen/JsAhx */

form {
    text-align: center;
    margin: 20px auto;
}

form .flexer {
    display: flex;
    justify-content: space-between;
}

form input + input,
form .flexer + .flexer {
    margin-top: 1em;
}

form input,
form textarea {
    border: 0;
    outline: 0;
    padding: 1em;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    display: block;
    width: calc(100% - 2em);
    -moz-box-shadow: 0 0px 2px #896aad;
    -webkit-box-shadow: 0 0px 2px #896aad;
    box-shadow: 0 0px 2px #896aad;
    resize: none;
}

form input:focus,
form textarea:focus {
    -moz-box-shadow: 0 1px 2px 1px rgba(9, 32, 55, 0.6);
    -webkit-box-shadow: 0 1px 2px 1px rgba(9, 32, 55, 0.6);
    box-shadow: 0 1px 2px 1px rgba(9, 32, 55, 0.6);
}

form #form-submit {
    width: 60%;
    padding: .5em 0;
    margin: 0 auto;
    font-size: large;
    color: #e9d7ff;
    background: #896aad;
}

form .blocked {
    cursor: not-allowed !important;
    opacity: .6;
}

form #form-submit:not(.blocked):hover,
form #form-submit:not(.blocked):focus {
    cursor: pointer;
    -moz-box-shadow: 0 2px 1px 2px rgba(9, 32, 55, 0.6);
    -webkit-box-shadow: 0 2px 1px 2px rgba(9, 32, 55, 0.6);
    box-shadow: 0 2px 1px 2px rgba(9, 32, 55, 0.6);
}

form #form-confirm,
form #form-confirm + label {  /* revoke some of the set properties for the checkbox */
    width: auto;
    display: inline;
    cursor: pointer;
}

form textarea {
    height: calc(100% - 2em);  /* everything minus the padding */
}

.half {
    float: left;
    width: 49%;
}