﻿/*==============================            FONTS            ==============================*/
@import url('https://fonts.googleapis.com/css2?family=Ovo&family=Quattrocento+Sans:ital,wght@0,400;0,700;1,400&display=swap');

.ovo {
    font-family: 'Ovo', serif;
}

.quattro {
    font-family: 'Quattrocento Sans', sans-serif;
}


/*====================================            BASE STYLES            ====================================*/
html {
    color: #363637;
    font-size: 1rem;
    line-height: 1.55;
}

::-moz-selection {
    background: #676768;
    text-shadow: none;
    color: #fff;
}

::selection {
    background: #676768;
    text-shadow: none;
    color: #fff;
}

body {
    font: normal 100% 'Quattrocento Sans', sans-serif;
    background-color: #fff;
    margin: 0 auto;
    padding: 0;
    position: relative;
    max-width: 2560px;
}

section, header, footer, main, article, nav, aside {
    position: relative;
}

.main-body {
    margin: 0;
    flex: 1;
}

h1 {
    font-size: 2.8rem;
    font-weight: 600;
    line-height: 125%;
    text-align: center;
    margin: 0 0 0.865em 0;
    padding-top: 0.225em;
    color: #929398;
    font-style: normal;
    font-family: 'Ovo', serif;
}

h2 {
    font-size: 2.2rem;
    font-weight: 300;
    line-height: 125%;
    text-align: center;
    margin: 1em auto 0.865em auto;
    padding-top: 0.225em;
    color: #828388;
    font-family: 'Ovo', serif;
    max-width: 820px;
}

h3 {
    font-size: 1.6rem;
    font-weight: 400;
    text-align: center;
    margin: 0 auto 0.465em auto;
    max-width: 820px;
    padding: 0.365em 0 0 0;
    color: #929398;
    font-family: 'Ovo', serif;
    text-align: left;
}

h4 {
    font-size: 1.28rem;
    font-weight: 300;
    text-align: left;
    max-width: 820px;
    margin: 0 auto 0.865em auto;
    padding-top: 0.225em;
    color: #626368;
    line-height: 120%;
    font-family: 'Ovo', serif;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

p {
    font-size: 1.125rem;
    line-height: 165%;
    font-weight: 400;
    padding: 0;
    margin: 0 0 0.865em 0;
    color: #565657;
    text-align: left;
}

br[data-mce-bogus="1"] {
    display: none;
}

strong {
    font-weight: 700;
}

a {
    outline: none !important;
    color: #587A8D;
    font-weight: 400;
    text-decoration: none !important;
    -webkit-transition: all 175ms ease;
    -moz-transition: all 175ms ease;
    transition: all 175ms ease;
    text-decoration: none !important;
}

    a:hover {
        color: #2E515A;
        color: #426076;
        text-decoration: underline;
    }

.active {
    background: #eee;
}

.smaller {
    font-size: 0.86rem;
}

.italic {
    font-style: italic;
}

/*====================================            VISIBILITY            ====================================*/

.hidden {
    display: none !important;
}

.invisible {
    visibility: hidden;
}

.clear-fix:after {
    content: " ";
    visibility: hidden;
    display: block;
    height: 0;
    clear: both;
}

section[id]:before {
    content: "";
    display: none;
    height: 0px;
    margin: 0;
}

.spacer {
    clear: both;
}

/*====================================             FORMS                 ====================================*/

form {
    max-width: 640px;
}

.formstage {
    display: none;
}

.step {
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbbbbb;
    border: none;
    border-radius: 50%;
    display: inline-block;
    opacity: 0.5;
}

    .step.active {
        opacity: 1;
    }

    .step.finish {
        background-color: #4CAF50;
    }

fieldset {
    border: none;
    margin: 0;
    padding: 0;
}

    fieldset .group {
        position: relative;
        margin-left: 0;
    }

    fieldset legend {
        background: #d2d2d2;
        width: 100%;
        padding: 12px 16px;
        margin-top: 1em;
        color: #333;
    }

    fieldset ol, fieldset ul {
        padding: 0;
        list-style: none;
        margin: 20px 0;
    }

        fieldset ol li {
            text-align: left;
            padding: 6px 0 6px 0;
            position: relative;
        }


input, textarea, select {
    border: 1px solid #e2e2e2;
    background: #fff;
    color: #333;
    margin: 2px 0 1em 0;
    max-width: 320px;
    padding: 1em 1em 1em 1em;
    width: 100%;
    width: calc(100% - 30px);
    font-size: 0.965rem;
    display: block;
    outline: 0;
}

    input.PayPalButton {
        width: 149px;
        max-width: 149px;
        height: auto;
    }

ul.formlist {
    list-style-type: none;
}

input[type="checkbox"] {
    display: inline-block;
    width: 60px;
    padding: 0;
    margin: 0;
}

    input[type="checkbox"] + label {
        display: inline-block;
    }

select {
    font-size: 0.845rem;
    max-width: 352px;
}

input[type="radio"] {
    display: inline-block;
    width: 80px;
}

    input[type="radio"] + label {
        display: inline-block;
    }

textarea {
    height: 10em;
    resize: none;
}

    input:focus, textarea:focus {
        border: 1px solid #ccc;
        -webkit-box-shadow: 0px 0px 5px rgba(130, 140, 150, 0.75);
        -moz-box-shadow: 0px 0px 5px rgba(130, 140, 150, 0.75);
        box-shadow: 0px 0px 5px rgba(130, 140, 150, 0.75);
    }

    /* Mark input boxes that gets an error on validation: */
    input.error, select.error, textarea.error {
        background-color: #ffdddd;
    }

label.checkbox {
    display: inline;
}

label {
    font-size: .8425rem;
    display: block;
    color: #555;
    color: #0F8096;
    font-weight: 400;
    -webkit-transition: .333s ease top, .333s ease opacity;
    transition: .333s ease top, .333s ease opacity;
}

#email34, #email_34 {
    visibility: hidden;
}

.js-hide-label label {
    /* just adding some colour change on focus */
    color: #555;
}

.js-unhighlight-label label {
    color: #999
}

input[type=submit], .button-outline, .button-primary {
    width: auto;
    background: #DFB445;
    color: #222;
    text-transform: uppercase;
    padding: 12px 34px;
    border: 0px;
    margin: 2px 0 1em 0;
    cursor: pointer;
    -webkit-appearance: none; /* remove default browser <button> styling */
    -webkit-transition: .2s ease -webkit-transform;
    transition: .2s ease transform;
}

    input[type=submit]:hover, .button-outline:hover, .button-primary:hover {
        color: #fff;
        background: #DFB445;
        border: 0;
    }

fieldset .group {
    position: relative;
    margin-left: 0;
}


/*=======================================                 HEADER               =======================================*/

body {
    position: relative
}

    body.normalPage {
        display: flex;
        min-height: 100vh;
        flex-direction: column;
    }

header {
    width: 100%;
    max-width: 2560px;
    margin: 0 auto;
    position: fixed;
    top: 0;
    background: transparent;
    z-index: 120;
    height: auto;
    height: 100px;
    -webkit-transition: 0.6s ease-in-out;
    -moz-transition: 0.6s ease-in-out;
    -o-transition: 0.6s ease-in-out;
    -ms-transition: 0.6s ease-in-out;
    transition: 0.6s ease-in-out;
}

    header.fixed {
        background-color: #003E4A;
        border-bottom: 1px solid #868787;
    }

    header .content-wrapper {
        max-width: 1500px;
        margin: 0 auto;
        padding: 0 2%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        -webkit-transition: 0.6s ease-in-out;
        -moz-transition: 0.6s ease-in-out;
        -o-transition: 0.6s ease-in-out;
        -ms-transition: 0.6s ease-in-out;
        transition: 0.6s ease-in-out;
    }

    header .logo, header .scrollLogo {
        text-align: left;
        position: relative;
        margin: 6px 0 0 0;
        padding: 0;
        z-index: 10;
        order: 1;
        flex: 0 1 auto;
        -webkit-transition: 0.6s ease-in-out;
        -moz-transition: 0.6s ease-in-out;
        -o-transition: 0.6s ease-in-out;
        -ms-transition: 0.6s ease-in-out;
        transition: 0.6s ease-in-out;
    }


        header .logo img, header .scrollLogo img {
            width: auto;
            max-width: 323px;
            max-height: 88px;
        }

    header.fixed .logo img {
        width: auto;
        max-width: 323px;
        max-height: 88px;
    }

    header nav {
        padding: 30px 0 0 0;
        text-align: right;
        transition: 0.25s;
        order: 2;
        flex: 1 1 auto;
    }

    header.fixed nav {
        padding: 0;
    }

    header nav.opened {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }

.headroom {
    -webkit-transition: 0.6s ease-in-out;
    -moz-transition: 0.6s ease-in-out;
    -o-transition: 0.6s ease-in-out;
    -ms-transition: 0.6s ease-in-out;
    transition: 0.6s ease-in-out;
}

#headerfix {
    height: 0;
}

    #headerfix.fixed {
        height: 100px;
    }

.nav-up {
    top: -40px;
}

/*==============================       LOGOs      =======================================*/


/*==============================            NAV            ==============================*/


#menu.collapsed {
    display: none;
}

.main-menu-btn {
    position: relative;
    display: inline-block;
    margin: 6px 18px 8px 0;
    padding: 0;
    width: 42px;
    height: 42px;
    text-indent: 0px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    z-index: 120;
}

/* hamburger icon */
.main-menu-btn-icon, .main-menu-btn-icon:before, .main-menu-btn-icon:after {
    position: absolute;
    top: 50%;
    right: 2px;
    height: 4px;
    width: 38px;
    background: #e5e5e5;
    -webkit-transition: all 0.25s;
    transition: all 0.25s;
}

    .main-menu-btn-icon:before {
        content: '';
        top: -12px;
        left: 0;
    }

    .main-menu-btn-icon:after {
        content: '';
        top: 12px;
        left: 0;
    }

/* x icon */
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon {
    height: 0;
    background: transparent;
}

    #main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:before {
        top: 0;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    #main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:after {
        top: 0;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
/* hide menu state checkbox (keep it visible to screen readers) */
#main-menu-state {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    border: 0;
    padding: 0;
    overflow: hidden;
    clip: rect(1px,1px,1px,1px);
}

    #main-menu-state:checked ~ #primary-menu {
        display: block;
    }


.navmenu {
    display: block;
    max-width: 1200px;
    margin: 0 auto;
}

    .navmenu li {
        display: inline-block;
        position: relative;
        z-index: 100;
    }

        .navmenu li:first-child {
            margin-left: 0;
        }

        .navmenu li a {
            text-decoration: none;
            font-size: 1.125rem;
            padding: 20px 15px;
            display: block;
            color: #fff;
            transition: all 0.2s ease-in-out 0s;
        }

            .navmenu li a:hover, .navmenu li:hover > a {
                color: #676768;
                background: #E6ECED;
            }

        .navmenu li .fa {
            display: none;
        }

    .navmenu ul {
        visibility: hidden;
        opacity: 0;
        margin: 0;
        padding: 0;
        width: 170px;
        position: absolute;
        left: 0px;
        background: #fff;
        z-index: 99;
        transform: translate(0,20px);
        transition: all 0.2s ease-out;
    }


        .navmenu ul:after { /* belonging-to up-arrow */
            bottom: 100%;
            left: 20%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(255, 255, 255, 0);
            border-bottom-color: #fff;
            border-width: 6px;
            margin-left: -6px;
        }

        .navmenu ul li {
            display: block;
            float: none;
            background: none;
            margin: 0;
            padding: 0;
            text-align: left;
            transition: all 0.2s ease-out;
        }

            .navmenu ul li a {
                font-size: 1rem;
                font-weight: normal;
                display: block;
                color: #797979;
                background: #F9F9F9;
            }

                .navmenu ul li a:hover, .navmenu ul li:hover > a {
                    background: #E3E3E3;
                }

    .navmenu li:hover > ul {
        visibility: visible;
        opacity: 1;
        transform: translate(0,0);
    }

    .navmenu ul ul {
        left: 169px;
        top: 0px;
        visibility: hidden;
        opacity: 0;
        transform: translate(20px,20px);
        transition: all 0.2s ease-out;
    }

        .navmenu ul ul:after {
            left: -6px;
            top: 10%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
            border-color: rgba(255, 255, 255, 0);
            border-right-color: #fff;
            border-width: 6px;
            margin-top: -6px;
        }

    .navmenu li > ul ul:hover {
        visibility: visible;
        opacity: 1;
        transform: translate(0,0);
    }


@media (min-width: 980px) { /* hide the button in desktop view */

    #menu-button {
        display: none;
    }

    /* always show the menu in desktop view */
    #menu.collapsed {
        display: block;
    }
}

@media (max-width: 980px) {
    .mainWrap {
        width: auto;
        padding: 50px 20px;
    }

    nav {
        margin: 0;
        background: none;
    }

    .navmenu {
        display: none;
        margin-right: 0;
        position: fixed;
        right: 0;
        left: 0;
        top: 86px;
        top: 0;
        bottom: 0;
        width: 100%;
        background: #c0c0c0;
        background: rgba(100,100,100,0.8);
    }

        .navmenu li .fa {
            display: inline-block;
        }

        .navmenu li {
            display: block;
            margin: 0;
            background: #fff;
            background: #fafafa;
        }

            .navmenu li.toplevel:first-child {
                padding-top: 100px;
                background: unset;
            }

            .navmenu li a {
                background: #eee;
                color: #797979;
                padding-right: 40px;
                font-size: 1.125rem;
                text-align: right;
            }

                .navmenu li a:hover, .navmenu li:hover > a {
                    color: #676768;
                    background: #ddd;
                }

            .navmenu li:hover > a {
                background: #eee;
            }

        .navmenu ul {
            visibility: hidden;
            opacity: 0;
            top: 0;
            left: 0;
            width: 100%;
            transform: initial;
        }

        .navmenu li:hover > ul {
            visibility: hidden;
            position: absolute;
            opacity: 0;
            top: 0;
            left: 0;
            width: 100%;
            transform: initial;
        }

        .navmenu li.hasSub.clicked ul {
            visibility: visible;
            opacity: 1;
            position: relative;
            transform: initial;
        }

        .navmenu ul ul {
            left: 0;
            transform: initial;
        }

        .navmenu li > ul ul:hover {
            transform: initial;
        }
}

@media (max-width: 480px) {
}




.overlayInner {
    width: auto;
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 2%;
}

.flexrow {
    display: flex;
    flex-direction: row;
}

.flex-align-right {
    justify-content: flex-end;
}

.col-1 {
    width: 8.333%;
}

.col-2 {
    width: 16.667%;
}

.col-3 {
    width: 25%;
}

.col-4 {
    flex: 0 0 33%;
}

.col-5 {
    width: 41.667%;
}

.col-6 {
    width: 50%;
}

.col-7 {
    width: 58.333%;
}

.col-8 {
    width: 66.667%;
}

.col-9 {
    width: 75%;
}

.col-10 {
    width: 83.333%;
}

.col-11 {
    width: 91.667%;
}

.col-12 {
    width: 100%;
}

.col-auto {
    width: auto;
}

.col-spacer {
    flex: 1 1 auto;
}

.col-align-left {
    text-align: left;
}

.col-align-right {
    text-align: right;
}

.col-fill-height {
    align-items: stretch;
}


/*==============================            SECTIONS            ==============================*/

section {
    position: relative;
    margin: 0;
    padding: 0;
    clear: both;
    flex: 1 1 auto; /* why flex here? */
}

    section.hidden {
        height: 0;
    }

.main-content {
    padding: 0;
    margin: 0;
}

section .wrap {
    position: relative;
    padding: 0;
    margin: 0;
}

.wrap .innerText {
    max-width: 1500px;
    margin: auto;
    padding: 20px 2% 2em 2%;
    position: relative;
}

a.clickableBlock {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.columnWidth .wrap .innerText {
    max-width: 1500px;
    padding: 20px 2% 2em 2%;
}

.mediumWidth .wrap .innerText {
    max-width: 1200px;
    padding: 20px 2% 2em 2%;
}

.textColumnWidth .wrap .innerText {
    max-width: 820px;
    padding: 20px 2% 2em 2%;
}

section.fullwidth {
    max-width: 100%;
}

.fullWidth .wrap .innerText {
    max-width: unset;
    margin: auto;
    padding: 20px 0 2em 0;
}

.innerText p {
    max-width: 820px;
    width: auto;
    margin-left: auto;
    margin-right: auto;
}

p.largeText {
    font-size: 1.245rem;
    line-height: 175%;
}

section ul {
    list-style-type: disc;
    max-width: 820px;
    margin: 0 auto 1.2em 16px;
    padding: 0 0 0 12px;
}

section li {
    padding-left: 32px;
    line-height: 155%;
    padding-top: 2px;
    padding-bottom: 14px;
}

ul.tUploads {
    padding-left: 0;
    margin-left: 0;
}

    ul.tUploads li {
        list-style-type: None;
        margin-left: -9px;
        margin-right: -9px;
        padding: 5px 9px;
    }

        ul.tUploads li:nth-of-type(odd) {
            background-color: #f8f7f7;
        }

.tUpload {
    display: flex;
    align-items: flex-start;
}

    .tUpload div {
        flex: 1 1 auto;
    }

    .tUpload .author {
        font-weight: 600;
        font-size: 1.025rem;
        font-family: 'Quattrocento Sans', sans-serif;
    }

    .tUpload .download {
        text-align: right;
        padding-left: 30px;
    }

.twocolumn ul {
    display: flex;
    justify-content: space-between;
    margin: 0 auto 40px auto;
    max-width: unset;
}

.twocolumn li {
    display: inline-block;
    list-style-type: none;
    flex: 0 0 50%;
    max-width: 820px;
    padding: 0;
    margin: 0;
}

    .twocolumn li div {
        padding: 0 5%;
    }

.quote, blockquote {
    font-family: 'Open sans',sans-serif;
    font-size: 1.25rem;
    line-height: 1.55;
    font-style: italic;
    background-color: rgba(150,150,145,0.25);
    padding: 1em;
    margin: 1em auto 1em auto;
    border-radius: 0.5em;
    max-width: 820px;
}

section.staticImage .wrap, section.backgroundVideo .wrap {
    padding: 0;
    margin: 0;
    width: 100%;
    height: auto;
    overflow: hidden;
    line-height: 100%;
}

    section.staticImage .wrap img {
        width: 100%;
        margin: 0 auto;
        height: auto;
        max-width: 100%;
        max-height: 100%;
        display: block;
    }

section.fullScreen .wrap img {
    margin: 0 auto;
    height: 100vh;
    object-fit: cover;
}

.fixedHeader section.fullScreen .wrap img {
    height: 100vh;
}

.fixedHeader section.fullScreen:first-of-type .wrap img {
    height: calc(100vh - 100px);
}

section.staticImage .wrap.fullscreenImage {
    height: 90vh;
    height: calc(100vh - 84px);
}

ection.backgroundVideo .wrap.fullscreenVideo {
    height: 90vh;
    height: calc(100vh - 84px);
    max-height: 55.56vw;
}

section.staticImage.home .wrap,
section.backgroundVideo.home .wrap.fullscreenVideo {
    height: 100vh;
}

section.fullscreenImage .wrap .innerText,
section.backgroundVideo .wrap .innerText {
    max-width: 100%;
    min-height: 100vh;
    margin-top: -79px;
    padding: 0;
    height: 100vh;
}

    section.fullscreenImage .wrap .innerText .scrollNext,
    section.backgroundVideo .wrap .innerText .scrollNext {
        bottom: 30px;
        width: 80px;
        margin: 0 auto;
    }

section.staticImage .wrap.fullscreenImage img,
section.backgroundVideo .wrap.fullscreenVideo iframe {
    object-position: center center;
}

section.staticImage .wrap.fullscreenImage img, section.fullscreenImage .wrap img {
    width: 100%;
    object-fit: cover;
    margin: 0 auto;
    height: 100vh;
}

section.fullscreenImage .wrap img {
    /*! object-position: 0px 0px; */
    object-position: 20% 50%;
}

section.backgroundVideo .vimeo-wrapper {
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    max-width: 100%;
    z-index: -1;
    pointer-events: none;
    overflow: hidden;
    position: relative;
    object-fit: cover;
    margin: 0 auto;
}

.vimeo-wrapper iframe {
    padding: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

@media screen and (max-aspect-ratio: 16/9) {
    section.backgroundVideo .vimeo-wrapper {
        width: 100%;
    }
}

.bannerCaption {
    display: block;
    text-align: center;
    width: 100%;
    z-index: 1;
    position: absolute;
    top: 60px;
}

    .bannerCaption .captionInner {
        max-width: 1500px;
        margin: 0 auto;
        text-align: left;
    }

p.viewAll {
    text-align: left;
}

.button {
    padding: 12px 34px;
    background: #003E4A;
    color: #eee;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    line-height: 136%;
}

    .button.longbutton i {
        padding: 0 4px 0 8px;
        vertical-align: middle;
    }

    .button.longbutton:hover i {
        padding: 0 0 0 12px;
    }

    .button a {
        color: #eee;
    }

        .button:hover, .button:active, .button:focus, .button a:hover {
            color: #ffffff;
            background: #003E4A;
        }

.tabs {
    display: inline-block;
    width: 100%;
    padding: 0;
    position: relative;
}

.mobileOnly {
    display: inline-block;
    /*! width: 80px; */
    position: relative;
    text-align: right;
    margin-top: 10px;
}

.bannerCaption h1 {
    font-size: 2.8rem;
    font-weight: 400;
    font-family: 'Open Sans', sans-serif;
    color: #fff;
    text-align: left;
    position: relative;
    padding: 2px 12px 8px 12px;
    display: table; /* so background applies to text only */
    margin: 8px auto 8px 0;
    background-color: rgba(30,30,30,0.3);
    line-height: 1.2;
}

.bannerCaption h2, .bannerCaption h3, .bannerCaption h4 {
    color: #fff;
    text-align: left;
    position: relative;
    padding: 2px 12px 8px 12px;
    display: table; /* so background applies to text only */
    margin: 8px auto 8px 0;
    background-color: rgba(30,30,30,0.3);
    line-height: 135%;
}

.bannerCaption h2 {
    margin: 0 auto 0 auto;
    color: #fff;
    font-weight: 400;
    font-size: 2.0rem;
    text-align: left;
    position: relative;
    padding: 2px 12px 8px 12px;
    /*! display: table; */ /* so background applies to text only */
    margin: 8px auto 8px 0;
    background-color: rgba(30,30,30,0.3);
}

.bannerCaption p {
    margin: 0 auto 0 auto;
    text-align: center;
    width: auto;
    max-width: 820px;
    color: #fff;
    font-weight: 400;
    font-size: 1.2rem;
    padding-left: 1%;
    padding-right: 1%;
}

.author {
    font-family: 'Open Sans';
    font-size: 0.925rem;
    font-style: normal;
    opacity: 1;
    color: #676767;
    /*! padding-left: 8px; */
}

/*===================          ARTICLES         ===================*/

:target::before {
    content: "";
    display: block;
    height: 100px; /* fixed header height*/
    margin: -100px 0 0; /* negative fixed header height */
    visibility: hidden;
}

.item {
    margin: 8px auto 40px auto;
}

    .item:after {
        border-bottom: 1px solid #ddd;
        content: ' ';
        display: block;
        width: 30%;
        margin: 50px auto;
    }

    .item.publication:after {
        flex: 0 0 100%;
        margin: 10px auto;
    }

    .item:last-of-type:after, .item.summary-item:after {
        display: none;
    }

    .item.summary-item {
        margin: 6px auto 12px auto;
    }

    .item.meeting .itemHeader {
        display: flex;
        flex-wrap: no-wrap;
        justify-content: space-between;
        align-items: flex-start;
    }

        .item.meeting .itemHeader .eventdateWrapper {
            flex: 0 0 auto;
            margin: 6px 40px 0 0;
            vertical-align: top;
            line-height: 1;
            text-align: center;
        }

        .item.meeting .itemHeader .title {
            flex: 1 1 auto;
            margin: 4px 0px 0 0;
            vertical-align: top;
            line-height: 1;
            text-align: center;
        }

.eventdate {
    background-color: #003E4A;
    padding: 6px 18px;
}

.eventdateWrapper .month {
    color: #eee;
    font-size: 0.98rem;
}

.eventdateWrapper .day {
    color: #eee;
    font-size: 1.72rem;
}

.eventdateWrapper .year {
    color: #eee;
    font-size: 0.725rem;
    padding-top: 2px;
}

.item.meeting h3 {
    text-align: left;
    margin-left: 0;
    margin-top: 0;
    padding-top: 0;
}

h4 .speaker {
    font-size: 1.2rem;
    font-family: 'Quattrocento Sans', sans-serif;
    display: inline-block;
    margin-top: 8px;
}

.item .meta {
    margin: 0 auto;
    max-width: 820px;
    font-size: 0.834rem;
    color: #868687;
    padding: 0 0 12px 0;
}

.item.publication {
    width: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

    .item.publication .itemHeader {
        flex: 0 1 70%;
    }

        .item.publication .itemHeader p .issue {
            font-weight: 400;
        }

.item .itemHeader .author {
    font-size: unset;
}

.item .item-entry {
    font-size: 1.025rem;
    line-height: 155%;
    font-weight: 300;
    padding: 0;
    margin: 0 0 0.865em 0;
    margin-right: auto;
    margin-left: auto;
    text-align: left;
    color: #363637;
}

.innerText table {
    width: 100%;
}

    .innerText table tr {
        vertical-align: top;
    }

        .innerText table tr td:first-of-type {
            min-width: 70px
        }

.show-more-container, .item-entry .abstract, .item-entry .attached {
    background: #f0f0f0;
    padding: 20px 30px 6px 30px;
}

.home .show-more-container {
    padding-left: 0;
    padding-right: 0;
}

.show-more-container .inner {
    display: none;
    background: #f0f0f0;
    padding: 30px 0;
}

.home .item-entry .abstract .inner {
    max-width: 850px;
    padding-left: 0;
    padding-right: 0;
}

.item-entry h4 {
    font-size: 1.2rem;
}

.item-entry.meeting-entry h4 {
    font-size: 1.2rem;
    padding-top: 0;
    margin-left: 0;
}

.item-entry h4 span.speaker {
    font-size: 1.025rem;
    font-family: 'Quattrocento Sans', sans-serif;
    color: #929398
}



.item-entry .attached li {
    list-style-type: circle;
}

.item-entry .abstract .inner {
    max-width: 850px;
    padding: 30px;
    background: #f0f0f0;
}

.showmore.abstract .inner {
    display: none;
}

.item-entry .abstract h3 {
    font-size: 1.4rem
}

.item.publication .item-entry {
    padding-left: 2%;
    min-width: 160px;
    text-align: right;
    flex: 0 1 28%;
}

.item .item-entry .speaker {
    font-weight: 300;
}

.item .item-entry .title {
    font-style: italic;
}

.item .item-entry .order-link {
}

    .item .item-entry .order-link a {
        background: #eee;
        padding: 8px 20px;
        margin-left: 24px;
    }

        .item .item-entry .order-link a:hover {
            background: #ddd;
        }

.paging {
    display: flex;
    justify-content: space-around;
    max-width: 560px;
    margin: 0 auto;
}

    .paging .newer {
        text-align: right;
        flex: 1 0 50%;
    }

    .paging .older {
        text-align: left;
        flex: 1 0 50%;
    }

    .paging a.pagelink {
        padding: 6px 10px;
        border-radius: 4px;
    }

        .paging a.pagelink:hover {
            background-color: #f0f0f0
        }

        .paging a.pagelink.active {
            background-color: #999;
            color: #fff;
        }

/*===================          REGISTRATION         ===================*/
.centred-layout {
    max-width: 820px;
    margin: 0 auto;
}

/*========================         embedded signup        ========================= */
section #ic_signupform .elcontainer .formEl {
    font-size: 1.1em;
}

section #ic_signupform .elcontainer .submit-container input[type="submit"] {
    font-size: 0.84rem;
    width: 100%;
    max-width: 100%;
    display: inline-block;
    background: #DFB445;
    color: #222;
    text-transform: uppercase;
    padding: 12px 14px;
    border: 0px;
}

    section #ic_signupform .elcontainer .submit-container input[type="submit"]:hover {
        color: #fff;
    }



/*==============================            TEASERS          ==============================*/

.teaser-wrapper {
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

    .teaser-wrapper.space-between {
        justify-content: space-between;
    }

    .teaser-wrapper.normal {
        justify-content: normal;
    }

    .teaser-wrapper.space-around {
        justify-content: space-around;
    }

    .teaser-wrapper.justifycenter {
        justify-content: center;
    }

    .teaser-wrapper.space-evenly {
        justify-content: space-evenly;
    }

    .teaser-wrapper.useflex {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .teaser-wrapper.headline {
        margin: 3em auto 0em auto;
    }

    .teaser-wrapper.the-dream {
        display: block;
    }

.teaser {
    flex: 0 1 32%;
    display: inline-block;
    margin: 1% 0;
    border: 1px solid #BDBDBA;
    height: auto;
    overflow: hidden;
    position: relative;
}

.width100 .teaser {
    flex: 0 1 100%;
}

.width48 .teaser {
    flex: 0 1 48%;
}

.width32 .teaser {
    flex: 0 1 32.5%;
}

.width18 .teaser {
    flex: 0 1 18%;
}

.twocol .teaser {
    width: 100%;
    flex: 0 0 100%;
    display: flex;
    border: 0;
    margin: 0;
}

.teaser h2, .teaser h3 {
    padding-top: 0;
    margin: 0 auto;
    text-align: center;
    font-size: 2em;
    background-color: #D7E2E3;
}

.teaser h3 {
    font-size: 1.5rem;
}

.teaser h2 a {
    text-transform: uppercase;
    color: #BDBDBA;
    display: block;
    width: 100%;
    padding: 3px 0 3px 0;
}

    .teaser h2 a:hover {
        background-color: #dfb445;
        color: #575859;
    }



.teaser .clickableBlock {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 10;
}

.teaser-img {
    line-height: 1;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

    .teaser-img img {
        width: 100%;
        height: auto;
        object-fit: cover;
        display: block;
    }

.teaser-inner-wrap h2 {
    line-height: 1.1;
    min-height: 2.4em;
    text-align: center;
}

.teaser-inner {
    padding: 8px;
    background-color: transparent;
    /*! overflow: hidden; */
    display: flex;
    flex-direction: row;
    vertical-align: top;
}

    .teaser-inner p {
        /*! color: #DDDDDA; */
        margin: 0 0 2px 0;
        padding: 0;
        font-size: 1rem;
    }

.teaser .subhead {
    margin: -12px 0 12px 0;
}

.teaser-inner .subhead p {
    font-size: 1.125rem;
}



/*=============== colour schemes ===============*/

.paleblue, .teaser.paleblue .teaser-inner-wrap {
    background-color: #D7E2E3;
    color: #676868;
}

.palebluealt {
    background-color: #F0F6F6;
}

.pale, .teaser.pale .teaser-inner-wrap {
    background-color: #eeeeee;
    color: #676868;
}

.darkblue, .teaser.darkblue .teaser-inner-wrap {
    background-color: #003E4A;
    color: #eee;
}

.teaser.paleblue .teaser-inner-wrap h2, .teaser.paleblue .teaser-inner-wrap h2 a, .teaser.paleblue .teaser-inner-wrap p {
    color: #676868;
}

.teaser.pale .teaser-inner-wrap h2, .teaser.pale .teaser-inner-wrap h2 a, .teaser.pale .teaser-inner-wrap p {
    color: #676868;
}

.twocol .paleblue .teaser-inner, .twocol .pale .teaser-inner {
    background-color: #676868;
}

.teaser.darkblue .teaser-inner-wrap h2, .teaser.darkblue .teaser-inner-wrap h2 a, .teaser.darkblue .teaser-inner-wrap p {
    color: #eee;
}

.twocol .darkblue .teaser-inner {
    background-color: #eee;
}


/*=============== TwoCol layouts ================*/

.twocol .teaser-inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding: 0 3%;
}

.twocol .teaser-img, .twocol .teaser-inner-wrap {
    flex: 0 0 50%;
}

.twocol.text-img .teaser-inner-wrap {
    order: 1
}

.twocol.text-img .teaser-img {
    order: 2
}

.twocol .teaser-inner-wrap h2, .twocol .teaser-inner-wrap h4 {
    min-height: unset;
    background: transparent;
    text-align: center;
}

.twocol .teaser-inner p {
    margin: 0 auto;
    font-size: unset;
}


/*====== twocol section type ======*/


.wrap.twocol .twocol-inner {
    margin: 0 auto;
    text-align: center;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

    .wrap.twocol .twocol-inner .imgPart {
        flex: 0 0 50%;
    }

    .wrap.twocol .twocol-inner .textPart {
        flex: 0 0 50%;
    }

    .wrap.twocol .twocol-inner.img-text .imgPart {
        order: 1;
    }

    .wrap.twocol .twocol-inner.img-text .textPart {
        order: 2;
    }

    .wrap.twocol .twocol-inner.text-img .imgPart {
        order: 2;
    }

    .wrap.twocol .twocol-inner.text-img .textPart {
        order: 1;
    }

    .wrap.twocol .twocol-inner .textPart .inner {
        padding: 0 3%;
    }

    .wrap.twocol .twocol-inner .imgPart img {
        width: 100%;
        height: auto;
        object-fit: cover;
        display: block;
    }

.twocolumn.twocolumntext .wrap.twocol .twocol-inner, .twocol-inner.text-text {
    justify-content: space-between;
}

    .twocol-inner.text-text .textPart {
        text-align: left;
    }

.twocolumn.twocolumntext .twocol-inner.text-text .textPart .inner {
    max-width: 720px;
    padding: 3%;
}

/*============== home ==============*/




/*============= call to action =============*/





/*============== actionBox ==============*/
.actionBox .teaser {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-between;
}

    .actionBox .teaser .teaser-img {
        flex: 0 0 auto;
    }

    .actionBox .teaser .teaser-inner-wrap {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: space-between;
    }

        .actionBox .teaser .teaser-inner-wrap .teaser-inner {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: stretch;
            justify-content: space-between;
            margin: 0 auto;
        }

        .actionBox .teaser .teaser-inner-wrap h2 {
            padding: 16px 8px 20px 8px;
            min-height: auto;
            font-size: 1.6rem;
            text-align: center;
            background-color: transparent;
            flex: auto;
        }

        .actionBox .teaser .teaser-inner-wrap p:before {
            padding: 0;
            content: "";
            display: block;
            margin: 8px auto 20px auto;
            width: 33%;
            border-bottom: 1px solid #fff;
        }

        .actionBox .teaser .teaser-inner-wrap p {
            margin-bottom: 16px;
            text-align: center;
            margin-left: auto;
            margin-right: auto;
            flex: 1;
        }

        .actionBox .teaser .teaser-inner-wrap div {
            flex: 1;
        }

    .actionBox .teaser a.button {
        background-color: unset;
        border: 1px solid #fff;
        color: #fff;
        text-transform: uppercase;
        margin-bottom: 12px;
    }


/*========= film and video ==========*/
.teaser-wrapper.embeddedVideo {
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.teaser.videoBullets {
    width: auto;
    flex: 0 0 100%;
    border: 0;
    margin-left: 0;
    margin-right: 0;
}

    .teaser.videoBullets .teaser-inner {
        width: 100%;
        justify-content: space-around;
    }

        .teaser.videoBullets .teaser-inner ul {
            text-align: left;
        }

    .teaser.videoBullets .videopart {
        width: 34vw;
    }

        .teaser.videoBullets .videopart iframe {
            width: 100%;
            height: auto;
            min-height: 18vw;
        }

    .teaser.videoBullets .teaser-inner h2 {
        background: transparent;
        color: #dfb445;
        text-align: left;
    }

.pale .teaser.videoBullets .teaser-inner h2 {
    color: #626368;
}

.teaser.video {
    margin: 0.6% auto;
}

    .teaser.video h2 {
        text-transform: none;
        line-height: 1.15;
    }

        .teaser.video h2 a {
            text-transform: none;
            font-size: 0.8265em;
            height: 66px;
        }




/*================ contact ================*/

.contact-us .teaser-wrapper {
    justify-content: space-between;
}

.contact-us .teaser {
    border: 0px solid #BDBDBA;
}

    .contact-us .teaser .teaser-img {
        width: 84%;
        margin: 0 auto;
    }

    .contact-us .teaser h2 {
        text-align: center;
        font-size: 2em;
        line-height: 1.1em;
        margin-bottom: 10px;
        min-height: 2.2em;
        background-color: transparent;
    }

.contact-us .teaser-inner {
    background-color: transparent;
    overflow: hidden;
    display: block;
}

    .contact-us .teaser-inner p {
        color: #666;
        font-size: 0.965em;
        margin: 0 0 2px 0;
        padding: 0;
    }



/*=================  Multiple ================*/

.home-teasers .teaser-img span, .call-to-action .teaser .teaser-img span {
    bottom: 0;
    display: block;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 4;
}

.home-teasers .teaser-inner, .positives .teaser-inner, .twocolumn .teaser-inner {
    position: relative;
    width: auto;
    height: auto;
    display: block;
}


/*==============================            COUNCIL             ==============================*/

.team-members, .contributors-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

.council-mmembers {
}

.council-members h2, .council-members h3 {
    text-align: left;
}

.team-member {
    margin: 0 0 40px 0;
    position: relative;
    padding-bottom: 20px;
    width: auto;
    display: flex;
    justify-content: space-between;
    vertical-align: top;
}

.contributing .team-member {
    height: auto;
    margin: 0 1% 1% 1%;
    position: relative;
    padding-bottom: 1%;
    width: 23%;
    display: inline-block;
    vertical-align: top;
}

.team-img {
    width: auto;
    max-width: 140px;
    height: auto;
    text-align: center;
    margin: 6px auto 0 0;
    position: relative;
    flex: 0 0 20%;
}

    .team-img a.showmore {
        line-height: 1;
        margin: 0 auto;
    }

        .team-img a.showmore img {
            line-height: 1;
            margin: 0;
        }

    .team-img img {
        width: 100%;
        height: auto
    }

    .team-img span {
        background-color: #333333;
        width: 66%;
        height: 98%;
        position: absolute;
        display: block;
        top: 0;
        left: 17%;
        z-index: -1;
        border-radius: 50%;
    }

    .team-img:hover img {
        opacity: 0.8;
        -webkit-transition: all 275ms ease;
        -moz-transition: all 275ms ease;
        transition: all 275ms ease;
    }

.team-title {
    text-align: center;
    margin: 0;
    flex: 1 1 75%;
    padding-left: 40px;
}

    .team-title a {
        color: #999;
    }

        .team-title a:hover {
            color: #dfb445;
        }

    .team-title h2 {
        font-size: 1.625rem;
        color: #626668;
        text-align: center;
        padding: 0 8px 0 0;
        margin: 0 0 3px 0;
        text-transform: uppercase;
    }

    .team-title .jobtitle {
        display: block;
        font-size: 1rem;
        line-height: 1.3;
        margin-top: 3px;
        text-transform: initial;
        font-family: 'Open Sans', sans-serif, Helvetica, Arial, sans-serif;
    }

.team-caption {
    margin: 0;
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    z-index: 300;
    display: none;
    background-color: rgba(33,33,33,0.7);
}

.team-description-wrapper {
    display: flex;
    flex-direction: row;
    z-index: +1;
    padding: 0;
    margin: 0px auto 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    width: 76%;
    min-width: 300px;
    max-width: 1160px;
    height: auto;
    min-height: 50%;
    max-height: 88%;
    background: #575757;
    color: #fff;
    overflow: visible;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.team-description-inner {
    display: flex;
    flex-direction: row;
}

.team-description-wrapper .scroll {
    overflow-y: scroll;
    max-height: calc(88vh - 98px);
    padding-right: 10px;
}

.team-description-wrapper .close {
    overflow: visible;
    position: relative;
    -ms-transform: translate(1.0rem,-1.0rem);
    transform: translate(1.0rem,-1.0rem);
    border-radius: 50%;
    background-color: #fff;
    height: 3rem;
    width: 3rem;
}

    .team-description-wrapper .close:hover i {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }

    .team-description-wrapper .close i {
        background-color: none;
        color: #777;
        text-align: center;
        font-size: 1.6rem;
        padding: 10px;
        cursor: pointer;
        -webkit-transition: -webkit-transform .8s ease-in-out;
        transition: transform .8s ease-in-out;
    }

.team-description-wrapper aside {
    width: 300px;
    margin: 20px;
}

.team-description-wrapper .social a {
    padding: 0 12px 2px 0;
}

    .team-description-wrapper .social a:hover {
        color: #fff;
    }

    .team-description-wrapper .social a i {
        font-size: 1.4rem;
        padding-top: 10px;
    }

.team-description-wrapper .team-description {
    padding: 0 0 30px 20px;
}

    .team-description-wrapper .team-description header {
        padding: 0;
        margin: 0;
        position: relative;
        z-index: auto;
        height: auto;
        top: auto;
    }

        .team-description-wrapper .team-description header h3 {
            margin: 20px 0 20px 0;
            padding: 0;
            line-height: 1;
            /*font-family: 'Adobe Song';*/
            font-family: adobe-song-std, 'Crimson Text', sans-serif;
            font-size: 1.6rem;
            color: #eee;
            text-transform: uppercase;
        }

        .team-description-wrapper .team-description header .role {
            margin: 0px 0 12px 0;
            padding: 0;
            line-height: 1;
            /*font-family: 'Adobe Song';*/
            font-family: adobe-song-std, 'Crimson Text', sans-serif;
            font-size: 1.36rem;
            color: #eee;
        }

    .team-description-wrapper .team-description .content {
        margin: 0;
        padding: 0;
        height: auto;
    }

    .team-description-wrapper .team-description p {
        padding: 20px 0 10px 0;
        color: #ffffff;
    }

.team-social {
    clear: both;
    display: block;
    text-align: center;
}

    .team-social a .fa {
        display: inline-block;
        border-radius: 4px;
        text-align: center;
        padding: 4px;
        margin: 3px 3px 1px 3px;
        font-size: 1.1em;
        color: #c5c5c5;
    }

    .team-social a:hover .fa {
        background-color: none;
        color: #323338;
    }


/*==============================            MEDIA            ==============================*/


/*==============================         infographics         =============================*/
.wrap.infographic .innerText {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    align-items: center;
    margin: 0px auto 0px auto;
    padding: 30px 0;
    color: #eee;
    position: relative;
}

.infog {
    display: flex;
    flex-direction: column;
    text-align: center;
    align-self: flex-start;
    flex: 1 0 16%;
    position: relative;
    -webkit-transition: all 175ms ease;
    -moz-transition: all 175ms ease;
    transition: all 175ms ease;
}

.infog-icon {
    height: 75px;
    width: 75px;
    margin: 0 auto;
    background: #575757;
    border-radius: 50%;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 2px solid #dfb445;
}

    .infog-icon img {
        max-height: 46px;
        max-width: 46px;
        height: auto;
        width: auto;
        margin: 0 auto;
        height: 100%;
        padding: 0;
    }

    .infog-icon i {
        font-size: 46px;
        padding: 0;
        color: #fff;
        -webkit-transition: all 175ms ease;
        -moz-transition: all 175ms ease;
        transition: all 175ms ease;
    }

.infog .clickableBlock {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10;
}

    .infog .clickableBlock a {
        display: block;
        width: 100%;
        height: 100%;
    }

.infog:hover .infog-icon i {
    color: #eee;
}

.infog .description {
    margin: 18px 12% 10px 12%;
}

    .infog .description p {
        line-height: 120%;
        text-align: center;
        margin: 0 0 2px 0;
        padding: 0;
        font-size: 0.96rem;
    }

/*===================           slider           ====================*/

section.fullWidth .slider {
    width: 100%;
    margin: 0;
    position: relative;
    overflow: hidden;
    line-height: 1;
    padding: 0;
}

section.columnWidth .slider {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    line-height: 1;
}

section.mediumWidth .slider {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    line-height: 1;
}

section.textColumnWidth .slider {
    width: 100%;
    max-width: 820px;
    margin: 0 auto;
    line-height: 1;
}

.sliderCaption {
    margin: 0 auto;
    text-align: center;
}

    .sliderCaption.showOnMobile {
        display: none;
    }

    .sliderCaption p {
        font-size: 0.865rem;
        color: #686667;
        margin: 0 auto;
        line-height: 145%;
        text-align: center;
        max-width: 720px;
    }

section.columnWidth .sliderCaption {
    max-width: 1200px;
    padding: 0 20px;
}

.slider ul {
    margin: 0 auto;
    padding: 0;
    max-width: 100%;
    position: relative;
    list-style-type: none;
}

    .slider ul li {
        margin: 0 auto;
        padding: 0;
        max-width: none;
        position: relative;
        background: none;
        line-height: 1;
    }

        .slider ul li .caption {
            position: absolute;
            top: 50px;
            left: 0;
            right: 0;
            display: block;
            margin: 0;
            text-align: center;
        }

.scrollHeader .slider ul li .caption {
    top: 150px;
}

.slider ul li .caption .captionInner {
    width: auto;
    max-width: 1500px;
    margin: 0 auto;
    text-align: left;
}

.slider ul li .caption.captionBelow {
    position: relative;
    top: unset;
    bottom: unset;
    left: unset;
    right: unset;
    display: block;
    margin: 0;
    text-align: center;
    background-color: #575757;
    min-height: 9em;
}


.slider .caption h1 {
    font-size: 2.8rem;
    /*! font-size: 3.0vw; */
    font-weight: 400;
    color: #fff;
    text-align: left;
    position: relative;
    padding: 2px 12px 10px 12px;
    display: table; /* so background applies to text only */
    margin: 8px auto 8px 0;
    background-color: rgba(30,30,30,0.3);
    line-height: 1.35;
    max-width: 820px;
}

.slider .caption h2 {
    text-align: left;
    color: #fff;
    font-family: 'Open Sans', sans-serif;
    text-shadow: 0 0 14px rgba(255, 255, 255, 0.35);
    font-weight: 400;
    font-size: 2rem;
    padding: 2px 12px 10px 12px;
    display: table; /* so background applies to text only */
    margin: 8px auto 8px 0;
    background-color: rgba(30,30,30,0.3);
    line-height: 1.2;
}

.slider .caption h3 {
    color: #fff;
    margin: 0 2% 0 2%;
}

.slider .caption p {
    margin: 0 auto 0 auto;
    text-align: center;
    width: auto;
    max-width: 820px;
    color: #fff;
    font-weight: 400;
    font-size: 1.2em;
    padding-left: 1%;
    padding-right: 1%;
}

.slider .caption.captionBelow h1 {
    margin: 0;
    line-height: 1.6;
    font-size: 3.2rem;
}


.slider .slick-dots {
    bottom: 70px;
    position: absolute;
    z-index: 10;
}

.slider figure {
    position: relative;
    margin: 0;
    padding: 0;
}

.slider img {
    width: 100%;
    height: auto;
}

.fullScreen .slider img {
    /*! height:calc(100vh - 5em);
    width:auto;*/
    margin: 0 auto;
    height: 100vh;
    object-fit: cover;
}

.fixedHeader .slider img {
    object-fit: cover;
    height: calc(100vh - 92px);
}



/*====================           svg           ====================*/
.svg-divider {
    overflow: hidden;
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 100%;
    line-height: 0;
    z-index: 20;
}

@media (max-width: 1760px) {
    .svg-divider {
        bottom: -1px;
    }
}

.svg-divider.flipvertical {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    bottom: unset;
    top: -10px;
}

.film-wrapper {
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}


.lightbox {
    position: absolute;
    opacity: 0.8;
    width: 100%;
    height: 158px;
}

.slick-slide .gallery-img img {
    width: 100%;
    height: auto;
}

.gallery-inner {
}




.helper {
    font-size: 0.9em;
    margin-left: 12em;
    display: inline-block;
    display: block;
    color: #828386;
    width: auto;
    margin-bottom: 10px;
}

/*===============================            ACCOUNT          ==============================*/
section.accountFunctions form {
    max-width: 820px;
    margin: 0 auto;
}

/*===============================            OVERLAY          ==============================*/

#overlay {
    display: none;
    width: 70%;
    padding: 8px;
    height: 70%;
    background-color: #fff;
    border-radius: 8px;
    position: relative;
}

#overlay-content {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    align-items: stretch;
    max-width: 820px;
    margin: 0 auto;
}

.overlay_close {
    position: absolute;
    top: -18px;
    right: -18px;
    width: 36px;
    height: 36px;
    cursor: pointer;
    background-image: url(../media/close.png);
}

.scrollNext {
    position: absolute;
    bottom: 120px;
    text-align: center;
    width: 100%;
    z-index: 101;
    color: #fff;
}

    .scrollNext i {
        margin: 0 auto;
        font-size: 3.6em;
        padding: 8px;
        color: rgba(245,245,245,0.6);
        cursor: pointer;
    }

        .scrollNext i:hover {
            color: rgba(245,245,245,0.9);
        }

/*===============================            PAYMENTS           ===============================*/

.frmPaypalPayment .tabs ul {
    list-style-type: none;
    margin: 0;
    width: auto;
    padding: 0;
    display: flex;
    flex-direction: row;
    width: 100%;
}

    .frmPaypalPayment .tabs ul li {
        display: inline-block;
        flex-grow: 1;
        width: auto;
        padding: 0;
        min-height: 30px;
        margin: 0;
        vertical-align: top;
        position: relative;
        background: #f0f0f0;
    }

.frmPaypalPayment .tabs label {
    height: auto;
    position: relative;
    padding: 14px 0 14px 64px;
    font-size: 0.96rem;
    margin: 0;
    display: block;
    cursor: pointer;
    background-color: #ddd;
    color: #555;
}

.frmPaypalPayment input[type="radio"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.frmPaypalPayment .tabs .checkmark {
    position: absolute;
    top: 25%;
    left: 26px;
    height: 25px;
    width: 25px;
    border-radius: 50%;
    background-color: #fff;
}

/* On mouse-over, add a grey background color */
.frmPaypalPayment .tabs li:hover input ~ label .checkmark {
    background-color: #FFC63A;
}

/* When the checkbox is checked, add colour background */
.frmPaypalPayment .tabs input:checked + label .checkmark {
    background-color: #FFC63A;
}

.frmPaypalPayment .tabs input:checked + label {
    background-color: transparent;
}

/* Create the checkmark/indicator (hidden when not checked) */
.frmPaypalPayment .tabs .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.frmPaypalPayment .tabs input:checked + label .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.frmPaypalPayment .tabs .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.suggestedAmountWrap {
    text-align: left;
    width: 100%;
    display: flex;
    align-items: center;
}

    .suggestedAmountWrap .termWrap {
        flex-grow: 1;
        flex-shrink: 0;
    }

    .suggestedAmountWrap .paymentButtonWrap {
        flex-grow: 0;
        flex-shrink: 0;
        flex-basis: 172px;
    }

.paymentBodyOnce .suggestedAmountWrap select {
    padding: 1.4em 1em 1.5em 1em;
}

.suggestedAmountWrap p {
    text-align: left;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4px;
    padding-right: 40px;
    flex-grow: 1;
}

.paymentOptionsWrap {
    background: #f0f0f0;
    padding: 30px 20px;
}

.paymentBody {
    display: none;
}

    .paymentBody.active {
        display: block;
    }

    .paymentBody button {
        border: 1px solid #ccc;
        border-radius: 3px;
        margin: 26px 0 8px 0.5em;
        padding: 4px 10px;
        background-color: #FFC63A;
    }

        .paymentBody button:hover {
            border: 1px solid #ccc;
            -webkit-box-shadow: 0px 0px 5px rgba(130, 140, 150, 0.75);
            -moz-box-shadow: 0px 0px 5px rgba(130, 140, 150, 0.75);
            box-shadow: 0px 0px 5px rgba(130, 140, 150, 0.75);
        }
/*===============================            FOOTER            ===============================*/

.main-content {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
}

footer {
    min-height: 38px;
    width: 100%;
    background: #003E4A;
    background: #BEB7A4;
    background: #d2d2d2;
    color: #eee;
    color: #666768;
    padding: 0.8em 0 0.2em 0;
    border-top: 0px solid #494949;
    padding-top: 100px;
}

    footer.noDivider {
        padding-top: 40px;
    }

    footer .wrap {
        height: auto;
        padding: 0.5em;
        margin: 0 auto;
        max-width: 1500px;
        background: #003E4A;
        background: #BEB7A4;
        background: #d2d2d2;
        text-align: center;
        align-items: flex-end;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

    footer .borderline {
        border-top: 1px solid #bbb;
        margin: 40px auto 10px auto;
        padding: 0;
        display: block;
    }

    footer .wrap.footerbelow {
        margin: 20px auto 10px auto;
        padding: 10px 1.6%;
        display: block;
    }

    footer .wrap p {
        margin: 10px auto;
        white-space: unset;
        color: #565756;
    }

        footer .wrap p a {
            color: #eee;
            color: #565756;
        }

    footer span.credits {
        margin-left: 12px;
    }

    footer .col-33 {
        vertical-align: middle;
        align-self: center;
    }

    footer .logos img {
        max-width: 150px;
        width: auto;
        height: auto;
        max-height: 70px;
        margin: 0;
        padding: 0 10px 0 0;
        display: inline-block;
        vertical-align: middle;
    }

    footer .logos .footerBreak {
        display: none;
    }

    footer .copyright {
        margin: 0;
        padding: 0;
        text-align: center;
    }

        footer .copyright div {
            padding: 0 0.5%;
        }

    footer .footer-social {
        margin: -8px 0 0 0;
        text-align: right;
        font-size: 1.25em;
    }

    footer h2 {
        color: #fff;
        color: #565756;
        margin: 0 0 0.5em 0;
    }

    footer h3 {
        color: #ccc;
        color: #565756;
        font-size: 0.92rem;
        text-align: center;
    }

    footer p {
        color: #ccc;
        color: #565756;
        font-size: 0.86rem;
        text-align: center;
        white-space: pre-wrap;
        word-break: break-word;
        overflow-wrap: break-word;
        letter-spacing: normal;
    }

    footer a {
        color: #bbb;
    }

        footer a:hover {
            color: #fff;
            background: transparent;
        }


/*===============================            MISC            ===============================*/


.left {
    text-align: left;
}

.right {
    text-align: right;
}

.image-left {
    padding: 0 1.2em 0.9em 0;
    float: left;
}

.image-right {
    padding: 0 0 0.9em 1.2em;
    float: right;
}

.center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.p404 {
    margin-top: 30px;
    min-height: 390px;
}


/*======================================            MEDIA QUERIES            ======================================*/

.mobileview {
    display: none;
}

.hideOnMobile {
    display: block;
}

.showOnMobile, .mobileOrderSummary {
    display: none;
}

@media (max-width: 1024px) {
}

@media (max-width: 1020px) {

    footer .wrap {
        flex-direction: column;
        justify-content: center;
        flex-wrap: wrap;
    }

    footer .logos .footerBreak {
        display: none;
        margin: 0;
    }
}

@media (max-width: 980px) {
}

@media (max-width:58em) { /* 928px */


}

@media (max-width: 53em) { /* 848px */


}

@media screen and (max-aspect-ratio: 11/8) {
    section.staticImage .wrap.fullscreenImage img, section.fullscreenImage .wrap img {
        min-height: auto;
        margin: 0 auto;
        height: auto;
    }

    section.staticImage .wrap.fullscreenImage {
        height: auto;
        min-height: auto;
    }

    /* our story and similar */
    .fixedHeader section.fullScreen:first-of-type .wrap img, .fixedHeader section.fullScreen .wrap img {
        height: auto;
    }

    section.fullScreen .wrap img {
        margin: 0 auto;
        height: auto;
        min-height: auto;
    }

    /* slider */
    .fixedHeader .slider img, v {
        object-fit: cover;
        height: auto;
    }
}

/* 768 px iPad portrait*/
@media (max-width: 768px) {

    footer .creditsBreak {
        visibility: hidden;
        display: block;
        height: 12px;
    }

        footer .creditsBreak.linebreak {
            visibility: visible;
            display: inline;
        }
}

@media (max-width:760px) {
    header {
        height: 84px;
    }

    #headerfix.fixed {
        height: 84px;
    }

    header .logo img, header .scrollLogo img {
        width: auto;
        max-height: 70px;
    }

    header.fixed .logo img {
        width: auto;
        max-height: 70px;
    }

    .navmenu li.toplevel:first-child {
        padding-top: 84px;
        background: unset;
    }
}

@media (max-width:640px) {
}

@media (max-width:560px) {
}

@media (max-width: 480px) {
}

@media (max-width: 360px) {
}
