/*
Theme Name: Te Aho Tū Roa
Theme URI: https://www.teahoturoa.org.nz/
Author: Established Group
Author URI: http://establishedgroup.com
Version: 9.9.9
*/


/* DIN Light */

/*DIN 2014 Light
font-family: "din-2014", sans-serif;
font-weight: 300;
font-style: normal;

DIN 2014 Light Italic
font-family: "din-2014", sans-serif;
font-weight: 300;
font-style: italic;

DIN 2014 Demi
font-family: "din-2014", sans-serif;
font-weight: 600;
font-style: normal;

DIN 2014 Demi Italic
font-family: "din-2014", sans-serif;
font-weight: 600;
font-style: italic;

DIN 2014 Narrow Light
font-family: "din-2014-narrow", sans-serif;
font-weight: 300;
font-style: normal;

DIN 2014 Narrow Demi
font-family: "din-2014-narrow", sans-serif;
font-weight: 600;
font-style: normal;*/

/* CSS RESETS */

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

* {
    box-sizing: border-box;
}


/* GLOBAL STYLE */


/*html.has-scroll-smooth {
    overflow: hidden;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}*/

html,
body {
    font-size: 19px;
}

body {
    width: 100%;
    height: 100%;
    font-family: "din-2014", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    background-color: rgba(255, 255, 255, 1);
    color: rgba(0, 0, 0, 1);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: none;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;

    -webkit-transition: background-color 2s ease;
    -o-transition: background-color 2s ease;
    transition: background-color 2s ease;

}

main {
    margin-top: 105px;
}

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

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1.2;
    margin-bottom: 0.5rem;
    text-align: left;
    color: rgb(88, 21, 143);
}

h1,h2 {
    font-size: 37px;
    color: rgb(88, 21, 143);
}

h3,h4 {
    font-size: 22px;
}

.parallax-image-text h2 {
    font-size: 30px;
}

.text-panel h2 {
    margin-bottom: 0.2rem;
}

p,
a,
ol,
ul,
li {
    font-size: 1rem;
    line-height: 1.3;
    margin: 0 0 0.5rem 0;
    text-align: left;
}

ol,
ul {
    margin-bottom: 1.5rem;
}

ul {
    list-style: none;
}

li {
    margin: 0 0 0.3rem 0.75rem;
    padding: 0 0 0 0.75rem;
    position: relative;
}

section ul li:before {
    content: '\2014';
    content: '\2010';
    content: "•";
    position: absolute;
    margin-left: -1.5rem;
    margin-right: 0.75rem;
    -webkit-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

a {
    color: inherit;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}


em,
i {
    font-style: italic;
}

p strong,
strong,
p b,
b {
    font-weight: 700;
}


.fs-xs,
.fs-xs a {
    font-size: 0.9rem;
    /* 16px */
}

.fs-s,
.fs-s a {
    font-size: 1.3rem;
    /* 20px */
    line-height: 1.3;
}

.fs-m,
.fs-m a {
    font-size: 1.5rem;
    /* 30px  */
    line-height: 1.2;
}

.fs-l,
.fs-l a {
    font-size: 2.5rem;
    /* 45px */
    line-height: 1.1;
}

.fs-xl,
.fs-xl a {
    font-size: 3rem;
    /* 45px */
    line-height: 1.1;
}

.fs-xxl,
.fs-xxl a {
    font-size: 4.5rem;
    /* 60px */
    line-height: 1.1;
}

.fw-300,
.fw-300 a,
strong.fw-300 {
    font-weight: 300;
}

.fw-600,
.fw-600 a,
strong.fw-600 {
    font-weight: 600;
}

.ft-s,
.ft-s a {
    font-family: "ivyjournal", sans-serif;
    font-weight: 300;
    font-style: normal;
}


.container {
    width: calc(100% - 6rem);
    max-width: 1400px;
    margin: auto;
    text-align: center;
}


.row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.v-top .row {
    -webkit-box-align: flex-start;
    -ms-flex-align: flex-start;
    align-items: flex-start;
}

.v-middle .row,
.row.v-middle {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.v-bottom .row {
    -webkit-box-align: flex-end;
    -ms-flex-align: flex-end;
    align-items: flex-end;
}

.col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}


.img-bg,
.bg-img {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}




/* Brand colours */


.bg-white {
    background-color: rgba(255, 255, 255, 1);
    color: #111;
}

.bg-purple {
    background-color: rgb(88, 21, 143);
    
}

.bg-purple * {
    color: #fff;
}



hr {
    height: 1px;
    width: 100%;
    border: 0;
    color: rgba(0, 0, 0, 0.5);
    background: rgba(0, 0, 0, 0.5);
    margin: 2rem 0;
}

.bg-white hr {
    color: rgba(0, 0, 0, 0.7);
    background: rgba(0, 0, 0, 0.7);
    margin: 4rem 0;
}




button.btn-border,
span.btn-border a,
a.btn-border,
.btn-border a,
.column-repeater .btn-border {
    font-size: 0.9rem;
    text-decoration: none;
    display: inline-block;
    color: #fff;
    background-color: rgb(88, 21, 143);
    border-radius: 1.4rem;
    padding: 0.7rem 1.1rem;
    margin: 1rem 0 0 0;
    min-width: 150px;
    text-align: center;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
    -o-transition: .5s;
    -webkit-transition: .5s;
    transition: .5s;
    cursor: pointer;
}

span.btn-border:hover a,
a.btn-border:hover,
.btn-border a:hover,
.column-repeater a:hover .btn-border
 {
    background-color: rgb(43, 104, 156); 
    color: #fff;
}

.bg-purple span.btn-border a,
.bg-purple a.btn-border,
.bg-purple .btn-border a {
    background-color: #fff;
    color:rgb(88, 21, 143);
}

.bg-purple span.btn-border:hover a,
.bg-purple a.btn-border:hover,
.bg-purple .btn-border a:hover {
    background-color: rgb(180, 131,221);
}


.bg-white span.btn-border a,
.bg-white a.btn-border,
.bg-white .btn-border a {
    background-color: rgb(88, 21, 143);
}

.bg-white span.btn-border:hover a,
.bg-white a.btn-border:hover,
.bg-white .btn-border a:hover {
    background-color: rgba(88, 21, 143,0.7);
    color: #fff;
}

/*p.font-small a {
  font-size: 1.25rem;
  border-radius: 1.4rem;
  padding: 0.6rem 1.2rem;
}
*/



.whiteTextShadow {
    text-shadow: -1px -1px 0px rgb(255, 255, 255), -1px 1px 0px rgb(255, 255, 255), 1px 1px 0px rgb(255, 255, 255), 1px -1px 0px rgb(255, 255, 255);
    color: rgb(88, 21, 143);
}

/* Arrow Links */

div.arrow-link,
.arrow-link a,
a.arrow-link {
    font-size: 1rem;
    text-transform: uppercase;
    text-decoration: none !important;
    -webkit-text-decoration-color: transparent !important;
    text-decoration-color: transparent !important;
    font-weight: 600;
    padding-left: 1.3rem;
    -webkit-transition: all .4s cubic-bezier(0.75, 0.02, 0.5, 1);
    -o-transition: all .4s cubic-bezier(0.75, 0.02, 0.5, 1);
    transition: all .4s cubic-bezier(0.75, 0.02, 0.5, 1);
    position: relative;
    display: block;
    margin-top: 0;
    margin-bottom: 30px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    pointer-events: all;
}

div.arrow-link::before,
div.arrow-link:active::before,
.arrow-link a::before,
a.arrow-link::before {
    content: "";
    position: absolute;
    inset-block-start: 0.6rem;
    inset-inline-start: 0;
    display: inline-block;
    width: 1rem;
    height: 1.5px;
    background: #111;
    -webkit-transition: width .4s cubic-bezier(0.75, 0.02, 0.5, 1);
    -o-transition: width .4s cubic-bezier(0.75, 0.02, 0.5, 1);
    transition: width .4s cubic-bezier(0.75, 0.02, 0.5, 1)
}

div.arrow-link::after,
div.arrow-link:active::after,
.arrow-link a::after,
a.arrow-link::after {
    -webkit-transition: all .4s cubic-bezier(0.75, 0.02, 0.5, 1);
    -o-transition: all .4s cubic-bezier(0.75, 0.02, 0.5, 1);
    transition: all .4s cubic-bezier(0.75, 0.02, 0.5, 1);
    content: "";
    position: absolute;
    inset-block-start: 0.3rem;
    inset-inline-end: -0.4rem;
    display: inline-block;
    width: 0;
    height: 0.7rem;
    background-size: 2rem;
    background-position: right center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3Csvg width='42' height='18' viewBox='0 0 42 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.810791 8.67636L40.1891 8.67636M40.1891 8.67636L33.3612 0.892578M40.1891 8.67636L33.3612 16.4601' stroke='%23111111' stroke-width='1.7'/%3E%3C/svg%3E%0A");
    /*pointer-events: none*/
}


div.arrow-link:hover,
div.arrow-link:active,
.arrow-link:hover a,
.arrow-link:active a,
a.arrow-link:hover,
a.arrow-link:active {
    text-decoration: none !important;
    -webkit-text-decoration-color: transparent !important;
    text-decoration-color: transparent !important;
    -webkit-padding-end: 2.2rem;
    padding-inline-end: 2.2rem;
    -webkit-padding-start: 0;
    padding-inline-start: 0
}

div.arrow-link:hover::before,
div.arrow-link:active::before,
.arrow-link:hover a::before,
.arrow-link:active a::before,
a.arrow-link:hover::before,
a.arrow-link:active::before {
    width: 0
}

div.arrow-link:hover::after,
div.arrow-link:active::after,
.arrow-link:hover a::after,
.arrow-link:active a::after,
a.arrow-link:hover::after,
a.arrow-link:active::after {
    inset-inline-end: 0;
    width: 2.2rem;
}

div.arrow-link:hover::before,
.arrow-link a:hover:before,
a.arrow-link:hover:before {
    right: 0;
}


@media screen and (max-width: 768px) {


    div.arrow-link,
    .arrow-link a {
        -webkit-padding-start: 0;
        padding-inline-start: 0;
        -webkit-padding-end: 2.2rem;
        padding-inline-end: 2.2rem;
    }

    div.arrow-link::before,
    div.arrow-link:active::before,
    .arrow-link a::before,
    .arrow-link:active a::before,
    a.arrow-link::before,
    a.arrow-link:active::before {
        width: 0;
    }

    div.arrow-link::after,
    div.arrow-link:active::after,
    .arrow-link a::after,
    .arrow-link:active a::after,
    a.arrow-link::after,
    a.arrow-link:active::after {
        margin-top: 0rem;
        inset-inline-end: 0;
        width: 2.2rem;
        inset-block-start: 0.4rem;
    }


}


/* White Version Colour Backgrounds */


.bg-white .intro {
    color: #111;
}


.alignright,
img.alignright,
a img.alignright {
    float: right;
    margin: 0 0 1em 1em;
}

.alignleft,
img.alignleft,
a img.alignleft {
    float: left;
    margin: 0 1em 1em 0;
}

.aligncenter,
img.aligncenter,
a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption {
    max-width: 100%;
}

img {
    max-width: 100%;
    height: auto;

}

.text-columns img {
    border-radius: 1rem;
}


/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/*/
/*\/\/\/\/\/\/\/\/\/\/\   TOP HERO BANNERS   /\/\/\/\/\/\/\/\//\/\/*/
/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/*/


/* Full Screen Vimeo Player - V2 */

#logo-front {
    z-index: 9998;
    max-width: 75%;
}


.video-background-section * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}


.video-background-section {
    width: 100vw;
    height: 90vh;
    margin: 0;
    padding: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-line-pack: end;
    align-content: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: hidden;
}


/*.video-background-section h1 {
  font-size: 60px;
    line-height: 1;
    font-weight: 800;
    color: #fff;
    width: 100%;
    padding: 0;
    margin: 0 100px 30px 100px;
    max-width: 100%;
    text-align: center;
    z-index: 98;
}*/


.video-wrapper {
    z-index: 97;
    width: 1000%;
    height: 95vh;
    background-color: #000;
    padding-bottom: 56.25%;
    position: absolute;
}

.video-embed {
    width: 100%;
    height: 100%;
    opacity: .8;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
}

.video-shade {
    background-color: rgba(0, 0, 0, .33);
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
}

.w-embed:before,
.w-embed:after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    content: " ";
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
    grid-area: 1 / 1 / 2 / 2;
    display: table;
}

.w-embed:after {
    clear: both;
}

.w-video {
    width: 100%;
    padding: 0;
    position: relative;
}

.w-video iframe,
.w-video object,
.w-video embed {
    width: 100%;
    height: 100%;
    border: none;
    position: absolute;
    top: 0;
    left: 0;
}

#vid-display iframe {
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 999999 !important;
    display: block !important;
    opacity: 1 !important;
}


/*/\/\/\/ Parallax /\/\/\/*/


section.parallax {
    position: relative;
    background-color: #000;
    height: 90vh;
    margin: 0;
    padding: 0;
    overflow: hidden;
}


.parallax-image,
.parallax-video,
.parallax-slider {
    width: 100vw;
    height: 90vh !important;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    /*  z-index: 5;*/
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: hidden;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center;

    /*  margin-top: -10%;*/
}

.parallax-slider .slick-track {
    margin: 0;
}

.parallax-slide {
    height: 90vh;
    width: 100vw;
    display: flex;
    justify-content: center;
    align-content: center;
}


.home-text {
    width: 100vw;
    height: 90vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    z-index: 9999;
}

.container.hero-text {
    padding: 0;
    height: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    /*align-content: flex-start;*/
    justify-content: flex-start;
    z-index: 9999;
}


/*.hero-text.hide {
  opacity: 0;
}*/


.hero-text {
    text-align: left;
    z-index: 98;
}

.hero-Title,
.hero-text h1,
.hero-text h2,
.hero-text h3,
.hero-text h4,
.hero-text p.subTitle {
    text-align: left;
    color: #fff;
    width: 100%;
    max-width: 800px;
    margin: 0;
}

.hero-Title,
.hero-text h1,
.hero-text h2,
.hero-text h3,
.hero-text h4 {
    font-size: 4.5rem;
    font-size: clamp(1.5rem, 2rem + 2vw, 4.5rem);
    line-height: 0.9;
    margin-bottom: 1.5rem;
     font-family: "aktiv-grotesk", sans-serif; 
    font-weight: 400;
    margin-top: auto;
}

.hero-text p.subTitle {
    font-size: 1rem;
    margin-top: auto;
    padding-bottom: 2rem;
    max-width: 400px;
}

#logo-front {
    z-index: 9998;
    margin: auto;
}

.parallax-image .byline,
.parallax-video .byline {
    margin: 0 0 5vh 0;
    text-align: center;
    font-size: 1.5rem;
    z-index: 9998;
    opacity: 1;
    -webkit-transition: opacity 1s ease;
    -o-transition: opacity 1s ease;
    transition: opacity 1s ease;
}

.byline.fade {
    opacity: 0;
    -webkit-transition: opacity 1s ease;
    -o-transition: opacity 1s ease;
    transition: opacity 1s ease;
    /*   transition: all 0.3s ease;*/
}

.loadingMask {
    position: absolute;
    width: 100%;
    height: 90vh;
    background-color: rgba(255, 255, 255, 1);
    background-color: rgba(0, 0, 0, 1);
    z-index: 90;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
}

.parallax-image::before {
    z-index: 3;
    content: " ";
    position: absolute;
    top: 0;
    height: 90vh;
    width: 100%;
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.3)), color-stop(50%, rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.1)));
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.1) 100%);
}

@media screen and (max-width: 1023px) {

    .parallax-slow .px-img {
        top: 0!important;
        height: 100%!important;
        will-change: unset!important;
        backface-visibility: hidden!important;
        transform: none!important;
        background-position: cover!important;
        clip-path: none!important;
    }

}


/*
*
* Pop Up Video Holders
* * * * * * * * * * * */


#bgvid {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
    -webkit-transition: 1s opacity;
    -o-transition: 1s opacity;
    transition: 1s opacity;
    z-index: 99998;
}

#close_btn {
    color: #fff;
    font-size: 90px;
    font-weight: normal;
    position: fixed;
    right: 5%;
    top: 5%;
    cursor: pointer;
    z-index: 99999;
}


/*
*
* Vimeo Video
* * * * * * * * * * * */


#video_layer {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 9999;

}


#video_holder {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

#video_holder iframe {
    position: absolute;
    top: 50%;
    right: 50%;
    -webkit-transform: translate(50%, -50%);
    -ms-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    width: 90%;
    height: 90%;
    max-width: 1024px;
}

#video_close_btn {
    position: absolute;
    color: #fff;
    font-size: 50px;
    font-weight: 300;
    position: fixed;
    right: 5%;
    top: 5%;
    height: 82px;
    width: 40px;
    cursor: pointer;
    z-index: 99999;
}




/* 404 Page */

#page-404 {
    background-color: rgba(230, 230, 230, 1);
    color: #111;
    padding: 20vh 0;
}


#page-404 h1 {
    margin: 6rem 0;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
}


/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/*/
/*\/\/\/\/\/\/\/\/\/\/\   REPEATER LAYOUTS   /\/\/\/\/\/\/\/\//\/\/*/
/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/*/





/* 
*
* Text Column
*
* * * * * * * * * * * * * * * * * * */


.text .container {
    max-width: 900px;
}

.text.wide .container {
    width: calc(100% - 6rem);
    max-width: 1000px;
}

.text.wide .container>div {
    margin: 0;
}


.text .container>div {
    margin: 0 2rem;
}

.text-columns .row>div {
    width: calc(50% - 4rem);
}


/* 
*
* Text + Image Column
*
* * * * * * * * * * * * * * * * * * */


.text-image-columns .row {
    align-items: stretch;
}

.text-image-columns .s-prj-txt {
    width: calc(50% - 8rem);
}

.text-image-columns .s-prj-txt>div {
    margin: 5%;
}

.text-image-columns .s-prj-txt-img {
    width: calc(50% - 4rem);
}

.text-image-columns .s-prj-txt-img {
    min-height: 24rem;
    border-radius: 1rem;
}

.text-image-columns.img-right .s-prj-txt-img {
    order: 2;
}

.text-image-columns.img-right .s-prj-txt {
    order: 1;
}

.text-image-columns.img-left .s-prj-txt-img {
    order: 1;
}

.text-image-columns.img-left .s-prj-txt {
    order: 2;
}


.text-image-columns.col3 a {

}





/* 
*
* Double Column
*
* * * * * * * * * * * * * * * * * * */


.text_layouts .text-columns.row>div {
    width: calc(50% - 8rem);
}

.text-columns .row>div {
    width: calc(50% - 8rem);
}


/* 
*
* Image + Text Rows
*
* * * * * * * * * * * * * * * * * * */


.text_image_rows.row {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.text_image_rows .row_text {
    width: auto;
    -ms-flex-negative: 1;
    flex-shrink: 1;
    padding: 0 0 0 5rem;
}


.text_image_rows:nth-of-type(odd) .row_img {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
}

.text_image_rows:nth-of-type(odd) .row_text {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    padding: 0 5rem 0 0;
}


/* 
*
* Image + Text Rows
*
* * * * * * * * * * * * * * * * * * */


section.image-grid .container>div:first-child {
    padding: 0 4rem;
}

section.image-grid h3 {
    font-weight: 600;
    font-size: 1.5rem;
    text-transform: uppercase;
}

section.image-grid .row {
    padding: 0 2rem;
}

section.image-grid .row a {
    width: calc(50% - 2rem);
    margin: 1rem;
    cursor: pointer;
}

section.image-grid .row .img-bg {
    width: 100%;
    height: 400px;
    border-radius: 1rem;
}

section.image-grid .img-t {
    font-size: 1rem;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.5);
    position: absolute;
    bottom: 0;
    margin: 2rem;
    text-transform: uppercase;

    opacity: 0;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;

    display: none;
}


section.image-grid .img-mask {
    height: 100%;
    width: 100%;
    position: absolute;
    background-color: rgba(0, 0, 0, 0);
    font-family: "aktiv-grotesk", sans-serif;
    font-weight: 400;
    line-height: 1;
    font-size: 2.3rem;
    text-decoration: none;
    color: #fff;
    border-radius: 1rem;
    text-align: left;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    cursor: pointer;

}

section.image-grid .img-mask span {
    margin: 2rem;
    max-width: 18rem;
}

section.image-grid a:hover .img-mask,
section.image-grid a:hover .img-t {
    background-color: rgba(0, 0, 0, 0.7);
}


/* 
*
* Image 
*
* * * * * * * * * * * * * * * * * * */

section.image-banner .bg-img {
    height: 75vh;
    max-height: 800px;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
}

/*section.image-banner img {
    width: 100%;
    height: auto;
    border-radius: 1rem;
}*/


/* 
*
* Image + Text Layer
*
* * * * * * * * * * * * * * * * * * */

section.image-banner.text-layer > * {
    color: #fff;
}


section.image-banner.text-layer.v-top > div {
    align-content: flex-start;
    padding-top: 3rem;
}

section.image-banner.text-layer.v-bottom > div {
    align-content: flex-end;
    padding-bottom: 3rem;
}




/* 
*
* Parallax Image + Text Panel
*
* * * * * * * * * * * * * * * * * * */


* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        html, body {
            overscroll-behavior: none;
        }


        /* Parallax Section Container */
        .parallax-image-text {
            display: flex;
            flex-direction: row-reverse;
            min-height: 60vh;
            position: relative;
            overflow: hidden;
            align-items: stretch;
            justify-content: space-between;
            clip-path: inset(0px);
        }
        
        /* Alternate layout - even sections have text on left, image on right */
        .parallax-image-text:nth-child(even) {
            flex-direction: row;
        }
        
        
        /* Image Panel - 67% width */
        .image-panel {
            width: 67%;
            position: relative;
            min-height: 70vh;
            margin-top: -5vh;
            margin-bottom: -5vh;
        }

        /* Parallax Image - Fixed at top of viewport */
        .px-img {
            position: fixed;
            top: 0;
            height: 100vh;
            background-position: center center;
            background-repeat: no-repeat;
            background-size: cover;
            /* Force hardware acceleration for Chrome */
            transform: translateZ(0);
            will-change: clip-path;
            backface-visibility: hidden;
        }
        
        /* Slow scroll parallax images need extra height */
        .parallax-slow .px-img {
            top: 0;
            height: 120vh;
            will-change: transform, clip-path;
            backface-visibility: hidden;
            transform: translateZ(0);
            clip-path: inset(100% 0px 0px 0px);
        }
        
        /* Remove initial clipping after JS loads */
        .parallax-slow .px-img.initialized {
            clip-path: none;
        }

        /* Text Panel - 33% width */
        .text-panel {
            width: 33%;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 3rem 0;
            z-index: 2;
            position: relative;
        }
        
        .text-panel .inner {
            padding: 0 20%;
            max-width: 100%;
        }


        /* Alternate Layout - Text on Left, Image on Right */
        .parallax-image-text.reverse {
            flex-direction: row-reverse;
        }

        /* Mobile Responsive */
        @media (max-width: 1024px) {
            .parallax-image-text {
                flex-direction: column !important;
                min-height: auto;
            }

            .image-panel {
                width: 100%;
                height: 50vh;
                min-height: 50vh;
            }

            .px-img {
                position: relative;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
            }
            
            .parallax-image-text.reverse .px-img {
                right: auto;
                left: 0;
            }

            .text-panel {
                width: 100%;
                padding: 3rem 0;
            }

            .text-panel .inner {
                padding: 0 10%;
            }
        }


/* 
*
* Tangata Repeater
*
* * * * * * * * * * * * * * * * * * */

.tangata-repeater .container {
    max-width: 1000px;
}

.tangata-repeater .row {
    align-items: flex-start;
}

.tangata-repeater .row > div {
    width: calc(33% - 2rem);
    margin: 0 2rem 3rem 0;
    text-align: left;
    text-decoration: none;
}

.tangata-repeater .row > div:nth-child(3n) {
    margin-right: 0;
}


.tangata-repeater .tangata-img {
     width: 100%;
    aspect-ratio: 4 / 5;
    margin-bottom: 1.2rem;
}


@media (max-width: 1024px) {

    .tangata-repeater .row {
        align-items: center;
    }

    .tangata-repeater .row > div {
        width: 100%;
        max-width: 400px;
        margin-right: 0;
    }

}



/* 
*
* Logo Repeater
*
* * * * * * * * * * * * * * * * * * */


.logo-repeater .container {
    max-width: 1000px;
}

.logo-repeater .row {
/* filter: grayscale();*/
 justify-content: center;
 margin: 60px 0 0 0;
 align-items: center;
}

.logo-repeater .row a {
  text-align: center;
  margin: 0 0 60px 0;
  display: flex;
    justify-content: center;
  align-items: center;
}

.logo-repeater .row a img {
    height: auto;
    max-height: 100px;
    max-width: 80%;
    flex: 0 auto;
    align-self: center;
    margin-bottom: 0;
    vertical-align: middle;
}

.Cols1 > div, 
.Cols1 > a, 
.logo-repeater .row.Cols1 > a {
  width: 100%;
}
.Cols2 > div, 
.Cols2 > a, 
.logo-repeater .row.Cols2 > a {
  width: calc(50% - 40px) ;
}
.Cols3 > div, 
.Cols3 > a, 
.logo-repeater .row.Cols3 > a {
  width: calc(33% - 40px) ;
}
.Cols4 > div, 
.Cols4 > a, 
.logo-repeater .row.Cols4 > a {
  width: calc(25% - 40px) ;
}

@media (max-width: 1024px) {
    
    .logo-repeater .row {
        align-items: center;
    }

    .logo-repeater .row > div,
    .logo-repeater .row > a {
        width: 100%!important;
        max-width: 400px;
        margin-right: 0;
    }


}



/* 
*
* Link Column Image & Text Repeater
*
* * * * * * * * * * * * * * * * * * */


.column-repeater .row {
    align-items: flex-start;
}


.column-repeater .row a {

    width: calc(33% - 2rem);
    margin: 0 2rem 1rem 0;
    text-align: left;
    text-decoration: none;
}

.column-repeater .clr-smp:nth-child(3n) {
    margin-right: 0;
}


.column-repeater .s-prj-txt-img {
     width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 1rem;
    margin-bottom: 2rem;
}



/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/*/
/*\/\/\/\/\/\/\/\/\/\/\   BLOG & SINGLE ARTICLE   /\/\/\/\/\/\/\/\//\/\/*/
/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/*/


.blog.row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    padding: 1rem;
}

.blog.row > div {
    aspect-ratio: 1 / 1;
    overflow: hidden;
    height: 100%;
    width: 100%;
}

.blog.row > div a {
    font-size: 28px;
    line-height: 1.2;
    background-color: rgba(0,0,0,0.5);
    color: #fff;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 1.5rem;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
}

.blog.row a:hover {
    text-decoration: none;
    color: #561988;
}

.footer_share {
    text-align: center;
    margin: 3rem 0 5rem;
}

/*.footer_share a {
                box-shadow: inset 0 -4px 6px rgba(0, 0, 0, 0.1);
                padding: 2rem;
}*/

.footer_share a {
    position: relative;
    display: block;
    width: fit-content;
    margin: auto;
    font-size: 30px;
    color: #561988;
}

.footer_share a:hover {
    text-decoration: none;
}

.footer_share a::after {
    content: '';
    position: absolute;
    top: 100%;
    left: -100px;
    right: 0;
    width: 350px;
    height: 40px;
    background: radial-gradient(ellipse 50% 15px at bottom, rgba(0, 0, 0, 0.3) 0%, transparent 100%);
    pointer-events: none;
}

.footer_share img {
    position: absolute;
    margin: 3px 0 0 11px;
    width: 30px;
    height: auto;
}

@media (min-width: 2200px) {
    .blog.row {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1600px) {
    .blog.row { 
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 1200px) {
    .blog.row { 
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .blog.row {
        grid-template-columns: repeat(1, 1fr);
    }

    #single-blog .container > div {
        border: none!important;
        padding: 1rem!important;
    }

}



.foogallery.fg-caption-always .fg-item.fg-loaded .fg-caption {
    display: none;
}


#single-blog {
    margin-top: 2rem;
    margin-bottom: 4rem;
}

#single-blog h1 {
    margin-bottom: 3rem;
    color: #236188;
    font-size: 30px;
}


#single-blog .container > div {
    border: 1px solid #8125cc;
    max-width: 900px;
    padding: 3rem;
    margin-left: auto;
    margin-right: auto;
}

#single-blog article {
    margin-bottom: 2rem;
    clear: both;
}

#single-blog .social-channels {
    position: relative;
    right: 0;
    top: 0;
    left:0;
    bottom:0;
    text-align: left;
}


#single-blog article p {
    margin-bottom: 0.9rem;
}

#single-blog article a {
    color: rgb(53,146,204);
}


#articles-page .row>div {
    width: 45%;
}


#article-images {
    padding: 3rem 0;
}

#article-images .row {
    justify-content: space-between;

}

#article-images .img-title {
    font-size: 1rem;
    margin: 1rem 0;
    text-decoration: none;
}

#article-images a:nth-child(n) {
    width: calc(25% - 1rem);
    height: 40vh;
    margin: 0 0.5rem 6rem 0.5rem;
    font-size: 1rem;
}

#article-images a:nth-child(n):hover {
    text-decoration: none;
}

#article-images a:nth-child(n) .img-bg {
    width: 100%;
    height: 100%;
}

#article-images a:nth-child(8n+1) .img-bg {
    height: 100%;
}

#article-images a:nth-child(8n+2) {
    width: calc(25% - 2rem);
}

#article-images a:nth-child(8n+2) .img-bg {
    height: 50%;
}

#article-images a:nth-child(8n+3) {
    width: calc(50% - 2rem);
}

#article-images a:nth-child(8n+4) {
    width: calc(50% - 2rem);
    margin-left: calc(25% + 1rem);
}

#article-images a:nth-child(8n+6) {
    width: calc(50% - 2rem);
}






/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/*/
/*\/\/\/\/\/\/\/\/\/\/\   ENQUIRY FORM   /\/\/\/\/\/\/\/\//\/\/*/
/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/*/


/* Forminator */

.forminator-field {
    text-align: left;
}

.forminator-ui .forminator-field input,
.forminator-ui .forminator-field input[type="text"],
.forminator-ui .forminator-field input[type="email"],
.forminator-ui .forminator-field textarea {
  
    font-size: 1.5rem;
    color: rgba(0, 0, 0, 0.9);
    line-height: 1.2;
    padding: 10px 0 10px 0;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 0 20px 0;


    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: transparent;

    border: none;
    border-radius: 3px;
    border: 1px solid #999 !important;

}


input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}

.forminator-ui.forminator-custom-form[data-design=default] button.forminator-button.forminator-button-submit,
button.forminator-button-submit {
    
    font-size: 0.9rem!important;
    text-decoration: none;
    display: inline-block;
    color: #fff;
    background-color: rgb(88, 21, 143);
    border-radius: 1.4rem;
    padding: 0.7rem 1.1rem;
    margin: 1rem 0 0 0;
    min-width: 150px;
    text-align: center;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
    -o-transition: .5s;
    -webkit-transition: .5s;
    transition: .5s;
    cursor: pointer;

}

.forminator-ui.forminator-custom-form[data-design=default] button.forminator-button.forminator-button-submit:hover,
button.forminator-button-submit:hover {
        background-color: rgba(88, 21, 143, 0.7);
    color: #fff;
}



input[type="submit"] {

    font-size: 1.2rem;
    text-decoration: none;
    display: inline-block;
    color: rgba(0, 0, 0, 0.9);
    border: 1px rgba(0, 0, 0, 0.9) solid;
    border-radius: 1.4rem;
    padding: 0.75rem 1rem;
    margin: 1rem 0 0 0;
    background-color: rgba(255, 255, 255, 0);


    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;

    cursor: pointer;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}


input[type="submit"]:hover {
    color: rgba(255, 255, 255, 1);
    background-color: rgba(0, 0, 0, 0.9);
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}






/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/*/
/*\/\/\/\/\/\/\/\/\/\/\   SECTION REPEATER   /\/\/\/\/\/\/\/\//\/\/*/
/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/*/


/* 
*
* Global Sections
*
* * * * * * * * * * * * * * * * * * */


section#header-spacer+section {
    padding-top: 100px !important;
}


section {
    margin: 0 0 -1px 0;
    padding: 0;
    clear: both;
    /* gap scrolling bug */
    /*  transform: translateZ(0);*/
    /*  will-change: transform;*/
    /*  background-clip: content-box;
  position: relative;*/
}


.section_spacer {
    margin: 0 0 -1px 0;
}


section.parallax {
    margin: 0;
    padding: 0;
    overflow: hidden;
}


/* Section Padding */

section.pad-none,
.pad-none {
    padding: 0;
}

section.pad-top,
.pad-top {
    padding: 5rem 0 0 0;
}

section.pad-bottom,
.pad-bottom {
    padding: 0 0 5rem 0;
}

section.pad-standard,
.pad-standard {
    padding: 5rem 0;
}


.a-l {
    text-align: left;
}

.a-r {
    text-align: right;
}



/* 
*
* Review Section
*
* * * * * * * * * * * * * * * * * * */

section.review {
    min-height: 70vh;
}

section.review .container {
    max-width: 1000px;
}



.chart-intro {
        text-align: center; 
        max-width: 350px; 
        margin: 0 auto -40px auto; 
        position: relative; 
        z-index: 10;
}

@media screen and (max-width: 1024px) {

    .chart-intro {
            text-align: center; 
            max-width: 350px; 
            margin: 0 auto 40px auto; 
            position: relative; 
            z-index: 10;
    }

}




/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * *                                 * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * *          MEDIA QUERIES          * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * *                                 * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */


@media screen and (max-width: 1800px) {

/*    .container {
        width: calc(100% - 80px);
        max-width: 1600px;
        padding: 40px 40px;
    }*/

}


@media screen and (max-width: 1440px) {




    html,
    body {
        font-size: 17px;
    }

    .container {
        width: calc(100% - 6rem);
        max-width: 1400px;
        padding: 40px 3rem;
        margin: auto;
        text-align: center;
    }

    #page-projects .project-gallery {
        padding: 3rem 0;
    }

    #page-projects .project-gallery a {
        margin: 3rem 0;
    }

    #page-projects .project-gallery a:nth-child(8n+1) .img-bg {
        height: 90vh;
    }

    #page-projects .project-gallery a:nth-child(8n+2) {
        width: calc(66% - 1.5rem);
        margin: 1rem 0;
        height: 75vh;
    }

    #page-projects .project-gallery a:nth-child(8n+3) {
        height: 75vh;
    }


    #page-projects .project-gallery a:nth-child(8n+4) .img-bg {
        height: 65vh;
    }


    #page-projects .project-gallery a:nth-child(8n+5) .img-bg {
        height: 75vh;
    }


    #page-projects .project-gallery a:nth-child(8n+6) {
        height: 75vh;
    }


    #page-projects .project-gallery a:nth-child(8n+7) {
        height: 75vh;
    }

    #page-projects .project-gallery a:nth-child(8n+8) .img-bg {
        height: 75vh;
    }


    .team-wrap>div {
        margin: 0 2rem 0 0;
        text-align: left;
        width: calc(50% - 2rem);
    }

    .m-image {
        height: 550px;
    }


    section.floating-images img:nth-child(1) {
        width: 360px;
        margin-left: -3%;
      }

      section.floating-images img:nth-child(2) {
        width: 450px;
        margin-left: -14%;
      }

      section.floating-images img:nth-child(3) {
        width: 520px;
        margin: 360px 0 0 -130px;
      }

      section.floating-images .decription-text {
          width: 280px;
      }

     


}


@media screen and (max-width: 1200px) {


    html,
    body {
        font-size: 16px;
    }

    .overview article,
    .project_specs>div {
        width: 90%;
    }

    .colour-samples .clr-smp {
        width: calc(33% - 2rem);
        margin: 0 2rem 1rem 0;
    }


}


@media screen and (max-width: 1024px) {


    html,
    body {
        font-size: 18px;
    }

    section.text .container img {
        display: block;
        float: none;
        margin-left: auto ;
        margin-right: auto ;
    }

    .m-hide {
        display: none!important;
    }


    .text-columns .row>div {
        width: 100%;
    }

    #logo-front {
        width: 60%;
        max-width: 400px;
    }

    .container {
        width: calc(100% - 4rem);
        padding: 1rem 0;
    }

    section {
        margin: 0;
        padding: 0;
        min-height: -webkit-fit-content;
        min-height: -moz-fit-content;
        min-height: fit-content;
    }

    .row {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .row>div {
        width: 100%;
        margin: 0 0 1rem 0;
    }

    h1, p {
        width: 100%;
    }


    .text-columns img,
    section.image-grid .img-mask,
    section.image-grid .row .img-bg {
        border-radius: 1rem;
    }


    section.image-grid .row {
        padding: 0;
    }

    section.image-grid .row a {
        width: 100%;
        aspect-ratio: 3 / 2;
        margin: 0 0 2rem 0;
        cursor: pointer;
    }

    section.image-grid .row .img-bg {
        height: 100%;
    }

    section.image-grid .container>div:first-child {
        padding: 0;
    }


    section.image-grid a .img-mask,
    section.image-grid a .img-t {
        opacity: 1 !important;
    }

    section.image-grid a .img-t {
        color: rgba(255, 255, 255, 0.9);
    }

    section.image-grid .img-mask {
        font-size: 2.5rem;
    }


    ul.project-slider li a {
        font-size: 3rem;
    }

    ul.project-slider li a {
        opacity: 1;
    }


    ul.project-slider li a div {
        margin: 2rem 2rem 3rem 2rem;
    }

    ul.project-slider li a div svg {
        width: 3rem;
        margin-bottom: 1rem;
    }

    section.text .container>div {
        margin: 0
    }


    .role span.btn-border,
    button.btn-border,
    span.btn-border a,
    a.btn-border,
    .btn-border a {
        margin: 1rem 0;
    }

    .prj-nature,
    option,
    input[type="text"],
    input[type="email"],
    textarea {
        font-size: 1rem;
    }


    .font-xsmall,
    .fs-xs,
    .fs-xs a {
        font-size: 0.9rem;
        /* 16px */
    }

    .font-small,
    .fs-s,
    .fs-s a,
    .hero-text p.subTitle {
        font-size: 1.2rem;
        /* 20px */
        line-height: 1.2;
    }

    .font-medium,
    .fs-m,
    .fs-m a,
    section.image-grid h3 {
        font-size: 1.3rem;
        /* 30px  */
        line-height: 1.2;
    }

    .font-large,
    .fs-l,
    .fs-l a {
        font-size: 2rem;
        /* 45px */
        line-height: 1.1;
    }

    .fs-xl,
    .fs-xl a {
        font-size: 2.5rem;
        /* 45px */
        line-height: 1.1;
    }

/*    .fs-xxl,
    .fs-xxl a,
    .hero-Title,
    .hero-text h1,
    .hero-text h2,
    .hero-text h3,
    .hero-text h4 {
        font-size: 3rem;
        line-height: 1.1;
    }*/

    .fs-xxl,
    .fs-xxl a,
    .hero-Title {
        font-size: 3rem;
        /* 60px */
        line-height: 1.1;
    }


/*    .hero-text h1,
    .hero-text p {
        width: 80%;
    }
*/

    /* Section Padding */

    section.pad-none {
        padding: 0;
    }

    section.pad-top {
        padding: 2rem 0 0 0;
    }

    section.pad-bottom {
        padding: 0 0 2rem 0;
    }

    section.pad-standard {
        padding: 2rem 0;
    }


    section.project-gallery {
        margin: 0;
    }

    section.project-gallery a:nth-child(n) {
        width: 100% !important;
        height: 60vw !important;
        margin: 0 0 2rem 0 !important;
    }

    section.project-gallery a:nth-child(n) .img-bg {
        width: 100% !important;
        height: 60vw !important;
        margin: 0 0 1rem 0 !important;
    }

    section.project-gallery a:nth-child(n) div {
        width: 100% ! important;
        margin: 0 !important;
        font-size: 1rem;
    }


    section.review-slider blockquote {
        font-size: 1.5rem;
    }

    section.review-slider .credit {
        margin-top: 2rem;
        font-size: 1.1rem;
    }

    section.review-slider .container {
        width: 100%;
    }

    .prevSlide.slick-arrow {
        display: none !important;
    }

    .r-slide.slick-slide {
        padding: 0 5rem 0 2rem !important;
    }


    /* PROFILE SLIDER */


    .profile-slider .intro,
    .profile-slider-row .intro {
        margin: 0;
    }

    .profile-slider-row>div {
        margin: 3rem 2rem 3rem 2rem;
    }

    .profile-slide-wrapper .nextSlide.slick-arrow {
        right: 0;
        margin-right: 0rem;
    }


    .profile-slide-wrapper .slick-slide {
        margin: 0;
        padding: 3rem;
    }


        section.collapsible .col-title {
            padding-left: 40px;
            font-size: 1.5rem;
        }

        section.collapsible .col-title svg {
            height: 22px;
            margin-right: 1rem;
        }

        section.collapsible hr {
            margin: 1.3rem 0;
        }


        .overview article,
        .project_specs>div,
        #project-details .row>div,
        #position-details .row>div {
            width: 100%;
        }


        .text-image-columns.img-left .s-prj-txt,
        .text-image-columns.img-right .s-prj-txt {
            order: 2;
        }

        .text-image-columns.img-left .s-prj-txt-img,
        .text-image-columns.img-right .s-prj-txt-img {
            order: 1;
            min-height: auto;
        }

        .s-prj.row {
            flex-direction: row;
            justify-content: space-between;
        }

        .s-prj-txt-img {
            width: 100% !important;
            aspect-ratio: 3 / 2;
        }

        .s-prj-txt {
            width: 100% !important;
            padding: 0 !important;
            order: 2;
        }


        .colour-samples .clr-smp {
            width: 100% !important;
            aspect-ratio: 3 / 2;
            margin: 0 0 1rem 0;
        }


        #project-images .s-prj-2>div,
        .s-prj-img img {
            width: 100%;
            height: auto;
            aspect-ratio: 1 / 1;
        }

       

        #project-images .container>div,
        .s-prj-2, .s-prj-2 .bg-img, .s-prj-img  {
            margin: 0;
        }

        .s-prj-2 .bg-img, .s-prj-img img  {
            margin-bottom: 1rem;
        }

        #project-images {
            padding: 1rem 0;
        }


        section.image-banner,
        section.double_images {
            height: 70vh;
          }
        .parallax-img .bg-img,
            .double_images .row {
            height: 75vh;
          }



        section.floating-images .decription-text {
            opacity: 1;
            -webkit-transition: opacity 1s;
            -o-transition: opacity 1s;
            transition: opacity 1s;
          }

          section.floating-images img:nth-child(1) {
              margin-left: -8%;
          }

          section.floating-images {
                height: 630px;
            }

            section.floating-images img:nth-child(1),
            section.floating-images img:nth-child(2) {
                width: 30vw;
            }
            section.floating-images img:nth-child(3) {
                width: 50vw;
            }

        section.image-grid a:hover .img-mask,
         section.image-grid a:hover .img-t {
            background-color: rgba(0, 0, 0, 0);
        }

        section.image-grid a .img-mask {
            height: auto;
            margin: 0 0 1.5rem 1rem;
            font-size: 2rem;
        }


    }


    @media screen and (max-width: 768px) {


        html,
        body {
            font-size: 20px;
        }


        h1,
        p {
            width: 100%;
        }

        section#header-spacer+section {
            padding-top: 6rem !important;
        }


        /* Section Padding */

        section.pad-none,
        .pad-none {
            padding: 0;
        }

        section.pad-top,
        .pad-top {
            padding: 2rem 0 0 0;
        }

        section.pad-bottom,
        .pad-bottom {
            padding: 0 0 2rem 0;
        }

        section.pad-standard,
        .pad-standard {
            padding: 2rem 0;
        }


        section.image-grid .row .img-bg {
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            align-items: flex-start;
        }

        section.image-grid a:hover {
            text-decoration: none!important;
        }

        /*section.image-grid a .img-mask  {
            height: auto;
            margin: 0 0 0.5rem 1rem;
            order: 1;
            display: block;
            position: relative;
        }*/

        /*section.image-grid a .img-t {
            order: 2;
            font-size: 1rem;
            margin: 0 0 2rem 1rem;
            display: block;
            position: relative;
        }*/

        section.image-grid .img-mask span {
            margin: 0;
        }

        .more_link .container {
            padding: 0;
            padding-bottom: 2rem;
        }

        .more_link.pad-top {
            padding: 0;
        }

        section.projects h3, section.projects h4 {
            font-size: 1.5rem;
            margin: 0 2rem;
        }

        ul.project-slider {
            margin: 0 0 0 1.5rem;
        }

        ul.project-slider li {
            height: 45vw;
            aspect-ratio: 3 / 2;
            margin: 1.5rem 1.5rem 0 0;
            border-radius: 1rem;
        }

        section.project-gallery a:nth-child(n),
        section.project-gallery a {
             width: 100% !important;
            height: auto !important;
            max-height: 100% !important;
            margin-bottom: 1rem;
            display: block;

        }

        section.project-gallery a:nth-child(n) .img-bg,
        section.project-gallery a .img-bg {
            width: 100% !important;
            height: auto !important;
            margin: 0 0 1rem 0 !important;
            aspect-ratio: 1 / 1!important;
            border-radius: 1rem;
        }


        section.floating-images img:nth-child(3) {
            width: 45vw;
            margin: 64px 0 0 -60px;
          }

          section.floating-images .decription-text {
            width: 100%;
            display: block;
            margin: 70px 0 0 0;
          }

          section.floating-images {
            height: auto;
        }


        .hero-text p.subTitle {
            font-size: 1rem;
            padding-bottom: 4rem;
        }

        .slick-dots {
            left: 14px;
            right: auto;
        }

        .slick-dots li .dot {
            height: 2px !important;
            width: 50px !important;
        }



    }




    @media (max-width: 500px) {


        html,
        body {
            font-size: 18px;
        }

        .container {
            width: calc(100% - 3rem);
        }


        .font-xsmall,
        .fs-xs,
        .fs-xs a {
            font-size: 0.9rem;
            /* 16px */
        }

        .font-small,
        .fs-s,
        .fs-s a,
        .hero-text p.subTitle,
        .profile-category h3 {
            font-size: 1rem;
            /* 20px */
            line-height: 1.2;
        }

        .font-medium,
        .fs-m,
        .fs-m a,
        section.image-grid h3{
            font-size: 1.2rem;
            /* 30px  */
            line-height: 1.2;
        }

        .font-large,
        .fs-l,
        .fs-l a,
        .profile-category h2  {
            font-size: 1.8rem;
            /* 45px */
            line-height: 1.1;
        }

        .fs-xl,
        .fs-xl a {
            font-size: 2rem;
            /* 45px */
            line-height: 1.1;
        }

        .fs-xxl,
        .fs-xxl a,
        .hero-Title,
        .hero-text h1,
        .hero-text h2,
        .hero-text h3,
        .hero-text h4 {
            font-size: 2.2rem;
            /* 60px */
            line-height: 1.1;
        }


        .profile-slide-wrapper .slick-slide {
            margin-right: 0;
        }

        section.projects h3, section.projects h4 {
            font-size: 1.2rem;
            margin: 0 1.5rem;
        }


        ul.project-slider li {
            height: 45vw;
            aspect-ratio: 3 / 2;
            border-radius: 1rem;
        }

        ul.project-slider li a {
        font-size: 1.5rem;
    }

        ul.project-slider li a div {
        margin: 1rem;
    }

    ul.project-slider li a div svg {
        width: 1rem;
        margin-bottom: 0.5rem;
    }


    ul.project-slider .prevSlide.slick-arrow, ul.project-slider .nextSlide.slick-arrow {
        position: absolute;
        top: calc(50% - 20px);
        width: 40px;
        height: 40px;
        background-color: rgba(240, 240, 240, 0);
        display: none;
    }

    .profile-slide-wrapper .slick-slide {
        margin: 0;
        padding: 1.2rem;
    }


    .speciesBG {
        margin: 0;
        width: 100%;
        max-width: 100%;
    }

    .prfTitle {
        font-size: .9rem;
    }

    .prfCode {
        font-size: .8rem;
    }

    .prfAssets, .prfAssetLinks a {
font-size: .8rem;
    }

    .slick-slide hr {
        margin: 1rem 0;
        color: rgba(0, 0, 0, 0.3);
        background: rgba(0, 0, 0, 0.3);
    }

        



    }