import { FadeIn } from "../components/FadeIn";
import { Breathe } from "../components/Breathe";

export function Home() {
  return (
    <div className="row mt-4">
      <div className="col">
        <div  className="col">
          {/* Spacing Block */}
          <div className='col' style={{ 'height': '70vh' }}></div>

          <Breathe></Breathe>
          
          <FadeIn filepath="https://static.igem.wiki/teams/5247/landing/problems/problems-1.webp" bg=''></FadeIn>
          <FadeIn filepath="https://static.igem.wiki/teams/5247/landing/problems/problems-2.webp" bg=''></FadeIn>
          <FadeIn filepath="https://static.igem.wiki/teams/5247/landing/problems/problems-3.webp" bg=''></FadeIn>
          <FadeIn filepath="https://static.igem.wiki/teams/5247/landing/problems/problems-4.webp" bg=''></FadeIn>
          <FadeIn filepath="https://static.igem.wiki/teams/5247/landing/problems/problems-5.webp" bg=''></FadeIn>
          <FadeIn filepath="https://static.igem.wiki/teams/5247/landing/problems/problems-6.webp" bg=''></FadeIn>
          
          <div className='col'>
            <img src="https://static.igem.wiki/teams/5247/landing/gifs/200k-anim-transparent-bg.gif"></img>
          </div>
          <div className='col'>
            <img src="https://static.igem.wiki/teams/5247/landing/gifs/oneintwenty.gif"></img>
          </div>
          <div className='col'>
            <img src="https://static.igem.wiki/teams/5247/landing/gifs/2k-anim-transparent-bg.gif"></img>
          </div>
          <div className='col'>
            <img src="https://static.igem.wiki/teams/5247/landing/gifs/3k-anim-transparent-bg.gif"></img>
          </div>
          <div className='col'>
            <img src="https://static.igem.wiki/teams/5247/landing/treatmentnoloop.gif"></img>
          </div>
          <div className='col'>
            <img src="https://static.igem.wiki/teams/5247/landing/precyse.gif"></img>
          </div>
          <div className='col'>
            <img src="https://static.igem.wiki/teams/5247/landing/gifs/3d-animation.gif"></img>
          </div>
          <div className='col'>
            <img src="https://static.igem.wiki/teams/5247/landing/gifs/proofofconcept.gif"></img>
          </div>
        </div>
      </div> 
    </div> 
  );
}