/* Notes 
font-family: Arial, Verdana, Tahoma, Trebuchet MS, Times New Roman, Georgia, Garamond, Courier New, Brush Script MT
colours:  FITC green #36704F
*/

@font-face
{
  font-family:'FITC Roboto Mono';
  font-style:normal;
  font-weight:100 700;
  font-display:swap;
  src:url(/fonts/fitc-roboto-mono.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD
}

@font-face
{
  font-family:FITC Font Awesome;
  font-display:block;
  src:url(/fonts/fitc-font-awesome.eot?v=6);
  src:url(/fonts/fitc-font-awesome.eot?#iefix&v=6) format("embedded-opentype"),url(/fonts/fitc-font-awesome.woff?v=6) format("woff"),url(/fonts/fitc-font-awesome.ttf?v=6) format("truetype"),url(/fonts/fitc-font-awesome.svg#fontawesomeregular?v=6) format("svg");
  font-weight:400;
  font-style:normal
}

@font-face
{
  font-family:'FITC Sans Pro';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url(/fonts/fitc-sans-pro.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD
}

* { 
  box-sizing: border-box;
  font-family: FITC Sans Pro, Arial, Verdana, sans-serif;
  margin: 0;

}

body {
  background-color: white;
  color: #888;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
}



/* Symantec tag formatting */
article {
}

aside {
}

details {
}

figcaption {
}

figure {
}

footer {
  width:1200px;
  height:50px;
  z-index: 2;
  overflow: hidden;
  position: fixed;
  bottom: 0;
  background-color: #202020;
}

header {
  Width:100%;
  Height:190px;
  background-color: #36704F;
}

main {
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
}

mark {
  background-color: yellow;
}
nav {
}

section {
  width:100%;
  padding:50px;
}

summary {
}

time {
}

/* Tag Formatting */
a {
}
a:link {
  text-decoration: none;
}

p {
  color: #777; margin-left: 10px;
  font-size: 18px; /* 14px/16=0.875em */
}

p.code {
  margin-left: 10px;
  font-family: Courier New;
  color: green;
  background-color: black;
}
img {
  box-shadow: 0px 0px 0px black;
  border-radius: 3%;
}

/* Basic Styles */
h1 {
  margin-left: 10px;
  font-size: 50px; /* 40px/16=2.5em */
  font-family: 'FITC Sans Pro';
  color: #dddddd;
  text-align: centre;
}

h2 {
  margin-left: 10px;
  font-size: 20px; /* 30px/16=1.875em */
  text-align: center;
}

h3 {
  margin-left: 10px;
  font-size: 0.875em; /* 14px/16=0.875em */
}

/* Column and row tags for layout */
.column {
  float: left;
}
/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Background colours for sections */
.bgc1 {
  background-color: white;
  min-height: 300px;
}

.bgc2 {
  background-color: #f8f8f8;
  min-height: 300px;
}

.header-image {
  background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url("/images/header-image.jpeg");
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.header-text {
  text-align: center;
  position: absolute;
  top: 20%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
}

.footer-text {
  text-align: center;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
}

.navbar {
  z-index: 2;
  overflow: hidden;
  position: fixed;
  top: 0;
  width: 1200px;
  color: white;
  text-align: center;
  background-color: #202020;
  height: 50px;
  font-size: 16px;
}

.navbar a {
  float: left;
  display: inline;
  color: #f2f2f2;
  text-align: center;
  padding: 15px 10px;
  text-decoration: none;
}

.navbar a:hover {
  background: #ddd;
  color: black;
}

.active {
  background: #606060;
  color: white;
}

.all {
/*  padding: 16px; */
  margin-top: 50px;
}

.button {
  background-color: #36704F;
  border: none;
  color: white;
  padding: 8px 20px;
  text-align: center;
  text-decoration: none;
  font-weight: bold; 
  display: inline-block;
  font-size: 16px;
  font-weight: normal;
  margin: 4px 2px;
  border-radius: 6px;
}

.button:hover {
  background: #56906F;
}

input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
  font-size: 16px;
}

input[type=submit] {
  background-color: #36704F;
  color: white;
  padding: 8px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-weight: normal; 
  font-size: 16px;
}

input[type=submit]:hover {
  background-color: #56906F;
  
}

.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}