body {
    margin: 0;
    text-align: center;
    background-color: #FF92C2;
    font-family:Ubuntu, libre Baskerville;
    padding: 0;
}
header{
    background-color: #FF6B6B;;
    display: grid;
    grid-template-columns: 150px auto;
}
#logo_link{
    padding-top: 5px;
    justify-self: center;
    align-self: center;
}
.logo{
    width: 150px;
}
nav {
    display:flex;
    justify-content: space-around;
}

nav a{
    text-align: center;
    color: #2E282A ;
    text-decoration: none;
    padding: 35px;

}

nav a:hover{
    background-color: #F1F7ED ;
    color: #2E282A ;
}
.single-grid{
  display:grid;
  grid-template-columns: 10% 10% 10% 10% 10% 10% 10% 10% 10% 10%;
  grid-template-rows: 10% 10% 10% 10% 10% 10% 10% 10% 10% 10%;
}

.sword{
  width: 100%;
  height: auto;
  grid-column: 2/2;
  grid-row: 2/2;
}
.fire{
  width: 100%;
  height: auto;
  grid-column: 3/3;
  grid-row: 2/2;
}
.beam{
  width: 100%;
  height: auto;
  grid-column: 4/4 ;
  grid-row: 2/2;
}
.leaf{
  width: 100%;
  height: auto;
  grid-column: 5/5;
  grid-row: 2/2;
}
.bomb{
  width: 100%;
  height: auto;
  grid-column: 6/6 ;
  grid-row: 2/2;
}
.fighter{
  width: 100%;
  height: auto;
  grid-column: 7/7 ;
  grid-row: 2/2;
}
.ice{
  width: 100%;
  height: auto;
  grid-column: 8/8;
  grid-row: 2/2;
}
.artist{
  width: 100%;
  height: auto;
  grid-column: 9/9 ;
  grid-row: 2/2;
}
.jet{
  width: 100%;
  height: auto;
  grid-column: 2/2;
  grid-row: 6/6;
}
.esp{
  width: 100%;
  height: auto;
  grid-column: 3/3;
  grid-row: 6/6;
}
.hijump{
  width: 100%;
  height: auto;
  grid-column: 4/4 ;
  grid-row: 6/6;
}
.hammer{
  width: 100%;
  height: auto;
  grid-column: 5/5;
  grid-row: 6/6;
}
.spider{
  width: 100%;
  height: auto;
  grid-column: 6/6;
  grid-row: 6/6;
}
.suplex{
  width: 100%;
  height: auto;
  grid-column: 7/7;
  grid-row: 6/6;
}
.yoyo{
  width: 100%;
  height: auto;
  grid-column: 8/8;
  grid-row: 6/6;
}
.cutter{
  width: 100%;
  height: auto;
  grid-column: 9/9;
  grid-row: 6/6;
}
.cleaning{
  width: 100%;
  height: auto;
  grid-column: 2/2;
  grid-row: 10/10;
}
.water{
  width: 100%;
  height: auto;
  grid-column: 3/3;
  grid-row: 10/10;
}
.stone{
  width: 100%;
  height: auto;
    grid-column: 4/4;
  grid-row: 10/10;
}
.wing{
  width: 100%;
  height: auto;
    grid-column: 5/5;
  grid-row: 10/10;
}
.spark{
  width: 100%;
  height: auto;
    grid-column: 6/6;
  grid-row: 10/10;
}
.parasol{
  width: 100%;
  height: auto;
    grid-column: 7/7;
  grid-row: 10/10;
}
.ninja{
  width: 100%;
  height: auto;
  grid-column: 8/8;
  grid-row: 10/10;
}
.beetle{
  width: 100%;
  height: auto;
    grid-column: 9/9;
  grid-row: 10/10;
}


footer{
    background-color: #FF6B6B;
    color: #2E282A;
    padding: 25px 50px;
    margin-top: 250px;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

footer a{
    color: #2E282A;
    text-decoration: none;
}

footer p{
    font-size: 1.2em;
}

footer a:hover{
    color: #F1F7ED ;
    
}


footer .social img{
    padding-top: 15px;
}