html,
body {
  margin: 0;
  padding: 0;
  /* width: 100%;
  height: 100%; */
  overflow: hidden;
  background: linear-gradient(-45deg, #131862, #2e4482, #546bab, #2e4482);
    background-size: auto;
  background-size: 200% 200%;
  animation: gradientBG 60s ease infinite;
}

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

/* .parent {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	align-content: center; 
	justify-content: center; 
	overflow: auto;   
}
	
.block {
	background: transparent;
    width: 75%;
}

.stage {
  position: static;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: steelblue;
  box-shadow: 0 -400px 300px -300px orangered inset;
  animation: sky 15s infinite linear;
}
  
.sun {
  position: absolute;
  left: 0;
  bottom: -30%;
  width: 10em;
  height: 10em;
  margin-left: -2.5em;
  margin-top: 0;
  background: orangered;
  border-radius: 50%;
  box-shadow: 0 0 20px orange;
  animation: 15s infinite linear;
  animation-name: move, sun-color;
}

.grass {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: url(/styles/images/grass.png) no-repeat center bottom;  
}

@keyframes sky {
  0% {
    background: darkslateblue;
    }
  50% {
    background: skyblue;
    box-shadow: 0 -400px 300px -300px steelblue inset;
    }
  85% {
   background: darkslateblue;
   box-shadow: 0 -400px 300px -300px orangered inset;
   }
  100% {
    background: darkslateblue;
    }
}

@keyframes move {
  0% {
    }
  10% {
    margin-left: -4.5em;
    }
  20% {
    margin-left: -5.5em;
    }
  30% {
    margin-left: -6em;
    }
  40% {
    margin-left: -4.5em;
    }
  50% {
    left: 50%;
    bottom: 75%;
    width: 5em;
    height: 5em;
    margin-left: -2.5em;
    }
  60% {
     margin-left: 1.5em;
    }
  70% {
    margin-left: 3.5em;
    }
  80% {
    margin-left: 2.5em;
    }
  90% {
    margin-left: 1em;
    }
  100% {
    left: 98%;
    margin-left: -2.5em;
    }
}


@keyframes sun-color {
  20% {
      background: orange;
    }
  40% {
      background: gold;
      box-shadow: 0 0 35px gold;
    }
  60% {
      background: yellow;
      box-shadow: 0 0 35px yellow;
    }
  80% {
    background: orange;
    } 
  
} */