@charset "UTF-8";

/* Fonts */
@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_italic_300.woff2") format("woff2");
    font-style: normal;
    font-weight: 300;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_italic_400.woff2") format("woff2");
    font-style: italic;
    font-weight: 400;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_italic_500.woff2") format("woff2");
    font-style: italic;
    font-weight: 500;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_italic_600.woff2") format("woff2");
    font-style: italic;
    font-weight: 600;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_italic_700.woff2") format("woff2");
    font-style: italic;
    font-weight: 700;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_italic_900.woff2") format("woff2");
    font-style: italic;
    font-weight: 900;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_normal_900.woff2") format("woff2");
    font-style: normal;
    font-weight: 900;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_normal_700.woff2") format("woff2");
    font-style: normal;
    font-weight: 700;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_normal_600.woff2") format("woff2");
    font-style: normal;
    font-weight: 600;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_normal_500.woff2") format("woff2");
    font-style: normal;
    font-weight: 500;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_normal_400.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: "freight-sans-pro";
    src: url("../fonts/fsp_normal_300.woff2") format("woff2");
    font-style: normal;
    font-weight: 300;
}

@font-face {
    font-family: "freight-macro-pro";
    src: url("../fonts/fmp_italic_300.woff2") format("woff2");
    font-style: italic;
    font-weight: 300;
}

@font-face {
    font-family: "freight-macro-pro";
    src: url("../fonts/fmp_normal_300.woff2") format("woff2");
    font-style: normal;
    font-weight: 300;
}

/*

  Nothing other than the colour variables should be included in this file

  If you re-use a reference here several times in another file, feel free to redeclare that colour as a new variable with better context.

  For example:

  $c-highlight: $c-purple;

  .logo {
    fill: $c-highlight;
  }

  .face {
    border-color: $c-highlight;
  }

*/
svg {
    color-interpolation-filters: sRGB;
}

.yellow-purple-filter {
    -webkit-filter: url("#yellow-purple-filter");
    filter: url("#yellow-purple-filter");
}

.yellow-blue-filter {
    -webkit-filter: url("#yellow-blue-filter");
    filter: url("#yellow-blue-filter");
}

.green-blue-filter {
    -webkit-filter: url("#green-blue-filter");
    filter: url("#green-blue-filter");
}

.green-purple-filter {
    -webkit-filter: url("#green-purple-filter");
    filter: url("#green-purple-filter");
}

/*

  Nothing other than the breakpoints should be included in this file.

  1. Create a random-word version in the first list - prefixed with $b-...
  2. Give your breakpoint context. What was it created for? e.g. $b-hide-mobile-menu
  3. Use it with a break functions:

    @media (break('>=', $b-hide-mobile-menu)) {
      ...
    }

*/
/*

  Slightly altered version of the original reset.

*/
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
main,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
    vertical-align: baseline;
    padding: 0;
    margin: 0;
    background: transparent;
    border: 0;
    outline: 0;
    font-size: 100%;
}

p {
    vertical-align: baseline;
    padding: 0;
    background: transparent;
    border: 0;
    outline: 0;
    font-size: 100%;
    margin: 1em 0em;
}

html,
body {
    min-height: 100%;
}

html {
    overflow-x: hidden;
    overflow-y: scroll;
}

body {
    line-height: 1;
}

article,
aside,
details,
figcaption,
figure,
main,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

li {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: none;
}

a {
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    background: transparent;
    font-size: 100%;
    color: inherit;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
}

a:hover,
a:focus,
a:active {
    -webkit-tap-highlight-color: transparent;
}

ins {
    background-color: #FFFF99;
    color: #000000;
    text-decoration: none;
}

mark {
    background-color: #FFFF99;
    font-style: italic;
    font-weight: bold;
    color: #000000;
}

del {
    text-decoration: line-through;
}

abbr[title],
dfn[title] {
    border-bottom: 1px dotted;
    cursor: help;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

hr {
    display: block;
}

button {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
}

label,
button,
select {
    cursor: pointer;
}

input,
select {
    vertical-align: middle;
    max-width: 100%;
}

input,
select,
textarea,
button {
    font: inherit;
    color: inherit;
}

input::-moz-focus-inner,
button::-moz-focus-inner {
    padding: 0;
    border: 0;
}

*,
*:before,
*:after,
* * {
    box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important;
    -webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;
}

/*

  Really high-level styles for the html, body and :root here.

*/
html {
    overflow-x: hidden;
}

body {
    min-width: 320px;
}

.container {
    max-width: 1250px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 1rem;
}

/* 
Functional views tables (i.e. break whitespace rule to be more useful for lots of columns etc.) 
*/
.functional-table .container, 
.view-volunteering-show-all .container {
    margin-right: 1rem;
    margin-left: 1rem;
    padding-top: 0.5rem;    
    font-size: 0.85rem;
    max-width: 99vw;
}

.functional-table .webform-workflow-state-label {
    max-width: 350px;
    font-size: 1em;
}

/*

  Just dealing with backgrounds that work globally.

  Most backgrounds (usually) are described in other files.

*/
.pattern-1 {
    background-image: url("../svg/single/pattern-1.svg");
    background-size: cover;
}

.pattern-2 {
    background-image: url("../svg/single/pattern-2.svg");
    background-size: cover;
}

.pattern-3 {
    background-image: url("../svg/single/pattern-3.svg");
    background-size: cover;
}

.pattern-4 {
    background-image: url("../svg/single/pattern-4.svg");
    background-size: cover;
}

.pattern-5 {
    background-image: url("../svg/single/pattern-5.svg");
    background-size: cover;
}

.pattern-6 {
    background-image: url("../svg/single/pattern-6.svg");
    background-size: cover;
}

.pattern-7 {
    background-image: url("../svg/single/pattern-7.svg");
    background-size: cover;
}

.pattern-8 {
    background-image: url("../svg/single/pattern-8.svg");
}

.pattern-9 {
    background-image: url("../svg/single/pattern-9.svg");
}

.pattern-10 {
    background-image: url("../svg/single/pattern-10.svg");
}

.pattern-11 {
    background-image: url("../svg/single/pattern-11.svg");
}

.pattern-12 {
    background-image: url("../svg/single/pattern-12.svg");
}

.pattern-13 {
    background-image: url("../svg/single/pattern-13.svg");
}

.pattern-14 {
    background-image: url("../svg/single/pattern-14.svg");
}

.pattern-15 {
    background-image: url("../svg/single/pattern-15.svg");
}

.grid-two-one {
    display: block;
}

.grid-two-one__two {
    -webkit-box-flex: 2;
    flex: 2 0;
}

.grid-two-one__one {
    -webkit-box-flex: 1;
    flex: 1 0;
}

@media screen and (min-width: 850px) {
    .grid-two-one {
        display: -webkit-box;
        display: flex;
        flex-wrap: wrap;
    }
}

.grid-three-one {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

.grid-three-one>* {
    -webkit-box-flex: 0;
    flex: 0 0 100%;
}

@media screen and (min-width: 645px) {
    .grid-three-one>* {
        -webkit-box-flex: 0;
        flex: 0 0 48%;
    }
}

@media screen and (min-width: 960px) {
    .grid-three-one>* {
        -webkit-box-flex: 0;
        flex: 0 0 auto;
        width: 32%;
    }
}

.grid-two-mobile {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

.grid-two-mobile>* {
    -webkit-box-flex: 0;
    flex: 0 0 100%;
}

@media screen and (min-width: 960px) {
    .grid-two-mobile>* {
        -webkit-box-flex: 0;
        flex: 0 0 50%;
    }
}

@media screen and (min-width: 960px) and (-ms-high-contrast: active),
screen and (min-width: 960px) and (-ms-high-contrast: none) {
    .grid-two-mobile>* {
        -webkit-box-flex: 0;
        flex: 0 0 48%;
    }
}

.grid-three-mobile {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

.grid-three-mobile>* {
    -webkit-box-flex: 0;
    flex: 0 0 100%;
}

@media screen and (min-width: 960px) {
    .grid-three-mobile>* {
        -webkit-box-flex: 0;
        flex: 0 0 33.33%;
    }
}

@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .grid-three-mobile>* {
        -webkit-box-flex: 0;
        flex: 0 0 32%;
    }
}

.grid-four-one {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}

.grid-four-one>* {
    -webkit-box-flex: 0;
    flex: 0 0 100%;
}

@media screen and (min-width: 645px) {
    .grid-four-one>* {
        -webkit-box-flex: 0;
        flex: 0 0 50%;
    }
}

@media screen and (min-width: 960px) {
    .grid-four-one>* {
        -webkit-box-flex: 0;
        flex: 0 0 25%;
    }
}

.index-grid-four-one {
    display: -webkit-box;
    display: flex;
    flex-direction: row;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    justify-content: space-between;
    align-items: stretch;
    align-content: stretch;
    -webkit-box-align: stretch;
    flex-flow: row wrap;
}

.index-grid-four-one:after {
    -webkit-box-flex: 1;
    flex: 1 1 100%;
    max-width: 100%;
    content: "";
}

@media screen and (min-width: 660px) {
    .index-grid-four-one:after {
        /*max-width: 48%;*/
        -webkit-box-flex: 1;
        flex: 1 1 48%;
    }
}

@media screen and (min-width: 970px) {
    .index-grid-four-one:after {
        /*max-width: 32%;*/
        -webkit-box-flex: 1;
        flex: 1 1 32%;
    }
}

@media screen and (max-width: 1250px) {
    .index-grid-four-one {
        margin-right: 1rem;
        margin-left: 1rem;
    }
}

@media screen and (min-width: 660px) {
    .index-grid-four-one>* {
        /*max-width: 48%;*/
        -webkit-box-flex: 1;
        flex: 1 1 48%;
    }
}

@media screen and (min-width: 970px) {
    .index-grid-four-one>* {
        /*max-width: 32%;*/
        -webkit-box-flex: 1;
        flex: 1 1 32%;
    }
}

/*

  Position and Display happens here.

*/
.ratio {
    position: relative;
    display: inline-block;
}

.ratio__canvas {
    visibility: hidden;
    display: block;
    width: 100%;
}

.ratio__canvas--height {
    width: auto;
    height: 100%;
}

.ratio__subject {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.block-header {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

.pull-up {
    margin-top: -11rem;
}

.full-width {
    width: 100%;
}

/*

  PAD() and PUSH()

  This is our big sexy plan to help you standardise spacing.

  We use the keyword 'pad' to mean padding, and 'push' to mean margins. (Margin just doesn't shorten well, and it's not a verb.)

  The values you give to pad() and push() work the same as padding: and margin: shorthand.

  For example:

    pad(x)                  padding-top: x; padding-right: x; padding-bottom: x; padding-left: x;
    pad(x, y)               padding-top: x; padding-right: y; padding-bottom: x; padding-left: y;
    pad(x, y, z)            padding-top: x; padding-right: y, padding-bottom: z; padding-left: y;

  When you only want to specify one side, you can ignore the other values with a `0`.
  A `0` does not set padding-x: 0; It just ignores that side and moves on.

  For example:

  pad(0, foo, bar, 0)       padding-right: foo; padding-bottom: bar;


  PAD-X(O)

  You can also use the pad-top/right/bottom/left mixins to target a single side:

    pad-left(X)             padding-left: X;


  At the end of the file, we set up some simple helpers to use in your markup that just produces (1 * value).

  .pad--sides {
  }

  .push--verticals {
  }

*/
.pad {
    padding: 1rem;
}

.pad--verticals {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.pad--sides {
    padding-right: 1rem;
    padding-left: 1rem;
}

.pad--top {
    padding-top: 1rem;
}

.pad--right {
    padding-right: 1rem;
}

.pad--bottom {
    padding-bottom: 1rem;
}

.pad--left {
    padding-left: 1rem;
}

.push {
    margin: 1rem;
}

.push--verticals {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.push--sides {
    margin-right: 1rem;
    margin-left: 1rem;
}

.push--top {
    margin-top: 1rem;
}

.push--right {
    margin-right: 1rem;
}

.push--bottom {
    margin-bottom: 1rem;
}

.push--left {
    margin-left: 1rem;
}

/*
  Uniform space between child sibling elements
*/
.spacing>*+* {
    margin-top: 1rem;
}

@media screen and (min-width: 960px) {
    .partial-fill {
        max-width: 70%;
    }
}

.section {
    padding: 1rem;
}

@media screen and (max-width: 440px) {
    .section {
        padding: 3rem;
    }
}

/*

  Just @keyframe animations here.

  Also - if you have comon transition times/types - store them here.

  $t-

*/
@-webkit-keyframes bounce {

    0%,
    20%,
    60%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    80% {
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
    }
}

@keyframes bounce {

    0%,
    20%,
    60%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    80% {
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
    }
}

@-webkit-keyframes arrow {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40% {}

    100% {}
}

@keyframes arrow {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40% {}

    100% {}
}

@-webkit-keyframes blockHeightFade {
    0% {
        opacity: 0;
        tranform: translateY(-100);
    }

    80% {
        opacity: 1;
    }

    100% {
        tranform: translateY(0);
    }
}

@keyframes blockHeightFade {
    0% {
        opacity: 0;
        tranform: translateY(-100);
    }

    80% {
        opacity: 1;
    }

    100% {
        tranform: translateY(0);
    }
}

@-webkit-keyframes svgHeightFade {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes svgHeightFade {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.home-slider {
    position: relative;
}

.slide {
    bottom: 0;
    left: 0;
    padding-bottom: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    position: absolute;
    right: 0;
    top: 0;
}

@media screen and (min-width: 960px) {
    .slide {
        padding: 0;
    }
}

/*

  Global typographic styles and helpers.

  You can also build @font-face declarations here.

  We use font-scale to create

*/
/* mixin for multiline */

:root {
    font-family: "freight-sans-pro";
}

@media (max-width: 1200px) {
    :root {
        font-size: calc(14px + (21 - 14) * ((100vw - 320px) / (1400 - 320)));
    }
}

@media (min-width: 1200px) {
    :root {
        font-size: 21px;
    }
}

.body {
    color: #082244;
}

blockquote {
    font-family: "freight-macro-pro";
}

.h1 {
    font-size: 2.6rem;
}

@media screen and (min-width: 960px) {
    .h1 {
        font-size: 3.6rem;
    }
}

.h2 {
    font-weight: 700;
    font-size: 2rem;
    display: block;
    line-height: 2rem;
}

.h2+.p {
    padding-top: 5rem;
}

.h3 {
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.8;
}

.h4 {
    font-weight: 600;
    font-size: 0.9rem;
}

strong {
    font-weight: 600;
}

.article-date {
    font-size: 0.7em;
}

.article-date hr {
    border: 1px solid #FEC340;
    height: 1px;
    width: 5em;

    margin-block-start: unset;
    margin-block-end: unset;
    margin-inline-start: unset;
    margin-inline-end: unset;
    margin-top: 1em;
    margin-bottom: 1em;
}

.article-heading {
    padding: 0.4rem 0.8rem;
    margin-bottom: 2rem;
    z-index: 9;
    display: inline-block;
    background-color: #FEC340;
    font-size: 1.7rem;
    font-weight: 700;
    color: #082244;
}

.article-heading--large {
    font-size: 2.3rem;
    padding: 0.8rem;
}

.article-heading--link {
    padding-right: 1rem;
    line-height: 2.4rem;
}

.article-heading--link:after {
    margin-left: 1rem;
    width: 0;
    height: 0;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
    border-left: 14px solid #082244;
    display: inline-block;
    content: "";
}

.article-heading--link:hover,
.article-heading--link:focus {
    background-color: #B8BEC5;
}

.p {
    font-size: 0.9rem;
    line-height: 1.5;
}

.p+.p {
    padding-top: 1rem;
}

.heading {
    font-size: 1.6rem;
}

.sub-heading {
    text-transform: uppercase;
}

.article-heading--inside-block {
    margin-bottom: -1px;
    font-size: 1rem;
}

a:hover,
a:focus {
    transition: 0.2s ease;
}

.highlight {
    padding: 0.1rem 10px 0.1rem 10px;
    display: inline;
    background: #FFFFFF;
    font-weight: 600;
    color: #082244;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

.banner__club--category .highlight {
    background: #F26640;
    color: #FFFFFF;
}

.banner__club--category {
    margin-bottom: 20px;
    margin-top: 0.5rem;
}

.banner__club--image {
    width: 144px;
    height: 144px;
    background: #FFFFFF;
    position: relative;
}

.banner__club--image>div {
    position: absolute;
}

.banner__club--image>.banner__club--image--image {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    left: 2px;
    top: 2px;
    width: 140px;
    height: 140px;
}

.banner__club--image>.banner__club--image--border {
    width: 144px;
    height: 144px;
    background: #FFFFFF;
}

/*

  Style form elements globally here.

*/
/*

  Showing and hding elements.

  We usually end up creating variations of these for different transitions (you can't fade the visible: property, for example).

*/
.is--hidden {
    position: absolute;
    visibility: hidden;
}

.is--shown {
    position: static;
    visibility: visible;
}

.sr--only {
    position: absolute;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
}

.visually-hidden {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.visually-hidden:focus {
    position: static;
    width: auto;
    height: auto;
}

*:focus {
    outline: none;
}

.none {
    display: none;
}

button {
    transition: 0.3s ease;
}

button:after {
    transition: 0.3s ease;
}

.list {
    padding-left: 0.8rem;
    padding-bottom: 1rem;
    position: relative;
    display: block;
}

.list:before {
    position: absolute;
    top: -0.1rem;
    left: -0.02rem;
    width: 8px;
    height: 6px;
    content: url("../svg/single/bullet.svg");
}

.more-button {
    margin-bottom: 0.4rem;
    padding: 0.4rem 1rem;
    position: relative;
    display: inline-block;
    width: auto;
    border: 2px solid #FFFFFF;
    background-color: #1D958A;
    color: #FFFFFF;
    text-align: left;
    transition: 0.3s ease;
}

.more-button:after {
    width: 0;
    height: 0;
    border-bottom: 6px solid #FFFFFF;
    border-left: 6px solid transparent;
    position: absolute;
    bottom: 5px;
    right: 5px;
    content: "";
}

.more-button:hover,
.more-button:focus {
    background-color: #1D958A;
    border: 2px solid #FEC340;
    color: #FEC340;
}

.more-button:hover:after,
.more-button:focus:after {
    width: 0;
    height: 0;
    border-bottom: 6px solid #FEC340;
    border-left: 6px solid transparent;
}

.heading-button:after {
    margin-left: 1rem;
    content: " ";
}

.heading-button:hover,
.heading-button:focus {
    color: #B8BEC5;
}

.filled-button {
    padding: 0.4rem 0.6rem;
    background-color: #F26640;
    font-size: 1.7rem;
    font-weight: 600;
    color: #FFFFFF;
}

.filled-button:after {
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid #FFFFFF;
    margin-left: 0.7rem;
    display: inline-block;
    content: " ";
}

.filled-button:hover,
.filled-button:focus {
    background-color: #082244;
}

.load {
    position: relative;
    display: -webkit-box;
    display: flex;
    margin: 0 auto;
    background-color: transparent;
    border: 2px solid #082244;
    font-weight: 600;
    color: #082244;
    line-height: 1.4;
}

.load:after {
    display: none;
}

.load:hover,
.load:focus {
    background-color: transparent;
    border: 2px solid #506275;
    color: #082244;
}

.load:hover .icon__load,
.load:focus .icon__load {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
}

.button--news {
    padding: 0.7rem 1.6rem;
    font-size: 0.9rem;
    font-weight: 600;
    position: relative;
    display: inline-block;
    color: #52317D;
    border: 2px solid #52317D;
}

.button--news:after {
    width: 0;
    height: 0;
    border-bottom: 6px solid #52317D;
    border-left: 6px solid transparent;
    position: absolute;
    bottom: 5px;
    right: 5px;
    content: "";
}

.button--news:focus,
.button--news:hover {
    background-color: #52317D;
    color: #FFFFFF;
}

.button--news:focus:after,
.button--news:hover:after {
    width: 0;
    height: 0;
    border-bottom: 6px solid #FFFFFF;
    border-left: 6px solid transparent;
}

.search-filter {
    -webkit-clip-path: polygon(0.6rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0.6rem);
    clip-path: polygon(0.6rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0.6rem);
    padding: 0.2rem 0.8rem;
    margin-right: 0.3rem;
    margin-bottom: 0.4rem;
    background-color: #F26640;
    color: #082244;
    font-weight: 700;
    text-transform: uppercase;
    display: inline-block;
}

.search-filter--all {
    background-color: rgba(242, 102, 64, 0.08);
}

.search-filter:hover,
.search-filter:focus {
    background-color: #B8BEC5;
}

.nav {
    padding-top: 1rem;
    display: inline-flex;
    z-index: 99;
    flex-wrap: wrap;
    -webkit-box-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    justify-content: space-between;
    background-color: #FFFFFF;
    width: 100%;
}

.nav.is--fixed {
    position: fixed;
}

.nav__logo {
    margin-left: 1rem;
    width: 70px;
    height: 40px;
    fill: #082244;
    margin-bottom: 0.8rem;
}

.nav__logo--svg {
    width: 70px;
    height: 30px;
}

.nav__logo:hover,
.nav__logo:focus {
    /* 60% opacity */
    fill: rgba(8, 34, 68, 0.6);
}

@media screen and (min-width: 509px) {
    .nav__logo {
        width: 119px;
    }

    .nav__logo--svg {
        width: 119px;
    }
}

.nav__items-container {
    display: none;
    margin-left: 1rem;
    height: 100vh;
    padding-top: 0;
}

.nav__items-container.is--open {
    display: block;
}

.nav__icon-container {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: 30px;
}

.nav__user {
    padding-left: 2rem;
    margin-right: 1rem;
    -webkit-box-ordinal-group: 3;
    order: 2;
}

a.nav__user.icon.nav__user__button p {
    margin: 0;
}

.nav__mobile {
    padding: 1rem;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    width: 100%;
    background-color: #082244;
    color: #FFFFFF;
}

.nav__level-1 {
    position: relative;
    display: block;
    font-size: 1.3rem;
    font-weight: 600;
    color: #082244;
    line-height: 2.8rem;
    text-transform: uppercase;
}

.nav__level-1:hover:after,
.nav__level-1:focus:after {
    -webkit-animation: bounce 0.8s;
    animation: bounce 0.8s;
}

.nav__level-1:after {
    padding-top: 1rem;
    width: 0;
    height: 0;
    border-top: 6px solid #F26640;
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    position: absolute;
    display: block;
    top: calc(50% - (6px / 2));
    left: calc(100% + 10px);
    content: " ";
}

.nav__level-1.is--open {
    color: #F26640;
}

@media screen and (min-width: 960px) {
    .nav {
        position: initial;
    }

    .nav__icon-container {
        -webkit-box-ordinal-group: 2;
        order: 1;
    }

    .nav__items-container {
        display: -webkit-box;
        display: flex;
        -webkit-box-flex: 1;
        flex: 1;
        height: auto;
        justify-content: space-around;
        max-width: 100vw;
        margin-left: 0;
        margin-right: 0;
    }

    .nav__icon-container,
    .nav .nav__logo {
        padding-top: 0.2rem;
    }

    .nav__level-1 {
        font-size: 0.7rem;
        line-height: 1.8rem;
        overflow: visible;
    }

    .nav__level-1:after {
        left: calc(50% - 6px);
        top: 37px;
    }

    .nav__level-1.is--open:after {
        -webkit-animation: arrow 1s;
        animation: arrow 1s;
        width: 0;
        height: 0;
        border-right: 10px solid transparent;
        border-bottom: 10px solid #082244;
        border-left: 10px solid transparent;
        padding-top: 1rem;
        position: absolute;
        top: 22px;
        left: calc(50% - 10px);
        display: block;
        border-top: 0;
        content: " ";
        transition: top 0.3s ease;
    }

    .nav__mobile {
        display: none;
    }
}

@media screen and (min-width: 1200px) {
    .nav__level-1.is--open:after {
        top: 30px;
    }
}

.icon {
    fill: #F26640;
}

.icon--nav {
    height: 24px;
    width: 20px;
}

.icon--svg {
    width: 1rem;
    height: 1rem;
}

.icon__social {
    width: 2.6rem;
    height: 2.6rem;
    fill: #F26640;
}

.icon__social:hover,
.icon__social:focus {
    fill: #082244;
    stroke: #082244;
}

.icon__close {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 999999;
    fill: #FFFFFF;
    width: 2rem;
    height: 2rem;
}

.icon__close:hover,
.icon__close:focus {
    fill: #B8BEC5;
}

.icon__social--profile {
    width: 1.1rem;
    height: 1.6rem;
    fill: #FFFFFF;
}

.icon__load {
    width: 30px;
    height: 30px;
    margin-left: 0.4rem;
    transition: -webkit-transform 0.4s;
    transition: transform 0.4s, -webkit-transform 0.4s;
}

.icon__social--footer {
    width: 1.5rem;
    height: 1.5rem;
    fill: #F26640;
    stroke: #F26640;
}

.icon__social--footer:hover,
.icon__social--footer:focus {
    fill: #082244;
    stroke: #082244;
}

.icon__social--heading {
    margin-right: 0.7rem;
    width: 1.5rem;
    height: 1.5rem;
    fill: #082244;
}

.icon__quotes {
    height: 39px;
    width: 36px;
}

.social-profile {
    margin-left: 0.8rem;
    padding: 0.5rem 1rem 0.5rem 2.5rem;
    -webkit-clip-path: polygon(0rem 0,
            calc(100% - 0.7rem) 0,
            100% 0.7rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0.7rem 100%,
            0 calc(100% - 0.7rem),
            0 0rem);
    clip-path: polygon(0rem 0,
            calc(100% - 0.7rem) 0,
            100% 0.7rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0.7rem 100%,
            0 calc(100% - 0.7rem),
            0 0rem);
    position: relative;
}

.social-profile--email {
    background-color: #F26640;
}

.social-profile--email:focus,
.social-profile--email:hover {
    background-color: #082244;
}

.social-profile--phone {
    background-color: #082244;
}

.social-profile__text {
    display: inline-block;
    color: #FFFFFF;
    line-height: 1.8rem;
}

.social-profile__svg {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0.7rem;
}

.clip-officer-svg {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 188px;
    height: 187px;
}

.shape-1 {
    -webkit-clip-path: polygon(0rem 0,
            calc(100% - 1.5rem) 0,
            100% 1.5rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            1.5rem 100%,
            0 calc(100% - 1.5rem),
            0 0rem);
    clip-path: polygon(0rem 0,
            calc(100% - 1.5rem) 0,
            100% 1.5rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            1.5rem 100%,
            0 calc(100% - 1.5rem),
            0 0rem);
}

.shape-2 {
    border-bottom-left-radius: 47%;
    border-bottom-right-radius: 47%;
}

.shape-3 {
    -webkit-clip-path: polygon(0rem 0,
            calc(100% - 1.5rem) 0,
            100% 1.5rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0rem);
    clip-path: polygon(0rem 0,
            calc(100% - 1.5rem) 0,
            100% 1.5rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0rem);
    border-bottom-left-radius: 32%;
}

.shape-4 {
    -webkit-clip-path: polygon(1.5rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 1.5rem);
    clip-path: polygon(1.5rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 1.5rem);
}

.search-form {
    padding: 2rem;
}

.search-form>div {
    padding-top: 1rem;
    max-width: 1250px;
    margin-right: auto;
    margin-left: auto;
}

.search-form>div .form-wrapper {
    width: calc(100% - -1px);
    border-bottom: 4px solid #082244;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: end;
    align-items: flex-end;
    -webkit-box-pack: justify;
    justify-content: space-between;
    padding-bottom: 1px;
    margin-top: 5rem;
}

.search-form>div .form-wrapper .form-item {
    display: inline-block;
    width: 100%;
    margin: 0;
}

.search-form>div .form-wrapper .form-item label {
    display: none;
}

.search-form>div .form-wrapper input[type="text"] {
    width: 100%;
    font-size: 1.8rem;
    font-weight: 600;
    color: #082244;
    border: 0;
}

.search-form>div .form-wrapper .form-submit {
    padding: 0 1rem;
    -webkit-clip-path: polygon(0rem 0,
            calc(100% - 0.7rem) 0,
            100% 0.7rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0.7rem 100%,
            0 calc(100% - 0.7rem),
            0 0rem);
    clip-path: polygon(0rem 0,
            calc(100% - 0.7rem) 0,
            100% 0.7rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0.7rem 100%,
            0 calc(100% - 0.7rem),
            0 0rem);
    position: relative;
    color: #FFFFFF;
    background: #082244;
    margin-bottom: -2px;
    border: 0;
    line-height: 52px;
}

.search-form>div .form-wrapper ::-webkit-input-placeholder {
    /* Chrome */
    color: #082244;
}

.no-results {
    margin-bottom: 1rem;
}

.nav-level-2 {
    z-index: 99;
    display: none;
    width: 100%;
    padding: 0;
    color: #FFFFFF;
}

.nav-level-2.is--open {
    display: block;
}

.nav-level-2__container {
    display: -webkit-box;
    display: flex;
    width: 100vw;
    padding-top: 0;
}

.nav-level-2__description {
    display: none;
}

.nav-level-2__links {
    display: block;
}

.nav-level-2__item {
    color: #0C3060;
    line-height: 2.3;
    text-align: left;
    transition: color 0.2s ease;
}

.nav-level-2__item:hover,
.nav-level-2__item:focus {
    color: #B8BEC5;
}


ul.nav-level-2__links ul {
    visibility: visible;
    position: relative;
    top: 0;
}


ul.nav-level-2__links.sf-js-enabled ul {
    visibility: hidden;
    position: absolute;
    top: 1.8em;
}

@media screen and (min-width: 960px) {
    .nav-level-2 {
        position: absolute;
        z-index: 1;
        opacity: 0;
        left: 0;
        display: none;
        height: 0;
        background-color: #082244;
    }

    .nav-level-2__container {
        will-change: transform;
        opacity: 0;
    }

    .nav-level-2.is--open {
        padding: 6rem 1rem;
        overflow: hidden;
        top: 68px;
        left: 0;
        z-index: 9;
        height: calc(100vh - 68px);
        opacity: 1;
    }

    .nav-level-2.is--open:after {
        position: absolute;
        opacity: 1;
        bottom: -4px;
        left: -2px;
        width: 100%;
        z-index: -1;
        content: url("../svg/single/invert-u.svg");
    }

    .nav-level-2.is--open .nav-level-2__container {
        opacity: 1;
    }

    .nav-level-2 .section--nav {
        padding-left: 3rem;
        padding-right: 3rem;
    }

    .nav-level-2__links {
        display: -webkit-box;
        display: flex;
        -webkit-box-flex: 1;
        flex: 1;
        flex-wrap: wrap;
        width: 50%;
        padding-top: calc(5rem + 2rem);
    }

    .nav-level-2__description {
        z-index: 9;
        display: inline-block;
        -webkit-box-flex: 1;
        flex: 1;
    }

    .nav-level-2__item {
        padding-right: 0.5rem;
        padding-bottom: 2rem;
        -webkit-box-flex: 0;
        flex: 0 0 48%;
        line-height: 1.3rem;
        z-index: 9;
        font-weight: bold;
        color: #F26640;
    }
}

@media screen and (min-width: 1200px) {
    .nav-level-2.is--open {
        top: 78px;
        left: 0;
        height: calc(100vh - 78px);
    }
}

.is--animation {
    top: 80px;
    -webkit-animation: blockHeightFade 0.3s linear;
    animation: blockHeightFade 0.3s linear;
}

.is--animation .nav-level-2__container {
    transition: all 0.6s ease;
    opacity: 1;
}

.is--animation.is--open:after {
    -webkit-animation: svgHeightFade 0.6s linear;
    animation: svgHeightFade 0.6s linear;
}

.footer {
    background-color: #FEC340;
    padding: 1rem;
}

.footer__container {
    display: block;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

.footer__heading {
    font-size: 1.4rem;
    font-weight: 600;
    color: #082244;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.footer__list {
    margin-left: 2rem;
    margin-right: 2rem;
}

.footer__list-item {
    padding-bottom: 0.4rem;
    margin-left: 0.9rem;
    color: #351F19;
}

.footer__list-item a {
    position: relative;
}

.footer__list-item a:before {
    position: absolute;
    top: 2px;
    left: -0.8rem;
    width: 8px;
    height: 6px;
    content: url("../svg/single/bullet.svg");
}

.footer__list-item:hover,
.footer__list-item:focus {
    color: #F26640;
}

@media screen and (min-width: 440px) {
    .footer__container {
        display: -webkit-box;
        display: flex;
    }
}

@media screen and (min-width: 960px) {
    .footer {
        padding-bottom: 3rem;
        padding-top: 1.5rem;
    }
}

.pre-footer-nav {
    position: relative;
    z-index: 1;
    background-color: #082244;
    color: #FFFFFF;
}

.pre-footer-nav__description {
    z-index: 2;
    display: block;
}

.pre-footer-nav__sub-heading {
    color: #3C5F98;
    padding-bottom: 1.2rem;
}

.pre-footer-nav__links {
    padding-top: 2rem;
}

.pre-footer-nav__container {
    opacity: 1;
    display: block;
}

.pre-footer-nav__item {
    color: #F26640;
    padding-bottom: 1rem;
}

.pre-footer-nav:after {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    content: url("../svg/single/footer-shapes.svg");
}

@media screen and (min-width: 960px) {
    .pre-footer-nav {
        padding-bottom: 4rem;
        padding-top: 2rem;
    }

    .pre-footer-nav__container {
        display: -webkit-box;
        display: flex;
    }

    .pre-footer-nav__links {
        padding-top: calc(5rem + 4rem);
    }
}

.general-section {
    padding: 1rem;
}

@media screen and (min-width: 960px) {
    .general-section {
        padding: 3rem;
    }
}

.banner {
    padding-right: 1rem;
    padding-bottom: 1rem;
    padding-left: 1rem;
    position: relative;
    width: 100%;
    min-height: 40vh;
}

.banner.banner-no-image {
    min-height: auto;
}

.banner__image-container {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
}

.banner-no-image .banner__back-link {
    margin-bottom: 0;
}

.banner__back-link {
    -webkit-clip-path: polygon(0rem 0,
            calc(100% - 0.6rem) 0,
            100% 0.6rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0.6rem 100%,
            0 calc(100% - 0.6rem),
            0 0rem);
    clip-path: polygon(0rem 0,
            calc(100% - 0.6rem) 0,
            100% 0.6rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0.6rem 100%,
            0 calc(100% - 0.6rem),
            0 0rem);
    padding: 0.6rem 1rem 1rem 2rem;
    position: relative;
    display: inline-block;
    background-color: rgba(9, 52, 65, 0.5);
    font-weight: 500;
    color: #FFFFFF;
}

.banner__back-link:hover,
.banner__back-link:focus {
    background-color: #FFFFFF;
    color: #082244;
}

.banner__back-link:hover:before,
.banner__back-link:focus:before {
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-right: 7px solid #082244;
}

.banner__back-link:before {
    position: absolute;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-right: 7px solid #FFFFFF;
    top: 42%;
    left: 16px;
    display: block;
    content: " ";
}

.banner__title {
    padding: 1rem 1rem 1rem 0;
    margin-bottom: 2rem;
    margin-top: 4rem;
    display: inline-block;
    color: #082244;
}

.banner-no-image .banner__title {
    padding-top: 0;
    padding-right: 1rem;
    padding-bottom: 0;
    margin-bottom: 0;
    margin-top: 0;
    display: inline-block;
    color: #082244;
}

.banner__title--slim {
    margin-top: 1rem;
}

.banner__title--background,
#popup-message-window h1.popup-message-title {
    padding: 0.1rem 10px 0.1rem 10px;
    display: inline;
    background: #FEC340;
    font-weight: 700;
    color: #082244;
    line-height: 1.5;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

.banner-no-image .banner__sub-title {
    margin-top: 0.5rem;
    margin-bottom: 0;
    margin-left: 10px;
}

.banner__sub-title {
    margin-bottom: 4rem;
    display: block;
    max-width: 100%;
}

.banner__sub-title--profile {
    margin-bottom: 1rem;
}

.banner__sub-title--profile .highlight {
    background-color: #082244;
    box-shadow: 10px 0 0 #082244, -10px 0 0 #082244;
    color: #FFFFFF;
}

.banner__sub-title--info {
    margin-bottom: 7rem;
    padding-left: 0;
    font-weight: 600;
    color: #082244;
}

@media screen and (min-width: 509px) {
    .banner__sub-title--info {
        margin-bottom: 2rem;
    }
}

.banner__social {
    padding-right: 1rem;
    position: absolute;
    bottom: -1.3rem;
    right: 17rem;
    width: 50%;
    text-align: right;
}

.banner__social--profiles {
    text-align: left;
}

.banner__social--profiles-inner {
    padding-left: 3rem;
    position: initial;
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-align: center;
    align-items: center;
}

@media screen and (min-width: 1235px) {
    .banner__social--profiles-inner {
        padding-left: 0;
    }
}

.banner__social--profiles-inner>* {
    margin-bottom: 1rem;
}

@media screen and (min-width: 440px) {
    .banner__social--profiles-inner>* {
        margin-bottom: 0;
    }
}

@media screen and (min-width: 960px) {
    .banner {
        padding-right: 3rem;
        padding-bottom: 3rem;
        padding-left: 3rem;
    }

    .banner__back-link {
        margin-bottom: 3rem;
    }

    .banner__sub-title {
        max-width: 70%;
    }

    .banner__sub-title--info {
        max-width: 40%;
        color: #FFFFFF;
    }

    .banner__social--profiles {
        position: absolute;
        display: block;
    }

    .banner__image-container {
        position: absolute;
        height: 100%;
    }

    .banner .banner-profile {
        min-height: 70vh;
    }

    .banner .banner-profile .banner__title {
        margin-top: 4rem;
        margin-bottom: 2rem;
    }

    .banner .banner-profile__container {
        margin-top: 0;
        padding-left: 0;
        padding-right: 0;
    }

    .banner .banner-profile__image-container {
        height: 100%;
    }

    .banner .banner-profile__side {
        left: 0;
        display: inline-block;
        width: calc(((100vw - 1250px) / 2) + 1px);
        height: 100%;
        background-color: #2AAA9E;
        mix-blend-mode: multiply;
    }

    .banner .banner-profile__shape {
        display: inline-block;
        width: 100%;
        height: 100%;
        padding-top: 0;
    }
}

.banner-profile__side {
    display: none;
}

.banner-profile__image-container {
    height: 400px;
}

.banner-profile__container {
    padding-left: 2rem;
    padding-right: 2rem;
    margin-top: 370px;
}

.banner-profile .banner__title {
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: -7px;
}

.banner-profile__shape {
    display: none;
}

.article {
    overflow: hidden;
    padding-bottom: 1rem;
}

.article p {
    padding-bottom: 1.2rem;
    font-size: 1rem;
    color: #082244;
    line-height: 1.4;
}

.article h3 {
    font-size: 1rem;
}

.article h1,
.article h2 {
    padding: 0.4rem 0.8rem;
    margin-bottom: 2rem;
    margin-top: 1rem;
    display: inline-block;
    background-color: #FEC340;
    font-size: 1.7rem;
    font-weight: 700;
    color: #082244;
}

.article h2 {
    font-size: 1rem;
}

.article li {
    padding-left: 0.9rem;
    padding-bottom: 1rem;
    position: relative;
    color: #082244;
    line-height: 1.4;
}

.article ul>li {
    display: block;
}

.article ol {
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}

.article ol>li {
    list-style: decimal outside;
}

.article ul>li:before {
    position: absolute;
    top: -0.1rem;
    left: -0.02rem;
    content: url("../svg/single/bullet.svg");
    height: 6px;
    width: 8px;
}

.article a,
.form-item a,
fieldset a,
ul.links a {
    padding-left: 0.4rem;
    padding-right: 0.4rem;
    background-color: rgba(242, 102, 64, 0.08);
    border-bottom: 2px solid #F26640;
}

.article a:hover,
/* .article a:focus, */
.form-item a:hover,
.form-item a:focus,
fieldset a:hover,
ul.links a:hover {
    border-bottom: 2px solid #082244;
}

/* Hide empty HTML anchors */
a[name]:empty {
    visibility: hidden;
    padding: 0;
    /* These are visibility: hidden anyway, but that still shows padding for some reason */
}

a[name],
a[name]:hover,
a[name]:focus,
a[name]:active {
    border: none;
}

.article blockquote {
    padding-top: 5.5rem;
    padding-bottom: 5.5rem;
    margin-left: 3rem;
}

.article blockquote p {
    position: relative;
    display: inline;
    padding-top: 0.1rem;
    padding-bottom: 0.1rem;
    background: #FFFBF0;
    box-shadow: 10px 0 0 #FFFBF0, -10px 0 0 #FFFBF0;
    font-size: 1.5rem;
    font-weight: 500;
    color: #082244;
    line-height: 1.8;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

.article blockquote p:before {
    position: absolute;
    top: -53px;
    left: -48px;
    z-index: -1;
    content: url("../svg/single/quote-top.svg");
}

.article blockquote p:after {
    position: absolute;
    bottom: -78px;
    left: -5px;
    z-index: -1;
    content: url("../svg/single/quote-bottom.svg");
}

.article img {
    margin-bottom: 1rem;
    -webkit-clip-path: polygon(2rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 2rem),
            calc(100% - 2rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 2rem);
    clip-path: polygon(2rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 2rem),
            calc(100% - 2rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 2rem);
    width: 100%;
    height: auto;
}

.article figcaption {
    margin-bottom: 3rem;
    font-family: "freight-macro-pro";
    font-size: 16px;
    font-weight: 300;
    color: #506275;
    line-height: 1.5;
}

.article img+p {
    margin-top: 2rem;
}

@media screen and (min-width: 960px) {
    .article {
        padding-right: 3rem;
    }

    .article .quote-container {
        max-width: 70%;
        margin-left: 10px;
    }
}

.article .officer__others {
    padding: 0;
}

.article .officer__others a.officer-block {
    padding: 0;
    background-color: #FFFFFF;
    border-bottom: 2px solid #FEC340;
    margin-right: auto;
    margin-left: auto;
}

@media screen and (min-width: 509px) {
    .article .officer__others a.officer-block {
        margin-right: 1rem;
        margin-left: 1rem;
    }
}

.article .officer__others a.officer-block:hover,
.article .officer__others a.officer-block:focus {
    border-bottom: 2px solid #B8BEC5;
}

.image-left {
    margin-left: -3rem;
}

.aside {
    display: block;
}

@media screen and (max-width: 730px) {
    .aside * {
        flex-basis: 100%;
    }
}

.aside .h3 {
    font-size: 1rem;
    line-height: 1.1;
}

.aside__heading {
    display: inline-block;
    flex-basis: 100%;
}

@media screen and (min-width: 850px) and (max-width: 1328px) {
    .aside__heading {
        margin-left: 1rem;
        margin-right: 1rem;
        padding: 0.4rem 0.8rem !important;
    }
}

.aside blockquote {
    padding-top: 5.5rem;
    padding-bottom: 5.5rem;
    position: relative;
    max-width: 330px;
    margin-left: 3rem;
}

.aside blockquote p {
    position: relative;
    display: inline;
    padding-top: 0.1rem;
    padding-bottom: 0.1rem;
    background: #FFFBF0;
    box-shadow: 10px 0 0 #FFFBF0, -10px 0 0 #FFFBF0;
    font-size: 1.5rem;
    font-weight: 500;
    color: #082244;
    line-height: 1.8;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

.aside blockquote p:before {
    position: absolute;
    top: -42px;
    left: -91px;
    z-index: -1;
    content: url("../svg/single/quote-top-aside.svg");
}

.aside blockquote p:after {
    position: absolute;
    bottom: -123px;
    left: -5px;
    z-index: -1;
    content: url("../svg/single/quote-bottom-aside.svg");
}

@media screen and (max-width: 1328px) {
    .aside>* {
        padding-left: 1rem;
        padding-right: 1rem;
        -webkit-box-flex: 1;
        flex: 1;
        flex-basis: 50%;
    }

    .aside .impact-block__container:before {
        content: none;
    }
}

@media screen and (min-width: 850px) {

    /* Introduce a gap between the content and the right sidebar */
    .aside-block {
        margin-left: 10px;
    }
}

.aside-block {
    font-size: 0.9rem;
    padding-bottom: 1.5rem;
    min-width: 250px;
}

.aside-block-with-contextual {
    font-size: 0.7rem;
}

.aside-block__container {
    padding: 1rem;
    display: inline-block;
    width: 100%;
    background-color: #E6E9EC;
    border-top: 2px solid #FEC340;
    color: #082244;
    border-bottom: 2px solid #D9DEE3;
}

.aside-block .link {
    padding-left: 0.4rem;
    padding-right: 0.4rem;
    background-color: rgba(242, 102, 64, 0.08);
    border-bottom: 2px solid #F26640;
    line-height: 1.5rem;
}

.aside-block .link:hover,
.aside-block .link:focus {
    border-bottom: 2px solid #082244;
}

.aside-block__email {
    padding-bottom: 1rem;
    display: block;
    color: #F26640;
}

.aside-block__email:hover,
.aside-block__email:focus {
    color: #506275;
}

.aside-block__email:hover .aside-block__email--icon,
.aside-block__email:focus .aside-block__email--icon {
    fill: #506275;
}

.aside-block__email--icon {
    margin-right: 0.3rem;
    width: 1rem;
    height: 1rem;
}

.aside-block__role {
    padding-bottom: 1rem;
}

.aside-block__name {
    padding-bottom: 0.4rem;
}

.aside-block__hours {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
}

.aside-block__hours * {
    -webkit-box-flex: 0;
    flex: 0 0 50%;
    padding-bottom: 1rem;
}

.aside-block--related__container {
    padding-top: 1rem;
}

.aside-block__accordion {
    display: none;
    padding: 0.4rem;
    background-color: #FFFFFF;
}

.aside-block__accordion--open {
    display: block;
}

.aside-block__accordion p {
    padding-bottom: 0;
}

.aside-block__accordion p+p {
    margin-top: 1.2rem;
}

.aside-block .link-button {
    margin-top: 0.4rem;
    padding: 0.4rem;
    position: relative;
    display: block;
    width: 100%;
    background-color: #FFFFFF;
    border-bottom: 2px solid #F26640;
    text-align: left;
    transition: 0.3s ease;
}

@supports ((-webkit-clip-path: initial) or (clip-path: initial)) {
    .aside-block .link-button {
        -webkit-clip-path: polygon(10px 0,
                100% 0,
                100% 0,
                100% 100%,
                100% 100%,
                0 100%,
                0 100%,
                0 10px);
        clip-path: polygon(10px 0,
                100% 0,
                100% 0,
                100% 100%,
                100% 100%,
                0 100%,
                0 100%,
                0 10px);
    }
}

.aside-block .link-button:after {
    width: 0;
    height: 0;
    border-bottom: 6px solid #F26640;
    border-left: 6px solid transparent;
    position: absolute;
    bottom: 5px;
    right: 5px;
    content: "";
}

.aside-block .link-button:hover,
.aside-block .link-button:focus {
    color: #FFFFFF;
    background-color: #F26640;
    border-bottom: 0px solid transparent;
}

.aside-block .link-button:hover:after,
.aside-block .link-button:focus:after {
    width: 0;
    height: 0;
    border-bottom: 6px solid #FFFFFF;
    border-left: 6px solid transparent;
}

.impact-block {
    margin-bottom: 3rem;
    min-width: 250px;
}

.impact-block__container {
    margin-left: 10px;
    padding: 1rem;
    position: relative;
    background-color: #1D958A;
    z-index: 1;
    display: block;
}

.impact-block__container::before {
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
    display: block;
    width: 100%;
    content: url("../svg/single/impact-u.svg");
}

.impact-block__text {
    padding-top: 1rem;
    padding-bottom: 3rem;
    font-size: 1.2rem;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.3;
}

.impact-full {
    margin-top: 2rem;
}

.impact-full:last-child {
    margin-bottom: 2rem;
}

.impact-full__info {
    margin-top: calc(324px);
}

.impact-full__container {
    position: relative;
    max-width: calc(1250px + 3rem);
}

.impact-full__shape {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 324px;
}

.impact-full__shape-svg {
    position: absolute;
    right: 0;
    bottom: -2px;
    width: calc(100% + 1px);
    height: 100%;
}

.impact-full__button-container {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    color: #FFFFFF;
    text-align: center;
}

.impact-full__button-container>* {
    margin-right: 1rem;
    -webkit-box-flex: 1;
    flex: 1;
    border-color: #FFFFFF;
    color: #FFFFFF;
}

.impact-full__button-container>*:after {
    width: 0;
    height: 0;
    border-bottom: 6px solid #FFFFFF;
    border-left: 6px solid transparent;
}

.impact-full__button-container>*:hover,
.impact-full__button-container>*:focus {
    color: #FEC340;
    background-color: transparent;
    border-color: #FEC340;
}

.impact-full__button-container>*:hover:after,
.impact-full__button-container>*:focus:after {
    width: 0;
    height: 0;
    border-bottom: 6px solid #FEC340;
    border-left: 6px solid transparent;
}

.impact-full__button-container>*:last-child {
    margin-right: 0;
}

@media screen and (min-width: 1105px) {
    .impact-full__info {
        max-width: 50%;
        margin-top: 0;
    }

    .impact-full__shape {
        width: 50%;
    }
}

@media screen and (max-width: 645px) {
    .impact-full__button-container {
        display: block;
    }

    .impact-full__button-container>* {
        margin-bottom: 1rem;
        margin-right: 0;
        display: block;
    }
}

.impact-full--orange,
.impact-full--orange.button--news {
    background-color: #F26640;
}

.impact-full--orange .impact-full__shape {
    background-color: #E15A35;
}

.impact-full--orange .impact-full__shape-svg {
    fill: #F26640;
}

.impact-full--purple,
.impact-full--purple.button--news {
    background-color: #6C3F99;
}

.impact-full--purple .impact-full__shape {
    background-color: #52317D;
}

.impact-full--purple .impact-full__shape-svg {
    fill: #6C3F99;
}

.impact-full--green,
.impact-full--green.button--news {
    background-color: #2AAA9E;
}

.impact-full--green .impact-full__shape {
    background-color: #1D958A;
}

.impact-full--green .impact-full__shape-svg {
    fill: #2AAA9E;
}

.impact-full--yellow,
.impact-full--yellow.button--news {
    background-color: #FEC340;
}

.impact-full--yellow .impact-full__shape {
    background-color: #F3B327;
}

.impact-full--yellow .impact-full__shape-svg {
    fill: #FEC340;
}

.impact-full--yellow .article-heading {
    background-color: #6C3F99;
    color: #FFFFFF;
}

.impact-full--yellow .article-heading--link:after {
    border-left-color: white;
}

.impact-full--yellow .impact-full__button-container>*:hover,
.impact-full--yellow .impact-full__button-container>*:focus {
    color: #6C3F99;
    background-color: transparent;
    border-color: #6C3F99;
}

.impact-full--yellow .article-heading--link:hover,
.impact-full--yellow .article-heading--link:focus {
    background-color: #FFFFFF;
    color: #6C3F99;
}

.impact-full--yellow .article-heading--link:hover:after,
.impact-full--yellow .article-heading--link:focus:after {
    border-left-color: #6C3F99;
}

.impact-link {
    padding-right: 0;
}

.impact-link__container {
    margin-bottom: 1rem;
    position: relative;
    display: block;
    height: 439px;
    overflow: hidden;
}

.impact-link__shape {
    position: relative;
    width: 100%;
    padding-top: 58%;
    float: right;
}

.impact-link__shape-svg {
    position: absolute;
    right: 0;
    bottom: -2px;
    width: 100%;
    height: 100%;
}

.impact-link__img {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.impact-link__title {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: calc(1rem + 10px);
    max-width: 86%;
    font-size: 2.6rem;
    line-height: 1.6;
}

.impact-link:hover .highlight,
.impact-link:focus .highlight {
    background-color: #FFFFFF;
    box-shadow: 10px 0 0 #FFFFFF, -10px 0 0 #FFFFFF;
    color: #082244;
}

@media screen and (min-width: 960px) {
    .impact-link {
        padding-right: 1rem;
    }
}

.impact-link--purple {
    background-color: #6C3F99;
}

.impact-link--purple .impact-link__shape {
    background-color: #52317D;
}

.impact-link--purple .impact-link__shape-svg {
    fill: #6C3F99;
}

.impact-link--purple .impact-link__img {
    -webkit-filter: url("#yellow-purple-filter");
    filter: url("#yellow-purple-filter");
}

.impact-link--purple .highlight {
    background-color: #FEC340;
    box-shadow: 10px 0 0 #FEC340, -10px 0 0 #FEC340;
    color: #52317D;
}

.impact-link--green {
    background-color: #2AAA9E;
}

.impact-link--green .impact-link__shape {
    background-color: #1D958A;
}

.impact-link--green .impact-link__shape-svg {
    fill: #2AAA9E;
}

.impact-link--green .impact-link__img {
    -webkit-filter: url("#green-purple-filter");
    filter: url("#green-purple-filter");
}

.impact-link--green .highlight {
    background-color: #FEC340;
    box-shadow: 10px 0 0 #FEC340, -10px 0 0 #FEC340;
    color: #52317D;
}

.impact-link--yellow {
    background-color: #FEC340;
}

.impact-link--yellow .impact-link__shape {
    background-color: #F3B327;
}

.impact-link--yellow .impact-link__shape-svg {
    fill: #FEC340;
}

.impact-link--yellow .impact-link__img {
    -webkit-filter: url("#yellow-purple-filter");
    filter: url("#yellow-purple-filter");
}

.impact-link--yellow .highlight {
    background-color: #52317D;
    box-shadow: 10px 0 0 #52317D, -10px 0 0 #52317D;
    color: #FFFFFF;
}

.quote-block {
    padding: 2.5rem 1.5rem 1.5rem;
    margin-bottom: 1.5rem;
    position: relative;
    min-width: 250px;
    cursor: pointer;
}

.quote-block__container {
    display: block;
}

.quote-block:after {
    position: absolute;
    right: 0;
    bottom: -18px;
    width: 0;
    height: 0;
    border-top: 20px solid #00988A;
    border-left: 20px solid transparent;
    content: " ";
}

.quote-block:before {
    -webkit-clip-path: polygon(0rem 0,
            calc(100% - 1rem) 0,
            100% 1rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0rem);
    clip-path: polygon(0rem 0,
            calc(100% - 1rem) 0,
            100% 1rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0rem);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    background-color: #00988A;
    content: "";
}

.quote-block__quotes {
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 1px;
}

.quote-block__date {
    padding: 0.4rem;
    margin-top: 0.2rem;
    display: inline-block;
    margin-left: -10px;
    font-size: 0.8rem;
    font-weight: 100;
    color: #FFFFFF;
    background-color: #00897C;
}

.quote-block__title {
    line-height: 1.9;
}

.quote-block__highlight {
    background: #00897C;
    color: #FFFFFF;
    box-shadow: 10px 0 0 #00897C, -10px 0 0 #00897C;
}

.quote-block:hover .quote-block__highlight,
.quote-block:focus .quote-block__highlight {
    background: #006F65;
    box-shadow: 10px 0 0 #006F65, -10px 0 0 #006F65;
}

.quote-block:hover .quote-block__date,
.quote-block:focus .quote-block__date {
    background: #006F65;
}

.video-banner {
    padding: 0.1rem 1rem 1rem;
    position: relative;
    width: 100%;
    min-height: 70vh;
}

.video-banner__button {
    margin-bottom: 2rem;
    display: block;
    max-width: 300px;
}

.video-banner__outer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow: hidden;
}

.video-banner__container {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%;
    left: 0;
}

.video-banner__container:before {
    display: block;
    width: 100%;
    padding-top: 56.25%;
    content: "";
}

.video-banner__container>* {
    position: absolute;
}

.video-banner__video iframe,
.video-banner__video object,
.video-banner__video embed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99;
}

.video-banner__video {
    display: none;
}

.video-banner__video.is--open {
    display: initial;
}

@media screen and (min-width: 960px) {
    .video-banner {
        padding-right: 3rem;
        padding-bottom: 3rem;
        padding-left: 3rem;
    }
}

.photo-button {
    margin-bottom: 3rem;
    padding-left: 1rem;
    padding-right: 1rem;
    color: #082244;
}

.photo-button__text {
    padding: 2rem;
    position: relative;
}

.photo-button__text:after {
    width: 0;
    height: 0;
    border-bottom: 7px solid #52317D;
    border-left: 7px solid transparent;
    position: absolute;
    right: 5px;
    bottom: 5px;
    content: "";
}

.photo-button__text--purple {
    border-bottom: 2px solid #52317D;
}

.photo-button__text--green {
    border-bottom: 2px solid #1D958A;
}

.photo-button__text--green:after {
    width: 0;
    height: 0;
    border-bottom: 7px solid #1D958A;
    border-left: 7px solid transparent;
}

.photo-button__text--yellow {
    border-bottom: 2px solid #FEC340;
}

.photo-button__text--yellow:after {
    width: 0;
    height: 0;
    border-bottom: 7px solid #FEC340;
    border-left: 7px solid transparent;
}

.photo-button__p {
    font-size: 0.9rem;
    line-height: 1.4;
}

.photo-button__image {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    -webkit-clip-path: polygon(2rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 2rem),
            calc(100% - 2rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 2rem);
    clip-path: polygon(2rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 2rem),
            calc(100% - 2rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 2rem);
    width: 100%;
    height: 275px;
    background-image: url("../img/test-festival.png");
}

.photo-button:hover .photo-button__text,
.photo-button:focus .photo-button__text {
    border-bottom: 2px solid #B8BEC5;
}

.photo-button:hover .photo-button__text:after,
.photo-button:focus .photo-button__text:after {
    width: 0;
    height: 0;
    border-bottom: 7px solid #B8BEC5;
    border-left: 7px solid transparent;
}

.instagram-card {
    padding: 1rem;
    height: 300px;
}

.instagram-card__image {
    -webkit-clip-path: polygon(0rem 0,
            calc(100% - 1rem) 0,
            100% 1rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0rem);
    clip-path: polygon(0rem 0,
            calc(100% - 1rem) 0,
            100% 1rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0rem);
    padding: 1rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 260px;
    background-image: url("../img/test-festival.png");
    border: 1rem solid white;
}

.clubs {
    margin-bottom: 3rem;
    padding: 1rem;
    position: relative;
    display: block;
    background-color: #FFFFFF;
    border-bottom: 2px solid #6C3F99;
    color: #082244;
    cursor: pointer;
}

.clubs:hover,
.clubs:focus {
    border-bottom: 2px solid #B8BEC5;
}

.clubs:hover:after,
.clubs:focus:after {
    width: 0;
    height: 0;
    border-bottom: 7px solid #B8BEC5;
    border-left: 7px solid transparent;
}

.clubs:after {
    width: 0;
    height: 0;
    border-bottom: 7px solid #6C3F99;
    border-left: 7px solid transparent;
    position: absolute;
    right: 7px;
    bottom: 7px;
    content: " ";
}

.clubs__logo {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    display: inline-block;
    width: 41px;
    height: 47px;
    border-bottom-left-radius: 47%;
    border-bottom-right-radius: 47%;
}

/* ############star rating for clubs and socs############ */

.clubs__rating {
    float: right;
}

.star-off {
    float: left;
    margin-top: 3px;
    height: 35px;
    width: 35px;
    background: url("../assets/svg/sprite/star-off.svg");
    background-size: 45px 45px;
}

.star1-on,
.star2-on,
.star3-on,
.star4-on,
.star5-on,
.star7-on,
.star6-on {
    float: left;
    margin-top: 3px;
    height: 35px;
    width: 35px;
    background: url("../assets/svg/sprite/star-on.svg");
    background-size: 45px 45px;
}

/* ########################### */

/* ############medal rating for clubs and socs############ */
.medal-gold,
.medal-silver,
.medal-bronze {
    height: 50px;
    width: 50px;
    background: no-repeat;
}

.medal-gold {
    background: url("../assets/svg/sprite/medal-gold.svg");
    background-size: 50px 50px;
}

.medal-silver {
    background: url("../assets/svg/sprite/medal-silver.svg");
    background-size: 50px 50px;
}

.medal-bronze {
    background: url("../assets/svg/sprite/medal-bronze.svg");
    background-size: 50px 50px;
}

.clubs__image {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 11rem;
    margin-top: -2rem;
}

.clubs__text {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.clubs__name {
    display: block;
    max-width: 90%;
    padding-left: 10px;
    line-height: 1.7;
}

.clubs__type {
    margin-top: 0.1rem;
    margin-bottom: 0.8rem;
    padding: 0.4rem;
    display: inline-block;
    background-color: #6C3F99;
    font-size: 0.8rem;
    font-weight: 600;
    color: #FFFFFF;
}

.clubs .log-in-to-buy a,
.clubs .form-submit {
    text-align: center;
    width: 100%;
}

.clubs .article {
    padding: 0;
}

.clubs .content {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.clubs .content .field+.field {
    margin-top: 1rem;
}

.clubs .content .field-label {
    float: none;
    margin-bottom: 1rem;
}

.clubs .content .field-item+.field-item {
    margin-top: 0.5rem;
}

.clubs .links li {
    padding-left: 0;
}

.clubs .links li:before {
    content: "";
}

.clubs .field-type-image a {
    padding: 0;
    border: 0;
    background-color: unset;
}

.clubs .field-type-image a img {
    margin: 0;
}

.events {
    margin-bottom: 2rem;
    margin-top: 1rem;
    padding: 1rem;
    position: relative;
    display: block;
    background-color: #FFFFFF;
    border-bottom: 2px solid #F26640;
    color: #082244;
    cursor: pointer;
}

.events:after {
    width: 0;
    height: 0;
    border-bottom: 7px solid #F26640;
    border-left: 7px solid transparent;
}

.events__image {
    padding-top: 3rem;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-pack: end;
    justify-content: flex-end;
}

.events__type {
    align-self: flex-start;
    color: #FFFFFF;
    background: #F26640;
}


/* ########  Volunteering styling  ########## */

.grid-two-one .side-filter {
    max-width: 30%;
}

html.js input.form-autocomplete {
    max-width: 100%;
}

h3.h3.organisation__type {
    padding: 0;
    margin: 0;
}

.organisation__image {
    background-size: contain;
}

.organisation-content-teaser {
    background: #E6E6E6;
    padding: 1em;
}

/* ########## VSU styles ############ */

.volunteering__type {
    margin-top: .1rem;
    margin-bottom: .5em;
    padding: .4rem;
    display: inline-block;
    font-size: .8rem;
    font-weight: 600;
    align-self: flex-start;
    color: #FFFFFF;
    background: #2AAA9E;
    position: absolute;
}

/*
.volunteering-card-description p a {
    color: inherit;
    padding: 0;
    margin: 0;
    text-decoration: underline;
    max-width: 100;
}

.volunteering-card-description p {
    padding: 0;
}

.volunteering-card-description p span {
    font-weight: bold;
} */

.organisation__image {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 11rem;
}

.volunteering-card-highlight {
    font-size: 0.57em;
}

div.organisation-card {
    min-width: 100%;
    display: flex;
}

a.organisation-card {
    background: #E6E9EC;
    border-color: #6C3F99;
    margin-top: 1em;
    max-width: 33%;
}

h2.opportunity-title {
    margin: 1em 0em;
    max-width: 100%;
}

.view-volunteering-opportunities td,
.view-volunteering-directory td {
    background: #E6E9EC;
    border: 0.2em solid #FFFFFF;
    width: 33%;
}

.view-volunteering-opportunities tbody tr:hover td,
table tbody tr:hover td,
.view-volunteering-directory tbody tr:hover td {
    background: #E6E9EC;
}

#edit-term-node-tid-depth-wrapper,
#edit-combine-wrapper {

    float: none;
}

/* .volunteering-card-description h2 {
    margin: 0;
}

.volunteering-card-description a {
    padding: 0;
    margin: 0;
} */

.events__name {
    font-size: 0.9rem;
}

.events__location,
.events__date {
    display: inline;
    color: #FFFFFF;
}

.events__date {
    font-weight: 200;
}

.events__society {
    padding-left: 0.5rem;
    display: inline;
    font-size: 0.8rem;
    font-weight: 600;
}

.events__society-container {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}

.news-block {
    border-bottom: 2px solid #FEC340;
}

.news-block:after {
    width: 0;
    height: 0;
    border-bottom: 7px solid #FEC340;
    border-left: 7px solid transparent;
}

.news-block .events__name {
    margin-bottom: 0.8rem;
}

.news-block .highlight {
    background: #FEC340;
    box-shadow: 10px 0 0 #FEC340, -10px 0 0 #FEC340;
    color: #082244;
}

.officer-block {
    margin-bottom: 2rem;
    position: relative;
    display: inline-block;
    max-width: 188px;
    font-size: 0.8rem;
    color: #082244;
    cursor: pointer;
    border-bottom: 2px solid #FEC340;
}

.officer-block:after {
    width: 0;
    height: 0;
    border-bottom: 7px solid #FEC340;
    border-left: 7px solid transparent;
    position: absolute;
    right: 7px;
    bottom: 7px;
    content: " ";
}

.officer-block__image {
    position: relative;
}

.officer-block__name {
    position: absolute;
    bottom: 1rem;
    left: 10px;
}

.officer-block__text {
    padding: 1rem 0.5rem;
    font-weight: 600;
    line-height: 1.3;
    height: 6rem;
}

.officer-block:hover,
.officer-block:focus {
    border-bottom: 2px solid #B8BEC5;
}

.officer-block:hover:after,
.officer-block:focus:after {
    width: 0;
    height: 0;
    border-bottom: 7px solid #B8BEC5;
    border-left: 7px solid transparent;
}

.view-footer {
    padding-top: 1rem;
    padding-bottom: 1rem;
    text-align: center;
}

.welcome-festival__attendees {
    margin-bottom: 10rem;
}

.welcome-festival__instagram {
    background-color: #F3ECE9;
}

.welcome-festival__instagram-container {
    margin-top: -12rem;
}

.search-index__search {
    padding-top: 1rem;
}

.search-index__top {
    padding-bottom: 1rem;
    padding-top: 1rem;
}

.search-index__filter {
    padding-top: 1rem;
    margin-bottom: 1rem;
}

.search-index__results-container {
    margin-top: 0;
    padding-top: 0;
    margin-right: 0.5em;
}


.search-index__load {
    padding-bottom: 3rem;
    background-color: #E9ECED;
    text-align: center;
}

.search-index .tabs.primary {
    margin-top: 2rem;
}

.search-index .views-row,
.search-index .node-teaser {
    margin-bottom: 3rem;
}

.search-index .views-row>div,
.search-index .node-teaser>div {
    height: 100%;
}

.search-index .views-row>div>.clubs,
.search-index .node-teaser>div>.clubs {
    height: 100%;
}

.officer__events {
    position: relative;
    margin-top: 8vh;
    margin-bottom: 8vh;
    background: rgba(108, 63, 153, 0.08);
}

.officer__events:before {
    position: absolute;
    top: -2vw;
    left: 0;
    width: 100%;
    height: 8vw;
    content: "";
    -webkit-transform: skewY(-3deg);
    transform: skewY(-3deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    background-color: #FFFFFF;
}

.officer__events-container {
    padding-top: 1rem;
}

.officer__others-container {
    display: block;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

.officer__others-container>* {
    margin-right: auto;
    margin-left: auto;
    display: block;
}

@media screen and (max-width: 1300px) and (min-width: 509px) {
    .officer__others-container {
        display: -webkit-box;
        display: flex;
    }

    .officer__others-container>* {
        display: inline-block;
        margin-right: 5%;
        margin-left: 5%;
    }
}

@media screen and (min-width: 1300px) {
    .officer__others-container {
        display: -webkit-box;
        display: flex;
    }
}

.news__intro {
    background: #FDFDFC;
    margin-bottom: 9rem;
}

.news__aside-item {
    margin-bottom: 1rem;
}

.news__section {
    margin-top: -10rem;
}

.news .article img.clip-club-svg {
    -webkit-clip-path: url(#clip-club-svg) !important;
    clip-path: url(#clip-club-svg) !important;
}

.news .article .events {
    max-width: 100%;
    background-color: #FFFFFF;
}

.news .article .events__name {
    font-size: 1.7rem;
}

.news .article .events__type p {
    font-size: 0.8rem;
    color: #FFFFFF;
}

.news .article .clubs {
    padding-left: 1rem;
    padding-right: 1rem;
    background-color: #FFFFFF;
    border-bottom: 2px solid #52317D;
    font-size: 1.7rem;
}

.news .article .news-block {
    border-bottom: 2px solid #FEC340;
}

.news .article .news-block:hover,
.news .article .news-blockfocus,
.news .article .events:hover,
.news .article .eventsfocus,
.news .article .clubs:hover,
.news .article .clubsfocus {
    border-bottom: 2px solid #B8BEC5;
}

.landing__news {
    padding-bottom: 4rem;
    background-color: rgba(254, 195, 64, 0.08);
}

.landing__links {
    background-color: #E6E9EC;
}

.landing__news-container {
    margin-top: -11rem;
}

.landing__links-container {
    margin-top: -5rem;
}

.landing__links-container--top .impact-link:last-child {
    padding-right: 0;
}

.landing__links-container--bottom .impact-link:nth-child(even) {
    padding-right: 0;
}

.landing__news-title {
    margin-bottom: 4rem;
}

.landing .impact-full {
    margin-bottom: 13rem;
}

.landing .banner {
    min-height: 70vh;
}

.home .officer-block {
    max-width: 157px;
}

.home .officer-block__name {
    bottom: 1.5rem;
}

.home__news {
    margin-bottom: 10rem;
    padding-bottom: 0;
    background: #FEC340;
}

.home__events,
.home__upcoming_events {
    background: #52317D;
}

.home__officers {
    margin-top: -1rem;
    margin-bottom: 6rem;
}

.home__officers .clip-officer-svg {
    width: 157px;
    height: 162px;
}

.home__officers .officer-block {
    max-width: 157px;
}

.home__officers .officer-block__name {
    bottom: 1.5rem;
}

.home .officer__events-container {
    padding-top: 2rem;
}

.home__banner-container {
    position: relative;
    height: 70vh;
}

.home__banner-title {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 4.2rem;
}

.home .banner {
    min-height: 70vh;
}

.home .clip-officer-svg {
    width: 157px;
    height: 162px;
}

#tabs li:before,
.tabs li:before {
    display: none;
}

#tabs a,
.tabs a {
    background-color: transparent;
}

table {
    margin-top: 1rem;
}

.fieldset-legend {
    padding: 0.4rem 0.8rem;
    margin-bottom: 2rem;
    z-index: 9;
    display: inline-block;
    background-color: #FEC340;
    font-size: 1.7rem;
    font-weight: 700;
    color: #082244;
}

.views-table,
table {
    width: 100%;
    color: #082244;
    margin: 10px 0 10px 0;
}

.uclu-table {
    width: 100%;
    overflow-x: auto;
}

.uclu-table a {
    color: #F26640;
}

.uclu-table a:hover {
    text-decoration: underline;
}

.views-table {
    font-size: 95%;
}

.views-table th,
table th {
    padding: 0.5rem;
    background-color: #FEC340;
    color: #082244;
    border: 1px solid #082244;
    vertical-align: middle;
}

.views-table th a img,
table th a img {
    margin-left: 1rem;
    vertical-align: middle;
    -webkit-clip-path: none !important;
    clip-path: none !important;
    width: inherit !important;
    margin-bottom: 0 !important;
}

.views-table th a,
.views-table td a,
table th a,
table td a {
    border-bottom: 2px solid transparent !important;
    background-color: transparent !important;
}

.views-table tbody tr.odd td,
table tbody tr.odd td {
    background-color: #FFFFFF;
}

.views-table tbody tr.even td,
table tbody tr.even td {
    background-color: #E6E9EC;
}

.views-table tbody tr:hover td,
table tbody tr:hover td {
    background-color: rgba(242, 102, 64, 0.08);
}

.views-table tbody td,
table tbody td {
    vertical-align: top;
    padding: 0.5rem;
    border: 1px solid #082244;
}

.views-table tbody img,
table tbody img {
    width: 70px;
    height: auto;
}

ul.pager {
    padding: 1rem;
    margin: 0;
}

ul.pager li {
    margin: 0.3rem;
    display: inline-block;
    padding: 0;
}

ul.pager li:before {
    display: none;
}

.fullcalendar {
    padding-bottom: 3rem;
}

.fullcalendar .fc-content {
    background-color: #FFFFFF;
}

ul.action-links {
    padding-bottom: 0.5em;
}

ul.action-links li {
    display: inline-block;
    margin-right: 1rem;
}

ul.action-links li:before {
    display: none;
}

#edit-field-whats-on-category-tid-wrapper>label {
    display: none;
}

/* #edit-field-whats-on-category-tid-wrapper {
    width: 100%;
} */

.bef-checkboxes {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    justify-content: space-between;
}

.bef-checkboxes>* {
    background: url(../img/tick.png) no-repeat right 8px;
    -webkit-clip-path: polygon(0.6rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0.6rem);
    clip-path: polygon(0.6rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0.6rem);
    padding: 0.2rem 0.8rem;
    margin-right: 0.5rem;
    color: #FFFFFF;
    font-weight: 700;
    line-height: 1.8;
    margin-bottom: 0.7rem !important;
    text-transform: uppercase;
}

.bef-checkboxes>* label {
    padding-right: 25px;
}

.bef-checkboxes>*:hover,
.bef-checkboxes>*:focus {
    background-color: #B8BEC5;
}

.bef-checkboxes .form-type-bef-checkbox input {
    display: none;
}

.bef-checkboxes .highlight {
    padding-top: 0.2rem;
}

th.fc-widget-header {
    padding: 0.5rem;
    background-color: #FEC340;
    color: #082244;
}

.field-item img {
    -webkit-clip-path: none !important;
    clip-path: none !important;
    height: auto !important;
    max-width: 600px;
    width: auto;
}

.field-name-field-candidate-photo img {
    max-width: 400px !important;
    max-height: 400px !important;
}

.action-links li {
    padding-left: 0;
}

div.contextual-links-wrapper {
    right: -26px;
}

a.contextual-links-trigger {
    background-color: #FFFFFF;
    border-bottom: 0;
}

a.contextual-links-trigger:hover,
a.contextual-links-trigger:focus {
    border-bottom: 0;
}

.contextual-links li:before {
    display: none;
}

div.workbench-info-block {
    margin: 6px 0;
}

.tabs.primary,
.block-delta-blocks {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    max-width: 1250px;
    margin-right: auto;
    margin-left: auto;
}

.profile img {
    -webkit-clip-path: none !important;
    clip-path: none !important;
}

.profile a {
    line-height: 1.5;
}

.fc-state-default.fc-corner-left,
.fc-state-default.fc-corner-right {
    padding-left: 1.6rem;
    padding-right: 1.6rem;
    margin-bottom: 1rem;
    background: #FFFFFF;
    border: 2px solid #52317D !important;
    border-radius: 0 !important;
    box-shadow: none;
    color: #52317D;
    display: inline-block;
    font-weight: 600;
    height: 2.3rem;
    text-shadow: none;
}

.fc-state-default.fc-corner-left:hover,
.fc-state-default.fc-corner-left:focus,
.fc-state-default.fc-corner-right:hover,
.fc-state-default.fc-corner-right:focus {
    background-color: #52317D !important;
    color: #FFFFFF;
}

.fc-state-active {
    background-color: #52317d !important;
    color: #ffffff !important;
}

span.fc-state-default.fc-state-disabled:hover,
span.fc-state-default.fc-state-disabled:focus {
    background-color: #FFFFFF !important;
    color: #52317D;
}

.fc-header-title h2 {
    color: #082244;
}

.block-system {
    line-height: 1.3rem;
    color: #082244;
}

.block-system .item-list li {
    margin-left: 0;
}

.block-system .item-list li:before {
    display: none;
}

.block-system .item-list li a {
    padding-left: 0;
}

.block-system .horizontal-tabs ul.horizontal-tabs-list li:before {
    display: none;
}

.block-system .fieldset-legend {
    background-color: transparent;
    font-size: 1rem;
    margin-bottom: 0;
    padding-left: 0;
}

.block-system .fieldset-wrapper {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

.horizontal-tabs ul.horizontal-tabs-list {
    display: flex;
    flex-wrap: wrap;
    flex-flow: wrap-reverse;
}

.horizontal-tabs ul.horizontal-tabs-list li {
    border-bottom: solid 1px white;
}


.horizontal-tabs ul.horizontal-tabs-list li a:hover {
    background-color: white;
    border-bottom: solid 0 white;
    color: #082244;
}

.horizontal-tabs ul.horizontal-tabs-list li .selected {
    background-color: #FFFFFF;
    color: #082244;
    border-bottom: 0;
}

.horizontal-tabs ul.horizontal-tabs-list li {
    color: #FFFFFF;
    /*border: solid 1px #DEDEDE;*/
}


.horizontal-tabs ul.horizontal-tabs-list li a {
    background-color: transparent;
    border-bottom: none;
    color: #082244;
}

.horizontal-tabs ul.horizontal-tabs-list .selected strong {
    color: #082244;
}

.article form {
    color: #082244;
}

.article form a {
    background-color: transparent;
    border-bottom: none;
    color: #52317D;
}

.article form a:hover {
    background-color: #FFFFFF !important;
}

.article form .description {
    font-size: 0.9rem;
}

.article form img {
    -webkit-clip-path: none;
    clip-path: none;
}

.article form .mollom-image-captcha {
    padding-left: 35px;
}

.article form .mollom-image-captcha img {
    -webkit-clip-path: none;
    clip-path: none;
    height: 100%;
    width: initial;
}

.article form input {
    margin-bottom: 0.3rem;
}

.article form .form-submit {
    padding: 0.7rem 1.6rem;
    font-size: 0.9rem;
    font-weight: 600;
    display: inline-block;
    color: #52317D;
    border: 2px solid #52317D;
    background-color: #FFFFFF;
}

.article form .form-submit:hover,
.article form .form-submit:focus {
    background-color: #52317D;
    color: #FFFFFF;
}

.article form .mollom-image-captcha-instructions {
    padding-bottom: 0.6rem;
    font-size: 0.9rem;
}

.article form label {
    padding-bottom: 0.6rem;
}

.article form li::before {
    display: none;
}

.article form li li a:hover {
    background-color: #FFFFFF !important;
}

.error {
    font-weight: 500;
}

.error li::before {
    display: none;
}

ul.primary {
    margin-top: 0;
    margin-bottom: 1rem;
    padding: 0;
    border: 0;
}

ul.primary li {
    padding: 0 0 5px 0;
}

ul.primary li a,
#block-delta-blocks-action-links ul.action-links a {
    padding: 0.7rem 1.6rem;
    font-size: 0.9rem;
    font-weight: 600;
    display: inline-block;
    color: #52317D;
    border: 2px solid #52317D !important;
    background-color: #FFFFFF;
}

ul.primary li a:hover,
#block-delta-blocks-action-links ul.action-links a:hover {
    background-color: #52317D !important;
    color: #FFFFFF;
}

#block-delta-blocks-action-links a {
    margin-top: 0.5em;
}

#block-delta-blocks-action-links ul.action-links a:before {
    content: "+ ";
    font-weight: bold;
    font-size: 1rem;
}

ul.primary .active a.active {
    background-color: #EFE9F7 !important;
}

ul.primary .active a.active:hover,
ul.primary .active a.active:focus {
    background-color: #EFE9F7 !important;
    color: #52317D;
}

.log-in-to-buy {
    padding-bottom: 0.5rem;
    padding-top: 0.5rem;
    display: inline-block;
}

.log-in-to-buy a,
.form-submit {
    padding: 0.7rem 1.6rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: #52317d;
    border: 2px solid #52317d;
    background-color: #ffffff;
    display: inline-block;
    margin-right: 0.5rem;
    border-radius: 0;
    cursor: pointer;
}

.search-form .form-submit {
    margin-right: 0;
}

.webform-conditional-operations .form-submit {
    display: inline-block;
}

.log-in-to-buy a:hover,
.log-in-to-buy a:focus,
.form-submit:hover,
.form-submit:focus {
    background-color: #52317D;
    color: #FFFFFF;
}

.uclu-auth-option-shibboleth:before,
.uclu-auth-option-local:before {
    content: none;
}

.uclu-auth-option-shibboleth a,
.uclu-auth-option-local a {
    background-color: transparent;
    padding: 0.7rem 1.6rem 0.7rem 1.6rem;
    font-size: 0.9rem;
    font-weight: 600;
    display: inline-block;
}

.uclu-auth-option-shibboleth .description {
    font-weight: 700;
}

.uclu-auth-option-shibboleth a {
    border: 2px solid #52317D;
    color: #FFFFFF;
    background-color: #52317D;
}

.uclu-auth-option-shibboleth a:hover,
.uclu-auth-option-shibboleth a:focus {
    border: 2px solid #F26640;
    color: #FFFFFF;
    background-color: #F26640;
}

.uclu-auth-option-local a {
    border: 2px solid #52317D;
    color: #52317D;
}

.uclu-auth-option-local a:hover,
.uclu-auth-option-local a:focus {
    border: 2px solid #52317D;
    color: #FFFFFF;
    background-color: #52317D;
}

div.log-in-to-buy {
    padding-bottom: 1rem;
    display: inline-block;
}

div.log-in-to-buy a {
    border: 2px solid #52317D;
}

div.log-in-to-buy a:focus,
div.log-in-to-buy a:hover {
    border: 2px solid #52317D;
    color: #FFFFFF;
    background-color: #52317D !important;
}

span.banner__title--background.title-yellow-blue-filter {
    padding: 0.1rem 10px 0.1rem 10px;
    display: inline;
    background: #F26640;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 1.5;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}

/* What's On Calendar */
/* Reset */
.fc-event-default,
.fc-event-default .fc-event-skin,
.fc-event-default .fc-event-time,
.fc-event-default a {
    border: none;
    background-color: transparent;
}

.colors-taxonomy-term-5032,
.colors-taxonomy-term-5032 .fc-event-skin,
.colors-taxonomy-term-5032 .fc-event-time,
.colors-taxonomy-term-5032 a {
    background-color: transparent;
    border: none;
}

.colors-taxonomy-term-4877,
.colors-taxonomy-term-4877 .fc-event-skin,
.colors-taxonomy-term-4877 .fc-event-time,
.colors-taxonomy-term-4877 a {
    background-color: transparent;
    border: none;
}

.colors-taxonomy-term-4860,
.colors-taxonomy-term-4860 .fc-event-skin,
.colors-taxonomy-term-4860 .fc-event-time,
.colors-taxonomy-term-4860 a {
    background-color: transparent;
    border: none;
}

.colors-taxonomy-term-5024,
.colors-taxonomy-term-5024 .fc-event-skin,
.colors-taxonomy-term-5024 .fc-event-time,
.colors-taxonomy-term-5024 a {
    background-color: transparent;
    border: none;
}

.colors-taxonomy-term-5078,
.colors-taxonomy-term-5078 .fc-event-skin,
.colors-taxonomy-term-5078 .fc-event-time,
.colors-taxonomy-term-5078 a {
    background-color: transparent;
    border: none;
}

.colors-taxonomy-term-5014,
.colors-taxonomy-term-5014 .fc-event-skin,
.colors-taxonomy-term-5014 .fc-event-time,
.colors-taxonomy-term-5014 a {
    background-color: transparent;
    border: none;
}

.colors-taxonomy-term-4866,
.colors-taxonomy-term-4866 .fc-event-skin,
.colors-taxonomy-term-4866 .fc-event-time,
.colors-taxonomy-term-4866 a {
    background-color: transparent;
    border: none;
}

.colors-taxonomy-term-4861,
.colors-taxonomy-term-4861 .fc-event-skin,
.colors-taxonomy-term-4861 .fc-event-time,
.colors-taxonomy-term-4861 a {
    background-color: transparent;
    border: none;
}

.colors-taxonomy-term-4858,
.colors-taxonomy-term-4858 .fc-event-skin,
.colors-taxonomy-term-4858 .fc-event-time,
.colors-taxonomy-term-4858 a {
    background-color: transparent;
    border: none;
}

.colors-taxonomy-term-16571,
.colors-taxonomy-term-16571 .fc-event-skin,
.colors-taxonomy-term-16571 .fc-event-time,
.colors-taxonomy-term-16571 a {
    background-color: transparent;
    border: none;
}

/* -----------CALENDAR NEW STYLING------------- */

.fc-event-time {
    display: block;
}

.fc-event-title {
    padding: 0;
}

.fc-event-inner {
    padding-left: 5px;
    border-radius: 3px;
}

table.fc-header tbody tr:hover {
    background-color: none;
}

.fc-widget-content:hover {
    background-color: #f2f2f2 !important;
}

.fc-state-highlight {
    /* <td> today cell */
    /* TODO: add .fc-today to <th> */
    background: #f2f2f2;
}

/* Bars */

.form-item-edit-field-whats-on-category-tid-5032,
#edit-field-whats-on-category-tid-5032,
.form-item-edit-category-5032,
.selected-edit-category-5032 {
    background-color: #2aaa9e !important;
    color: #082244;
}

.context-uclu-bars-cafes #page-title,
.context-uclu-bars-cafes .pane-1 .pane-title {
    border-color: #2aaa9e;
    color: #082244;
}

.colors-taxonomy-term-5032 *,
.fc-event-past.colors-taxonomy-term-5032 * {
    background-color: #2AAA9E;
    border-color: #2AAA9E;
    opacity: 1;
    color: #082244;
}

/* Clubs & Societies */
.form-item-edit-field-whats-on-category-tid-4877,
#edit-field-whats-on-category-tid-4877,
.form-item-edit-category-4877,
.selected-edit-category-4877 {
    background-color: #F26640 !important;
}

.context-uclu-clubs-societies #page-title,
.context-uclu-clubs-societies .pane-1 .pane-title {
    border-color: #F26640;
}

.colors-taxonomy-term-4877 *,
.fc-event-past.colors-taxonomy-term-4877 * {
    background-color: #F26640;
    border-color: #F26640;
    opacity: 1;
    color: #082244;
}

/* Events & Activities */
.form-item-edit-field-whats-on-category-tid-4860,
#edit-field-whats-on-category-tid-4860,
.form-item-edit-category-4860,
.selected-edit-category-4860 {
    background-color: #6C3F99 !important;
}

.context-uclu-events #page-title,
.context-uclu-events .pane-1 .pane-title {
    border-color: #6C3F99;
}

.colors-taxonomy-term-4860 *,
.fc-event-past.colors-taxonomy-term-4860 * {
    background-color: #6C3F99;
    border-color: #6C3F99;
    opacity: 1;
}

.colors-taxonomy-term-16571 *,
.fc-event-past.colors-taxonomy-term-16571 * {
    background-color: #7C7F12;
    border-color: #7C7F12;
    opacity: 1;
}

/* General */
.form-item-edit-field-whats-on-category-tid-5024,
#edit-field-whats-on-category-tid-5024,
.form-item-edit-category-5024,
.selected-edit-category-5024 {
    background-color: #6A7A8E !important;
}

.form-item-edit-field-whats-on-category-tid-16571,
#edit-field-whats-on-category-tid-16571,
.form-item-edit-category-16571,
.selected-edit-category-16571 {
    background-color: #7C7F12 !important;
}

.colors-taxonomy-term-5024 *,
.fc-event-past.colors-taxonomy-term-5024 * {
    background-color: #6A7A8E;
    border-color: #6A7A8E;
    opacity: 1;
}

.form-item-edit-field-whats-on-category-tid-5024,
#edit-field-whats-on-category-tid-5024,
.form-item-edit-category-5024,
.selected-edit-category-5024 {
    background-color: #6a7a8e !important;
}

.colors-taxonomy-term-16571 *,
.fc-event-past.colors-taxonomy-term-16571 * {
    background-color: #7C7F12;
    border-color: #7C7F12;
    opacity: 1;
}

.form-item-edit-field-whats-on-category-tid-16571,
#edit-field-whats-on-category-tid-16571,
.form-item-edit-category-16571,
.selected-edit-category-16571 {
    background-color: #7c7f12 !important;
}

/* Jobs & Skills */
.form-item-edit-field-whats-on-category-tid-5078,
#edit-field-whats-on-category-tid-5078,
.form-item-edit-category-5078,
.selected-edit-category-5078 {
    background-color: #f29849 !important;
    color: #082244;
}

.context-uclu-jobs-skills #page-title,
.context-uclu-jobs-skills .pane-1 .pane-title {
    border-color: #f29849;
    color: #082244;
}

.colors-taxonomy-term-5078 *,
.fc-event-past.colors-taxonomy-term-5078 * {
    background-color: #F29849;
    border-color: #F29849;
    opacity: 1;
    color: #082244;
}

/* Meetings */
.context-uclu-meetings #page-title,
.context-uclu-meetings .pane-1 .pane-title {
    background-color: #2354B1;
}

.form-item-edit-field-whats-on-category-tid-5014,
#edit-field-whats-on-category-tid-5014,
.form-item-edit-category-5014,
.selected-edit-category-5014 {
    background-color: #2354B1 !important;
}

.colors-taxonomy-term-5014,
.fc-event-past.colors-taxonomy-term-5014 * {
    background-color: #2354B1;
    border-color: #2354B1;
    opacity: 1;
}

/* Representation */
.form-item-edit-field-whats-on-category-tid-4866,
#edit-field-whats-on-category-tid-4866,
.form-item-edit-category-4866,
.selected-edit-category-4866 {
    background-color: #CC3266 !important;
}

.context-uclu-rac #page-title,
.context-uclu-rac .pane-1 .pane-title {
    border-color: #CC3266;
}

.colors-taxonomy-term-4866 *,
.fc-event-past.colors-taxonomy-term-4866 * {
    background-color: #CC3266;
    border-color: #CC3266;
    opacity: 1;
}

/* Sports */
.form-item-edit-field-whats-on-category-tid-4861,
#edit-field-whats-on-category-tid-4861,
.form-item-edit-category-4861,
.selected-edit-category-4861 {
    background-color: #fec340 !important;
    color: #082244;
}

.context-uclu-sport-fitness #page-title,
.context-uclu-sport-fitness .pane-1 .pane-title {
    border-color: #fec340;
    color: #082244;
}

.colors-taxonomy-term-4861,
.fc-event-past.colors-taxonomy-term-4861 * {
    background-color: #FEC340;
    border-color: #FEC340;
    opacity: 1;
    color: #082244 !important;
}

/* Volunteering */
.form-item-edit-field-whats-on-category-tid-4858,
#edit-field-whats-on-category-tid-4858,
.form-item-edit-category-4858,
.selected-edit-category-4858 {
    background-color: #166B78 !important;
}

.context-uclu-volunteering #page-title,
.context-uclu-volunteering .pane-1 .pane-title {
    border-color: #166B78;
}

.colors-taxonomy-term-4858 *,
.fc-event-past.colors-taxonomy-term-4858 * {
    background-color: #166B78;
    border-color: #166B78;
    opacity: 1;
}

/* Marketing */
.context-uclu-mc #page-title,
.context-uclu-mc .pane-1 .pane-title {
    border-color: #FEFE33;
}

/* Postgrads: Persian Rose */
.context-uclu-postgrads #page-title,
.context-uclu-postgrads .pane-1 .pane-title {
    border-color: #FE28A2;
}

/* Rights and Advice: sea green */
.context-uclu-advice-welfare #page-title,
.context-uclu-advice-welfare .pane-1 .pane-title {
    border-color: #2E8B57;
}

/* JobShop Tags - Sector */

div[class="form-item-edit-field-lh-node-skills-tid-"] {
    width: 100%;
}

.view-volunteering-directory .search-index__results-container,
.view-volunteering-opportunities .search-index__results-container {
    margin-top: 0;
    padding-top: 0;
}

.view-volunteering-directory .article a {
    background-color: #E6E9EC;
    max-width: 12.5em;
}

div.organisation-card {
    background-color: #E6E9EC;
}

div.volunteering-card-info {
    min-width: 32%;
    margin: 2%;
    display: flex;
    flex-direction: column;
}

div.volunteering-card-description {
    max-width: 66%;
    padding: 10px;

}

h3.article-heading.article-heading--inside-block a {
    padding: 0;
    text-decoration: none;
    border-bottom: none;
    background-color: transparent;
    overflow-wrap: break-word;
}


.volunteering-card-description p {
    padding: 0
}

/* ########Workbench moderation actions styleds like primary tabs########## */
.moderation-actions {
    padding: 0.5rem;
    border: 2px solid #52317D;
    color: #52317D;
    font-weight: 600;
    margin: 1rem 0;
    }
.moderation-actions:hover {
    background-color: #52317D;
    color: white;
    }

.workbench-moderation-moderate-form select {
    display: block;
    margin: 0.5rem 0;
    }

/*JobShop Tags - Working Hours */

.form-item-edit-field-lh-node-working-hours-tid-25173,
#edit-field-lh-node-working-hours-tid-25173 {
    background-color: #F26640 !important;
}

.form-item-edit-field-lh-node-working-hours-tid-25174,
#edit-field-lh-node-working-hours-tid-25174 {
    background-color: #F26640 !important;
}

/*JobShop Tags - Contract Type*/

.form-item-edit-field-lh-node-contract-type-tid-25172,
#edit-field-lh-node-contract-type-tid-25172 {
    background-color: #082244 !important;
}

.form-item-edit-field-lh-node-contract-type-tid-25170,
#edit-field-lh-node-contract-type-tid-25170 {
    background-color: #082244 !important;
}

.form-item-edit-field-lh-node-contract-type-tid-25171,
#edit-field-lh-node-contract-type-tid-25171 {
    background-color: #082244 !important;
}

.form-item-edit-field-lh-node-contract-type-tid-25185,
#edit-field-lh-node-contract-type-tid-25185 {
    background-color: #082244 !important;
}

.form-item-edit-field-lh-node-contract-type-tid-25322,
#edit-field-lh-node-contract-type-tid-25322 {
    background-color: #082244 !important;
}

/*JobShop Tags - Industries */

.form-item-edit-field-lh-node-industries-tid-25154,
#edit-field-lh-node-industries-tid-25154 {
    background-color: #2AAA9E !important;
}

.form-item-edit-field-lh-node-industries-tid-25158,
#edit-field-lh-node-industries-tid-25158 {
    background-color: #2AAA9E !important;
}

.form-item-edit-field-lh-node-industries-tid-25155,
#edit-field-lh-node-industries-tid-25155 {
    background-color: #2AAA9E !important;
}

.form-item-edit-field-lh-node-industries-tid-25156,
#edit-field-lh-node-industries-tid-25156 {
    background-color: #2AAA9E !important;
}

.form-item-edit-field-lh-node-industries-tid-25153,
#edit-field-lh-node-industries-tid-25153 {
    background-color: #2AAA9E !important;
}

.form-item-edit-field-lh-node-industries-tid-25152,
#edit-field-lh-node-industries-tid-25152 {
    background-color: #2AAA9E !important;
}

.form-item-edit-field-lh-node-industries-tid-25150,
#edit-field-lh-node-industries-tid-25150 {
    background-color: #2AAA9E !important;
}

.form-item-edit-field-lh-node-industries-tid-25159,
#edit-field-lh-node-industries-tid-25159 {
    background-color: #2AAA9E !important;
}

.form-item-edit-field-lh-node-industries-tid-25151,
#edit-field-lh-node-industries-tid-25151 {
    background-color: #2AAA9E !important;
}

.form-item-edit-field-lh-node-industries-tid-25157,
#edit-field-lh-node-industries-tid-25157 {
    background-color: #2AAA9E !important;
}

/*JobShop Tags - Skills */

.form-item-edit-field-lh-node-skills-tid-25160,
#edit-field-lh-node-skills-tid-25160 {
    background-color: #6C3F99 !important;
}

.form-item-edit-field-lh-node-skills-tid-25164,
#edit-field-lh-node-skills-tid-25164 {
    background-color: #6C3F99 !important;
}

.form-item-edit-field-lh-node-skills-tid-25166,
#edit-field-lh-node-skills-tid-25166 {
    background-color: #6C3F99 !important;
}

.form-item-edit-field-lh-node-skills-tid-25169,
#edit-field-lh-node-skills-tid-25169 {
    background-color: #6C3F99 !important;
}

.form-item-edit-field-lh-node-skills-tid-25163,
#edit-field-lh-node-skills-tid-25163 {
    background-color: #6C3F99 !important;
}

.form-item-edit-field-lh-node-skills-tid-25165,
#edit-field-lh-node-skills-tid-25165 {
    background-color: #6C3F99 !important;
}

.form-item-edit-field-lh-node-skills-tid-25161,
#edit-field-lh-node-skills-tid-25161 {
    background-color: #6C3F99 !important;
}

.form-item-edit-field-lh-node-skills-tid-25167,
#edit-field-lh-node-skills-tid-25167 {
    background-color: #6C3F99 !important;
}

.form-item-edit-field-lh-node-skills-tid-25168,
#edit-field-lh-node-skills-tid-25168 {
    background-color: #6C3F99 !important;
}

.form-item-edit-field-lh-node-skills-tid-25162,
#edit-field-lh-node-skills-tid-25162 {
    background-color: #6C3F99 !important;
}

/* Volunteering Tags - Type of organisation */

.form-item-edit-field-vo-type-of-organisation-value-student-led-volunteering-project,
#edit-field-vo-type-of-organisation-value-student-led-volunteering-project {
    background-color: #6C3F99 !important;
}

.form-item-edit-field-vo-type-of-organisation-value-community-organisation,
#edit-field-vo-type-of-organisation-value-community-organisation {
    background-color: #6C3F99 !important;
}

/* Volunteering bef checkboxes color */


[class^="form-item form-type-bef-checkbox form-item-edit-field-vo-type-of-organisation-value"] {
    background-color: #2E8B57;
}

[class^="form-item form-type-bef-checkbox form-item-edit-field-vo-organisation-status-value"] {
    background-color: #318CE7;
}

[class^="form-item form-type-bef-checkbox form-item-edit-field-vop-commitment-tid"] {
    background-color: #2AAA9E;
}


[class^="form-item form-type-bef-checkbox form-item-edit-type-volunteering"] {
    background-color: #FF7F00;
}

/* Custom styling and coloring for Study space availability calendar*/
.form-item-edit-field-study-space-category-value-1,
.study-spaces-category-colors-value-1 {
    background-color: #FF7F00 !important;
    border-color: #FF7F00 !important;
}

.form-item-edit-field-study-space-category-value-2,
.study-spaces-category-colors-value-2 {
    background-color: #9B111E !important;
    border-color: #9B111E !important;
}

.form-item-edit-field-study-space-category-value-3,
.study-spaces-category-colors-value-3 {
    background-color: #2E8B57 !important;
    border-color: #2E8B57 !important;
}

.form-item-edit-field-study-space-category-value-4,
.study-spaces-category-colors-value-4 {
    background-color: #318CE7 !important;
    border-color: #318CE7 !important;
}

.form-item-edit-field-study-space-category-value-5,
.study-spaces-category-colors-value-5 {
    background-color: #8DB600 !important;
    border-color: #8DB600 !important;
}

h3 {
    font-weight: 600;
    font-style: unset;
    font-kerning: unset;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

.item-list ul li {
    margin: 0 0 .25em 1.5em;
    padding: 0;
}

/* Apache Solr */
.search-sort-styled .item-list ul li {
    margin: 0 0 0.25em 1.5em;
    padding: 0;
    list-style-type: none;
    list-style-image: none !important;
    float: left;
}

.search-sort-styled li.leaf {
    -webkit-clip-path: polygon(0.6rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0.6rem);
    clip-path: polygon(0.6rem 0,
            calc(100% - 0rem) 0,
            100% 0rem,
            100% calc(100% - 0rem),
            calc(100% - 0rem) 100%,
            0rem 100%,
            0 calc(100% - 0rem),
            0 0.6rem);
    margin-right: 0.5rem;
    color: #FFFFFF;
    font-weight: 700;
    line-height: 1.8;
    margin-bottom: 0.7rem !important;
    text-transform: uppercase;
    font-size: 0.7rem;
    padding: 0.3rem !important;
}

.search-result-type {
    color: white;
    padding: 0 .5em 0 .5em;
    clip-path: polygon(0rem 0,calc(100% - .3rem) 0,100% .3rem,100% calc(100% - 0rem),calc(100% - 0rem) 100%,.3rem 100%,0 calc(100% - .3rem),0 0rem);
}

.search-sort-styled .leaf-news, 
.search-result-type-article,
.search-result-type-blog {
    background: #f26640;
}

.search-sort-styled .leaf-events, 
.search-result-type-event {
    background: #2aaa9e;
}

.search-sort-styled .leaf-club-or-society-class,
.search-result-type-club_or_society {
    background: #6c3f99;
}

.search-sort-styled .leaf-pages,
.search-result-type-page,
.search-result-type-officer,
.search-result-type-webform {
    background: #082244;
}

.search-sort-styled .leaf-product-class,
.search-result-type-product {
    background: #b2f149;
}

.search-sort-styled .leaf-policy-class,
.search-result-type-policy {
    background: #39b3d7;
}

.search-sort-styled .leaf-slp-class,
.search-result-type-slp {
    background: #f21849;
}

.search-sort-styled .leaf-vsu-class,
.search-result-type-vsu {
    background: #007cfa;
}

.search-sort-styled .facet-disabled {
    background-color: #B8BEC5 !important;
}

.feed-icon img {
    margin-right: 0.5em;
}
.article .feed-icon img {
    max-height: 1em !important;
    max-width: 1em !important;
    clip-path: none !important;
}

.highlight-job {
    background: #0D224C !important;
    color: #FFFFFF !important;
}

.p.clubs__text.ellipse {
    min-height: 5em;
}

.article p.events__location {
    color: #FFFFFF;
    display: inline;
}

.article p.events__date {
    color: #FFFFFF;
    display: inline;
    font-weight: 200;
    font-size: 0.8rem;
}

.job-advert-image img {
    width: 100% !important;
    clip-path: none !important;
}

.form-item-submitted-plans {
    background: #FFBF55;
    padding: 1em;
}

input:checked {
    background: red;
}

.company__logo {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    display: inline-block;
    width: 55px;
    height: 50px;
    border-bottom-left-radius: 47%;
    border-bottom-right-radius: 47%;
}

.company__image {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 13rem;
    overflow: hidden;
}

.jobshop-card-feature {
    background: #FEC340 !important;
    padding: 0em;
}

.jobshop-card {
    background: #FFFFFF !important;
    width: 100% !important;
}

.view-volunteering-content {
    padding-top: 1.5em;
}

.view-volunteering-opportunities .views-exposed-form label,
.view-volunteering-directory .views-exposed-form label {
    font-weight: 600;
    font-size: 0.7rem;
}

.view-volunteering-opportunities .views-exposed-form .views-exposed-widget,
.view-volunteering-directory .views-exposed-form .views-exposed-widget {
    float: inline-start;
    /* LTR */
    padding: .5em 1em 0 0;
    /* LTR */
    width: -webkit-fill-available;

}

.views-exposed-widget.views-submit-button,
.views-exposed-widget.views-reset-button {
    width: auto;
}

.organisation-card {
    margin: 0.2em;
}

#uclu-jobshop-sidebar .bef-checkboxes {
    font-size: 0.8em !important;
}

#uclu-jobshop-sidebar .bef-checkboxes>* {
    background-size: 1.4rem;
}

#uclu-jobshop-sidebar .whats-on-inverted>div:not(.highlight) {
    background-color: #B8BEC5 !important;
    background-position: right -117px;
}

#uclu-jobshop-sidebar .bef-checkboxes .form-item {
    margin-right: 3em;
}

.ui-slider-handle {
    background: #F26640 !important;
    border: none !important;
}

.ui-slider-handle:hover {
    background: #FFFFFF;
    border: 2px solid #F26640 !important;
}

/* popup_message module styles */

#popup-message-background {
    display: none;
    position: fixed;
    _position: absolute;
    /* hack for internet explorer 6*/
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: rgba(8, 34, 68, 0.9);
    border: none;
    z-index: 200;

    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

#popup-message-window {
    display: none;
    position: fixed;
    _position: absolute;
    /* hack for internet explorer 6*/
    overflow: auto;
    background: none;
    border: none;
    z-index: 201;
    padding: 12px;
    text-align: center;

    display: inline-block;
    text-align: center;
}

#popup-message-window h1.popup-message-title {
    font-size: 5em;
}

#popup-message-close {
    color: white;
    font-size: 18px;
    line-height: 14px;
    right: 6px;
    top: 4px;
    position: absolute;
    font-weight: 700;
    display: block;
    cursor: pointer;
}

#popup-message-window p {
    color: white;
    font-weight: bold;
    font-size: 1.5em;
    margin-top: 1em;
    margin-bottom: 1em;
}

#popup-message-window .popup-button {
    color: white;
    padding: 0.5em;
    font-size: 1.5em;
    display: block;
    border: 2px solid white;
    width: 40%;
    min-width: 250px;
    max-width: 350px;
    margin: 0 auto;
    margin-top: 1em;
}

#popup-message-window .popup-button:hover {
    background-color: white;
    color: rgb(8, 34, 68);
}

/* PRIORITIES page styling */

td.left-column--priorities,
td.right-column--priorities,
td.bottom--priorities {
    border: none;
}

.table--priorities tbody td {
    padding: 0;
}

.table--priorities tbody tr:hover td {
    background-color: transparent;
}

td.right-column--priorities {
    /* min-width: 12rem; */
    text-align: right;
}

td.left-column--priorities {
    min-width: 100%;
    padding-right: 2rem;
}

.table--priorities td.bottom--priorities {
    padding-right: 15rem;
}

@media screen and (max-width: 850px) {
    .priorities-grid-container {
        padding: 0 2rem 0;
    }

    .table--priorities td.bottom--priorities {
        padding: 0;
        max-width: 100%;
    }

    .table--priorities td.left-column--priorities {
        min-width: 100%;
        padding-right: 2rem;
    }
}

.priority-delayed {
    background-color: #F26640;
    color: white;
}

.priority-complete {
    background-color: #2AAA9E;
    color: white;
}

.arrow-more {
    color: #F26640;
}

#popup-message-window .popup-button:hover {
    background-color: white;
    color: rgb(8, 34, 68);
}

/* Header message */

.header-message {
    display: block;
    text-align: center;
    font-size: 1.2rem;
    padding: 0.8rem 0 0.8rem 0;
    font-weight: 600;
    color: #082244 !important;
    background: #FEC340 !important;
}

.header-message>a {
    display: inline-block;
    color: #082244 !important;
    border: solid 2px;
    border-color: #082244;
    padding: 0.5rem;
    cursor: pointer;
    text-decoration: none;
    background: #FEC340 !important;
}

.header-message>a:hover {
    color: white !important;
    background: #082244 !important;
}

/* Styling for members block */
.members-block-count {
    color: #F26640;
    text-align: left;
}

.statistics-block-count {
    line-height: 0.7;
    margin: 0;
    padding: 0;
    font-size: 4em;
    font-weight: bold;
}

.statistics-block-subheader {
    font-size: 1.2em;
    margin-left: 2em;
    line-height: 2em;
}

.link-no-style {
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    border: none !important;
}

img.image-right {
    float: right;
    margin: 20px 0 20px 30px;
}

.field-name-commerce-price {
    margin-bottom: 1rem;
}

caption {
    text-align: left;
    font-weight: 800;
    margin-top: 0.3rem;
    margin-bottom: 0.3rem;
}

/* ############# responsive display of filters (what's on page) ############# */

.whats-on-calendar-heading {

    background-color: #f26640;
    color: white;
    width: 18%;
    padding: 1%;
    clip-path: polygon(.6rem 0, calc(100% - 0rem) 0, 100% 0rem, 100% calc(100% - 0rem), calc(100% - 0rem) 100%, 0rem 100%, 0 calc(100% - 0rem), 0 .6rem);
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1.4rem;
    margin-top: 5%;
}

.fullcalendar {
    margin-right: 0.4rem;
}

.view-upcoming-events .fc-header-title h2 {
    line-height: 2;
}

.page-whats-on-list .banner__back-link {
    display: none;
}

.page-whats-on .banner__back-link {
    display: none;
}

.view-upcoming-events .views-exposed-form {
    margin-bottom: 5%;
}

.view-upcoming-events .form-type-bef-checkbox {
    width: 18%;
}

.view-upcoming-events input,
.page-whats-on-list input,
.page-whats-on-list select,
.view-upcoming-events select {
    border: none;
    padding-left: 12px;
    width: 98%;
    color: #082244;
    padding: 10px;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1rem;
}

.view-upcoming-events .bef-checkboxes>* label {
    padding-right: 0;
}

.view-upcoming-events .views-exposed-form label {
    font-size: 0.8rem;
}

.view-upcoming-events .views-widget-filter-name,
.view-upcoming-events .views-widget-filter-title {
    margin: 0 1.5rem 1.5rem 0;
}

.view-upcoming-events.view-display-id-full_calendar .views-exposed-widget input[type="text"],
.page-whats-on-list .views-exposed-widget input[type="text"] {
    border: none;
    border-bottom-color: currentcolor;
    border-bottom-style: none;
    border-bottom-width: medium;
    border-bottom: solid 3px #f26640;
    padding: 12px 5px;

}

.page-whats-on-list .views-exposed-widget input[type="text"] {
    margin-bottom: 3%;
}

.view-upcoming-events .search-index__filter {
    padding-top: 0;
}

.view-upcoming-events .container {
    padding-top: 0;
}

.whats-on-inverted>div:not(.highlight) {
    color: white;
}

@media screen and (max-width: 1200px) {

    .tabs.primary,
    .block-delta-blocks {
        margin: 0 1rem;
    }

    .block.block-delta-blocks.contextual-links-region {
        margin-left: 0;
    }

    ul.action-links {
        margin: 0 1rem;
    }

    #edit-field-whats-on-category-tid-wrapper {
        min-width: 100%;
    }

    .page-whats-on-list #edit-field-whats-on-category-tid-wrapper {
        margin: 0 1rem;
    }

    .page-whats-on-list .banner__back-link {
        display: none;
    }

}



@media screen and (max-width: 960px) {
    .view-upcoming-events .contextual-links-region {
        display: none;
    }

    .page-whats-on-list .views-exposed-form,
    .page-whats-on-list .views-exposed-widget {
        margin: 0 1rem;
    }

    .page-whats-on-list .bef-checkboxes,
    .view-upcoming-events .bef-checkboxes {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .view-upcoming-events .form-type-bef-checkbox {
        width: 100%;
    }
}

.view-upcoming-events .view-header {
    margin: 0;
}


/* ############## styling for what's on list view ################ */

.page-whats-on-list input[value="Apply"] {

    display: none;

}

.page-whats-on-list #edit-field-whats-on-category-tid-wrapper {
    margin-left: 1%;
    width: 30%;
}

.page-whats-on-list input,
.page-whats-on-list select {
    border-bottom: solid #ED6D41;
    background-color: white;
}

.page-whats-on-list span {
    color: #082244;
}

.page-whats-on-list #edit-field-whats-on-category-tid-wrapper {
    margin-left: 4%;
}

.page-whats-on-list .views-exposed-form, .page-whats-on-list .views-exposed-widget,
.view-upcoming-events .views-exposed-form , .view-upcoming-events .views-exposed-widget{
    padding: 0;
}


@media screen and (max-width: 1200px) {

    .page-whats-on-list #edit-field-whats-on-category-tid-wrapper {
        margin-left: 1rem;
        min-width: 30%;
    }

    .page-whats-on-list .search-index__search {
        margin-left: 2rem;

    }

    .page-whats-on-list ul.tabs.primary {
        display: none;
    }

}

@media screen and (max-width: 992px) {
    .page-whats-on-list .search-index__search {

        margin-left: 0;
    }

    .page-whats-on-list #edit-title-wrapper {
        min-width: 45%;
    }

    .page-whats-on-list .whats-on-calendar-heading {
        min-width: 40%;
        margin: 2rem 0 0 2rem;
    }

    .page-whats-on-list #edit-field-whats-on-category-tid-wrapper {
        margin-left: 5%;
    }
}

@media screen and (max-width: 760px) {

    .page-whats-on-list #edit-field-whats-on-category-tid-wrapper {
        margin-left: 1rem;
        min-width: 100%;
    }

    .page-whats-on-list #edit-title-wrapper {
        min-width: 100%;
    }

    .whats-on-calendar-heading {
        min-width: 40%;
        margin: 2rem 0 0 2rem;
    }

    .page-whats-on-list .search-index__search {
        margin-left: 0;
        margin-right: 2rem;
    }

}

/* CLUB AND SOCIETY DIRECTORY */

.view-uclu-societies-directory .form-type-textfield  input {
    border: none;
    border-bottom-width: medium;
    border-bottom: solid 3px #f26640;
    padding: 12px 5px !important;
}

.view-uclu-societies-directory .form-type-select select {
    background-color: #fff;
    border: none;
    border-bottom: solid #ed6d41;
    padding: 10px;
}

.view-uclu-societies-directory .views-exposed-form .views-exposed-widget {
    margin-right: 30px;
}

.article ul.multiselect_btns li {
    padding-left: 0px !important;
}



.union-button {
    padding: 0.7rem 1.6rem 0.7rem 1.6rem !important;
    font-size: 0.9rem;
    font-weight: 600;
    display: inline-block;
    color: #52317D !important;
    border: 2px solid #52317D !important;
    background-color: #FFFFFF !important;
}

.union-button a {
    text-decoration: none;
    padding: none;
    border: none;
    background-color: transparent;
}

.union-button:hover {
    color: #FFFFFF !important;
    background-color: #52317D !important;
}