
:root {
    --timing: cubic-bezier(0.19, 1, 0.22, 1);
    --delay : 1s;
    --dl: 600ms;
}
.none {
    animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

@keyframes slideInFromLeft {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes glow {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
  }
  to {
    text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
  }
}

@keyframes glow2 {
  0% {
    box-shadow: 0px 0px 33px 4px rgba(75, 123, 255, 0.9);
  }
  50% {
    box-shadow: 0px 0px 60px 4px rgba(75, 123, 255, 0.9);
  }
  100% {
    box-shadow: 0px 0px 33px 4px rgba(75, 123, 255, 0.9);

  }
}

.hdswa {
    animation: 1s var(--timing) 0s 1 slideInFromLeft;
}

seaaaction:hover {
  transition-duration: var(--delay);
  -webkit-box-shadow:0px 0px 33px 4px rgba(45,255,196,0.9);
  -moz-box-shadow: 0px 0px 33px 4px rgba(45,255,196,0.9);
  box-shadow: 0px 0px 33px 4px rgba(45,255,196,0.9);
  
}



#section {
  border-radius: 19px;
  padding: 30px;
  animation: 10s cubic-bezier(0.6, 0.04, 0.98, 0.335) 0s infinite glow2;
}

section:hover {
  box-shadow: 0px 0px 66px 4px rgba(75, 123, 255, 0.9);
}

section {
  box-shadow: 0px 0px 33px 4px rgba(75, 123, 255, 0.9);
  border-radius: 19px;
  padding: 30px;
  transition-duration: var(--dl);
}

#socials {
  padding-bottom: 30px;
}

@font-face {
  font-family: CothamSans; 
  src: url("./fonts/CothamSans.otf");
}

body, h2, h3, h1 {
  font-family: CothamSans;
}
