﻿html
{
	font-size: 100%;
}

body
{
	background-color: black;
    background-image: url('../images/backgrounds/clouds.jpg');
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: 100% 100%;
	color: black;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
}

a:link
{
	color: black;
}

a:visited
{
	color: #000080;
}

a:hover
{
	color: red;
}

a:active
{
	color: black;
}

a.btn, .newsletter a
{
	background: #1650b4;
    background-image: -webkit-linear-gradient(top, #1650b4, #5386F2);
    background-image: -moz-linear-gradient(top, #1650b4, #5386F2);
    background-image: -ms-linear-gradient(top, #1650b4, #5386F2);
    background-image: -o-linear-gradient(top, #1650b4, #5386F2);
    background-image: linear-gradient(to bottom, #1650b4, #5386F2);
    text-shadow: 1px 1px 3px #000000;
    color: #ffffff;
}

a.btn
{
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  border-radius: 1em;
  font-size: 2.5em;
  padding: 0.25em 0.5em; /*10px 20px*/;
  border: solid #1e2ab0 2px;
  text-decoration: none;
}

a.btn:hover, .newsletter a:hover {
  background: #0348E9;
}

header
{
	margin-top: 1em;
	width: 100%;
}

footer
{
	float:left;
	width: 100%;
	color: white;
	text-shadow: 2px 2px black; /* px worked better than em */
}

img
{
	max-width: 100%;
	height: auto;
	border: 0 #111111 hidden;
	border-collapse: collapse;
    -ms-interpolation-mode: bicubic;
}

img.left
{
	float:left;
	margin: 0.5em 0.5em 0.5em 0;
}

img.right
{
	float: right;
	margin: 0.5em 0 0.5em 0.5em;
}

img.photo
{
	box-shadow:	3px 3px 4px #888888;
}

article
{
	text-align: justify;
	margin: 0 0.75em;
}

article .title
{
	text-align:center;
	font-weight: bold;
}

article.learning {
	margin-bottom: 2.5em;
}

article.learning:last-child
{
	margin-bottom: auto;
}

nav
{
	width: 100%;
	display: table;
	table-layout: fixed;
	color: #FFFFFF;
	background: #1650b4;
	font-size: 0.875em;
	position: relative;
	z-index: 10;
}

nav ul {
	padding: 0;
}

.menu-button {
	text-align: left;
	background: #1650b4;
	color: #FFFFFF;
}

.menu-button .touch-button .navicon {
	color: #FFFFFF;
}

.flexnav.flexnav-show {
	text-align: left;
}

.flexnav .touch-button .navicon {
	font-size: 1em;
	color: white;
	top: 1em;
}

.flexnav li, .flexnav li a {
	background: inherit;
	border-left: none;
	padding: 0;
}

ul.flexnav
{
	display: table-row;
	overflow: visible;
    margin: 0;
    padding: 0;
}

ul.flexnav li
{
    box-sizing: border-box;
	display: table-cell;
    vertical-align: middle;
}

nav ul li a
{
    text-decoration: none;
    color: #FFFFFF;
    line-height: 2.813em; /* same as .flexnav .touch-button */
}

.flexnav .touch-button {
	text-align: right;
	width: 1em;
	height: 2.813em; /* same as nav ul li a */
	background: transparent;
}

nav ul li a:link, nav ul li a:visited
{
	color: #FFFFFF;
}

nav li:hover, nav a:hover
{
	background: #0348E9;
}

nav a:hover
{
	text-decoration: underline;
}

li.item-with-ul > a:hover {
	text-decoration: none;
}

.flexnav li ul li a {
	background: #0348E9;
	line-height: normal;
	padding: 1em 0;
}

.flexnav li ul li:hover, .flexnav li ul li a:hover {
	background: #5386F2;
}

form
{
	margin: 1em;
	border: thin black solid;
	background-color: lightgray;
	padding: 1em 0.5em;
}

form div
{
	text-align: left;
	padding-left: 1em;
}

form div p
{
	margin: 0;
}

form .errorMsg
{
	color: red;
	display: none;
}

form div input, form div textarea
{
	width: 96.69421%;
	margin-bottom: 1em;
}

form div input[type=checkbox]
{
	width: auto;
	margin-bottom: 0;
}

form div select{
	margin-bottom: 1em;
}

form div input.error, form div textarea.error {
	background: red;
}

form div.submit
{
	text-align: center
}

form input#submit
{
	color: black;
	width: auto;
	min-width: 20%;
	font-weight: bold;
	margin-bottom: 0;
}

form .disclaimer
{
	font-size: 0.833em;
	font-style: italic;
	color:red;
	margin-bottom: 1em;
}

form .wrapper
{
	padding-left: 0;
	margin-bottom: 1em;
}

form .wrapper div:last-child input
{
	margin-bottom: 0;
}

form .botcatcher {
	position: absolute;
	top: -10em;
}

div.marketImages
{
	text-align: left;
}

p.aircraft
{
	margin-top: 0.313em;/* 5/16=0.313 */
	margin-bottom: 0.313em;
	font-size: 0.833em;
	font-weight: bold;
}

div.guidelines
{
	border: 1px #FF0000 solid;
	background-color: #FFFF00;
	color: #FF0000;
	padding: 0 0.5em;
}

a.guidelines {
	color: #FF0000;
}

#accordion
{
	text-align: left;
	margin: 0 0.75em;
}

#wrapper
{
	margin: 0 auto;
	width: 100%;
	max-width: 1000px; /* px OK here */
	overflow: hidden;
}

#sideBlock
{
	width: 20%; /* 200/1000 = 20 */
	background-color: #282833;
	display: table-cell;
	vertical-align: top;
	padding-bottom: 1em;
}

#contentWrapper /* wraps the sidebar and main content under one div */
{
	display: table;
	width: 100%;
}

#mainContent
{
	/* background-image: url('../images/backgrounds/bak_plans_000a.jpg'); */
	background-color: #FFFFFF;
	width: 80%;
	display: table-cell;
	font-size: 1em;
	color: black;
	padding-bottom: 1em;
}

#headerLogoCell
{
	width: 21.5%;
	/* height:12.8%; */
	float:left;
}

#address
{
	color: #FFFFFF;
	font-size: 0.750em;
	font-weight: bold;
}

#headerText
{
	float:left;
    width:78.5%;
    margin: 1.75em 0; /* 1.75em top and bottom, none on the side */
}

#welcome
{
    font-weight: bold;
    font-size: 1.5em;
	text-shadow: 1px 1px black; /* px worked better than em */
	color: #e0c600;
	margin: 0;
}

#chapter
{
	font-family: Arial black, Arial, Helvetica, sans-serif;
	/*color: white /* for winter*/
	color: #1650b4;
	font-weight: 700;
    font-size: 4.583em;
	margin: 0;
	/*text-shadow: 3px 3px black; /* for winter. px worked better than em */
	text-shadow: 0 0 5px white;
}

#msnStatement
{
	font-size: 0.813em;
	font-weight: 700;
	font-style: italic;
	font-family: "Times New Roman", Times, serif;
	/*text-shadow: 1px 1px black; /* for winter. px worked better than em */
	color: #AD8C31;
	margin: 0;
}

#nextMeeting
{
	border: medium #1650b4 solid;
	border-radius: 1.563em; /* 25 / 16 = 1.563 */
    background-color: #e0c600;
	padding: 0 0.625em 0 0.625em; /* 10 / 16 = 0.625 */
	text-align: justify;
	margin: 0.5em;
}

#nextRally
{
	border: medium #e0c600 solid;
	border-radius: 1.563em; /* 25 / 16 = 1.563 */
	background-color: darkblue;
}

#nextMeeting .title
{
	font-weight: bold;
}

#lastUpdated
{
    font-weight: normal;
    font-size: 0.625em;
    font-style: italic;
}

#memberTable
{
    display: table;
    width: 100%;
    border: thin black solid;
    color: black;
}

#memberTable td
{
	text-align: left;
	padding: 0.25em 0 0.25em 2em;
}

#memberTable td.dateCol
{
    text-align: center;
}

#memberTable tr:nth-child(odd)
{
	background-color: lightgray;
}

#memberTable tr:nth-child(even)
{
	background-color: white;
}

#memberTable tr.header
{
    border: thin black solid;
    background-color: #0066CC;
    color: white;
    font-weight: bold;
}

#yeSchedule td
{
	vertical-align: top;
}

#youngEagles .contentHeader:not( :first-child )
{
	margin-top: 2em;
}

#yeSchedule .location
{
	font-size: 1.16em;
	font-weight: bold;
	padding-top: 1em;
}

#yeSchedule .dates
{
	width: 45%;
	vertical-align: top;
}

.videoWrapper
{
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 1.56em; /* 25px */;
    height: 0;
}

.videoWrapper iframe, .videoWrapper script, .videoWrapper object, .videoWrapper embed
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.pageTitle
{
	font-size: 1.313em;
	font-weight: bold;
	padding: 0.750em 0 1em 0;/*top right bottom left*/
}

.caption
{
	font-size: 0.813em;
}

.confirmation
{
	font-weight: bold;
	margin-top: 5em;
}

.finePrint
{
	font-size: 0.625em;
	color: #ffffff;
	font-family: "Arial Narrow", Arial, Helvetica, sans-serif;
	text-align: center;
	margin: 0 0.385em 0 0.85em; /*top right bottom left*/
}

/* Special nav test is used in the sidebar. Maybe just nest it properly instead of giving it a name. */
.specialNavText
{
	margin: 1em 0.5em;
	color: #FFFFFF;
}

.specialNavText a:link, .specialNavText a:visited
{
	color: #FFFFFF;
}

.specialNavText a:hover
{
	color: red;
}

.specialNavText a:active
{
	color: #FFFFFF;
}

.contentHeader
{
	font-size: 1.313em;
	font-weight: bold;
	color: #1650b4;
	margin: 0.313em 0 0.313em 0; /* 5/16 = 0.313 */
	text-shadow: 1px 1px black;
}

.bulletinboard
{
	background:url('../images/backgrounds/Corkboard.gif');
	background-size: 100% auto;
	background-repeat:repeat-y;
	min-height: 25em;
	width: auto;
	margin:0 0.5em 1em 0.5em;
	border: 0.75em #663300 ridge;
	overflow: hidden;
}

.bulletinboard p
{
	margin-top:3em;
	font-weight:bold;
}

.photoboard
{
	overflow: hidden;
	width: 100%;
	height: 100%;
}

.bulletinbox, .bulletinboxwide, .photobox
{
    float: left;
}

.bulletinbox
{
    width: 33.333333%;
    height: auto;
}

.bulletinboxwide
{
	width: 66.666666%;
	height: auto;
}

.photobox
{
	width: 24.999999%
}

.photobox .leadership
{
	height: 15em; /* Forces the boxes to be equal height. */
}

.newsletter
{
	height: 4em;
	border: 1px black solid;
}

.currentNewsletter
{
	overflow: hidden;
	background-image:url('../images/newsletter.jpg');
	width: 223px; /*PX OK here*/
	height:175px; /*PX OK here*/
	margin: 0 auto;
}

.newsletter a, .currentNewsletter a
{
	font-weight: bold;
	display: block;
}

.newsletter a
{
	text-decoration: none;
	height: 4em;
	line-height: 4em;
}

.currentNewsletter a
{
	color: #676767;
	font-size:1.375em;
	padding-top: 15px; /*PX OK here*/
	height:160px; /*PX OK here*/
}

.currentNewsletter a:hover
{
	color: red;
}

.bulletin, .newsletter
{
	margin: 0.313em; /* 5/16 = 0.313 */
    overflow: hidden;
}

.bulletin img
{
   max-width: 100%;
}

.nameTitle
{
	margin: 0 auto 0.313em auto; /* 5/16 = 0.313 */
}

.notice
{
	border: medium white solid;
	border-radius: 1.563em; /* 25 / 16 = 1.563 */
	padding: 0.625em; /* 10 / 16 = 0.625 */
	text-align: left;
}

.calendar
{
	margin: 0 0.5em;
}

.calendar .contentHeader
{
	margin-top: 2em;
}

.calendar .contentHeader:first-child
{
	margin-top: 0;
}

.calendar .event
{
	border: 1px black solid;
	display: table;
	width: 100%;
}

.calendar .date
{
	display: table-cell;
	width: 20%;
	min-width: 6em; /*96px;*/
	border-right: 1px black solid;
	background: #1650b4;
	color:white;
	font-weight: bold;
	vertical-align:middle;
	font-size:1.5em;
}

.calendar .date p
{
	margin: 0.5em 0;
}

.calendar .details
{
	background: lightgray;
	padding: 0.125em;
	display: table-cell;
}

.calendar .details .title
{
	margin:0.25em 0 0.75em 0;
}

.calendar .past
{
	opacity: 0.6;
}

.marketItem
{
	background-color: lightgray;
	border: thin black solid;
	padding: 0 0.5em;
	margin-top: 1em;
}

.marketItem .date
{
	font-style: italic;
	font-size: 0.833em;
}

.marketItem img
{
	margin: 1em;
}

.learning .headerRow
{
	border: thin black solid;
}

.learning .logoCell, .learning .headerCell
{
	padding: 0.5em;
}

.learning .headerCell
{
	width: 75%;
}

.learning ul
{
	padding: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
}

.learning a
{
	word-break: break-all;
}

.group:after
{
	visibility: hidden;
	display: block;
	content: "";
	clear: both;
	height: 0;
}

* html .group             { zoom: 1; } /* IE6 */
*:first-child+html .group { zoom: 1; } /* IE7 */

/* Media Queries */
@media screen and (max-width: 1000px)
{
	body
	{
		font-size: 90%;
	}

	.finePrint
	{
		font-size: 0.750em;
	}
}

@media screen and (max-width: 820px)
{
	nav
	{
		font-size: .800em;
	}
}

@media screen and (max-width: 768px)
{
	body
	{
		font-size: 80%;
	}

	nav
	{
		font-size: 0.875em;
	}

	#chapter
	{
	    font-size: 3em;
	    text-shadow: 2px 2px black;
	}

	.finePrint
	{
		font-size: 0.750em;
	}

	.bulletinbox
	{
	    width: 50%;
	}

	.bulletinboxwide
	{
		width: 100%;
	}

	.photobox
	{
		width: 33.333333%
	}

	.photobox .leadership
	{
		height: 16em; /* Forces the boxes to be equal height. */
	}

	.currentNewsletter a
	{
		font-size:1.5em;
	}
}

@media screen and (max-width: 700px)
{
	/* Use the mobile menu now */
	nav
	{
		display: block;
	}

	nav, .menu-button, .menu-button .touch-button .navicon {
		font-size: 1.2em;
	}

	.flexnav li a {
		padding-left: 1em;
	}

	nav ul.flexnav
	{
		display: none;
	}

	nav ul.flexnav-show {
		display: block;
	}

	ul.flexnav li
	{
	    display: block;
	}

	.flexnav li ul li a {
		padding: 1em 2em;
	}

	.flexnav .touch-button {
		width: 3em;
	}

	.navicon {
		margin-right: 2em;
	}
}

@media screen and (max-width: 550px)
{
	body
	{
		font-size: 70%;
	}

	.photobox
	{
		width: 49.999999%
	}

	.photobox .leadership
	{
		height: 17em; /* Forces the boxes to be equal height. */
	}

	.currentNewsletter a
	{
		font-size:1.750em;
	}
}

@media screen and (max-width: 480px)
{
	header
	{
		font-size: 0.75em;
	}

	#sideBlock
	{
		width: 100%;
		display: table-row;
	}

	#mainContent
	{
		width:100%;
	}

	#address
	{
		font-size: 1em;
	}

	.bulletinbox
	{
	    width: 100%;
	}

	.photobox .leadership
	{
		height: 19.5em; /* Forces the boxes to be equal height. */
	}

	.notice
	{
		text-align: center;
	}

	.finePrint
	{
		font-size: 0.875em;
	}

	div.marketImages
	{
		text-align: center;
	}
}

@media screen and (max-width: 320px)
{
	#msnStatement
	{
		display: none;
	}
}
