/** fancy backgrounds **/
    /* backdrop blur */
      /* disabled with 'no' prefix */
      no main .header-background {
        opacity: 0.67;
        backdrop-filter: blur(4px);
      }

    main .wrapper section.content > section {
      position: relative;
      margin: 8.15em 0;
    }

    main > section.content:first-of-type > section:first-of-type .graphic img {
      max-height: 60vh;
    }

    .diagonal-background, hr.diagonal {
      display: block;
      position: absolute;
      top: -60vh;
      left: -70vw;
      width: 200vw;
      height: 150vh;
      border: 0;
      transform: rotateZ(-15deg);
      content: " "; 
    }

    hr.diagonal {
      top: -5vh;
      height: 100vh;
    }

    main footer::after {
      display: block;
      position: absolute;
      top: -50vh;
      left: -70vw;
      width: 200vw;
      height: 110vh;
      transform: rotateZ(-15deg);
      content: " "; 
    }

    /* hides the bottom of the footer angled background */
    .wrapper {
      overflow: hidden;
    }