body {
  overflow-x: hidden;
}

/*so the desktop isn't affected*/
.dropbtn {
  background: var(--clr-palette-5);
  border: none;
}

.wrapper .typewriter-alt {
	display: none;
}

/*Mobile Typewriter*/
@media (max-width: 820px) {
  .typewriter__heading {
    display: none;
	}
	
	.wrapper .typewriter-alt {
		display: block;
	}

  .typewriter-alt {
    display: flex;
    align-items: center;
    justify-content: center;
    align-content: center;
    text-align: center;
    font-family: monospace;
    font-size: clamp(1rem, 2vw, 2rem); /* scales with screen size */
    color: var(--clr-palette-2);
    white-space: normal; /* allows wrapping */
    word-wrap: break-word;
    max-width: 90vw;
    line-height: 1.4;
  }

  .cursor {
    display: inline-block;
    width: 0.125em;
    margin-left: 1px;
    animation: blink 0.8s steps(1) infinite;
    color: var(--type-color, #a5bf94);
    font-weight: bold;
    font-family: monospace;
    margin-left: 2px;
  }

  @keyframes blink {
    0%,
    50% {
      opacity: 1;
    }
    51%,
    100% {
      opacity: 0;
    }
  }
}

/* Mobile Filter*/
@media (max-width: 800.99px) {
  .breadcrumbs {
    display: none;
  }

  .flow > h2 {
    margin: 5px;
  }

  .filter {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
  }

  .filter-icon {
    height: 35px;
    width: 35px;
  }

  .dropbtn {
    cursor: pointer;
    border: none;
  }

  .dropbtn:active {
    background-color: var(--clr-palette-4);
  }

  .dropdown {
    position: relative;
    display: inline-block;
  }

  .filter-btn {
    cursor: pointer;
    text-transform: uppercase;
    text-align: left;
    background: transparent;
    border: 0;
    padding: 0.75rem;
    color: var(--clr-palette-1);
  }

  .dropdown-content .filter-btn.active {
    border-color: var(--clr-palette-1);
    color: white;
    box-shadow: 0 0 0.5rem rgb(0 0 0 / 0.2);
  }

  .dropdown-content {
    display: none;
    position: absolute;
    background-color: var(--clr-palette-4);
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
  }

  .dropdown-content button {
    padding: 12 16px;
    display: block;
  }
  .show {
    display: block !important;
  }

  .dropdown-content button:active {
    background-color: var(--clr-palette-4);
	}
}
