html, body {
  height: 100%;
  padding: 0;
  margin: 0;
  -webkit-overflow-scrolling: touch; }

body {
  font-size: 16px;
  font-family: 'Open Sans', sans-serif;
  overflow-x: hidden;
  background-color: white; }

img {
  max-width: 100%; }

.clear {
  clear: both; }

h1.self, h2.self, h3.self, h4.self {
  font-family: 'Inconsolata', monospace;
  font-weight: 700;
  font-size: 80px;
  color: #FFF;
  margin: 0;
  margin-bottom: 15px;
  text-transform: unset; }

div.title {
  color: #0E2133;
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 30px; }
  div.title-blue {
    color: white; }

h2.self {
  font-size: 30px;
  font-weight: 400;
  margin: 0; }
  h2.self.title {
    color: #0E2133;
    font-size: 40px;
    font-weight: 700;
    margin-bottom: 30px; }
  h2.self.lite {
    font-size: 24px;
    font-weight: 100;
    font-family: 'Open Sans', sans-serif; }

h3.self {
  font-size: 25px;
  margin: 0;
  font-weight: 400; }

h4.self {
  font-size: 18px;
  color: white; }

p {
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  color: black;
  line-height: 2;
  margin-bottom: 30px; }
  p.caption {
    font-size: 14px;
    font-weight: 100;
    color: #242424;
    margin: 0; }

.content {
  margin: 0 22%;
  padding: 100px 0; }

.dropCap {
  display: block;
  float: left;
  width: 68px;
  height: 68px;
  text-indent: -9000px;
  position: relative;
  margin-top: 10px;
  margin-right: 10px; }
  .dropCap img {
    position: absolute;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    top: 0;
    left: 0; }

.image-break {
  position: relative;
  padding-bottom: 23%; }
  .image-break img {
    position: absolute;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    top: 0;
    left: 0; }

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-line-pack: end;
  align-content: flex-end; }

div.body-text {
  padding: 0 100px; }

div.topSpace {
  height: 250px;
  float: left; }

div.bluebox {
  float: left;
  width: 150px;
  clear: both;
  margin-right: 30px;
  margin-bottom: 20px;
  -webkit-box-sizing: unset;
  box-sizing: unset; }
  div.bluebox div.top {
    height: 295px;
    position: relative;
    -webkit-box-sizing: unset;
    box-sizing: unset; }
    div.bluebox div.top div.absolute {
      position: absolute;
      right: 0px;
      padding: 70px 40px 40px 0;
      background-color: #123058;
      width: 1000px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-sizing: unset;
      box-sizing: unset; }
      div.bluebox div.top div.absolute h2 {
        text-align: right;
        position: relative; }
        div.bluebox div.top div.absolute h2:before {
          -webkit-box-sizing: unset;
          box-sizing: unset;
          content: '';
          width: 60px;
          height: 60px;
          position: absolute;
          top: -40px;
          left: -30px;
          background: url(https://cdn.txamfoundation.com/Spirit/Spring-2019/Cover-Feature/quotebx.svg) center no-repeat;
          background-size: 60px 60px; }
      div.bluebox div.top div.absolute div.spacer {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        margin-right: 656px; }
  div.bluebox div.bottom {
    height: 90px;
    position: relative; }
    div.bluebox div.bottom div.absolute {
      background-color: #0E2133;
      position: absolute;
      right: 0;
      padding: 30px 40px 30px 0;
      width: 1000px; }
      div.bluebox div.bottom div.absolute h2 {
        text-align: right; }
      div.bluebox div.bottom div.absolute div.spacer {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        margin-right: 656px; }

div.bluebox-mobile {
  width: 80%;
  margin: auto;
  margin-bottom: 14px; }
  div.bluebox-mobile h2 {
    color: white;
    background-color: #123058;
    padding: 30px;
    padding-left: 60px;
    text-align: right;
    padding-top: 50px;
    position: relative; }
    div.bluebox-mobile h2:before {
      -webkit-box-sizing: unset;
      box-sizing: unset;
      content: '';
      background: url(https://cdn.txamfoundation.com/Spirit/Spring-2019/Cover-Feature/quotebx.svg) center no-repeat;
      width: 40px;
      height: 40px;
      display: inline-block;
      margin-right: 20px;
      margin-bottom: 20px; }
  div.bluebox-mobile h2.lite {
    padding-top: 30px;
    background-color: #0E2133; }
    div.bluebox-mobile h2.lite:before {
      content: unset; }

div.bluebar {
  position: relative; }
  div.bluebar div.content {
    padding: 50px 0; }
  div.bluebar h4:before {
    content: '';
    width: 80%;
    height: 100%;
    z-index: -1;
    background: #123058;
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1; }

div.sideCode {
  position: absolute;
  padding: 15px;
  top: 0;
  left: 0;
  background: rgba(190, 198, 209, 0.1); }
  div.sideCode p {
    margin: 0;
    font-family: 'Inconsolata', monospace;
    text-align: right;
    color: #BEC6D1;
    line-height: 1.1; }
    div.sideCode p.indent {
      padding-left: 30px; }
    div.sideCode p.__right {
      text-align: right !important; }
  div.sideCode-blue p {
    color: #BEC6D1;
    opacity: 1;
    z-index: 1; }
  div.sideCode-right {
    right: 0;
    left: unset; }

img.line {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: -1; }

span#number {
  color: white !important; }

.glitch {
  position: relative;
  width: 100%; }
  .glitch.h1 {
    font-size: 70px;
    color: white; }
  .glitch.play:before, .glitch.play:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: white;
    z-index: 1;
    overflow: hidden;
    clip: rect(0, 0, 0, 0); }
  .glitch.play-blue:before, .glitch.play-blue:after {
    background-color: #0E2133; }
  .glitch.play:before {
    left: 3px;
    text-shadow: -1px 0 #00D8F5;
    content: attr(data-text); }
  .glitch.play:after {
    left: -2px;
    text-shadow: 1px 0 #33FF3D;
    content: attr(data-text); }
  .glitch.play-long:before {
    -webkit-animation: glitch-long 1s linear;
    animation: glitch-long 1s linear;
    -webkit-animation-delay: 1s;
    animation-delay: 1s; }
  .glitch.play-long:after {
    -webkit-animation: glitch-long 1s linear;
    animation: glitch-long 1s linear;
    -webkit-animation-delay: 1s;
    animation-delay: 1s; }
  .glitch.play-short:before {
    -webkit-animation: glitch 1s linear;
    animation: glitch 1s linear;
    -webkit-animation-delay: 1s;
    animation-delay: 1s; }
  .glitch.play-short:after {
    -webkit-animation: glitch 1s linear;
    animation: glitch 1s linear;
    -webkit-animation-delay: 1s;
    animation-delay: 1s; }
  .glitch.play-right:before {
    left: 46%; }
  .glitch.play-right:after {
    left: 47%; }
  .glitch.play2 {
    color: white;
    width: 100%; }
    .glitch.play2:before, .glitch.play2:after {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: none;
      z-index: 1;
      overflow: hidden;
      color: white;
      content: attr(data-text); }
    .glitch.play2:before {
      left: 3px;
      text-shadow: -1px 0 blue;
      clip: rect(0px, 0px, 0px, 0px);
      -webkit-animation: glitch-title 1s linear;
      animation: glitch-title 1s linear; }
    .glitch.play2:after {
      left: -2px;
      text-shadow: 1px 0 lime;
      clip: rect(0px, 0px, 0px, 0px);
      -webkit-animation: glitch-title 2s linear;
      animation: glitch-title 2s linear; }

div.lines {
  position: absolute;
  width: 24px;
  height: 24px; }
  div.lines.s3-steve {
    background: url(https://cdn.txamfoundation.com/Spirit/Spring-2019/Cover-Feature/steve.svg) no-repeat;
    -webkit-transform: scale(10);
    -ms-transform: scale(10);
    transform: scale(10);
    bottom: 0;
    right: 0;
    z-index: -1; }
    div.lines.s3-steve.play {
      -webkit-animation: steve 1000ms;
      animation: steve 1000ms;
      -webkit-animation-timing-function: steps(30);
      animation-timing-function: steps(30);
      -webkit-animation-iteration-count: 1;
      animation-iteration-count: 1;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      background-size: cover;
      -webkit-animation-delay: 1s;
      animation-delay: 1s; }
  div.lines.s3-daniel {
    background: url(https://cdn.txamfoundation.com/Spirit/Spring-2019/Cover-Feature/daniel.svg) no-repeat;
    -webkit-transform: scale(12);
    -ms-transform: scale(12);
    transform: scale(12);
    top: 0;
    left: -20px;
    z-index: -1; }
    div.lines.s3-daniel.play {
      -webkit-animation: daniel 1000ms;
      animation: daniel 1000ms;
      -webkit-animation-timing-function: steps(60);
      animation-timing-function: steps(60);
      -webkit-animation-iteration-count: 1;
      animation-iteration-count: 1;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      background-size: cover;
      -webkit-animation-delay: 1s;
      animation-delay: 1s; }
  div.lines.aggie-answer {
    background: url(https://cdn.txamfoundation.com/Spirit/Spring-2019/Cover-Feature/aggie_answer.svg) no-repeat;
    -webkit-transform: scale(10);
    -ms-transform: scale(10);
    transform: scale(10);
    bottom: 0;
    right: 0px;
    z-index: -1; }
    div.lines.aggie-answer.play {
      -webkit-animation: aggieAnswer 1000ms;
      animation: aggieAnswer 1000ms;
      -webkit-animation-timing-function: steps(60);
      animation-timing-function: steps(60);
      -webkit-animation-iteration-count: 1;
      animation-iteration-count: 1;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      background-size: cover;
      -webkit-animation-delay: .5s;
      animation-delay: .5s; }
  div.lines.andrew {
    background: url(https://cdn.txamfoundation.com/Spirit/Spring-2019/Cover-Feature/andrew.svg) no-repeat;
    -webkit-transform: scale(10);
    -ms-transform: scale(10);
    transform: scale(10);
    bottom: 100px;
    right: 70px;
    z-index: -1; }
    div.lines.andrew.play {
      -webkit-animation: andrew 1000ms;
      animation: andrew 1000ms;
      -webkit-animation-timing-function: steps(60);
      animation-timing-function: steps(60);
      -webkit-animation-iteration-count: 1;
      animation-iteration-count: 1;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      background-size: cover;
      -webkit-animation-delay: .5s;
      animation-delay: .5s; }
  div.lines.bb1 {
    background: url(https://cdn.txamfoundation.com/Spirit/Spring-2019/Cover-Feature/bb1.svg) no-repeat;
    -webkit-transform: translateY(-50%) scale(13);
    -ms-transform: translateY(-50%) scale(13);
    transform: translateY(-50%) scale(13);
    left: 18%;
    top: 50%;
    z-index: -1; }
    div.lines.bb1.play {
      -webkit-animation: blueBar1 1000ms;
      animation: blueBar1 1000ms;
      -webkit-animation-timing-function: steps(60);
      animation-timing-function: steps(60);
      -webkit-animation-iteration-count: 1;
      animation-iteration-count: 1;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      background-size: cover;
      -webkit-animation-delay: .5s;
      animation-delay: .5s; }
  div.lines.bb2 {
    background: url(https://cdn.txamfoundation.com/Spirit/Spring-2019/Cover-Feature/bb2.svg) no-repeat;
    -webkit-transform: translateY(-50%) scale(10);
    -ms-transform: translateY(-50%) scale(10);
    transform: translateY(-50%) scale(10);
    right: 19%;
    top: 50%;
    z-index: -1; }
    div.lines.bb2.play {
      -webkit-animation: bb2 1000ms;
      animation: bb2 1000ms;
      -webkit-animation-timing-function: steps(60);
      animation-timing-function: steps(60);
      -webkit-animation-iteration-count: 1;
      animation-iteration-count: 1;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      background-size: cover;
      -webkit-animation-delay: .5s;
      animation-delay: .5s; }
  div.lines.quote {
    background: url(https://cdn.txamfoundation.com/Spirit/Spring-2019/Cover-Feature/quote.svg) no-repeat;
    -webkit-transform: scale(10);
    -ms-transform: scale(10);
    transform: scale(10);
    left: 390px;
    bottom: 0;
    z-index: -1; }
    div.lines.quote.play {
      -webkit-animation: bb2 1000ms;
      animation: bb2 1000ms;
      -webkit-animation-timing-function: steps(60);
      animation-timing-function: steps(60);
      -webkit-animation-iteration-count: 1;
      animation-iteration-count: 1;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      background-size: cover;
      -webkit-animation-delay: 1s;
      animation-delay: 1s; }

*:focus {
  outline: none; }

a.email {
  color: white; }

section.full {
  position: fixed;
  top: 0;
  left: -100%;
  -webkit-transition: all .75s ease-in-out;
  -o-transition: all .75s ease-in-out;
  transition: all .75s ease-in-out;
  background: white;
  z-index: 100;
  overflow-y: scroll;
  overflow-x: hidden;
  height: 100%;
  width: 100%; }
  section.full div.container {
    position: relative; }
    section.full div.container div.sideCode {
      top: 50%;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      left: -90px; }
      section.full div.container div.sideCode#two {
        left: unset;
        top: unset;
        bottom: 0;
        right: 0; }
        section.full div.container div.sideCode#two p {
          text-align: left; }
    section.full div.container div.content {
      position: relative;
      width: 900px;
      margin: auto; }
      section.full div.container div.content div.body-text {
        position: relative;
        padding: 0; }
        section.full div.container div.content div.body-text h2 {
          width: 70%; }
        section.full div.container div.content div.body-text div.close {
          position: absolute;
          top: -50px;
          right: -50px;
          width: 50px;
          height: 50px;
          -webkit-transition: all ease .5s;
          -o-transition: all ease .5s;
          transition: all ease .5s; }
          section.full div.container div.content div.body-text div.close:hover {
            cursor: pointer;
            -webkit-transform: scale(1.1);
            -ms-transform: scale(1.1);
            transform: scale(1.1); }
          section.full div.container div.content div.body-text div.close:before, section.full div.container div.content div.body-text div.close:after {
            content: '';
            position: absolute;
            top: 50%;
            -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            transform: translateY(-50%);
            height: 30%;
            width: 100%;
            background-color: #0E2133;
            -webkit-transform-origin: center;
            -ms-transform-origin: center;
            transform-origin: center;
            -webkit-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            transform: rotate(45deg); }
          section.full div.container div.content div.body-text div.close:after {
            -webkit-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            transform: rotate(-45deg); }
        section.full div.container div.content div.body-text div.topSpace {
          float: right;
          height: 80px; }
        section.full div.container div.content div.body-text div.card {
          float: right !important;
          clear: both;
          margin-left: 30px;
          width: 45%; }
        section.full div.container div.content div.body-text p.close {
          text-decoration: underline;
          font-size: 18px; }
          section.full div.container div.content div.body-text p.close:hover {
            cursor: pointer; }
  section.full.active {
    left: 0; }

section.s1 {
  position: relative;
  padding-bottom: 47%;
  border-bottom: solid 35px #0E2133; }
  section.s1 img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover; }
  section.s1 div.title {
    position: absolute;
    background: rgba(18, 48, 88, 0.87);
    padding: 50px;
    padding-left: 15%;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%); }
    section.s1 div.title h1, section.s1 div.title h2 {
      color: white; }
    section.s1 div.title h2.indent {
      margin-left: 50px; }

section.s2 {
  position: relative; }
  section.s2 div.sideCode {
    top: unset;
    bottom: 50px;
    left: -100px; }
  section.s2 div.content h3 {
    color: #0E2133;
    font-weight: 700; }

section.s3 {
  position: relative; }
  section.s3 div.sideCode {
    left: unset;
    right: -150px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 400px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
    section.s3 div.sideCode p {
      text-align: left; }
  section.s3 div.content {
    padding: 0;
    -webkit-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    transform: translateY(-50px); }
    section.s3 div.content div.body-text {
      padding-top: 100px; }
    section.s3 div.content div.card {
      float: right;
      position: relative;
      width: 45%;
      margin-left: 30px;
      margin-bottom: 30px; }
      section.s3 div.content div.card img.line {
        position: absolute;
        bottom: -124px;
        right: -100px;
        width: 70%; }
    section.s3 div.content div.bottom {
      margin-top: 50px; }
      section.s3 div.content div.bottom div.image-box {
        float: left;
        width: 45%;
        padding-right: 30px;
        position: relative; }
        section.s3 div.content div.bottom div.image-box img.line {
          left: -70px;
          right: unset;
          width: 20%;
          top: -140px;
          bottom: unset; }
        section.s3 div.content div.bottom div.image-box p.caption {
          float: right; }
      section.s3 div.content div.bottom div.body-text {
        padding-top: 100px; }

section.s4 {
  background-color: #0E2133;
  position: relative; }
  section.s4 div.sideCode {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: -100px; }
  section.s4 div.content {
    padding: 0;
    -webkit-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    transform: translateY(-50px);
    position: relative; }
    section.s4 div.content div.body-text {
      padding-top: 100px; }
      section.s4 div.content div.body-text.first {
        padding-top: 0; }
    section.s4 div.content h2.title, section.s4 div.content p {
      color: white; }
    section.s4 div.content div.right {
      float: right;
      width: 45%;
      margin-left: 30px;
      position: relative; }
      section.s4 div.content div.right img.lines {
        position: absolute;
        z-index: -1;
        bottom: -96px;
        right: -30px;
        width: 50%; }

section.s5 {
  position: relative; }
  section.s5 div.sideCode {
    left: unset;
    right: -100px; }
    section.s5 div.sideCode p {
      text-align: left; }
  section.s5 div.content div.flex div.left {
    width: 48%;
    margin-right: 43px; }
    section.s5 div.content div.flex div.left div.body-text {
      padding-right: 0; }
  section.s5 div.content div.card {
    float: right;
    margin-left: 30px;
    width: 45%;
    position: relative; }
    section.s5 div.content div.card img.lines {
      bottom: 0;
      right: -16px;
      z-index: -1;
      position: absolute;
      width: 30%; }

section.s6 {
  position: relative;
  margin-bottom: 100px;
  clear: both;
  margin-top: 50px; }
  section.s6 div.content {
    padding: 50px 0; }
  section.s6 h4:before {
    background: #0E2133;
    content: '';
    width: 80%;
    left: 0;
    top: 0;
    height: 100%;
    position: absolute;
    z-index: -1; }

section.s7 {
  position: relative; }
  section.s7 div.sideCode {
    right: -100px;
    left: unset;
    top: 50px; }
    section.s7 div.sideCode p {
      text-align: left; }
  section.s7 div.content {
    padding-bottom: 50px;
    position: relative; }
    section.s7 div.content div.cover-image {
      float: left;
      width: 35%;
      padding-bottom: 50%;
      margin-right: 20px;
      position: relative; }
      section.s7 div.content div.cover-image img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover; }

div.blue-bg {
  background: #0E2133;
  padding-bottom: 75px; }

section.s8 {
  margin-top: 100px;
  position: relative; }
  section.s8 div.sideCode {
    width: 300px;
    right: -50px;
    top: 200px; }
    section.s8 div.sideCode p {
      text-align: left; }
  section.s8 div.content {
    padding: 0;
    padding-top: 50px; }
    section.s8 div.content div.body-text h2, section.s8 div.content div.body-text p {
      color: white; }
    section.s8 div.content div.body-text p:last-child {
      margin-bottom: 0; }
    section.s8 div.content div.spacer {
      float: right;
      height: 100px; }
    section.s8 div.content div.card {
      float: right;
      clear: both;
      padding-left: 30px;
      width: 40%; }
      section.s8 div.content div.card p.caption {
        color: white; }

div.bar {
  margin-top: 50px;
  position: relative;
  z-index: 1; }
  div.bar div.content {
    padding: 50px 0; }
    div.bar div.content div.box {
      position: absolute;
      width: 80%;
      left: 0;
      top: 0;
      height: 100%;
      z-index: -1;
      background-color: #123058; }
    div.bar div.content h4 {
      z-index: 2;
      margin: 0; }

section.s9 {
  position: relative; }
  section.s9 div.side {
    position: absolute;
    left: 60px;
    top: 400px;
    width: 22%; }
    section.s9 div.side div.card {
      margin-left: 100px; }
      section.s9 div.side div.card p.caption {
        float: right; }
    section.s9 div.side div.button {
      clear: both;
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      height: 80px;
      background-color: #0E2133; }
      section.s9 div.side div.button h2 {
        display: inline-block;
        color: white;
        font-size: 18px;
        margin: auto;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        padding-left: 30px; }
      section.s9 div.side div.button div.arrow {
        display: inline-block;
        width: 20%;
        background: url(https://cdn.txamfoundation.com/Spirit/Spring-2019/Cover-Feature/arrow.svg) center no-repeat #123058;
        background-size: 110px 110px;
        -webkit-transition: all ease .5s;
        -o-transition: all ease .5s;
        transition: all ease .5s; }
        section.s9 div.side div.button div.arrow:hover {
          cursor: pointer;
          background-position: 0% 50%; }
  section.s9 div.content div.body-text div.topSpace {
    float: right;
    height: 0; }
  section.s9 div.content div.body-text div.bluebox {
    float: right;
    margin-right: 0;
    margin-left: 30px;
    margin-bottom: 30px;
    position: relative; }
    section.s9 div.content div.body-text div.bluebox div.top {
      height: 368px; }
      section.s9 div.content div.body-text div.bluebox div.top div.absolute {
        right: unset;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        padding: 70px 0 40px 80px; }
        section.s9 div.content div.body-text div.bluebox div.top div.absolute h2 {
          text-align: left; }
          section.s9 div.content div.body-text div.bluebox div.top div.absolute h2:before {
            left: -60px;
            width: 50px;
            height: 50px;
            background-size: 50px 50px; }
        section.s9 div.content div.body-text div.bluebox div.top div.absolute div.spacer {
          margin-right: 530px; }
    section.s9 div.content div.body-text div.bluebox div.bottom div.absolute {
      right: unset;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
      flex-direction: row-reverse;
      padding: 30px 0 27px 80px; }
      section.s9 div.content div.body-text div.bluebox div.bottom div.absolute h2 {
        text-align: left; }

@-webkit-keyframes glitch {
  0% {
    clip: rect(28px, 400px, 24px, 0px); }
  2.5% {
    clip: rect(1px, 400px, 25px, 0px); }
  5% {
    clip: rect(36px, 400px, 45px, 0px); }
  7.5% {
    clip: rect(19px, 400px, 20px, 0px); }
  10% {
    clip: rect(18px, 400px, 28px, 0px); }
  12.5% {
    clip: rect(39px, 400px, 35px, 0px); }
  15% {
    clip: rect(49px, 400px, 39px, 0px); }
  17.5% {
    clip: rect(18px, 400px, 13px, 0px); }
  20% {
    clip: rect(6px, 400px, 12px, 0px); }
  22.5% {
    clip: rect(30px, 400px, 21px, 0px); }
  25% {
    clip: rect(12px, 400px, 48px, 0px); }
  27.5% {
    clip: rect(11px, 400px, 40px, 0px); }
  30% {
    clip: rect(46px, 400px, 32px, 0px); }
  32.5% {
    clip: rect(10px, 400px, 40px, 0px); }
  35% {
    clip: rect(32px, 400px, 30px, 0px); }
  37.5% {
    clip: rect(22px, 400px, 21px, 0px); }
  40% {
    clip: rect(36px, 400px, 12px, 0px); }
  42.5% {
    clip: rect(32px, 400px, 19px, 0px); }
  45% {
    clip: rect(8px, 400px, 47px, 0px); }
  47.5% {
    clip: rect(26px, 400px, 27px, 0px); }
  50% {
    clip: rect(17px, 400px, 36px, 0px); }
  52.5% {
    clip: rect(39px, 400px, 48px, 0px); }
  55% {
    clip: rect(7px, 400px, 19px, 0px); }
  57.5% {
    clip: rect(42px, 400px, 11px, 0px); }
  60% {
    clip: rect(36px, 400px, 49px, 0px); }
  62.5% {
    clip: rect(39px, 400px, 31px, 0px); }
  65% {
    clip: rect(11px, 400px, 19px, 0px); }
  67.5% {
    clip: rect(32px, 400px, 40px, 0px); }
  70% {
    clip: rect(38px, 400px, 38px, 0px); }
  72.5% {
    clip: rect(3px, 400px, 11px, 0px); }
  75% {
    clip: rect(24px, 400px, 21px, 0px); }
  77.5% {
    clip: rect(38px, 400px, 34px, 0px); }
  80% {
    clip: rect(35px, 400px, 28px, 0px); }
  82.5% {
    clip: rect(46px, 400px, 46px, 0px); }
  85% {
    clip: rect(39px, 400px, 44px, 0px); }
  87.5% {
    clip: rect(8px, 400px, 42px, 0px); }
  90% {
    clip: rect(48px, 400px, 35px, 0px); }
  92.5% {
    clip: rect(15px, 400px, 50px, 0px); }
  95% {
    clip: rect(30px, 400px, 48px, 0px); }
  97.5% {
    clip: rect(30px, 400px, 45px, 0px); }
  100% {
    clip: rect(46px, 400px, 21px, 0px); } }

@keyframes glitch {
  0% {
    clip: rect(28px, 400px, 24px, 0px); }
  2.5% {
    clip: rect(1px, 400px, 25px, 0px); }
  5% {
    clip: rect(36px, 400px, 45px, 0px); }
  7.5% {
    clip: rect(19px, 400px, 20px, 0px); }
  10% {
    clip: rect(18px, 400px, 28px, 0px); }
  12.5% {
    clip: rect(39px, 400px, 35px, 0px); }
  15% {
    clip: rect(49px, 400px, 39px, 0px); }
  17.5% {
    clip: rect(18px, 400px, 13px, 0px); }
  20% {
    clip: rect(6px, 400px, 12px, 0px); }
  22.5% {
    clip: rect(30px, 400px, 21px, 0px); }
  25% {
    clip: rect(12px, 400px, 48px, 0px); }
  27.5% {
    clip: rect(11px, 400px, 40px, 0px); }
  30% {
    clip: rect(46px, 400px, 32px, 0px); }
  32.5% {
    clip: rect(10px, 400px, 40px, 0px); }
  35% {
    clip: rect(32px, 400px, 30px, 0px); }
  37.5% {
    clip: rect(22px, 400px, 21px, 0px); }
  40% {
    clip: rect(36px, 400px, 12px, 0px); }
  42.5% {
    clip: rect(32px, 400px, 19px, 0px); }
  45% {
    clip: rect(8px, 400px, 47px, 0px); }
  47.5% {
    clip: rect(26px, 400px, 27px, 0px); }
  50% {
    clip: rect(17px, 400px, 36px, 0px); }
  52.5% {
    clip: rect(39px, 400px, 48px, 0px); }
  55% {
    clip: rect(7px, 400px, 19px, 0px); }
  57.5% {
    clip: rect(42px, 400px, 11px, 0px); }
  60% {
    clip: rect(36px, 400px, 49px, 0px); }
  62.5% {
    clip: rect(39px, 400px, 31px, 0px); }
  65% {
    clip: rect(11px, 400px, 19px, 0px); }
  67.5% {
    clip: rect(32px, 400px, 40px, 0px); }
  70% {
    clip: rect(38px, 400px, 38px, 0px); }
  72.5% {
    clip: rect(3px, 400px, 11px, 0px); }
  75% {
    clip: rect(24px, 400px, 21px, 0px); }
  77.5% {
    clip: rect(38px, 400px, 34px, 0px); }
  80% {
    clip: rect(35px, 400px, 28px, 0px); }
  82.5% {
    clip: rect(46px, 400px, 46px, 0px); }
  85% {
    clip: rect(39px, 400px, 44px, 0px); }
  87.5% {
    clip: rect(8px, 400px, 42px, 0px); }
  90% {
    clip: rect(48px, 400px, 35px, 0px); }
  92.5% {
    clip: rect(15px, 400px, 50px, 0px); }
  95% {
    clip: rect(30px, 400px, 48px, 0px); }
  97.5% {
    clip: rect(30px, 400px, 45px, 0px); }
  100% {
    clip: rect(46px, 400px, 21px, 0px); } }

@-webkit-keyframes glitch-long {
  0% {
    clip: rect(41px, 700px, 39px, 0px); }
  2.5% {
    clip: rect(6px, 700px, 34px, 0px); }
  5% {
    clip: rect(27px, 700px, 12px, 0px); }
  7.5% {
    clip: rect(43px, 700px, 1px, 0px); }
  10% {
    clip: rect(34px, 700px, 32px, 0px); }
  12.5% {
    clip: rect(9px, 700px, 38px, 0px); }
  15% {
    clip: rect(42px, 700px, 48px, 0px); }
  17.5% {
    clip: rect(50px, 700px, 29px, 0px); }
  20% {
    clip: rect(21px, 700px, 2px, 0px); }
  22.5% {
    clip: rect(18px, 700px, 20px, 0px); }
  25% {
    clip: rect(38px, 700px, 7px, 0px); }
  27.5% {
    clip: rect(23px, 700px, 4px, 0px); }
  30% {
    clip: rect(2px, 700px, 48px, 0px); }
  32.5% {
    clip: rect(12px, 700px, 18px, 0px); }
  35% {
    clip: rect(17px, 700px, 12px, 0px); }
  37.5% {
    clip: rect(50px, 700px, 13px, 0px); }
  40% {
    clip: rect(25px, 700px, 44px, 0px); }
  42.5% {
    clip: rect(26px, 700px, 43px, 0px); }
  45% {
    clip: rect(9px, 700px, 23px, 0px); }
  47.5% {
    clip: rect(14px, 700px, 15px, 0px); }
  50% {
    clip: rect(26px, 700px, 47px, 0px); }
  52.5% {
    clip: rect(20px, 700px, 1px, 0px); }
  55% {
    clip: rect(43px, 700px, 17px, 0px); }
  57.5% {
    clip: rect(7px, 700px, 33px, 0px); }
  60% {
    clip: rect(37px, 700px, 48px, 0px); }
  62.5% {
    clip: rect(31px, 700px, 43px, 0px); }
  65% {
    clip: rect(35px, 700px, 24px, 0px); }
  67.5% {
    clip: rect(14px, 700px, 8px, 0px); }
  70% {
    clip: rect(30px, 700px, 14px, 0px); }
  72.5% {
    clip: rect(23px, 700px, 15px, 0px); }
  75% {
    clip: rect(17px, 700px, 7px, 0px); }
  77.5% {
    clip: rect(28px, 700px, 38px, 0px); }
  80% {
    clip: rect(17px, 700px, 50px, 0px); }
  82.5% {
    clip: rect(43px, 700px, 41px, 0px); }
  85% {
    clip: rect(36px, 700px, 21px, 0px); }
  87.5% {
    clip: rect(23px, 700px, 32px, 0px); }
  90% {
    clip: rect(34px, 700px, 5px, 0px); }
  92.5% {
    clip: rect(19px, 700px, 32px, 0px); }
  95% {
    clip: rect(13px, 700px, 26px, 0px); }
  97.5% {
    clip: rect(47px, 700px, 3px, 0px); }
  100% {
    clip: rect(18px, 700px, 6px, 0px); } }

@keyframes glitch-long {
  0% {
    clip: rect(41px, 700px, 39px, 0px); }
  2.5% {
    clip: rect(6px, 700px, 34px, 0px); }
  5% {
    clip: rect(27px, 700px, 12px, 0px); }
  7.5% {
    clip: rect(43px, 700px, 1px, 0px); }
  10% {
    clip: rect(34px, 700px, 32px, 0px); }
  12.5% {
    clip: rect(9px, 700px, 38px, 0px); }
  15% {
    clip: rect(42px, 700px, 48px, 0px); }
  17.5% {
    clip: rect(50px, 700px, 29px, 0px); }
  20% {
    clip: rect(21px, 700px, 2px, 0px); }
  22.5% {
    clip: rect(18px, 700px, 20px, 0px); }
  25% {
    clip: rect(38px, 700px, 7px, 0px); }
  27.5% {
    clip: rect(23px, 700px, 4px, 0px); }
  30% {
    clip: rect(2px, 700px, 48px, 0px); }
  32.5% {
    clip: rect(12px, 700px, 18px, 0px); }
  35% {
    clip: rect(17px, 700px, 12px, 0px); }
  37.5% {
    clip: rect(50px, 700px, 13px, 0px); }
  40% {
    clip: rect(25px, 700px, 44px, 0px); }
  42.5% {
    clip: rect(26px, 700px, 43px, 0px); }
  45% {
    clip: rect(9px, 700px, 23px, 0px); }
  47.5% {
    clip: rect(14px, 700px, 15px, 0px); }
  50% {
    clip: rect(26px, 700px, 47px, 0px); }
  52.5% {
    clip: rect(20px, 700px, 1px, 0px); }
  55% {
    clip: rect(43px, 700px, 17px, 0px); }
  57.5% {
    clip: rect(7px, 700px, 33px, 0px); }
  60% {
    clip: rect(37px, 700px, 48px, 0px); }
  62.5% {
    clip: rect(31px, 700px, 43px, 0px); }
  65% {
    clip: rect(35px, 700px, 24px, 0px); }
  67.5% {
    clip: rect(14px, 700px, 8px, 0px); }
  70% {
    clip: rect(30px, 700px, 14px, 0px); }
  72.5% {
    clip: rect(23px, 700px, 15px, 0px); }
  75% {
    clip: rect(17px, 700px, 7px, 0px); }
  77.5% {
    clip: rect(28px, 700px, 38px, 0px); }
  80% {
    clip: rect(17px, 700px, 50px, 0px); }
  82.5% {
    clip: rect(43px, 700px, 41px, 0px); }
  85% {
    clip: rect(36px, 700px, 21px, 0px); }
  87.5% {
    clip: rect(23px, 700px, 32px, 0px); }
  90% {
    clip: rect(34px, 700px, 5px, 0px); }
  92.5% {
    clip: rect(19px, 700px, 32px, 0px); }
  95% {
    clip: rect(13px, 700px, 26px, 0px); }
  97.5% {
    clip: rect(47px, 700px, 3px, 0px); }
  100% {
    clip: rect(18px, 700px, 6px, 0px); } }

@-webkit-keyframes glitch-title {
  33.33333% {
    clip: rect(48px, 700px, 58px, 0px); }
  36.66667% {
    clip: rect(66px, 700px, 28px, 0px); }
  40% {
    clip: rect(70px, 700px, 35px, 0px); }
  43.33333% {
    clip: rect(11px, 700px, 48px, 0px); }
  46.66667% {
    clip: rect(98px, 700px, 73px, 0px); }
  50% {
    clip: rect(29px, 700px, 21px, 0px); }
  53.33333% {
    clip: rect(100px, 700px, 33px, 0px); }
  56.66667% {
    clip: rect(31px, 700px, 93px, 0px); }
  60% {
    clip: rect(46px, 700px, 69px, 0px); }
  63.33333% {
    clip: rect(6px, 700px, 89px, 0px); }
  66.66667% {
    clip: rect(30px, 700px, 92px, 0px); }
  70% {
    clip: rect(75px, 700px, 8px, 0px); }
  73.33333% {
    clip: rect(7px, 700px, 31px, 0px); }
  76.66667% {
    clip: rect(26px, 700px, 57px, 0px); }
  80% {
    clip: rect(67px, 700px, 24px, 0px); }
  83.33333% {
    clip: rect(19px, 700px, 24px, 0px); }
  86.66667% {
    clip: rect(8px, 700px, 5px, 0px); }
  90% {
    clip: rect(92px, 700px, 81px, 0px); }
  93.33333% {
    clip: rect(65px, 700px, 12px, 0px); }
  96.66667% {
    clip: rect(12px, 700px, 49px, 0px); }
  100% {
    clip: rect(62px, 700px, 70px, 0px); } }

@keyframes glitch-title {
  33.33333% {
    clip: rect(48px, 700px, 58px, 0px); }
  36.66667% {
    clip: rect(66px, 700px, 28px, 0px); }
  40% {
    clip: rect(70px, 700px, 35px, 0px); }
  43.33333% {
    clip: rect(11px, 700px, 48px, 0px); }
  46.66667% {
    clip: rect(98px, 700px, 73px, 0px); }
  50% {
    clip: rect(29px, 700px, 21px, 0px); }
  53.33333% {
    clip: rect(100px, 700px, 33px, 0px); }
  56.66667% {
    clip: rect(31px, 700px, 93px, 0px); }
  60% {
    clip: rect(46px, 700px, 69px, 0px); }
  63.33333% {
    clip: rect(6px, 700px, 89px, 0px); }
  66.66667% {
    clip: rect(30px, 700px, 92px, 0px); }
  70% {
    clip: rect(75px, 700px, 8px, 0px); }
  73.33333% {
    clip: rect(7px, 700px, 31px, 0px); }
  76.66667% {
    clip: rect(26px, 700px, 57px, 0px); }
  80% {
    clip: rect(67px, 700px, 24px, 0px); }
  83.33333% {
    clip: rect(19px, 700px, 24px, 0px); }
  86.66667% {
    clip: rect(8px, 700px, 5px, 0px); }
  90% {
    clip: rect(92px, 700px, 81px, 0px); }
  93.33333% {
    clip: rect(65px, 700px, 12px, 0px); }
  96.66667% {
    clip: rect(12px, 700px, 49px, 0px); }
  100% {
    clip: rect(62px, 700px, 70px, 0px); } }

@-webkit-keyframes steve {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -720px 0px; } }

@keyframes steve {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -720px 0px; } }

@-webkit-keyframes daniel {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -2880px 0px; } }

@keyframes daniel {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -2880px 0px; } }

@-webkit-keyframes aggieAnswer {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -1440px 0px; } }

@keyframes aggieAnswer {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -1440px 0px; } }

@-webkit-keyframes andrew {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -1440px 0px; } }

@keyframes andrew {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -1440px 0px; } }

@-webkit-keyframes blueBar1 {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -1440px 0px; } }

@keyframes blueBar1 {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -1440px 0px; } }

@-webkit-keyframes bb2 {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -1440px 0px; } }

@keyframes bb2 {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -1440px 0px; } }

@-webkit-keyframes quote {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -1440px 0px; } }

@keyframes quote {
  0% {
    background-position: 0px 0px; }
  100% {
    background-position: -1440px 0px; } }

.mobile {
  display: none; }

/* min 1700 */
/* --------------------------------------------------------------- */
/* 1700 */
/* --------------------------------------------------------------- */
@media only screen and (max-width: 1700px) {
  .content {
    margin: 0 18%; }
  section.s1 div.title {
    padding-left: 10%; }
  section.s4 div.content div.flex div.left {
    margin-top: 40px; }
  section.s5 div.content div.topspace {
    height: 280px; }
  section.s7 div.content div.cover-image {
    padding-bottom: 47%; }
  section.s8 div.content div.wrap div.topSpace {
    height: 59px; }
  section.s8 div.content div.wrap div.card {
    width: 40%;
    margin: 0;
    margin: 20px;
    margin-right: 0; }
  div.bar div.content h4:before {
    right: 16%;
    top: -62px; }
  section.s9 div.side {
    left: 15px;
    width: 20%; }
  section.s9 div.side div.button h2 {
    padding-left: 15px;
    font-size: 14px; }
  section.s9 div.side div.button div.arrow:hover {
    background-position: 35% 50%; } }

/* --------------------------------------------------------------- */
/* 1500 */
/* --------------------------------------------------------------- */
@media only screen and (max-width: 1500px) {
  div.glitch.h1 {
    font-size: 60px; }
  h2.self, h2.lite {
    font-size: 20px; }
  .content {
    padding: 50px 0;
    margin: 0 10%; }
  div.bar div.content {
    padding: 30px 0; }
  section.s1 div.title {
    padding-left: 8%; }
  section.s2 div.sideCode {
    left: -160px; }
  section.s3 div.content div.card img.line {
    width: 60%;
    bottom: -84px;
    right: -60px; }
  section.s3 div.sideCode {
    right: -220px; }
  section.s4 div.content div.right {
    width: 43%; }
  section.s4 div.content div.right img.lines {
    bottom: -86px; }
  section.s4 div.sideCode {
    left: -211px; }
  div.bluebox {
    width: 300px; }
    div.bluebox div.top {
      height: 240px; }
  div.bluebox div.top div.absolute h2 {
    font-size: 25px; }
  div.bluebox div.top div.absolute h2:before {
    width: 40px;
    height: 40px;
    background-size: 40px;
    left: 0; }
  section.s6 div.content {
    padding: 30px 0; }
  section.s6 div.content div.body-text {
    padding-right: 189px; }
    section.s6 div.content div.body-text h4 {
      margin-bottom: 0;
      line-height: 1.5; }
  section.s7 div.sideCode {
    right: -170px; }
  div.bluebar div.content {
    padding: 30px 0; }
  div.bluebar h4 {
    margin: 0; }
    div.bluebar h4:before {
      width: 90%; }
    div.bluebar h4:after {
      left: 4%; }
  section.s8 div.sideCode {
    right: -150px; }
  section.s8 div.content div.wrap div.card:before {
    right: -65px; }
  div.bar div.content div.box {
    width: 90%; }
  div.bar div.content h4:before {
    right: 7%; }
  section.s9 div.content div.spacer {
    height: 280px;
    float: left; }
  section.s9 div.side {
    display: none; }
    section.s9 div.side.mobile {
      clear: both;
      display: block;
      position: relative;
      left: unset;
      top: unset;
      width: 32%;
      float: left;
      margin-right: 30px; }
      section.s9 div.side.mobile div.card {
        margin-left: 0; }
  section.s9 div.content div.body-text div.bluebox div.top div.absolute div.spacer {
    margin-right: 620px; }
  div.bluebox div.bottom div.absolute div.spacer {
    height: 0; }
  section.s9 div.content div.body-text div.bluebox div.top {
    height: 350px; }
  section.s9 div.content div.body-text div.bluebox:before {
    right: -140px;
    bottom: -76px; }
  section.full div.container div.sideCode {
    left: -150px; }
  section.full div.container div.content div.body-text div.card {
    width: 40%; }
  div.lines.s3-daniel {
    -webkit-transform: scale(12);
    -ms-transform: scale(12);
    transform: scale(12); }
  div.lines.aggie-answer {
    bottom: -8px;
    right: 40px; }
  div.lines.bb1 {
    -webkit-transform: translateY(-50%) scale(10);
    -ms-transform: translateY(-50%) scale(10);
    transform: translateY(-50%) scale(10);
    left: 10%; }
  div.lines.bb2 {
    right: 10%;
    -webkit-transform: translateY(-50%) scale(9);
    -ms-transform: translateY(-50%) scale(9);
    transform: translateY(-50%) scale(9); } }

/* --------------------------------------------------------------- */
/* 1200 */
/* --------------------------------------------------------------- */
@media only screen and (max-width: 1200px) {
  @-webkit-keyframes glitch-long {
    0% {
      clip: rect(20px, 650px, 43px, 0px); }
    2.5% {
      clip: rect(47px, 650px, 3px, 0px); }
    5% {
      clip: rect(28px, 650px, 35px, 0px); }
    7.5% {
      clip: rect(34px, 650px, 41px, 0px); }
    10% {
      clip: rect(29px, 650px, 31px, 0px); }
    12.5% {
      clip: rect(30px, 650px, 19px, 0px); }
    15% {
      clip: rect(35px, 650px, 25px, 0px); }
    17.5% {
      clip: rect(1px, 650px, 49px, 0px); }
    20% {
      clip: rect(40px, 650px, 42px, 0px); }
    22.5% {
      clip: rect(23px, 650px, 28px, 0px); }
    25% {
      clip: rect(43px, 650px, 39px, 0px); }
    27.5% {
      clip: rect(9px, 650px, 29px, 0px); }
    30% {
      clip: rect(33px, 650px, 16px, 0px); }
    32.5% {
      clip: rect(11px, 650px, 21px, 0px); }
    35% {
      clip: rect(10px, 650px, 31px, 0px); }
    37.5% {
      clip: rect(26px, 650px, 23px, 0px); }
    40% {
      clip: rect(6px, 650px, 4px, 0px); }
    42.5% {
      clip: rect(38px, 650px, 8px, 0px); }
    45% {
      clip: rect(21px, 650px, 20px, 0px); }
    47.5% {
      clip: rect(3px, 650px, 1px, 0px); }
    50% {
      clip: rect(23px, 650px, 27px, 0px); }
    52.5% {
      clip: rect(11px, 650px, 20px, 0px); }
    55% {
      clip: rect(33px, 650px, 43px, 0px); }
    57.5% {
      clip: rect(49px, 650px, 15px, 0px); }
    60% {
      clip: rect(5px, 650px, 44px, 0px); }
    62.5% {
      clip: rect(2px, 650px, 10px, 0px); }
    65% {
      clip: rect(31px, 650px, 32px, 0px); }
    67.5% {
      clip: rect(31px, 650px, 17px, 0px); }
    70% {
      clip: rect(38px, 650px, 7px, 0px); }
    72.5% {
      clip: rect(19px, 650px, 25px, 0px); }
    75% {
      clip: rect(16px, 650px, 50px, 0px); }
    77.5% {
      clip: rect(33px, 650px, 1px, 0px); }
    80% {
      clip: rect(41px, 650px, 27px, 0px); }
    82.5% {
      clip: rect(48px, 650px, 28px, 0px); }
    85% {
      clip: rect(3px, 650px, 38px, 0px); }
    87.5% {
      clip: rect(34px, 650px, 38px, 0px); }
    90% {
      clip: rect(24px, 650px, 18px, 0px); }
    92.5% {
      clip: rect(4px, 650px, 9px, 0px); }
    95% {
      clip: rect(42px, 650px, 33px, 0px); }
    97.5% {
      clip: rect(3px, 650px, 25px, 0px); }
    100% {
      clip: rect(40px, 650px, 13px, 0px); } }
  @keyframes glitch-long {
    0% {
      clip: rect(20px, 650px, 43px, 0px); }
    2.5% {
      clip: rect(47px, 650px, 3px, 0px); }
    5% {
      clip: rect(28px, 650px, 35px, 0px); }
    7.5% {
      clip: rect(34px, 650px, 41px, 0px); }
    10% {
      clip: rect(29px, 650px, 31px, 0px); }
    12.5% {
      clip: rect(30px, 650px, 19px, 0px); }
    15% {
      clip: rect(35px, 650px, 25px, 0px); }
    17.5% {
      clip: rect(1px, 650px, 49px, 0px); }
    20% {
      clip: rect(40px, 650px, 42px, 0px); }
    22.5% {
      clip: rect(23px, 650px, 28px, 0px); }
    25% {
      clip: rect(43px, 650px, 39px, 0px); }
    27.5% {
      clip: rect(9px, 650px, 29px, 0px); }
    30% {
      clip: rect(33px, 650px, 16px, 0px); }
    32.5% {
      clip: rect(11px, 650px, 21px, 0px); }
    35% {
      clip: rect(10px, 650px, 31px, 0px); }
    37.5% {
      clip: rect(26px, 650px, 23px, 0px); }
    40% {
      clip: rect(6px, 650px, 4px, 0px); }
    42.5% {
      clip: rect(38px, 650px, 8px, 0px); }
    45% {
      clip: rect(21px, 650px, 20px, 0px); }
    47.5% {
      clip: rect(3px, 650px, 1px, 0px); }
    50% {
      clip: rect(23px, 650px, 27px, 0px); }
    52.5% {
      clip: rect(11px, 650px, 20px, 0px); }
    55% {
      clip: rect(33px, 650px, 43px, 0px); }
    57.5% {
      clip: rect(49px, 650px, 15px, 0px); }
    60% {
      clip: rect(5px, 650px, 44px, 0px); }
    62.5% {
      clip: rect(2px, 650px, 10px, 0px); }
    65% {
      clip: rect(31px, 650px, 32px, 0px); }
    67.5% {
      clip: rect(31px, 650px, 17px, 0px); }
    70% {
      clip: rect(38px, 650px, 7px, 0px); }
    72.5% {
      clip: rect(19px, 650px, 25px, 0px); }
    75% {
      clip: rect(16px, 650px, 50px, 0px); }
    77.5% {
      clip: rect(33px, 650px, 1px, 0px); }
    80% {
      clip: rect(41px, 650px, 27px, 0px); }
    82.5% {
      clip: rect(48px, 650px, 28px, 0px); }
    85% {
      clip: rect(3px, 650px, 38px, 0px); }
    87.5% {
      clip: rect(34px, 650px, 38px, 0px); }
    90% {
      clip: rect(24px, 650px, 18px, 0px); }
    92.5% {
      clip: rect(4px, 650px, 9px, 0px); }
    95% {
      clip: rect(42px, 650px, 33px, 0px); }
    97.5% {
      clip: rect(3px, 650px, 25px, 0px); }
    100% {
      clip: rect(40px, 650px, 13px, 0px); } }
  .glitch.play-right:before {
    left: 40%; }
  .glitch.play-right:after {
    left: 39%; }
  h1.self, div.glitch.h1 {
    font-size: 50px; }
  h2.self {
    font-style: 18px; }
  div.content {
    margin: 0; }
  div.body-text {
    padding: 0 15%; }
  section.s2 div.sideCode {
    left: -200px; }
  section.s3 div.content div.card {
    margin-right: 10%;
    width: 30%; }
  section.s3 div.content div.bottom div.image-box {
    margin-left: 10%;
    width: 30%; }
  section.s3 div.content div.bottom div.image-box img.line {
    top: -100px;
    left: -40px; }
  section.s3 div.content div.card img.line {
    width: 75%;
    bottom: -63px;
    right: -60px; }
  section.s3 div.sideCode {
    right: -280px; }
  section.s4 div.sideCode {
    left: -240px; }
  section.s4 div.content div.right {
    width: 31%;
    margin-right: 10%; }
    section.s4 div.content div.right img.lines {
      bottom: -54px; }
  div.bluebox {
    width: 300px; }
  section.s5 div.content div.card {
    width: 30%;
    margin-right: 10%; }
  section.s5 div.content div.topspace {
    height: 430px; }
  section.s5 div.sideCode {
    right: -160px; }
  section.s6 div.content div.body-text h4 {
    font-size: 18px; }
  section.s6 div.content div.body-text h4:before {
    width: 90%; }
  section.s7 div.sideCode {
    right: -240px; }
  section.s7 div.content div.cover-image {
    margin-left: 10%; }
  section.s8 div.sideCode {
    right: -211px; }
  section.s8 div.content div.card {
    margin-right: 10%; }
  section.s9 div.side.mobile {
    margin-left: 10%; }
  section.s9 div.content div.body-text div.bluebox:before {
    bottom: -66px; }
  section.s9 div.content div.body-text div.bluebox div.top div.absolute div.spacer {
    margin-right: 690px; }
  section.s9 div.content div.body-text div.bluebox div.top {
    height: 370px; }
  section.full div.container div.content {
    width: 700px; }
  section.full div.container div.content div.body-text h2 {
    width: 87%; }
  section.full div.container div.content div.body-text div.close {
    top: -10px; }
  section.full div.container div.sideCode#two {
    right: -210px; } }

/* --------------------------------------------------------------- */
/* 992 */
/* --------------------------------------------------------------- */
@media only screen and (max-width: 992px) {
  div.sideCode {
    display: none; }
  .dropCap {
    width: 50px;
    height: 50px; }
  h2.self, h2.lite {
    font-size: 18px; }
  section.s1 {
    overflow: hidden; }
    section.s1 img {
      left: 113px;
      -webkit-transform: scale(1.35);
      -ms-transform: scale(1.35);
      transform: scale(1.35); }
  div.body-text {
    padding: 0 30px; }
  section.s3 div.content div.card {
    margin-right: 30px; }
  section.s3 div.content div.card img.line {
    bottom: -33px;
    right: -40px; }
  section.s3 div.content div.bottom div.image-box {
    margin-left: 30px;
    margin-bottom: 20px; }
  section.s4 div.content div.right {
    width: 34%;
    margin-right: 30px; }
  section.s5 div.content div.card {
    margin-right: 30px; }
  div.bluebox div.top {
    height: 177px; }
  div.bluebox div.top div.absolute {
    padding: 60px 30px 30px 0; }
  div.bluebox div.top div.absolute h2 {
    font-size: 18px; }
  div.bluebox div.top div.absolute h2:before {
    width: 30px;
    height: 30px;
    background-size: 30px; }
  div.bluebox div.top div.absolute div.spacer {
    margin-right: 746px; }
  section.s6 div.content div.body-text {
    padding-right: 30px; }
  div.bluebar h4:after {
    top: -100px; }
  section.s6 div.content div.body-text h4:before, div.bluebar h4:before, div.bar div.content div.box {
    width: 100%; }
  section.s7 div.content div.cover-image {
    margin-left: 30px; }
  section.s8 div.content div.card {
    margin-right: 30px; }
  section.s8 div.content div.wrap div.card:before {
    width: 31%;
    height: 100%;
    top: 0; }
  div.bar div.content h4:before {
    height: 220px; }
  section.s9 div.side.mobile {
    margin-left: 30px;
    width: 40%; }
  section.s9 div.content div.body-text div.bluebox div.top div.absolute div.spacer {
    margin-right: 760px; }
  section.s9 div.content div.body-text div.bluebox div.top div.absolute {
    padding-left: 60px;
    padding-bottom: 30px; }
  section.s9 div.content div.body-text div.bluebox div.top div.absolute h2:before {
    width: 40px;
    height: 40px;
    background-size: 40px;
    left: -50px; }
  section.s9 div.content div.body-text div.bluebox div.top {
    height: 270px; }
  section.s9 div.content div.spacer {
    height: 0; }
  section.s9 div.content div.body-text div.bluebox div.bottom div.absolute {
    padding-left: 60px; }
  section.s9 div.content div.body-text div.bluebox:before {
    bottom: -38px;
    right: -20px; }
  section.full div.container div.content {
    width: calc(100% - 60px); }
  section.full div.container div.content div.body-text div.close {
    right: 0; }
  div.lines.s3-daniel {
    left: -30px; }
  div.lines.aggie-answer {
    bottom: 32px; }
  div.lines.andrew {
    -webkit-transform: scale(8);
    -ms-transform: scale(8);
    transform: scale(8);
    right: 50px; }
  div.lines.quote.play {
    left: 180px;
    bottom: 50px;
    -webkit-transform: scale(10);
    -ms-transform: scale(10);
    transform: scale(10); } }

/* --------------------------------------------------------------- */
/* 768 */
/* --------------------------------------------------------------- */
@media only screen and (max-width: 768px) {
  @-webkit-keyframes glitchsm {
    0% {
      clip: rect(6px, 250px, 12px, 0px); }
    2.5% {
      clip: rect(17px, 250px, 25px, 0px); }
    5% {
      clip: rect(42px, 250px, 35px, 0px); }
    7.5% {
      clip: rect(40px, 250px, 22px, 0px); }
    10% {
      clip: rect(15px, 250px, 24px, 0px); }
    12.5% {
      clip: rect(44px, 250px, 23px, 0px); }
    15% {
      clip: rect(18px, 250px, 40px, 0px); }
    17.5% {
      clip: rect(2px, 250px, 7px, 0px); }
    20% {
      clip: rect(21px, 250px, 34px, 0px); }
    22.5% {
      clip: rect(7px, 250px, 5px, 0px); }
    25% {
      clip: rect(37px, 250px, 20px, 0px); }
    27.5% {
      clip: rect(25px, 250px, 22px, 0px); }
    30% {
      clip: rect(17px, 250px, 4px, 0px); }
    32.5% {
      clip: rect(19px, 250px, 43px, 0px); }
    35% {
      clip: rect(26px, 250px, 28px, 0px); }
    37.5% {
      clip: rect(45px, 250px, 23px, 0px); }
    40% {
      clip: rect(33px, 250px, 2px, 0px); }
    42.5% {
      clip: rect(7px, 250px, 34px, 0px); }
    45% {
      clip: rect(1px, 250px, 6px, 0px); }
    47.5% {
      clip: rect(31px, 250px, 13px, 0px); }
    50% {
      clip: rect(41px, 250px, 41px, 0px); }
    52.5% {
      clip: rect(29px, 250px, 12px, 0px); }
    55% {
      clip: rect(45px, 250px, 34px, 0px); }
    57.5% {
      clip: rect(33px, 250px, 33px, 0px); }
    60% {
      clip: rect(19px, 250px, 1px, 0px); }
    62.5% {
      clip: rect(14px, 250px, 2px, 0px); }
    65% {
      clip: rect(20px, 250px, 13px, 0px); }
    67.5% {
      clip: rect(29px, 250px, 20px, 0px); }
    70% {
      clip: rect(30px, 250px, 32px, 0px); }
    72.5% {
      clip: rect(38px, 250px, 31px, 0px); }
    75% {
      clip: rect(4px, 250px, 4px, 0px); }
    77.5% {
      clip: rect(10px, 250px, 33px, 0px); }
    80% {
      clip: rect(11px, 250px, 16px, 0px); }
    82.5% {
      clip: rect(34px, 250px, 4px, 0px); }
    85% {
      clip: rect(8px, 250px, 15px, 0px); }
    87.5% {
      clip: rect(7px, 250px, 49px, 0px); }
    90% {
      clip: rect(35px, 250px, 17px, 0px); }
    92.5% {
      clip: rect(16px, 250px, 9px, 0px); }
    95% {
      clip: rect(32px, 250px, 33px, 0px); }
    97.5% {
      clip: rect(3px, 250px, 1px, 0px); }
    100% {
      clip: rect(2px, 250px, 43px, 0px); } }
  @keyframes glitchsm {
    0% {
      clip: rect(6px, 250px, 12px, 0px); }
    2.5% {
      clip: rect(17px, 250px, 25px, 0px); }
    5% {
      clip: rect(42px, 250px, 35px, 0px); }
    7.5% {
      clip: rect(40px, 250px, 22px, 0px); }
    10% {
      clip: rect(15px, 250px, 24px, 0px); }
    12.5% {
      clip: rect(44px, 250px, 23px, 0px); }
    15% {
      clip: rect(18px, 250px, 40px, 0px); }
    17.5% {
      clip: rect(2px, 250px, 7px, 0px); }
    20% {
      clip: rect(21px, 250px, 34px, 0px); }
    22.5% {
      clip: rect(7px, 250px, 5px, 0px); }
    25% {
      clip: rect(37px, 250px, 20px, 0px); }
    27.5% {
      clip: rect(25px, 250px, 22px, 0px); }
    30% {
      clip: rect(17px, 250px, 4px, 0px); }
    32.5% {
      clip: rect(19px, 250px, 43px, 0px); }
    35% {
      clip: rect(26px, 250px, 28px, 0px); }
    37.5% {
      clip: rect(45px, 250px, 23px, 0px); }
    40% {
      clip: rect(33px, 250px, 2px, 0px); }
    42.5% {
      clip: rect(7px, 250px, 34px, 0px); }
    45% {
      clip: rect(1px, 250px, 6px, 0px); }
    47.5% {
      clip: rect(31px, 250px, 13px, 0px); }
    50% {
      clip: rect(41px, 250px, 41px, 0px); }
    52.5% {
      clip: rect(29px, 250px, 12px, 0px); }
    55% {
      clip: rect(45px, 250px, 34px, 0px); }
    57.5% {
      clip: rect(33px, 250px, 33px, 0px); }
    60% {
      clip: rect(19px, 250px, 1px, 0px); }
    62.5% {
      clip: rect(14px, 250px, 2px, 0px); }
    65% {
      clip: rect(20px, 250px, 13px, 0px); }
    67.5% {
      clip: rect(29px, 250px, 20px, 0px); }
    70% {
      clip: rect(30px, 250px, 32px, 0px); }
    72.5% {
      clip: rect(38px, 250px, 31px, 0px); }
    75% {
      clip: rect(4px, 250px, 4px, 0px); }
    77.5% {
      clip: rect(10px, 250px, 33px, 0px); }
    80% {
      clip: rect(11px, 250px, 16px, 0px); }
    82.5% {
      clip: rect(34px, 250px, 4px, 0px); }
    85% {
      clip: rect(8px, 250px, 15px, 0px); }
    87.5% {
      clip: rect(7px, 250px, 49px, 0px); }
    90% {
      clip: rect(35px, 250px, 17px, 0px); }
    92.5% {
      clip: rect(16px, 250px, 9px, 0px); }
    95% {
      clip: rect(32px, 250px, 33px, 0px); }
    97.5% {
      clip: rect(3px, 250px, 1px, 0px); }
    100% {
      clip: rect(2px, 250px, 43px, 0px); } }
  .glitch.play-short#root:before {
    -webkit-animation: glitchsm 1s linear;
    animation: glitchsm 1s linear;
    -webkit-animation-delay: 1s;
    animation-delay: 1s; }
  .glitch.play-short#root:after {
    -webkit-animation: glitchsm 3s linear;
    animation: glitchsm 3s linear;
    -webkit-animation-delay: 1s;
    animation-delay: 1s; }
  .glitch.play-right:before {
    left: 46%; }
  .glitch.play-right:after {
    left: 43%; }
  h1.self, div.glitch.h1 {
    font-size: 40px; }
  h2.title, div.title {
    font-size: 35px; }
  section.s1 div.title {
    padding: 30px; }
  section.s3 div.content div.card, section.s3 div.content div.bottom div.image-box {
    width: 35%;
    margin-bottom: 0; }
  section.s4 div.content {
    -webkit-transform: unset;
    -ms-transform: unset;
    transform: unset;
    padding: 50px 0; }
  section.s4 div.content div.body-text {
    padding: 0 30px; }
  section.s4 div.content div.right {
    display: none; }
  section.s4 div.content div.right.mobile {
    display: block;
    float: unset;
    width: calc(100%);
    margin: auto;
    padding: 0; }
    section.s4 div.content div.right.mobile img.lines {
      display: none; }
  section.s5 div.content div.card {
    width: 40%; }
  section.s5 div.content div.topspace {
    height: 620px; }
  section.s5 div.content img.lines {
    bottom: -40px;
    top: unset;
    right: 0; }
  section.s7 div.content div.cover-image {
    padding-bottom: 54%;
    width: 40%; }
  section.s8 div.content div.wrap div.card {
    width: 45%; }
  section.s9 div.side.mobile {
    width: 52%; }
  section.full div.container div.content div.body-text h2 {
    font-size: 32px; }
  div.lines.s3-steve {
    bottom: 30px; } }

/* --------------------------------------------------------------- */
/* 640 */
/* --------------------------------------------------------------- */
@media only screen and (max-width: 640px) {
  .mobile {
    display: block; }
  .image-break {
    padding-bottom: 50%; }
  .glitch.play-right:before {
    left: -4px; }
  .glitch.play-right:after {
    left: 5px; }
  h2.title, div.title {
    font-size: 30px; }
  section.full div.container div.content {
    width: calc(100% - 30px); }
  section.full div.container div.content div.body-text div.topSpace {
    display: none; }
  section.full div.container div.content div.body-text div.card {
    float: unset !important;
    width: 50%;
    margin: auto; }
  section.full div.container div.content div.body-text h2 {
    width: 80%; }
  section.s1 img {
    -webkit-transform: scale(1.55);
    -ms-transform: scale(1.55);
    transform: scale(1.55); }
  section.s1 div.title {
    padding: 15px; }
  div.body-text {
    padding: 0 15px; }
  section.s3 div.content div.card, section.s3 div.content div.bottom div.image-box {
    display: none; }
    section.s3 div.content div.card.mobile, section.s3 div.content div.bottom div.image-box.mobile {
      display: block;
      float: unset;
      width: 50%;
      margin: auto;
      padding: 0; }
      section.s3 div.content div.card.mobile p.caption, section.s3 div.content div.bottom div.image-box.mobile p.caption {
        float: unset; }
      section.s3 div.content div.card.mobile img.line, section.s3 div.content div.bottom div.image-box.mobile img.line {
        bottom: -13px; }
  section.s3 div.content div.bottom div.body-text {
    padding-top: 0; }
  section.s3 div.content div.bottom div.image-box img.line {
    top: -10px; }
  section.s4 div.content div.right, section.s4 div.content div.topspacer {
    display: none; }
  div.bluebox {
    display: none; }
  section.s5 div.content div.card, section.s5 div.content div.topspace {
    display: none; }
  section.s5 div.content div.card.mobile {
    display: block;
    float: unset;
    width: 50%;
    margin: auto;
    padding: 0; }
  section.s6 div.content div.body-text h4 {
    width: 87%; }
  section.s7 div.content div.cover-image {
    display: none; }
    section.s7 div.content div.cover-image.mobile {
      display: block;
      width: 50%;
      margin: auto;
      float: unset;
      padding-bottom: 66%;
      margin-bottom: 14px; }
  div.bluebar h4 {
    width: 80%; }
  section.s8 div.content div.spacer {
    height: 0; }
  section.s8 div.content div.card {
    width: 50%;
    margin: auto;
    float: unset;
    padding: 0;
    margin-top: 16px; }
  section.s8 div.content div.wrap div.card.mobile {
    display: block; }
  section.s9 div.side.mobile {
    margin: auto;
    width: 69%;
    float: unset; }
  div.lines.s3-steve {
    -webkit-transform: scale(8);
    -ms-transform: scale(8);
    transform: scale(8); }
  div.lines.s3-daniel {
    -webkit-transform: scale(10);
    -ms-transform: scale(10);
    transform: scale(10);
    top: 50px; }
  div.lines.bb1.play, div.lines.bb2.play {
    display: none; } }

/* --------------------------------------------------------------- */
/* 500 */
/* --------------------------------------------------------------- */
@media only screen and (max-width: 500px) {
  h1.self, div.glitch.h1 {
    font-size: 30px; }
  h2.title, div.title {
    font-size: 22px; }
  p.caption {
    margin-top: 5px; }
  section.full div.container div.content div.body-text h2 {
    width: 354px;
    clear: both; }
  section.full div.container div.content div.body-text div.close {
    position: relative;
    float: right; }
  section.s1 {
    padding-bottom: 80%; }
    section.s1 img {
      left: unset;
      -webkit-transform: unset;
      -ms-transform: unset;
      transform: unset; }
  section.s8 div.content div.card {
    width: calc(100% - 30px); }
  section.s9 div.side.mobile {
    width: calc(100% - 30px); }
  div.bluebox-mobile {
    width: 100%; }
    div.bluebox-mobile h2 {
      padding: 15px; }
  div.lines.andrew.play {
    bottom: 105px; }
  div.bar div.content h4 {
    width: 80%; } }

/* --------------------------------------------------------------- */
/* 400 */
/* --------------------------------------------------------------- */
@media only screen and (max-width: 400px) {
  section.full div.container div.content div.body-text h2 {
    width: 100%;
    clear: both; }
  h2.self, h2.lite {
    font-size: 14px; } }

/* --------------------------------------------------------------- */