/*	
--------------------------------------------------
Theme 
-------------------------------------------------- 
*/

/* 	
--------------------------------------------------
Table of contents
-------------------------------------------------- 

Body
Header
Footer
Generic
Base Backgrounds
- Background
- Secondary heading
- Heading
- Text
- Borders 
- Links
Base Buttons
- Background
- Borders
- Text
	
*/

/* Body */

.shadow {
  box-shadow: none !important;
}

.has-box-shadows .shadow {
  box-shadow: var(--base-box-shadow_h) var(--base-box-shadow_v) var(--base-box-shadow_b) rgba(var(--true-black), var(--base-box-shadow_o)) !important;
}

/* Color Overrides */
.text-primary {
  color: rgba(var(--base-highlight-text), 1) !important;
}

body {
  background: rgba(var(--body-bg-color1), 1);
}

body.body-bg-linear {
  background: linear-gradient(var(--body-bg-angle),
      rgba(var(--body-bg-color1), 1) 0%,
      rgba(var(--body-bg-color2), 1) 100%);
}

body.body-bg-radial {
  background: radial-gradient(farthest-side at var(--body-bg-start-perc) var(--body-bg-stop-perc),
      rgba(var(--body-bg-color1), 1) 0%,
      rgba(var(--body-bg-color2), 1) 100%);
}

/* Header */

header#site-header {
  color: rgba(var(--header-text), 1);
}

header#site-header {
  background: rgba(var(--header-bg-color1), 1);
}

header#site-header.header-bg-linear {
  background: linear-gradient(var(--header-bg-angle),
      rgba(var(--header-bg-color1), 1) 0%,
      rgba(var(--header-bg-color2), 1) 100%);
}

header#site-header.header-bg-radial {
  background: radial-gradient(farthest-side at var(--header-bg-start-perc) var(--header-bg-stop-perc),
      rgba(var(--header-bg-color1), 1) 0%,
      rgba(var(--header-bg-color2), 1) 100%);
}

header#site-header #logo a {
  color: rgba(var(--logo-link), 1);
}

header#site-header #logo a:hover,
header#site-header #logo a:focus,
header#site-header #logo a:active {
  color: rgba(var(--logo-link-hover), 1);
}

/* Footer */

footer#site-footer {
  color: rgba(var(--footer-text), 1);
}

footer#site-footer {
  background: rgba(var(--footer-bg-color1), 1);
}

footer#site-footer.footer-bg-linear {
  background: linear-gradient(var(--footer-bg-angle),
      rgba(var(--footer-bg-color1), 1) 0%,
      rgba(var(--footer-bg-color2), 1) 100%);
}

footer#site-footer.footer-bg-radial {
  background: radial-gradient(farthest-side at var(--footer-bg-start-perc) var(--footer-bg-stop-perc),
      rgba(var(--footer-bg-color1), 1) 0%,
      rgba(var(--footer-bg-color2), 1) 100%);
}

/* mail button has too much letter spacing */
@media (max-width: 575px) {
  footer#site-footer a[rel~="long-link-custom"] {
    letter-spacing: 0px !important;
  }
}

/*	
--------------------------------------------------
White and Black
-------------------------------------------------- 
*/

.white-bg {
  background: rgba(var(--true-white), 1);
}

.white-text {
  color: rgba(var(--true-white), 1);
}

.black-bg {
  background: rgba(var(--true-black), 1);
}

.black-text {
  color: rgba(var(--true-black), 1);
}

/*	
--------------------------------------------------
Base Colours - Backgrounds
-------------------------------------------------- 
*/

/* Backgrounds */

/* Backgrounds Solid */
.base-bg,
.item.item_overlay .inner .image.base-bg::before,
.usn_cmp_banner .item.item_overlay.base-bg .inner::before {
  background: rgba(var(--base-bg-color1), 1);
}

/* Backgrounds Linear */

.base-bg.base-bg-linear,
.item.item_overlay .inner .image.base-bg.base-bg-linear::before,
.usn_cmp_banner .item.item_overlay.base-bg.base-bg-linear .inner::before {
  background: linear-gradient(var(--base-bg-angle),
      rgba(var(--base-bg-color1), 1) 0%,
      rgba(var(--base-bg-color2), 1) 100%);
}

/* Backgrounds Radial */

.base-bg.base-bg-radial,
.item.item_overlay .inner .image.base-bg.base-bg-radial::before,
.usn_cmp_banner .item.item_overlay.base-bg.base-bg-radial .inner::before {
  background: radial-gradient(farthest-side at var(--base-bg-start-perc) var(--base-bg-stop-perc),
      rgba(var(--base-bg-color1), 1) 0%,
      rgba(var(--base-bg-color2), 1) 100%);
}

/* Tables */

table,
table tr:nth-of-type(even) td,
.tables table tr:nth-of-type(even) td {
  background: transparent;
}

/* Headings */

h1:not(.heading),
h2:not(.heading),
h3:not(.heading),
h4:not(.heading),
h5:not(.heading),
h6:not(.heading),
thead {
  color: rgba(var(--base-heading), 1);
}

.base-heading {
  color: rgba(var(--base-heading), 1) !important;
}

/* Secondary Headings */

.base-secondary-heading {
  color: rgba(var(--base-secondary-heading), 1) !important;
}

/* Text */

/* TODO WARNING TODO WARNING */
/* body,
.base-text {
    color: rgba(var(--base-text), 1);
} */

/* Text selection */

::selection {
  color: unset !important;
  background-color: rgba(var(--base-highlight), 1) !important;
}

/* Borders */

.base-borders,
table,
table th,
table td {
  border-color: rgba(var(--base-borders), 1);
}

thead,
.quick-links ul li a::after {
  background-color: rgba(var(--base-borders), 1);
}

.component-border {
  border-bottom: 1px solid rgba(221, 221, 221, 1);
}

/* Links */

a,
.base-link,
.base-bg a:not(.btn),
.base-text a:not(.btn),
.base-bg .base-text a:not(.btn) {
  color: rgba(var(--base-link), 1);
}

a:hover,
a:focus,
a:active,
.base-link:hover,
.base-link:focus,
.base-link:active,
.base-bg a:not(.btn):hover,
.base-bg a:not(.btn):focus,
.base-bg a:not(.btn):active,
.base-text a:not(.btn):hover,
.base-text a:not(.btn):focus,
.base-text a:not(.btn):active,
.base-bg .base-text a:not(.btn):hover,
.base-bg .base-text a:not(.btn):focus,
.base-bg .base-text a:not(.btn):active {
  color: rgba(var(--base-link-hover), 1);
}

/* Highlights */

.base-highlight-bg {
  background-color: rgba(var(--base-highlight), 1);
}

blockquote::before,
.base-bg blockquote::before,
.component .component.base-bg div>blockquote::before {
  color: rgba(var(--base-highlight), 1);
}

/* Used in rich text editors */

.heading {
  color: rgba(var(--base-heading), 1);
}

.secondary-heading {
  color: rgba(var(--base-secondary-heading), 1);
}

blockquote,
.quote {
  color: rgba(var(--base-heading), 1);
}

blockquote::before,
.quote::before {
  color: rgba(var(--base-highlight), 1);
}

.base-highlight-text,
.label.item-label.base-label-text {
  color: rgba(var(--base-highlight-text), 1);
}

.base-bg .label:not(.item-label),
.label.item-label.base-label-bg {
  background-color: rgba(var(--base-highlight), 1);
  color: rgba(var(--base-highlight-text), 1);
}

/*	
--------------------------------------------------
Buttons
-------------------------------------------------- 
*/
@media (max-width: 768px) {

  .component-introduction .intro-wrapper .intro-right,
  .component-outro .intro-wrapper .intro-right {
    align-self: center !important;
  }

  .component-introduction .intro-wrapper,
  .component-outro .intro-wrapper {
    align-items: center !important;
  }
}

/*	
--------------------------------------------------
Base Colours - Buttons
-------------------------------------------------- 
*/

/* Solid Buttons */
.btn.base-btn-bg,
.btn-bg_base-btn-bg .btn {
  background: rgba(var(--base-btn-bg-color1), 1);
}

.base-btn-bg:hover,
.btn-bg_base-btn-bg .btn:hover,
.btn.base-btn-bg:focus,
.btn-bg_base-btn-bg .btn:focus,
.btn.base-btn-bg:active,
.btn-bg_base-btn-bg .btn:active {
  background: rgba(var(--base-btn-bg-color1), 1);
}

/* Linear Buttons */
.btn.base-btn-bg.base-btn-bg-linear,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-linear .btn {
  background: linear-gradient(var(--base-btn-bg-angle),
      rgba(var(--base-btn-bg-color1), 1) 0%,
      rgba(var(--base-btn-bg-color2), 1) 100%);
}

.base-btn-bg.base-btn-bg-linear:hover,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-linear .btn:hover,
.btn.base-btn-bg.base-btn-bg-linear:focus,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-linear .btn:focus,
.btn.base-btn-bg.base-btn-bg-linear:active,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-linear .btn:active {
  background: linear-gradient(var(--base-btn-bg-angle),
      rgba(var(--base-btn-bg-color1), 1) 0%,
      rgba(var(--base-btn-bg-color2), 1) 100%);
}

/* Radial Buttons */
.btn.base-btn-bg.base-btn-bg-radial,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-radial .btn {
  background: radial-gradient(farthest-side at var(--base-btn-bg-start-perc) var(--base-btn-bg-stop-perc),
      rgba(var(--base-btn-bg-color1), 1) 0%,
      rgba(var(--base-btn-bg-color2), 1) 100%);
}

.base-btn-bg.base-btn-bg-radial:hover,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-radial .btn:hover,
.btn.base-btn-bg.base-btn-bg-radial:focus,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-radial .btn:focus,
.btn.base-btn-bg.base-btn-bg-radial:active,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-radial .btn:active {
  background: radial-gradient(farthest-side at var(--base-btn-bg-start-perc) var(--base-btn-bg-stop-perc),
      rgba(var(--base-btn-bg-color1), 1) 0%,
      rgba(var(--base-btn-bg-color2), 1) 100%);
}

/* Solid Buttons - inner <span> hover */
.btn.base-btn-bg-hover:hover>span,
.btn.base-btn-bg-hover:focus>span,
.btn.base-btn-bg-hover:active>span,
.btn-bg_base-btn-bg-hover .btn:hover>span,
.btn-bg_base-btn-bg-hover .btn:focus>span,
.btn-bg_base-btn-bg-hover .btn:active>span,
a:hover .btn.base-btn-bg-hover>span,
a:focus .btn.base-btn-bg-hover>span,
a:active .btn.base-btn-bg-hover>span,
.btn.base-btn-bg-hover-solid:hover>span,
.btn.base-btn-bg-hover-solid:focus>span,
.btn.base-btn-bg-hover-solid:active>span,
.btn-bg_base-btn-bg-hover-solid .btn:hover>span,
.btn-bg_base-btn-bg-hover-solid .btn:focus>span,
.btn-bg_base-btn-bg-hover-solid .btn:active>span,
a:hover .btn.base-btn-bg-hover-solid>span,
a:focus .btn.base-btn-bg-hover-solid>span,
a:active .btn.base-btn-bg-hover-solid>span {
  background: rgba(var(--base-btn-bg-hover-color1), 0.3) !important;
}

/* Linear Buttons - inner <span> hover */
.btn.base-btn-bg.base-btn-bg-hover-linear:hover>span,
.btn.base-btn-bg.base-btn-bg-hover-linear:focus>span,
.btn.base-btn-bg.base-btn-bg-hover-linear:active>span,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-hover-linear .btn:hover>span,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-hover-linear .btn:focus>span,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-hover-linear .btn:active>span,
a:hover .btn.base-btn-bg.base-btn-bg-hover-linear>span,
a:focus .btn.base-btn-bg.base-btn-bg-hover-linear>span,
a:active .btn.base-btn-bg.base-btn-bg-hover-linear>span {
  background: linear-gradient(var(--base-btn-bg-hover-angle),
      rgba(var(--base-btn-bg-hover-color1), 1) 0%,
      rgba(var(--base-btn-bg-hover-color2), 1) 100%);
}

/* Radial Buttons - inner <span> hover */
.btn.base-btn-bg.base-btn-bg-hover-radial:hover>span,
.btn.base-btn-bg.base-btn-bg-hover-radial:focus>span,
.btn.base-btn-bg.base-btn-bg-hover-radial:active>span,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-hover-radial .btn:hover>span,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-hover-radial .btn:focus>span,
.btn-bg_base-btn-bg.btn-bg_base-btn-bg-hover-radial .btn:active>span,
a:hover .btn.base-btn-bg.base-btn-hover-bg-radial>span,
a:focus .btn.base-btn-bg.base-btn-hover-bg-radial>span,
a:active .btn.base-btn-bg.base-btn-hover-bg-radial>span {
  background: radial-gradient(farthest-side at var(--base-btn-bg-hover-start-perc) var(--base-btn-bg-hover-stop-perc),
      rgba(var(--base-btn-bg-hover-color1), 1) 0%,
      rgba(var(--base-btn-bg-hover-color2), 1) 100%);
}

/* Button Borders */

.btn.base-btn-borders,
.btn-borders_base-btn-borders .btn {
  border-color: rgba(var(--base-btn-borders), 1);
}

/* Button Borders Hover */

.btn.base-btn-borders:hover,
.btn-borders_base-btn-borders .btn:hover,
.btn.base-btn-borders:focus,
.btn-borders_base-btn-borders .btn:focus,
.btn.base-btn-borders:active,
.btn-borders_base-btn-borders .btn:active,
a:hover .btn.base-btn-borders,
a:focus .btn.base-btn-borders,
a:active .btn.base-btn-borders {
  border-color: rgba(var(--base-btn-borders-hover), 1);
}

/* Button Text */

.btn.base-btn-text,
.btn-text_base-btn-text .btn {
  color: rgba(var(--base-btn-text), 1);
}

/* Button Text Hover */

.btn.base-btn-text:hover,
.btn-text_base-btn-text .btn:hover,
.btn.base-btn-text:focus,
.btn-text_base-btn-text .btn:focus,
.btn.base-btn-text:active,
.btn-text_base-btn-text .btn:active,
a:hover .btn.base-btn-text,
a:focus .btn.base-btn-text,
a:active .btn.base-btn-text {
  color: rgba(var(--base-btn-text-hover), 1);
}

/* Umbraco Form input submit button hovers */
/* Required so we do not change the HTML of Umbraco Forms source */
.umbraco-forms .btn-bg_base-btn-bg input[type="submit"]:active,
.umbraco-forms .btn-bg_base-btn-bg input[type="submit"]:focus,
.umbraco-forms .btn-bg_base-btn-bg input[type="submit"]:hover {
  /* background: rgba(var(--base-btn-bg-hover-color1), 1);
  color: rgba(var(--base-btn-text-hover), 1);
  border-color: rgba(var(--base-btn-borders-hover), 1); */
}

.umbraco-forms .btn-bg_base-btn-bg.base-btn-bg-hover-linear input[type="submit"]:active,
.umbraco-forms .btn-bg_base-btn-bg.base-btn-bg-hover-linear input[type="submit"]:focus,
.umbraco-forms .btn-bg_base-btn-bg.base-btn-bg-hover-linear input[type="submit"]:hover {
  background: linear-gradient(var(--base-btn-bg-hover-angle),
      rgba(var(--base-btn-bg-hover-color1), 1) 0%,
      rgba(var(--base-btn-bg-hover-color2), 1) 100%);
}

.umbraco-forms .btn-bg_base-btn-bg.base-btn-bg-hover-radial input[type="submit"]:active,
.umbraco-forms .btn-bg_base-btn-bg.base-btn-bg-hover-radial input[type="submit"]:focus,
.umbraco-forms .btn-bg_base-btn-bg.base-btn-bg-hover-radial input[type="submit"]:hover {
  background: radial-gradient(farthest-side at var(--base-btn-bg-hover-start-perc) var(--base-btn-bg-hover-stop-perc),
      rgba(var(--base-btn-bg-hover-color1), 1) 0%,
      rgba(var(--base-btn-bg-hover-color2), 1) 100%);
}

/*Red button*/
.btn.c2-btn-bg-hover-solid {
  background-color: rgba(255, 255, 255, 0) !important;
}

.btn.c2-btn-bg-hover-solid span {
  display: none;
}

/*Blue button*/
.btn.c4-btn-bg-hover-solid {
  background-color: rgba(255, 255, 255, 0) !important;
}

.btn.c4-btn-bg-hover-solid span {
  display: none;
}

/*Black button*/
.btn.c6-btn-bg-hover-solid {
  background-color: rgba(255, 255, 255, 0) !important;
}

.btn.c6-btn-bg-hover-solid span {
  display: none;
}

/*base button*/
.btn.base-btn-bg {
  background-color: rgba(255, 255, 255, 0) !important;
}

.base-btn-bg:hover {
  background-color: rgba(255, 255, 255, 0) !important;
}

.base-btn-bg:hover span {
  background-color: rgba(255, 255, 255, 0) !important;
}

.umbraco-forms .btn-bg_base-btn-bg.base-btn-bg-hover-radial input[type="submit"]:hover {
  background: radial-gradient(farthest-side at var(--base-btn-bg-hover-start-perc) var(--base-btn-bg-hover-stop-perc),
      rgba(var(--base-btn-bg-hover-color1), 1) 0%,
      rgba(var(--base-btn-bg-hover-color2), 1) 100%);
}

.umbraco-forms .umbraco-form-inner .umbraco-forms-submitmessage-html {
  max-width: 548px;
  padding: var(--spacing-xl);
}

.umbraco-forms .umbraco-form-inner:has(#umbraco-forms-form-submitted) {
  box-shadow: none !important;
}

/* custom spacing utilities */

/* 10px */
.mt-10 {
  margin-top: 10px !important;
}

/* 32px */
.m-32 {
  margin: 32px !important;
}

.mt-32 {
  margin-top: 32px !important;
}

.mb-32 {
  margin-bottom: 32px !important;
}

.ms-32 {
  margin-left: 32px !important;
}

.me-32 {
  margin-right: 32px !important;
}

.mx-32 {
  margin-left: 32px !important;
  margin-right: 32px !important;
}

.my-32 {
  margin-top: 32px !important;
  margin-bottom: 32px !important;
}

.p-32 {
  padding: 32px !important;
}

.pt-32 {
  padding-top: 32px !important;
}

.pb-32 {
  padding-bottom: 32px !important;
}

.ps-32 {
  padding-left: 32px !important;
}

.pe-32 {
  padding-right: 32px !important;
}

.px-32 {
  padding-left: 32px !important;
  padding-right: 32px !important;
}

.py-32 {
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

@media (min-width: 768px) {
  .mt-md-0 {
    margin-top: 0px !important;
  }

  .mt-md-10 {
    margin-top: 10px !important;
  }

  .pt-md-32 {
    padding-top: 32px !important;
  }

  .m-md-32 {
    margin: 32px !important;
  }

  .mt-md-32 {
    margin-top: 32px !important;
  }

  .mb-md-32 {
    margin-bottom: 32px !important;
  }

  .ms-md-32 {
    margin-left: 32px !important;
  }

  .me-md-32 {
    margin-right: 32px !important;
  }

  .mx-md-32 {
    margin-left: 32px !important;
    margin-right: 32px !important;
  }

  .my-md-32 {
    margin-top: 32px !important;
    margin-bottom: 32px !important;
  }

  .mb-md-36 {
    margin-bottom: 36px !important;
  }

  .pb-md-36 {
    padding-bottom: 36px !important;
  }

  .py-md-36 {
    padding-top: var(--spacing-2xl) !important;
    padding-bottom: var(--spacing-2xl) !important;
  }
}

@media (max-width: 768px) {
  .py-md-36 {
    padding-top: var(--spacing-2xl) !important;
    padding-bottom: var(--spacing-2xl) !important;
  }
}

@media (min-width: 1200px) {
  .ps-xl-32 {
    padding-left: 32px !important;
  }

  .pe-xl-32 {
    padding-right: 32px !important;
  }

  .py-lg-96 {
    padding-top: 96px !important;
    padding-bottom: 96px !important;
  }
}

@media (max-width: 1200px) {
  .rounded-36 {
    border-radius: 36px !important;
  }
}

/* 64px */
.ms-64 {
  margin-left: 64px !important;
}

.mb-n-90 {
  margin-bottom: -90px !important;
}

/**************************** USN BLOG OVERRIDE ****************************/
@media (max-width: 768px) {
  .article-wrapper {
    padding-bottom: 48px !important;
  }
}

/**************************** CUSTOM STYLES ****************************/
.customBanner_wrapper {
  background-color: transparent !important;
  border-radius: 0 !important;
  height: 100% !important;
}

.customBanner_wrapper .image {
  border-radius: 0 !important;
}

.customBanner_wrapper::before {
  padding: 0 !important;
}

/**************************** NEGATIVE MARGIN TOP SECTION ****************************/

/* xs */
@media (max-width: 767px) {
  .overlap {
    z-index: 1;
    margin: 0px !important;
  }
}

/* md */
@media (min-width: 768px) {
  .overlap {
    padding-top: 0px !important;
    z-index: 1000;
  }

  section.overlap {
    background-color: transparent !important;
  }
}

/**************************** SQUARE GRID PATTERN ****************************/
.square-pattern {
  position: absolute;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(3, 1fr);
  padding: 0;
  max-width: 320px;
  width: 22.5%;
  right: 0;
  bottom: 0;
}

.square-pattern.top {
  top: 0;
  bottom: unset;
}

.sq {
  aspect-ratio: 1 / 1;
}

/* SQUARES */

/* WHITE MODE */
.square-pattern.white .sq0,
.square-pattern.white .sq1,
.square-pattern.white .sq2,
.square-pattern.white .sq3 {
  background: rgba(255, 255, 255, 0.5);
}

.square-pattern.white .sq4,
.square-pattern.white .sq5 {
  background: rgba(255, 255, 255, 0.8);
}

.square-pattern.white .sq6 {
  background: rgba(255, 255, 255, 1);
}

/* BLUE MODE */
.square-pattern.blue .sq0,
.square-pattern.blue .sq1,
.square-pattern.blue .sq2,
.square-pattern.blue .sq3 {
  background: rgba(0, 131, 202, 0.5);
}

.square-pattern.blue .sq4,
.square-pattern.blue .sq5 {
  background: rgba(0, 131, 202, 0.8);
}

.square-pattern.blue .sq6 {
  background: rgba(0, 131, 202, 1);
}

/* DARK BLUE MODE */
.square-pattern.dark-blue .sq0,
.square-pattern.dark-blue .sq1,
.square-pattern.dark-blue .sq2,
.square-pattern.dark-blue .sq3 {
  background: rgba(0, 76, 122, 0.5);
}

.square-pattern.dark-blue .sq4,
.square-pattern.dark-blue .sq5 {
  background: rgba(0, 76, 122, 0.8);
}

.square-pattern.dark-blue .sq6 {
  background: rgba(0, 76, 122, 1);
}

/* BLUE, RED, GREEN MODE */
/* blue */
.square-pattern.blue-red-green .sq1 {
  background: rgba(0, 131, 202, 0.5);
}

/* red */
.square-pattern.blue-red-green .sq2 {
  background: rgba(237, 28, 36, 0.5);
}

/* green */
.square-pattern.blue-red-green .sq3 {
  background: rgba(0, 169, 157, 0.5);
}

.square-pattern.blue-red-green .sq0 {
  background: rgba(255, 255, 255, 0.2);
}

.square-pattern.blue-red-green .sq4,
.square-pattern.blue-red-green .sq5 {
  background: rgba(255, 255, 255, 0.5);
}

.square-pattern.blue-red-green .sq6 {
  background: rgba(255, 255, 255, 0.8);
}


.square-pattern .sq0 {
  grid-column: 1;
  grid-row: 2;
}

.square-pattern .sq1 {
  grid-column: 4;
  grid-row: 1;
}

.square-pattern .sq2 {
  grid-column: 3;
  grid-row: 2;
}

.square-pattern .sq3 {
  grid-column: 2;
  grid-row: 3;
}

.square-pattern .sq4 {
  grid-column: 4;
  grid-row: 2;
}

.square-pattern .sq5 {
  grid-column: 3;
  grid-row: 3;
}

.square-pattern .sq6 {
  grid-column: 4;
  grid-row: 3;
}

/* Squares top position */
.square-pattern.top .sq0 {
  grid-column: 1;
  grid-row: 2;
}

.square-pattern.top .sq1 {
  grid-column: 4;
  grid-row: 3;
}

.square-pattern.top .sq2 {
  grid-column: 3;
  grid-row: 2;
}

.square-pattern.top .sq3 {
  grid-column: 2;
  grid-row: 1;
}

.square-pattern.top .sq4 {
  grid-column: 4;
  grid-row: 2;
}

.square-pattern.top .sq5 {
  grid-column: 3;
  grid-row: 1;
}

.square-pattern.top .sq6 {
  grid-column: 4;
  grid-row: 1;
}

@media (max-width: 767px) {
  .square-pattern {
    width: 40%;
    max-width: none;
  }
}

/**************************** EMPLOYEE CARD ****************************/
.usn_pod_employeecard.item p {
  color: rgba(var(--base-text), 1) !important;
}

.usn_pod_employeecard.item a {
  color: rgba(var(--base-link), 1) !important;
}

.usn_pod_employeecard.item a:hover {
  color: rgba(var(--base-link-hover), 1) !important;
}

/**************************** FULL BORDERS CARDS ****************************/
/* .items_border_full .item .testimonial-card-inner {
  flex: 1;
  border: solid 1px rgba(var(--border-color), 1);
} */

.items_border_full .component-main>.item,
.items_border_full .component-main .slick-list .slick-track>.item {
  border: 1px solid rgba(var(--border-color), 1) !important;
}

/**************************** INNER BORDERS CARDS ****************************/
.border_inner .component-main {
  overflow: hidden;
  row-gap: 1px;
}

.border_inner .component-main .item {
  position: relative;
}

.border_inner .component-main .item::after {
  content: "";
  position: absolute;
  right: -2px;
  background-color: rgba(var(--border-color), 1);
  z-index: 100;
}

.border_inner .component-main .item::before {
  content: "";
  position: absolute;
  background-color: rgba(var(--border-color), 1);
  z-index: 100;
  height: 1px;
  bottom: -1px;
  left: 0;
  right: 0;
}

@media (max-width: 768px) {
  .border_inner .component-main .item::before {
    content: "";
    position: absolute;
    background-color: rgba(var(--border-color), 1);
    z-index: 100;
    height: 1px;
    bottom: -1px;
    /* left: var(--spacing-2xl);
    right: var(--spacing-2xl); */
  }
}

.border_inner .component-main .item::after {
  height: 100%;
  width: 1px;
  top: 0;
}

@media (max-width: 767px) {
  .border_inner .component-main .item:last-of-type:after {
  display: none;
}
}

.border_inner .component-main.slides .item::before {
  display: none !important;
}

@media (max-width: 576px) {
  .border_inner .component-main .item>.inner {
    padding-left: 0px;
  }
}

@media (min-width: 991px) {
  .border_inner .component-main .item.items-2:nth-child(2n)::after,
  .border_inner .component-main .item.items-3:nth-child(3n)::after,
  .border_inner .component-main .item.items-4:nth-child(4n)::after {
    display: none;
  }
}

/**************************** NEWS LISTING ****************************/
.news_wrapper {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto auto;
}

.news_wrapper>.news_with_image .content {
  padding: var(--spacing-2xl);
}

.news_wrapper>.news,
.news_wrapper>.e_news {
  padding: var(--spacing-2xl);
}

.news_wrapper>.news_with_image p,
.news_wrapper>.news p,
.news_wrapper>.e_news p {
  padding-bottom: var(--spacing-2xl);
}

.news_wrapper>.e_news {
  background: rgba(var(--base-highlight-text), 1);
}

.news_wrapper>.news_with_image>.img_wrapper {
  aspect-ratio: 4 / 3;
}

.news_wrapper>.news_with_image>.img_wrapper img {
  object-position: center;
}

.news_wrapper>.news .date,
.news_wrapper>.news_with_image .date {
  font-size: 0.8125rem;
  font-weight: 700;
  padding: 0 0 var(--spacing-m) 0;
  letter-spacing: 1.15px;
  color: rgba(var(--base-highlight-text), 1);
}

.news_wrapper>.news h3 {
  font-size: 1.5625rem;
  padding-bottom: var(--spacing-2xl);
}

.news_wrapper>.e_news h3,
.news_wrapper>.news_with_image .content h3 {
  font-size: 1.5625rem;
  padding-bottom: var(--spacing-l);
}

.news_wrapper>.e_news>.description,
.news_wrapper>.news_with_image>.content>.description {
  margin: 0 0 32px 0;
}

@media (max-width: 768px) {
  .news_wrapper {
    margin: auto;
    grid-template-columns: 1fr;
  }

  .news_wrapper>.news,
  .news_wrapper>.e_news,
  .news_wrapper>.news_with_image .content {
    padding: 24px;
  }

  .news_wrapper>.news .date,
  .news_wrapper>.news_with_image .date {
    font-size: 0.8125rem;
  }

  .news_wrapper>.news h3 {
    font-size: 1.3125rem;
  }

  .news_wrapper>.e_news h3,
  .news_wrapper>.news_with_image .content h3 {
    font-size: 1.3125rem;
  }

  .news_wrapper>.e_news>.description,
  .news_wrapper>.news_with_image>.content>.description {
    margin: 0 0 24px 0;
  }

  .news_wrapper>.e_news>.description,
  .news_wrapper>.news_with_image>.content>.description {
    font-size: 0.875rem;
    margin: 0 0 24px 0;
  }
}

.pt-2rem {
  padding-top: 2rem;
}

.pb-2rem {
  padding-bottom: 2rem;
}

.p-2rem {
  padding: 2rem;
}

.py-2rem {
  padding-bottom: 2rem;
  padding-top: 2rem;
}

.px-2rem {
  padding-left: 2rem;
  padding-right: 2rem;
}

/**************************** INDEX PRICING SLIDER ****************************/
.usn_cmp_fundperformacne .component-outro,
.usn_cmp_fundperformacne .component-intro {
  width: 100%;
}

.index_prices {
  width: 100%;
  overflow: hidden;
}

/* @media (max-width: 768px) {
  .index_prices {
    padding-bottom: var(--spacing-2xl);
  }
} */

.track {
  display: flex;
  width: max-content;
  animation: scroll 50s linear infinite;
  will-change: transform;
}

.track:hover,
.track:focus {
  animation-play-state: paused;
}

.index_prices .triglav_index {
  padding: 16px 24px;
  border-left: solid 1px #ddd;
}

.index_prices .triglav_index>p {
  font-weight: 700;
  line-height: 150%;
  color: rgba(var(--base-heading), 1) !important;
}

.index_prices .triglav_index .content {
  display: flex;
  gap: 12px;
}

.index_prices .triglav_index .content p {
  color: rgba(var(--base-text), 1) !important;
  margin: 0;
}

.index_prices .triglav_index .content svg {
  margin-bottom: 4px;
}

.index_prices .triglav_index .content svg.negative {
  transform: rotate(180deg);
}

.index_prices .triglav_index .content p>span {
  line-height: 150%;
  font-weight: bold;
}

@keyframes scroll {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(-50%, 0, 0);
  }
}

@media (max-width: 768px) {
  .index_prices .triglav_index {
    padding: 12px 16px;
    border-left: solid 1px #ddd;
  }

  .index_prices .triglav_index>p {
    font-size: 0.875rem;
    margin-bottom: 2px !important;
  }

  .index_prices .triglav_index .content p {
    font-size: 0.875rem;
    line-height: 150%;
  }

  /* .news_wrapper {
    padding-left: var(--spacing-l);
    padding-right: var(--spacing-l);
  } */
  .usn_cmp_newslist .container {
    padding-left: var(--spacing-2xl) !important;
    padding-right: var(--spacing-2xl) !important;
  }

  /* .usn_cmp_newslist .listing_basic-grid {
    padding-left: var(--spacing-l);
    padding-right: var(--spacing-l);
  } */
}

@media (min-width: 1200px) {
  .col-xl-3 {
    flex: 0 0 auto;
    width: 33%;
  }
}

/* .shadow {
    box-shadow: 0 0 24px rgba(0, 0, 0, 0.15) !important;
} */

@media (min-width: 1200px) {
  .w-lg-50 {
    width: 50% !important;
    max-width: 50%;
  }
}

/**************************** RTE ICON LINKS ****************************/
.rte-icon-links a img {
  height: 32px;
}

/**************************** TEL INPUT DROPDOWN ****************************/
.iti__country-name {
  color: rgba(var(--base-text), 1) !important;
}

.iti__selected-flag {
  background-color: transparent !important;
}

.iti__country-list {
  z-index: 100 !important;
  width: 250px;
}

@media (min-width: 1200px) {
  .iti__country-list {
    width: 320px;
  }
}

/* Intro-Outro wrapper for component with that feature */
.intro-wrapper .secondary-heading {
  padding-bottom: var(--spacing-m);
}

.intro-wrapper h2 {
  padding-bottom: var(--spacing-xl);
}

.intro-wrapper .text {
  padding-bottom: var(--spacing-xl);
}

.intro-wrapper h2:only-child {
  padding-bottom: 0;
}
