.md-header {
    background-color: #060d87;
};

/* Force figures to be left-aligned */
figure {
  text-align: left !important;
  margin-left: 0 !important;
}

.md-typeset img.left {
  display: block;
  margin-left: 0 !important;
  margin-right: auto;
}

@font-face {
    font-family: "wickliffe-sans";
    /* src: url("../fonts/WickliffeSans-Regular.otf") format('opentype'); */
    src: url(https://www.otago.ac.nz/__data/assets/git_bridge/0013/1363/dist/mysource_files/WickliffeSansWEB-Regular..woff2) format("opentype");
    font-weight: normal;
    font-style: normal;
  }

@font-face {
    font-family: "wickliffe-serif";
    src: url("https://www.otago.ac.nz/__data/assets/git_bridge/0013/1363/dist/mysource_files/WickliffeWEB-Regular..woff2") format("opentype");
    /* src: url("../fonts/Wickliffe-Regular.otf") format('opentype'); */
    font-weight: normal;
    font-style: normal;
  }

.md-header__topic {
    font-family: 'wickliffe-serif', sans-serif !important;
    font-size: 2em;
    color: white;
}

.md-header__button.md-logo img, 
.md-header__button.md-logo svg {
    height: 2rem;
    width: auto;
}


.md-nav--primary {
  border-left: #ee8a07 solid 3px;
}


/* Side-nav icons. The classes are applied by addNavIcons() in
   assets/javascripts/general.js — to give another entry an icon, add its
   sidebar label to NAV_ICONS there and define a matching variable below.
   Glyphs are Material Design Icons, taken from the theme's own .icons set. */
:root {
  --md-nav-icon--start: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m13.13 22.19-1.63-3.83c1.57-.58 3.04-1.36 4.4-2.27zM5.64 12.5l-3.83-1.63 6.1-2.77C7 9.46 6.22 10.93 5.64 12.5M21.61 2.39S16.66.269 11 5.93c-2.19 2.19-3.5 4.6-4.35 6.71-.28.75-.09 1.57.46 2.13l2.13 2.12c.55.56 1.37.74 2.12.46A19.1 19.1 0 0 0 18.07 13c5.66-5.66 3.54-10.61 3.54-10.61m-7.07 7.07c-.78-.78-.78-2.05 0-2.83s2.05-.78 2.83 0c.77.78.78 2.05 0 2.83s-2.05.78-2.83 0m-5.66 7.07-1.41-1.41zM6.24 22l3.64-3.64c-.34-.09-.67-.24-.97-.45L4.83 22zM2 22h1.41l4.77-4.76-1.42-1.41L2 20.59zm0-2.83 4.09-4.08c-.21-.3-.36-.62-.45-.97L2 17.76z'/%3E%3C/svg%3E");
  --md-nav-icon--general: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 9h-2V7h2m0 10h-2v-6h2m-1-9A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2'/%3E%3C/svg%3E");
  --md-nav-icon--storage: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3C7.58 3 4 4.79 4 7s3.58 4 8 4 8-1.79 8-4-3.58-4-8-4M4 9v3c0 2.21 3.58 4 8 4s8-1.79 8-4V9c0 2.21-3.58 4-8 4s-8-1.79-8-4m0 5v3c0 2.21 3.58 4 8 4s8-1.79 8-4v-3c0 2.21-3.58 4-8 4s-8-1.79-8-4'/%3E%3C/svg%3E");
  --md-nav-icon--services: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11h8V3H3m0 18h8v-8H3m10 8h8v-8h-8m0-10v8h8V3'/%3E%3C/svg%3E");
  --md-nav-icon--training: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 1 9l11 6 9-4.91V17h2V9M5 13.18v4L12 21l7-3.82v-4L12 17z'/%3E%3C/svg%3E");
}

/* The sidebar title and the top-level section headings ship grey; a section
   that has an index page (Other Services) is an anchor instead, and ships in
   the link colour. */
.md-nav--primary > .md-nav__title,
.md-nav__item--section > .md-nav__link[for],
.md-nav__item--section > .md-nav__container > .md-nav__link[href] {
  color: var(--md-default-fg-color);
}

.md-nav__link--icon {
  font-weight: 700;
}

/* The icon is a flex item rather than a background so that it sits before the
   label without depending on the link's padding, which differs between desktop
   (none) and the mobile drawer (.6rem .8rem). */
.md-nav__link--icon::before {
  content: "";
  align-self: flex-start;
  margin-top: .1em;
  width: 1.1em;
  height: 1.1em;
  flex-shrink: 0;
  background-color: #ee8a07;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: contain;
          mask-size: contain;
}

.md-nav__link--icon-start::before {
  -webkit-mask-image: var(--md-nav-icon--start);
          mask-image: var(--md-nav-icon--start);
}

.md-nav__link--icon-general::before {
  -webkit-mask-image: var(--md-nav-icon--general);
          mask-image: var(--md-nav-icon--general);
}

.md-nav__link--icon-storage::before {
  -webkit-mask-image: var(--md-nav-icon--storage);
          mask-image: var(--md-nav-icon--storage);
}

.md-nav__link--icon-services::before {
  -webkit-mask-image: var(--md-nav-icon--services);
          mask-image: var(--md-nav-icon--services);
}

.md-nav__link--icon-training::before {
  -webkit-mask-image: var(--md-nav-icon--training);
          mask-image: var(--md-nav-icon--training);
}


.tabbed-set {
  border: 1px solid #317bff;
  border-radius: 5px;
  padding: 10px;
  margin: 10px 0;
  border-radius: 5%;
}


li.md-nav__item--active:not(li.md-nav__item--nested) {
  font-weight: bold;
  }

.nt-cards.nt-grid {
  max-width: 780px;
}

.nt-card {
  background-color: #daebfc;
  border-radius: 5px;
  padding: 3px;
  margin-bottom: 0.3rem;
}

.nt-card .nt-card-image {
  min-height: 72px;
}

.nt-card .nt-card-image img {
  height: 56px;
  margin-top: 4px;
}

.nt-card-content {
  padding: 0.2rem 0.6rem 0.5rem 0.6rem;
}

.nt-card-title {
  font-size: 0.875rem;
  margin: 2px 0 4px 0;
  line-height: 1.2;
}

.nt-card-text {
  font-size: 12px;
}

/* :root {
    --md-text-font: "wickliffe-sans" !important;
    --md-heading-font: "wickliffe-serif" !important; 
  }

:body {
  --md-text-font: "wickliffe-sans" !important;
  --md-heading-font: "wickliffe-serif" !important; 
}

/* Ensure the entire page uses the font */
/*html, body, .md-typeset {
  font-family: 'wickliffe-serif', sans-serif !important;
} */

  .md-header__button.md-logo > img {
    
    height: 100px;
  }

  
  :root {
    --md-admonition-icon--terminal: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M41.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 41.4 86.6zM288 416H576c17.7 0 32 14.3 32 32s-14.3 32-32 32H288c-17.7 0-32-14.3-32-32s14.3-32 32-32z"/></svg>');
    --md-admonition-icon--overview: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%231f1f1f' viewBox='0 -960 960 960'%3E%3Cpath d='M280-600v-80h560v80H280Zm0 160v-80h560v80H280Zm0 160v-80h560v80H280ZM160-600q-17 0-28.5-11.5T120-640q0-17 11.5-28.5T160-680q17 0 28.5 11.5T200-640q0 17-11.5 28.5T160-600Zm0 160q-17 0-28.5-11.5T120-480q0-17 11.5-28.5T160-520q17 0 28.5 11.5T200-480q0 17-11.5 28.5T160-440Zm0 160q-17 0-28.5-11.5T120-320q0-17 11.5-28.5T160-360q17 0 28.5 11.5T200-320q0 17-11.5 28.5T160-280Z'/%3E%3C/svg%3E");
    --md-admonition-icon--related-pages: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%231f1f1f' viewBox='0 -960 960 960'%3E%3Cpath d='M240-400h80q0-59 43-99.5T466-540q36 0 67 16.5t51 43.5h-64v80h200v-200h-80v62q-32-38-76.5-60T466-620q-95 0-160.5 64T240-400ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z'/%3E%3C/svg%3E");
    --md-admonition-icon--r-project: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 581 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M581 226.6C581 119.1 450.9 32 290.5 32S0 119.1 0 226.6C0 322.4 103.3 402 239.4 418.1V480h99.1v-61.5c24.3-2.7 47.6-7.4 69.4-13.9L448 480h112l-67.4-113.7c54.5-35.4 88.4-84.9 88.4-139.7zm-466.8 14.5c0-73.5 98.9-133 220.8-133s211.9 40.7 211.9 133c0 50.1-26.5 85-70.3 106.4-2.4-1.6-4.7-2.9-6.4-3.7-10.2-5.2-27.8-10.5-27.8-10.5s86.6-6.4 86.6-92.7-90.6-87.9-90.6-87.9h-199V361c-74.1-21.5-125.2-67.1-125.2-119.9zm225.1 38.3v-55.6c57.8 0 87.8-6.8 87.8 27.3 0 36.5-38.2 28.3-87.8 28.3zm-.9 72.5H365c10.8 0 18.9 11.7 24 19.2-16.1 1.9-33 2.8-50.6 2.9v-22.1z"/></svg>');
    --md-admonition-icon--r-code: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 581 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M581 226.6C581 119.1 450.9 32 290.5 32S0 119.1 0 226.6C0 322.4 103.3 402 239.4 418.1V480h99.1v-61.5c24.3-2.7 47.6-7.4 69.4-13.9L448 480h112l-67.4-113.7c54.5-35.4 88.4-84.9 88.4-139.7zm-466.8 14.5c0-73.5 98.9-133 220.8-133s211.9 40.7 211.9 133c0 50.1-26.5 85-70.3 106.4-2.4-1.6-4.7-2.9-6.4-3.7-10.2-5.2-27.8-10.5-27.8-10.5s86.6-6.4 86.6-92.7-90.6-87.9-90.6-87.9h-199V361c-74.1-21.5-125.2-67.1-125.2-119.9zm225.1 38.3v-55.6c57.8 0 87.8-6.8 87.8 27.3 0 36.5-38.2 28.3-87.8 28.3zm-.9 72.5H365c10.8 0 18.9 11.7 24 19.2-16.1 1.9-33 2.8-50.6 2.9v-22.1z"/></svg>');
    --md-admonition-icon--python: url('data:image/svg+xml;charset=utf-9,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M439.8 200.5c-7.7-30.9-22.3-54.2-53.4-54.2h-40.1v47.4c0 36.8-31.2 67.8-66.8 67.8H172.7c-29.2 0-53.4 25-53.4 54.3v101.8c0 29 25.2 46 53.4 54.3 33.8 9.9 66.3 11.7 106.8 0 26.9-7.8 53.4-23.5 53.4-54.3v-40.7H226.2v-13.6h160.2c31.1 0 42.6-21.7 53.4-54.2 11.2-33.5 10.7-65.7 0-108.6zM286.2 404c11.1 0 20.1 9.1 20.1 20.3 0 11.3-9 20.4-20.1 20.4-11 0-20.1-9.2-20.1-20.4.1-11.3 9.1-20.3 20.1-20.3zM167.8 248.1h106.8c29.7 0 53.4-24.5 53.4-54.3V91.9c0-29-24.4-50.7-53.4-55.6-35.8-5.9-74.7-5.6-106.8.1-45.2 8-53.4 24.7-53.4 55.6v40.7h106.9v13.6h-147c-31.1 0-58.3 18.7-66.8 54.2-9.8 40.7-10.2 66.1 0 108.6 7.6 31.6 25.7 54.2 56.8 54.2H101v-48.8c0-35.3 30.5-66.4 66.8-66.4zm-6.7-142.6c-11.1 0-20.1-9.1-20.1-20.3.1-11.3 9-20.4 20.1-20.4 11 0 20.1 9.2 20.1 20.4s-9 20.3-20.1 20.3z"/></svg>');

  }
  .md-typeset .admonition.terminal,
  .md-typeset details.terminal {
    border-color: rgb(105,105,105);
  }
  .md-typeset .admonition.terminal > .admonition-title,
  .md-typeset .admonition.terminal > summary {
    color: rgb(255, 255, 255);
    background-color: rgba(105,105,105);
  }
  .md-typeset .admonition.terminal > .admonition-title::before,
  .md-typeset .admonition.terminal > summary::before {
    background-color: rgb(124,252,0);
    -webkit-mask-image: var(--md-admonition-icon--terminal);
            mask-image: var(--md-admonition-icon--terminal);
  }

  /* Ensure code blocks inside terminal admonitions are readable */
  .md-typeset .admonition.terminal .admonition-content pre,
  .md-typeset .admonition.terminal .admonition-content code,
  .md-typeset .admonition.terminal .admonition-content .highlight {
    background-color: #1f1f1f;
    color: #e6e6e6;
    border-radius: 4px;
    padding: 0.6rem;
    overflow: auto;
  }
  
  .md-typeset .admonition.overview,
  .md-typeset details.overview {
    border-color: rgb(72, 191, 191);
  }
  .md-typeset .overview > .admonition-title,
  .md-typeset .overview > summary {
    background-color: rgba(72, 191, 191, 0.1);
  }
  .md-typeset .overview > .admonition-title::before,
  .md-typeset .overview > summary::before {
    background-color: rgb(72, 191, 191);
    -webkit-mask-image: var(--md-admonition-icon--overview);
            mask-image: var(--md-admonition-icon--overview);
  }

  .md-typeset .admonition.related-pages,
  .md-typeset details.related-pages {
    border-color: rgb(43, 155, 70);
  }
  .md-typeset .related-pages > .admonition-title,
  .md-typeset .related-pages > summary {
    background-color: rgba(43, 155, 70, 0.1);
  }
  .md-typeset .related-pages > .admonition-title::before,
  .md-typeset .related-pages > summary::before {
    background-color: rgb(43, 155, 70);
    -webkit-mask-image: var(--md-admonition-icon--related-pages);
            mask-image: var(--md-admonition-icon--related-pages);
  }

  .md-typeset .admonition.r-project,
  .md-typeset details.r-project,
  .md-typeset .admonition.r-code,
  .md-typeset details.r-code {
    border-color: rgb(135,206,235);
  }
  .md-typeset .r-project > .admonition-title,
  .md-typeset .r-project > summary {
    color:rgb(8, 8, 8);
    background-color: rgba(135,206,235);
  }
  .md-typeset .r-project > .admonition-title::before,
  .md-typeset .r-project > summary::before,
  .md-typeset .r-code > .admonition-title::before,
  .md-typeset .r-code > summary::before {
    background-color: rgb(25,25,112);
    -webkit-mask-image: var(--md-admonition-icon--r-project);
            mask-image: var(--md-admonition-icon--r-project);
  }

  .md-typeset .r-project > .admonition-title,
  .md-typeset .r-project > summary {
    color:rgb(135, 206, 235);
    background-color: rgba(135,206,235);
  }

  /* use for r-code for boxes when you want the title to be visible */
  .md-typeset .r-code > .admonition-title,
  .md-typeset .r-code > summary {
    color:rgb(0, 0, 0);
    background-color: rgba(135,206,235);
  }


  .md-typeset .admonition.python,
  .md-typeset details.python {
    border-color: rgb(112, 201, 10);
  }
  .md-typeset .python > .admonition-title,
  .md-typeset .python > summary {
    background-color: rgba(54, 143, 13, 0.459);
  }
  .md-typeset .python > .admonition-title::before,
  .md-typeset .python > summary::before {
    background-color: rgb(3, 116, 12);
    -webkit-mask-image: var(--md-admonition-icon--python);
            mask-image: var(--md-admonition-icon--python);
  }
 
/* control TOC below here*/

/* ================================
   Reduce sidebar widths globally
   (Material 9.6.15)
   ================================ */

/* ================================
   Shrink sidebars
   ================================ */

/* Navigation (left) */
.md-sidebar--primary {
  width: 13rem;
}

/* Page TOC (right) */
.md-sidebar--secondary {
  width: 11rem;
}

/* ================================
   Expand content area
   ================================ */


/* Remove Material's content max-width clamp */
/* and keep lines readable */
.md-content__inner {
    max-width: none;
  padding-left: 2rem;
  padding-right: 2rem;
}

/* Allow the menus to follow the window edge and the content area to expand */
.md-main__inner {
  max-width: none;
  padding-left: 2rem;
  padding-right: 2rem;
}

/* .md-content__inner {
  max-width: 80rem;
} */
/* Make TOC links wrap more tightly */
/* .md-sidebar--secondary .md-nav__link {
  white-space: normal;
  font-size: 0.85rem;
} */


/* ================================
   Embedded Grafana panels
   ================================ */

/* Grafana's d-solo embeds have no intrinsic size, so an iframe without explicit
   dimensions collapses. Rather than hardcoding pixels — which overflow the content
   area on a narrow window — fill the available width and hold a fixed aspect ratio. */
.grafana-panel {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 8;
  min-height: 18rem;
  border: 0;
  border-radius: 0.2rem;
  margin: 0.8rem 0 1.4rem;
  background: var(--md-default-bg-color);
}

/* Taller variant for panels with a legend down the side or one row per partition. */
.grafana-panel--tall {
  aspect-ratio: 16 / 10;
  min-height: 24rem;
}

/* Per-node panels carry a single line each, so they gain nothing from filling a wide
   window. Cap them at the 850x400 these embeds used before they were made responsive.

   The .md-typeset prefix is load-bearing. Material ships `.md-typeset iframe{max-width:100%}`,
   which at 0-1-1 outranks a bare `.grafana-panel--compact` at 0-1-0 and throws the cap away -
   the panels keep the aspect ratio set here, because Material sets none, and so come out the
   right shape at the full column width. Qualifying takes this to 0-2-0 and it wins.

   min-height: 0 clears the 18rem inherited above, which is 360px at Material's default
   html{font-size:125%} and 540px once that steps up to 150% on a wide viewport. Left in, it
   would beat the aspect ratio and leave these taller than they are wide. */
.md-typeset .grafana-panel--compact {
  max-width: 850px;
  aspect-ratio: 850 / 400;
  min-height: 0;
}

/* Phones cannot show a wide time series usefully at 16:8, so give it more height. */
@media screen and (max-width: 44.9375em) {
  .grafana-panel,
  .grafana-panel--tall {
    aspect-ratio: 4 / 3;
    min-height: 16rem;
  }
}

/* Two panels side by side on a wide screen, stacking below it. */
.grafana-pair {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr));
  gap: 0 1rem;
}

/* A pair of machine-room photographs shown side by side - the front of the rack row, and the
   same row from behind. The two come off the camera at different shapes (4:3 and roughly 6:5),
   so both are cropped to a common 4:3 with object-fit rather than left to set their own
   heights, which would drop the two captions onto different lines.

   Every selector here is qualified with .md-typeset. Material ships `.md-typeset img` and
   `.md-typeset figcaption` rules of its own, and at 0-1-1 those outrank a bare class at 0-1-0 -
   the same trap that made the Grafana panel cap silently do nothing for two commits. */
.md-typeset .photo-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin: 1.2rem 0 1.6rem;
}

.md-typeset .photo-pair figure {
  margin: 0;
}

.md-typeset .photo-pair img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 0.3rem;
  box-shadow: 0 0.15rem 0.5rem rgba(0, 0, 0, 0.28);
  transition: transform 200ms ease, box-shadow 200ms ease;
}

.md-typeset .photo-pair figure:hover img {
  transform: translateY(-0.15rem);
  box-shadow: 0 0.35rem 0.9rem rgba(0, 0, 0, 0.35);
}

/* Material centres figcaptions and caps them at 24rem, which under a half-width photo wraps
   into a narrow ragged column. These read as labels on the photo above, so left-align them
   against the image edge and mark them with the header blue. */
.md-typeset .photo-pair figcaption {
  max-width: none;
  margin: 0.5rem 0 0;
  padding-left: 0.5rem;
  border-left: 0.15rem solid #060d87;
  font-size: 0.7rem;
  line-height: 1.5;
  text-align: left;
  color: var(--md-default-fg-color--light);
}

.md-typeset .photo-pair figcaption b {
  color: var(--md-default-fg-color);
}

/* Below the phone breakpoint the pair stacks, and two stacked 4:3 crops eat a lot of screen
   before any text, so let them go wide and short instead. */
@media screen and (max-width: 44.9375em) {
  .md-typeset .photo-pair {
    grid-template-columns: 1fr;
    gap: 1.2rem;
  }

  .md-typeset .photo-pair img {
    aspect-ratio: 16 / 9;
  }
}

@media (prefers-reduced-motion: reduce) {
  .md-typeset .photo-pair img,
  .md-typeset .photo-pair figure:hover img {
    transition: none;
    transform: none;
  }
}
