/* PADI dive courses page */

/* hero: blue block section with the multiplied background photo and the grey curve divider */
.padi-hero { background-blend-mode: multiply; }
.padi-hero__title { font-size: 4vw; color: var(--white); }
.padi-hero .divider { transform: scale(-1, 1); }            /* Divi flips the curve horizontally on this page */

/* course cards: white rounded rows on the grey section (Divi rows 1-7, 9-12) */
.padi-card { border-radius: 20px; box-shadow: 0 8px 10px -6px rgba(0, 0, 0, .3); overflow: hidden; }
.padi-card__title { font-size: 2vw; }
.padi-photo--bottom { background-position: 50% 100%; }   /* Deep Diver photo column: "center bottom" */
.padi-sm { font-size: 14px; }                               /* 14px inline styles on the last five Advanced Open Water items */
/* icon list: Divi's font glyphs advance 14px (user), 16px (clock) and 20px (cake), so the text starts at different x per line */
.padi-card .icon-list__icon { margin-top: 6px; }              /* glyph sits 3px lower than a centred 16px box */
.padi-card .icon-list li:nth-child(1) .icon-list__icon { flex-basis: 14px; width: 14px; }
.padi-card .icon-list li:nth-child(3) .icon-list__icon { flex-basis: 20px; width: 20px; }

/* Divi "section navigation" dots, fixed to the right edge like the original page */
.padi-side-nav {
  position: fixed;
  right: 0;
  top: 50%;
  margin-top: -40px;
  z-index: 99999;
  width: 40px;
  padding: 10px;
  list-style: none;
  background: rgba(0, 0, 0, .4);
  border-radius: 5px 0 0 5px;
}
.padi-side-nav li { padding: 7px; }
.padi-side-nav a {
  display: block;
  width: 7px;
  height: 7px;
  margin-right: 10px;
  border-radius: 7px;
  background-color: rgba(255, 255, 255, .5);
  text-indent: -9999px;
  overflow: hidden;
}
.padi-side-nav a.is-active, .padi-side-nav a:hover { background-color: var(--white); }

@media (max-width: 767px) {
  .padi-hero__title { font-size: 7vw; }
  .padi-card__title { font-size: 6vw; }
}