/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 */

@font-face {
  font-family: "The Suavity";
  src: url("/assets/the-suavity-904fad02.otf");
  font-display: swap;
}

@font-face {
  font-family: "Ubuntu";
  src: url("/assets/ubuntu-e45f6efb.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Playfair Display";
  src: url("/assets/playfair-display-f8c13f15.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("/assets/lato-3d716aad.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Alegreya";
  src: url("/assets/alegreya-6ba99536.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Alegreya SC";
  src: url("/assets/alegreya-sc-d84057aa.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Alegreya Sans SC";
  src: url("/assets/alegreya-sans-sc-f4c26d13.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Bestermind";
  src: url("/assets/bestermind-38b036e1.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Source Serif Pro";
  src: url("/assets/source-serif-pro-f9c7904a.otf");
  font-display: swap;
}

@font-face {
  font-family: "Croissant One";
  src: url("/assets/croissant-one-1f059083.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Raleway";
  src: url("/assets/raleway-d56e2ab2.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Kurale";
  src: url("/assets/kurale-cf0d6b19.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Sacramento";
  src: url("/assets/sacramento-da255cfb.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Great Vibes";
  src: url("/assets/great-vibes-a216b491.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Amatic SC";
  src: url("/assets/amatic-sc-1ffff9bc.ttf");
  font-display: swap;
}

@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("/assets/PlusJakartaSans-Regular-cdb23abf.ttf");
  font-display: swap;
  font-weight: 400;
}

@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("/assets/PlusJakartaSans-Bold-9d5a1e0d.ttf");
  font-display: swap;
  font-weight: 600;
}

@font-face {
  font-family: "Bricolage Grotesque";
  src: url("/assets/BricolageGrotesque-Regular-52313ac6.ttf");
  font-display: swap;
  font-weight: 400;
}

@font-face {
  font-family: "Bricolage Grotesque";
  src: url("/assets/BricolageGrotesque-Bold-3bb10315.ttf");
  font-display: swap;
  font-weight: 600;
}

.suavity {
  font-family: "The Suavity";
}

.playfair-display {
  font-family: "Playfair Display";
}

.alegreya {
  font-family: "Alegreya";
}

.alegreya-sc {
  font-family: "Alegreya SC";
}

.alegreya-sans-sc {
  font-family: "Alegreya Sans SC";
}

.bestermind {
  font-family: "Bestermind";
}

.raleway {
  font-family: "Raleway";
}

.kurale {
  font-family: "Kurale";
}

.sacramento {
  font-family: "Sacramento";
}

.great-vibes {
  font-family: "Great Vibes";
}

.amatic-sc {
  font-family: "Amatic SC";
}

.source-serif-pro {
  font-family: "Source Serif Pro";
}

.croissant-one {
  font-family: "Croissant One";
}

.bricolage-grotesque {
  font-family: "Bricolage Grotesque";
}

@keyframes slide-aside-right {
  0% { left: -250px; }
  100% { left: 0; }
}

@keyframes slide-aside-left {
  0% { left: 0; }
  100% { left: -250px; }
}

@media screen and (min-width: 768px) {
  @keyframes slide-aside-left {
    0% { left: 0px; }
    100% { left: -350px; }
  }
}

.aside--closed {
  left: -250px;
  animation: slide-aside-left .5s ease-in-out;

  @media screen and (min-width: 768px) {
    left: -350px;
  }
}

.aside--overlay-open {
  visibility: visible;
  width: 100vw;
}

.aside--open {
  left: 0;
  visibility: visible;
  animation: slide-aside-right .5s ease-in-out forwards;
}

body {
  font-family: 'Plus Jakarta Sans';
}

/* Hide scrollbar for Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Bricolage Grotesque';
}

.paragraph-reset p {
  margin: 1rem 0;

  &:last-child {
    margin-bottom: 0;
  }

  &:first-child {
    margin-top: 0;
  }
}
