.bottom_container{
   background-color: hsl(216, 53%, 9%);
   padding: 10rem 8.8% 10rem;
   color: white;
   font-size: 0.8rem;
   position: relative;
}

.bottom_container a:hover{
   font-weight: 800;
}

.bottom_grid{
   display: grid;
   grid-template-columns: 3.5fr 2fr 1fr 1fr 1fr;
   gap: 3rem;
}
.bottom_grid img{
   min-width: 1rem;
}

.attribution { 
   font-size: 11px;
   text-align: center; 
}

.attribution a { 
   color: hsl(228, 45%, 44%); 
}

.bottom_container tr > td:nth-of-type(1){
   min-width: 2.5rem;
}

.socials{
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
   gap: 1rem;
}
.social_box > img{
   border: 2px solid #fff;
   border-radius: 100%;
   padding: 0.25rem;
   max-width: 2rem;
}
footer{
   position: absolute;
   bottom: 1rem;
   left: 50%;
   transform: translate(-50%, -50%);
}
.bottom_container li{
   padding: 0.5rem;
}
.bottom_container td{
   padding: 0.5rem;
}

@media (max-width: 1024px){
   .bottom_grid{
      grid-template-columns: 4fr 2fr 1.3fr 1fr;
      gap: 3rem;
   }
   .bottom_grid > div:nth-last-of-type(1){
      grid-column:1 / 5;
      width: 40%;
      justify-self: center;
   }
}
@media (max-width: 895px){
   .bottom_grid{
      grid-template-columns: 3.5fr 2fr;
      grid-template-rows: 1fr 2fr 1fr;
      gap: 2rem;
   }
   .bottom_grid > div:nth-last-of-type(1){
      grid-column:auto;
      width: 40%;
      justify-self: auto;
   }
}
@media (max-width: 650px){
   .bottom_grid{
      grid-template-columns: 1fr 1fr;
      grid-template-rows: auto;
      gap: 1.5rem;
   }
   .bottom_grid > div:nth-of-type(1){
      grid-column: 1 / 3;
   }
   .bottom_grid > div:nth-of-type(2){
      grid-column: 1 / 3;
   }
   .bottom_grid > div:nth-of-type(5){
      grid-column:auto;
      width: 100%;
      justify-self: auto;
   }
}
@media (max-width: 475px){
   .bottom_grid{
      grid-template-columns: 1fr;
      grid-template-rows: auto;
      gap: 1.5rem;
   }
   .bottom_grid > div:nth-of-type(1){
      grid-column: 1;
   }
   .bottom_grid > div:nth-of-type(2){
      grid-column: 1;
   }
   .bottom_grid > div:nth-of-type(5){
      grid-column:auto;
      width: 100%;
      justify-self: auto;
   }

}