
<!DOCTYPE html>
<html lang="en">
  <head>

    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-P8Y77G0R4K"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());

      gtag('config', 'G-P8Y77G0R4K');
    </script>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="Saha Hammari, Designer">
    <meta name="author" content="Saha Hammari">
    <link rel="icon" href="assets/favicon.png">

    <title>Saha Hammari</title>

    <!-- Bootstrap core CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">

    <!-- Custom styles for this template -->
    <link href="css/custom-2024.css" rel="stylesheet">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,700;0,900;1,400&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wdth,wght@8..144,150,100..1000&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0" />

  </head>

  <body>

    <div class="container pt-4">

      <div class="row">
        <div class="col-12 col-md-6 col-lg-5 col-xl-4 col-xxl-3">
          <p><a href="/cdn-cgi/l/email-protection#483b2920292c2d3e29083b2920292c2d3e29662b2725"><span class="__cf_email__" data-cfemail="2e5d4f464f4a4b584f6e5d4f464f4a4b584f004d4143">[email&#160;protected]</span></a><br/><a href="https://www.linkedin.com/in/sahadeva/">LinkedIn</a></p>
        </div>
        <div class="col-12 col-md-6 col-lg-5 col-xl-4 col-xxl-3 offset-lg-2 offset-xl-4 offset-xxl-6">
          <p>Saha Hammari is a designer, writer, and entrepreneur in NYC. He is currently Director of Design Systems at <a href="https://www.rippling.com/">Rippling</a>. Previously, he led teams at legendary companies like Gusto and Casetext.</p>
        </div>
      </div>
    </div>
    <div class="fix-overflow position-relative d-block">
      <div class="position-absolute" style="background: radial-gradient(#6DFF5B, #B1F7A9, #f0f0f0, #f0f0f0); width: 800px; height: 800px; margin-left: auto;
        margin-right: auto; left: 0; right: 0; text-align: center; top: 300px;"></div>
      <div class="container">
        <h1 class="text-center roboto-flex-extra position-relative hero">Saha</h1>
        <div class="row pb-5 mb-5">
          <div class="col-lg-8 col-xl-6 offset-lg-2 offset-xl-3">
            <div class="rotate-10 py-5 mb-5 d-block">
              <div class="row">
                <div class="col-10 offset-1 col-lg-6 offset-lg-0 position-relative">
                  <img src="assets/what-it-means-to-be-a-designer-today.png" alt="book cover" class="img-border img-fluid">
                  <div class="d-block position-absolute dot text-white">New</div>
                </div>
                <div class="col-10 offset-1 col-lg-6 offset-lg-0 pt-4">
                  <h3>How Design Feels Today</h3>
                  <p>I contributed my viral essay on design culture to this seminal design anthology from Princeton Architectural Press. My essay explores the contemporary emotional landscape of design and how online culture has shaped what designers build and why.</p>
                  <p><a class="btn" href="https://bookshop.org/p/books/what-it-means-to-be-a-designer-today-reflections-questions-and-ideas-from-aiga-s-eye-on-design-jarrett-fuller/20383652?ean=9781797224558">Buy it at your local bookstore <span class="material-symbols-outlined ml-1">north_east</span></a></p>
                </div>
              </div>
            </div>
          </div>
        </div>  
      </div>
    </div>
     
    </div>

    <div class="position-relative d-block dark-bg fix-overflow" style="padding-bottom: 200px;">
      <div class="rotate-10 position-absolute" style="background-color: #000; height: 100%; top: -100px; width: 200%; padding-top: 100px; padding-bottom: 200px; margin-left: -50%;"></div>

        <div class="container">
          <div class="position-relative angle-bg">
            <div class="row pt-lg-5 mt-lg-5 position-relative">
              <div class="col-10 offset-lg-1 mt-lg-5">
                <h2 class="mb-0">Redesigning Gusto's</h2>
              </div>
            </div>
            <div class="row position-relative">
              <div class="col-10">
                <h2>Core Product</h2>
              </div>
            </div>
          </div>
        

          <div class="row pt-5 mt-5d-flex align-items-end pb-4 position-relative">
            <div class="col-12 col-xl-8 order-2 order-xl-1">
              <video width="100%" playsinline autoplay muted loop>
                <source src="assets/runpayroll_steps_video.mp4" type="video/mp4">
              Your browser does not support the video tag.
              </video>
            </div>
            <div class="col-12 col-lg-8 col-xl-3 offset-xl-1 order-2 order-xl-1 mt-5 mt-xl-0">
              <div class="row">
                <div class="col-9 col-md-10 col-lg-8 col-xl-12 order-2 order-xl-1">
                  <h2 class="mb-0 quote">&ldquo;</h2>
                  <h3>This is so awesome</h3>
                  <p>Joshua Reeves, Gusto CEO</p>
                </div>
                <div class="col-3 col-md-2 col-lg-4 col-xl-10 order-1 order-xl-2">
                  <img class="img-fluid super-rounded" src="assets/gusto-ceo.jpeg" alt="Gusto CEO photo">
                </div>
              </div>
            </div>
            
          </div>

          <div class="row position-relative">
            <div class="col-12 col-xl-7">
              <p>From 2021-23 I was a design leader at <a href="https://gusto.com/">Gusto</a>, a startup with over $500 million in annual recurring revenue. I led a team that redesigned Gusto Payroll, Gusto's core product and one of the world’s most used and loved payroll services. Along the way we built a new foundation for Gusto’s growth. </p>
              <p class="mb-0"><a href="https://www.youtube.com/watch?v=Ty_qHnye6zM&t=220s" class="btn">Watch the announcement video <span class="material-symbols-outlined ml-1">north_east</span></a></p>
              <p><a href="https://www.linkedin.com/posts/sahadeva_im-so-excited-that-the-work-that-i-led-reimagining-activity-7124829140939124736-Fszz?utm_source=share&utm_medium=member_desktop" class="btn">Read about how I built this <span class="material-symbols-outlined ml-1">north_east</span></a></p>
            </div>
          </div>
        </div>

    </div>
    
    <div class="fix-overflow d-block position-relative">
      <div class="container">
        <div class="d-block pt-5 mt-lg-5 position-relative">
          <div class="position-absolute" style="background: radial-gradient(#F154FF, #F154FF, #f0f0f0, #f0f0f0); width: 1000px; height: 1000px; margin-left: auto;
          margin-right: auto; left: 0; right: 0; text-align: center; top: 0px;"></div>
          <div class="d-flex w-100 justify-content-center">
            <div>
              <h2 class="rotate-10">AI</h2>
            </div>
            <div class="px-2 px-lg-4">
              <h2 class="rotate-10">Is</h2>
            </div>
            <div>
              <h2 class="rotate-10">Coming!</h2>
            </div>
          </div>
        </div>
        <div class="row pt-5 mt-lg-5 d-flex align-items-end pb-4 position-relative">
          <div class="col-12 col-lg-8 col-xl-3 order-2 order-xl-1 mt-5 mt-xl-0">
            <div class="row">
              <div class="col-9 col-md-10 col-lg-8 col-xl-12 order-2 order-xl-1">
                <h2 class="mb-0 quote">&ldquo;</h2>
                <h3>Casetext wouldn’t be where it is without Saha</h3>
                <p>Jake Heller, Casetext CEO</p>
              </div>
              <div class="col-3 col-md-2 col-lg-4 col-xl-10 order-1 order-xl-2">
                <img class="img-fluid super-rounded" src="assets/casetext-ceo.jpeg">
              </div>
            </div>
          </div>
          <div class="col-12 col-xl-8 offset-xl-1 order-1 order-xl-2">
            <img src="assets/new-design.png" alt="Casetext screenshot" class="img-border img-fluid">
          </div>
        </div>
        <div class="row position-relative pb-5 mb-lg-5">
          <div class="col-12 col-xl-7 offset-xl-4">
            <p>From 2017-2021 I was the Director of Design at <a href="https://casetext.com/">Casetext</a>. I helped Casetext grow from a tiny legal research startup to powerhouse by helping to create the industry’s first truly revolutionary A.I. product. In 2023 Casetext was purchased for $650,000,000. Six hundred and fifty million dollars! As the Director of Design, I built the incredible design team that shipped many innovative products that drove the business. </p>
            <p class="mb-0"><a href="https://casetext.com/blog/casetext-to-join-thomson-reuters-ushering-in-a-new-era-of-legal-technology-innovation/" class="btn">Read the sale press release <span class="material-symbols-outlined ml-1">north_east</span></a></p>
          </div>
        </div>

        <div class="d-block pt-lg-5 mt-lg-5">
          <div class="d-flex justify-content-center align-items-center flex-column flex-lg-row pt-5 mt-5">
            <div>
              <h2 class="rotate-50 mb-5 mb-md-0">Fun</h2>
            </div>
            <div class="ps-lg-5  mb-5 mb-md-0">
              <h2 class="">Side</h2>
            </div>
            <div>
              <h2 class="rotate-neg-40">Project</h2>
            </div>
          </div>
        </div>
        <div class="row pb-5">
          <div class="col-12">
            <p class="text-center pt-5">How might we make shopping fun again?</p>
            <p class="text-center">Click below, I’m interactive <span class="material-symbols-outlined">
              web_traffic
              </span></p>
          </div>
        </div>

      </div>
    </div>

    <header id="header-top" class="d-flex position-relative px-2 px-lg-5">
        <div class="logo-wrap">
          <img width="126" height="126" src="bodies/assets/logo_front2.jpg" alt="Logo" class="logo">
        </div>
        <div class="d-none d-md-flex flex-fill px-4">
          <h5 class="ml-4">Spring 2016 Lookbook</h5>
        </div>
        <div class="arrows d-flex flex-fill justify-content-end">
          <a href="#" class="arrow arrow-all-left non-default">
            <span></span>
          </a>
          <a href="#" class="pause pause-all non-default">
            <span></span>
            <span></span>
          </a>
          <a href="#" class="arrow arrow-all-right non-default">
            <span></span>
          </a>
        </div>
    </header>
    
    <div class="container-fluid">
      <div class="row" id="bodies">

        <!--  BODY ONE  -->

        <div class="col-sm-3" style="position: relative;">

          <!-- HEAD -->
          <div class="row part head">
            <div class="col-sm-12">
              <div id="faces3" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">

                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face22.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#faces3" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                  <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#faces3" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
                  <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- TOP -->
          <div class="row part part">
            <div class="col-sm-12">
              <div id="tops3" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top22.jpg">
                    </center>
                  </div>

                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#tops3" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                  <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#tops3" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
                  <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- BOTTOMS -->
          <div class="row part part-3">
            <div class="col-sm-12">
              <div id="bottoms3" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom22.jpg">
                    </center>
                  </div>

                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#bottoms3" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                  <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#bottoms3" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
                  <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- FEET -->
          <div class="row part feet">
            <div class="col-sm-12">
              <div id="shoes3" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet22.jpg">
                    </center>
                  </div>

                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#shoes3" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                  <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#shoes3" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
                  <span class="visually-hidden">Next</span>
                </button>
              </div>
            </div>
          </div>

          <!-- LINKS -->
          <div class="row part links">
            <div class="col-sm-12">
              
              <div id="links-face3" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">-</a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                </div>
              </div>

              <div id="links-top3" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="https://sahadeva.com/">Opening Ceremony Prep Dress <span class="price">$700</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Please Please Issey Miyake <span class="price">$300</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Nasir Mazhar pants<span class="price">$1,250</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Proenza Schouler Heels<span class="price">$459</span></a>
                  </div>
                </div>
              </div>

              <div id="links-bottoms3" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Nasir Mazhar pants<span class="price">$1,250</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Ellery V Dress<span class="price">$300</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Prep Dress <span class="price">$700</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Proenza Schouler Heels<span class="price">$459</span></a>
                  </div>
                </div>
              </div>

              <div id="links-feet3" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Nasir Mazhar Loafers<span class="price">$459</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Pumps<span class="price">$800</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Proenza Schouler Heels<span class="price">$459</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Ellery Tanks<span class="price">$240</span></a>
                  </div>
                </div>
              </div>
            </div>
          </div>

        </div>


        <div class="col-sm-3 d-none d-sm-block" style="position: relative;">

          <!-- HEAD -->
          <div class="row part head">
            <div class="col-sm-12">
              <div id="faces2" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">

                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face16.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face22.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face19.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#faces2" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#faces2" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- TOP -->
          <div class="row part part">
            <div class="col-sm-12">
              <div id="tops2" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">

                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top16.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top22.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top21.jpg">
                    </center>
                  </div>

                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#tops2" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#tops2" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- BOTTOMS -->
          <div class="row part part-3">
            <div class="col-sm-12">
              <div id="bottoms2" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom22.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom16.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom11.jpg">
                    </center>
                  </div>

                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom21.jpg">
                    </center>
                  </div>

                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom8.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
              
                <button class="carousel-control-prev" type="button" data-bs-target="#bottoms2" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#bottoms2" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- FEET -->
          <div class="row part feet">
            <div class="col-sm-12">
              <div id="shoes2" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">

                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet16.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet22.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#shoes2" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#shoes2" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- LINKS -->
          <div class="row part links">
            <div class="col-sm-12">
              
              <div id="links-face2" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">-</a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                </div>
              </div>

              <div id="links-top2" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Opening Ceremony Prep Dress <span class="price">$700</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Wildcard <span class="price">$300</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Nasir Mazhar pants<span class="price">$1,250</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Proenza Schouler Heels<span class="price">$459</span></a>
                  </div>
                </div>
              </div>

              <div id="links-bottoms2" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Nasir Mazhar pants<span class="price">$1,250</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Wildcard <span class="price">$300</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Prep Dress <span class="price">$700</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Proenza Schouler Heels<span class="price">$459</span></a>
                  </div>
                </div>
              </div>

              <div id="links-feet2" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Proenza Schouler Heels<span class="price">$459</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Galvan Heavy Satin Jumpstuit <span class="price">$300</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Nasir Mazhar pants<span class="price">$1,250</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Prep Dress <span class="price">$700</span></a>
                  </div>
                </div>
              </div>
            </div>
          </div>


        </div>

        <!--  BODY THREE  -->

        <div class="col-sm-3 d-none d-sm-block" style="position: relative;">

          <!-- HEAD -->
          <div class="row part head">
            <div class="col-sm-12">
              <div id="faces4" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-face2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-face3.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face14.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face22.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
            
                <button class="carousel-control-prev" type="button" data-bs-target="#faces4" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#faces4" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- TOP -->
          <div class="row part part">
            <div class="col-sm-12">
              <div id="tops4" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-top2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-top3.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top14.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top22.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#tops4" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#tops4" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- BOTTOMS -->
          <div class="row part part-3">
            <div class="col-sm-12">
              <div id="bottoms4" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-bottom2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-bottom3.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom14.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom22.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#bottoms4" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#bottoms4" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- FEET -->
          <div class="row part feet">
            <div class="col-sm-12">
              <div id="shoes4" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-feet2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-feet3.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet14.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet22.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#shoes4" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#shoes4" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>

              </div>
            </div>
          </div>

          <!-- LINKS -->
          <div class="row part links">
            <div class="col-sm-12">
              
              <div id="links-face4" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Bro Hat by Moschino <span class="price">$345</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                </div>
              </div>

              <div id="links-top4" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Opening Ceremony Prep Dress <span class="price">$700</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Wildcard <span class="price">$300</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Nasir Mazhar pants<span class="price">$1,250</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Prom<span class="price">$459</span></a>
                  </div>
                </div>
              </div>

              <div id="links-bottoms4" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Nasir Mazhar pants<span class="price">$1,250</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Wildcard <span class="price">$300</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Prep Dress <span class="price">$700</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Proenza Schouler Heels<span class="price">$459</span></a>
                  </div>
                </div>
              </div>

              <div id="links-feet4" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Opening Ceremony Loafers<span class="price">$700</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Ellery Slips<span class="price">$359</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Nasir Mazhar Pointerss<span class="price">$459</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Riding Boots<span class="price">$533</span></a>
                  </div>
                </div>
              </div>
            </div>
          </div>

        </div>

        <!--

          BODY FOUR

        -->
        <div class="col-sm-3 d-none d-sm-block" style="position: relative;">

          <!-- HEAD -->
          <div class="row part head">
            <div class="col-sm-12">
              <div id="faces1" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face2.jpg">
                    </center>
                  </div>

                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-face2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-face1.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-face3.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face15.jpg">
                    </center>
                  </div>

                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face22.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-face19.jpg">
                    </center>
                  </div>

                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#faces1" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#faces1" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>
              </div>
            </div>
          </div>

          <!-- TOP -->
          <div class="row part part">
            <div class="col-sm-12">
              <div id="tops1" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-top1.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top2.jpg">
                    </center>
                  </div>

                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top22.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-top2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-top15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-top3.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
              
                <button class="carousel-control-prev" type="button" data-bs-target="#tops1" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#tops1" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>
              </div>
            </div>
          </div>

          <!-- BOTTOMS -->
          <div class="row part part-3">
            <div class="col-sm-12">
              <div id="bottoms1" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-bottom2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-bottom3.jpg">
                    </center>
                  </div>

                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom22.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-bottom1.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-bottom20.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#bottoms1" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#bottoms1" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>
              </div>
            </div>
          </div>

          <!-- FEET -->
          <div class="row part feet">
            <div class="col-sm-12">
              <div id="shoes1" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet15.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet8.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet19.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-feet2.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-feet1.jpg">
                    </center>
                  </div>


                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet22.jpg">
                    </center>
                  </div>

                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet20.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet21.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet22.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/boy-feet3.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet11.jpg">
                    </center>
                  </div>
                  <div class="carousel-item">
                    <center>
                      <img class="d-block w-100" src="bodies/assets/girl-feet21.jpg">
                    </center>
                  </div>
                </div>

                <!-- Controls -->
                <button class="carousel-control-prev" type="button" data-bs-target="#shoes1" data-bs-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#shoes1" data-bs-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="visually-hidden">Next</span>
                </button>
              </div>
            </div>
          </div>

          <!-- LINKS -->
          <div class="row part links">
            <div class="col-sm-12">
              
              <div id="links-face1" class="carousel slide" data-bs-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">-</a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">- </a>
                  </div>
                </div>
              </div>

              <div id="links-top1" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Opening Ceremony Prep Dress <span class="price">$700</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Wildcard <span class="price">$300</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Nasir Mazhar pants<span class="price">$1,250</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Proenza Schouler Heels<span class="price">$459</span></a>
                  </div>
                </div>
              </div>

              <div id="links-bottoms1" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Nasir Mazhar pants<span class="price">$1,250</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Wildcard <span class="price">$300</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Prep Dress <span class="price">$700</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Proenza Schouler Heels<span class="price">$459</span></a>
                  </div>
                </div>
              </div>

              <div id="links-feet1" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner" role="listbox">
                  <div class="carousel-item active">
                    <a href="#">Proenza Schouler Heels<span class="price">$459</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Wildcard <span class="price">$300</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Nasir Mazhar pants<span class="price">$1,250</span></a>
                  </div>
                  <div class="carousel-item">
                    <a href="#">Opening Ceremony Prep Dress <span class="price">$700</span></a>
                  </div>
                </div>
              </div>
            </div>
          </div>

        </div>

      </div><!-- END ROW for bodies -->

    </div>
    <!-- FOOTER -->
    <div class="d-flex bg-dark">
      <div class="container py-5 mt-lg-5">
        <h2 class="mb-5 pb-lg-4">Fin.</h2>
        <div class="row">
          <div class="col-12 col-md-4 col-xl-3">
            <h3 class="mb-4">Work</h3>
            <p>Rippling — Director of Design Systems (Current)</p>
            <p>Gusto — Design Manager</p>
            <p>Casetext — Design Director</p>
            <p>Supercharger Studio (Cofounder)</p>
            <p>NYC Big Apps — Director</p>
            <p>CollabFinder (Cofounder)</p>
            <p>Rumplo (Cofounder)</p>
            <p>MySpace — Freelance designer</p>
            <p>Squidoo — Design intern</p>
          </div>
          <div class="col-12 col-md-4 col-xl-3 offset-xl-1">
            <h3 class="mb-4 mt-5 mt-md-0">Speaking & Writing</h3>
            <p><a href="https://bookshop.org/p/books/what-it-means-to-be-a-designer-today-reflections-questions-and-ideas-from-aiga-s-eye-on-design-jarrett-fuller/20383652?ean=9781797224558">How Design Feels Today</a> — Princeton Architectural Press</p>
            <p>Boston New Tech Meetup</p>
            <p>Joint speech with with NYC Mayor Michael Bloomberg on Innovation</p>
            <p>Moscow Internet Festival</p>
            <p>Design Innovation - Hosted by Foursquare</p>
            <p>NYC Tech Meetup</p>
            <p>BarCamp NYC</p>
            <p>My good friend’s wedding (but that doesn’t really count does it!)</p>
          </div>
          <div class="col-12 col-md-4 col-xl-3 offset-xl-1">
            <h3 class="mb-4 mt-5 mt-md-0">Interviews & Press</h3>
            <p>Bloomberg Businessweek</p>
            <p>New York Magazine</p>
            <p>The Guardian</p>
            <p>Fast Company</p>
            <p>CBS News</p>
            <p>Popular Science</p>
            <p>Gothamist</p>
            <p>C|Net</p>
            <p>LifeHacker</p>
          </div>
        </div>
        <div class="row py-5 mt-lg-5">
          <div class="col-12 col-md-4">
            <p>I love an email. Write to me!</p>
          </div>
          <div class="col-12 col-md-8">
            <p><a href="/cdn-cgi/l/email-protection#5c2f3d343d38392a3d1c2f3d343d38392a3d723f3331"><span class="__cf_email__" data-cfemail="ec9f8d848d88899a8dac9f8d848d88899a8dc28f8381">[email&#160;protected]</span></a><br/><a href="https://www.linkedin.com/in/sahadeva/">LinkedIn</a></p>
          </div>
        </div>
      </div>
    </div>
   <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
    <script language="JavaScript" type="text/javascript" src="bodies/js/jquery.min.js"></script>
    <script language="JavaScript" type="text/javascript" src="bodies/js/bootstrap.min.js"></script>
    <script language="JavaScript" type="text/javascript" src="bodies/js/app.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
  </body>
</html>
