html {
background-color:#a7b7c9
}

h1 {
color:#3d5570;
background-color:#b4c8e0;
height:200%;
text-align:center;
text-decoration:underline;
font-family: serif;
  position: relative;
  animation-name: example;
  animation-duration: 4s;
   animation-iteration-count: infinite;
}


img {margin-left: 700px;
}

p {margin: auto
width:500px; height: 400px }

a {
color:#3d5570;
background-color:#b4c8e0;
height:200%;
text-align:center;
text-decoration:underline;
font-family: serif;
margin-left:850px;
font-size:1.9em;
 position: relative;
  animation-name: example3;
  animation-duration: 4s;
   animation-iteration-count: infinite}

p {
color:#3d5570;
background-color:#b4c8e0;
height:200%;
text-align:center;
font-size:1.5em}

@keyframes example {
  0%   { left:10px; right:0px;}
  25%  { left:-10px; right:0px;}
  50%  {left:10px; right:0px;}
  75%  { left:-10px; right:-px;}
  100% {left:10px; right:0px;}
}
strong{
  position: relative;
  animation-name: example2;
  animation-duration: 2s;
   animation-iteration-count: infinite;
  
}
@keyframes example2 {
  0%   { left:2px; right:0px;}
  25%  { left:-2px; right:0px;}
  50%  {left:2px; right:0px;}
  75%  { left:-2px; right:-px;}
  100% {left:2px; right:0px;}
  
  h2 {
color:#3d5570;
background-color:#b4c8e0;
height:200%;
text-align:center;
text-decoration:underline;
font-family: serif;
  position: relative;
  animation-name: example;
  animation-duration: 4s;
   animation-iteration-count: infinite;
}

@keyframes example3 {
  0%   { left:0px; top:10px;}
  25%  { left:0px; top:-10px;}
  50%  {left:0px; top:10px;}
  75%  { left:0px; top:-10px;}
  100% {left:0px; top:10px;}
  
   { size: 0.1em }