body{
    background-color: #00FFFF;
    /*background-image: url("https://images.pexels.com/photos/775201/pexels-photo-775201.jpeg?_gl=1*1ht2hhu*_ga*NzU4MzkyNTg1LjE3NjkxMDkxNTA.*_ga_8JE65Q40S6*czE3NzIwNDk2NjkkbzUkZzEkdDE3NzIwNTAwODIkajYwJGwwJGgw");*/
    background-repeat: no-repeat;
    background-size: cover;
    color: #000000;
   font-family: "Cherry Bomb One", system-ui;
    font-size: 2.0em;  
    border: 1.2em double #0d068f;
    padding: 1em;
    
    cursor: default;
}

/*a {*/
/*    #6D07B6*/
/*}    */



h1 {
    
     background-image: linear-gradient(to top, blue, violet);
     text-shadow: 3px 3px 3px white;
     font-family: "Delicious Handrawn", cursive;
 font-size: 2.5em;
 text-align:center; 
}

img {
    border: 1em ridge #ec35f2;
}

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

.box {
  /* PLAY WITH THE FLEX-BASIS TO SET THE SIZE OF THE BOXES - DON'T GO OVER 45% */
  flex-basis: 35%;
  margin: .5em;
 
  border-radius: 10px;
  padding: 1em;
  
}

/* SETTING THE IMAGE WIDTH HERE INSTEAD OF IN HTML. REMOVE WIDTH="XXX%" FROM THE HTML IMAGE TAGS */
.box img {
  max-width: 90%;
  display: block;
  margin: auto;
}



.tiny {
    font-size: .5em;
}