body {
 font-family: Arial, sans-serif;
  background: #4980ad !important;
  text-align: center;
  padding: 20px;
}

#smiley{
position: absolute!important;
top: 50px;
right: 20%;
}

h1  { font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
      font-size: 300% !important;
      text-decoration: underline;
      color: white;
      margin: 50px 0px 50px 0px;
      padding: 0;
}      
   
     
h2  {font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    
   text-align: center;
    font-size: 180%;
    color: white;
      margin: 20px 20px 50px 20px;
      padding:0px;
   span {
        transform: scale(0.9);
        display: inline-block;
      }
      span:first-child {
        animation: bop 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards infinite
          alternate;
      }
      span:last-child {
        animation: bopB 1s 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards
          infinite alternate;
      }
    }
    
    @keyframes bop {
      0% {
        transform: scale(0.9);
      }
      50%,
      100% {
        transform: scale(1);
      }
    }
    
    @keyframes bopB {
      0% {
        transform: scale(0.9);
      }
      80%,
      100% {
        transform: scale(1) rotateZ(-3deg);
      }
    }


 

   
h3 { font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    
    font-size: 150%;
    color: white;
    margin-bottom: 20px;
    padding: 0;
      
   }




.gallery {
background-color:black; 
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
      justify-content: center;
      padding: 20px;
      width:50%;
      margin: 0 auto;
      border-radius:8px;

}

.gallery a img {
      width: 250px;
      border-radius: 8px;
      border:3px solid white;
      cursor: pointer;
      transition: transform 0.3s ease;
}

.gallery a img:hover {
      transform: scale(1.05);
      filter: brightness(130%);
}


                                      @media screen and (max-width: 768px) {


.gallery {
width:80%;
margin: 0 auto;
border-radius:8px;

}



.gallery a img {
 width: 90%;

}
}