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

#mid-box { position:relative; width: 100%; margin: 0 auto; padding:0; line-height:1em; }
#mid-box img { position:relative; width: 100%; height: auto; }

#tagline { left: 20px; top: 10px; }
#tagline h2 { font-size: 2.9em; }
#tagline p { font-size: 1.2em; }


}

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

#logo_box { padding-top: 20px; padding-left: 2%; width: 97% }
#banner-inner { height: auto; min-height: 189px; }

#banner-box, #banner-inner-box { width: 100%; position:relative; margin: 0 auto; }
#logo { float: none; }


#clientlogin { float: none; margin: 5px 0; width: 100%; height: auto; background-color: #2c2c2c; color: #c8c8c8; font-size:.8em; font-weight:bold; font-family:Arial, Helvetica, sans-serif; line-height:1em; padding: 20px 0; border-top: solid 1px #666; border-bottom: solid 1px #666;  }
#clientlogin .icfframe {  display:inline-block; width: 100%; height: 30px; vertical-align:middle; }
#clientlogin .icfheader { display:inline-block; padding-right:10px; height:30px; line-height:30px; margin:0; vertical-align:middle; }

#clientloginbutton { display:none; }

#tagline h2 { font-size: 2em; }
#tagline p { font-size: 1em; }

#featuredservices { top: 0px; width: 100%; font-size: .9em; line-height:1.1em; }
#featuredservices .box1 { float:none; width: 92%; padding: 2% 4%; }
#featuredservices .box2 { float:none; width: 92%; padding: 2% 4%; }
#featuredservices .box3 { float:none; width: 92%; padding: 2% 4%; }
#featuredservices h2 { font-size: 1.2em; line-height:1.1em; }

.content { width: 92%; margin:0px auto 0 auto; padding: 2% 4%; }
.content-inner { width: 92%; margin:0px auto 0 auto; padding: 2% 4%; }

.contentdivider { background-size: cover; }

#sponsor-box img { max-width:808px; width: 100%; height:auto; }

#footer1 { width: 100%; margin: 0 auto; background-color: #eee; }
#footer1-inner { width: 92%; margin:0 auto; padding: 4%; }
#footer1-inner { font-family:Arial, Helvetica, sans-serif; font-size: 1em; font-weight: normal; text-align:center; color:#8c8c8c; }

#footer2 { width: 100%; background-color: #222; border-top: solid 1px #464646; }
#footer2-inner { width: 92%; margin:0px auto; padding: 4%;}
#footer2-box1 { float:none; width: 100%; margin-right: 0; margin-top: 4%; border-bottom: solid 1px #464646; margin-bottom: 2%; padding-bottom: 2%; }
#footer2-box2 { float:left; width: 100%; margin-right: 0; margin-top: 4%; border-bottom: solid 1px #464646; margin-bottom: 2%; padding-bottom: 2%; }
#footer2-box3 { float:left; width: 100%; margin-right: 0; margin-top: 4%; border-bottom: solid 1px #464646; margin-bottom: 2%; padding-bottom: 2%; }
#footer2-box4 { float:left; width: 100%; margin-right: 0; margin-top: 4%; }


}

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

#tagline { left: 20px; top: 10px; }
#tagline h2 { font-size: 1.4em; }
#tagline p { font-size: .8em; }

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

 img.floatright { max-width:30%; height:auto; }
 img.floatright2 {  max-width:30%; height:auto; }
 
.map iframe { width: 100%; }
.map { float:none; margin:0 0 1em 0; }

.floatbox1 img { max-width: 95%; height:auto; }

}

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

#clientlogin .icfframe {  height: auto; }

}


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

#tagline h2 { font-size: 1.2em; }
#tagline p { display:none; }

.features-box1 { float:none; width: 98%; padding: 0; margin-right: 2%; margin-top: 2%; }
.features-box2 { float:none; width: 98%; padding: 0; margin-right: 2%; margin-top: 4%; }
.features-box3 { float:none; width: 98%; padding: 0; margin-right: 0; margin-top: 4%;}

.contactform label.med { text-align: left; }
.contactform input { max-width: 90%; }
.contactform textarea { max-width: 90%; }
.contactform select { max-width: 90%; }

.contactform div.submitfield { padding-left: 0; }

}

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

.floatbox1 { width: 100%; float:none; margin-right: 0%; margin-bottom:5%; }
.floatbox2 { width: 100%; float:none; }

.floatbox3 { width: 100%; float:none; margin-left: 0%; margin-bottom:5%; }
.floatbox4 { width: 100%; float:none; }

}