﻿#body {
	padding: 2em 2em 2em 2em;
	font-family: arial,helvetica, san-serif;
	font-size: 100%;
	background-color:  #3B703B;
	color: black;
	height: 100%;
	width: 100%;
}
/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 700px){
#body {
	padding: .5em .5em .5em .5em;
	font-family: arial,helvetica, san-serif;
	font-size: 100%;
	background-color:  #3B703B;
	color: black;
	}
}
#container {
	max-width: 62em;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	padding: 0em 3em .5em 3em;
	margin: 0px auto 0px auto;
	background-color: #66cc66;
}
/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 700px){

#container{
	margin: 0px auto 0px auto;
	max-width: 96%;
	height: 100%;
	padding: .5em 2em .5em 2em;
}
}
#header {
	border-color: 3B703B;
	border-style: double;
	border-width: medium;
	width: 100%;
	height: auto;
	margin: 2em auto 1em auto;
	text-align: center;
	}

#header h1 {
	font-size: 4em;
	color: #FFFF00;	
}
#header h1 a {
	color: #ffff00;
}

/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 700px){
#header {
	width: 94%;
	height: auto;
	margin: 2em auto 1em auto;
}
#header h1 {
	font-size: 2.5em;
	color: #FFFF00;	
}
#header h1 a {
	color: #ffff00;
}
}

#wrap {
	width:auto;
	max-width: 60em;
	margin-top: .10em;
	margin-right: auto;
	margin-left: auto;
}

/* navigation */
#navigation {
	box-sizing:border-box;
	background-position: center center;
	max-width: 9em;
	height:auto;
	float: left;
	border-width: 0px;
	padding: .5em;
	margin: 0px auto 20px auto;
	display: block;
	font-family: arial,helvetica, san-serif;
	font-size: .75em;
	text-decoration: none;
	text-align: center;
}
#navigation a {
	color: #ffffff;
	text-decoration:none;
}

#navigation ul {
	display:block;
	border-width: 0px;
	padding: 0px;
	margin: 0px auto 0px auto;
	height:auto;
	list-style-type: none;
}
#navigation li {
	box-sizing:border-box;
	margin: 0px;
	height: auto;
	width: 8em;
	display: block;
	list-style-type: none;
	color: #ffffff;
	background-color: #3B703B;
	border-style: outset;
	border-color: #bcc7c7;
	border-top-width: thin;
	padding: .8em;
	text-align:center;
	text-decoration: none;
}
/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 700px){
	#navigation{
	display: none;
}
}

#menu {
	height: 3em;
	width: 75px;
	display: none;
}

@media only screen and (max-width: 699px){  
#menu{
	display: block;
}
}
#menu li{
	padding: .8em;
	text-align:center
	
}
.nav_dropbtn {
	background-color: #66cc66;
	color: #FFFF00;
	padding: 1em;
	font-size: 1.5em;
	border: none;
	height: 2em;
	width: 6em;
	cursor: pointer;
}
.nav_dropdown {
	position: relative;
	display: inline-block;
}
.nav_dropdown-content {
	display: none;
	position: absolute;
	background-color:#3B703B;
	color: #ffffff;
	min-width: 160px;
	z-index: 1;
	list-style-type: none;
}
.nav_dropdown-content a {
	color: #ffffff;
	padding: .75em 1em;
	text-decoration: none;
	display: block;
}
.nav_dropdown-content a:hover {
	background-color: #3B703B;
	color: #ffffff;
}
.nav_dropdown:hover .nav_dropdown-content {
	display: block;
}
.nav_dropdown:hover .nav_dropbtn {
	background-color: #3B703B;
	color: #ffffff;
}
#view {
	float: right;
	max-width: 40em ;
	text-align: center;
	padding:1em;
}
@media (max-width: 800px) {
#view {
	width: 100%;
}
}
#page_title {
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	width: 100%;
}
@media (max-width: 700px) {

#page_title h1 {
	font-size: 1.75em;
	color: #FFFF00;	
}
}
#story_title {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	clear:both;
}

#content {
	margin: 0px auto 0px auto;
	box-sizing: border-box;
	max-width:58em;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	
}
#footer {
	margin: 2em auto 2em auto;
	width: 100%;
	height: auto;
	text-align: center;
}

/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 700px){
 #content {
	height: 100%;
}
#footer {
	margin: .5em auto 2em auto;
	width: 100%;
	height: auto;
	text-align: center;
}
.slides {
	display: none;
}
}
/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 699px){
#direct {
	display:none;
	}
}
#direct_sm {
display:none;
}
/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 700px){
#direct_sm {
display:block;
}
}

img {
	padding: .5em;
	height: auto;
	max-width: 100%;
	margin-right: auto;
	margin-left: auto;
}
/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 700px){
img {
	padding: .5em;
	width: 80vw;
	height: auto;
	max-width: 100%;
	margin-right: auto;
	margin-left: auto;
}	
}
.center {
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}
.flex-container {
	padding: 0px 0px 0px 0px;
	text-align: center;
	display: flex;
	flex-wrap: wrap;
}
.flex-item-left {
	flex: 22%;
	float: left;
	text-align: center;
}
.flex-item-right {
	flex: 74%;
	float:right;
	text-align: center;
}
@media (max-width: 800px) {
.flex-item-right, .flex-item-left {
	flex: 100%;
	text-align:center;
}
}

/* links*/
a {
	text-decoration:none;
	color: #ffffff;
}
/* Type */
h1 {
	font-family: arial,helvetica, sans-serif;
	font-size: 2.25em;
	color: #FFFF00;
	text-decoration: none;
}
h2 {
	font-family: arial,helvetica, san-serif;
	font-size: 2em;
	color: #FFFF00;
	text-decoration: none;
}
h3 {
	font-family: arial,helvetica, san-serif;
	text-decoration: none;
	color: #000000;
	font-size: 1.5em;
}
h4 {
	font-family: arial,helvetica, san-serif;
	text-decoration: none;
	color: #000000;
	font-size: 1.25em;
}
p {
	margin: .25em;
	font-family: arial,helvetica, sans-serif;
	font-size: 1em;
	color: #223F22;
	text-decoration: none;
}
figcaption{
font-family: arial,helvetica, sans-serif;
	font-size: 1em;
	color: #223F22;
	text-decoration: none;	
}
ul {
	
	list-style-type: none;
}
li {
	font-size: 1em;
	color: #223F22;
	list-style-type: none;
}
th {
	text-align: left;
	font-size: 1.5em;
	text-decoration: none;
	font-weight: bold;
}
td {
	padding: .50em;
	margin: 0px 2em 0px 2em;
	color: #000000;
	text-align: left;
	font-size: 1.25em;
	text-decoration: none;
}
fieldset {
	border-style: none;
}

.table_Style1 {
	margin: 1em auto 1em auto;
	padding: 0px;
	width: 55em;
	max-width: 80%;
	vertical-align: top;
	text-align: left;
}
.table_Style2 {
	margin: 1em auto 1em auto;
	padding: 0px;
	width: 96%;
	vertical-align: top;
}
#calendar_sm iframe {
	display: none !important;
}

#calendar_sm {
	display: none !important;
}
@media only screen and (max-width: 700px){
#calendar_sm iframe {
	display:block !important;
}
}
@media only screen and (max-width: 700px){
#calendar_sm  {
	display:block !important;
	
}
}
#calendar {
	width: 800px;
	margin-right: auto;
	margin-left: auto;
}
#calendar iframe {
	overflow: hidden;
	border: 0px;
	max-width: 800px;
	max-height: 600px;
}
@media only screen and (max-width: 700px){
	#calendar {
		display:none
}
}

/* Google Calendar add to for Portrait phones and Landscape phones and portrait tablets */

.responsiveCal{
  position: relative;
  padding-top: 0;
  height: 0;
  overflow: hidden;
}
.responsiveCal iframe {
	position: absolute;
	width: 100%;
	max-height: 100%;
	margin-right: auto;
	margin-left: auto;
}
#links {
	list-style-type: none;
	text-align: left;
	font-size: 1em;
	text-decoration: none;
	color: #000000;
}
#links a {
	color: black;
	text-decoration: none;
	list-style-type: none;
}
.cellx {
	font-family:Arial, Helvetica, sans-serif;
	font-size:75%;
	background-color:#CCCCCC;
	color:#000000;
	padding-left:6px;
	height:20px;
}
.hdr {
	font-family:Arial, Helvetica, sans-serif;
	color:#FFFF33;
	font-weight:bold;
}

#join {
	height: 6em;
	width: 100%;
}
/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 699px){
#join {
	display: none;
	margin-bottom: 2em;
}
}
#join_sm {
	display:none;
}

/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 700px){
#join_sm {
	margin: 0px auto 0px auto;
	display: block;
}
}
/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 700px){
#join_sm td {
	text-align: center;
}
}
/* Portrait phones and Landscape phones and portrait tablets */
@media only screen and (max-width: 700px){
#join_sm table {
	margin: 0px auto 0px auto;
}
}


.clear {
	clear: both;
}
.img_sans {
	padding-top: o;
	padding-right: o;
	padding-bottom: o;
	padding-left: o;
	margin: 0px;
	border-style: none;
}
