/*-----------------------------------------------------------------------------------
	Author: -
-----------------------------------------------------------------------------------*/
body{
    background:#31324A;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

/* make keyframes that tell the start state and the end state of our object */
    @-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
    @-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
    @keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fade-in {
  opacity:0; 
  -webkit-animation:fadeIn ease-in 1;
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;
  -webkit-animation-fill-mode:forwards; 
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-duration:1.5s;
  -moz-animation-duration:1.5s;
  animation-duration:1.5s;
}