/* link styles */

a:active { color: #00539F; text-decoration: underline; }
a:link    { color: #00539F; text-decoration: underline; }
a:visited { color: #00539F; text-decoration: underline; }
a:hover     { color: #000000; text-decoration: underline; }

a.menu:active { color: #ffffff; text-decoration: none;  font-weight: bold;}
a.menu:link    { color: #ffffff; text-decoration: none;  font-weight: bold;}
a.menu:visited { color: #ffffff; text-decoration: none;  font-weight: bold;}
a.menu:hover     { color: #ffffff; text-decoration: none;  font-weight: bold;}

a.submenu { color: #006800; text-decoration: none;}
a.submenu:active { color: #006800; text-decoration: none;}
a.submenu:link    { color: #006800; text-decoration: none;}
a.submenu:visited { color: #006800; text-decoration: none;}
a.submenu:hover     { color: #006800; text-decoration: none;}

a.footer:active { color: #ffffff; text-decoration: none; }
a.footer:link { color: #ffffff; text-decoration: none; }
a.footer:visited { color: #ffffff; text-decoration: none; }
a.footer:hover { color: #ffffff; text-decoration: underline; }

/* HEADINGS, TEXT CONTROL AND MISCELLANEOUS STUFF */
.contact {display: none;}

h1, h2, h3, h4, h5, h6 {
display: inline; 
font-weight: bold; 
font-family: allan;
color: #074916; 
}

h1  {font-size: 2.0em; font-style: italic;}
h2  {font-size: 1.7em; font-style: italic;}
h3  {font-size: 1.3em; font-style: italic;}
h4  {font-size: 1.1em; font-style: italic;}
h5  {font-size: .9em; font-style: italic;}
h6  {font-size: .8em; font-style: italic;}


/*body elements*/
.map-img {filter: drop-shadow(2px 2px 6px rgba(0,0,0,.5)); margin: 0px auto;}
.map-img:hover {transform: scale(1.5);} /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
.aligned-img { float: right; }/*this is for wrapping an image and making text wrap around it right aligned*/
.aligned-img {filter: drop-shadow(2px 2px 6px rgba(0,0,0,.5));}
.aligned-img-composite {float: right; }/*this is for wrapping an image and making text wrap around it right aligned*/}
.aligned-img-plain { filter: drop-shadow(2px 2px 6px rgba(0,0,0,.5)); }/*this is for wrapping an image and making text wrap around it right aligned*/

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
}

hr.light{
border: 0;
height: 1px;
color: #70B27F;
background-color: #70B27F;

}

body{
margin: 0px; 
padding: 0px;
/*background:  url("images/bg.jpg");*/
background-color: #1B5942;
font-family: allan; font-style: italic;
}

.header img {
 width: 100%;
 height: auto;
 float:left;
 border-top-right-radius: 25px;
border-top-left-radius: 25px;
}

.header, .container {
width: 100%; 
max-width: 960px;
}

.header{
margin: 0px auto;
padding: 0px;
}

.container {
margin: 0 auto;
padding: 0px;
background: #1B5942;
border-top-left-radius: 50px 50px;
border-top-right-radius: 50px 50px;
}

.columns {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	margin: 5px 0;
}

.column {
	flex: 1;
	margin: 2px;
	padding: 5px;
	text-align: center;
	&:first-child { margin-left: 0; }
	&:last-child { margin-right: 0; }
}

.content {
height: 100%;
display:inline-block;
width: 92.1%;
max-width: 960px;
padding: 4%;
padding-top: 1%;
padding-bottom: 1%;
margin: 0 auto;
float: left;
background: #ffffff;
font-size: 1.2em;
}

.footer {
padding: 2px 0px 2px 0px;
margin: 0px auto;
margin-left:  auto;
margin-right:  auto;
width: 100%;
max-width: 960px;
clear: both;
text-align: center;
font-size: .8em;
background: #ffffff;
border-top-left-radius: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 25px;
border-bottom-left-radius: 25px;
}

.info-box {
color: #ffffff; 
width: 40%;
border: 2px solid #ffffff; 
background-color: #1B5942;
padding: 2%;
float: left; 
border-radius: 25px 25px;
}

ul.list li {
white-space:normal;
list-style-image: url(images/unchecked_checkbox_sm.png);
padding-bottom: 8px;
}


ul.list2 li {
white-space:normal;
list-style-image: url(images/open.png);
padding-bottom: 8px;
}

td.gallery {padding: 0px 3px 22px 3px;}
td.gallery img {max-width: 95%;} /*this keeps gallery images from floating off screen while still side by side */
.gallery img {max-width: 95%;} /*this keeps gallery images from floating off screen while still side by side within a div vs td */

/* media queries */

/*first we set things to change when secreen dis below 760px */
@media only screen and (max-width:760px) {
.contact {display: block; text-align: center; font-size: 1.2em;}
.center {text-align: center; margin-left: auto; margin-right: auto;}
.header, .footer  {display: none;}/*hide the header and footr for phones to save space*/
.container {max-width: 100%;}

.content {
max-width: 90%;
padding: 5%;
float: none;
border-top-left-radius: 25px 25px;
border-top-right-radius: 25px 25px;
border-bottom-left-radius: 25px 25px;
border-bottom-right-radius: 25px 25px;
}

.flex-container {
display: column;
}

.info-box { display: none;}/*hide the info box below the navigation menu for phones to save space*/
.aligned-img { text-align: center; float: none; margin-left:  auto; margin-right:  auto;} /*make the image float 
make side bar become vertically aligned under header*/
.aligned-img img {max-width: 90%;}
.map-img img {max-width: 90%;}
.map-img:hover {transform: none;} /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
.home-img img {max-width: 90%;}
.home-img  {text-align: center; float: none; margin-left:  auto; margin-right:  auto; }
}

@media screen and (min-width:480px) and (max-width:760px) {
  .container, .header, .content, .footer {width: 95%;}

.info-box { display: none;}/*hide the info box below the navigation menu for phones to save space*/
}

/*finally we address just the smallest screen sizes*/


@media screen and (max-width:479px) {
.content, .sidebar {
float: none;
width: auto;
border-top-left-radius: 25px 25px;
border-top-right-radius: 25px 25px;
border-bottom-left-radius: 25px 25px;
border-bottom-right-radius: 25px 25px;
}
  
.info-box { display: none;}/*hide the info box below the navigation menu for phones to save space*/
li.testimonials, li.home, li.contact, {width: 100%;}
.header, .footer  {display: none;}/*hide the header and footr for phones to save space*/

.flex-container {
display: column;
}

.form table, td, tr {
display: block;
padding-bottom: 2%;
}

.contact {display: block; text-align: center; font-size: 1.2em;}
.home-img img {max-width: 90%;}
.home-img  {max-width: 90%;}

@media screen and (max-width: 980px) {
  .columns .column {
		margin-bottom: 5px;
    flex-basis: 40%;
		:nth-last-child(2) {
			margin-right: 0;
		}
		&:last-child {
			flex-basis: 100%;
			margin: 0;
		}
	}
}

@media screen and (max-width: 680px) {
	.columns .column {
		flex-basis: 100%;
		margin: 0 0 5px 0;
	}
}