* {
    box-sizing: border-box;
}

.row::after {
    content: "";
    clear: both;
    display: table;
}
body {
  background-color: #FDEBD0;
}

[class*="col-"] {
    float: left;
    padding: 15px;
}

html {
    font-family: "Lucida Sans", sans-serif;
}

.header {
    background-color: #eb984e;
    background-image: linear-gradient(to right, #eb984e, brown);
    color: #ffffff;
    padding: 15px;
    border-radius: 10px;
}

.menu ul {
    list-style-type: none;
    padding: 0;
}

.menu li {
    padding: 8px;
    margin-bottom: 5px;
    background-color: #76d7c4;
    background-image: linear-gradient(to right, #76d7c4, dodgerblue);
    color: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    border-radius: 10px;
}

.menu li:hover {
    background-color: #0099cc;
}

.aside {
    background-color: #27ae60;
    background-image: linear-gradient(to right, #27ae60, green);
    padding: 15px;
    color: #ffffff;
    text-align: center;
    font-size: 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    border-radius: 10px;
}

.footer {
    background-color: #239b56;
    background-image: linear-gradient(to right, darkgreen, lawngreen);
    color: #ffffff;
    text-align: center;
    font-size: 12px;
    padding: 15px;
    border-radius: 10px;
}

table.greenTable {
  font-family: Georgia, serif;
  border: 6px solid #24943A;
  background-color: #D4EED1;
  width: 100%;
  text-align: center;
}
table.greenTable td, table.greenTable th {
  border: 1px solid #24943A;
  padding: 3px 2px;
}
table.greenTable tbody td {
  font-size: 10px;
}
table.greenTable thead {
  background: #24943A;
  background: -moz-linear-gradient(top, #5baf6b 0%, #3a9e4d 66%, #24943A 100%);
  background: -webkit-linear-gradient(top, #5baf6b 0%, #3a9e4d 66%, #24943A 100%);
  background: linear-gradient(to bottom, #5baf6b 0%, #3a9e4d 66%, #24943A 100%);
  border-bottom: 0px solid #444444;
}
table.greenTable thead th {
  font-size: 17px;
  font-weight: bold;
  color: #F0F0F0;
  text-align: left;
  border-left: 2px solid #24943A;
}
table.greenTable thead th:first-child {
  border-left: none;
}

table.greenTable tfoot td {
  font-size: 12px;
}
table.greenTable tfoot .links {
  text-align: right;
}
table.greenTable tfoot .links a{
  display: inline-block;
  background: #FFFFFF;
  color: #24943A;
  padding: 2px 8px;
  border-radius: 5px;
}

/* For mobile phones: */
[class*="col-"] {
    width: 100%;
}

@media only screen and (min-width: 600px) {
    /* For tablets: */
    .col-s-1 {
        width: 8.33%;
    }
    .col-s-2 {
        width: 16.66%;
    }
    .col-s-3 {
        width: 25%;
    }
    .col-s-4 {
        width: 33.33%;
    }
    .col-s-5 {
        width: 41.66%;
    }
    .col-s-6 {
        width: 50%;
    }
    .col-s-7 {
        width: 58.33%;
    }
    .col-s-8 {
        width: 66.66%;
    }
    .col-s-9 {
        width: 75%;
    }
    .col-s-10 {
        width: 83.33%;
    }
    .col-s-11 {
        width: 91.66%;
    }
    .col-s-12 {
        width: 100%;
    }
}
@media only screen and (min-width: 768px) {
    /* For desktop: */
    .col-1 {
        width: 8.33%;
    }
    .col-2 {
        width: 16.66%;
    }
    .col-3 {
        width: 25%;
    }
    .col-4 {
        width: 33.33%;
    }
    .col-5 {
        width: 41.66%;
    }
    .col-6 {
        width: 50%;
    }
    .col-7 {
        width: 58.33%;
    }
    .col-8 {
        width: 66.66%;
    }
    .col-9 {
        width: 75%;
    }
    .col-10 {
        width: 83.33%;
    }
    .col-11 {
        width: 91.66%;
    }
    .col-12 {
        width: 100%;
    }
}

img {
    float: right;
    max-width: 100%;
    height: auto;
}

.center {
  text-align: center;
}

.mylegend {
    font-size: 11px;
}

table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

a:link {
    color: black;
    text-decoration: none;
}
/* visited link */
a:visited {
    color: darkblue;
    text-decoration: none;
}
/* mouse over link */
a:hover {
    color: lightblue;
    text-decoration: none;
}
/* selected link */
a:active {
    color: blue;
    text-decoration: none;
}

.myButton {
	box-shadow:inset 0px 1px 0px 0px #cf866c;
	background:linear-gradient(to bottom, #d0451b 5%, #bc3315 100%);
	background-color:#d0451b;
	border-radius:3px;
	border:1px solid #942911;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:10px;
	padding:2px 6px;
	text-decoration:none;
	text-shadow:0px 1px 0px #854629;
}
.myButton:hover {
	background:linear-gradient(to bottom, #bc3315 5%, #d0451b 100%);
	background-color:#bc3315;
}
.myButton:active {
	position:relative;
	top:1px;
}
.myButton2 {
	box-shadow: 0px 10px 14px -7px #3e7327;
	background:linear-gradient(to bottom, #77b55a 5%, #72b352 100%);
	background-color:#77b55a;
	border-radius:4px;
	border:1px solid #4b8f29;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:10px;
	font-weight:bold;
	padding:2px 6px;
	text-decoration:none;
	text-shadow:0px 1px 0px #5b8a3c;
}
.myButton2:hover {
	background:linear-gradient(to bottom, #72b352 5%, #77b55a 100%);
	background-color:#72b352;
}
.myButton2:active {
	position:relative;
	top:1px;
}
.myButton3 {
	box-shadow: 0px 10px 14px -7px #276873;
	background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
	background-color:#599bb3;
	border-radius:8px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:12px;
	font-weight:bold;
	padding:5px 8px;
	text-decoration:none;
	text-shadow:0px 1px 0px #3d768a;
}
.myButton3:hover {
	background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
	background-color:#408c99;
}
.myButton3:active {
	position:relative;
	top:1px;
}

.glow {
    font-size: 16px;
    color: #ffffff;
    text-align: left;
    -webkit-animation: glow 2s ease-in-out infinite alternate;
    -moz-animation: glow 2s ease-in-out infinite alternate;
    animation: glow 2s ease-in-out infinite alternate;
  }
@-webkit-keyframes glow {
    from {
      text-shadow: 0 0 2px #eeeeee, 0 0 4px #767474, 0 0 6px #767474, 0 0 8px #767474, 
                   0 0 10px #40cdc2, 0 0 12px #40cdc2, 0 0 14px #40cdc2;
    }
    to {
      text-shadow: 0 0 4px #eeeeee, 0 0 6px #fffd4d, 0 0 8px #fffd4d, 0 0 10px #fffd4d,
                   0 0 12px #fffd4d, 0 0 14px #fffd4d, 0 0 16px #fffd4d;
    }
  }