stuff done

app/globals.css

@@ -4,10 +4,8 @@
 @tailwind components;
 @tailwind utilities;
 
-body {
-  margin: 0;
-  padding: 0;
-  overflow-y: scroll;
+html, body {
+  @apply h-full m-0 p-0;
 }
 
 @layer base {
@@ -115,11 +113,11 @@ body {
   }
 
   .bw-layout-col-left {
-    @apply flex-1 sm:w-7/12 md:w-5/12 xl:w-4/12 lg:flex-col
+    @apply flex-1 sm:w-7/12 md:w-5/12 xl:w-5/12 lg:flex-col
   }
 
   .bw-layout-col-right {
-    @apply sm:w-5/12 md:w-7/12 xl:w-8/12 flex-1 sm:flex-auto sm:pl-4 md:pl-7 xl:pl-9
+    @apply sm:w-5/12 md:w-7/12 xl:w-7/12 flex-1 sm:flex-auto sm:pl-4 md:pl-7 xl:pl-9
   }
 
   .bw-product-col-left{
@@ -134,7 +132,7 @@ body {
   }
 
   .bw-header-col-right {
-    @apply flex-grow-0 flex-shrink-0 md:basis-[272px]
+    @apply flex-grow-0 flex-shrink-0 md:basis-[142px]
   }
 
   .bw-border-color {
@@ -146,6 +144,76 @@ body {
   }
 }
 
+.bw-terms-section {
+
+  .bw-accordion-item {
+
+    @apply w-[100%] flex-none overflow-hidden border-b-0 md:w-[46.75%] lg:w-[29.25%]; /*shadow-md*/
+
+    /*&:hover {
+      @apply bg-brand-violet-800/25;
+    }*/
+
+    &[data-state="open"]{
+      @apply border-brand-violet-800/25 border-[2px]   rounded-lg; /*shadow-md shadow-brand-violet-900/30*/
+
+      .bw-accordion-content {
+        @apply  rounded-br-lg rounded-bl-lg bg-brand-violet-50/15; /*border-r-[2px] border-b-[2px] border-l-[2px]*/
+      }/*bg-brand-violet-50/50*/
+    }
+
+
+    button {
+      &[data-state="closed"] {
+        @apply border-[2px]  rounded-lg; /*shadow-lg border-brand-violet-900/10*/
+      }
+
+      &[data-state="open"] {
+        @apply border-[2px] rounded-none py-2;
+      }
+    }
+  }
+  .bw-accordion-trigger {
+    @apply text-center text-base text-brand-violet antialiased font-semibold font-heading;
+  }
+
+
+  button {
+    padding: 10px 16px;
+    text-align: center;
+    font-size: 1rem;
+
+    &:hover, &[data-state="open"] {
+      @apply bg-brand-violet-800/25 text-white border-brand-violet-800/5;  /*border-t-2*/
+    }
+  }
+  svg {
+    @apply w-6 h-6;
+  }
+
+  h3[data-state="open"], h3:hover {
+    & > button > svg {
+      @apply stroke-white;
+    }
+  }
+
+  .bw-accordion-content {
+    @apply px-4 text-[15px] leading-relaxed tracking-wide text-brand-violet-900;
+
+    p {
+      @apply block my-[1em] mx-0;
+    }
+
+    a {
+      @apply font-semibold text-brand-violet-600 hover:underline;
+    }
+
+    ul {
+      @apply block list-disc my-[1em] m-0 pl-10;
+    }
+  }
+}
+
 .bw-dd-menu {
   /* since nested groupes are not supported we have to use
      regular css for the nested dropdowns
@@ -165,6 +233,40 @@ body {
   .group:hover .group-hover\:-rotate-180 { transform: rotate(180deg) }
 }
 
+.bw-page {
+  @apply leading-relaxed tracking-tight mt-10;
+
+  h1 {
+    @apply font-heading my-[0.67em] mx-0 text-3xl font-bold;
+  }
+
+  h2 {
+    @apply font-heading mt-[0.83em] mb-[0.25em] mx-0 text-xl font-semibold;
+  }
+
+  p {
+    @apply block mb-[1em] mx-0;
+  }
+
+  /*a {
+    @apply font-semibold text-brand-violet-600 hover:underline;
+  }*/
+
+  ul {
+    @apply block list-disc my-[1em] m-0 pl-10;
+  }
+
+  article {
+    @apply leading-relaxed;
+  }
+  /*display: block;
+  font-size: 2em;
+  margin-top: 0.67em;
+  margin-bottom: 0.67em;
+  margin-left: 0;
+  margin-right: 0;
+  font-weight: bold;*/
+}
 
 .jodit-wysiwyg > * {
   all: revert;
@@ -180,6 +282,7 @@ body {
   }*/
 }
 
+
 #admin-bw-panel form {
   input {
     @apply bg-white outline-0 text-[16px] leading-none;
@@ -265,3 +368,12 @@ body {
     flex: 1;
   }
 }
+
+
+
+/*
+https://www.w3schools.com/cssref/css_default_values.php*/
+
+.bw-yt-video {
+  @apply aspect-video w-full self-stretch md:min-h-96;
+}