/*
$color1: #ff5001;
$color2: #ff5b28;
*/

html,
body {
/*   background:  linear-gradient(to bottom, #ff6824, #ff4f00); */
    background:  linear-gradient(to bottom, #FF7F00, #ff6824);
/*     background: linear-gradient(to bottom, #FF6346, #FF6346); */
  
/*    background: linear-gradient(to bottom, #FF5000, #FF5001); */
  height: 100%;
  letter-spacing: -.03rem;
}

p {
  color: #EEEAE7;
  text-align: center;
  font-family: "Inter", sans-serif;
  	font-size: .7em;
  	font-weight:300;
}

a {
		text-decoration:none;
			color: #eeeae7;

		font-weight:600;
		
			}

h1 {
  -webkit-background-clip: text;
  background-size: contain;
  width: 100%;
  text-align: center;
  color: transparent;
  font-weight: 500;
  font-family: "Inter", sans-serif;

  &::before {
    content: attr(data-heading);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    /* background: linear-gradient(45deg, rgba(255,255,255,0) 45%,rgba(255,255,255,0.8) 50%,rgba(255,255,255,0) 55%,rgba(255,255,255,0) 100%); */
    background: linear-gradient(45deg,
        rgba(255, 219, 109, 0) 45%,
        rgba(255, 219, 109, 0.8) 50%,
        rgba(255, 219, 109, 0.5) 55%,
        rgba(255, 219, 109, 0) 100%);
    -webkit-background-clip: text;
    color: transparent;
    mix-blend-mode: screen;
    animation: shine 15s infinite;
    background-size: 300%;
/*
    text-shadow: 2px 2px 10px rgba(#b7b7b7, 0.2), -2px 2px 10px rgba(#b7b7b7, 0.2),
      -2px -2px 5px rgba(#b7b7b7, 0.2);
*/
  }
}

@keyframes shine {
  0% {
    background-position: -100%;
  }

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

/* Not needed for demo */

/*
@font-face {
  font-family: "Inter", sans-serif;
}
*/

html,
body {
	
}

h1 {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
  font-size: 3.5vw;
  margin: 0;
  font-family: "Inter", san-serif;
  font-weight: 500;
  letter-spacing: -0.2rem;
}