/* Margin spacing */
/* Vertical */
.text-formatted [class].margin-v-0 {
  margin-top: 0;
  margin-bottom: 0;
}

.text-formatted [class].margin-v-1 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.text-formatted [class].margin-v-2 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.text-formatted [class].margin-v-3 {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

.text-formatted [class].margin-v-4 {
  margin-top: 4rem;
  margin-bottom: 4rem;
}

/* Vertical bottom only */
.text-formatted [class].margin-bottom-0 {
  margin-bottom: 0;
}

.text-formatted [class].margin-bottom-1 {
  margin-bottom: 1rem;
}

.text-formatted [class].margin-bottom-2 {
  margin-bottom: 2rem;
}

.text-formatted [class].margin-bottom-3 {
  margin-bottom: 3rem;
}

.text-formatted [class].margin-bottom-4 {
  margin-bottom: 4rem;
}

/* Vertical top only */
.text-formatted [class].margin-top-0 {
  margin-top: 0;
}

.text-formatted [class].margin-top-1 {
  margin-top: 1rem;
}

.text-formatted [class].margin-top-2 {
  margin-top: 2rem;
}

.text-formatted [class].margin-top-3 {
  margin-top: 3rem;
}

.text-formatted [class].margin-top-4 {
  margin-top: 4rem;
}

/* Horizontal */
.text-formatted .margin-h-0 {
  margin-left: 0;
  margin-right: 0;
}

.text-formatted .margin-h-1 {
  margin-left: 1rem;
  margin-right: 1rem;
}

.text-formatted .margin-h-2 {
  margin-left: 2rem;
  margin-right: 2rem;
}

.text-formatted .margin-h-3 {
  margin-left: 3rem;
  margin-right: 3rem;
}

.text-formatted .margin-h-4 {
  margin-left: 4rem;
  margin-right: 4rem;
}

/* Padding spacing */
/* Vertical */
.text-formatted .padding-v-0 {
  padding-top: 0;
  padding-bottom: 0;
}

.text-formatted .padding-v-1 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.text-formatted .padding-v-2 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.text-formatted .padding-v-3 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.text-formatted .padding-v-4 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

/* Horizontal */
.text-formatted .padding-h-0 {
  padding-left: 0;
  padding-right: 0;
}

.text-formatted .padding-h-1 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.text-formatted .padding-h-2 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.text-formatted .padding-h-3 {
  padding-left: 3rem;
  padding-right: 3rem;
}

.text-formatted .padding-h-4 {
  padding-left: 4rem;
}

.text-formatted .padding-top-0 {
  padding-top: 0;
}

.text-formatted .padding-top-1 {
  padding-top: 1rem;
}

.text-formatted .padding-top-2 {
  padding-top: 2rem;
}

.text-formatted .padding-top-3 {
  padding-top: 3rem;
}

.text-formatted .padding-top-4 {
  padding-top: 4rem;
}

.text-formatted .padding-bottom-0 {
  padding-bottom: 0;
}

.text-formatted .padding-bottom-1 {
  padding-bottom: 1rem;
}

.text-formatted .padding-bottom-2 {
  padding-bottom: 2rem;
}

.text-formatted .padding-bottom-3 {
  padding-bottom: 3rem;
}

.text-formatted .padding-bottom-4 {
  padding-bottom: 4rem;
}

/* Typography transforms */
.text-formatted .text-uppercase {
  text-transform: uppercase;
}

/* Typography colours */
.text-formatted .text-colour-primary {
  color: var(--rw-primary-color, #1e1e1e);
}

.text-formatted .text-colour-secondary {
  color: var(--rw-secondary-color, #1e1e1e);
}

.text-formatted .text-colour-highlight {
  color: var(--rw-highlight-color, #1e1e1e);
}

.text-formatted .text-colour-white {
  color: #fff;
}

.text-formatted .text-colour-black {
  color: #000;
}

/* Text shadow */
.text-shadow {
  text-shadow: 1px 1px 15px rgba(0,0,0,.9);
}

/* 
------
Button classes extended 
------
*/
.page-footer a.button {
  color: var(--rw-background-color, #ffffff);
  border-color: var(--rw-background-color, #ffffff);
  background-color: var(--rw-text-color, #00243a);
}

.button.hollow.white {
  color: #fff;
  border-color: #FFF;
}

.button.hollow.white:hover {
  background-color: #fff;
  color: #00243a;
}

/* Card type button display */
.button.button-card {
  line-height: 1.25;
  font-size: 1rem;
  padding: 1rem;
  font-weight: 700;
  box-shadow: 0px 1px 1px 1px rgb(0 0 0 / 15%);
  transition: box-shadow 0.2s ease-in;
  border-radius: 6px;
  text-transform: none;
  margin: .5rem 0;
}

.button.button-card:hover {
  box-shadow: 0px 3px 3px 1px rgb(0 0 0 / 15%);
}

.button.button-card span {
  background-image: -webkit-gradient(linear, left top, right top, from(#fff), to(#fff));
  background-image: linear-gradient(to right, #fff, #fff);
  background-position: 0 100%;
  background-size: 0 2px;
  background-repeat: no-repeat;
  -webkit-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}

.button.button-card:hover span {
  background-size: 100% 2px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

/* Coloured based of theme paletes | non hollow */
.button:not(.hollow).themed-primary {
  background-color: var(--rw-primary-color, #00243a);
}

.button:not(.hollow).themed-secondary {
  background-color: var(--rw-secondary-color, #003c69);
}

.button:not(.hollow).themed-highlight {
  background-color: var(--rw-highlight-color, #0098db);
}

.button:not(.hollow).themed-text {
  background-color: var(--rw-text-color, #1e1e1e);
}

.button:not(.hollow).themed-link {
  background-color: var(--rw-link-color, #0076d1);
}

/* Coloured based of theme paletes | hollow */
.button.hollow.themed-primary {
  border: 1px solid var(--rw-primary-color, #00243a);
  color: var(--rw-primary-color, #00243a);
}

.button.hollow.themed-secondary {
  border: 1px solid var(--rw-secondary-color, #003c69);
  color: var(--rw-secondary-color, #003c69);
}

.button.hollow.themed-highlight {
  border: 1px solid var(--rw-highlight-color, #0098db);
  color: var(--rw-highlight-color, #0098db);
}

.button.hollow.themed-text {
  border: 1px solid var(--rw-text-color, #1e1e1e);
  color: var(--rw-text-color, #1e1e1e);
}

.button.hollow.themed-link {
  border: 1px solid var(--rw-link-color, #0076d1);
  color: var(--rw-link-color, #0076d1);
}

.button[class].normal {
  text-transform: none;
}

.button[class].no-radius {
  border-radius: 0;
}


/* Colour filters */
.gray-scale {
  filter: grayscale(100%);
}

/* Menu link title base style | Once we can add classes change these */

/* alumni.uct.ac.za donate now menu link */
a[title="Donate now"],
a[title="Gold menu link"] {
  background-color: #c9b882;
}

/* Fade In Banner images */
.fadeInBanners {
  position: relative;
  aspect-ratio: 3.99145;
}

.fadeInBanners .media--type-image {
  position: absolute;
  top: 0;
  left: 0;
}

.fadeInBanners .media--type-image,
.fadeInBanners .media--type-image img {
  width: 100%;
}

/* Contact card aside information */
@media print, screen and (min-width: 64em) { 
  .contact-aside:not(.in-contact-aside) {
    width: 240px;
    float: right;
    margin-left: 1rem;
    margin-top: 0 !important;
    margin-bottom: 1rem;
  }
}