/*!
Theme Name: bigsisprog
Author: Campaign Edge
Author URI: https://campaignedge.com.au
Description: Website built by Campaign Edge for the Big Sister Program
Version: 1.0.21
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: bigsisprog
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/*--------------------------------------------------------------
>>> bigsisprog:
---------------------------------------------------------------- */

/* General
--------------------------------------------- */
body .dashicons {
  width: 1em;
  height: 1em;
  font-size: inherit;
}

.first-no-margin > :first-child,
.fcnm > :first-child {
  margin-top: 0px;
}

.lcnm > :last-child {
  margin-bottom: 0px;
}

.mt0 {
  margin-top: 0;
}

.mb0 {
  margin-bottom: 0;
}

.pt0 {
  padding-top: 0;
}

.pb0 {
  padding-bottom: 0;
}

/* Colours
--------------------------------------------- */
.pc-color {
  color: var(--wp--preset--color--primary);
}

.sc-color {
  color: var(--wp--preset--color--secondary);
}

.tc-color {
  color: var(--wp--preset--color--tertiary);
}

.qc-color {
  color: var(--wp--preset--color--quaternary);
}

.quin-color {
  color: var(--wp--preset--color--quinary);
}

.sen-color {
  color: var(--wp--preset--color--senary);
}

.white-color {
  color: var(--wp--preset--color--white);
}

.black-color {
  color: var(--wp--preset--color--black);
}

.pc-bg {
  background-color: var(--wp--preset--color--primary);
}

.sc-bg {
  background-color: var(--wp--preset--color--secondary);
}

.tc-bg {
  background-color: var(--wp--preset--color--tertiary);
}

.qc-bg {
  background-color: var(--wp--preset--color--quaternary);
}

.quin-bg {
  background-color: var(--wp--preset--color--quinary);
}

.sen-bg {
  background-color: var(--wp--preset--color--senary);
}

.white-bg {
  background-color: var(--wp--preset--color--white);
}

.black-bg {
  background-color: var(--wp--preset--color--black);
}

.pc-fill {
  fill: var(--wp--preset--color--primary);
}

.sc-fill {
  fill: var(--wp--preset--color--secondary);
}

.tc-fill {
  fill: var(--wp--preset--color--tertiary);
}

.white-fill {
  fill: var(--wp--preset--color--white);
}

.black-fill {
  fill: var(--wp--preset--color--black);
}

.pc-border {
  border-color: var(--wp--preset--color--primary);
}

.sc-border {
  border-color: var(--wp--preset--color--secondary);
}

.tc-border {
  border-color: var(--wp--preset--color--tertiary);
}

.white-border {
  border-color: var(--wp--preset--color--white);
}
.black-border {
  border-color: var(--wp--preset--color--black);
}

/* Full BG's
- To give an element a full sized background in code give it the class .full-bg along with the 
class wp color class eg .has-primary-background-color
--------------------------------------------- */
.full-bg,
.wp-block-group.has-background {
  position: relative;
  overflow: visible;
}

.full-bg,
.wp-block-group.has-background > * {
  position: relative;
  z-index: 2;
}

.full-bg:before,
.wp-block-group.has-background:before {
  content: "";
  width: 100vw;
  height: 100%;
  position: absolute;
  top: 0;
  left: calc(100% / 2);
  transform: translateX(-50%);
  z-index: 0;
  background-position: 50% 50%;
  background-size: cover;
  background: inherit;
}

/* Disable full BG's on nested groups */
.wp-block-group .wp-block-group.has-background:before,
.wp-block-group .wp-block-group.has-background:after,
.wp-block-group .wp-block-group.has-background[style*=".webp')"]:before,
.wp-block-group .wp-block-group.has-background[style*=".webp')"]:after,
.wp-block-group .wp-block-group.has-background[style*=".png')"]:before,
.wp-block-group .wp-block-group.has-background[style*=".png')"]:after,
.wp-block-group .wp-block-group.has-background[style*=".jpg')"]:before,
.wp-block-group .wp-block-group.has-background[style*=".jpg')"]:after {
  width: 100%;
  transform: none;
  left: 0;
}

/* If the group has both a colour and image selected then the colour is moved to the :after placed ontop of the image*/
.wp-block-group.has-background[style*=".webp')"]:before,
.wp-block-group.has-background[style*=".jpg')"]:before,
.wp-block-group.has-background[style*=".png')"]:before {
  background-color: unset;
}

.wp-block-group.has-background[style*=".webp')"]:after,
.wp-block-group.has-background[style*=".jpg')"]:after,
.wp-block-group.has-background[style*=".png')"]:after {
  content: "";
  width: 100vw;
  height: 100%;
  position: absolute;
  top: 0;
  left: calc(100% / 2);
  transform: translateX(-50%);
  z-index: 1;
  background-position: 50% 50%;
  background-size: cover;
  background-color: inherit;
}

/* Content Areas
--------------------------------------------- */
.main-content {
  max-width: var(--wp--style--global--wide-size);
  width: 100%;
  margin: 0 auto;
}

.main-content .main-content-inner {
  padding: 0 4%;
}

/* Header
--------------------------------------------- */
.site-header {
  position: absolute;
  width: 100%;
  z-index: 3;
}

.site-header .main-content .main-content-inner {
  position: relative;
}

/* Header - Logo and Menu container
--------------------------------------------- */

.site-header .main-content-inner .header-main {
  display: flex;
  justify-content: right;
  align-items: center;
  padding: 2em 0;
  transition: padding 0.25s ease;
  column-gap: 2em;
}

.site-header-scrolled.site-header .main-content-inner .header-main {
  padding: 1em 0 1em 0;
}

.site-header .main-content-inner .header-logo {
  transition: flex 0.25s ease;
  flex: 0 1 200px;
  position: relative;
}

.site-header .main-content-inner .header-logo a {
  display: flex;
  width: 100%;
  line-height: 0;
  padding-bottom: 50%;
}

.site-header .main-content-inner .header-logo a img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left center;
}

/* Header - Menu
--------------------------------------------- */
.menu-container {
  flex: 1 1 auto;
}

.menu-container .menu {
  margin: 0px;
  list-style: none;
  padding: 0px;
  display: flex;
  justify-content: right;
  column-gap: 0.5em;
}

.menu-container .menu .menu-item {
  padding-left: 0.5em;
  border-left: 3px solid var(--wp--preset--color--primary);
  line-height: 1em;
}

.menu-container .menu .menu-item:first-child {
  border-left: 0px;
}

.menu-container .menu .menu-item a {
  color: var(--wp--preset--color--primary);
  font-weight: 700;
  text-decoration: none;
  transition: color 0.2s ease, background 0.2s ease, border-color ease 0.2s;
  font-size: 17px;
  padding: 0.1em 0.5em;
  display: block;
  border-bottom: 1px solid transparent;
}

.menu-container .menu .menu-item:hover > a {
  background: white;
  color: var(--wp--preset--color--primary);
}

.menu-container .menu .menu-item.menu-item-has-children:hover::before {
  color: var(--wp--preset--color--primary);
}

.menu-container .menu .menu-item.current-menu-item > a,
.menu-container
  .menu
  .menu-item.menu-item-has-children.current-menu-item::before {
  /* border-bottom: 2px solid var(--wp--preset--color--primary); */
  background: white;
}

.menu-container .menu .menu-item:last-child a {
  
}

/* Header - Sub Menu
--------------------------------------------- */
.menu-container .menu .menu-item.menu-item-has-children {
  position: relative;
}

.menu-container .menu .menu-item.menu-item-has-children > a {
  padding-right: 1.25em;
}

.menu-container
  .menu
  .menu-item.menu-item-has-children
  .sub-menu
  .menu-item.menu-item-has-children
  > a {
  padding-right: 0.75em;
}

.menu-container .menu .menu-item.menu-item-has-children::before {
  width: 0.5em;
  height: 0.5em;
  background-color: var(--wp--preset--color--primary);
  clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
  position: absolute;
  top: calc(50% - 0.25em);
  right: 0em;
  content: "";
  transition: 0.2s ease;
  transform: rotate(-90deg);
}

.menu-container .menu .menu-item.menu-item-has-children:hover {
  background-color: white;
  color: var(--wp--preset--color--primary);
}

.menu-container
  .menu
  .menu-item
  .sub-menu
  .menu-item.menu-item-has-children::before {
}

.menu-container .menu .menu-item.menu-item-has-children:hover::before {
  transform: rotate(0deg);
}

.menu-container .menu .menu-item .sub-menu {
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
  padding: 0px 0.5em;
  padding-top: 0.25em;
  margin: 0px;
  position: absolute;
  top: 100%;
  left: 0px;
  z-index: 2;
  list-style: none;
  width: 100%;
  background: var(--wp--preset--color--white);
  display: block;
}

.site-header-scrolled .menu-container .menu .menu-item .sub-menu,
.site-header-bg .menu-container .menu .menu-item .sub-menu {
  background-color: var(--wp--preset--color--tertiary);
}

.menu-container .menu .menu-item .sub-menu .menu-item {
  margin-left: 0px;
  padding-left: 0px;
  padding: 0.25em 0;
  border-left: 0px solid var(--wp--preset--color--primary);

  &:hover a {
    border-bottom: 1px solid var(--wp--preset--color--primary);
  }
}

.menu-container .menu .menu-item .sub-menu .menu-item a {
  font-weight: 400;
  line-height: 1.2em;
}

.menu-container .menu .menu-item.menu-item-has-children:hover > .sub-menu {
  opacity: 1;
  pointer-events: all;
}

.menu-container .menu .menu-item .sub-menu .menu-item .sub-menu {
  left: 100%;
  top: 0%;
  width: max-content;
}

/* Header - Menu Hamburger
--------------------------------------------- */
.menu-center {
  display: none;
}

.show-on-mobile-menu {
  display: none;
}

/* Header - Banner
--------------------------------------------- */

.header-banner {
  margin-bottom: 9em;

  &.banner-has-excerpt {
    margin-bottom: 6em;
  }

  .header-banner-inner {
    background-color: var(--wp--preset--color--primary);
    background-image: url("/app/uploads/2025/05/BannerBG.png");

    .header-banner-inner-content {
      display: flex;
      padding-top: 3em;
      column-gap: 20%;
      transform: translateY(4em);
      justify-content: space-between;

      &.banner-has-excerpt {
        column-gap: 7%;
        align-items: center;
      }

      .header-banner-logo-container {
        width: 30%;
      }

      .header-banner-content {
        flex: 0 1 45%;

        .header-banner-image-container {
          width: 100%;
          height: 100%;
          position: relative;

          .header-banner-image {
            width: 100%;
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            object-fit: cover;
            object-position: center;
          }

          .header-banner-image-squiggle {
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateY(50%);
            width: 80%;
          }
        }

        .header-banner-excerpt {
          width: 550px;

          p {
            font-size: 2.25em;
            font-weight: 700;
          }
        }


        .register-your-interest {
          position: absolute;
            bottom: 15%;
            right: 0%;
            width: 25%;
            background: #efd7d3;
            padding: 1em;
            
            box-shadow: 3px 3px 11px 1px #2b2560b8;

            .register-your-interest-inner {
              position: relative;
              padding: 0 7%;

              img {
                position: absolute;
                left: -16%;
                top: 50%;
                transform: translateY(-50%);
                width: auto;
                height: 200px;
              }
            }
        }
        
      }
      
    }
  }

  &.banner-front-page {
    margin-bottom: 3em;

    .header-banner-inner {
      .header-banner-inner-content {
        column-gap: 0;
        transform: translateY(0em);
        padding-top: 6em;

        .header-banner-logo-container {
          width: 50%;

          .header-banner-logo-description {
            font-size: 2.5em;
            font-weight: 700;
            line-height: var(--wp--custom--line-height--heading);
            margin-top: 0.5em;
            margin-bottom: 0.75em;
            max-width: 450px;
          }
        }

        .header-banner-content {
          flex: 0 1 50%;

          .header-banner-image-container {
            .header-banner-image {
              width: auto;
              height: 100%;
              max-width: unset;
              object-fit: contain;
              object-position: bottom left;
            }

            .header-banner-image-squiggle {
              display: none;
            }
          }
        }
      }
    }
  }
}

/* Footer
--------------------------------------------- */

.site-footer {
  padding: 1.5em 0;
  overflow: hidden;
  border-top: 2em solid var(--wp--preset--color--secondary);
  margin-top: 3em;
  background-color: white;
}

.site-footer .footer-info {
  position: relative;
  display: flex;
  column-gap: 8%;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.site-footer .footer-info .footer-logo {
  flex: 1 0 350px;
}

.site-footer .footer-info .footer-logo a {
  display: inline-flex;
  width: 100%;
  line-height: 1em;
}

.site-footer .footer-info .footer-logo a img {
  display: block;
  width: 100%;
  line-height: 1em;
}

.footer-info {
  .footer-logos {
    flex: 0 1 auto;
    .footer-logo-columns {
      display: grid;
      gap: 4em;

      &.footer-logo-align-top {
        align-items: flex-start;
      }
      &.footer-logo-align-middle {
        align-items: center;
      }
      &.footer-logo-align-end {
        align-items: flex-end;
      }

      .footer-logo-column {
      }
    }
  }
}

.site-footer .authorisation {
  margin: 1.5em 0 0 0;
  font-size: 14px;
  text-align: center;
}

/* WP Blocks
--------------------------------------------- */

.column-align-bottom {
  display: flex;
  align-items: flex-end;
}

.wp-block-cover a {
  text-decoration: none;
  transition: all 0.3s ease;
}

.wp-block-column {
  position: relative;
}

.is-layout-flow > *,
.is-layout-constrained > * {
  margin-block-start: 1em;
}

/* Youtube */
.is-provider-youtube .wp-block-embed__wrapper {
  position: relative;
  padding-bottom: 56.25%;
  width: 100%;
}

.is-provider-youtube .wp-block-embed__wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* WP Image */
.wp-block-image.size-full.is-resized img {
  max-width: unset;
}


/* WP Buttons */

.wp-block-button {

  .wp-block-button__link {
    background-color: var(--wp--preset--color--senary);
    color: var(--wp--preset--color--primary);
    font-weight: 700;
    padding: 0.5em 1em;
    border-radius: 0;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 3px 3px 11px 1px #2b2560b8;
  }

}



/* Forms
--------------------------------------------- */

.gform_wrapper .gform-body .gform_fields {
  row-gap: 1em;
}

.gform-body .gform_fields .gfield input,
.gform-body .gform_fields .gfield textarea {
  border-radius: 0;
}

.has-background .gform-body .gform_fields .gfield input {
}

.gform-body .gform_fields .gfield input::placeholder {
}

.gform-body .gform_fields .gfield .gfield-choice-input {
  border-radius: 0;
}

.gform_wrapper form .gform-footer {
  margin-block-start: 1em;
}

.gform_wrapper form .gform-body .gfield.gfield--type-submit .gform-button,
.gform_wrapper form .gform-body .gfield .gform-button,
#gform_submit_button_1 {
  background-color: var(--wp--preset--color--primary);
  padding-left: 2em;
  padding-right: 2em;
}

.gform_required_legend {
  display: none;
}

#field_1_2,
#field_2_2 {
  display: none;
}

/* Homepage
--------------------------------------------- */

.home .site-footer {
  margin-top: 0;
}

.introduction-image img {
  margin-top: calc(-35% * 0.6 + 2em);
}

.introduction-lightningbolts .wp-block-image {
  min-width: 38px;
}

.securejobsimage img {
  margin-top: calc(-23% * 0.6 + 2em);
  padding-right: 5%;
}

.securejobstext img {
  transform: translate(-14%, -10%);
}

.wp-block-group .logos-columns {
  align-items: center !important;
}

.logo-grid-2 {
  align-items: center;
  margin-block-start: 0;
}


.efbl_feed_wraper .efbl-row-wrapper.efbl-story-wrapper {
  height: 100%;
  background: none;
  border: transparent solid 1px;
  padding: 2px;
}

/* Pagination
--------------------------------------------- */

.news-pagination {
  text-align: center;
  font-weight: 700;
  margin: 1em 0;
}

.page-numbers {
  padding: 0;
  text-align: right;
  list-style: none;
  margin: 0px;
  display: inline-block;
}
.page-numbers li {
  display: inline-block;
  width: 1.2em;
  height: 1.25em;
  line-height: 1.25em;
  font-weight: 600;
  margin: 0;
  text-align: center;
}

.page-numbers.current {
  text-decoration: underline;
  color: var(--wp--preset--color--primary);
}

.page-numbers a {
  color: var(--wp--preset--color--text);
}

.page-numbers li span,
.page-numbers li a {
  text-decoration: none;
}
.page-numbers li .next,
.page-numbers li .prev {
  display: block;
  position: relative;
  color: transparent;
  margin: 0px;
}

.page-numbers li .next:after,
.page-numbers li .prev:after {
  content: "";
  border-right: 0.2em solid black;
  border-bottom: 0.2em solid black;
  display: block;
  line-height: 1;
  font-weight: 400;
  font-style: normal;
  speak: never;
  text-decoration: inherit;
  text-transform: none;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 0.6em;
  height: 0.6em;
  font-size: 0.9em;
  vertical-align: top;
  text-align: center;
  transition: color 0.1s ease-in;
  position: absolute;
  top: 50%;
  left: 40%;
  transform: translate(-50%, -50%) rotate(-45deg);
  z-index: 2;
  pointer-events: none;
  cursor: pointer;
}

.page-numbers li .prev:after {
  transform: translate(-50%, -50%) rotate(135deg);
  left: 60%;
}

/* MOBILE
--------------------------------------------- */

@media only screen and (max-width: 1300px) {
  .site-header .main-content-inner .header-logo {
    flex: 0 1 200px;
  }
}

/* MENU MOBILE TRIGGER - Move last submenus to the left */

@media only screen and (max-width: 1675px) {
  .menu-container .menu .menu-item:last-child > .sub-menu {
    left: unset;
    right: 0;
  }
}

@media only screen and (max-width: 1380px) {
  .menu-container .menu .menu-item:last-child > .sub-menu .menu-item {
    position: relative;
  }

  .menu-container
    .menu
    .menu-item:last-child
    > .sub-menu
    .menu-item
    > .sub-menu {
    top: 0;
    left: 0;
    transform: translateX(-100%);
  }
}

/* MENU MOBILE TRIGGER */
@media only screen and (max-width: 1100px) {
  /* Menu - pullout */

  .menu-pullout-mask {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: var(--wp--preset--color--quaternary);
    z-index: 10;
    display: block;
  }

  .menu-pullout {
    display: block;
    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    transform: translateX(-101%);
    transition: transform 0.5s ease;
    z-index: 11;
    padding: 3em;
    box-shadow: 1px 1px 7px 0 #00000045;
    background: var(--wp--preset--color--primary);
    height: 100vh;
  }

  .menu-pullout-active {
    transform: translateX(0%);
    overflow-y: scroll;
  }

  .menu-pullout .menu-container .menu .menu-item a {
    padding: 0.25em 0em;
  }

  /* Hamburger */
  .menu-center {
    position: relative;
    width: 2.3em;
    text-align: center;
    margin: 0 auto;
    display: inline-block;
    vertical-align: middle;
    border: 2px solid white;
    border-radius: 100%;
    height: 2.3em;
    padding: 0.5em;
  }

  .menu-center:before,
  .menu-center:after,
  .menu-center div {
    background: white;
    content: "";
    display: block;
    height: 2px;
    border-radius: 0px;
    margin: 3px 0;
    margin-top: 2px;
    transition: 0.5s;
  }

  .menu-center.menu-center-active:before {
    transform: translateY(5px) rotate(135deg);
  }

  .menu-center.menu-center-active:after {
    transform: translateY(-5px) rotate(-135deg);
  }

  .menu-center.menu-center-active div {
    transform: scale(0);
  }

  .menu-center:hover {
    background: var(--wp--preset--color--tertiary);
  }

  .menu-center:hover::before,
  .menu-center:hover::after,
  .menu-center:hover div {
    background: white;
  }

  .menu-pullout-inner .menu-center:before,
  .menu-pullout-inner .menu-center:after,
  .menu-pullout-inner .menu-center div {
    background: white;
  }

  .menu-pullout-inner .menu-center {
    border-color: white;
  }

  .site-header-scrolled .menu-center:before,
  .site-header-scrolled .menu-center:after,
  .site-header-scrolled .menu-center div,
  .site-header-bg .menu-center:before,
  .site-header-bg .menu-center:after,
  .site-header-bg .menu-center div {
    background: var(--wp--preset--color--tertiary);
  }

  .site-header-scrolled .menu-center,
  .site-header-bg .menu-center {
    border-color: var(--wp--preset--color--tertiary);
  }

  .menu-pullout .menu-center {
    margin: 0 auto;
    display: block;
    margin-top: 3em;
  }

  .single-campaign .menu-center {
    z-index: 5;
    margin: 0 auto;
    display: block;
  }

  /* menu */

  .site-header .main-content .main-content-inner .header-main .header-logo {
    flex: 0 1 200px;
  }

  .menu-container .menu {
    flex-wrap: wrap;
    font-size: 16px;
  }

  .menu-container .menu .menu-item {
    flex: 1 1 100%;
    padding-right: 0px;
    padding-left: 0px;
    margin-bottom: 0.75em;
    margin-left: 0;
  }

  .menu-container .menu .menu-item a {
    display: inline-block;
  }

  .menu-container .menu .menu-item .sub-menu {
    position: relative;
    top: unset;
    left: unset;
    display: none;
    width: 100%;
    max-width: unset;
  }

  .menu-container .menu .menu-item .sub-menu li {
    margin-bottom: 0px;
  }

  .menu-container .menu .menu-item.menu-item-has-children:hover > .sub-menu {
    display: block;
    border: 0px;
    padding-left: 1em;
    border-left: 1px solid white;
  }

  .menu-container .menu .menu-item .sub-menu .menu-item .sub-menu {
    left: unset;
    top: unset;
    width: 100%;
  }

  .menu-container .menu .menu-item.menu-item-has-children::before,
  .menu-container .menu .menu-item.menu-item-has-children:hover::before {
    top: 0.831em;
  }

  .site-header
    .main-content
    .main-content-inner
    .header-main
    .menu-container
    .menu
    .menu-item
    a {
    border-right: none;
  }
}

@media only screen and (max-width: 1024px) {
  #primary .introduction-lightningbolts {
    flex-wrap: wrap !important;
  }

  #primary .introduction-lightningbolts .wp-block-column {
    flex: 1 0 100%;
  }

  .introduction-lightningbolts .wp-block-image {
    max-width: 25px;
    min-width: 25px;
  }

  .paragraph-expand {
    max-width: 100% !important;
  }
}

@media only screen and (max-width: 768px) {
  /* Font sizing
	--------------------------------------------- */
  :root {
    --wp--custom--heading--h-1: 3.5em;
    --wp--custom--heading--h-2: 3.2em;
    --wp--custom--heading--h-3: 2.5em;
    --wp--custom--heading--h-4: 2em;
    --wp--custom--heading--h-5: 1.5em;
    --wp--custom--heading--h-6: 1.25em;

    --wp--preset--font-size--s: 1.1em;
    --wp--preset--font-size--m: 1.2em;
    --wp--preset--font-size--l: 1.4em;
    --wp--preset--font-size--xl: 1.6em;
    --wp--preset--font-size--2-xl: 1.75em;

    --wp--preset--spacing--20: 1.4em;
    --wp--preset--spacing--30: 1.75em;
    --wp--preset--spacing--40: 2em;
    --wp--preset--spacing--50: 2.5em;
    --wp--preset--spacing--60: 3em;
    --wp--preset--spacing--70: 4em;
  }

  .hide-on-tablet {
    display: none;
  }

  /* Flex Styling
	--------------------------------------------- */
  body .is-layout-grid.wp-block-group-is-layout-grid {
    display: flex;
    flex-direction: column;
  }

  .header-banner .register-your-interest {
    width: 100%;
    position: relative;
    right: unset;
    bottom: unset;
    margin-top: 2.5em;
  }

  .header-banner .header-banner-image {
    width: 100%;
    padding-top: 1em;
  }

  .header-banner .register-your-interest .register-your-interest-inner {
    padding-left: 10%;
  }

  .header-banner
    .register-your-interest
    .register-your-interest-inner
    .register-your-interest-image {
    left: -31px;
    top: -29%;
    width: auto;
    height: 150%;
  }

  .header-banner h2 {
    margin-left: auto;
  }

  .register-your-interest h5 {
    font-size: 1.25em;
  }

  .introduction-image img {
    margin-top: 0em;
  }

  .securejobsimage img {
    width: 100%;
    padding-right: 0%;
  }
}

@media only screen and (max-width: 500px) {
  /* Font sizing
	--------------------------------------------- */
  :root {
    --wp--custom--heading--h-1: 2.5em;
    --wp--custom--heading--h-2: 2em;
    --wp--custom--heading--h-3: 1.75em;
    --wp--custom--heading--h-4: 1.5em;
    --wp--custom--heading--h-5: 1.25em;
    --wp--custom--heading--h-6: 1.1em;

    --wp--preset--font-size--s: 1.1em;
    --wp--preset--font-size--m: 1.2em;
    --wp--preset--font-size--l: 1.35em;
    --wp--preset--font-size--xl: 1.55em;
    --wp--preset--font-size--2-xl: 1.7em;

    --wp--preset--spacing--20: 1.25em;
    --wp--preset--spacing--30: 1.5em;
    --wp--preset--spacing--40: 1.75em;
    --wp--preset--spacing--50: 2em;
    --wp--preset--spacing--60: 2.5em;
    --wp--preset--spacing--70: 3em;
  }

  /* Flex Styling
	--------------------------------------------- */

  /* Menu
	--------------------------------------------- */
  .menu-pullout {
    padding-left: 5%;
    padding-right: 5%;
  }

  .menu-container .menu .menu-item:hover > a {
    border-bottom: unset;
  }

  .menu-container .menu .menu-item .sub-menu {
    padding-top: 0.5em;
    margin-bottom: 1em;
  }
}