@charset "utf-8";
/* CSS Document */

html, body {
    font: 62.5%/1.4 Verdana, Geneva, Arial, Helvetica, sans-serif;
  background: #E4DDDD;
  height: 100%;
  width: 100%;
}

/*
input, select, textarea, button {font-family:inherit;}
*/



h1, h2, h3, h4, h5, h6 {
  color: black;
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  font-size: 1.8rem;
  font-weight:400;
}

p, li, th, td, dt, dd {
  font-size: 1.6rem;
  color: #030303;
}

sup, sub {
  font-size: 65%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5rem;
}

sub {
  bottom: 0.25rem;
}


/* Default classes */
.flexRow {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 100%;
}


.flexColumn { display: flex;
flex-direction: column;
flex-basis 100%;
flex: 1;
}






/* Styling to keep footer at bottom of page using flexbox */
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

header {
  background: #931915;
  text-align: center;
  border-bottom: 2px outset #2A0706;
  max-height: 8rem;
}

#headerContainer {
  max-width: 160rem;
  margin: 0 auto;
  display:flex;
  flex-direction: row;
  justify-content: space-between;
  background: #931915;
}

header #logo {
  max-width: 60rem;
  background: #931915;
  text-align: left;
  padding: 1.5rem 0 0.4rem 1rem;
}

header #logo p {
  color: #0A460B;
  font-size: 4rem;
  font-family: Arial Black, Gadget, sans-serif;
  text-shadow: 0px 0px 0 rgb(-8,87,-3),1px 1px 0 rgb(-16,79,-11),2px 2px 0 rgb(-25,70,-20),3px 3px 0 rgb(-34,61,-29),4px 4px 0 rgb(-42,53,-37),5px 5px 0 rgb(-51,44,-46),6px 6px 0 rgb(-60,35,-55),7px 7px 0 rgb(-69,26,-64),8px 8px 0 rgb(-77,18,-72),9px 9px 0 rgb(-86,9,-81), 10px 10px  0 rgb(-95,0,-90),11px 11px 10px rgba(6,56,8,0.6),11px 11px 1px rgba(6,56,8,0.5),0px 0px 10px rgba(6,56,8,.2);
}

nav {
  flex-grow: 2;
  align-self: flex-end; /* vertically aligns to bottom of its container */
  text-align: right;
  font-size: 5rem;
  color: white;
  padding: 0 1rem 0 0;
}

#mainWrapper {
  flex-grow: 1;
  display: flex;
  flex-direction: rows;
  align-items: stretch;
  justify-content: center;
  text-align: center;
}

main {
  flex-grow: 1;
  width: 100%;
  max-width: 160rem;
  background: #fff;
  padding-top: 8rem;
  border: 1px outset #000;
  border-radius: 0 0 0.5rem 0.5rem;
  bbox-shadow: 2px 2px 6px rgba(0,0,0,0.8);
}

footer section {
  color: #fff;
  text-align: center;
  background: #931915;
  border-radius: 3rem;
  border: 2px outset #2A0706;
  box-shadow: 2px 2px 6px rgba(0,0,0,1.6);
  max-width: 160rem;
  padding: 0.4rem 1rem;
  margin: 4rem auto 3rem;
}

footer section h3, footer section sup {
  color: #fff;
}

header, footer {
  flex-shrink: 0;
}







/* styling for sub page layout */
#dataPanel {
padding-top: 3rem;
margin-top: 1rem;
  max-width: 108rem;
  border-radius: 0.5rem;
  box-shadow: 2px 2px 6px rgba(0,0,0,0.8);
}

#dataPanel table {
  margin: 1rem  auto 2rem;
}

aside {
  background: #B9F5BA;
  background: #F4FAF4;
  border: 1px outset #0F6B11;
  border-radius: 0.5rem;
  box-shadow: 2px 2px 6px rgba(0,0,0,0.8);
  flex-basis: 50rem;
  margin: 1rem 0 0 2rem;
}


table {
  border-collapse: collapse;
  border-spacing: 0;
  white-space: nowrap;
  border: 2px outset #062A07;
  border-radius: 0.5rem;
   box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}

thead, tfoot {
  background: #0F6B11;
}

thead th, thead td {
  color: white;
  /* font-size: ; */
  font-variant: small-caps;
  text-shadow: #000;
  font-weight: 300;
}

thead tr:first-child td:first-child {
border-radius: 0 0.5rem 0 0;
}

thead tr:first-child td:last-child {
  border-radius: 0 0.5rem 0 0;
}

thead tr:first-child th:only-child, thead tr:first-child td:only-child {
  border-radius: 0.5rem 0.5rem 0 0;
}

tfoot tr:last-child td {
  font-size: 0.4rem;  /* controls the height of the last row of all tables */
  height: 0.4rem;
}

tfoot tr:last-child td:first-child {
  border-radius: 0 0 0 0.5rem;
}

tfoot tr:last-child td:last-child {
  border-radius: 0 0 0.5rem 0;
}

tfoot tr:last-child td:only-child {
  border-radius: 0 0 0.5rem 0.5rem;
}

tbody td {
  padding: 0 0.2rem;
  border: 0.1rem outset #0F1368;
}

tbody tr:nth-child(even) {
  background: #F1FDF1;
}

tbody tr:hover {
  color: black;
  background: #FFFEEF;
}


/* default form styling */
.formContainer {}

.formSubmit {
  margin: 1em 0 0;
  font-size: 400%;
  background: orange;
}

.formContainer label {
  display: block;
  font-size: 300%;
  text-align: left;
}

.formContainer input:focus {
  background: yellow;
}

.formContainer div {
  display: inline-block;
  background: #E4DDDD;
  border: outset 2px black;
  border-radius: 4px;
  padding: 1em 3em;
  margin: 0, auto;
}

input[name="Bot_Glue"] {
  display: none;
}

.FormValidationError { /* Styling for errors generated from the form_validation class */
  background: #fcfc1a;
  display: inline-block;
  border-radius: 0.5em;
  border: 2px outset #8c0000;
  padding: 0.2em .8em;
  margin: 3rem 5em 3em;
}

.FormValidationError ul li ,
.FormValidationError p {
  color: #8c0000;
  text-align: left;
}

.FormValidationError h2 {
  font-size: 250%;
  font-weight: 400;
}

td input {
  background: #e2e2e2;
  cursor: pointer;
}

/* styling for form controller will need to be moved to another file */
.formController {
  display: inline-block;
  padding: 0.2rem;
  margin: 3rem auto;
}



.formController button {
  color: ;
  padding: 0;
  border: none;
  outline: none;
  font: inherit;
  color: inherit;
  background: none;
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
}



/* standard form button styling */

fieldset button[value="create"] {
  -moz-box-shadow:inset 0px 1px 0px 0px #1DD221;
  -webkit-box-shadow:inset 0px 1px 0px 0px #1DD221;
  box-shadow:inset 0px 1px 0px 0px #1DD221;
  background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0A460B), color-stop(1, #127E14));
  background:-moz-linear-gradient(top, #0A460B 5%, #127E14 100%);
  background:-webkit-linear-gradient(top, #0A460B 5%, #127E14 100%);
  background:-o-linear-gradient(top, #0A460B 5%, #127E14 100%);
  background:-ms-linear-gradient(top, #0A460B 5%, #127E14 100%);
  background:linear-gradient(to bottom, #0A460B 5%, #127E14 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0A460B', endColorstr='#127E14',GradientType=0);
  background-color:#0A460B;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  border:1px solid #0E6210;
  display:inline-block;
  cursor:pointer;
  color:#ffffff;
  font-family:Arial;
  font-size: 2.4rem;
  font-weight:bold;
  width: 100%;
  padding:4px 24px;
  text-shadow:0px 1px 0px #062A07;
}

fieldset button[value="create"]:hover {
  background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #127E14), color-stop(1, #0A460B));
  background:-moz-linear-gradient(top, #127E14 5%, #0A460B 100%);
  background:-webkit-linear-gradient(top, #127E14 5%, #0A460B 100%);
  background:-o-linear-gradient(top, #127E14 5%, #0A460B 100%);
  background:-ms-linear-gradient(top, #127E14 5%, #0A460B 100%);
  background:linear-gradient(to bottom, #127E14 5%, #0A460B 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#127E14', endColorstr='#0A460B',GradientType=0);
  background-color:#127E14;
}

fieldset button[value="create"]:active {
  position:relative;
  top:1px;
}


fieldset button[value="edit"] {
  -moz-box-shadow:inset 0px 1px 0px 0px #1E26D1;
  -webkit-box-shadow:inset 0px 1px 0px 0px #1E26D1;
  box-shadow:inset 0px 1px 0px 0px #1E26D1;
  background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0F1368), color-stop(1, #0E1262));
  background:-moz-linear-gradient(top, #0F1368 5%, #0E1262 100%);
  background:-webkit-linear-gradient(top, #0F1368 5%, #0E1262 100%);
  background:-o-linear-gradient(top, #0F1368 5%, #0E1262 100%);
  background:-ms-linear-gradient(top, #0F1368 5%, #0E1262 100%);
  background:linear-gradient(to bottom, #0F1368 5%, #0E1262 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0F1368', endColorstr='#0E1262',GradientType=0);
  background-color: #0F1368;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  border:1px solid #0A0D46;
  display:inline-block;
  cursor:pointer;
  color:#ffffff;
  font-family:Arial;
  font-size: 2.4rem;
  font-weight:bold;
  padding:4px 24px;
  margin: 0.4rem 0.2rem 0 0;
  text-shadow:0px 1px 0px #06082A;
}

fieldset button[value="edit"]:hover {
  background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0E1262), color-stop(1, #0F1368));
  background:-moz-linear-gradient(top, #0E1262 5%, #0F1368 100%);
  background:-webkit-linear-gradient(top, #0E1262 5%, #0F1368 100%);
  background:-o-linear-gradient(top, #0E1262 5%, #0F1368 100%);
  background:-ms-linear-gradient(top, #0E1262 5%, #0F1368 100%);
  background:linear-gradient(to bottom, #0E1262 5%, #0F1368 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0E1262', endColorstr='#0F1368',GradientType=0);
  background-color: #0E1262;
}

fieldset button[value="edit"]:active {
  position:relative;
  top:1px;
 }


fieldset button[value="delete"] {
  -moz-box-shadow:inset 0px 1px 0px 0px #1E1342E;
  -webkit-box-shadow:inset 0px 1px 0px 0px #1E1342E;
  box-shadow:inset 0px 1px 0px 0px #1E1342E;
  background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #931915), color-stop(1, #B51F1A));
  background:-moz-linear-gradient(top, #9319155%, #B51F1A 100%);
  background:-webkit-linear-gradient(top, #9319155%, #B51F1A 100%);
  background:-o-linear-gradient(top, #9319155%, #B51F1A 100%);
  background:-ms-linear-gradient(top, #9319155%, #B51F1A 100%);
  background:linear-gradient(to bottom, #9319155%, #B51F1A 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0F1368', endColorstr='#B51F1A',GradientType=0);
  background-color: #931915;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  border:1px solid #E54F4A;
  display:inline-block;
  cursor:pointer;
  color:#ffffff;
  font-family:Arial;
  font-size: 2.4rem;
  font-weight:bold;
  padding:4px 24px;
  margin: 0.4rem 0 0 0.2rem;
  text-shadow:0px 1px 0px #2A0706;
}

fieldset button[value="delete"]:hover, #delete:hover {
  background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #B51F1A), color-stop(1, #931915));
  background:-moz-linear-gradient(top, #B51F1A 5%, #931915100%);
  background:-webkit-linear-gradient(top, #B51F1A 5%, #931915100%);
  background:-o-linear-gradient(top, #B51F1A 5%, #931915100%);
  background:-ms-linear-gradient(top, #B51F1A 5%, #931915100%);
  background:linear-gradient(to bottom, #B51F1A 5%, #931915100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#B51F1A', endColorstr='#0F1368',GradientType=0);
  background-color:B51F1A;
}
fieldset button[value="delete"]:active, #delete:active {
  position:relative;
  top:1px;
 }


