body{
  background-color:black;
   animation:fadeIn ease 1.5s;
  animation-fill-mode:forwards;
  }
  
a{
color:orange; 
font-size:2em;
font-family:helvetica;
  }
#header{
    grid-row:1;
  width: calc(100% + 40px); 
  background-color: #6a1b07;
  background-image:url("https://i.pinimg.com/736x/6a/21/a3/6a21a34e737d598c3e84274a7c20213a.jpg");
  background-repeat:no-repeat;
  background-size:cover;
  height: 250px;
  margin: -20px -20px 0 -20px; 
  grid-column: 1/-1;
    }
    
    #header h2{
      color:white;
      font-family:arial;
      font-size:2em;
      text-align:center;
      }
      #headerimg{
        position:relative;
        left:21em;
        top:5em;
        max-width:300px;
        max-height:300px;
        filter:brightness(90%);
        }
        #headerimg img{
          width:17em;
          }
.container{
 display:grid;
  box-sizing:border-box;
 min-height:100vh;
  min-width:415px;
  padding:20px;
  gap:1em;
  margin:1px 22em;
grid-template-columns:3fr;
grid-template-rows:1fr 1fr 1fr;
background: rgba(69, 69, 69, 0.42);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(4.9px);
-webkit-backdrop-filter: blur(4.9px);
border: 1px solid rgba(69, 69, 69, 0.48);
  }
  .row{
    height:15em;
    overflow:hidden;
   display:flex;
   gap:1em;
  padding:5px;
    }
    .row img{
      max-width:calc((100%-2em)/3);
      flex:1 1 0;
      height:auto;
      }
       @keyframes fadeIn{
      0%{opacity:0;}
      100%{opacity:1;}
      
      }