body {    
    background-color: #ffb3b3;
    color: black;
border: 1em double black;
  margin: 3em;  
  padding: 2em;
  border-radius: 8em;
  font-family: "Playwrite NZ Basic", cursive;
  font-size: 160%;
}



a {
      color: #545454;
}

img {
     border: 1em groove   ;
     margin: 1em;
     border-radius: 1em;
border: blackz z;
     
}


.float {
     float: right;
}



h1{
       font-family: "Lobster Two", sans-serif;
text-align: center;
}


.container {
  display: flex;
  align-items:flex start;
  justify-content:center;
  flex-wrap: wrap;
}


.box {
  /* PLAY WITH THE FLEX-BASIS TO SET THE SIZE OF THE BOXES */
  flex-basis: 25%;
  margin: 1.5em;
  border: 1em dotted black;
  border-radius: 10px;
  padding: 1em;
}


.box img {
  max-width: 90%;
  display: block;
  margin: auto;
}


/* SIDE TO SIDE */
/* Create the animation... */
@keyframes bounce {
   from {
      transform: translateY(0px);
   }
   to {
      transform: translateY(-20px);
   }
}

/* ...and then apply it: */
.bounce {
   animation-duration: 350ms;
   animation-name: bounce;
   animation-iteration-count:5em;
   animation-direction: alternate;
   animation-timing-function: cubic-bezier(0.2, 0.65, 0.6, 1);
}