Initial

styles/globals.scss

@@ -0,0 +1,193 @@
+@import "../node_modules/bootstrap/scss/functions";
+@import "../node_modules/bootstrap/scss/variables";
+@import "../node_modules/bootstrap/scss/mixins";
+@import "./_variables.scss";
+@import url("https://use.typekit.net/pqm5uiz.css");
+
+.page {
+  overflow-x: hidden;
+}
+
+.svg-outline-white {
+  stroke: #fff;
+  stroke-miterlimit: 100;
+  fill: transparent;
+  stroke-width: 1.5;
+}
+
+.svg-outline-blue {
+  stroke: $hp-blue;
+  stroke-miterlimit: 100;
+  fill: transparent;
+  stroke-width: 1.5;
+}
+
+.cls-1,
+.cls-2 {
+  fill: none;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke: white;
+  stroke-width: 15px;
+}
+
+.cls-2 {
+  stroke-dasharray: 39.44 39.44;
+}
+
+.cls-3 {
+  fill: $white;
+}
+
+.landing-cls-1 {
+  fill: $white;
+}
+
+h1 {
+  margin-bottom: 2rem;
+  font-family: circe, sans-serif;
+  font-weight: 800;
+  font-style: normal;
+  text-align: center;
+}
+
+h2 {
+  font-family: circe, sans-serif;
+  font-weight: 700;
+  font-style: normal;
+}
+
+p {
+  font-family: circe, sans-serif;
+  font-weight: 400;
+  font-style: normal;
+  font-size: 1.3rem;
+  margin-bottom: 1rem;
+
+  a {
+    font-weight: bold;
+  }
+}
+
+p:last-child {
+  margin-bottom: 5rem;
+}
+
+a {
+  font-family: circe, sans-serif;
+  // font-weight: 400;
+  font-style: normal;
+  text-decoration: none;
+  color: #555;
+
+  transition: color 0.2s ease-in;
+}
+
+.product_section {
+  margin-bottom: 5rem;
+}
+
+section {
+  margin-top: 40%;
+  margin-bottom: 40%;
+}
+
+.sticky_history {
+  p {
+    color: rgba(0, 0, 0, 0.5);
+    font-weight: normal;
+  }
+}
+
+.bg-darkgrey {
+  background-color: $hp-dark_grey;
+}
+
+.products-img-shadow {
+  box-shadow: inset -20px 0px 50px 10px rgba(0, 0, 0, 0.6);
+}
+
+.products-img-shadow.order-1 {
+  box-shadow: inset -20px 0px 50px 10px rgba(0, 0, 0, 0.6);
+}
+
+.products-container {
+  img {
+    max-width: 100%;
+  }
+
+  .products-small {
+    max-width: calc(100% / 10);
+  }
+}
+
+.background-image {
+  background-repeat: no-repeat;
+  background-size: cover;
+  background-position: center;
+}
+
+.icon-size {
+  svg {
+    max-width: 50%;
+    width: 100%;
+    height: 100%;
+  }
+
+  div {
+    display: flex;
+    justify-content: center;
+  }
+}
+
+.min-height-100:first-of-type {
+  .products-img:first-of-type {
+    min-height: calc(200px);
+  }
+
+  @include media-breakpoint-up(lg) {
+    min-height: calc(100vh - (200px - 49px));
+    .products-img:first-of-type {
+      min-height: calc(100vh - 49px);
+    }
+  }
+}
+
+.description {
+  @include media-breakpoint-up(lg) {
+    padding: 50px;
+  }
+}
+
+.w-50 {
+  width: 50%;
+}
+
+.filter-grey {
+  filter: grayscale(100%);
+  transition: filter 500ms linear;
+
+  &:hover {
+    filter: grayscale(0%);
+  }
+}
+
+.h-100p {
+  height: 100%;
+}
+
+.pb-10p {
+  padding-bottom: calc(76.45px + 10%);
+}
+
+.productimg {
+  max-width: 60%;
+}
+
+.bg-white {
+  background-color: $white;
+}
+
+.minh-100vh {
+  min-height: 100vh;
+}