@import url(../modules/ui/styles.css);
:root {
  --secondary-bg-color: var(--color-white);
  --secondary-color: var(--color-dark-gray);
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html,
body {
  font: var(--font-size-base) / var(--line-height-base) var(--font-family-base);
  font-weight: var(--font-weight-base);
  background-color: var(--primary-bg-color);
  color: var(--font-color-base);
  position: relative;
}
textarea {
  border: 1px solid var(--primary-bg-color);
  padding: var(--spacing-lg);
  border-radius: var(--radius-sm);
  margin-bottom: calc(var(--spacing-md) * 1.2);
  width: 100%;
  max-width: max-content;
  min-width: 100%;
  outline: none;
  min-height: 120px;
  font-family: var(--font-family-base);
  transition: var(--transi-cubezier);
  &:hover,
  &:focus {
    border-color: var(--primary-color);
  }
}
nav,
ul,
ol,
li {
  list-style-type: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: var(--weight-normal);
}
blockquote{
  background-color: var(--primary-bg-color);
}
/* More Containers */
.mb-20 {
  margin-bottom: calc(var(--spacing-md) * 2);
}
.grid-gap-normal {
  display: grid;
  gap: calc(var(--spacing-md) * 2);
}
.grid-gap-min {
  display: grid;
  gap: var(--spacing-md);
}
/* Justify Containers */
.j-space-b {
  justify-content: space-between;
}
.j-space-center {
  justify-content: center;
}
.j-space-unset {
  justify-content: unset !important;
}
/* Display Containers */
.d-flex {
  display: flex;
}
.d-inline-flex {
  display: inline-flex !important;
}
.d-grid {
  display: grid;
}