@font-face {
	font-family: 'Ostrich Sans Rounded';
	src: url('../webfonts/ostrich-sans-rounded.eot');
	src: local('☺'), url('../webfonts/ostrich-sans-rounded.woff') format('woff'), url('../webfonts/ostrich-sans-rounded.ttf') format('truetype'), url('../webfonts/ostrich-sans-rounded.svg') format('svg');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: 'League Gothic Condensed';
	src: local('☺'), url('../webfonts/LeagueGothic-Condensed.woff') format('woff'), url('../webfonts/LeagueGothic-Condensed.ttf') format('truetype'), url('../webfonts/LeagueGothic-Condensed.svg') format('svg');
	font-weight: 500;
	font-style: normal;
}

@font-face {
    font-family: "Junction Regular";
    src: url('../webfonts/junction-regular.eot');
	src: local('☺'), url('../webfonts/junction-regular.woff') format('woff'), url('../webfonts/junction-regular.ttf') format('truetype'), url('../webfonts/junction-regular.svg') format('svg');
	font-weight: 500;
}

@font-face {
    font-family: "Junction Light";
    src: url('../webfonts/junction-light.eot');
	src: local('☺'), url('../webfonts/junction-light.woff') format('woff'), url('../webfonts/junction-light.ttf') format('truetype'), url('../webfonts/junction-light.svg') format('svg');
	font-weight: 500;
}

.front-page {
  width: 100;
  background-color: white;
  overflow: auto;
}

.front-page a {
  float: left;
  text-align: center;
  width: 20%;
  margin: 10% 0;
  transition: all 0.3s ease;
  color: #2e3b26;
  font-size: 70px;
}

.front-page a:link {
  text-decoration: none;
}

.front-page a:visited {
  text-decoration: none;
}

.front-page a:hover {
  color: #4f694d; /* Add a hover color */
}

.front-page p {
  font-family: "Junction Regular";
  font-size: 20pt;
}

.icon-bar {
  width: 100%; /* Full-width */
  background-color: #2e3b26; /* Dark-grey background */
  overflow: auto; /* Overflow due to float */
}

.icon-bar a {
  float: left; /* Float links side by side */
  text-align: center; /* Center-align text */
  width: 16%; /* Equal width */
  padding: 12px 0; /* Some top and bottom padding */
  transition: all 0.3s ease; /* Add transition for hover effects */
  color: white; /* White text color */
  font-size: 36px; /* Increased font size */
}

.icon-bar a:hover {
  background-color: #4f694d; /* Add a hover color */
}

.active {
  background-color: #616640; /* Add an active/current color */
}

.column {
  font-family: "Junction Light";
  font-size: 15pt;
}

.left {
  float: left;
  width: 40%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 0;
  padding-bottom: 1%;
  padding-left: 2%;
  padding-right: 1%;
  box-sizing: border-box;
}

.right {
  float: right;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 0;
  padding-bottom: 1%;
  padding-left: 1%;
  padding-right: 2%;
  box-sizing: border-box;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.footer {
  font-family: 'League Gothic Condensed';
  font-size: 40pt;
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  /*height: 50pt;*/
  margin-top: 0;
  margin-bottom: 0;
  padding: 0;
  padding-right: 1%;
  background-color: #2e3b26;
  color: white; /*#c3d4dc;*/
  text-align: right;
  box-sizing: border-box;
}

.spacer {
  height: 3%;
  width: 100%;
  margin: 5%;
}

img {
  width: 100%;
  /*height: 80%;*/
  margin: auto;
}

h1 {
  font-family: "Ostrich Sans Rounded";
  text-align: center;
  color: #2e3b26;
  font-size: 40pt;
  padding-top: 2%;
  padding-bottom: 5%;
}

h2 {
  font-family: "Junction Regular";
  font-size: 20pt;
}

#frontpage_title {
  font-size:50pt;
  letter-spacing: 1em;
  padding-bottom: 0px;
  margin-bottom: 0px;
}