body {
  z-index: 0;
  color: #fff;
  background-color: #444;
  font-size: 0.6em;
  overflow-x: hidden;
  overflow-y: hidden;

  background-image: '{{ background }}' no-repeat center center fixed;
  /* Background: Carbon Mesh */
  /*
	background:
		linear-gradient(27deg, #151515 5px, transparent 5px) 0 5px,
		linear-gradient(207deg, #151515 5px, transparent 5px) 10px 0px,
		linear-gradient(27deg, #222 5px, transparent 5px) 0px 10px,
		linear-gradient(207deg, #222 5px, transparent 5px) 10px 5px,
		linear-gradient(90deg, #1b1b1b 10px, transparent 10px),
		linear-gradient(#1d1d1d 25%, #1a1a1a 25%, #1a1a1a 50%, transparent 50%, transparent 75%, #242424 75%, #242424);
	background-color: #131313;
	background-size: 20px 20px;
	*/

  /* Background: Carbon Fibre */
  /*
	background:
		radial-gradient(black 15%, transparent 16%) 0 0,
		radial-gradient(black 15%, transparent 16%) 8px 8px,
		radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
		radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
	background-color:#282828;
	background-size:16px 16px;
	*/
}

a:link,
a:visited {
  color: #fff;
  text-decoration: none;
}

a:hover,
a:active {
  text-decoration: none;
  color: #fff;
  text-shadow: 0 0 5px #fff;
  transition: text-shadow 0.3s, color 0.3s;
  -moz-transition: text-shadow 0.3s, color 0.3s;
  -webkit-transition: text-shadow 0.3s, color 0.3s;
}

#logo {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: -10;
}

#lynx {
  width: 250px;
  height: 250px;
  opacity: 0.5;
}

.item {
  padding: 10px;
  margin-left: 20px;
  margin-bottom: 15px;
  width: 50px;
  text-align: center;
}

.topleft {
  position: absolute;
  width: 25px;
  max-height: 80%;
  left: 75px;
  top: 100px;

  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: flex-start;
  align-content: left;
  justify-content: flex-start;
}

.bottomright {
  position: absolute;
  max-height: 400px;

  display: flex;
  flex-wrap: wrap-reverse;
  flex-direction: column-reverse;
  align-items: flex-start;
  justify-content: flex-start;
  align-content: stretch;

  bottom: 85px;
  right: 95px;
}

.icon {
  width: 35px;
  height: 35px;
}

.icon:hover {
  filter: drop-shadow(0 0 5px #fff);
  transition: box-shadow 0.3s, color 0.3s;
  -moz-transition: box-shadow 0.3s, color 0.3s;
  -webkit-transition: box-shadow 0.3s, color 0.3s;
}

div.item:hover {
  filter: drop-shadow(0 0 5px #fff);
  transition: box-shadow 0.3s, color 0.3s;
  -moz-transition: box-shadow 0.3s, color 0.3s;
  -webkit-transition: box-shadow 0.3s, color 0.3s;
}

.datapad {
  border-width: 3px;
  border-style: solid;
  border-color: #fff;
  border-radius: 5px;

  position: absolute;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);

  padding: 10px;
  text-align: center;

  width: 1000px;
  height: 600px;

  background-color: rgba(10, 10, 10, 0.5);
  /*
    background-color: repeating-linear-gradient()
    */
}