@font-face { font-family: deltarune; src: url('/fonts/deltarune.ttf'); } 

html{
    cursor: url("SOUL_battle.ico"), default;
    color: white;
}

body {
  background: url(/images/backgrounds/underwater.gif);
  font-family: monospace;
  font-size: 14px;
}

.vignette {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: inset 0 0 200px 10px #000000;
  filter: opacity(100%);
  pointer-events: none;
  z-index: 1000;
}

a {
  color: red;
}

.image-container-left {
	 float: left; 
	 margin-right: 20px;
   }

.image-container-right {
	 float: right; 
	 margin-right: 20px;
   }

.header {
  font-family: deltarune;
  text-align: center;
  margin-bottom: 35px;
  margin-top: 35px;
  height: 100%;
  width: 100%;
  font-size: 120px;
  background-image: -webkit-linear-gradient(
    left, #f00, #ff2b00,#f50,#ff8000,#fa0,#ffd500,#ff0,
    #d4ff00,#af0,#80ff00,#5f0,#2bff00,#0f0,#00ff2a,
    #0f5,#00ff80,#0fa,#00ffd5,#0ff,#00d5ff,#0af,#0080ff,
    #05f,#002aff,#00f,#2b00ff,#50f,#8000ff,#a0f,
    #d400ff,#f0f,#ff00d4,#f0a,#ff0080,#f05,#ff002b,#f00
  );
  -webkit-animation: animatedBackground_a 5s linear infinite alternate;
  -webkit-background-clip: text;
  -webkit-text-fill-color: #0000;
  background-clip: text;
}

@keyframes animatedBackground_a {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -500px 0;
  }
}
/*Everything goes inside this.*/
.container {
  margin: 0 auto;
  width: 800px;
  margin-top: 5px;
  margin-bottom: 5px;
  
}

/*Main boxes.*/
.main {
  background: black;
  text-align: center;
  /*border: 3px double black;*/
  padding: 12px 17px;
  margin-bottom: 35px;
  margin-top: 35px;
  border: 1px solid white;
  box-shadow: 0 4px 8px -5px cornflowerblue, 0 6px 20px -5px cornflowerblue;
}


/*Prevent image overflow*/
.main img,{
  max-width: 100%;
  height: auto;
}


/* for sticky img, use <img src = "img.png" class = "sticky"> */
.sticky{
  position: fixed;
  right: 0px;
  bottom: 0px;
  width: 200-px;
    
}