/* 	 
	
	light-green: 	#50E3C2
	pale-green: 	#A5FBE8
	dark-green:	#218380
	red:		#FE4A49
	dark-red	#B93635
	yellow:		#F8E71C
	light-gray:	#F4F4F8
	blue: 		#4A90E2
	
*/
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

@media only screen and (max-width: 1023px) {

	header { position: fixed; left: 0; top: 0; width: 100%; }
	#menu { margin: 1em 1em 0 1em; border-bottom: solid .5px #218380; overflow: visible; height: 4em; padding-bottom: .5em; }
	#menu nav { display: inline-block; vertical-align: middle; }
	#menu nav ul li { display: inline-block; margin: 1em .5em; }
	#menu nav ul li a { text-decoration: none; font-size: 1.3em; font-weight: 900; color: #A5FBE8; text-transform: uppercase; }
	#menu nav ul li a:hover { text-decoration: none; color: #F8E71C; }
	#page-content { margin-top: 5.5em; height: 100%; overflow: visible; }

	section#content { margin: 1em; overflow: auto;}

	input[type=text], input[type=password] { padding: 0; }

	input, textarea, select { -webkit-appearance: none; border-radius: 0; }
	#company-branding { display: inline-block; vertical-align: middle; }
	#company-footnotes p { margin: 0; font-size: 14px; color: white; }
	#company-branding img { height: 3.75em;  }

}

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

	section#content { margin: 50px; }

	header { position: fixed; left: 0; top: 0; width: 150px; height: 100%; display: flex; flex-flow: column; }
	#menu { margin: 50px 0 25px 15px; }
	#page-content { margin-left: 150px; height: 100%; overflow: visible; min-width: 874px; 
	/* background-image: url('/images/graphics/green-misty-forest.png'); */
	/* background-size: 100% 100%; */
	}

	#menu { flex: 1 1 auto; display: flex; flex-flow: column; border-right: solid .5px #218380; }
	#menu nav { flex: 1 1 auto; margin: 50px 15px 25px 20px; }
	#menu nav ul li a { text-decoration: none; font-size: 1.1em; font-weight: 900; color: #A5FBE8; text-transform: uppercase; }
	#menu nav ul li a:hover { text-decoration: none; color: #F8E71C; }

	#company-branding { margin: 0 auto; }
	#company-branding img { width: 95%; }

	.half-rack, ul li { display: inline-block; width: 49.5%; vertical-align: top; }
	.half-rack:nth-child(odd), #page-content ul li:nth-child(even){ padding-left: .5em; }
	.half-rack:nth-child(even), #page-content ul li:nth-child(odd){ padding-right: .5em; }

}

html { 
height: 100%; 
background-color: #50E3C2; 
background-image: url('/images/graphics/background-noise.png');
}

body { 	
height: 100%; 
overflow: visible; 
margin: 0; 
color: #218380; 
}

/*********************/
/* Font Declarations */
/*********************/
body, input, textarea {
font-family: 'Lato', 'Sans Serif'; 
font-size: 18px; 
}

a img { border: none; }
a { color: #4A90E2; }
a:hover { text-decoration: underline;}
a:active { }
ul { margin: 0; padding: 0; list-style-type: none; }
em { font-weight: 700; }

form { 
background-image: url('/images/graphics/background-noise.png');
background-color: #4A4A4A; 
border-radius: 10px; 
border-top: solid 3px #333;
border-right: solid 2px #74FBDD;
border-bottom: solid 2px #74FBDD;
border-left: solid 3px #333;
padding: 20px 15px; 
}
input, textarea { 
background-color: transparent;
width: 100%;
max-width: 100%;
border: none;
border-bottom: solid 3px #F4F4F8;
border-bottom: solid 3px #333;
font-size: 26px;
font-weight: 300;
color: #F4F4F8;
}
input[type=checkbox]{
width: auto;
}
input[type=submit]{
background-color: #FE4A49;
border-radius: 15px;
border-bottom: solid 3px #B93635;
text-transform: uppercase;
font-size: 16px;
font-weight: 700;
cursor: pointer;
}
input[type=submit]:hover{
border: solid 1px #333;
border-bottom: solid 2px #333;
}
textarea { 
min-height: 300px;
}

#menu nav ul { margin: 0; padding: 0; }

#company-branding { }
#company-branding a { display: inline-block; width: 100%; }
#company-branding a:hover { text-decoration: none; }

#company-footnotes p { margin: 0; font-size: 14px; color: white; }

section#content { min-height: 100%; }
section#content ul { margin-top: 1em; }
h1 { font-weight: 300; margin-top: 15px; margin-bottom: 10px; font-size: 3em; }
h2 { font-weight: 700; margin-top: 10px; margin-bottom: 10px; font-size: 1.5em; }
p { margin-top: 10px; margin-bottom: 10px; }

header { 
background-color: #50E3C2; 
background-image: url('/images/graphics/background-noise.png');
}

footer { clear: both; padding: 1em; }

.red-button { display: inline-block; padding: .5em 1em; margin: 1em 0;  border: solid .5px #B93635;  background-color: #FE4A49; border-radius: 10px; font-weight: 700;  text-transform: uppercase; font-size: 24px; text-decoration: none; color: #F4F4F8; }
.red-button:hover { text-decoration: none; }
.right { float: right; }
.left { float: left; }

.message { color: white; padding: .5em; }
.error { background-color: #D0011B; }
.success { background-color: #218380; }

.rounded-rectangle { border-radius: 10px; }

.center-text { text-align: center; }

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #CCC;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #CCC;
opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #CCC;
opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #CCC;
}