/**
 * 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: 995px) {

#navbar { display:none; }
#logo { float: left; padding-top: 15px; padding-left:10px; }

#navbar-mobile { display:block; }
.toggled-on #menu-topmenu-mobile { display:block; }

#logo { display:block; padding-top: 5px; float:none; }
#logo img.logo { max-width: 218px; height:auto; width:100%; border:0px; }
#logo-box-right {display:block; float:none; text-align:left; margin-top: 10px; padding-top:10px; margin-left: 15px; border-top: solid 1px #bbb;  }

.clientlogin .icfframe { display:block; max-width: 460px; width: 100%; height:50px; float:none; text-align:left; padding-top: 10px; vertical-align:middle;  }


.col-inner0 {padding: 15px; margin:0px; position:relative; }

#mid-welcome h2 { font-size: 2em; }
#mid-welcome p { display:none; }

}


@media screen and (max-width: 850px) {
	
#mid { display: none; }
	
.contentwidth { max-width: 971px; width: 100%; margin: 0 auto; }

#mid { height:auto; width: 100%; max-width: 971px; margin:0 auto; padding:0; line-height:1em; position: relative; color: #fff; }
#mid h2 { font-family: "Open Sans", sans-serif; font-size: 1.7em; color: #fff; line-height: 1.2em; font-weight:normal; }
	

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

 img.floatright, img.floatright_content { max-width:50%; height:auto; }
 img.floatright2 { max-width:50%; height:auto; }

.btm_menu { display:none; }

 .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; }

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

}

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

.col20 { width: 100%; float:none; }
.col25 { width: 100%; float:none; }
.col33 { width: 100%; float:none; }
.col34 { width: 100%; float:none; }
.col40 { width: 100%; float:none; }
.col45 { width: 100%; float:none; }
.col50 { width: 100%; float:none; }
.col55 { width: 100%; float:none; }
.col60 { width: 100%; float:none; }
.col75 { width: 100%; float:none; }
.col80 { width: 100%; float:none; }

#mid-promo { position: relative; bottom: auto; left: auto; right:auto; width: 100%; margin: 0 auto; color:#000; min-height: 85px; background-image:url(images/mid-promo-shadow.png); background-repeat: no-repeat; background-position: bottom right; padding-bottom: 7px; }

}

@media screen and (max-width: 600px) {
#mid-welcome h2 { font-size: 1.4em; line-height: 1.2em; }

#mid-inner { height: 20px; }

}

@media screen and (max-width: 450px) {
#mid-welcome h2 { font-size: .95em; line-height: 1.2em; }

.mid-promo-left { width: 100%; background-color:#ff6f00; float:none; min-height: auto; height:4px;}
.mid-promo-mid { width: 100%; background-color:#e3e3e3; float:none; min-height: auto; font-size: 1.5em; line-height: 1.5em; text-align:center; }
.mid-promo-right {width: 100%; background: linear-gradient( 90deg, #cfcfcf, #d7d7d7 5%, #d7d7d7 ); background-color:#d7d7d7; float:none; min-height: auto; text-align:center; }

}