added shop section, fixed footer, fixed headings, update navbar, fixe…

…d events structure

css/main.css

@@ -586,6 +586,14 @@ video {
   right: 1.5rem;
 }
 
+.bottom-0{
+  bottom: 0px;
+}
+
+.bottom-3{
+  bottom: 0.75rem;
+}
+
 .m-0{
   margin: 0px;
 }
@@ -599,16 +607,20 @@ video {
   margin-bottom: 4rem;
 }
 
-.mb-5{
-  margin-bottom: 1.25rem;
+.mb-40{
+  margin-bottom: 10rem;
 }
 
-.mb-20{
-  margin-bottom: 5rem;
+.mb-8{
+  margin-bottom: 2rem;
 }
 
-.mb-40{
-  margin-bottom: 10rem;
+.mt-3{
+  margin-top: 0.75rem;
+}
+
+.mt-12{
+  margin-top: 3rem;
 }
 
 .block{
@@ -631,6 +643,18 @@ video {
   height: 1.25rem;
 }
 
+.h-\[1000px\]{
+  height: 1000px;
+}
+
+.h-\[100vh\]{
+  height: 100vh;
+}
+
+.h-full{
+  height: 100%;
+}
+
 .w-10{
   width: 2.5rem;
 }
@@ -647,10 +671,42 @@ video {
   width: 1.25rem;
 }
 
+.w-\[80\%\]{
+  width: 80%;
+}
+
+.w-full{
+  width: 100%;
+}
+
+.w-\[90\%\]{
+  width: 90%;
+}
+
+.w-\[95\%\]{
+  width: 95%;
+}
+
+.w-\[96\%\]{
+  width: 96%;
+}
+
+.w-\[97\%\]{
+  width: 97%;
+}
+
 .flex-col{
   flex-direction: column;
 }
 
+.flex-wrap{
+  flex-wrap: wrap;
+}
+
+.items-start{
+  align-items: flex-start;
+}
+
 .items-end{
   align-items: flex-end;
 }
@@ -663,6 +719,10 @@ video {
   justify-content: flex-end;
 }
 
+.justify-center{
+  justify-content: center;
+}
+
 .justify-between{
   justify-content: space-between;
 }
@@ -675,6 +735,10 @@ video {
   gap: 0.5rem;
 }
 
+.gap-5{
+  gap: 1.25rem;
+}
+
 .gap-8{
   gap: 2rem;
 }
@@ -699,6 +763,10 @@ video {
   border-radius: 9999px;
 }
 
+.rounded-lg{
+  border-radius: 0.5rem;
+}
+
 .bg-accent{
   --tw-bg-opacity: 1;
   background-color: rgb(178 95 185 / var(--tw-bg-opacity));
@@ -709,10 +777,19 @@ video {
   background-color: rgb(9 10 21 / var(--tw-bg-opacity));
 }
 
+.bg-white{
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+}
+
 .p-0{
   padding: 0px;
 }
 
+.p-3{
+  padding: 0.75rem;
+}
+
 .p-5{
   padding: 1.25rem;
 }
@@ -788,9 +865,14 @@ video {
   line-height: 1.75rem;
 }
 
-.text-xs{
-  font-size: 0.75rem;
-  line-height: 1rem;
+.text-6xl{
+  font-size: 3.75rem;
+  line-height: 1;
+}
+
+.text-5xl{
+  font-size: 3rem;
+  line-height: 1;
 }
 
 .font-bold{
@@ -816,6 +898,17 @@ video {
   color: rgb(230 231 244 / var(--tw-text-opacity));
 }
 
+.shadow-lg{
+  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.shadow-accent{
+  --tw-shadow-color: #b25fb9;
+  --tw-shadow: var(--tw-shadow-colored);
+}
+
 .drop-shadow-md{
   --tw-drop-shadow: drop-shadow(0 4px 3px rgb(0 0 0 / 0.07)) drop-shadow(0 2px 2px rgb(0 0 0 / 0.06));
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
@@ -855,6 +948,12 @@ p {
   }
 }
 
+@media (min-width: 1024px){
+  .event-card{
+    min-height: 20rem;
+  }
+}
+
 .bg-hero-to-section {
   /* https://cssgradient.io/ */
   background: rgb(9, 10, 21);
@@ -1130,16 +1229,44 @@ p {
 }
 
 @media (min-width: 640px){
+  .sm\:mb-0{
+    margin-bottom: 0px;
+  }
+
+  .sm\:w-1\/2{
+    width: 50%;
+  }
+
+  .sm\:w-\[60\%\]{
+    width: 60%;
+  }
+
   .sm\:w-auto{
     width: auto;
   }
 
+  .sm\:w-\[70\%\]{
+    width: 70%;
+  }
+
+  .sm\:w-\[90\%\]{
+    width: 90%;
+  }
+
   .sm\:self-center{
     align-self: center;
   }
 }
 
 @media (min-width: 768px){
+  .md\:w-\[70\%\]{
+    width: 70%;
+  }
+
+  .md\:w-auto{
+    width: auto;
+  }
+
   .md\:text-text{
     --tw-text-opacity: 1;
     color: rgb(230 231 244 / var(--tw-text-opacity));
@@ -1155,6 +1282,14 @@ p {
     display: none;
   }
 
+  .lg\:w-\[70\%\]{
+    width: 70%;
+  }
+
+  .lg\:w-\[80\%\]{
+    width: 80%;
+  }
+
   .lg\:justify-evenly{
     justify-content: space-evenly;
   }