mario-games-styling.css

  body{
      margin: 0;
      background-image: url("mario images/Mario games/background-stuff.jpg");
      background-size: cover;
      background-attachment:fixed;
      background-position: center center;

  }


  header{
    width: 100%;
    position: fixed;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    padding: 20px 40px;
    background: #E7000A;
    z-index: 2;
  }

  header div{
    z-index: 1;
  }  

  header .nintendo img{
    align-self: center;
    width: 100%;
    height: 80px;
  }

  header .basket-icon img{
    width: 100%;
    height: 80px;
  }
   

  .grid-wrapper{
      position: relative;
      top: 125px;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-template-rows: repeat(4, minmax(150px, 330px));
      grid-gap: 30px;
      max-width: 960px;
      margin: 0 auto;
      padding: 30px;
      border: hidden;
      box-shadow:  0px 0px 20px 0px white;
      background: #ffffffd8;
  }
  
  .products li{
    list-style-type: none;
    text-align: center;
  }
  .products li img.game{
    width: 150px;
    height: 210px;
  }

  h2{
    font-size: 18px;
    font-weight: bolder;
    margin: 5px;
  }

  h3{
    margin: 10px;
    font-size: 18px;
    font-weight: lighter;
    font-family: monospace;
  }

  h3 img.coin{
    width: 20px;
    height: 20px;
    vertical-align: top;
    animation: flip .5s infinite steps(8);
  }

  .products li button{
    border-radius: 15px;
    background-color: #ca3131;
    color: white;
    padding: 6px;
    cursor: pointer;
  }

  .products li button:hover{
    background-color: #d87979;
  }

 
@keyframes flip{
  from{transform:rotateY(0deg)}
  to{transform: rotateY(180deg)}
}

/* header animations */

.zoom{
  position: fixed;
  top: 18px;
  left: 40px;
  width: 67px;
  height: 87px;
  z-index: 3;
  animation: buy 1.7s ease forwards;
  
}

@keyframes buy{
  0%{opacity: 0; left: 20%; transform: rotateZ(0deg);}
  70%{opacity:1;}
  100%{opacity:0; left: 90%; transform: rotateZ(400deg);}
}