body {
  background-color: #eeeeee;
  margin: 0px;
}

* {
  box-sizing: border-box;
}

/*FONTS*/
h1 {
  color: #000000;
  font-family: Helvetica, Sans-Serif; 
  font-size: 40px;
  font-weight: bold;
}

p {
  color: #000000;
  font-family: Helvetica, Sans-Serif; 
  font-size: 20px;
  font-weight: bold;
}

p2 {
  color: #ff0000;
  font-family: Helvetica, Sans-Serif; 
  font-size: 25px;
  font-weight: bold;
}

p3 {
  color: #000000;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 15px;
  font-weight: regular;
}

input[type=text] {
  color: #000000;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 20px;
  font-weight: regular;
  width: 60%;
}

select {
  color: #000000;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 20px;
  font-weight: regular;
}

input[type=password] {
  color: #000000;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 20px;
  font-weight: regular;
  width: 20%;
}


input[type=submit] {
  color: #000000;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 20px;
  font-weight: bold;
}

.container1 a:link {
  color: #000000;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 15px;
  font-weight: regular;
  background-color: transparent;
  text-decoration: underline;
}

.container1 a:visited {
  color: #555555;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 15px;
  font-weight: regular;
  background-color: transparent;
  text-decoration: underline;
}

.container1 a:hover {
  color: #999999;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 15px;
  font-weight: regular;
  background-color: transparent;
  text-decoration: underline;
}

.container1 a:active {
  color: #999999;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 15px;
  font-weight: regular;
  background-color: transparent;
  text-decoration: underline;
}

/* HEADER */
.header {
  background-color: #cccccc;
  background-image: linear-gradient(#cccccc, #bbbbbb);
  padding: 2px;
  text-align: center;
}

/* NAVBAR */
.sitenav {
  overflow: hidden;
  background-color: #dddddd;
  background-image: linear-gradient(#dddddd, #cccccc);
  text-align: center;
}

/* NAVBAR LINKS */
.sitenav a {
  float: left;
  display: block;
  text-align: center;
  padding: 14px 16px;
  color: #000000;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 15px;
  font-weight: regular;
  background-color: transparent;
  text-decoration: underline;
}

.sitenav a:hover {
  background-color: #888888;
  color: #eeeeee;
}

.sitenav a:active {
  background-color: #555555;
  color: #cccccc;
}

.container1 {
  overflow-wrap: break-word;
}

/* CONTENT */
.content {
  float: left;
  padding: 10px;
}

.content.right {
  width: 25%;
}

.content.left {
  width: 25%;
}

.content.center {
  width: 100%;
  text-align: center;
}

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

/* Responsive layout - makes the three contents stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
  .content.side, .content.center {
    width: 100%;
  }
}

/* FOOTER */
.footer {
  background-color: #dddddd;
  background-image: linear-gradient(#bbbbbb, #cccccc);
  padding: 10px;
  text-align: center;
  position: fixed;
  bottom: 0;
  width: 100%;
}

/* Special shit */
.supersmol {
  color: #000000;
  font-family:  Helvetica, Sans-Serif; 
  font-size: 7px;
  font-weight: regular;
}