/* ╔═════════════════════════════════════════════════════════════════════════╗ */
/* ║                   RESPONSIVE : TABLET (LANDSCAPE)                       ║ */
/* ╚═════════════════════════════════════════════════════════════════════════╝ */

/* @media (min-width: 820px) and (orientation: landscape) and (hover: none) and (pointer: coarse) { */
@media only screen
  and (min-width: 834px) /* start just above big iPhones */
  and (max-width: 1366px)
  and (orientation: landscape)
  and (hover: none)
  and (pointer: coarse) {


  /* graphics : hide */
  .desktop-only,              /* hide desktop graphics */
  .diorama-main-forest,       /* hide top 'forest' intro diorama graphics  */
  .tablet-portrait-only,      /* hide specific tablet portrait graphics */
  .tablet-landscape-only,     /* hide specific phone landscape graphics */
  .phone-portrait-only {      /* hide specific phone portrait graphics */
      display: none;
  }

  /* graphics : show */
  .portable-only,             /* show graphics for portable devices */
  .diorama-main-garden,       /* show top 'garden' intro diorama graphics  */
  .tablet-landscape-only {    /* show specific tablet landscape graphics */
      display: block;
  }

  /* create spacing on mobile hardware to display dioramas on top of info-boxes */
  .info-box.style-a { margin-top: 700px;  }
  .info-box.style-b { margin-top: 800px;  }
  .info-box.style-c { margin-top: 1100px; }

  .info-box { border: 0px; }

  .positioning-box6-diorama-top-10 { --y: -11%; }   /* tree in front of brick wall */
}




/* ╔═════════════════════════════════════════════════════════════════════════╗ */
/* ║                   RESPONSIVE : TABLET (PORTRAIT)                        ║ */
/* ╚═════════════════════════════════════════════════════════════════════════╝ */

/* @media (min-width: 820px) and (orientation: portrait) and (hover: none) and (pointer: coarse) { */
@media only screen
  and (min-width: 768px)
  and (max-width: 1024px)
  and (orientation: portrait)
  and (hover: none)
  and (pointer: coarse) {

  /* graphics : hide */
  .desktop-only,            /* hide desktop graphics */
  .diorama-main-garden,     /* hide top 'garden' intro diorama graphics  */
  .phone-portrait-only,     /* hide specific phone portrait graphics */
  .phone-landscape-only {   /* hide specific phone landscape graphics */
      display: none;
  }

  /* graphics : show */
  .portable-only,           /* show graphics for portable devices */
  .diorama-main-forest,     /* show top 'forest' intro diorama graphics  */
  .tablet-portrait-only {   /* show specific tablet portrait graphics */
      display: block;
  }

  /* diorama : forest at top of page */
  .header-diorama { height: 2000px; }

  /* create spacing on mobile hardware to display dioramas on top of info-boxes */
  .info-box.style-a { margin-top: 700px;  }
  .info-box.style-b { margin-top: 800px;  }
  .info-box.style-c { margin-top: 1100px; }

  .info-box { border: 0px; }

  .positioning-box6-diorama-top-10 { --y: -11%; }   /* tree in front of brick wall */
}