/**** WARNING - Do not edit this file /diocesan/custom.css directly ****/
/**** This file is auto generated based on settings and fields      ****/
/**** To make changes, edit the base file at /diocesan/custom.php   ****/

@import url(https://fonts.googleapis.com/css2?family=Domine:wght@400;700);
@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@400;700);

h1, h2, h3, h4, h5, h6 {
margin: 1.1875em 0;
}

h1 {
  position: relative;  color: var(--color-secondary);
  font-family: var(--font-heading);
  font-size: 34px;
  font-weight: 700;
}

h2 {
  position: relative;  color: var(--color-secondary);
  font-family: var(--font-heading);
  font-size: 30px;
  font-weight: 700;
}

h3 {
  position: relative;  color: var(--color-secondary);
  font-family: var(--font-heading);
  font-size: 28px;
  font-weight: 700;
}

h4 {
  position: relative;  color: var(--color-secondary);
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 400;
}

h5 {
  position: relative;  color: var(--color-secondary);
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
}

h6 {
  position: relative;  color: var(--color-secondary);
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 700;
}

h4::after {
  position: absolute;
  content: '';
  background: var(--color-secondary);
  width: 2em;
  height: 2px;
  top: calc(100% + 0.5em);
  left: 0;
}

a, .accordion a {
  color: var(--color-primary);
  font-weight: 400;
  text-decoration: underline;
  transition: 0.25s ease-in;
}

a:hover, a:focus, .accordion a:hover, .accordion a:focus {
  color: var(--color-secondary);
  text-decoration: none;
}

p, ol, ul, .simcal-default-calendar-grid ul.simcal-events {
  color: #3F3F3F;
  font-size: 18px;
  line-height: 1.5;
}

.page-heading-title {
font-size: 42.5px;
font-style: normal;
font-weight: 400;
}

.page-header::after {
  background-color: #000000;
  opacity: 0.25;
}

.staff-single .staff-image, .contact-single .contact-image {
  object-position: top;
}

@media screen and (min-width: 576px) {
  h1 {
    font-size: 34.53125px;
  }

  h2 {
    font-size: 30.46875px;
  }

  h3 {
    font-size: 28.4375px;
  }

  h4 {
    font-size: 24.375px;
  }

  h5 {
    font-size: 22.34375px;
  }

  h6 {
    font-size: 20.3125px;
  }

  p, ol, ul, .simcal-default-calendar-grid ul.simcal-events {
    font-size: 18.28125px;
  }

  .page-heading-title {
    font-size: 51.796875px;
  }
}

@media screen and (min-width: 768px) {
  h1 {
    font-size: 35.0625px;
  }

  h2 {
    font-size: 30.9375px;
  }

  h3 {
    font-size: 28.875px;
  }

  h4 {
    font-size: 24.75px;
  }

  h5 {
    font-size: 22.6875px;
  }

  h6 {
    font-size: 20.625px;
  }

  p, ol, ul, .simcal-default-calendar-grid ul.simcal-events {
    font-size: 18.5625px;
  }

  .page-heading-title {
    font-size: 52.59375px;
  }
}

@media screen and (min-width: 1024px) {
  h1 {
    font-size: 36.125px;
  }

  h2 {
    font-size: 31.875px;
  }

  h3 {
    font-size: 29.75px;
  }

  h4 {
    font-size: 25.5px;
  }

  h5 {
    font-size: 23.375px;
  }

  h6 {
    font-size: 21.25px;
  }

  p, ol, ul, .simcal-default-calendar-grid ul.simcal-events {
    font-size: 19.125px;
  }

  .page-heading-title {
    font-size: 54.1875px;
  }
}

.the-button {
font-family: var(--font-main);
}

:root {
--menu-top-level-default-font-color:var(--color-white);
--menu-top-level-hover-font-color:var(--color-tertiary);
--menu-top-level-default-bg-color:transparent;
--menu-top-level-hover-bg-color:transparent;
--menu-submenu-default-font-color:var(--color-primary);
--menu-submenu-hover-font-color:var(--color-white);
--menu-submenu-default-bg-color:var(--color-white);
--menu-submenu-hover-bg-color:var(--color-tertiary);

--sticky-menu-top-level-default-font-color:var(--color-black);
--sticky-menu-top-level-hover-font-color:var(--color-primary);
--sticky-menu-top-level-default-bg-color:transparent;
--sticky-menu-top-level-hover-bg-color:transparent;
--sticky-menu-submenu-default-font-color:var(--color-primary);
--sticky-menu-submenu-hover-font-color:var(--color-white);
--sticky-menu-submenu-default-bg-color:var(--color-white);
--sticky-menu-submenu-hover-bg-color:var(--color-tertiary);

--sidebar-top-level-default-font-color:var(--color-white);
--sidebar-top-level-hover-font-color:var(--color-white);
--sidebar-top-level-default-bg-color:var(--color-primary);
--sidebar-top-level-hover-bg-color:var(--color-secondary);
--sidebar-submenu-default-font-color:var(--color-white);
--sidebar-submenu-hover-font-color:var(--color-primary);
--sidebar-submenu-default-bg-color:var(--color-primary);
--sidebar-submenu-hover-bg-color:var(--color-quaternary);
}

