@import url("https://fonts.googleapis.com/css2?family=Darker+Grotesque:wght@300;400;500;600;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=VT323&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;800&family=VT323&display=swap");
@tailwind base;
@tailwind components;
@tailwind utilities;

body {
  background-color: rgb(12, 12, 12);
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  color: white;
}

.text-stroke-3 {
  text-shadow: -0.5px -0.5px 0 rgb(12, 12, 12), 0.5px -0.5px 0 rgb(12, 12, 12),
    -0.5px 0.5px 0 rgb(12, 12, 12), 0.5px 0.5px 0 rgb(12, 12, 12);
}


 
.text-fade{
  position: relative;
  color: #161616;
}

.text-fade:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(30, 30, 30, 0) 20%, rgb(30, 30, 30) );
  pointer-events: none;
}

.shadow-c-primary {
  box-shadow: 0 0 10px 0.25px #1CEE71;
  background-color: #1CEE71;
}


.shadow-c-warn {
  box-shadow: 0 0 10px 0.25px #ff0000;
  background-color: #ff0000;
}

.shadow-c-orange {
  box-shadow: 0 0 10px 0.25px #FFA500;
  background-color: #FFA500;
}
