/* https://material-ui.com/customization/color/#color-palette */
:root {
  --blue-50: #e3f2fd;
  --blue-800: #1565c0;
  --grey-800: #424242;
  --grey-600: #757575;
  --amber-50: #fff8e1;
}

body {
  font-family: FaktProSoft,"Helvetica Neue",helvetica,arial,sans-serif;
  background-color: var(--blue-50);
  font-size: 20px;
  margin: 0;
  padding: 0;
}

h1 {
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
  font-size: 30px;
  color: var(--blue-800);
  text-shadow: 2px 2px 5px var(--grey-600);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
}

.link-list {
  padding: 15px;
  margin-left: auto;
  margin-right: auto;
}


@media screen and (min-width: 576px) {
  .link-list {
    width: 500px;
  }
}

@media (min-width: 768px) {
  .link-list {
    width: 700px;
  }
}

@media (min-width: 992px) {
  .link-list {
    width: 900px;
  }
}

@media (min-width: 1200px) {
  .link-list {
    width: 1100px;
  }
}

a:link {
  text-decoration: none;
  color: var(--blue-800);
}

.link-icon {
  color: var(--blue-800);
}

.link-svg {
  fill: var(--blue-800);
  overflow: visible;
  width: 1em;
  height: 1em;
  display: inline-block;
  vertical-align: -.125em;
  margin-right: 0.25em;
}

a:link:hover {
  text-decoration: underline;
}

.link-desc {
  color: var(--grey-800);
  font-size: 14px;
  margin-left: 5px;
  margin-bottom: 10px;
}

.focus-in-contract-bck {
  animation: focus-in-contract-bck 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

li {
  list-style: none;
}

@keyframes focus-in-contract-bck{0%{letter-spacing:1em;transform:translateZ(300px);filter:blur(12px);opacity:0}100%{transform:translateZ(12px);filter:blur(0);opacity:1}}

.slide-in-elliptic-top-fwd {
	background-color: var(--amber-50);
	height: 10px;
	margin-top: -35px;
	z-index: -1;
}

.slide-in-left {
	animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

/* ----------------------------------------------
 * Generated by Animista on 2019-1-8 21:25:7
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-in-left
 * ----------------------------------------
 */
 @keyframes slide-in-left {
  0% {
    transform: translateX(-20px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}