@font-face {
  font-family: "Fredoka One";
  src: url("fredoka-one.otf");
}

body, html {
  height: 100%;
}

body {
  background: linear-gradient(170deg,rgba(74, 115, 238, 1) 0%, rgba(255, 255, 255, 1) 100%) fixed;
  font-size: larger;
  font-family: "Liberation Sans", Verdana, Arial, sans-serif;
}

h1, h2, h3 {
  font-weight: bolder;
  font-family: "Fredoka One", sans-serif;
}

h1 {
  color: #fff;
  font-size: 300%;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

h2 {
  color: #3451a9;
  padding: 0.25rem 1rem;
}

.section-infos h3 {
  border-bottom: 1px solid #3451a9;
  font-size: 100%;
  font-weight: bold;
  padding-top: 0.15rem;
}

@media (min-width: 768px) {
  .section-infos h3 {
    border-bottom: none;
  }
}

p {
  padding: 0 1rem;
  margin-left: 1rem;
}

a, a:visited, a:hover, a:active {
  color: #3451a9;
  font-weight: bold;
}

a, a:hover, a:active {
  font-weight: bolder;
}

a, a:visited {
  text-decoration: none;
}
a:hover, a:active {
  text-decoration: underline;
}

a.button {
  display: inline-block;
  color: #fff;
  background-color: #3451a9;
  border-color: #fff;
  border-radius: 1.25rem;
  padding: 1em 2em;
  text-decoration: none;
}
a.button:hover, a.button:active {
  background-color: #3451a9;
}

a.secondary {
  color: #000;
  background-color: #ff6;
  border-color: #ff6;
}

a.secondary:active, a.secondary:hover {
  background-color: #5c5ec2
}

abbr[title] {
  text-decoration: none;
}

@keyframes fade {
  from { opacity: 1.0; }
  50% { opacity: 0.5; }
  to { opacity: 1.0; }
}

.blink {
  animation: fade 1000ms infinite;
  -webkit-animation: fade 1000ms infinite;
}