a {
  color: #fcfafa;
}
h1 {
    color: rgb(233, 245, 3);
    margin-right: 20rem;
    margin-left: 20rem;
     
    text-align: center; }
p {
    color:rgb(244, 244, 5);
    
    width: auto;

}  
.p {
  color: #fcfafa;
  background-color: rgba(7, 10, 5, 0.4);
  backdrop-filter: blur(3px);
  margin-left: 16rem;
  padding: 1rem;
}


ul {
    color:white;
}

body {
    background-image: url("fon5.jpeg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    width: auto;

}
article {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-gap: 10px;

  }
  
  .box1 {
    height: 50px;
    grid-row: 1 / 2;
    grid-column: 1 / 4;
    background-color: black;
  }
  
  nav {
    grid-row: 2 / 3;
    grid-column: 1 / 4;
    background-color: blue;
  }
  .box11 {
    grid-column: 1 / 4;
    grid-row: 5 / 6;
    background-color: rgba(4, 4, 4, 0.4);
    backdrop-filter: blur(5px);
  
  }  
  .down{
    color: rgb(255, 255, 255);
  }
  figure {
    border: thin #c0c0c0 solid;
    display: flex;
    flex-flow: column;
    padding: 5px;
    width: 200px;
    margin: auto;
  }
  
  img {
    max-width: 220px;
    max-height: 150px;
  }
  
  figcaption {
    background-color: #222;
    color: #fff;
    font: italic smaller sans-serif;
    padding: 3px;
    text-align: center;
  }