/*
large width: 1200
medium width: 992
tablet portrait: 768
mobile: 320
*/


// Small screens
@media only screen { }  /* Define mobile styles */

@media only screen and (max-width: 40em) { 

.post img {
	width: 100%;
	}

form#joinemail input#email {
	width: 9em;
	}

div.label { 
	width: 100%;
	text-align: left;
	}

label {
	height: auto;
	}

select {
	margin-bottom: 1em;
	}

div.input {
	float: right;
	width: 100%;
	}

.contact-table-1, 
.contact-table-2, 
.contact-table-3 {
    width: 100%;
	}


.container .mix, .container .gap {
	width: 100%;
	margin-bottom: 6%;
	}



.story div.img-cap-right {
	margin-left: 0;
	float: none;
	width: 100%;
	}

.story div.img-cap-right img, .story div.img-cap-left img {
	width: 100%;
	}

.story  div.img-cap-left {
	margin-right: 0;
	float: none;
	width: 100%;
}


} /* max-width 640px, mobile-only styles, use when QAing mobile issues */




// Medium screens
@media only screen and (min-width: 40.063em) { 
	.off-canvas-wrap {display: none !important;}






} /* min-width 641px, medium screens */

@media only screen and (min-width: 40.063em) and (max-width: 64em) { 


} /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

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


}

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

form#local { 
	width: auto; 
	padding: 1em 0;
	}

form#local select { 
	display: block; 
	margin-left: auto; 
	margin-right: auto; 
	width: 75%; 
	}

.localsearch {
    background-color: #515151;
    height: auto;
    padding-left: 0;
    padding-right: 0;
	}



.footerbuttons, .site-info { width: 100%;}
.footerbuttons, .footerlinks { padding-top: 1em; text-align: center; }


}




// Large screens
@media only screen and (min-width: 64.063em) { } /* min-width 1025px, large screens */

@media only screen and (min-width: 64.063em) and (max-width: 90em) { } /* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */

// XLarge screens
@media only screen and (min-width: 90.063em) { } /* min-width 1441px, xlarge screens */

@media only screen and (min-width: 90.063em) and (max-width: 120em) { } /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */

// XXLarge screens
@media only screen and (min-width: 120.063em) {  } /* min-width 1921px, xxlarge screens */