* {
	box-sizing: border-box;
  	margin: 0;
  	padding: 0;
}

body {
	/*background: rgba(0, 180, 255, 1.0);*/
	background: rgba(255, 255, 255, 1.0);
	font-family: Verdana;
	text-align: center;
	letter-spacing: 0.25px;
	margin: 0;
  	padding: 0;
}

header {
	width: 100%;
	height: 80px;
	display: block;
	align-items: center;
	text-align: center;
	position: fixed;
	padding-top: 5px; padding-bottom: 5px;
	top: 0;
	/*background-color: rgba(0, 180, 255, 1.0);*/
	z-index: 1;

	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* X, Y, Blur, Color */
	background-color: rgba(240, 240, 240, 0.95);
}

footer {
	display: block;
	text-align: center;
	height: 100px;
	background-color: rgba(64, 64, 64, 1.0);
	align-content: center;
	justify-content: center;
	width: 100%;
}

a {
	text-decoration: none;
	color: rgba(255, 255, 255, 1.0)
}
a:link {
	text-decoration: none;
	color: rgba(255, 255, 255, 1.0);
}
a:visited {
	text-decoration: none;
	background-color: transparent;
	color: rgba(255, 255, 255, 1.0);
}

div {
	margin: 0; padding: 0;
}

h1, h2 {
	font-style: inherit;
}

li {
	list-style-type: none;
	text-align: left;
	padding-top: 5px; padding-bottom: 5px;
}
button {
	display: inline;
}

								/* TEXT */

			/* WHITE TEXT */

.textFooter {
	font-size: 0.90em;
	color: rgba(255, 255, 255, 1.0);
}

.textSmallWhite {
	margin-top: 10px; margin-bottom: 10px;
	padding-top: 10px; padding-bottom: 10px;
	padding-left: 10px; padding-right: 10px;
	font-size: 0.80em;
	color: rgba(255, 255, 255, 1.0);
	background-color: rgba(255, 0, 0, 0.0);
}

.textToLeft {
	text-align: left;
}
.textToCenter {
	text-align: center;
}

.textSmallGreen {
	padding-left: 10px; padding-right: 10px;
	font-size: 0.80em;
	color: rgba(113, 225, 32, 1.0);
}


.textNormalWhite {
	font-size: 1.25em;
	color: rgba(255, 255, 255, 1.0);
}
.textNormalWhiteLeft {
	font-size: 1.25em;
	color: rgba(255, 255, 255, 1.0);
	text-align: left;
	margin-top: 10px; margin-bottom: 10px;
	padding-top: 10px; padding-bottom: 10px;
	padding-left: 10px; padding-right: 10px;
	background-color: rgba(255, 0, 0, 0.0);
}
.textNormalWhiteLeftListItem {
	font-size: 1.25em;
	color: rgba(255, 255, 255, 1.0);
	text-align: left;
	margin-top: 20px; margin-bottom: 20px;
	padding-left: 30px; padding-right: 30px;
}


.textImportantWhite {
	font-size: 1.75em;
	color: rgba(255, 255, 255, 1.0);
}

			/* BLUE TEXT */

.textNormalBlueLight {
	font-size: 1.25em;
	color: rgba(0, 180, 255, 1.0);
}
.textNormalBlueLightLeft {
	text-align: left;
	font-size: 1.25em;
	color: rgba(0, 180, 255, 1.0);
	padding-left: 10px; padding-right: 10px;
}

.textNormalBlueDark {
	font-size: 1.25em;
	color: rgba(0, 80, 120, 1.0);
}
.textNormalBlueDarkLeft {
	text-align: left;
	color: rgba(0, 80, 120, 1.0);
	}


.textImportantBlueLight {
	font-size: 1.75em;
	color: rgba(0, 180, 255, 1.0);
	text-align: center;
}
.textImportantBlueLightLeft {
	font-size: 1.75em;
	color: rgba(0, 180, 255, 1.0);
	text-align: left;
}

.textImportantBlueDark {
	font-size: 1.75em;
	color: rgba(0, 80, 120, 1.0);
	/*text-shadow: 4px 4px 10px rgba(0, 0, 0, 0.6); /* X, Y, Blur, Color */
}


.textMainBlueDark {
	font-size: 2.5em;
	color: rgba(0, 80, 120, 1.0);
	text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5); /* X, Y, Blur, Color */
}


			/* GREEN TEXT */

.textNormalGreen {
	font-size: 1.25em;
	color: rgba(113, 225, 32, 1.0);
}

.textImportantGreen {
	font-size: 1.75em;
	color: rgba(113, 225, 32, 1.0);
}


.textMainGreen {
	font-size: 2.5em;
	color: rgba(113, 225, 32, 1.0);
}



.ribbonBigTransparent {
	text-align: left;
	background-color: rgba(0, 255, 0, 0.0); /* Should be transparent */
	padding-top: 0px; padding-bottom: 0px;
	padding-left: 10px; padding-right: 10px;
}

.ribbonBigBlue {
	width: 95%;
	margin: auto;
	border-radius: 10px;
	text-align: left;
	background-color: rgba(0, 0, 0, 0.25);
	padding-top: 15px; padding-bottom: 15px;
	padding-left: 10px; padding-right: 10px;
}

.mainRibbonBlue {
	display: block;
	width: 100%;
	margin-top: 50px; margin-bottom: 50px;
	background-color: rgba(0, 80, 120, 1.0);
}

.mainRibbonTransparent {
	display: block;
	width: 100%;
	margin-top: 25px; margin-bottom: 25px;
	padding-top: 20px; padding-bottom: 20px;
	background-color: transparent;
}

.subMainRibbonBlue {
	display: block;
	width: 100%;
	margin-top: 25px; margin-bottom: 25px;
	padding-top: 10px; padding-bottom: 10px;
	background-color: rgba(0, 180, 255, 1.0);
}

.mainRibbon {
	width: 100%;
	display: block;
	margin-top: 0px; margin-bottom: 0px;
	padding-top: 0px; padding-bottom: 0px;
	border-radius: 0px;
	background-color: rgba(0, 0, 0, 0.0); /* No Color */
}



#logo {
	display: block;
	 height: 50%; width: auto;
	margin-top: 0px; margin-bottom: 0px;
	margin-left: auto; margin-right: auto;
	padding-top: 0px; padding-bottom: 0px;
	background-color: rgba(0, 0, 0, 0.0); /* No color */
}

#navBar {
	display: block;
	list-style-type: none;
	margin: auto;
	margin-top: 2.5px; margin-bottom: 2.5px;
	padding: 0;
	width: 90%;
	height: 50%;
	align-content: center;
	justify-items: center;
	background-color: rgba(0, 180, 255, 0.0); /* No color */
}
	.navBarLink {
		height: 100%; width: auto;
		display: inline;
		text-align: center;
		background-color: rgba(0, 80, 120, 1.0);
		/*color: rgba(255, 255, 255, 1.0);*/
		color: rgba(255, 255, 255, 1.0);
		font-size: 0.85em;
		padding-top: 5px; padding-bottom: 5px;
		padding-left: 5px; padding-right: 5px;
		margin: 2px;
		border-radius: 5px;	
	}



.separatorBig {
	height: 100px;
	background-color: rgba(0, 0, 0, 0.0);
}
.separatorSmall {
	height: 75px;
	background-color: rgba(0, 0, 0, 0.0);
}
.separatorTiny {
	height: 30px;
	background-color: rgba(0, 0, 0, 0.0);
}


.mainSection {
	display: block;
	width: 100%;
	margin-top: 0px; margin-bottom: 0px;
	margin-left: auto; margin-right: auto;
	padding-top: 0px; padding-bottom: 0px;
	background-color: rgba(0, 255, 0, 0.0); /* Should be transparent */
	border-style: solid; border-width: 0px; /* No border */
}



.subSectionNew {
	width: 100%;
	margin: auto;
	margin-top: 0px; margin-bottom: 0px;
	padding-top: 0px; padding-bottom: 0px;
	display: block;               /* Enables Flexbox */
	justify-content: center;     /* Centers horizontally */
	align-items: center;         /* Centers vertically */
	background-color: rgba(0, 0, 0, 0.0); /* No Color */
}
.subSectionNewBlueDark {
	width: 100%;
	margin: auto;
	margin-top: 0px; margin-bottom: 0px;
	padding-top: 20px; padding-bottom: 20px;
	display: block;               /* Enables Flexbox */
	justify-content: center;     /* Centers horizontally */
	align-items: center;         /* Centers vertically */
	background-color: rgba(0, 80, 120, 1.0);
}
	.topSection {
		width: 100%;
	}
	.bottomSection {
		padding: 20px;
		background-color: rgba(200, 200, 200, 0.0);
		text-align: center;
	}
	.imageArea{
		width: 100%;
		display: block;
		align-content: center;
		padding-top: 15px; padding-bottom: 15px;
		background-color: rgba(0, 255, 0, 0.0); /* Should be transparent */
	}
		.imageNoBorder {
			display: block;
			width: 75%;
			margin: auto;
			border-radius: 10px;
		}
		.imageNoBorderCircle {
			display: block;
			width: 65%;
			margin: auto;
			border-radius: 300px;
		}
	.infoArea {
		width: 100%;
		display: block;
		/*align-content: center;*/
		text-align: center;
		/*background-color: rgba(0, 175, 0, 1.0);*/
		padding-top: 20px; padding-bottom: 20px;
		padding-left: 20px; padding-right: 20px;
		background-color: rgba(0, 255, 0, 0.0); /* Should be transparent */
	}
	.infoAreaBlueDark {
		width: 100%;
		display: block;
		/*align-content: center;*/
		text-align: center;
		background-color: rgba(0, 80, 120, 1.0);
		padding-top: 20px; padding-bottom: 20px;
		padding-left: 20px; padding-right: 20px;
	}
	.textArea {
		display: block;
		width: 100%;
		/*text-align: left;*/
		background-color: rgba(0, 255, 0, 0.0); /* Should be transparent */
	}



.imageContainerSmall {
	display: block;
	width: 85%;
	background-color: rgba(0, 0, 0, 0.25);
	text-align: center;
	margin: auto;
	margin-top: 5px; margin-bottom: 5px;
	border-radius: 10px;
	padding-top: 5px; padding-bottom: 5px;
}
	.smallImage {
		display: inline;
		margin-left: 15px; margin-right: 15px; margin-top: 10px; margin-bottom: 10px;
		width: 20%;
		border-radius: 5px;
	}



.buttonGreen{
	display: inline-block;
	background-color: rgba(113, 225, 32, 1.0);
	width: 60%;
	margin: auto; margin-top: 10px; margin-bottom: 10px;
	padding-top: 10px; padding-bottom: 10px;
	color: rgba(0, 80, 120, 1.0);
	font-size: 1.25em;
	text-align: center;
}

.buttonGreenNew {
	background-color: rgba(113, 225, 32, 1.0);
	display: block;
	width: 40%;
	margin: auto;
	padding-top: 10px; padding-bottom: 10px;
	padding-left: 10px; padding-right: 10px;
	color: rgba(0, 80, 120, 1.0);
	font-size: 1.25em;
}

.buttonWhiteNew {
	background-color: rgba(240, 240, 240, 1.0);
	display: inline-block;
	width: 80%;
	margin: auto;
	margin-top: 15px; margin-bottom: 15px;
	padding-top: 10px; padding-bottom: 10px;
	padding-left: 10px; padding-right: 10px;
	color: rgba(0, 80, 120, 1.0);
	font-size: 1.25em;
	text-align: center;
}



.formBlueDark {
	display: block;
	background-color: rgba(0, 80, 120, 1.0);
	border-style: solid; border-width: 3px;
	border-color: rgba(113, 225, 32, 0.0);
	border-radius: 10px;
	margin: auto;
	margin-top: 25px; margin-bottom: 25px;
	padding: 15px;
	padding-top: 20px; padding-bottom: 20px;
	text-align: left;
	
	width: 95%;
}
	.formInputText{
		width: 100%;
		margin-top: 15px; margin-bottom: 15px;
		outline: none;
		border-top: none; border-left: none; border-right: none;
		border-bottom-style: solid; border-bottom-width: 1px;
		border-bottom-color: rgba(0, 180, 255, 1.0);
		background-color: transparent;
		color: rgba(255, 255, 255, 1.0);

		padding-left: 10px;

		font-size: 1.10em;
	}
		.formInputText:focus {
			border-color: rgba(113, 225, 32, 1.0);
			border-width: 2px;
		}
		.formInputText::placeholder {
			color: rgba(200, 200, 200, 0.3);
		}

	.formInputTextArea{
		box-sizing: border-box;
		resize: none;
		width: 100%;
		margin-top: 20px; margin-bottom: 15px;
		outline: none;
		border-style: solid; border-bottom-width: 1px;
		border-color: rgba(0, 180, 255, 1.0);
		border-width: 1px; border-radius: 5px;
		background-color: transparent;
		color: rgba(255, 255, 255, 1.0);
		height: 7em;
		overflow: auto; overflow-anchor: 10px;
		padding-left: 10px;
		font-size: 1.10em;
	}
		.formInputTextArea:focus {
			border-color: rgba(113, 225, 32, 1.0);
			border-width: 2px;
		}
		.formInputTextArea::placeholder {
			color: rgba(200, 200, 200, 0.3);
		}

	.formInputButton {
		width: auto;
		display: block;
		margin: auto;
		margin-top: 15px; margin-bottom: 15px;
		padding-top: 5px; padding-bottom: 5px;
		padding-left: 10px; padding-right: 10px;
		background-color: rgba(240, 240, 240, 1.0);
		color: rgba(0, 80, 120, 1.0);
		border-style: none;
		font-size: 1.25em;
		cursor: pointer;
	}



/* ################################################################  */



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

	body {
			/*letter-spacing: 0.5px;*/
	}

	header {
		height: 70px;
		display: block;
		text-align: left;
		box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* X, Y, Blur, Color */
	}

/*
	footer {
		bottom: 0;
		position: fixed;
		z-index: 1;
		height: 25px;
	}
*/
	li {
		padding-top: 10px; padding-bottom: 10px;
	}


	.textNormalWhite {
		font-size: 1.15em;
	}
	.textNormalWhiteLeft {
		font-size: 1.15em;
	}
	.textNormalWhiteLeftList {
		font-size: 1.15em;
	}
	.textNormalWhiteLeftListItem {
		font-size: 1.15em;
		padding-left: 120px; padding-right: 120px;
	}

	.textImportantWhite {
		font-size: 1.75em;
	}

	.textNormalBlueLight {
		font-size: 1.25em;
	}
	.textNormalBlueLightLeft {
		text-align: left;
		font-size: 1.25em;
	}

	.textNormalBlueDark {
		font-size: 1.40em;
	}

	.textImportantBlueLight {
		font-size: 1.75em;
		text-align: center;
	}
	.textImportantBlueLightLeft {
		font-size: 1.75em;
		text-align: left;
	}

	.textImportantBlueDark {
		font-size: 2.25em;
	}
	.textMainBlueDark {
		font-size: 4em;
	}

	.textNormalGreen {
		font-size: 1.25em;
	}

	.textImportantGreen {
		font-size: 1.75em;
		text-align: center;
	}

	.textMainGreen {
		font-size: 4em;
	}



	.ribbonBigTransparent {
		width: 80%;
		display: inline-block;
		border-radius: 10px;
		padding-left: 25px; padding-right: 25px;
	}

	.ribbonBigBlue {
		width: 80%;
		display: inline-block;
		border-radius: 10px;
		/*font-size: 1.2em;*/
		padding-left: 50px;
	}

	.mainRibbonBlue {
		margin-top: 50px; margin-bottom: 50px;
		border-radius: 0px;
	}
	.subMainRibbonBlue {
		width: 80%;
		margin: auto;
		margin-top: 50px; margin-bottom: 50px;
		padding-top: 20px; padding-bottom: 20px;
	}

	.mainRibbon {
		margin-top: 0px; margin-bottom: 0px;
		padding-top: 0px; padding-bottom: 0px;
		border-radius: 0px;
	}


	
	#logo{
		height: 100%; width: auto;
		display: inline;
		float: left;
	}


	#navBar {
		height: 100%; width: 50%;
		display: inline;
		float: right;
		margin: auto;
		margin-top: 0px; margin-bottom: 0px;
		text-align: right;
		padding: 25px;
	}
		.navBarLink {
			width: 30%;
			display: inline;
			background-color: rgba(0, 80, 120, 0.0);
			color: rgba(0, 80, 120, 1.0);
			font-size: 1.2em;
			margin-left: 15px; margin-right: 15px;
		}
			.navBarLink:hover {
				/*background-color: rgba(113, 225, 32, 1.0);*/
				background-color: rgba(0, 80, 120, 1.0);
				/*color: rgba(0, 80, 120, 1.0);*/
				color: rgba(255, 255, 255, 1.0);
				border-radius: 5px;
			}


	.separator {
		
	}

	.mainSection {
		width: 75%;
		padding-top: 0px; padding-bottom: 0px;
		background-color: rgba(0, 0, 0, 0.0);
	}

	
	.subSectionNew {
		width: 100%;
		/*margin-top: 50px; margin-bottom: 50px;*/
		/*padding-top: 0px; padding-bottom: 0px;*/
		display: flex;              /* Enables Flexbox */
		flex-direction: column;
		justify-content: center;     /* Centers horizontally */
		align-items: center;         /* Centers vertically */
	}
	.subSectionNewBlueDark {
		width: 80%;
		/*margin-top: 80px; margin-bottom: 80px;*/
		/*padding-top: 50px; padding-bottom: 25px;*/
		display: flex;              /* Enables Flexbox */
		flex-direction: column;
		justify-content: center;     /* Centers horizontally */
		align-items: center;         /* Centers vertically */
		border-radius: 10px;
	}
		.topSection {
			display: flex;
			/*flex-direction: column; /* Adjust as needed */
			align-items: center;
			justify-content: center;
			text-align: center;
		}
		.bottomSection {
		  	width: 100%; /* Take full width */
			/*background-color: #004d1a; /* Dark green */
			/*color: white;*/
		}
		.imageArea{
			width: 40%;
			display: inline-block;
			align-content: center;
		}
			.imageNoBorder {
				width: 85%;
				display:inline;
			}
			.imageNoBorderCircle {
				width: 75%;
				display:inline;
			}
		.infoArea {
			width: 50%;
			display: inline-block;
		}
		.infoAreaBlueDark {
			width: 50%;
			display: inline-block;
			border-radius: 10px;
		}
		.textArea {
			width: 100%;
			display: block;
		}


	.imageContainerSmall {
		width: 50%;
	}
		.smallImage {
			width: 12.5%;
		}


	.buttonGreen{
		background-color: rgba(113, 225, 32, 1.0);
		width: 50%;
		margin: auto; margin-top: 15px; margin-bottom: 15px;
		padding-top: 10px; padding-bottom: 10px;
		color: rgba(0, 80, 120, 1.0);
		font-size: 1em;
	}

	.buttonGreenNew{
		/**/
	}

	.buttonWhiteNew {
		width: 40%;
	}
		.buttonWhiteNew:hover {
			background-color: rgba(220, 220, 220, 1.0);
		}


	.formBlueDark {
		width: 80%;
	}
		.formInputText {
			width: 100%;
			font-size: 1.10em;
		}
		.formInputTextArea {
			width: 100%;
			font-size: 1.10em;
		}
		.formInputButton:hover {
			background-color: rgba(220, 220, 220, 1.0);
		}

}