/* CSS Document */
html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: transparent;
}

body {
  margin: 0;
  padding: 0;
  background-color:#ffffff;
  font-family: 'Open Sans', Arial, sans-serif; 
  max-width: 1260px;        
  
}
header { width: 100%; }


footer { display: flex;
	     flex-direction: column;
	     flex-wrap: nowrap;
	     order: 5;
		 width: 100%;
		 padding-left: 1em;
		 padding-right: 1.5em;
	     max-width: 1260px;
		 }
			
.FlexItems {
	        display: flex;  /* This makes every div a child of the flex grid */
			display:-webkit-flex;
			max-width: 1260px;
}
.donate {   float: right;
			margin-right: auto;
			
}
.donateend {   float: left;
			margin-right: auto;
			
}

@media screen and (max-width: 320px) {	
.FlexWrapper { 
	        display: flex;
			flex-direction: column;
			padding: 0px;
			margin-top:0px;
			margin-right: 1em;
			background-color:#ffffff;
			text-align:left;
				
			}
.Flexheader {
          order: -1;
		  min-height: 3em;
		  width: 100%;
		 font-size: 1em;
		 color:#000;
		 font-weight:bold;
		 margin: 0px;
		 padding: 5px;
		 margin-bottom: 5px;
		 border-bottom: 1px solid #9fbdda;
		
		 
		}
/* Complete width of navigation fully extended on large screen is Width: 1120 pixels and Height: 56 pixels */
.navi {  min-height: 3rem; /* 46px; */
		background-color:#7DA7D1;
		padding: 0 .5rem;
		width: 100%;
		border-radius: 5px;
		display: block !important;
		z-index: 100;
		
	} /* added navi:focus ul for Android */	
	.navi ul, navi:active ul, navi:focus ul {
		display: flex;
		flex: 1 1 200px;
		justify-content: flex-start;
		height: auto;
		padding: 3px 3px;
		border: solid 1px #aaa;
		background: #fff url(../images/icon-menu2.png) no-repeat 10px 11px;
		border-radius: 5px;
		box-shadow: 0 1px 2px rgba(0,0,0,.3);
		display: inline-block !important;
		z-index: 110;
		list-style-type: none;
		-webkit-backface-visibility: hidden;
	}
	.navi li {
		display: none; /* hide all <li> items */
		margin: 0;
		border:none;
	}
	.navi .current {
		display: block; /* show only current <li> item */
	}
	.navi a {
		display: block;
		padding: 5px 5px 5px 12px; /* orginal -  padding: 5px 5px 5px 32px; */
		text-align: left;
	}
	.navi .current a {
		background: none;
		color: #666;
	}

	/* on nav hover */
	.navi ul:hover {
		background-image: none;
		
	}
	.navi ul:hover li {
		display: block;
		display: list-item;
		margin: 0 0 5px;
		
	}
	.navi ul:hover .current {
		background: url(../images/icon-check2.png) no-repeat 10px 7px;
	}

.Flexpic {
	order: 3;
	display: flex;
	flex: 1;
	width: auto;
	margin: 1em .25em .25em .25em;
	background-color:#FFFFFF;
	border: 2px solid #8A8A8A;
	padding: 3px 3px 3px 3px;
}
.Flexpic .ImageCaption {
    font-size: .75rem;
	position: absolute;
	top: 8rem;
	left: 2rem;
	color:#000;
	z-index: 1;
}

.Flexcontent {
	order: 4;
	flex-flow: row;
	flex-wrap: wrap;
	width: 100%;
	justify-content: flex-start;
	align-content: flex-start;
	margin: .25em .35em .25em .25em;
	background-color:#FFFFFF;
	padding: 3px 3px 3px 3px;
	
}
.Flexcontent .part1 {
	       order: 1; 
           width: auto;  
		   margin-left:20px; 
		   margin-right:20px;
		   display: inline-block;
		   align-item: flex-start;
	
}

.Flexcontent .part2 {
	       order: 2; 
           width: auto;  
		   margin-left:2em; 
		   margin-right:10px;
		   margin-top: 2em;
		   margin-bottom: 2em;
		   display: inline-block;
		   align-item: flex-start;
	
}
.Flexcontent .part2 p {max-width: 96%;
	



}
}
@media screen and (max-width: 1024px) {	
.FlexWrapper { 
	        display: flex;
			flex-direction: column;
			padding: 0px;
			margin-top:0px;
			background-color:#ffffff;
			text-align:left;	
			}
.Flexheader {
          order: -1;
		  min-height:2.5em;
		  width: 100%;
		 font-size: 1.10em;
		 color:#000;
		 font-weight:bold;
		 margin: 0px;
		 padding: 5px;
		 margin-bottom: 5px;
		 border-bottom: 1px solid #9fbdda;
		
		 
		}
/* Complete width of navigation fully extended on large screen is Width: 1120 pixels and Height: 56 pixels */
.navi { 
        min-height: 2.75rem; /* 46px; */
		max-height: 3.50em;
		background-color:#7DA7D1;
		padding: 0 1rem;
		width: 100%;
		border-radius: 5px;
		display: block !important;
		z-index: 100;
		
		
	}	
	.navi ul {
		display: flex;
		justify-content: flex-start;
		min-width: 14em; /* original 2-5-2018 - 14.5em; */
		margin-left: 1em;
		margin-top: .50em;
		padding: 3px 3px;
		border: solid 1px #aaa;
		background: #fff url(../images/icon-menu2.png) no-repeat 10px 11px;
		border-radius: 5px;
		box-shadow: 0 1px 2px rgba(0,0,0,.3);
		display: inline-block;
		z-index: 101;
	}
	.navi li {
		display: none; /* hide all <li> items */
		margin: 0;
		border:none;
	}
	.navi .current {
		display: block; /* show only current <li> item */
	}
	.navi a {
		display: block;
		padding: 5px 5px 5px 32px;
		text-align: left;
	}
	.navi .current a {
		background: none;
		color: #666;
	}

	/* on nav hover */
	.navi ul:hover {
		background-image: none;
		}
		
	.navi ul:hover li  {
		display: block;
		margin: 0 0 5px;
	}

	.navi ul:hover .current {
		background: url(../images/icon-check2.png) no-repeat 10px 7px;
	}
.alpha60 {
	/* Drop Shadow for Naviation */
	/* Fallback for web browsers that doesn't support RGBa */
    background: rgb(255, 255, 255);
    /* RGBa with 0.6 opacity */
    background: rgba(255, 255, 255, 0.6);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff, endColorstr=#ffffff);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff, endColorstr=#ffffff)";
    -webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
    background-color:#7DA7D1;
    border-radius: .50em;
	width: 100%;
}

.Flexpic {
	order: 3;
	display: flex;
	flex: 1;
	width: auto;
	margin: 1em .25em .25em .25em;
	background-color:#FFFFFF;
	border: 2px solid #8A8A8A;
	padding: 3px 3px 3px 3px;
}
.Flexpic .ImageCaption {
    font-size: .75rem;
	position: absolute;
	top: 8rem;
	left: 2rem;
	color:#000;
	z-index: 1;
}
	
.Flexcontent {
	order: 4;
	flex-flow: row;
	flex-wrap: wrap;
	width: 100%;
	justify-content: flex-start;
	align-content: flex-start;
	margin: .75em .75em .25em .25em;
	background-color:#FFFFFF;
	padding: 3px 3px 3px 3px;
	margin-right: 1em;
	
	
}
.Flexcontent .part1 {
	       order: 1; 
           width: auto;  
		   margin-left:20px; 
		   margin-right:20px;
		   display: inline-block;
		   align-item: flex-start;
	
}

.Flexcontent .part2 {
	       order: 2; 
           width: 35em;  
		   margin-left:20px; 
		   margin-right:15px;
		   margin-top: 2em;
		   margin-bottom: 2em;
		   display: inline-block;
		   align-item: flex-start;
	
}
.Flexcontent p { 
                 margin-right: 1em;
	
}




}

@media screen and (min-width: 1025px) {
.FlexWrapper {
	        display: flex; 
			display: -webkit-box;
			display: -webkit-flex;
			display: -ms-flexbox;
			-webkit-box-flex:1;
			-webkit-flex: 1;
			-ms-flex: 1;
			flex: 1;
			flex-flow: row wrap;
			padding: 0px;
			margin-top:0px;
			background-color:#ffffff;
			text-align:left;
			
				}
	
.Flexheader {
         order: -1;
		 width: 100%;
		 font-size: 1.85em;
		 color:#000;
		 font-weight:bold;
		 margin: 0px;
		 padding: 5px;
		 margin-bottom: 5px;
		 border-bottom: 1px solid #9fbdda;
		 
		 
		}
.Flexpic {
	order: 3;
	display: flex;
	margin: .75em .50em .50em .50em;
	background-color:#FFFFFF;
	border: 2px solid #8A8A8A;
	padding: 3px 3px 3px 3px;
	max-width: 1260px;
}
.Flexpic .ImageCaption {
	font-size: .75rem;
	position: absolute;
	top: 7.5rem;
	left: 3rem;
	color:#000;
	z-index: 1;
}
	
.Flexcontent {
	order: 4;
	flex-flow: row;
	flex-wrap: wrap;
	width: 100%;
	justify-content: flex-start;
	align-content: flex-start;
	margin: .75em .50em .25em .25em;
	background-color:#FFFFFF;
	padding: 3px 3px 3px 3px;
	
}
.Flexcontent .part1 {
	       order: 1; 
           width: auto;  
		   margin-left:20px; 
		   margin-right:20px;
		   display: inline-block;
		   align-item: flex-start;
	
}

.Flexcontent .part2 {
	       order: 2; 
           width: 35em;  
		   margin-left:20px; 
		   margin-right:15px;
		   margin-top: 2em;
		   margin-bottom: 2em;
		   display: inline-block;
		   align-item: flex-start;
	
}
.Flexcontent p { 
                 margin-right: 1em;
	
}


.alpha60 {
	/* Drop Shadow for Naviation */
	/* Fallback for web browsers that doesn't support RGBa */
    background: rgb(255, 255, 255);
    /* RGBa with 0.6 opacity */
    background: rgba(255, 255, 255, 0.6);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff, endColorstr=#ffffff);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff, endColorstr=#ffffff)";
    -webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
    background-color:#7DA7D1;
    border-radius: .50em;
	width: 100%;
}

.navi {
	 
	font-family:Verdana, Arial, Helvetica, sans-serif;
	margin: .25rem .25rem;
	padding: 1rem;
	padding-left: 1rem;
	padding-right: 1rem;
	height: 1rem;
	background-color:#7DA7D1;
	border-radius: 5px; 
	font-size: 1.15rem;
	width: 100%;
	z-index: 100;
}

.navi ul {
	margin: 0;
	padding: 0;
	z-index: 101;
}
.navi li {
	display: inline-block;
	*display:inline; /* ie7 */
	margin: -6px 5px 10px 5px;
	padding: 0;
	list-style: none;
	border-right: 1px solid #999;
}


.navi a {
	padding: 3px 12px;
	text-decoration: none;
	color: #000;
	line-height: 100%;
}
.navi a:hover {
	color: #790000;
}
.navi .current a {
	background: #E9F0F6;
	color: #000;
	border-radius: 5px; 
	margin-left: 5px;
	margin-top: -15px;
}