﻿/* CSS Document */

* {
	padding:0;
	margin:0;
}

form,
body,
html {
	height: 100%;
}

	form div + div + div {
	
	height: 100%;

	}

body {
	/*background-image:url(images/interface/splash-bg.jpg);*/
	/*background-position: top;*/
	background-repeat: no-repeat;
	color: #fff;
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;

}

.wrapper {
display: flex; 
flex-wrap:wrap;
height: 100%;
}

#header {
	width: 100%;
	height: auto;
	background-color: #fff;
	padding-bottom: 10px;
	height: 33%;
	z-index: 10;
}

@media (max-height: 800px) {
	#header {
		height: 270px;
	}
	}
#header h1 {
	color: #000;
}

.logo-ctn img {
	display: inline-block;
	margin-right: 20px;
}
.logo-ctn h1 {
	display: inline-block;
	width: 600px;
	font-weight: 800;
	position: relative;
	bottom: 10px;
	font-size: 24px;
}
	.logo-ctn h1 span {
		color: #365f91;
		font-weight: 600;
	}

#header p {
	color: #000;
	font-size: 23px;
	text-align: left;
	margin: 10px 0;
	font-weight: 600;
	margin-left: 146px;
}


#header .inner {
	max-width: 800px;
	margin: auto;
}

#logo {
	width: 120px;
	left: 8px;
	position:relative;
}


.img-ctn {
	width: 100%;
	padding-bottom: 16%;
	background-position:center center;
	background-size: contain;
	background-repeat: no-repeat;
}
/*h3 {
	float: left;
	padding: 0px 20px 0px 20px;
	margin-left: 4px;
	font-size: 24px;
	font-family: "Times New Roman", Times, serif;
	 font-style: italic;
	background-color: #995113;
	width: auto;
}*/
img {
	border: 0;
}

#main { 
    height: auto !important;
	width: 100%;
	padding-bottom: 100px;
	display: flex;
	align-self: flex-end;
	 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#5082bd+0,dbe5f2+50,e4ead8+50,8ea369+100 */
	background: rgb(80,130,189); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(80,130,189,1) 0%, rgba(219,229,242,1) 50%, rgba(228,234,216,1) 50%, rgba(142,163,105,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(80,130,189,1) 0%,rgba(219,229,242,1) 50%,rgba(228,234,216,1) 50%,rgba(142,163,105,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(80,130,189,1) 0%,rgba(219,229,242,1) 50%,rgba(228,234,216,1) 50%,rgba(142,163,105,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5082bd', endColorstr='#8ea369',GradientType=0 ); /* IE6-9 */
}

@media (max-height: 800px) {
	#main {
		display:block;
		/*height: 800px;*/
	}
}

#logo1 {
	float:left;
	margin-left:5px;
	margin-top:155px;
}

#logo2 {
	float:left;
	margin-left:42px;
	margin-top:161px;
}

#redboxwrap {
	width: 642px;
	margin-left: 20px;
	position: relative;
	margin: 0 auto;
	margin-top: 100px;
}

#redbox {
	/*background-image:url(images/interface/redbox_bg.png);*/
	background: #fff;
	color: #000;
	border: 5px solid #ccc;
	padding: 10px ;
}

.redboxtxt {
	width: 470px;
	/*padding: 20px;
	margin-left:24px;*/
	clear: both;

}

.blue-bg {
	background: #4f81bd;
	color: #fff;
	padding: 5px;
	margin: 0 0 10px 0;
	display: inline-block;
}

.green-bg {
	padding: 5px;
	display: inline-block;
	background: #76923c;
	color: #fff;
	margin: 25px 0 10px;
}

.redboxtxt p {
	/*padding: 15px 0px 15px 0px;*/
}

#nav {
	position:absolute;
	width: 275px;
	top:36px;
	left: 550px;
}

#nav a {
	display:block;
}

#nav img {
	display:block;
}

#btn {
	position:absolute;
	top:36px;
	left:475px;
}

#btn_mtl {
	margin-top:20px;
}

.btn {
	text-align: center;
	border: 4px solid #ccc;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.25rem;
	padding: 10px;
	margin-bottom: 20px;
}

.btn-blue {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2f4d71+0,4f81bd+100 */
	background: rgb(47,77,113); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(47,77,113,1) 0%, rgba(79,129,189,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(47,77,113,1) 0%,rgba(79,129,189,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(47,77,113,1) 0%,rgba(79,129,189,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2f4d71', endColorstr='#4f81bd',GradientType=1 ); /* IE6-9 */
}

.btn-green {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#475724+0,76923c+100 */
	background: rgb(71,87,36); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(71,87,36,1) 0%, rgba(118,146,60,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(71,87,36,1) 0%,rgba(118,146,60,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(71,87,36,1) 0%,rgba(118,146,60,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#475724', endColorstr='#76923c',GradientType=1 ); /* IE6-9 */
}


	.btn span {
	display: block;
	font-weight: normal;

	}

#nav .btn span {
	font-size: 14px;
}