html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

html {
    position: relative;
    min-height: 100%;
}

body {
    background: #222222;
    overflow-x: hidden;
    overflow-y: hidden;
}

/* From: https://stackoverflow.com/questions/18490334/responsive-image-full-screen-and-centered-maintain-aspect-ratio-not-exceed-wi */
img#photo {
    max-width: 100%;
    max-height: 100%;
    bottom: 0;
    left: 0;
    margin: auto;
    overflow: auto;
    position: fixed;
    right: 0;
    top: 0;
    -o-object-fit: contain;
    object-fit: contain;
}

div.formContainer {
    width: auto;
    margin: 20px;
    padding: 10px;
    border: solid 1px #cccccc;
    background: #dddddd;
    overflow: hidden;
}

    div.formContainer img {
        max-width: 400px;
        max-height: 300px;
        margin: 8px;
    }

input#photos {
    padding: 0 8px 0 8px;
}

p.actions {
    font-size: 120%;
    font-weight: bold;
    margin-top: 32px;
    padding-top: 12px;
    border-top: solid 1px #cccccc;
}