added loan popout

src/index.css

@@ -17,4 +17,33 @@ body {
     /* @apply container mx-auto px-5 xxs:max-w-full sm:max-w-[98%] lg:max-w-[1100px]; */
     @apply container mx-auto px-5 max-w-[1500px]
   }
+
+  .custom-btn{@apply min-w-[100px] transition-all duration-300 p-2 rounded-full}
+
+
+  /* MODAL COMPONENT */
+  .modal-container{
+    animation-name: zoom;
+    animation-duration: .2s;
+    animation-timing-function: linear;
+    @apply w-4/5 max-w-[600px] bg-white shadow-md rounded-2xl overflow-hidden
+  }
+  .modal-header { 
+    @apply w-full flex items-center justify-between p-5 py-8 border-b bg-sky-500
+  }
+  .modal-title { 
+    @apply text-2xl leading-8 font-bold text-white dark:text-white tracking-wide flex items-center
+  }
+  .modal-close-btn { 
+    @apply text-white dark:text-red-500
+  }
+  .modal-body { 
+    @apply w-full p-5 min-h-[150px] max-h-[500px] overflow-y-auto break-words flex flex-col justify-center items-center
+  }
+  .modal-footer { 
+    @apply w-full p-5 border-t flex justify-between items-center gap-4
+  }
+  /* MODAL COMPONENT */
+
+
 }