p {
  margin-bottom: 0;
}

html {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-size: 22px;
  font-family: Calibre, Helvetica, sans-serif;
}

@media (max-width: 1599px) {
  html {
    font-size: 20px;
  }
}

@media (max-width: 1023px) {
  html {
    font-size: 18px;
  }
}

a {
  outline: none;
  color: inherit;
}


.clearfix:after {
  content: " ";
  height: 0;
  display: block;
  clear: both;
}


/*
 * .richtext is basically just useful for removing margin top on the first p,
 * since wagtail puts everything in a p.
 */

.richtext a {
  color: inherit;
  text-decoration: underline;
  text-decoration-skip: ink;
}

.richtext *:first-child {
  margin-top: 0;
}

.richtext h2 {
  line-height: 1.2;
}

.richtext a[href^="https://"]:not([href*="mca.com.au"]):after {
  content: ' ';
  background: url('./images/external_icon.png') center/18px no-repeat;
  width: 20px;
  height: 20px;
  display: inline-block;
  vertical-align: middle;
}

.richtext blockquote:before {
  content: '\201C';
  font-size: 5rem;
  display: block;
  position: absolute;
  pointer-events: none;
  top: -4rem;
  left: 0;
}

.richtext blockquote {
  position: relative;
  margin: 4rem 0 3rem;
  padding: 0;
  font-size: 1.5rem;
}

.richtext blockquote:after {
  content: '\2014';
  font-size: 2rem;
  display: block;
  position: absolute;
  pointer-events: none;
  bottom: -3rem;
  left: 0;
}



.row {
  margin: 0 auto;
  width: calc(100% - 21px);/* 28 - 3.5*2  (col padding is 3.5px)*/
}

.row:after {
  content: " ";
  clear: both;
  height: 0;
  display: block;
}

@media (min-width: 768px)  { .row { width: calc(100% - 20px) } }/*32 - 12*/
@media (min-width: 1024px) { .row { width: calc(100% - 180px) } }/*200 - 20*/
@media (min-width: 1600px) { .row { width: calc(100% - 215px) } }/*240 - 25*/
@media (min-width: 1840px) { .row { width: 1625px } }/*1600 + 25*/


.col_1, .col_2, .col_3, .col_4, .col_5, .col_6, .col_7, .col_8, .col_9, .col_10, .col_11, .col_12 {
  padding: 0 3.5px;
  float: left;
  box-sizing: border-box;
}
@media (min-width: 768px) {
  .col_1, .col_2, .col_3, .col_4, .col_5, .col_6, .col_7, .col_8, .col_9, .col_10, .col_11, .col_12 {
    padding: 0 6px;
  }
}
@media (min-width: 1024px) {
  .col_1, .col_2, .col_3, .col_4, .col_5, .col_6, .col_7, .col_8, .col_9, .col_10, .col_11, .col_12 {
    padding: 0 10px;
  }
}
@media (min-width: 1600px) {
  .col_1, .col_2, .col_3, .col_4, .col_5, .col_6, .col_7, .col_8, .col_9, .col_10, .col_11, .col_12 {
    padding: 0 12.5px;
  }
}



.col_1 { width: 8.333%; }
.col_2 { width: 16.667%; }
.col_3 { width: 25%; }
.col_4 { width: 33.333%; }
.col_5 { width: 41.667%; }
.col_6 { width: 50%; }
.col_7 { width: 58.333%; }
.col_8 { width: 66.667%; }
.col_9 { width: 75%; }
.col_10 { width: 83.333%; }
.col_11 { width: 91.667%; }
.col_12 { width: 100%; }

.offset_1 { margin-left: 8.333%; }
.offset_2 { margin-left: 16.667%; }
.offset_3 { margin-left: 25%; }
.offset_4 { margin-left: 33.333%; }
.offset_5 { margin-left: 41.667%; }
.offset_6 { margin-left: 50%; }
.offset_7 { margin-left: 58.333%; }
.offset_8 { margin-left: 66.667%; }
.offset_9 { margin-left: 75%; }
.offset_10 { margin-left: 83.333%; }
.offset_11 { margin-left: 91.667%; }
.offset_12 { margin-left: 100%; }


@media (max-width: 767px) {
  .sm_col_1 { width: 8.333%; }
  .sm_col_2 { width: 16.667%; }
  .sm_col_3 { width: 25%; }
  .sm_col_4 { width: 33.333%; }
  .sm_col_5 { width: 41.667%; }
  .sm_col_6 { width: 50%; }
  .sm_col_7 { width: 58.333%; }
  .sm_col_8 { width: 66.667%; }
  .sm_col_9 { width: 75%; }
  .sm_col_10 { width: 83.333%; }
  .sm_col_11 { width: 91.667%; }
  .sm_col_12 { width: 100%; }

  .sm_offset_0 { margin-left: 0%; }
  .sm_offset_1 { margin-left: 8.333%; }
  .sm_offset_2 { margin-left: 16.667%; }
  .sm_offset_3 { margin-left: 25%; }
  .sm_offset_4 { margin-left: 33.333%; }
  .sm_offset_5 { margin-left: 41.667%; }
  .sm_offset_6 { margin-left: 50%; }
  .sm_offset_7 { margin-left: 58.333%; }
  .sm_offset_8 { margin-left: 66.667%; }
  .sm_offset_9 { margin-left: 75%; }
  .sm_offset_10 { margin-left: 83.333%; }
  .sm_offset_11 { margin-left: 91.667%; }
  .sm_offset_12 { margin-left: 100%; }
}
