body,
  html {
      margin: 0;
      padding: 0;
      height: 100%;
      overflow: hidden;
      font-family: League Spartan, Arial, Helvetica, sans-serif;
      font-weight: 400;
      font-size: 16px;
      color: #444;
      background-color: #fcfcfc;

  }

  #header {
      width: 100%;
      height: 60px;
      display: flex;
      flex-grow: 1;
      align-items: center;
      padding: 10px;
  }

  #header a {
      text-decoration: none;
      color: #000;
      font-size: 24px;
      margin-right: 20px;
  }

  #header a,
  #header a:active {
      text-decoration: none;
  }

  #header a:visited {
      text-decoration: none;
  }

  #header #logo {
      margin: 4px 0 0 0px;
      width: 205px;
  }

  #header span {
      text-align: left;
      line-height: 60px;
      font-family: Big Caslon, 'Times New Roman', Times, serif;
      font-size: 36px;
      font-weight: bold;
      text-transform: uppercase;
      white-space: nowrap;
      color: #444;
  }

  #primary-outer-container {
      display: flex;
      height: 100%;
      /* Adjusted for header height */
      overflow: hidden;
  }

  #menu-categories {
      width: 180px;
      background-color: #fcfcfc;
      border-right: 1px solid #ddd;
      padding: 2px 0 0 10px;
      overflow-y: auto;
      /* Enable scrolling if menu height exceeds viewport */
      position: absolute;
      height: 100%;
      width: 180px;
  }

  #menu-categories a {
      display: block;
      margin-bottom: 4px;
      text-decoration: none;
      color: #444;
  }

  #menu-categories a:hover {
      color: #000;
  }

  #menu-categories a:active {
      color: #c00000;
  }

  #social {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      position: fixed;
      bottom: 40px;
      left: 0;
      max-width: 80px;
      background-color: #fcfbfc;
      padding: 2px 0 0 12px;
      line-height: 100%;
  }

  #social img {
      width: 100%;
  }

  #primary-inner-container {
      flex: 1;
      overflow: hidden;

      /* position: absolute; */
      margin-left: 190px;
      width: 100%;
      height: 100%;
  }

  #primary-inner-iframe {
      width: 100%;
      height: 100%;
      border: none;
  }

  .elevated {
      vertical-align: 2px;
      /* Adjust the value as needed */
  }

  .elevated2 {
      vertical-align: 1px;
      /* Adjust the value as needed */
  }

  #preview {
      margin: 0;
      padding: 0;
      height: 100%;
      overflow: hidden;
      font-family: Avenir, Arial, Helvetica, sans-serif;
      font-weight: 400;
      font-size: 16px;
      color: #555;
  }

  #preview p {
      margin-left: 10px;
  }

  #preview_header_image {
      max-width: 1000px;
      margin-bottom: 10px;
  }

  #preview_welcome {
      max-width: 140px;
  }

  #preview p.header {
      margin: 0 0 0 10px;
      line-height: 12px;
      letter-spacing: .025em;
  }

  #preview p.inst {
      margin: 25px 0 20px 10px;
  }

  #preview p.body {
      margin: 0 0 15px 10px;
      letter-spacing: .01em;

  }



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

      #preview {
          font-size: 14px;
      }

      #preview p.header {
          /* line-height: 10px; */
          margin: 0 0 0 0;
      }

      #preview p.body {
          margin: 0 0 8px 2px;
      }

      #preview p.inst {
          margin: 15px 0 10px 0px;
      }

      #preview_header_image {
          /* max-width: 100%; */
          position: relative;
          overflow: hidden;
          width: 100%;
      }



      #menu-categories {
          border-right: 0px;
          border-bottom: 1px solid #ddd;
          padding: 2px 0 0 10px;
      }

  }

  @media screen and (max-device-width: 1024px) and (orientation: portrait) {

      body {
          margin: 0;
      }

      #absurd {
          font-size: 14px;
      }

      #preview_header_image {

          width: 400%;
      }

      .header,
      .body,
      .inst {
          font-size: 12px;
      }

      #menu-categories {
          width: 150px;
      }

      #primary-inner-container {
          margin-left: 160px;
      }
  }