/* CSS for home page */


#top, #bottom {
	float:left;
  position:absolute;
  width:680px;
	margin-bottom: 15px;
  }

#bottom {
  height:200px;
	margin-top:505px;
  background-color: #576faf;
  }
  
#bottomtext {
  color: #ffffff;
  font-size: 22px;
  }


#top-animation, #bottom-animation, #slidebox {
  animation-timing-function: ease-in-out;
  animation-fill-mode: both;
}

#top-animation {
	animation-name: top-text;
	animation-duration: 3s;
	animation-delay: 14s;
  }
  @keyframes top-text {
	  0%   {margin-top: 340px;}
	  100%  {margin-top: 30px; }
  }

#bottom-animation {
  position: absolute;
  animation-name: bottom-graphic;
  animation-duration: 3s;
  animation-delay: 13s;
  }
  @keyframes bottom-graphic {
	  0%	{opacity:100%}
	  100%	{opacity:0%}
  }

#slidebox {
  position:absolute;
  animation-name: slidebox;
  animation-duration: 17s;
  }
  @keyframes slidebox {
    0%  {margin-top: 0px;}
    81% {margin-top: 0px;}
    100%    {margin-top: 185px;}
    0% {opacity:80%}
    81% {opacity:80%}
    92% {opacity:20%}
    100% {opacity:100%}
  }


/* LOGIN FORM */
#login-form {
  float:right;
  display:inline; 
  text-align:right; 
  }
#password {
  border-radius:4px;
  padding-left:5px;
  color:#dddddd"
  }
#button {
  float:right;
  padding: 5px 10px;
  margin: 8px 0px 15px 0px;
  color:#ffffff;
  background-color:#4bc547;
  border-radius: 4px;
  }
#button:hover {
  background-color:#2da729;
  scale:.9;
  }


  div.donate {
    float:left; 
    width:100px;
  }