html{
	min-width: 100%;
	min-height: 100%;
}

body{
	display: inline-block;
	max-width: 2500px;
	font-family: 'Times New Roman', serif;
	font-size: 16px;
	color: #ffffff;
	line-height: 1.2;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	font-style: normal;
	font-weight: normal;
	text-align: center;
	margin-left: 10px;
	margin-top: 0;
	margin-bottom: 10;
	margin-right: 10px;
	background-color: #69707a;
	word-wrap: break-word;
	text-rendering: optimizeLegibility;/* kerning, primarily */
}

strong {
	font-weight: bold;
	color: #f0ae4f;
}

.navLink{
	display: inline-block;
	color: #ffffff;
	font-weight: 700;
	font-size: 24px;
	line-height: 24px;
	margin-bottom: 10px;
}
.navLink a, .navLink a:link, .navLink a:visited{
	color: #ffffff;/* nav links are normally white */
}

.navLink a:hover, a:active{
	color: #f0ae4f;/* nav links are yellow on hover */
	text-decoration: none;
}

.error{
	color: #ff0000;
}
.success{
	color: #008000;
}

a {text-decoration: none;} /* links are not underlined */
a:link, a:hover, a:active, a:visited {color:#f0ae4f;} /* links are yellow */
a:hover, a:active {text-decoration:underline;} /* links are underlined on hover */
.clear {clear:both;}
.clearfix:after /* force a container to fit around floated items */
{
	content: "";
	display: block;
	height: 0;
	clear: both;
}

p{

}

h1, h2
{
	font-weight: 700;
	color: #ffffff;
	font-family: 'Times New Roman', serif;
	font-size: 24px;
	line-height: 24px;
	font-weight: bold;
	padding: 0px;
}



h2
{
	font-size: 18px;
}

@media screen
{
	body { text-rendering:auto; }
}

img
{
	border: 0;
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	max-width: 95%;
	height: auto;
}

#navLogoContainer {
	max-width: 30vw;
}

.contentImg{
	/* apply to divs containing images around which text wraps */
}

.fb-page{
	display: inline-block;
	margin-left: 5px;
	margin-top: 5px;
}

.content{
	text-align: left;
}

.highlightBox{
	border-style: solid;
	border-color: #f0ae4f; 
	border-width: 2px;
	border-radius: 25px; 
	padding-left: 8px;
	padding-right: 8px;
	padding-top: 6px;
	padding-bottom: 6px;
}



/* social icons */
.soc-icon {
	margin-right: 20px;
}

/* https://www.w3schools.com/howto/howto_css_responsive_form.asp */
 /* Style inputs, select elements and textareas */
input[type=text], input[type=email], select, textarea{
  max-width: 95%;
  box-sizing: border-box;
}

select{
	width: auto;
}

/* Style the label to display next to the inputs */
#contact-form label {
  margin: 5px 10px 5px 0px;
  display: inline-block;
}


/* Style the container */
#contact-form {
  border-radius: 5px;
}

/* Floating column for labels: 25% width */
.col-25 {
  float: left;
  width: 25%;
  margin-top: 6px;
}

/* Floating column for inputs: 75% width */
.col-75 {
  float: left;
  width: 75%;
  margin-top: 6px;
}

.row{
	width: 100%;
}
/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}


/* Responsive layout */
@media screen and (max-width: 800px) {
	#navLogoContainer img{
        	max-width: 70vw !important;
  	}
}

@media screen and (max-width: 500px){
	#navLogoContainer img {
		max-width: 60vw !important;
	}
}

/* when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .col-25, .col-75 {
    width: 100%;
    margin-top: 0;
  }
}

@media screen and (max-width: 420px){
	.contentImg{
		width: 100%;
	}

}