/* logo */
.logo {
  height: 100px;
  width: 100px;
}


/* Flexbox Styles */
    .page {
      width: 100%;
      height: 100%;
      position:relative;
    }

    .page-inner {
      display: flex;
      height: 100vh;
    }

    .right-side {
      width: 60%;
      overflow-y: scroll;
      padding: 2rem;
      box-sizing: border-box;
    }

    .left-side {
      width: 40%;
      overflow-y: scroll;
      padding: 2rem;
      box-sizing: border-box;
    }

    /* hide scroll bar */
    ::-webkit-scrollbar {
        width: 0px;  /* Remove scrollbar space */
        background: transparent;  /* Optional: just make scrollbar invisible */
    }
    /* Optional: show position indicator in red */
    ::-webkit-scrollbar-thumb {
        background: #FF0000;
    }

    /* hide mobile button */
    .mobile-button {
      display: none;
    }

/* Lightbox & IMG sytles */

    .work {
      width: 100%;
      height: 100%;
    }


      .flex-wrapper {
        display: flex;
        flex-direction: row;
      }

        .width50 {
          width: 100%;
          text-align: center;
        }

/* TYPOGRAPHY / LIST STYLES */

  p {
    text-transform: uppercase;
    font-family: "open-sans-bold" , sans-serif;
    font-weight: bold;
    font-size: 14px;
  }

    body {
      font-family: "open-sans", sans-serif;
    }

    h1,
    h2 {
      font-family: "eurostile-extended" , sans-serif;
      text-transform: uppercase;
    }

    .intro-text {
      /*font-family: "eurostile-extended" , sans-serif; */
      font-family: "open-sans-bold", sans-serif;
      font-weight: bold;
      padding-bottom: 30px;
      text-transform: none !important;
      line-height: 35px;
    }

    span.email{
      color: #f70000;
    }

    span.email:hover {
      text-decoration: underline;
    }

    .h2-title {
      padding-bottom: 15px;
    }

    h3 {
      font-family: "open-sans-bold", sans-serif;
      font-weight: bold;
      text-transform: uppercase;
    }

    .sub-title {
        padding-left: 40px;
    }

    li{
      list-style: none;
    }

    li.date {
      margin-top: 20px;
      font-family: "open-sans" !important;
    }

    li.title {
      font-family: "open-sans-bold" , sans-serif;
      font-weight: bold;
    }

    li.indent {
      font-family: "open-sans-bold" , sans-serif;
      font-weight: bold;
      margin-bottom: 8px;
      padding-left: 20px;
    }

    li.indent:hover {
      background-color: #f70000;
    }

    a {
      text-decoration: none;
      text-transform: uppercase;
      font-family: "open-sans-bold" , sans-serif;
      font-weight: bold;
      color: #000;
    }

    a:hover {
      color: #f70000;
      text-decoration: underline;
    }

    .desktop-links {
      font-size: 20px;
      padding-bottom: 15px;
    }

/* section spacing */
    .links {
      margin-bottom: 35px;
    }

    .info-blocks {
      margin-bottom: 35px;
    }

/* Responsive Styles */
        /* Laptops */
      @media screen and (max-width: 1200px) {

          /* typography */

          .intro-text {
            font-size: 1.2rem;
          }

      }

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

        .page-inner {
          flex-direction: column;
        }

        .left-side {
          width: 100%;
          overflow-y: visible;
          padding-bottom: 0px;
        }

        .right-side {
          width: 100%;
          overflow-y: visible;
        }

        .mobile-button {
          display: block;
          text-align: center;
          padding: 10px 20px;
          background-color: #000;
          color: #fff;
        }

        li.mobile-links {
          padding-bottom: 15px;

        }

        ul.mobile-ul {
          margin-bottom: 0px;
        }

      }