* {
       scroll-behavior: smooth;
   }

   body {
       font-family: "Manrope", sans-serif;
   }

   @keyframes bounce {
       from {
           transform: translateY(0px);
       }

       to {
           transform: translateY(6px);
       }
   }

   .animation_bounce {
       animation: bounce ease 1s infinite;
   }

   .demo {
       /* cursor: pointer; */
       min-height: 320px;
       width: 100%;
       height: 100%;
   }

   .demo-flow {
       background-position-y: 0%;
       transition: 2s ease;
   }

   .demo-1 {
       background-image: url(./img/cloudinary-saas.png);
       background-repeat: no-repeat;
       background-size: cover;
   }

   .demo-2 {
       background-image: url(./img/Zentry-clone.png);
       background-repeat: no-repeat;
       background-size: cover;
   }

   .demo-3 {
       background-image: url(./img/medical-landing-page.webp);
       background-repeat: no-repeat;
       background-size: cover;
   }

   .demo-4 {
       background-image: url(./img/scoutemove.webp);
       background-repeat: no-repeat;
       background-size: cover;
   }

   .demo-5 {
       background-image: url(./img/enseedling.webp);
       background-repeat: no-repeat;
       background-size: cover;
   }
   .demo-6 {
       background-image: url(./img/Food-App.webp);
       background-repeat: no-repeat;
       background-size: cover;
   }

   .wrapper:hover .demo-flow {
       /* background-position-y: 100%; */
       box-shadow: 0 0 40px rgb(0 0 0 / 13%);
   }

   .visitLink:hover .demo-details{
       height: 100%;
   }

   @media (max-width: 768px) {
       .demo {
           min-height: 300px;
       }

       .demo-details {
           height: 100%;
       }
   }

   @media (max-width: 640px) {
       .demo {
           min-height: 200px;
       }
   }






   .icon-fill path {
       fill: #1f2937;
   }

   .dark .icon-fill path {
       fill: #f9fafb;
   }

    .social-fill path {
         fill: #f9fafb;
    }
        
    .dark .social-fill path {
        fill: #1f2937;
    }