1 files changed, 144 insertions, 0 deletions
diff --git a/styles/index.scss b/styles/index.scss
new file mode 100644
index 0000000..ee298cc
--- /dev/null
+++ b/styles/index.scss
@@ -0,0 +1,144 @@
+@charset "utf-8";
+
+// Google Fonts
+@import url("https://fonts.googleapis.com/css?family=Architects+Daughter|Indie+Flower|PT+Sans&display=swap");
+
+// Palette
+$darkteal: rgb(0, 100, 108);
+$green: rgb(88, 169, 143);
+$darkerteal: rgb(29, 133, 137);
+$gray: rgb(157, 210, 211);
+$teal: rgb(58, 165, 166);
+$cyan: rgb(156, 210, 210);
+$darkgray: rgb(127, 177, 181);
+$darkgreen: rgb(59, 136, 114);
+$yellow: rgb(186, 214, 187);
+
+// Update Bulma's global variables
+$primary: $teal;
+$link: $darkteal;
+// $info: $cyan
+$success: $green;
+// $warning: $yellow
+// $danger: $red
+// $dark: $grey-darker
+// $text: $grey-dark
+$family-sans-serif: "PT Sans", sans-serif;
+// $hr-background-color: $primary;
+$title-color: $darkteal;
+$title-family: "Architects Daughter", cursive;
+$subtitle-color: $darkteal;
+$subtitle-family: "Indie Flower", cursive;
+//$body-font-size: 1.8rem;
+// $body-background-color: $isabelline;
+
+// Import only what you need from Bulma
+@import "../_bulma/node_modules/bulma/sass/utilities/_all.sass";
+@import "../_bulma/node_modules/bulma/sass/base/_all.sass";
+@import "../_bulma/node_modules/bulma/sass/elements/_all.sass";
+@import "../_bulma/node_modules/bulma/sass/form/_all.sass";
+@import "../_bulma/node_modules/bulma/sass/components/_all.sass";
+@import "../_bulma/node_modules/bulma/sass/layout/_all.sass";
+@import "../_bulma/node_modules/bulma/sass/grid/_all.sass";
+
+.offering {
+  color: white;
+}
+.offering .content u {
+  cursor: pointer;
+}
+.column .offering {
+  border: 1em solid $darkgray;
+}
+.darkteal {
+  background-color: $darkteal;
+}
+.green {
+  background-color: $green;
+}
+.darkerteal {
+  background-color: $darkerteal;
+}
+.darkgray {
+  background-color: $darkgray;
+}
+.darkgreen {
+  background-color: $darkgreen;
+}
+
+.blurb {
+  background-color: white;
+  clip-path: polygon(
+    0% 0%,
+    100% 0%,
+    100% 75%,
+    75% 75%,
+    75% 100%,
+    50% 75%,
+    0% 75%
+  );
+}
+
+.banner {
+  right: 100%;
+  padding-top: 5%;
+  padding-bottom: 5%;
+  padding-right: 5%;
+
+  // gradient
+  background: -moz-linear-gradient(
+    left,
+    rgba(255, 255, 255, 0) 0%,
+    rgba(255, 255, 255, 1) 50%
+  );
+  background: -webkit-linear-gradient(
+    left,
+    rgba(255, 255, 255, 0) 0%,
+    rgba(255, 255, 255, 1) 50%
+  );
+  background: linear-gradient(
+    to right,
+    rgba(255, 255, 255, 0) 0%,
+    rgba(255, 255, 255, 1) 50%
+  );
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 );
+}
+
+.has-banner {
+  //margin-top: 0px !important;
+  //margin-bottom: 0px !important;
+  padding-top: 0px !important;
+  padding-bottom: 0px !important;
+  padding-right: 0px !important;
+  padding-left: 10% !important;
+}
+
+.quiet {
+  background-color: white;
+}
+
+.fawnseh {
+  font-family: "Architects Daughter", cursive;
+}
+
+.has-text-shadow {
+  text-shadow: 0px 0px 4px #ffffff;
+}
+
+@keyframes fadeIn {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+.fadeIn {
+  animation-name: fadeIn;
+  animation-duration: 0.3s;
+}
+
+body {
+  background-image: url("/assets/bg.png");
+}