/* Colours */
/* Fluid heading sizes - set your min/max sizes and you're done! */
/* Some device sizes to use with min-width */
/* adjusted breakpoints for above */
/* 100% widths look better than "Snapping" IMO */
/* Utility */
/* Additional Spacers -- don't think you'll need more than 7, but if you do -- maybe just use a custom class  :)  */
/* Colours */
/* Fluid heading sizes - set your min/max sizes and you're done! */
/* Some device sizes to use with min-width */
/* adjusted breakpoints for above */
/* 100% widths look better than "Snapping" IMO */
/* Utility */
/* Additional Spacers -- don't think you'll need more than 7, but if you do -- maybe just use a custom class  :)  */
#banner {
  position: relative;
  overflow: hidden;
  padding-top: 200px;
  min-height: 280px;
  overflow: hidden; }
  @media (min-width: 769px) {
    #banner {
      padding-top: 250px; } }
  @media (min-width: 1025px) {
    #banner {
      min-height: 415px;
      padding-top: 250px; } }
  #banner .bg-cover {
    object-position: center bottom;
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover; }
    @media (min-width: 769px) {
      #banner .bg-cover {
        object-position: center bottom; } }
  #banner .banner-content h1 {
    color: white;
    position: relative;
    margin-bottom: 0;
    opacity: 0.75;
    line-height: 1;
    position: absolute;
    bottom: 0;
    margin-bottom: -8px;
    font-weight: 600; }
    @media (min-width: 641px) {
      #banner .banner-content h1 {
        margin-bottom: -10px; } }
    @media (min-width: 769px) {
      #banner .banner-content h1 {
        margin-bottom: -12px; } }
    @media (min-width: 1025px) {
      #banner .banner-content h1 {
        margin-bottom: -14px; } }
    @media (min-width: 1401px) {
      #banner .banner-content h1 {
        margin-bottom: -16px; } }
    @media (min-width: 1641px) {
      #banner .banner-content h1 {
        margin-bottom: -18px; } }

#excellence .img-box {
  display: flex;
  align-items: center; }
  #excellence .img-box .img-content {
    position: absolute; }
    #excellence .img-box .img-content .h1 {
      color: #ffffff;
      opacity: 0.75;
      line-height: 1.05;
      font-size: clamp(1.4375rem, calc(
 23px + (100 - 23) * ((100vw - 320px) /
 (1920 - 320))), 6.25rem); }

#excellence .bottom-content {
  padding: 56px 54px 50px;
  background-color: #f6f6f6;
  max-width: 100%;
  position: relative; }
  @media screen and (min-width: 1025px) {
    #excellence .bottom-content {
      position: absolute;
      max-width: 720px;
      right: 100px;
      bottom: -35%;
      padding: 44px 32px 44px; } }
  @media screen and (min-width: 1401px) {
    #excellence .bottom-content {
      left: 38%;
      bottom: -15%; } }
  @media screen and (min-width: 1641px) {
    #excellence .bottom-content {
      left: 44%;
      bottom: -15%; } }
  #excellence .bottom-content .h3 {
    margin-bottom: 26px; }
    @media screen and (max-width: 641px) {
      #excellence .bottom-content .h3::before {
        top: 24%; } }
    @media screen and (max-width: 1025px) {
      #excellence .bottom-content .h3 {
        font-size: 24px; }
        #excellence .bottom-content .h3::before {
          top: 28%;
          height: 3px; } }