.container {
    display: grid;

}
p, a, h1, div{
    color: rgb(214, 210, 210);
    text-align: center;
    font-family: Arial;

}
a{
    color: lightblue;
}

body{

  background-color: black;
}
.round-moving-thingy{
    width: 80%;
    max-width: 10%;
    padding: 2px;
    border: 2px solid #ccc;
    border-radius: 10px;
    text-align: center;
    margin: 10px;
    animation: move 13s linear infinite;

}

.container-move{
    display: flex;
    justify-content: space-around;
    padding: 10px;

}

.title-main{
font-size: 100px;
}
#carousel {
  width: 99vw;
  height: 100px;
  overflow: hidden;
  position: relative;
}

.item {
  width: 33.33%;
  height: auto;
  position: absolute;
  animation: slide 14s linear infinite;
  left: 150%; /* Set initial position outside of the viewport */
  text-rendering: optimizeSpeed;
  
}

#item1 { animation-delay: 0s; }
#item2 { animation-delay: 2.33s; }
#item3 { animation-delay: 4.66s; }
#item4 { animation-delay: 7s; }
#item5 { animation-delay: 9.33s; }
#item6 { animation-delay: 11.66s; }

@keyframes slide {
  0% { left: 150%; }
  100% { left: -100%; }
}

#carousel:hover .item {
  animation-play-state: paused;
}
.grid-container{
  display: grid;
  grid-template-columns: 100hw  ;
}