/* desktop: location on the left, the practice photo tiles in one row on the right that scrolls left and right */
  @media (min-width: 1025px) {
    html body #schools .od > .od-bar { display: flex !important; flex-direction: row !important; align-items: stretch !important; gap: 14px !important; }
    html body #schools .od-top { margin: 0 !important; flex: 0 0 250px; display: flex !important; flex-direction: column; order: 0; }
    html body #schools .od-top > * { flex: 1; }
    html body #schools .od-field { height: 50px !important; min-height: 0 !important; min-width: 0; box-sizing: border-box; padding-top: 0 !important; padding-bottom: 0 !important; border-radius: 12px !important; display: flex !important; align-items: center; }
    html body #schools .od-top { flex-basis: 240px !important; }
    html body #schools .od-tabs.pw-disc { order: 1; flex: 1; min-width: 0; display: flex !important; flex-wrap: nowrap !important; gap: 10px !important;
      overflow-x: auto !important; overflow-y: hidden !important; scroll-snap-type: x proximity; scroll-padding: 0 4px; scroll-behavior: smooth; overscroll-behavior-x: contain; scrollbar-width: none;
      padding: 4px !important; margin: -4px !important;
      -webkit-mask: linear-gradient(90deg, #000 calc(100% - 56px), transparent) !important; mask: linear-gradient(90deg, #000 calc(100% - 56px), transparent) !important; }
    html body #schools .od-tabs.pw-disc.at-end { -webkit-mask: none !important; mask: none !important; }
    html body #schools .od-tabs.pw-disc::-webkit-scrollbar { display: none; }
    html body #schools .od-tabs button.od-ptile, html body #schools .od-tabs button.od-ptile[aria-selected] { flex: 0 0 180px !important; width: 180px !important; height: 50px !important; scroll-snap-align: start;
      padding: 0 12px 0 14px !important; align-items: center !important; border-radius: 12px !important; overflow: hidden !important;
      background: var(--pc) var(--pimg) var(--ppos, center) / 125% auto no-repeat !important; }
    html body #schools .od-tabs button.od-ptile::before { background: linear-gradient(90deg, rgba(20,15,10,.66), rgba(20,15,10,.34)), linear-gradient(to top, rgba(20,15,10,.5), transparent 70%) !important; }
    html body #schools .od-tabs button.od-ptile:hover::before { background: linear-gradient(90deg, rgba(20,15,10,.58), rgba(20,15,10,.22)), linear-gradient(to top, rgba(20,15,10,.45), transparent 70%) !important; }
    html body #schools .od-tabs button.od-ptile span { font: 600 14px/1.25 var(--sans) !important; letter-spacing: 0 !important; text-transform: none !important; color: #FBF7EE; white-space: nowrap; }
    html body #schools .od-tabs button.od-ptile[aria-selected="true"]::after { top: 50% !important; right: 10px !important; margin: -9px 0 0 !important; }
    /* left / right arrows */
    #schools .od-bar { position: relative; }
    #schools .od-arr { position: absolute; top: 50%; z-index: 3; width: 36px; height: 36px; margin-top: -18px; border-radius: 50%; border: 1px solid rgba(28,24,16,.14); background: #FFFDF8; color: #1C1810;
      display: grid; place-items: center; cursor: pointer; box-shadow: 0 8px 18px -10px rgba(28,24,16,.5); transition: opacity .2s ease; }
    #schools .od-arr svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
    #schools .od-arr[hidden] { display: none; }
    #schools .od-arr:hover { border-color: #1C1810; }
  }
  @media (max-width: 1024px) { #schools .od-arr { display: none !important; } }