@font-face {
  font-family: ari;
  src: url(fonts/ari-w9500.ttf);
  font-weight: normal
}

@font-face {
  font-family: ari;
  src: url(fonts/ari-w9500-bold.ttf);
  font-weight: bold
}

@keyframes borderStartUp {
  from {background-color: white;}
  to {background-color: #191b30;}
  from {height: 0px}
  to {height: 512px}
}

button {
  color: white;
  border-width: 2px;
  background-color: #3000cc;
  cursor: pointer;
  scale: 1.1;
  font-family: ari;
}

a:link {
  color: #8aedff;
}
a:hover {
  color: #00ffe5;
}
a:visited {
  color: #608187;
}

body {
  background-image: url('background.png');
  color: white;
  font-family: ari
  
}

.title-border {
  color: white;
  width: 25%;
  padding: 10px;
  margin: 10px;
  border: solid 2px;
  background-color: #191b30;
  text-align: center;
  margin: 0% auto;
  line-height: 5px;
  box-shadow: 6px 10px rgba(0, 0, 0, 0.4);
}

.default-border {
  color: white;
  width: 25%;
  height: 512px;
  padding: 10px;
  margin: 10px;
  border: solid 2px;
  background-color: #191b30;
  box-shadow: 6px 10px rgba(0, 0, 0, 0.4);
  overflow-y: auto;
  animation-name: borderStartUp;
  animation-duration: 0.5s;
}

.footer-border {
  color: white;
  width: 75%;
  padding: 10px;
  margin: 10px;
  border: solid 2px;
  background-color: #191b30;
  text-align: center;
  margin: 0% auto;
  line-height: 5px;
  box-shadow: 6px 10px rgba(0, 0, 0, 0.4);
}

.border-container {
   display: flex;
   align-items: center;
   justify-content: center;
   
}

.circle-clip {
  clip-path: circle(64px);
}