/* ********************************************************************** */
/* COLORS */

.fm {
    background:#fafafa;
    border-color:#bbb;
}

select {
    background-color:#fff;    
}

input[type=text],
input[type=password],
textarea {
    border-color:#ccc;
}



/* ********************************************************************** */
/* FONTS */

.fm {
    font-family:Helvetica,Arial,sans-serif;
}

input[type=text],
input[type=password],
textarea {
    font-family:Helvetica,Arial,sans-serif;
    /*font-family:monospace;*/
}



/* ********************************************************************** */
/* OTHER CONFIG */

/* GENERAL FORM */

.fm:target::before {
    height:5em;
    /* unlike h2, h3 target, no need to change margin-top */
}

.fm {
    max-width:40em;
    margin:1em 0;
    padding:2em 2.5em 3em 2.5em;
    border-width:1px;
    font-size:90%;
}

.fm h2 {
    margin-top:0.5em;
    font-size:110%;
    font-weight:bold;
}

.fm p {
    margin:0.5em 0;
}

@media all and (max-width:608.68px){
    .fm {
        padding-left:5%;
        padding-right:5%;
    }
}



/* FIELDS */

.ff {margin:1em 0}

label.left {
    margin-right:0.5em;
} 

input[type=text],
input[type=password],
textarea {
    /* font-size: use 120% if monospace, 100% if sans-serif */
    font-size:100%;
    padding:0.1em 0.3em;
    /* width 95%, because there is also some padding and border */
    width:95%;
    border-width:1px;
}

input[type=text],
input[type=password] {
    max-width:18em;
}

textarea {
    max-width:36em;
}

input[type=checkbox] {
    margin:0.3em 0.6em;
}

select {
    border-width:1px;
    padding:0.4em 0.3em 0.1em 0.3em;
}



/* ********************************************************************** */
/* CONSTANTS */

.fm:target::before {
    content:'';
    display:block;
    pointer-events:none;
}

.fm .intro {
    margin:0;
}

@media all and (max-width:498.68px) {
    
    .fm {
        border-left-width:0;
        border-right-width:0;
    }
    
    /*
    Is this still needed?
    .inner .fm {
        border-left-width:1px;
        border-right-width:1px;
    }
    */
}

.ff2 {
    display:none;
}



/* ********************************************************************** */
/* END */