div {
    margin: 50px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 50px;
}

body {
    margin: 20px;
gap: 20px;
    background: rgb(255, 255, 255);
}

img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 90%;
  filter: grayscale(100%);
	transition: .1s ease-in-out;
  border-style:dotted;
}

h2{ 

  justify-content: center;
    text-align: center;
    width: 100%;
        
font-family: "bitcountgridsingle";
color: rgb(0, 0, 0);
}

figure {
  margin: 0;
  aspect-ratio: 4/4;
  font-family: "bitcountgridsingle";

}

img:hover {
	filter: grayscale(0);
  transform: scale(1.1);
}

h1 {
   text-align: center;
  margin-top: 20px;
  animation: scrollText 07s linear infinite ;
white-space: nowrap;
font-size: 70px;
font-family: "bitcountgridsingle";

}
h1 span{
color: #ffffff;
  background-color: rgb(1, 1, 1);
  padding: 20px 0px
  border-radius 10px;
}

header{
  font-size: 100px;
  text-align: center;
}

@keyframes scrollText {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(-0%);
  }
}

.scroll-container {
  overflow: hidden; 
  white-space: nowrap; 
}