/*----------------------------------------------*\
    FOOTER
	======

	@package theorder

\*----------------------------------------------*/
/*----------------------------------------------*\
    COMPONENTS
	==========

	@package theorder

\*----------------------------------------------*/
/*
 *
 * / Variables
------------------------------------------------*/
/* Breakpoints */
/* Responsive type multipliers */
/* Type sizes (Minor third) */
/* Max-widths */
/* is used for calculation for extend width. Each side is extended by x ems */
/*
 *
 * 1./ Footer
------------------------------------------------*/
.footer-quotes {
  background-color: var(--color-secondary);
  padding: 2em 1em; }
  .footer-quotes__list {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    width: 100%; }
    @media screen and (min-width: 36rem) {
      .footer-quotes__list {
        -ms-flex-direction: row;
            flex-direction: row;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap; } }
  .footer-quotes__item {
    border-bottom: 1px solid var(--color-tertiary);
    padding: var(--size-600);
    line-height: 1.5;
    position: relative;
    display: grid;
    place-content: center; }
    .footer-quotes__item:before {
      content: '';
      width: 5px;
      height: 5px;
      background-color: var(--color-tertiary);
      position: absolute;
      bottom: -3px;
      right: -2.5px;
      -webkit-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
              transform: rotate(45deg); }
      @media screen and (min-width: 36rem) {
        .footer-quotes__item:before {
          bottom: -2px;
          right: -3px; } }
    .footer-quotes__item:after {
      content: '';
      width: 5px;
      height: 5px;
      background-color: var(--color-tertiary);
      position: absolute;
      bottom: -3px;
      left: -1px;
      -webkit-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
              transform: rotate(45deg); }
      @media screen and (min-width: 36rem) {
        .footer-quotes__item:after {
          top: 0px;
          right: -3px;
          left: auto; } }
    .footer-quotes__item:nth-child(2) {
      border-bottom: none;
      content: none; }
      .footer-quotes__item:nth-child(2):before {
        content: none; }
      .footer-quotes__item:nth-child(2):after {
        content: none; }
      @media screen and (min-width: 36rem) {
        .footer-quotes__item:nth-child(2) {
          border-right: none; } }
      @media screen and (min-width: 77rem) {
        .footer-quotes__item:nth-child(2) {
          border-right: 1px solid var(--color-tertiary); }
          .footer-quotes__item:nth-child(2):before {
            content: '';
            width: 5px;
            height: 5px;
            background-color: var(--color-tertiary);
            position: absolute;
            bottom: -2px;
            right: -3px;
            -webkit-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                    transform: rotate(45deg); }
          .footer-quotes__item:nth-child(2):after {
            content: '';
            width: 5px;
            height: 5px;
            background-color: var(--color-tertiary);
            position: absolute;
            bottom: -2px;
            right: -3px;
            -webkit-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                    transform: rotate(45deg); } }
    .footer-quotes__item:last-child {
      display: none;
      content: none; }
      .footer-quotes__item:last-child:before {
        content: none; }
      .footer-quotes__item:last-child:after {
        content: none; }
      @media screen and (min-width: 77rem) {
        .footer-quotes__item:last-child {
          display: grid;
          border-right: none; } }
    @media screen and (min-width: 36rem) {
      .footer-quotes__item {
        width: 50%;
        border-bottom: none;
        border-right: 1px solid var(--color-tertiary); } }
  .footer-quotes__quote {
    color: var(--color-footer-quote);
    font-family: var(--font-serif);
    font-size: var(--size-400);
    padding: var(--size-200) 0; }
  .footer-quotes__attribution {
    color: var(--color-footer-attribute);
    font-family: var(--font-sans);
    text-transform: uppercase;
    font-size: var(--size-200);
    text-align: right; }
    .footer-quotes__attribution:before {
      content: "\2014"; }

.footer-links {
  background-color: var(--color-primary);
  display: grid;
  grid-template-columns: none; }
  @media screen and (min-width: 36rem) {
    .footer-links {
      grid-template-columns: repeat(2, 1fr);
      grid-auto-rows: repeat(3, 1fr); } }
  @media screen and (min-width: 64rem) {
    .footer-links {
      grid-template-columns: repeat(1, 1fr);
      grid-template-rows: .5fr 1fr 1fr; } }
  @media screen and (min-width: 36rem) {
    .footer-links__primary-menu {
      grid-column-start: 1;
      grid-column-end: 3;
      grid-row-start: 1;
      grid-row-end: 2; } }
  @media screen and (min-width: 64rem) {
    .footer-links__primary-menu {
      grid-column-start: 1;
      grid-column-end: 2;
      grid-row-start: 1;
      grid-row-end: 4; } }
  @media screen and (min-width: 36rem) {
    .footer-links__secondary-menu {
      grid-column-start: 1;
      grid-column-end: 2;
      grid-row-start: 2;
      grid-row-end: 3; } }
  @media screen and (min-width: 64rem) {
    .footer-links__secondary-menu {
      grid-column-start: 2;
      grid-column-end: 3;
      grid-row-start: 1;
      grid-row-end: 2; } }
  .footer-links__icons {
    color: var(--color-footer-icons);
    padding: var(--size-800); }
    @media screen and (min-width: 36rem) {
      .footer-links__icons {
        grid-column-start: 1;
        grid-column-end: 2;
        grid-row-start: 3;
        grid-row-end: 4;
        padding-top: var(--size-200); } }
    @media screen and (min-width: 64rem) {
      .footer-links__icons {
        grid-column-start: 2;
        grid-column-end: 3;
        grid-row-start: 2;
        grid-row-end: 3;
        padding-top: 0;
        padding-bottom: 0; } }
    @media print {
      .footer-links__icons {
        display: none; } }
    .footer-links__icons ul {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: row;
          flex-direction: row; }
    .footer-links__icons li {
      margin-right: var(--size-500); }
      .footer-links__icons li:hover {
        color: var(--color-footer-icons-hover); }
    .footer-links__icons__copyright {
      font-size: var(--size-200);
      font-family: var(--font-sans);
      margin-top: var(--size-400); }
  .footer-links__image {
    background-color: var(--color-primary);
    padding: 0 var(--size-800) var(--size-800);
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-item-align: center;
        align-self: center; }
    @media screen and (min-width: 36rem) {
      .footer-links__image {
        grid-column-start: 2;
        grid-column-end: 3;
        grid-row-start: 2;
        grid-row-end: 4;
        -ms-flex-pack: end;
            justify-content: flex-end; } }
    @media screen and (min-width: 64rem) {
      .footer-links__image {
        grid-column-start: 2;
        grid-column-end: 3;
        grid-row-start: 3;
        grid-row-end: 4; } }
    .footer-links__image img {
      max-height: 10em;
      max-width: 100%;
      width: 9em; }
      @media screen and (min-width: 36rem) {
        .footer-links__image img {
          padding-top: var(--size-100); } }
      @media screen and (min-width: 64rem) {
        .footer-links__image img {
          padding-top: 0;
          max-height: 11em;
          width: 10em; } }

.menu-footer-menu-primary-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  padding: var(--size-800);
  border-bottom: 1px solid var(--color-tertiary);
  margin-bottom: 2em; }
  @media screen and (min-width: 64rem) {
    .menu-footer-menu-primary-container {
      border-bottom: none; } }
  @media print {
    .menu-footer-menu-primary-container {
      display: none; } }
  .menu-footer-menu-primary-container ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: .5fr .5fr 1fr;
    grid-gap: var(--size-300);
    color: var(--color-footer-links);
    font-family: var(--font-serif);
    line-height: 1.5;
    width: 100%; }
    @media screen and (min-width: 36rem) {
      .menu-footer-menu-primary-container ul {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: auto; } }
    @media screen and (min-width: 48rem) {
      .menu-footer-menu-primary-container ul {
        grid-template-columns: 1fr 1fr 1fr .75fr .5fr;
        grid-template-rows: auto; } }
    .menu-footer-menu-primary-container ul li:nth-child(3) {
      grid-row-start: 2;
      grid-row-end: 4; }
      @media screen and (min-width: 36rem) {
        .menu-footer-menu-primary-container ul li:nth-child(3) {
          grid-row-end: 3; } }
      @media screen and (min-width: 48rem) {
        .menu-footer-menu-primary-container ul li:nth-child(3) {
          grid-column-start: 3;
          grid-row-start: 1;
          grid-row-end: 2; } }
    .menu-footer-menu-primary-container ul li:nth-child(5) {
      grid-column-start: 2;
      grid-row-start: 3;
      grid-row-end: 4; }
      @media screen and (min-width: 36rem) {
        .menu-footer-menu-primary-container ul li:nth-child(5) {
          grid-row-start: 2;
          grid-row-end: 3; } }
      @media screen and (min-width: 48rem) {
        .menu-footer-menu-primary-container ul li:nth-child(5) {
          grid-column-start: 5;
          grid-row-start: 1;
          grid-row-end: 2; } }
  .menu-footer-menu-primary-container li {
    padding-bottom: var(--size-400); }
  .menu-footer-menu-primary-container .sub-menu {
    font-family: var(--font-sans);
    width: 100%;
    padding-top: var(--size-200);
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    grid-gap: 0; }
    .menu-footer-menu-primary-container .sub-menu li {
      padding-bottom: var(--size-200);
      line-height: 1.3; }
  .menu-footer-menu-primary-container > ul > li > a {
    /* main links */
    font-size: var(--size-400); }
  .menu-footer-menu-primary-container a {
    font-size: var(--size-300);
    text-decoration: none;
    padding-bottom: var(--size-400); }
    .menu-footer-menu-primary-container a:hover, .menu-footer-menu-primary-container a:focus {
      outline: 0;
      -webkit-text-decoration: underline 1px;
              text-decoration: underline 1px;
      text-underline-offset: .2em; }
    .menu-footer-menu-primary-container a:focus {
      -webkit-text-decoration-color: var(--color-footer-links-focus);
              text-decoration-color: var(--color-footer-links-focus); }

.menu-footer-menu-secondary-container {
  padding: var(--size-200) var(--size-800) 0;
  max-width: 100%; }
  @media screen and (min-width: 64rem) {
    .menu-footer-menu-secondary-container {
      padding: var(--size-800) var(--size-800) 0; } }
  @media print {
    .menu-footer-menu-secondary-container {
      display: none; } }
  .menu-footer-menu-secondary-container ul {
    color: var(--color-footer-links);
    font-family: var(--font-sans);
    text-transform: uppercase;
    display: grid;
    grid-template-areas: "a c"  "b d" ". e"; }
    .menu-footer-menu-secondary-container ul li:nth-child(1) {
      grid-area: a; }
    .menu-footer-menu-secondary-container ul li:nth-child(2) {
      grid-area: b; }
    .menu-footer-menu-secondary-container ul li:nth-child(3) {
      grid-area: c; }
    .menu-footer-menu-secondary-container ul li:nth-child(4) {
      grid-area: d; }
    .menu-footer-menu-secondary-container ul li:nth-child(5) {
      grid-area: e; }
  .menu-footer-menu-secondary-container li {
    padding-bottom: var(--size-300); }
  .menu-footer-menu-secondary-container a {
    font-size: var(--size-300);
    text-decoration: none; }
    .menu-footer-menu-secondary-container a:hover {
      -webkit-text-decoration: underline 1px;
              text-decoration: underline 1px;
      text-underline-offset: .2em; }