/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: white;
  color: black;
  font-family: Verdana;
}

    @font-face {
                font-family: Roboto Mono;
                src: url('https://fonts.googleapis.com/css2?family=Bitcount+Single:wght@100..900&display=swap');
            }

            @font-face {
                font-family: Nunito;
                src: url('https://sadhost.neocities.org/fonts/Nunito-Bold.ttf');
                font-weight: bold;
            }

            @font-face {
                font-family: Nunito;
                src: url('https://sadhost.neocities.org/fonts/Nunito-Italic.ttf');
                font-style: italic;
            }

            @font-face {
                font-family: Nunito;
                src: url('https://sadhost.neocities.org/fonts/Nunito-BoldItalic.ttf');
                font-style: italic;
                font-weight: bold;
            }
            
            
            
            
            
            
            
            
            
            MARQUEE!!
            
            

 <marquee loop= "infinite" behaviour= "scroll" direction= "right" onmouseover= "this.stop();" onmouseout= "this.start();">
  

 
 <div class="container">
  <!-- to 'widen' the marquee, add more items! -->
  <div>
<img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  
<img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
   <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
    <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
     <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
      <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
       <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
        <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock=">  <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
         <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
          <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
           <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
            <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
             <img src = "https://media.istockphoto.com/id/2228655982/vector/human-footprints-icon-vector-illustration.jpg?s=612x612&w=0&k=20&c=ircYFuHOhK6hdANfU2sPc-xdUL3Lom8d3kUTVkuAock="> 
  
  </div>
  
</marquee>




.container {
 overflow: visible;
  white-space: nowrap;
  display: inline-block;
  align: center;
  loop: infinite
  
 
}

.marquee span {
  display: inline-block;
  -webkit-animation: marquee 90s infinite linear;
  animation: marquee 90s infinite linear;
}


@keyframes marquee {
  from {
    transform: translateX(0);
  }
  to { 
    transform: translateX(100%);
  }
}
