/**
 * 11.0 Media Queries
 * -----------------------------------------------------------------------------
 */

/* Does the same thing as <meta name="viewport" content="width=device-width">,
 * but in the future W3C standard way. -ms- prefix is required for IE10+ to
 * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
 * the meta tag. See http://core.trac.wordpress.org/ticket/25888.
 */

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

#outer_box { width: 100%; padding: 0; }
#banner { width: 100%; height:auto; }
#banner_phone { float:none; text-align:left; padding-left:5px; padding-right:0; }
#logo_box { height:auto; }
#logo { float:none; }
#logo img { max-width:100%; height:auto;}
#pics { display:none; }
#tagline { display:none; }

#logo { line-height:1em; padding-left:5px; }
#logo img { float:left; margin-right: 20px; }
.logoname { padding-left:0px; }

img { max-width: 100%; height:auto; }

#pics .midpics {  display:none; }

#content_outer { background-color: #fff; }

#col1 { float:none; width: 94%; padding: 10px 3%;}
#col1_full { width: 94%; padding: 10px 3%;}
#col2 { float:none; width: 94%; padding: 10px 3%; border-left: none; background-color: #fff; }
.col2_block { width: auto; padding: 25px 0px 0 0; color: #494949; background-image: none; border-top: solid 1px #494949; }
.col2_block_inner { width: auto; padding: 25px 0px 0 0; color: #494949; background-image: none; border-top: solid 1px #494949; }

 img.floatleft { max-width:50%; height:auto; }
 img.floatleft_content { max-width:50%; height:auto; }

 img.floatright { max-width:50%; height:auto; }
 img.floatright2 { max-width:50%; height:auto; }
 
#footer { min-height:auto; width: 100%; margin: 0 auto; }
#footer_outer { width: 100%; }

.btm_menu { display:none; }

.footer_right_bottom { color: #4a4c86; padding-top: 5px; }
 
 .captcha { max-width: 95%; height: 60px; margin: 5px 0px; }
 
div.inputfield { clear: left; font-weight: normal; padding:3px 0px; text-align:left;}
div.inputfieldn { display: none; }
label {  display:block; }
label.short1 { width: 38px; text-align: left; float:none; padding-top: 2px; padding-right: 0;  }
label.short2 { width: 30px; text-align: left; float:none; padding-top: 2px; padding-right: 0; }
label.short { width: 70px; text-align: left; float:none; padding-top: 2px; padding-right: 0; }
label.med1 { width: 110px; text-align: left; float:none; padding-top: 2px; padding-right: 0; }
label.med { width: 150px; text-align: left; float:none; padding-top: 2px; padding-right: 0; }
label.long { width: 220px; text-align: left; float:none; padding-top: 2px; padding-right: 0; }

}

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

.map iframe { width: 100%; }
.map { float:none; margin:0 0 1em 0; }

}


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

#logo { }

 

}