/*  ==========================================================================
   
    FRAMEWERK
    A system created to fill a specific need that follows a certain way of 
    thinking and adheres to a naming convention that really only makes sense 
    to its author, semantics be damned. "Why not use Bootstrap?", you may think. 
    This may as well be, to be fair. If you found your way here, well, abandon 
    all hope. If this makes sense to you, in the words of Owen Wilson, "Wow". 

    Version: 1
    Create Date: 09/2021
    Modify Date: 
   
    ====================================
    
    TABLE OF CONTENTS

    Desktop
      1A: Structure
      2A: Typography
      3A: Color
      4A: Images
    Tablet (max-width: 768.98px)
      1B: Structure
      2B: Typography
      3B: Color
      4B: Images

    Mobile (max-width: 414.98px)
      1C: Structure
      2C: Typography
      3C: Color
      4C: Images

    ==================


    ==========================================================================  */


/*  ==========================================================================
    1A: Structure
    ==========================================================================  */

/* Defaults */
  *,
  ::after,
  ::before {
   box-sizing:border-box
  }

  html {
   font-family:sans-serif;
   font-size:1em;
   line-height:1.15;
   -webkit-text-size-adjust:100%;
   -webkit-tap-highlight-color:transparent
  }

  article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
   display:block
  }

  body {
   margin:0;
   font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol','Noto Color Emoji';
   font-size:1rem;
   font-weight:400;
   line-height:1.5;
   color:#212529;
   text-align:left;
   background-color:#fff
  }
/* Defaults */

/* Wrapper */
  .container {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    padding: 4em 0;
    box-sizing: border-box;
  }
/* Wrapper */

/* Articles & Sections */
  /* Splash Blocks */
  .splash100 {height: 100vh;}
  .splash75 {height: 75vh;}
  .splash50 {height: 50vh;}
  .splash25 {height: 25vh;}
/* Articles & Sections */

/* Width */
  .w100 {width: 100%;}
  .w95 {width: 95%;}
  .w90 {width: 90%;}
  .w85 {width: 85%;}
  .w80 {width: 80%;}
  .w75 {width: 75%;}
  .w70 {width: 70%;}
  .w66 {width: 66.6%;}
  .w65 {width: 65%;}
  .w60 {width: 60%;}
  .w55 {width: 55%;}
  .w50 {width: 50%;}
  .w45 {width: 45%;}
  .w40 {width: 40%;}
  .w35 {width: 35%;}
  .w33 {width: 33.3%;}
  .w30 {width: 30%;}
  .w25 {width: 25%;}
  .w20 {width: 20%;}
  .w15 {width: 15%;}
  .w10 {width: 10%;}
  .w5 {width: 5%;}
/* Width */

/* Flex Calls */
  .flex {display: flex;}

  .row {flex-direction: row;}
  .row-rev {flex-direction: row-reverse;}
  .column {flex-direction: column;}
  .column-rev {flex-direction: column-reverse;}

  .fl-wr {flex-wrap: wrap;}
  .fl-wr-none {flex-wrap: nowrap;}
  .lf-wr-rev {flex-wrap: wrap-reverse;}

  /* Aligns on X-Axis */
  .fl-juco-fs {justify-content: flex-start;}
  .fl-juco-fe {justify-content: flex-end;}
  .fl-juco-c {justify-content: center;}
  .fl-juco-sb {justify-content: space-between;}
  .fl-juco-sa {justify-content: space-around;}
  .fl-juco-se {justify-content: space-evenly;}

  /* Aligns on Y-Axis */
  .fl-alit-fs {align-items: flex-start;}
  .fl-alit-fe {align-items: flex-end;}
  .fl-alit-c {align-items: center;}
  .fl-alit-b {align-items: baseline;}
  .fl-alit-s {align-items: stretch;}

  /* Aligns on Y-Axis */
  .fl-alco-fs {align-content: flex-start;}
  .fl-alco-fe {align-content: flex-end;}
  .fl-alco-c {align-content: center;}
  .fl-alco-Sb {align-content: space-between;}
  .fl-alco-Sb {align-content: space-around;}
  .fl-alco-s {align-content: stretch;}

  /* Aligns Individual Elements */
  .fl-alse-fs {align-self: flex-start;}
  .fl-alse-fe {align-self: flex-end;}
  .fl-alse-c {align-self: center;}
  .fl-alse-b {align-self: baseline;}
  .fl-alse-s {align-self: stretch;}

  .fl-ord-1 {order: 1;}
  .fl-ord-2 {order: 2;}
  .fl-ord-3 {order: 3;}
  .fl-ord-4 {order: 4;}
  .fl-ord-5 {order: 5;}
  .fl-ord-6 {order: 6;}
/* Flex Calls */

/* Margins & Padding  */
  /* Margin */
  .space-outer-t-0 {margin-top: 0em;}
  .space-outer-t-_5x {margin-top: .5em;}
  .space-outer-t-1x {margin-top: 1em;}
  .space-outer-t-2x {margin-top: 2em;}
  .space-outer-t-3x {margin-top: 3em;}
  .space-outer-t-4x {margin-top: 4em;}

  .space-outer-b-0 {margin-bottom: 0em;}
  .space-outer-b-_5x {margin-bottom: .5em;}
  .space-outer-b-1x {margin-bottom: 1em;}
  .space-outer-b-2x {margin-bottom: 2em;}
  .space-outer-b-3x {margin-bottom: 3em;}
  .space-outer-b-4x {margin-bottom: 4em;}

  .space-outer-tb-0 {margin-top: 0em; margin-bottom: 0em;}
  .space-outer-tb-_5x {margin-top: .5em; margin-bottom: .5em;}
  .space-outer-tb-1x {margin-top: 1em; margin-bottom: 1em;}
  .space-outer-tb-2x {margin-top: 2em; margin-bottom: 2em;}
  .space-outer-tb-3x {margin-top: 3em; margin-bottom: 3em;}
  .space-outer-tb-4x {margin-top: 4em; margin-bottom: 4em;}

  .space-outer-r-0 {margin-right: 0em;}
  .space-outer-r-_5x {margin-right: .5em;}
  .space-outer-r-1x {margin-right: 1em;}
  .space-outer-r-2x {margin-right: 2em;}
  .space-outer-r-3x {margin-right: 3em;}

  .space-outer-l-0 {margin-left: 0em;}
  .space-outer-l-_5x {margin-left: .5em;}
  .space-outer-l-1x {margin-left: 1em;}
  .space-outer-l-2x {margin-left: 2em;}
  .space-outer-l-3x {margin-left: 3em;}

  .space-outer-rt-0 {margin-right: 0em; margin-left: 0em;}
  .space-outer-rl-_5x {margin-right: .5em; margin-left: .5em;}
  .space-outer-rl-1x {margin-right: 1em; margin-left: 1em;}
  .space-outer-rl-2x {margin-right: 2em; margin-left: 2em;}
  .space-outer-rl-3x {margin-right: 3em; margin-left: 3em;}

  /* Padding */
  .space-inner-t-0 {padding-top: 0em;}
  .space-inner-t-_5x {padding-top: .5em;}
  .space-inner-t-1x {padding-top: 1em;}
  .space-inner-t-2x {padding-top: 2em;}
  .space-inner-t-3x {padding-top: 3em;}

  .space-inner-b-0 {padding-bottom: 0em;}
  .space-inner-b-_5x {padding-bottom: .5em;}
  .space-inner-b-1x {padding-bottom: 1em;}
  .space-inner-b-2x {padding-bottom: 2em;}
  .space-inner-b-3x {padding-bottom: 3em;}

  .space-inner-tb-0 {padding-top: 0em; padding-bottom: 0em;}
  .space-inner-tb-_5x {padding-top: .5em; padding-bottom: .5em;}
  .space-inner-tb-1x {padding-top: 1em; padding-bottom: 1em;}
  .space-inner-tb-2x {padding-top: 2em; padding-bottom: 2em;}
  .space-inner-tb-3x {padding-top: 3em; padding-bottom: 3em;}

  .space-inner-r-0 {padding-right: 0em;}
  .space-inner-r-_5x {padding-right: .5em;}
  .space-inner-r-1x {padding-right: 1em;}
  .space-inner-r-2x {padding-right: 2em;}
  .space-inner-r-3x {padding-right: 3em;}

  .space-inner-l-0 {padding-left: 0em;}
  .space-inner-l-_5x {padding-left: .5em;}
  .space-inner-l-1x {padding-left: 1em;}
  .space-inner-l-2x {padding-left: 2em;}
  .space-inner-l-3x {padding-left: 3em;}

  .space-inner-rl-0 {padding-right: 0em; padding-left: 0em;}
  .space-inner-rl-_5x {padding-right: .5em; padding-left: .5em;}
  .space-inner-rl-1x {padding-right: 1em; padding-left: 1em;}
  .space-inner-rl-2x {padding-right: 2em; padding-left: 2em;}
  .space-inner-rl-3x {padding-right: 3em; padding-left: 3em;}
/* Margins & Spacing  */  

/*  ==========================================================================
   2A: Typography
   ==========================================================================  */

/* General Styling */
  h1, h2, h3, h4, h5, h6 {
    text-rendering: optimizeLegibility;
    font-family: Dosis, Helvetica, Arial, sans-serif;
    letter-spacing: 2px;
    font-weight: 300;
    line-height: 130%;
    text-transform: uppercase;
    margin-top: 0;
  }

  h1 {font-size: 2em;}
  h2 {font-size: 1.75em;}
  h3 {font-size: 1.5em;}
  h4 {font-size: 1.25em;}
  h5 {font-size: 1em;}

  p {
    text-rendering: optimizeLegibility;
    font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;
    font-size: 1em;
    line-height: 130%;
    font-weight: 300;
    margin: 0 0 1.5em;
  }
    p:last-of-type {margin: 0;}

    p.fp {font-size: .9em;}

  ol, ul, li {
    text-rendering: optimizeLegibility;
    font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;
    font-size: 1em;
    line-height: 130%;
    font-weight: 300;
  }

  ul, ol {
    padding-left: .8em; 
    margin: 0 0 1.5em;
  }

  li {margin-bottom: .75em;}
    li:last-of-type {margin-bottom: 0em;}

  strong {font-weight: 700;}

  .txt-med {font-weight: 500;}

  .nobr { white-space:nowrap; }
/* General Styling */

/* Color */
  h1, h2, h3, h4, h5, h6, p, ol, ul, li {color: #333333;}
  
  .ko {color: #fff;}
/* Color */

/* Alignment */
  .align-c {text-align: center;}
  
  .align-r {text-align: right;}
  
  .align-l {text-align: left;}
/* Alignment */

/* Lists */
  ul, ol {
    padding-left: 0;
    margin: 1em 0 2em 1.5em;
  }

  ol > li::marker {
    font-weight: bold;
  }

  ul {list-style: none;}

  /* Font Awesome List Icon Spacing */
  .fa-ul {
    margin-left: 1.5em !important;
  }
/* Lists */

/* Links */
  a {
    font-family: Dosis, Helvetica, Arial, sans-serif;
    transition: .5s all;
    text-decoration: underline;
    font-weight: inherit;
    color: inherit;
  }
    a:hover {font-weight: 700;}

  .button-light {
    font-family: Dosis, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: .9em;
    background-color: transparent;
    border: .07875em solid #333333;
    display: inline-block;
    padding: .5em;
    text-align: center;
    line-height: normal;
    cursor: pointer;
    transition: .3s all;
    border-radius: .25em;
    text-decoration: none;
    min-width: 200px;
    color: #333333;
  }
    .button-light:hover {
    font-weight: 600;
    background-color: #333333;
    color: #fff;
  }

  .button-dark {
    font-family: Dosis, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: .9em;
    background-color: #333333;
    border: .07875em solid #333333;
    display: inline-block;
    padding: .5em;
    text-align: center;
    line-height: normal;
    cursor: pointer;
    transition: .3s all;
    border-radius: .25em;
    text-decoration: none;
    min-width: 200px;
    color: #fff;
  }
    .button-dark:hover {
    font-weight: 600;
    background-color: transparent;
    color: #333333;
  }
/* Links */

/*  ==========================================================================
   3A: Color
   ==========================================================================  */

/* Color Fill */
  .fill-k {background-color: #000;}
  .fill-k95 {background-color: #0D0D0D;}
  .fill-k90 {background-color: #1A1A1A;}
  .fill-k85 {background-color: #262626;}
  .fill-k80 {background-color: #333333;}
  .fill-k75 {background-color: #404040;}
  .fill-k70 {background-color: #4D4D4D;}
  .fill-k65 {background-color: #595959;}
  .fill-k60 {background-color: #666666;}
  .fill-k55 {background-color: #737373;}
  .fill-k50 {background-color: #808080;}
  .fill-k45 {background-color: #8C8C8C;}
  .fill-k40 {background-color: #999999;}
  .fill-k35 {background-color: #A6A6A6;}
  .fill-k30 {background-color: #B3B3B3;}
  .fill-k25 {background-color: #B3B3B3;}
  .fill-k20 {background-color: #CCCCCC;}
  .fill-k15 {background-color: #DDDDDD;}
  .fill-k10 {background-color: #EEEEEE;}
  .fill-k5 {background-color: #FBFBFB;}
  .fill-k0 {background-color: #FFF;}
/* Color Fill */

/* Borders */
  .stroke-k {border: .07875em solid #000;}
  .stroke-k95 {border: .07875em solid #0D0D0D;}
  .stroke-k90 {border: .07875em solid #1A1A1A;}
  .stroke-k85 {border: .07875em solid #262626;}
  .stroke-k80 {border: .07875em solid #333333;}
  .stroke-k75 {border: .07875em solid #404040;}
  .stroke-k70 {border: .07875em solid #4D4D4D;}
  .stroke-k65 {border: .07875em solid #595959;}
  .stroke-k60 {border: .07875em solid #666666;}
  .stroke-k55 {border: .07875em solid #737373;}
  .stroke-k50 {border: .07875em solid #808080;}
  .stroke-k45 {border: .07875em solid #8C8C8C;}
  .stroke-k40 {border: .07875em solid #999999;}
  .stroke-k35 {border: .07875em solid #A6A6A6;}
  .stroke-k30 {border: .07875em solid #B3B3B3;}
  .stroke-k25 {border: .07875em solid #B3B3B3;}
  .stroke-k20 {border: .07875em solid #CCCCCC;}
  .stroke-k15 {border: .07875em solid #DDDDDD;}
  .stroke-k10 {border: .07875em solid #EEEEEE;}
  .stroke-k5 {border: .07875em solid #FBFBFB;}
  .stroke-k0 {border: .07875em solid #FFF;}
/* Borders */

/*  ==========================================================================
   4A: Images
   ==========================================================================  */

/* Images Scale */
  img.img-scale {
    width: 100%;
    height: auto;
  }

  img.img-scale-80 {
    width: 80%;
    height: auto;
  }

  img.img-scale-66 {
    width: 66%;
    height: auto;
  }

  img.img-scale-60 {
    width: 60%;
    height: auto;
  }

  img.img-scale-50 {
    width: 50%;
    height: auto;
  }

  img.img-scale-40 {
    width: 40%;
    height: auto;
  }

  img.img-scale-33 {
    width: 33%;
    height: auto;
  }

  img.img-scale-20 {
    width: 20%;
    height: auto;
  }
/* Images Scale */

/* Image Shape */
  img.circle {border-radius: 50%;}
/* Image Shape */
  
/* Image Filter */
  img.grey {filter: grayscale(1);}
  img.grey80 {filter: grayscale(.8);}
  img.grey60 {filter: grayscale(.6);}
  img.grey40 {filter: grayscale(.4);}
  img.grey20 {filter: grayscale(.2);}
/* Image Filter */


@media only screen and (max-width: 768.98px) {

  /*  ==========================================================================
   1B: Structure
   ==========================================================================  */
  
  /* Defaults */
  /* Defaults */

  /* Wrapper */
  /* Wrapper */

  /* Articles & Sections */
  /* Articles & Sections */

  /* Width */
    .md-w50 {width: 50%;}
    .md-w66 {width: 66.6%}
    .md-w33 {width: 33.3%;}
  /* Width */

  /* Flex Calls */
    .md-row {flex-direction: row;}
    .md-row-rev {flex-direction: row-reverse;}
    .md-column {flex-direction: column;}
    .md-column-rev {flex-direction: column-reverse;}

    .md-fl-wr {flex-wrap: wrap;}
    .md-fl-wr-none {flex-wrap: nowrap;}
    .md-lf-wr-rev {flex-wrap: wrap-reverse;}

    /* Aligns on X-Axis */
    .md-fl-juco-fs {justify-content: flex-start;}
    .md-fl-juco-fe {justify-content: flex-end;}
    .md-fl-juco-c {justify-content: center;}
    .md-fl-juco-sb {justify-content: space-between;}
    .md-fl-juco-sa {justify-content: space-around;}
    .md-fl-juco-se {justify-content: space-evenly;}

    /* Aligns on Y-Axis */
    .md-fl-alit-fs {align-items: flex-start;}
    .md-fl-alit-fe {align-items: flex-end;}
    .md-fl-alit-c {align-items: center;}
    .md-fl-alit-b {align-items: baseline;}
    .md-fl-alit-s {align-items: stretch;}

    /* Aligns on Y-Axis */
    .md-fl-alco-fs {align-content: flex-start;}
    .md-fl-alco-fe {align-content: flex-end;}
    .md-fl-alco-c {align-content: center;}
    .md-fl-alco-Sb {align-content: space-between;}
    .md-fl-alco-Sb {align-content: space-around;}
    .md-fl-alco-s {align-content: stretch;}

    .md-fl-ord-1 {order: 1;}
    .md-fl-ord-2 {order: 2;}
    .md-fl-ord-3 {order: 3;}
    .md-fl-ord-4 {order: 4;}
    .md-fl-ord-5 {order: 5;}
    .md-fl-ord-6 {order: 6;}
  /* Flex Calls */

  /* Margins & Padding  */
    /* Margin */
    .md-space-outer-t-0 {margin-top: 0em;}
    .md-space-outer-t-_5x {margin-top: .5em;}
    .md-space-outer-t-1x {margin-top: 1em;}
    .md-space-outer-t-2x {margin-top: 2em;}
    .md-space-outer-t-3x {margin-top: 3em;}

    .md-space-outer-b-0 {margin-bottom: 0em;}
    .md-space-outer-b-_5x {margin-bottom: .5em;}
    .md-space-outer-b-1x {margin-bottom: 1em;}
    .md-space-outer-b-2x {margin-bottom: 2em;}
    .md-space-outer-b-3x {margin-bottom: 3em;}

    .md-space-outer-tb-0 {margin-top: 0em; margin-bottom: 0em;}
    .md-space-outer-tb-_5x {margin-top: .5em; margin-bottom: .5em;}
    .md-space-outer-tb-1x {margin-top: 1em; margin-bottom: 1em;}
    .md-space-outer-tb-2x {margin-top: 2em; margin-bottom: 2em;}
    .md-space-outer-tb-3x {margin-top: 3em; margin-bottom: 3em;}

    .md-space-outer-r-0 {margin-right: 0em;}
    .md-space-outer-r-_5x {margin-right: .5em;}
    .md-space-outer-r-1x {margin-right: 1em;}
    .md-space-outer-r-2x {margin-right: 2em;}
    .md-space-outer-r-3x {margin-right: 3em;}

    .md-space-outer-l-0 {margin-left: 0em;}
    .md-space-outer-l-_5x {margin-left: .5em;}
    .md-space-outer-l-1x {margin-left: 1em;}
    .md-space-outer-l-2x {margin-left: 2em;}
    .md-space-outer-l-3x {margin-left: 3em;}

    .md-space-outer-rt-0 {margin-right: 0em; margin-left: 0em;}
    .md-space-outer-rl-_5x {margin-right: .5em; margin-left: .5em;}
    .md-space-outer-rl-1x {margin-right: 1em; margin-left: 1em;}
    .md-space-outer-rl-2x {margin-right: 2em; margin-left: 2em;}
    .md-space-outer-rl-3x {margin-right: 3em; margin-left: 3em;}

    /* Spacing */
    .md-space-inner-t-0 {padding-top: 0em;}
    .md-space-inner-t-_5x {padding-top: .5em;}
    .md-space-inner-t-1x {padding-top: 1em;}
    .md-space-inner-t-2x {padding-top: 2em;}
    .md-space-inner-t-3x {padding-top: 3em;}

    .md-space-inner-b-0 {padding-bottom: 0em;}
    .md-space-inner-b-_5x {padding-bottom: .5em;}
    .md-space-inner-b-1x {padding-bottom: 1em;}
    .md-space-inner-b-2x {padding-bottom: 2em;}
    .md-space-inner-b-3x {padding-bottom: 3em;}

    .md-space-inner-tb-0 {padding-top: 0em; padding-bottom: 0em;}
    .md-space-inner-tb-_5x {padding-top: .5em; padding-bottom: .5em;}
    .md-space-inner-tb-1x {padding-top: 1em; padding-bottom: 1em;}
    .md-space-inner-tb-2x {padding-top: 2em; padding-bottom: 2em;}
    .md-space-inner-tb-3x {padding-top: 3em; padding-bottom: 3em;}

    .md-space-inner-r-0 {padding-right: 0em;}
    .md-space-inner-r-_5x {padding-right: .5em;}
    .md-space-inner-r-1x {padding-right: 1em;}
    .md-space-inner-r-2x {padding-right: 2em;}
    .md-space-inner-r-3x {padding-right: 3em;}

    .md-space-inner-l-0 {padding-left: 0em;}
    .md-space-inner-l-_5x {padding-left: .5em;}
    .md-space-inner-l-1x {padding-left: 1em;}
    .md-space-inner-l-2x {padding-left: 2em;}
    .md-space-inner-l-3x {padding-left: 3em;}

    .md-space-inner-rl-0 {padding-right: 0em; padding-left: 0em;}
    .md-space-inner-rl-_5x {padding-right: .5em; padding-left: .5em;}
    .md-space-inner-rl-1x {padding-right: 1em; padding-left: 1em;}
    .md-space-inner-rl-2x {padding-right: 2em; padding-left: 2em;}
    .md-space-inner-rl-3x {padding-right: 3em; padding-left: 3em;}
  /* Margins & Spacing  */

  /* Header */
    /* Nav Bar & Hamburger Nav */
    /* Nav Bar & Hamburger Nav */
  /* Header */

  /*  ==========================================================================
   2B: Typography
   ==========================================================================  */

  /* General Styling */
  /* General Styling */

  /* Color */
  /* Color */

  /* Alignment */
    .md-align-c {text-align: center;}
    .md-align-r {text-align: right;}
    .md-align-l {text-align: left;}
  /* Alignment */

  /* Lists */
  /* Lists */

  /* Links */
  /* Links */

  /*  ==========================================================================
   3B: Color
   ==========================================================================  */

  /* Color Fill */
  /* Color Fill */

  /*  ==========================================================================
   4B: Images
   ==========================================================================  */

  /* Image Scale */
    img.md-img-scale {
      width: 100%;
      height: auto;
    }

    img.md-img-scale-80 {
      width: 80%;
      height: auto;
    }

    img.md-img-scale-66 {
      width: 66%;
      height: auto;
    }

    img.md-img-scale-60 {
      width: 60%;
      height: auto;
    }

    img.md-img-scale-50 {
      width: 50%;
      height: auto;
    }

    img.md-img-scale-40 {
      width: 40%;
      height: auto;
    }

    img.md-img-scale-33 {
      width: 33%;
      height: auto;
    }

    img.md-img-scale-20 {
      width: 20%;
      height: auto;
    }
  /* Image Scale */

}

@media only screen and (max-width: 414.98px) { 

  /*  ==========================================================================
   1C: Structure
   ==========================================================================  */
  
  /* Defaults */
  .sm-hidden {display: none !important;}
  /* Defaults */

  /* Wrapper */
  /* Wrapper */

  /* Articles & Sections */
  /* Articles & Sections */
   
  /* Width */
    .w100, .w95, .w90, .w85, .w80, .w75, .w70, .w66, .w65, .w60, .w55, .w50, .w45, .w40, .w35, .w33, .w30, .w25, .w20, .w15, .w10, .w5 {width: 100%;} 
  
    .sm-w50 {width: 50%;}
    .sm-w66 {width: 66.6%}
    .sm-w33 {width: 33.3%;}
  /* Width */

  /* Flex Calls */
    .sm-row {flex-direction: row;}
    .sm-row-rev {flex-direction: row-reverse;}
    .sm-column {flex-direction: column;}
    .sm-column-rev {flex-direction: column-reverse;}

    .sm-fl-wr {flex-wrap: wrap;}
    .sm-fl-wr-none {flex-wrap: nowrap;}
    .sm-lf-wr-rev {flex-wrap: wrap-reverse;}

    /* Aligns on X-Axis */
    .sm-fl-juco-fs {justify-content: flex-start;}
    .sm-fl-juco-fe {justify-content: flex-end;}
    .sm-fl-juco-c {justify-content: center;}
    .sm-fl-juco-sb {justify-content: space-between;}
    .sm-fl-juco-sa {justify-content: space-around;}
    .sm-fl-juco-se {justify-content: space-evenly;}

    /* Aligns on Y-Axis */
    .sm-fl-alit-fs {align-items: flex-start;}
    .sm-fl-alit-fe {align-items: flex-end;}
    .sm-fl-alit-c {align-items: center;}
    .sm-fl-alit-b {align-items: baseline;}
    .sm-fl-alit-s {align-items: stretch;}

    /* Aligns on Y-Axis */
    .sm-fl-alco-fs {align-content: flex-start;}
    .sm-fl-alco-fe {align-content: flex-end;}
    .sm-fl-alco-c {align-content: center;}
    .sm-fl-alco-Sb {align-content: space-between;}
    .sm-fl-alco-Sb {align-content: space-around;}
    .sm-fl-alco-s {align-content: stretch;}

    .sm-fl-ord-1 {order: 1;}
    .sm-fl-ord-2 {order: 2;}
    .sm-fl-ord-3 {order: 3;}
    .sm-fl-ord-4 {order: 4;}
    .sm-fl-ord-5 {order: 5;}
    .sm-fl-ord-6 {order: 6;}
  /* Flex Calls */

  /* Margins & Padding  */
    /* Margin */
    .sm-space-outer-t-0 {margin-top: 0em;}
    .sm-space-outer-t-_5x {margin-top: .5em;}
    .sm-space-outer-t-1x {margin-top: 1em;}
    .sm-space-outer-t-2x {margin-top: 2em;}
    .sm-space-outer-t-3x {margin-top: 3em;}

    .sm-space-outer-b-0 {margin-bottom: 0em;}
    .sm-space-outer-b-_5x {margin-bottom: .5em;}
    .sm-space-outer-b-1x {margin-bottom: 1em;}
    .sm-space-outer-b-2x {margin-bottom: 2em;}
    .sm-space-outer-b-3x {margin-bottom: 3em;}

    .sm-space-outer-tb-0 {margin-top: 0em; margin-bottom: 0em;}
    .sm-space-outer-tb-_5x {margin-top: .5em; margin-bottom: .5em;}
    .sm-space-outer-tb-1x {margin-top: 1em; margin-bottom: 1em;}
    .sm-space-outer-tb-2x {margin-top: 2em; margin-bottom: 2em;}
    .sm-space-outer-tb-3x {margin-top: 3em; margin-bottom: 3em;}

    .sm-space-outer-r-0 {margin-right: 0em;}
    .sm-space-outer-r-_5x {margin-right: .5em;}
    .sm-space-outer-r-1x {margin-right: 1em;}
    .sm-space-outer-r-2x {margin-right: 2em;}
    .sm-space-outer-r-3x {margin-right: 3em;}

    .sm-space-outer-l-0 {margin-left: 0em;}
    .sm-space-outer-l-_5x {margin-left: .5em;}
    .sm-space-outer-l-1x {margin-left: 1em;}
    .sm-space-outer-l-2x {margin-left: 2em;}
    .sm-space-outer-l-3x {margin-left: 3em;}

    .sm-space-outer-rl-0 {margin-right: 0em; margin-left: 0em;}
    .sm-space-outer-rl-_5x {margin-right: .5em; margin-left: .5em;}
    .sm-space-outer-rl-1x {margin-right: 1em; margin-left: 1em;}
    .sm-space-outer-rl-2x {margin-right: 2em; margin-left: 2em;}
    .sm-space-outer-rl-3x {margin-right: 3em; margin-left: 3em;}

    /* Padding */
    .sm-space-inner-t-0 {padding-top: 0em;}
    .sm-space-inner-t-_5x {padding-top: .5em;}
    .sm-space-inner-t-1x {padding-top: 1em;}
    .sm-space-inner-t-2x {padding-top: 2em;}
    .sm-space-inner-t-3x {padding-top: 3em;}

    .sm-space-inner-b-0 {padding-bottom: 0em;}
    .sm-space-inner-b-_5x {padding-bottom: .5em;}
    .sm-space-inner-b-1x {padding-bottom: 1em;}
    .sm-space-inner-b-2x {padding-bottom: 2em;}
    .sm-space-inner-b-3x {padding-bottom: 3em;}

    .sm-space-inner-tb-0 {padding-top: 0em; padding-bottom: 0em;}
    .sm-space-inner-tb-_5x {padding-top: .5em; padding-bottom: .5em;}
    .sm-space-inner-tb-1x {padding-top: 1em; padding-bottom: 1em;}
    .sm-space-inner-tb-2x {padding-top: 2em; padding-bottom: 2em;}
    .sm-space-inner-tb-3x {padding-top: 3em; padding-bottom: 3em;}

    .sm-space-inner-r-0 {padding-right: 0em;}
    .sm-space-inner-r-_5x {padding-right: .5em;}
    .sm-space-inner-r-1x {padding-right: 1em;}
    .sm-space-inner-r-2x {padding-right: 2em;}
    .sm-space-inner-r-3x {padding-right: 3em;}

    .sm-space-inner-l-0 {padding-left: 0em;}
    .sm-space-inner-l-_5x {padding-left: .5em;}
    .sm-space-inner-l-1x {padding-left: 1em;}
    .sm-space-inner-l-2x {padding-left: 2em;}
    .sm-space-inner-l-3x {padding-left: 3em;}

    .sm-space-inner-rl-0 {padding-right: 0em; padding-left: 0em;}
    .sm-space-inner-rl-_5x {padding-right: .5em; padding-left: .5em;}
    .sm-space-inner-rl-1x {padding-right: 1em; padding-left: 1em;}
    .sm-space-inner-rl-2x {padding-right: 2em; padding-left: 2em;}
    .sm-space-inner-rl-3x {padding-right: 3em; padding-left: 3em;}
  /* Margins & Spacing  */

  /* Header */
    /* Nav Bar & Hamburger Nav */
    /* Nav Bar & Hamburger Nav */
  /* Header */

  /*  ==========================================================================
   2C: Typography
   ==========================================================================  */

  /* General Styling */
  /* General Styling */

  /* Color */
  /* Color */
  
  /* Alignment */
    .sm-align-c {text-align: center;}
    .sm-align-r {text-align: right;}
    .sm-align-l {text-align: left;}
  /* Alignment */

  /* Lists */
  /* Lists */

  /* Links */
    .button {
      min-width: 100%;
      width: 100%;
    }
  /* Links */

  /*  ==========================================================================
   3C: Color
   ==========================================================================  */

  /* Color Fill */
  /* Color Fill */

  /*  ==========================================================================
   4C: Images
   ==========================================================================  */

  /* Image Scale */
    img.sm-img-scale {
      width: 100%;
      height: auto;
    }

    img.sm-img-scale-80 {
      width: 80%;
      height: auto;
    }

    img.sm-img-scale-66 {
      width: 66%;
      height: auto;
    }

    img.sm-img-scale-60 {
      width: 60%;
      height: auto;
    }

    img.sm-img-scale-50 {
      width: 50%;
      height: auto;
    }

    img.sm-img-scale-40 {
      width: 40%;
      height: auto;
    }

    img.sm-img-scale-33 {
      width: 33%;
      height: auto;
    }

    img.sm-img-scale-20 {
      width: 20%;
      height: auto;
    }
  /* Image Scale */

}

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}