.main {
    padding: 30px;
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 12pt;
}

.flex {
    display:flex;
}

.gap-120 {
    gap: 100px;
}

.main h2 {
    color: darkblue;
}

.main p{
    font-family: Arial; 
    text-align: justify;
}

.center-screen {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 100vh;
}


.loader {
  width: calc(6*30px);
  height: 50px;
  display: flex;
  color: #8d7958;
  filter: drop-shadow(30px 25px 0 currentColor) drop-shadow(60px 0 0 currentColor) drop-shadow(120px 0 0 currentColor);
  clip-path: inset(0 100% 0 0);
  animation: l13 2s infinite steps(7);
}
.loader:before {
  content: "";
  width: 30px;
  height: 25px;
  background: 
    radial-gradient(farthest-side at right,currentColor 92%,#0000) left/20px 100% no-repeat,
    radial-gradient(farthest-side,         currentColor 92%,#0000) right/17px 9px repeat-y;
}
@keyframes l13 {
  100% {clip-path: inset(0 -30px 0 0)}
}