/*==== OVER 2000PX ====*/
@media only screen and (min-width: 2000px) {
  /*==== Universal ====*/
  .block-content{ width: 65vw; }

  /*==== Nav ====*/

   /*==== Landing ====*/
  .landing-headline{ width: 1080px; margin: 0 auto;}
  .landing-about-image img{ width: 30vw; }

}

/*==== UNDER 1200PX ====*/
@media only screen and (max-width: 1200px) {

  .landing-headline{ width: 600px; margin: 0 auto;}
  .landing-about-copy{ width: 75vw; }
  .landing-about-image{ display: none; }

  .project-about{ grid-column-gap: 0; grid-template-columns: 100%; display: grid;}
  .images-2{ grid-column-gap: 0; grid-template-columns: 100%; }

  .work-container{ grid-template-columns: 100%; }

  .project-about-L{ position: relative; top: 0; height: auto; }
  .container-L{ position: relative; top: auto; height: auto; margin-bottom: 100px;}

}


/*==== OVER 800PX ====*/
@media only screen and (min-width: 801px) {

    /*==== Universal ====*/
    .mobile-only{ display: none;}
    .desktop-only{ display: initial;}
    .mobile-break{ display: none; }

}


/*==== UNDER 800PX ====*/
@media only screen and (max-width: 800px) {

  /*==== Universal ====*/
  .mobile-only{ display: inherit;}
  .desktop-only{ display: none;}

  .mobile-break{ display: block; }
  .block-content { width: 100vw; }

  :root { --section-padding: 20vh; }

  h1{ font-size: 30px; line-height: 42px;}
  h2{ font-size: 30px; line-height: 42px;}
  .project-thumb h3{ font-size: 16px; line-height: 20px;}
  p{ font-size: 14px; line-height: 28px; }

  /*==== Main/Footer ====*/
  .main-container { margin-bottom: 0; }
  footer { position: relative; z-index: 0; }
  .footer-inner{ width: 75vw; }

  /*==== Nav ====*/
  .nav-overlay { display: block; }
  .nav-link-desktop { display: none; }
  .nav-link-mobile { display: block; }

  /*==== Landing ====*/
  .landing-headline{ width: 80vw; margin: 0 auto;}

  /*==== Work ====*/
  .project-about-L{ width: 80vw; margin: 0 auto;}
  .project-about-R{ width: 95vw; margin: 0 auto;}
  .projects-more-display{ width: 95vw; margin: 0 auto;}

  .image-video { margin-bottom: 4px;}

  .images-2 img { width: 100%; }

  .project-thumb-overlay .project-thumb-copy{ width: 60%; }


  .work-container{ grid-template-columns: 100%; }
  .work-project{ margin-bottom: 50px; }
  .work-project-image-overlay{ padding: 15px; }
  .work-project:hover .work-project-image-overlay{ width: 195px; }

  .projects-more-display{
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    grid-template-columns: calc(50% - 3px) calc(50% - 3px);
}
}

/*==== Mobile and smaller ====*/
@media only screen and (max-width: 600px) {

}