html{
  position: relative; 
  min-height: 100%;
  font-family: Helvetica;
  overflow-y:overlay;
  overflow-x:hidden;
}



h2 {
	text-align: center;
	display: block;
	margin-top: 10px;
}

h3 {
	text-align: left;
}

.footer a {
	padding-top: 10px;
	padding-bottom: 10px;
	color: #252839;
	display: block;
	text-decoration: none;
	font-size: 8px;
}

.footer {
	padding-top: 10px;
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
	height: 60px;
	background-color: #1f1f1f;
	color: #d9d9d9;
	text-align: center;
	font-size: 16px;
	z-index: 0;
	
}


.signoff{
	font-size: 8px;
}

@media (max-width: 1000px) {

	body {
		
		min-height: 100vh;
	}
	
	.button {
		background-color: #ececec;
		padding: 45px;
		border: black;
		position: fixed;
		margin-left: 0px;
		margin-top: 0px;
		background-image: url("button.png");
		background-repeat: no-repeat;
		background-size: 90px;
	}


	.footer a {
		margin-top: 8px;
		margin-bottom: 0px;
		color: #d9d9d9;
		display: inline-block;
		text-decoration: none;
		font-size: 8px;
	}

	.footer a:hover{
		color: #83a0ff;
		transition: all 0.3s;
	}


	.footer {
		
		position: absolute;
		width: 100%;
		left: 0;
		margin: 0;
		bottom: 0;
		height: 70px;
		background-color: #1f1f1f;
		color: #d9d9d9;
		text-align: center;
		font-size: 14px;
		z-index: 0;
		
	}

	
	.mobile {
		position: fixed;
		display: inline-block;
	}

	.mobile:hover .sidebar {
		display: block;
	}

	.mobile:hover .button {
		transition: background-color 0.3s, transform, 0.3s;
		transform: rotate(90deg);
	}

	
	



	.mobile:not(:hover) .button {
		transition: transform, 0.3s;
		transform: rotate(0deg);
	}
	
	.sidebar {
		display: none;
		position: absolute;
		min-width: 100%;
		list-style-type: none;
		margin: 0;
		margin-top: 90px;
		padding: 0;
		width: 500px;
		background-color: #d9d9d9;
		height: 700px;
		overflow-y: scroll;
		z-index: 1;
	}

	.sidebar ul {
		overflow-y: scroll;
	}
	
	.sidebar li a.active {
		opacity: 1;
		background-color: #ffffff;
	}

	
	.sidebar li a:hover:not(.active) {
		transition: all 0.3s;
		opacity: 1;
		background-color: #ffffff;
	}
	
	.sidebar li a:not(:hover):not(.active) {
		transition: transform 0.3s, background-color 0.3s;
		transform: translateX(0px);
		background-color: #30475e;
		color: #ffffff;
	}

	

	
	.sidebar a {
		padding: 40px 40px 40px 60px;
		font-size: 40px;
		color: #252839;
		display: block;
		text-decoration: none;
	}
	body {
		margin: 0;
		background-color: #ffffff;
		padding-top: 118px;
		padding-bottom: 80px;
		position: relative;
	}

	.bodytext {
		color: #252839;
		font-size: 18px;
		line-height: 1.3;
		padding-top: 79px;
		padding-left: 2%;
		padding-right: 2%;
		padding-bottom: 60px;
	}
	.header {
		background-color: #ececec;
		color: #252839;
		position: fixed;
		height: 100px;
		top: 0;
		left: 0;
		width:100%;
		padding: 9px;
		z-index: 1;
	}

	.mobilelogo{
		margin: 0 auto;
		width: 100%;
		height: 100px;
		text-align: center;
	}
	.mobilelogo a {
		max-height: 100%;
		margin: auto;
		display:inline-block;
	}
	
	.mobilelogo img {
		max-height: 100px;
		max-width: 100%;
		
	}

	.navbar{
		visibility: hidden;
		display: none;
	}

	.bodybg {
		position: relative;
  		text-align: center;
		margin: 0 0 0 0;
		width: 100%;
		height: 500px;
		overflow: hidden;
		z-index: 0;
	}
	
	.bodybg img {
		opacity: 1;
		z-index: -1;
		max-width: 100%;
	}

	.welcome{
		font-weight: bold;
		position: absolute;
  		top: 50%;
  		left: 50%;
		transform: translate(-50%, -50%);
		opacity: 1;
		font-size: 50px;
		color:#00218d;
		text-shadow:
			-1px -1px 0 #ffffff,
			1px -1px 0 #ffffff,
			-1px 1px 0 #ffffff,
			1px 1px 0 #ffffff;  
		
	}

	.bodybg img {
		min-height: 100%;
		min-width: 100%;
		max-width: 100%;
	}

	@media (prefers-color-scheme: dark) {
		body{
			background-color: #242424;
		}
	}

}



@media (min-width: 1000px){
	.button {
		visibility: hidden;
		border: none;
		padding: 0;
		background: none;
		outline: none;
		z-index: -2;
	}

	.bodybg {
		position: relative;
  		text-align: center;
		margin: 0 0 0 0;
		width: 100%;
		height: 500px;
		
		overflow: hidden;
		z-index: 0;
		width: 100vw;
	}

	.bodytext a:hover {
		transition: all 0.3s;
	}
	.footer a {
		margin-top: 8px;
		margin-bottom: 0px;
		color: #d9d9d9;
		display: inline-block;
		text-decoration: none;
		font-size: 8px;
	}
	
	

	.footer a:hover{
		color: #83a0ff;
		transition: all 0.3s;
	}

	.footer a:active{
		color: #ffffff;
		transition: all 0.3s;
	}


	.footer {
		
		position: absolute;
		width: 100%;
		left: 0;
		bottom: 0;
		height: 70px;
		background-color: #1f1f1f;
		color: #d9d9d9;
		text-align: center;
		font-size: 14px;
		z-index: 0;
		
	}

	
	
	.header {
		background-color: #ececec;
		color: #252839;
		position: fixed;
		height: 80px;
		top: 0;
		left: 0;
		width:100%;
		padding: 10px;
		padding-right: 40px;
		background-image: url("logo.png");
		background-repeat: no-repeat;
		background-size: 220px;
		z-index: 1;
		width: 100vw;
	}
	


	.header ul {
		list-style-type: none;
		margin: 0;
		margin-right: 5px;
	}

	.navbar {
		padding: 15px 20px 10px 20px;
	}

	.header a {
		
		padding: 10px 10px 10px 10px;
		margin-right: 10px;
		font-size: 16px;
		color: #ffffff;
		display: block;
		text-decoration: none;
		z-index: 1;
		border-radius: 0px;
	}
	
	
	.header li {
		float:right;
		
	}


	.header li a.tab {
		cursor: pointer;
		display: block;
		z-index: 1;
	}
	
	.header li a.active {
		opacity: 1;
		background-color: #ffffff;
		color: #000000;
		z-index: 1;
	}


	.header li a:hover.active {
		opacity: 1;
		background-color: #ffffff;
		transition: all 0.3s;
		transform: translateY(8px);
		z-index: 1;
	}

	
	.header li a:hover:not(.active) {
		transition: all 0.3s;
		transform: translateY(8px);
		opacity: 1;
		background-color: #a1b7ff;
		z-index: 1;
	}
	
	.header li a:hover:not(.active):active {
		background-color: #ffffff;
		color: #ececec;
	}
	
	.header li a:not(:hover):not(.active) {
		transition: transform 0.3s, background-color 0.3s;
		transform: translateY(0px);
		background-color: #30475e;
		z-index: 1;
	}
	
	
	
	body {
		background-color: #ffffff;
		margin: 0 0 0 0;
		z-index: 2;
		margin-top: 100px;
		margin-bottom: 70px;
	}
	
	.bodytext {
		padding-left: 10%;
		padding-right: 10%;
		
		color: #000000;
		font-size: 18px;
		line-height: 1.3;
		opacity: 1;
		padding-top: 60px;
		padding-bottom: 60px;
		margin-right: 0%;
		z-index: 2;
		
	}

	.mobile {
		visibility: hidden;
		display:none;
	}
	.mobilelogo {
		visibility: hidden;
		display:none;
	}

	



	.welcome{
		position: absolute;
  		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		opacity: 1;
		font-size: 50px;
		color:#00218d;
		font-weight: bold;
		text-shadow:
			-1px -1px 0 #ffffff,
			1px -1px 0 #ffffff,
			-1px 1px 0 #ffffff,
			1px 1px 0 #ffffff;  
	}

	.bodybg img {
		opacity: 1;
		z-index: -1;
		min-height: 100%;
		min-width: 100%;
		max-width: 100%;
	}
	
}



::-webkit-scrollbar {
	display: block;
	background: transparent;
}

::-webkit-scrollbar-thumb {
	background-color: #242424;
  }

.bodytext a {
	color:#6161de;
}

.doublebox a {
	color:#ffffff;
}

.bodytext a:hover {
	color:#c6d3ff;
}

.bodytext a:active {
	color: #ffffff;
}

hr {
	background-color: #000cb4;
	height:2px;
	border: 0px;
}

@media (prefers-color-scheme: dark) {
	.bodytext {
		background-color: #242424;
		color: #ffffffcc;
	}

	.header {
		background-color: #ececec;
	}

	.header li a:not(:hover):not(.active) {
		background-color: #30475e;
		color: #ffffff;
	}
		
	.header li a.active {
		background-color: #30475e2e;
	}


	.body {
		background-color: #242424;
	}



	hr {
		background-color: #9FA8DA;
	}

	.bodybg {
		background-color: #000000;
	}

	.footer {
		background-color: #1a1a1a;
	}

	.bodybg img {
		opacity: .75;
	}

	
	
	img {
		opacity: 0.75;
	}
	
	.mobilelogo img {
		opacity: 1;
	}

	html{
		background-color: #242424;
		
	}

	::-webkit-scrollbar-thumb {
		background-color: #cecece;
	  }
}