/*----------------------------------------------*\
    GLOBAL
	======

	@package mfa.design.calarts

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

	@package mfa.design.calarts

\*----------------------------------------------*/
/* 
 *
 * / Variables
------------------------------------------------*/
/* Colors */
/* Breakpoints */
/* Fonts */
/* 
 *
 * ANCHOR Variables  
------------------------------------------------*/
:root {
  --black: #000;
  --white: #fff;
  --gray: #c9c9c9;
  --green: #00971E;
  --pink: #FF95C3;
  --pink-text: #E363A1;
  --max-width: 76rem;
}

/*
 *
 * ANCHOR Responsive Text Sizes 
------------------------------------------------*/
:root {
  /* Major Third (factor: 1.25)*/
  --size-030: .210rem;
  --size-040: .263rem;
  --size-050: .328rem;
  --size-060: .41rem;
  --size-070: .512rem;
  --size-080: .64rem;
  --size-085: .72rem;
  --size-090: .8rem;
  --size-100: 1rem; /* <-- Default */
  --size-200: 1.25rem;
  --size-300: 1.563rem;
  --size-400: 1.953rem;
  --size-500: 2.441rem;
  --size-600: 3.052rem;
  --size-700: 3.815rem;
  --size-800: 4.769rem;
  --size-900: 5.961rem;
}
@media screen and (min-width: 27rem) {
  :root {
    font-size: 1.05rem;
  }
}
@media screen and (min-width: 36rem) {
  :root {
    font-size: 1.1rem;
  }
}
@media screen and (min-width: 48rem) {
  :root {
    font-size: 1.15rem;
  }
}
@media screen and (min-width: 64rem) {
  :root {
    font-size: 1.2rem;
  }
}
@media screen and (min-width: 77rem) {
  :root {
    font-size: 1.25rem;
  }
}
@media screen and (min-width: 94rem) {
  :root {
    font-size: 1.3rem;
  }
}

/* 
 *
 * ANCHOR Fonts  
------------------------------------------------*/
@font-face {
  font-family: "Marfa";
  font-style: normal;
  font-weight: 400;
  src: url("/fonts/ABCMarfa-Regular.woff") format("woff"), url("/fonts/ABCMarfa-Regular.woff2") format("woff2");
}
@font-face {
  font-family: "Marfa";
  font-style: italic;
  font-weight: 300;
  src: url("/fonts/ABCMarfa-LightItalic.woff") format("woff"), url("/fonts/ABCMarfa-LightItalic.woff2") format("woff2");
}
@font-face {
  font-family: "Marfa";
  font-style: normal;
  font-weight: 500;
  src: url("/fonts/ABCMarfa-Medium.woff") format("woff"), url("/fonts/ABCMarfa-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "Marfa";
  font-style: normal;
  font-weight: 600;
  src: url("/fonts/ABCMarfa-Semibold.woff") format("woff"), url("/fonts/ABCMarfa-Semibold.woff2") format("woff2");
}
@font-face {
  font-family: "Marfa";
  font-style: normal;
  font-weight: 700;
  src: url("/fonts/ABCMarfa-Bold.woff") format("woff"), url("/fonts/ABCMarfa-Bold.woff2") format("woff2");
}
@font-face {
  font-family: "Marfa";
  font-style: italic;
  font-weight: 700;
  src: url("/fonts/ABCMarfa-BoldItalic.woff") format("woff"), url("/fonts/ABCMarfa-BoldItalic.woff2") format("woff2");
}
@font-face {
  font-family: "MarfaMono";
  font-style: normal;
  font-weight: 300;
  src: url("/fonts/ABCMarfaMono-Light.woff") format("woff"), url("/fonts/ABCMarfaMono-Light.woff2") format("woff2");
}
@font-face {
  font-family: "MarfaMono";
  font-style: normal;
  font-weight: 500;
  src: url("/fonts/ABCMarfaMono-Semibold.woff") format("woff"), url("/fonts/ABCMarfaMono-Semibold.woff2") format("woff2");
}
/* 
 *
 * ANCHOR Grids
------------------------------------------------*/
.grid-container__full {
  grid-column: 1/-1;
}
.grid-container__001111 {
  grid-column: 1/-1;
}
.grid-container__111000 {
  grid-column: 1/-1;
}
.grid-container__000111 {
  grid-column: 1/-1;
}
.grid-container__001111 {
  grid-column: 1/-1;
}
.grid-container__011111 {
  grid-column: 1/-1;
}
.grid-container__111110 {
  grid-column: 1/-1;
}
.grid-container__span2 {
  grid-column: 1/-1;
}
@media screen and (min-width: 48rem) {
  .grid-container__span2 {
    grid-column: span 3;
  }
  .grid-container__001111 {
    grid-column: 2/-1;
  }
  .grid-container__111000 {
    grid-column: 1/6;
  }
  .grid-container__011111 {
    grid-column: 2/-1;
  }
}
@media screen and (min-width: 64rem) {
  .grid-container__001111 {
    grid-column: 3/-1;
  }
  .grid-container__111110 {
    grid-column: 1/6;
  }
}
@media screen and (min-width: 77rem) {
  .grid-container__full {
    grid-column: 1/-1;
  }
  .grid-container__111000 {
    grid-column: 1/4;
  }
  .grid-container__000111 {
    grid-column: 4/-1;
  }
  .grid-container__001111 {
    grid-column: 3/-1;
  }
  .grid-container__011111 {
    grid-column: 2/-1;
  }
  .grid-container__span2 {
    grid-column: span 2;
  }
}

/* 
 *
 * ANCHOR Image Grid for MFA Life
------------------------------------------------*/
.img-container__full {
  grid-column: 1/-1;
}
.img-container__111000 {
  grid-column: 2/-1;
}
.img-container__000111 {
  grid-column: 1/6;
}
.img-container__001111 {
  grid-column: 2/-1;
}
.img-container__111100 {
  grid-column: 1/6;
}
.img-container__110000 {
  grid-column: 1/4;
}
@media screen and (min-width: 36rem) {
  .img-container__110000 {
    grid-column: 2/5;
  }
}
@media screen and (min-width: 48rem) {
  .img-container__full {
    grid-column: 3/-1;
  }
  .img-container__full img {
    grid-column-start: 1;
    grid-column-end: 9;
  }
  .img-container__111000 {
    grid-column: 3/8;
  }
  .img-container__000111 {
    grid-column: 8/-1;
  }
  .img-container__001111 {
    grid-column: 5/-1;
  }
  .img-container__001111 img {
    grid-column-start: 1;
    grid-column-end: 7;
  }
  .img-container__111100 {
    grid-column: 3/11;
  }
  .img-container__111100 img {
    grid-column-start: 1;
    grid-column-end: 7;
  }
  .img-container__110000 {
    grid-column: 3/7;
  }
}

/* 
 *
 * ANCHOR Text Stylings 
------------------------------------------------*/
.caption {
  font-family: "MarfaMono";
  font-size: var(--size-085);
  font-weight: 300;
  color: var(--black);
  line-height: 125%;
  letter-spacing: -0.02em;
  margin-top: 0.4em;
  max-width: 40em;
}
@media screen and (min-width: 48rem) {
  .caption {
    font-size: var(--size-080);
  }
}