body {
	background-color: #fff;
	color: #293553;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	line-height: 1.6em;
	overflow-x: hidden;
	margin: 0 auto;
	}
	
	
img { max-width: 100%; }


#container {
		width: 1200px;
		max-width: 100%;
		margin: 0 auto;
		}

#content { width: 100%; margin-top: 20px; }

#content a { color: #367538; font-weight: 700; text-decoration: none; }

#content a:hover { color: #1e5020; }

#content a strong { font-weight: 900; color: #367538; } 

#content a:hover strong { color: #1e5020; }

h1 { color: #367538; font-family: 'Paytone One', sans-serif; }

h2, h3, h4 { color: #367538; font-family: 'Montserrat', sans-serif; }

.hr { width: 100%; height: 1px; background: #c5c5cc; clear: both; margin: 4% 0; }


.left-column { float: left; width: 48%; padding-right: 1.9%; }

.right-column { float: right; width: 48%; padding-left: 1.9%; }

#footer { display: block; clear: both; float: none; background: #fff; width: 1200px; height: auto; margin: 0 auto; }

#footer p { color: #367538; font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 0.8em; line-height: 1.5em; }



/* Figure classes to contain iFrames that work with responsive design. Height always 0, padding-bottom proportions set for frame height */

figure {
  height: 0;
  padding-bottom: 56.25%; /* 16:9 */
  position: relative;
  width: 100%;
  margin: 20px 0 !important;
}

figure iframe {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}


/* End figure classes and related iframe rule */



.front-button { display: inline-block; background: #367538; color: #fff !important; text-transform: uppercase; border-radius: 2px; padding: 4px 12px; margin-bottom: 30px; font-size: 80%; width: 48%; /* float: left; width: 44%; margin-left: 1%; margin-right: 1%; */ text-align: center;  box-sizing: border-box; }

.front-button-p { text-align: center; }

.front-button:hover { background: #1e5020; }

.fb-left { float: left; }

.fb-right { float: right; }

@media only screen and (min-width : 501px) {

	#header-wide, #footer-wide { display: block; width: 100%; height: auto; }
	
	#header-narrow, #footer-narrow { display: none; }

	.front-image-left { display: block; width: 48.9%; margin-right: 1%; margin-bottom: 20px; float: left; } 

	.front-image-right { display: block; width: 48.9%; margin-left: 1%; margin-bottom: 20px; float: right;} 


}


@media only screen and (min-width : 501px) and (max-width: 1200px) {

	#content { width: 96%; padding: 2%; }

}

@media only screen and (max-width : 500px) {
	
	#container { width: 100%; }
		
	#content { width: 96%; padding: 2%; }

	#header-wide, #footer-wide { display: none; }
	
	#header-narrow, #footer-narrow { display: block; width: 100%; height: auto; }

	.front-image-left, .front-image-right { display: block; width: 100%; float: none; clear: both; margin-bottom: 20px; }
	
	.left-column, .right-column { float: none; width: 100%; padding: 0; margin: 0; }

	#footer { display: block; clear: both; float: none; background: #fff; width: 96%; padding: 1% 2%;  height: auto; margin: 0 auto; }

.front-button-p { text-align: center; }

.front-button { width: 98%; text-align: center; margin: 20px 1%; padding: 10px 0; font-size: 100%;  }

.fb-left, .fb-right { float: none; }

	
}


@media only print {

	#header-wide, #footer-wide { display: block; width: 100%; height: auto; }
	
	#header-narrow, #footer-narrow { display: none; }

	.front-image-left { display: block; width: 48.9%; margin-right: 1%; margin-bottom: 20px; float: left; } 

	.front-image-right { display: block; width: 48.9%; margin-left: 1%; margin-bottom: 20px; float: right;} 

	.payment-form-field { border-bottom: 1px solid #000; }
	
}