/* Required height of parents of the Full Page Intro and Intro itself */
body {
  /* Premium quality linear gradient example */
background: linear-gradient(135deg, #1f1c2c 0%, #928dab 100%);
  background-repeat: no-repeat;
  min-height: 100vh;
  animation: moveGradient 10s ease infinite;
  background-size: 200% 200%; /* Add this line */
}

@font-face {
  font-family: 'MyFont'; /* Your font name */
  src: url('path/to/your/font.woff2') format('woff2'),
       url('path/to/your/font.woff') format('woff'),
       url('../fonts/RuntimeRegular-m2Odx.otf') format('opentype'), /* Include the .otf file */
       url('path/to/your/font.ttf') format('truetype'); /* You can also include .ttf */
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
 
.timer-box {
  background: rgba(10, 10, 10, 0.9);
  color: #fff;
  border-radius: 0.4em;
  font-family: "Barlow", sans-serif;
  align-content: center;
}

.timer-box-num {
  font-size: 30pt;
  text-align: center;
}

.timer-box-text {
  font-size: 10pt;
  text-align: center;
}

.content {
  font-family: "Barlow", sans-serif;
}

span.h4 {
  font-family: "Barlow", sans-serif;
}

i {
  color: black;
}

a > i.social-icon:hover {
  color: #1da1f2; /* Or any color you like */
  text-shadow: 0 4px 12px rgba(29,161,242,0.5), 0 1px 2px #fff;
  transition: color 0.2s, text-shadow 0.2s;
}

/* Increase icon size using font-size */
.social-icon {
  font-size: 30px;
  padding: 20px;
  /* or any size you want */
}


input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px white inset !important;
}

#notifs-forn-input,
#notifs-form-input:focus {
  border: solid 2px #ccc;
}

 @keyframes moveGradient {
     0% {
         background-position: 0% 50%;
     }

     50% {
         background-position: 100% 50%;
     }

     100% {
         background-position: 0% 50%;
     }
 }