@font-face {
    font-family: Chap;
    src: url(Chapaza.ttf);
}
@font-face {
    font-family: Aer;
    src: url(Aerolite.otf);
}
p{
    font-family: Chap;
    color:#8023FF;
    text-align:center;
}
/*/.shift{
    animation: mymove 25s infinite;
}
@keyframes mymove {
    0% { color:#0E02FF; }
    30% { color:RosyBrown; }
    50% { color:thistle; }
    70% { color:RosyBrown; }
    100%{ color:#0E02FF; }
}/*/
h1{
    font-family:Aer;
    font-size:50px;
    color:silver;
    text-align:center;
}
audio{
    text-align:center;
    width:100%;
}
body{
    background:WhiteSmoke;
}
html, body { 
    margin: 0; 
    padding: 0; 
}

* {
    box-sizing: border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
}

#all{
    width: 100%; 
    height: 100%; 
}
}
#lefty{
    width:15%;
    height:100%;
    float:left;
    text-align:justify;
    position:relative;
}
#middle{
    width:100%;
    height:100%;
    float:left;
    padding-left:30%;
    padding-right:30%;
    text-align:justify;
    position:relative;
    z-index: 1;
}
@keyframes img1 {
  0%   { left:750px; top:500px;}
  25%  { left:400px; top:430px;}
  50%  { left:400px; top:530px;}
  75%  { left:300px; top:410px;}
  100% { left:750px; top:500px;}
}
.img1{
    position: absolute;
    z-index: 2;
    width:400px;
  animation-name: img1;
  animation-duration: 80s;
  animation-iteration-count: infinite;
  animation-fill-mode: forwards;
}


@keyframes img2 {
  0%   { left:350px; top:300px;}
  25%  { left:400px; top:330px;}
  50%  { left:400px; top:130px;}
  75%  { left:300px; top:120px;}
  100% { left:350px; top:300px;}
}

.img2{
    position: absolute;
    z-index: 2;
    width:400px;
  animation-name: img2;
  animation-duration: 100s;
  animation-iteration-count: infinite;
  animation-fill-mode: forwards;
}


@keyframes img3 {
  0%   { left:500px; top:300px;}
  25%  { left:470px; top:340px;}
  50%  { left:530px; top:380px;}
  75%  { left:436px; top:340px;}
  100% { left:500px; top:300px;}
}

.img3{
    position: absolute;
    z-index: 2;
    width:400px;
  animation-name: img3;
  animation-duration: 90s;
  animation-iteration-count: infinite;
  animation-fill-mode: forwards;
}