/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

h1 {
  font-family: "PDOS";
  }

  body {
    font-family:"PDOS";
  }
  
  #imgR {
  position: absolute; 
  top: 260px;
  left: 875px;
  }

 #dM {
  position: absolute;
  top: 260px;
  left:700px;
  
}

 #dL {
 height:190px;
 width:127px;
  position: absolute;
  top: 280px;
  left:525px;
}
 #god {
  height:175px;
  width:375px;
  position: absolute;
  top: 50px;
  left:582px;
  border-width:5px;
  border-style:solid;
  border-color:white;
  
}


#dL:hover {
 animation: shake 0.2s;
animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}





#imgR:hover {
 animation: shake 0.2s;
animation-iteration-count: infinite;
}



#stat2 { 
  
  position:absolute;
  top:600px;
  left:300px;
  
}

#stat {
  position:absolute;
  top:600px;
  left:950px;
  
  
  
}

#mainbuttons {
  position:absolute;
  top:300px;
}

#borde { 
  position: absolute;
  top: 200px;
  left:310px;
  
}



#banner {
  position:absolute;
  top:50px;
  left:285px;
}




#change {
  color:white;
}


#marquee {
position: absolute;
width: 925px;
max-width: 100%;
height: 200px;
overflow-x: hidden;
left:295px;
top:175px;
}
#track {
position: absolute;
white-space: nowrap;
will-change: transform;
animation: marquee 15s linear infinite;
}
@keyframes marquee {
from { transform: translateX(0); }
to { transform: translateX(-50%); }
}

#content {
  color:white;
  font:PDOS;
}



#angel {
  
  position:absolute;
  
  
}

#angel2 {
  
  position:absolute;
  left:1265px;
  
}

#unit {
  color:white;
 position:absolute;
 top:310px;
 left:700px;
}


#dM:hover {
 animation: shake 0.2s;
animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

#chat {
  position:absolute;
  top:350px;
  left:1000;
}