/*
* 2/4/21 - The page width widget has been broken for a while due to the width
*       setting on #allContentWrapper, so it was removed.
* 7/15/18 - A couple of adjustments for narrow-screen. Kept the mix of max-width and 
*       min-width because this sheet overrides the standard CSS, and it is far easier.
*       Also removed the Text Size Widget from the display.
* 1/16/15 - Update while making changes for use on another website.
* 10/4/13 - A few changes when adding pagewidth and textsize widgets, more responsive, less fixed size.
* 4/11/12 - This was moved out of contact.html in an attempt to get either respond.js or css3-mediaqueries.js
* to work properly. Some clean up was done at the same time as adding the media query section, but it could
* of course stand a lot more.
*/
#allContentWrapper { /* width: 90% */ }
.allContentWrapper { width: 90% }
#widget-text-size { display: none; }

.yfp-contact-form input, 
.yfp-contact-form ul, 
.yfp-contact-form li { 
    margin: 0; 
    padding: 0;
    box-sizing: border-box;
}
.yfp-contact-form input, 
.yfp-contact-form textarea { 
    padding: 3px; 
}
.yfp-contact-form input.checkbox { margin-top: 5px; width: 13px; height: 13px; }
/* float, width and position on li is for ie6 */
.yfp-contact-form .form-inputs li { 
    clear: both; 
    vertical-align: top; 
    list-style-type: none;
    margin-bottom: 20px; 
}
.yfp-contact-form #errorList li { list-style-type: disc; margin: 0 0 5px 20px }
.yfp-contact-form #errorList { margin: 0 0 30px 0; padding: 5px; border-left: 1px dotted #d9d5c3 }
.yfp-contact-form .form-label span.error { color: red; font-weight: bold }
.yfp-contact-form span.formErrorMessage { color: red; font-weight: bold; }
.yfp-contact-form .form-label { 
    box-sizing: border-box;
    padding: 4px; 
    text-align: left; 
}
.yfp-contact-form .form-label.empty { height: 1px; }
.yfp-contact-form .formInputArea { width: 100%; }
.yfp-contact-form .xinputField { width: 93%; background: #f8f8f8 url(/image/Rounded500x150.png) top left no-repeat; border: 1px solid #d9d5c3 }
.yfp-contact-form .inputField { 
    width: 100%; 
    box-sizing: border-box;
}
.yfp-contact-form #message{ height: 100px }
.yfp-contact-form #captcha { width: 230px; height: 80px; border: 3px solid #555555;  }
/* enable display with JS, button requires it to function */
.yfp-contact-form #reload { display: none; margin-top: 1px; width: 15em; }
.yfp-contact-form #submitButton { margin-top: 0px; width: 15em; }
.yfp-contact-form span.required-marker {
    font-weight: bold;
    color: rgb(77, 91, 108);
    font-family: Museo, Georgia, "Times New Roman", Times, serif;
}
.yfp-contact-form {  }

.contact-success { 
    background-color: #95231f; 
    font-size: 150%; 
    padding: 1em 2em; 
    margin-bottom: 1em ;
    color: white; 
}
.contact-success p, 
.contact-success a { 
    color: white; 
}

.clearboth { clear: both }

@media screen and ( min-width: 600px ) {
    .yfp-contact-form #captcha { float: left; }
    .yfp-contact-form #reload { float: right; }
}

@media screen and ( min-width: 850px ) {
    .yfp-contact-form .form-inputs li { 
        clear: both; 
        float: left; 
        width: 100%;
    }
    .yfp-contact-form .formInputArea { 
        float: left; 
        width: 80%; 
    }
    .yfp-contact-form .form-label { 
        float: left; 
        width: 20%; 
        padding: 4px; 
        padding-right: 14px;
        text-align: right; 
    }
}

/*
* These override the main CSS. Trying to do it using min-width is too much of a mess.
*/
@media screen and ( max-width: 850px ) {
    #allContentWrapper, .allContentWrapper { width: auto; }
}

@media screen and ( max-width: 640px ) {

    #allContentWrapper, .allContentWrapper { /* min-width: 440px; */ }
    #rhContainer    { position: relative; width: auto; }
    #rhContainer .buttonBoxNbg { margin: 1px 1em; }
    #bodyContainer { background-image: none; background-color: #F8F4DF; }
    #mainContainer { margin-right: auto; }
}

@media screen and ( max-width: 440px ) {
    #rhContainer .buttonBoxNbg .std-nav-links { 
        float: left; 
        min-width: 180px;
    }
    .pad1emAll { padding: 10px 5px; }
        
}