@charset "UTF-8";
@font-face {
  font-family: ClanProReg;
  src: url(../assets/fonts/FFClanProRgNews.TTF);
}
@font-face {
  font-family: ClanProBold;
  src: url(../assets/fonts/FFClanProMedium.TTF);
}
* {
  box-sizing: border-box;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fade-in {
  opacity: 0;
  animation: fadeIn ease-in 1;
  animation-fill-mode: forwards;
  animation-duration: 0.9s;
}

@keyframes fadeIn2 {
  from {
    opacity: 0;
    margin-left: -4em;
  }
  to {
    opacity: 1;
    margin-left: 0;
  }
}
.fade-in2 {
  animation: fadeIn2 ease-in 1;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
}

html {
  overflow-x: hidden;
}

body {
  overflow-x: hidden;
  position: relative;
  padding: 0;
  margin: 0;
  font-size: 1em;
  color: #707070;
  background-color: #FBFBFB;
  font-family: "ClanProReg", "helvetica", sans-serif;
}

body.modal-open {
  position: fixed;
  width: 100%;
}

.modal {
  justify-content: center;
  align-items: center;
  z-index: 999999;
}

a {
  color: #7E9C56;
}

ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

h1, h2, h3, h4 {
  margin-top: 0;
  font-family: "ClanProBold", "helvetica", sans-serif;
}

h2, h3 {
  color: #674B8A;
}

select, input, button, p {
  font-size: 1em;
  -webkit-appearance: none;
}

a {
  text-decoration: none;
  cursor: pointer;
}

p {
  line-height: 1.6em;
}

.container {
  width: 100%;
  max-width: 100em;
  margin: 0 auto;
}

section {
  padding: 4em 4vw;
}
section .section-head {
  padding-bottom: 2em;
}
section .section-head.center {
  text-align: center;
}

.bttncontain {
  gap: 1em;
  padding: 1.6em 0;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
  overflow: hidden;
}

.bttncontain.center {
  display: flex;
  justify-content: center;
}

.bttn {
  background-color: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.4em;
  text-decoration: none;
  font-weight: bold;
  font-size: 1em;
  transition: 0.3s;
  border: 2px solid;
  padding: 0 2em;
  color: #5699C6;
  transition: 0.3s all;
  cursor: pointer;
  border-radius: 2px;
}

.bttn:hover {
  background-color: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.4em;
  text-decoration: none;
  font-weight: bold;
  font-size: 1em;
  transition: 0.3s;
  border: 2px solid;
  padding: 0 2em;
  background-color: #7E9C56 !important;
  border-color: #7E9C56 !important;
  color: #fff !important;
}

.bttntext {
  background-color: transparent;
  text-decoration: none;
  font-weight: bold;
  font-size: 1em;
  transition: 0.3s;
  color: #5699C6;
}

.modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(102, 76, 138, 0.3333333333);
  transition: all 1s;
}
.modal .modallogo {
  height: 4em;
  display: block;
  margin: 0 auto 2em;
}
.modal form .flex {
  gap: 1em;
}
.modal form input {
  width: 100%;
  height: 2.4em;
  border: none;
  border-radius: 4px;
  margin-bottom: 1em;
  font-size: 1em;
  padding-left: 1em;
  border: 1px solid rgba(102, 76, 138, 0.3333333333);
}
.modal form textarea {
  height: 7em;
  padding: 1em;
  width: 100%;
  border: none;
  border-radius: 4px;
  margin-bottom: 1em;
  font-size: 1em;
  border: 1px solid rgba(102, 76, 138, 0.3333333333);
}
.modal form .submit {
  width: auto;
  color: #fff;
  border-radius: 0;
  border: 2px solid #5897C7;
  background-color: #5897C7;
  padding: 0 1em;
}
.modal form p {
  font-size: 1em;
  margin-bottom: 0;
  margin-top: 0;
}
.modal form .flex p {
  display: flex;
  margin-bottom: 0;
  margin-top: 0;
  gap: 1em;
}
.modal form select {
  border: 1px solid #ccc;
  height: 2.4em;
  padding-left: 1em;
  width: 100%;
  margin-bottom: 1em;
}
.modal form .wpcf7-form-control-wrap {
  width: 100%;
}
.modal form .wpcf7-submit {
  border: none;
  background-color: #5897c7;
  color: #fff;
  font-weight: bold;
  padding: 0;
  transition: all 0.3s;
  cursor: pointer;
}
.modal form .wpcf7-submit:hover {
  background-color: #7e9c56;
}
.modal #mainheader .images {
  display: none;
}

.slick-dots li button {
  content: none !important;
  text-indent: -99999%;
  overflow: hidden;
}

.wpcf7-submit {
  cursor: pointer;
}

.modal-content {
  background-color: #fff;
  margin: 15% auto;
  padding: 20px;
  width: 80%;
  max-width: 400px;
  border-radius: 8px;
  text-align: center;
  position: relative;
}

.close {
  position: absolute;
  top: -1em;
  right: -1em;
  font-size: 24px;
  cursor: pointer;
  background-image: url(../assets/images/close.svg);
  background-size: contain;
  background-repeat: no-repeat;
  height: 2em;
  width: 2em;
  background-color: transparent;
  text-indent: -999%;
  overflow: hidden;
}

img {
  display: block;
}

.flex {
  display: flex;
  gap: 4em;
}
.flex .no-shrink {
  flex-shrink: 0;
  width: 100%;
}
.flex .no-shrink div {
  flex: 1;
}
.flex div {
  flex: 1;
}
.flex .fl1 {
  flex: 1;
}
.flex .fl2 {
  flex: 2;
}
.flex .fl3 {
  flex: 3;
}

.row {
  flex-direction: row;
}

.imgcontain img {
  object-fit: cover;
  object-position: center;
  height: 100%;
  width: 100%;
}

/**@import "base/forms.scss";**/
/**@import "base/typeography.scss";**/
/* @import "layouts/main.scss";
@import "layouts/posts.scss";
@import "layouts/casestudies.scss";**/
@media (max-width: 1199px) {
  header {
    background-color: #2E1C45;
  }
  header .logo {
    display: block;
    margin-left: 8vw;
    height: 1.4em;
  }
  header .logo img {
    height: 100%;
    display: block;
  }
  header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 100%;
    padding: 0;
    position: relative;
    padding: 0 !important;
    height: 5em;
  }
  header .container div {
    flex: initial;
  }
  header .menucontainer {
    position: fixed;
    top: 0;
    right: -100%;
    width: 80%;
    max-width: 320px;
    height: 100%;
    background: #fff;
    box-shadow: -4px 0 10px rgba(0, 0, 0, 0.2);
    transition: right 0.3s ease-in-out;
    overflow-y: auto;
    z-index: 1000;
    padding: 20px;
    background-color: #7e9c56;
  }
  header .menucontainer a {
    font-size: 1.2em;
    color: #fff;
    margin-bottom: 0.5em;
    display: block;
  }
  header .menucontainer a .submenu-toggle {
    font-size: 2em;
    color: #fff;
  }
  header .menucontainer.active {
    right: 0;
  }
  header .menu-main-menu-container {
    padding-top: 7em;
  }
  header .menutoggle {
    position: fixed;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    background: #333;
    cursor: pointer;
    z-index: 1001;
    background-color: #7e9c56;
  }
  header .menutoggle::before {
    content: "☰";
    font-size: 24px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
  }
  header .menu-item-has-children {
    position: relative;
  }
  header .menu-item-has-children > a {
    display: block;
    padding-right: 30px;
  }
  header .menu-item-has-children .submenu-toggle {
    position: absolute;
    right: 10px;
    top: 0.3em;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 16px;
    font-size: 2em;
    color: #fff;
  }
  header .sub-menu {
    display: none;
  }
  header .menu-item-has-children.open > .sub-menu {
    display: block;
  }
  header .menu-item.open > .sub-menu {
    display: block;
  }
  header .menutoggle {
    height: 5em;
    width: 5em;
  }
  #mainheader .headcontent {
    padding-top: 5rem;
  }
}
@media (min-width: 1200px) {
  header {
    background-color: #2E1C45;
  }
  header .logo {
    display: block;
    margin-left: 8vw;
    height: 1.4em;
  }
  header .logo img {
    height: 100%;
    display: block;
  }
  header .submenu-toggle, header .menutoggle {
    display: none;
  }
  header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 100%;
    padding: 0;
    position: relative;
  }
  header .container div {
    flex: initial;
  }
  header ul, header .menucontainer {
    display: flex;
    gap: 1em;
  }
  header ul a, header .menucontainer a {
    cursor: pointer;
  }
  header .menucontainer .menu a {
    padding: 0 0.3em;
    height: 5em;
    display: flex;
    flex-wrap: nowrap;
    white-space: nowrap;
    align-content: center;
    align-items: center;
    color: #fff;
  }
  header .menucontainer > a {
    padding: 0 1em;
    height: 5em;
    display: flex;
    flex-wrap: nowrap;
    white-space: nowrap;
    align-content: center;
    align-items: center;
    background-color: #7E9C56;
    color: #fff;
  }
  header .menucontainer > a:hover {
    background-color: #5897C7;
    transition: all 0.3s;
  }
  header .menucontainer .menu .menu-item-has-children {
    position: relative;
    display: block;
    cursor: pointer;
  }
  header .menucontainer .menu .menu-item-has-children ul {
    position: absolute;
    display: none;
    background-color: #7E9C56;
    margin-top: -1em;
    z-index: 9;
    padding: 1em 2em 1em 0.3em;
  }
  header .menucontainer .menu .menu-item-has-children ul a {
    height: auto;
    padding: 0.3em 0;
  }
  header .menucontainer .menu .menu-item-has-children:hover {
    background-color: #7E9C56;
  }
  header .menucontainer .menu .menu-item-has-children:hover ul {
    display: block;
  }
}
#mainheader {
  min-height: 50em;
  background-color: #2E1C45;
  padding: 0;
  margin-bottom: 4em;
  /*.slick-track>div:nth-child(odd) .img1 {
      position: absolute;
      top: 0;
      right: 40%;

  }

  .slick-track>div:nth-child(odd) .img2 {
      position: absolute;
      bottom: -4em;
      right: 20%;
      z-index: 2;
      top: initial;
  }

  .slick-track>div:nth-child(odd) .img3 {
      position: absolute;
      top: 0;
      right: -30%;
      z-index: 3;
  }*/
}
#mainheader .container {
  max-width: 100%;
}
#mainheader .row {
  min-height: 50em;
}
#mainheader row {
  align-items: center;
}
#mainheader .headcontent {
  flex-direction: column;
  justify-content: center;
  padding-left: 8vw;
  padding-right: 4vw;
  gap: 0;
}
#mainheader .headcontent img {
  max-width: 28em;
  margin-bottom: 3em;
}
#mainheader .headcontent .bttncontain {
  display: block;
  flex-direction: column;
  flex: initial;
}
#mainheader .headcontent .bttncontain .bttn {
  color: #fff;
  min-width: 27em;
  float: left;
  clear: left;
}
#mainheader .headcontent .bttncontain a:last-of-type {
  border: 2px solid #5897C7;
  background-color: #5897C7;
  margin-top: 1em;
}
#mainheader h1 {
  color: #fff;
  margin-right: 30%;
}
#mainheader h2 {
  color: #fff;
  margin-right: 30%;
}
#mainheader p {
  color: #fff;
  margin-right: 30%;
  font-size: 1.3em;
}
#mainheader .images {
  position: relative;
}
#mainheader .images img {
  object-fit: cover;
  height: 100%;
  width: 100%;
}
#mainheader .img1, #mainheader .img2, #mainheader .img3 {
  height: 33em;
  background-color: #eee;
  display: inline-block;
  width: 100%;
  clip-path: polygon(40% 0%, 100% 0%, 60% 100%, 0% 100%);
}
#mainheader .img1 {
  position: absolute;
  bottom: -4em;
  right: 40%;
}
#mainheader .img2 {
  position: absolute;
  top: 0;
  right: -20%;
  overflow-x: 2;
}
#mainheader .img3 {
  position: absolute;
  bottom: -4em;
  right: -30%;
}
#mainheader .slick-track, #mainheader .slick-slide {
  display: flex;
}
#mainheader .slick-slide {
  overflow: visible;
  clip-path: inset(0px 0px -100vw 0px);
}
#mainheader .slick-list {
  overflow: visible;
}
#mainheader .slick-dots {
  position: absolute;
  bottom: -2em;
  display: flex;
  justify-content: center;
  width: 100%;
  gap: 0.5em;
}
#mainheader .slick-dots button {
  background-color: #fff;
  border: none;
  text-indent: -999%;
  height: 1.4em;
  width: 1.4em;
  border-radius: 4em;
  border: 2px solid #7E9C56;
  cursor: pointer;
  font-variant-east-asian: -999%;
  overflow: hidden;
}
#mainheader .slick-dots .slick-active button {
  background-color: #7E9C56;
  border: none;
  text-indent: -999%;
  height: 1.4em;
  width: 1.4em;
  border-radius: 4em;
  border: 2px solid #7E9C56;
}
#mainheader .heropage .images {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
#mainheader .heropage .img2 {
  position: absolute;
  top: 0;
  right: -46%;
  height: 50em;
  width: 151%;
}
#mainheader .heropage .img1 {
  position: relative;
  bottom: initial;
  right: initial;
  left: -30%;
  z-index: 2;
}
#mainheader .heropage p {
  color: #fff;
  margin-right: 20%;
  font-size: 1.4em;
  padding-top: 0;
}
#mainheader .heropage h1 {
  margin-bottom: 0;
}

#mainheader.nomargin {
  margin-bottom: 0;
}

#mainheader.white {
  background-color: #fff;
}
#mainheader.white h1, #mainheader.white h2 {
  color: #674B8A;
}
#mainheader.white p {
  color: #707070;
}
#mainheader.white .headcontent .bttncontain .bttn {
  color: #7E9C56;
}
#mainheader.white .headcontent .bttncontain .bttn.openModal {
  color: #fff;
}

@media (max-width: 1199px) {
  #mainheader {
    min-height: auto;
    background-color: #2E1C45;
    padding: 0;
    margin-bottom: 4em;
    /*.slick-track>div:nth-child(odd) .img1 {
        position: absolute;
        top: 0;
        right: 40%;

    }

    .slick-track>div:nth-child(odd) .img2 {
        position: absolute;
        bottom: -4em;
        right: 20%;
        z-index: 2;
        top: initial;
    }

    .slick-track>div:nth-child(odd) .img3 {
        position: absolute;
        top: 0;
        right: -30%;
        z-index: 3;
    }*/
  }
  #mainheader .container {
    max-width: 100%;
  }
  #mainheader .row {
    min-height: 50em;
  }
  #mainheader row {
    align-items: center;
  }
  #mainheader .headcontent {
    flex-direction: column;
    justify-content: center;
    padding-left: 8vw;
    padding-right: 4vw;
    gap: 0;
  }
  #mainheader .headcontent img {
    max-width: 28em;
    margin-bottom: 3em;
  }
  #mainheader .headcontent .bttncontain {
    display: block;
    flex-direction: column;
    flex: initial;
  }
  #mainheader .headcontent .bttncontain .bttn {
    color: #fff;
    min-width: 27em;
    float: left;
    clear: left;
  }
  #mainheader .headcontent .bttncontain a:last-of-type {
    border: 2px solid #5897C7;
    background-color: #5897C7;
    margin-top: 1em;
  }
  #mainheader h1 {
    color: #fff;
    margin-right: 30%;
  }
  #mainheader h2 {
    color: #fff;
    margin-right: 5%;
  }
  #mainheader p {
    color: #fff;
    margin-right: 30%;
  }
  #mainheader .images {
    position: relative;
  }
  #mainheader .images img {
    object-fit: cover;
    height: 100%;
    width: 100%;
  }
  #mainheader .img1, #mainheader .img2, #mainheader .img3 {
    height: 33em;
    background-color: #eee;
    display: inline-block;
    width: 100%;
    clip-path: polygon(40% 0%, 100% 0%, 60% 100%, 0% 100%);
  }
  #mainheader .img1 {
    position: absolute;
    bottom: 0;
    right: 40%;
  }
  #mainheader .img2 {
    position: absolute;
    top: 0;
    right: -20%;
    overflow-x: 2;
  }
  #mainheader .img3 {
    position: absolute;
    bottom: 0;
    right: -30%;
  }
  #mainheader .slick-track, #mainheader .slick-slide {
    display: flex;
  }
  #mainheader .slick-slide {
    overflow: visible;
    clip-path: inset(0px 0px -100vw 0px);
    flex-direction: column;
  }
  #mainheader .slick-list {
    overflow: visible;
  }
  #mainheader .slick-dots {
    position: absolute;
    bottom: -2em;
    display: flex;
    justify-content: center;
    width: 100%;
    gap: 0.5em;
  }
  #mainheader .slick-dots button {
    background-color: #fff;
    border: none;
    text-indent: -999%;
    height: 1.4em;
    width: 1.4em;
    border-radius: 4em;
    border: 2px solid #7E9C56;
    cursor: pointer;
    font-variant-east-asian: -999%;
    overflow: hidden;
  }
  #mainheader .slick-dots .slick-active button {
    background-color: #7E9C56;
    border: none;
    text-indent: -999%;
    height: 1.4em;
    width: 1.4em;
    border-radius: 4em;
    border: 2px solid #7E9C56;
  }
  #mainheader .heropage .images {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #mainheader .heropage .img2 {
    position: absolute;
    top: 0;
    right: -46%;
    height: 50em;
    width: 151%;
  }
  #mainheader .heropage .img1 {
    position: relative;
    bottom: initial;
    right: initial;
    left: -30%;
    z-index: 2;
  }
  #mainheader .heropage p {
    color: #fff;
    margin-right: 20%;
    font-size: 1.4em;
    padding-top: 0;
  }
  #mainheader .heropage h1 {
    margin-bottom: 0;
  }
  #mainheader .heropage .flex {
    flex-direction: column;
  }
  #mainheader .img1, #mainheader .img2, #mainheader .img3 {
    clip-path: none;
    position: initial;
    height: auto;
    flex: 1;
    position: relative !important;
    left: 0 !important;
    height: 23em !important;
  }
  #mainheader .images {
    position: relative;
    display: flex !important;
    flex: auto;
    height: 10em;
    overflow: hidden;
  }
  #mainheader .heropage p {
    color: #fff;
    margin-right: 0;
    font-size: 1.3em;
    padding-top: 0;
  }
}
#content-filter form {
  gap: 1em;
  max-width: 80em;
  margin: 0 auto;
}
#content-filter form .optioncontain {
  overflow: hidden;
  border: #7F9C56 2px solid;
  padding-left: 2em;
  background-image: url(../assets/images/downarrow.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right center;
  opacity: 0.5;
}
#content-filter form .optioncontain select {
  width: 110%;
  height: 3em;
  border: none;
  background-color: transparent;
  -webkit-appearance: none;
}
#content-filter form .optioncontain.enabled {
  opacity: 1;
}
#content-filter form .optioncontain:first-of-type {
  opacity: 1;
}

#content-area .contantcontain {
  display: flex;
  justify-content: flex-end;
}
#content-area .padcontain {
  max-width: 43em;
}

#our-services .container {
  gap: 1em;
  box-shadow: 0 0 79px rgba(0, 0, 0, 0.2);
  padding: 2em;
  border-radius: 16px;
  transition: all 0.6s;
}
#our-services .container:hover {
  box-shadow: 0 0 79px rgba(103, 75, 138, 0.4666666667);
}
#our-services .imgcontain {
  height: 20em;
}
#our-services ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#our-services li {
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  margin-bottom: 0.4em;
  color: #674B8A;
  background-image: url(../assets/images/plus-icon.svg);
  background-position: right;
  background-size: contain;
  background-repeat: no-repeat;
}
#our-services li.active {
  background-color: #674B8A;
  background-image: url(../assets/images/plus-icon.svg);
  color: #fff;
}
#our-services li:hover {
  background-color: #7F9C56;
  background-image: url(../assets/images/plus-icon.svg);
  color: #fff;
}
#our-services .content {
  display: none;
  box-shadow: 0 0 79px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  overflow: hidden;
  transition: all 0.6s;
}
#our-services .content:hover {
  box-shadow: 0 0 79px rgba(103, 75, 138, 0.5333333333);
}
#our-services .content.active {
  display: block;
}
#our-services .content:first-child,
#our-services ul li:first-child {
  display: block;
}
#our-services .contentcontain {
  padding: 2em 3em;
}
#our-services .contentcontain .bttntext {
  margin-top: 2em;
  display: inline-block;
  margin-bottom: 1em;
  background-image: url(../assets/images/linkarrow.svg);
  background-position: right;
  background-size: contain;
  padding: 0.1em 2em 0.1em 0;
  background-repeat: no-repeat;
  transition: all 0.3s;
}
#our-services .contentcontain .bttntext:hover {
  padding: 0.1em 3em 0.1em 0;
}

#industries-tabs .container {
  gap: 1em;
  box-shadow: 0 0 79px rgba(0, 0, 0, 0.2);
  padding: 2em;
  border-radius: 16px;
  transition: all 0.6s;
}
#industries-tabs .container:hover {
  box-shadow: 0 0 79px rgba(103, 75, 138, 0.4666666667);
}
#industries-tabs .imgcontain {
  height: 20em;
}
#industries-tabs ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
#industries-tabs li {
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  margin-bottom: 0.4em;
  color: #674B8A;
  /*background-image: url(../assets/images/plus-icon.svg);*/
  background-position: right;
  background-size: contain;
  background-repeat: no-repeat;
}
#industries-tabs li.active {
  background-color: #674B8A;
  /*background-image: url(../assets/images/plus-icon.svg);*/
  color: #fff;
}
#industries-tabs li:hover {
  background-color: #7F9C56;
  /*background-image: url(../assets/images/plus-icon.svg);*/
  color: #fff;
}
#industries-tabs .content {
  display: none;
  box-shadow: 0 0 79px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  overflow: hidden;
  transition: all 0.6s;
}
#industries-tabs .content:hover {
  box-shadow: 0 0 79px rgba(103, 75, 138, 0.5333333333);
}
#industries-tabs .content.active {
  display: block;
}
#industries-tabs .content:first-child,
#industries-tabs ul li:first-child {
  display: block;
}
#industries-tabs .contentcontain {
  padding: 2em 3em;
}
#industries-tabs .contentcontain .bttntext {
  margin-top: 2em;
  display: inline-block;
  margin-bottom: 1em;
  background-image: url(../assets/images/linkarrow.svg);
  background-position: right;
  background-size: contain;
  padding: 0.1em 2em 0.1em 0;
  background-repeat: no-repeat;
  transition: all 0.3s;
}
#industries-tabs .contentcontain .bttntext:hover {
  padding: 0.1em 3em 0.1em 0;
}

#download.cta {
  padding-top: 8em;
  padding-bottom: 8em;
  background: rgb(206, 200, 218);
  background: linear-gradient(140deg, rgb(206, 200, 218) 0%, rgb(173, 154, 211) 100%);
}
#download.cta .container {
  max-width: 70em;
}
#download.cta .ctainner {
  display: flex;
  justify-content: center;
  padding: 3em 20em;
  background-color: #614A86;
  color: #fff;
  flex-direction: column;
  align-items: center;
  position: relative;
  box-shadow: rgba(0, 0, 0, 0.0862745098) 0 0 10px;
}
#download.cta .bttn {
  color: #fff;
}
#download.cta .ctaimage {
  position: absolute;
  background-color: transparent;
  top: -4em;
  bottom: -4em;
  left: 2vw;
  min-width: 16em;
  display: flex;
  max-width: 14em;
  align-items: center;
}
#download.cta .ctaimage img {
  width: 100%;
  height: auto;
}
#download.cta h2, #download.cta h3, #download.cta p {
  color: #fff;
  text-align: center;
}
#download.cta .ctainner.ctaimageshow {
  padding: 3em 4em 3em 20em;
  align-items: left;
}
#download.cta .ctainner.ctaimageshow h2, #download.cta .ctainner.ctaimageshow p {
  text-align: left;
}
#download.cta .ctainner.ctaimageshow a {
  max-width: 20em;
}

#contentblocks {
  padding: 0;
}
#contentblocks .flex {
  gap: 0;
}
#contentblocks .flex .imgcontain {
  min-height: 20em;
  max-height: 36em;
  display: flex;
}
#contentblocks .contentpad {
  padding: 4em 8vw;
}
#contentblocks .contentarea {
  display: flex;
  align-items: center;
}

#contentblocks.alternate1 {
  padding: 0;
  display: flex;
  flex-direction: column-reverse;
}
#contentblocks.alternate1 .flex {
  gap: 0;
  flex-direction: row-reverse;
}

#newsfeed.full {
  background-color: #2E1B46;
  background-image: url(../assets/images/news-bkg.svg);
  background-size: cover;
}
#newsfeed.full ul {
  display: flex;
  gap: 1em;
  flex-wrap: wrap;
}
#newsfeed.full ul img {
  display: block;
  width: 100%;
  height: auto;
}
#newsfeed.full ul li {
  flex: 1;
  background-color: #fff;
}
#newsfeed.full ul li a {
  color: #707070;
}
#newsfeed.full ul li a h3 {
  color: #707070;
}
#newsfeed.full ul li:first-of-type {
  flex-shrink: 0;
  flex: auto;
  width: 100%;
  margin-bottom: 3em;
  background-color: transparent;
}
#newsfeed.full ul li:first-of-type a {
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
}
#newsfeed.full ul li:first-of-type .newsbottom {
  flex: 1;
  background-color: #fff;
  padding: 4em 3em 4em;
}
#newsfeed.full ul li:first-of-type .newstop {
  width: calc(50% - 2em);
  height: 30em;
}
#newsfeed.full ul li:first-of-type h3 {
  font-size: 1.5em;
  margin-right: 6em;
}
#newsfeed.full ul .newsbottom {
  padding: 1em 3em 4em;
}
#newsfeed.full ul .newstop {
  position: relative;
}
#newsfeed.full ul .newstop span {
  position: absolute;
  padding: 1em 3em;
  background-color: #A53471;
  color: #fff;
}
#newsfeed.full ul .newstop {
  height: 20em;
}
#newsfeed.full ul img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
#newsfeed.full .newshead {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#newsfeed.full .newshead h2 {
  color: #fff;
  max-width: 50em;
}
#newsfeed.full .newshead .bttncontain {
  display: flex;
  justify-content: flex-end;
  gap: 1em;
}
#newsfeed.full .newshead .bttncontain a {
  color: #fff;
}

#newsfeed.reduced {
  background-color: #2E1B46;
  background-image: url(../assets/images/news-bkg.svg);
  background-size: cover;
}
#newsfeed.reduced ul {
  display: flex;
  gap: 1em;
  flex-wrap: wrap;
}
#newsfeed.reduced ul .newstop {
  height: 20em;
}
#newsfeed.reduced ul img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
#newsfeed.reduced ul li {
  flex: 1;
  background-color: #fff;
}
#newsfeed.reduced ul li a {
  color: #707070;
}
#newsfeed.reduced ul li a h3 {
  color: #707070;
}
#newsfeed.reduced ul .newsbottom {
  padding: 1em 3em 4em;
}
#newsfeed.reduced ul .newstop {
  position: relative;
}
#newsfeed.reduced ul .newstop span {
  position: absolute;
  padding: 1em 3em;
  background-color: #406595;
  color: #fff;
}
#newsfeed.reduced .newshead {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#newsfeed.reduced .newshead h2 {
  color: #fff;
  max-width: 50em;
}
#newsfeed.reduced .newshead .bttncontain {
  display: flex;
  justify-content: flex-end;
  gap: 1em;
}
#newsfeed.reduced .newshead .bttncontain a {
  color: #fff;
}

#services ul {
  gap: 1em;
}
#services ul li {
  background-color: #fff;
  border-radius: 14px;
  overflow: hidden;
  width: 33%;
}
#services ul li:hover {
  transition: all 0.3s;
  box-shadow: 0 0 40px rgba(103, 75, 138, 0.4666666667);
  position: relative;
  padding-bottom: 4em;
}
#services ul .slick-active {
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.1294117647);
}
#services ul a {
  color: #707070;
}
#services ul.flex {
  gap: 2%;
  justify-content: flex-start;
  flex-wrap: wrap;
  justify-content: center;
}
#services ul.flex li {
  width: 32%;
  margin-bottom: 2em;
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.1294117647);
}
#services .contentcontain {
  padding: 2em;
}
#services .contentcontain div {
  margin-left: -2em;
  border-left: #624A86 4px solid;
  padding-left: calc(2em - 4px);
  padding-top: 1em;
  padding-bottom: 1em;
}
#services .contentcontain ul {
  gap: 0.2em;
  flex-direction: column;
}
#services .contentcontain ul li {
  width: auto;
  margin: 0;
  box-shadow: none;
  border-radius: 0;
}
#services .contentcontain ul li::before {
  content: "";
  height: 1em;
  width: 1em;
  background-image: url("../assets/images/tickbox.svg");
  background-size: cover;
  background-repeat: no-repeat;
  display: inline-block;
  margin-right: 0.8em;
}
#services .section-head p {
  max-width: 50em;
  margin: 0 auto;
  font-size: 1.2em;
  line-height: 1.6em;
}
#services .head-pad {
  padding-bottom: 4em;
  padding-top: 2em;
}
#services .ico-water {
  background-image: url("../assets/images/water.svg");
  background-size: cover;
  background-repeat: no-repeat;
  display: inline-block;
  height: 4em;
  width: 4em;
  border-left: none !important;
  margin-left: 0em !important;
  margin-bottom: 1em;
}
#services .ico-surface {
  background-image: url("../assets/images/surface.svg");
  background-size: cover;
  background-repeat: no-repeat;
  display: inline-block;
  height: 4em;
  width: 4em;
  border-left: none !important;
  margin-left: 0em !important;
  margin-bottom: 1em;
}
#services .ico-air {
  background-image: url("../assets/images/air.svg");
  background-size: cover;
  background-repeat: no-repeat;
  display: inline-block;
  height: 4em;
  width: 4em;
  border-left: none !important;
  margin-left: 0em !important;
  margin-bottom: 1em;
}
#services .services .slick-slide {
  margin: 2em 1em;
}
#services .services .slick-list {
  margin: 0 -1em;
}
#services .services .slick-track {
  display: flex !important;
}
#services .services .slick-slide {
  height: inherit !important;
}
#services .services .slick-dots {
  display: flex;
  justify-content: center;
  box-shadow: none;
}
#services .services .slick-dots button {
  background-color: #fff;
  border: none;
  text-indent: -999%;
  height: 1.4em;
  width: 1.4em;
  border-radius: 4em;
  border: 2px solid #7E9C56;
  cursor: pointer;
}
#services .services .slick-dots .slick-active button {
  background-color: #7E9C56;
  border: none;
  text-indent: -999%;
  height: 1.4em;
  width: 1.4em;
  border-radius: 4em;
  border: 2px solid #7E9C56;
}
#services .services .slick-dots li {
  width: inherit;
  padding: 0;
  position: relative;
  overflow: hidden;
}
#services .imgcontain {
  height: 13em;
}
#services .bttntext {
  background-color: transparent;
  text-decoration: none;
  font-weight: bold;
  font-size: 1em;
  transition: 0.3s;
  color: #5699C6;
  position: absolute;
  bottom: 1em;
}
#services .bttntext {
  margin-top: 2em;
  display: block;
  margin-bottom: 1em;
  background-image: url("../assets/images/linkarrow.svg");
  background-position: right;
  background-size: contain;
  padding: 0.1em 2em 0.1em 0;
  background-repeat: no-repeat;
  transition: all 0.3s;
}
#services .bttntext:hover {
  padding: 0.1em 3em 0.1em 0;
}
#services li {
  padding-bottom: 4em;
  position: relative;
}

.datasheetwrap {
  position: absolute;
  bottom: 1em;
}
.datasheetwrap select {
  font-family: "ClanProReg", "helvetica", sans-serif;
}

.datasheet-dropdown {
  padding: 0.1em 2em 0.1em 0;
  background-repeat: no-repeat;
  transition: all 0.3s;
  color: #5699C6;
  font-weight: bold;
  border: none;
  font-size: 1em;
  width: 110%;
  background-color: transparent;
}

.datasheetwrap {
  background-image: url("./images/linkdown.svg");
  background-position: right;
  background-size: contain;
  margin-top: 2em;
  display: block;
  margin-bottom: 1em;
  background-repeat: no-repeat;
}

.products-template-default #services.prodfeed .imgcontain {
  height: 100%;
  max-height: 19em;
  overflow: hidden;
}
.products-template-default #services.prodfeed .imgcontain img {
  object-fit: cover;
  object-position: center;
  height: 100%;
  width: 100%;
}

.industries-template-default #services.prodfeed .imgcontain {
  height: 100%;
  max-height: 19em;
  overflow: hidden;
}
.industries-template-default #services.prodfeed .imgcontain img {
  object-fit: cover;
  object-position: center;
  height: 100%;
  width: 100%;
}

#full_width_image {
  padding: 0;
  width: 100%;
  height: 30em;
  overflow-y: hidden;
  display: block;
}
#full_width_image img {
  width: 100%;
}

#testimonial {
  background-color: #AE9CD3;
  color: #fff;
}
#testimonial .slick-slide {
  display: flex;
}
#testimonial .slick-dots {
  display: flex;
  justify-content: center;
  box-shadow: none;
  margin-top: 2em;
  column-gap: 1em;
}
#testimonial .slick-dots button {
  background-color: #fff;
  border: none;
  text-indent: -999%;
  height: 1.4em;
  width: 1.4em;
  border-radius: 4em;
  border: 2px solid #2E1B46;
  cursor: pointer;
  overflow: hidden;
}
#testimonial .slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: flex;
  margin-left: auto;
  margin-right: auto;
  align-items: center;
}
#testimonial .slick-active button {
  background-color: #2E1B46;
}
#testimonial .container {
  max-width: 60em;
  align-items: center;
}
#testimonial .t-image img {
  display: block;
  width: 100%;
  border-radius: 100em;
  border: 4em solid rgba(255, 255, 255, 0.2);
  box-sizing: border-box;
}
#testimonial .t-content {
  position: relative;
  margin-left: 2.6em;
  border-left: 2px solid #fff;
  padding-left: 0.5em;
}
#testimonial .t-content::before {
  content: "";
  height: 3em;
  width: 3em;
  display: block;
  position: absolute;
  left: -3.7em;
  top: 0;
  background-image: url("../assets/images/quotes-01.svg");
  background-size: contain;
  background-repeat: no-repeat;
}
#testimonial .t-content::after {
  content: "";
  height: 2em;
  width: 2em;
  display: block;
  position: absolute;
  left: -2.7em;
  bottom: 0;
  background-image: url("../assets/images/quotes-02.svg");
  background-size: contain;
  background-repeat: no-repeat;
}
#testimonial .t-content p {
  font-size: 1.4em;
}

#searcharea {
  display: flex;
  gap: 2em;
}

#enquiry-form {
  background-color: #406595;
  color: #fff;
  padding-top: 6em;
  padding-bottom: 6em;
}
#enquiry-form .container {
  align-items: center;
}
#enquiry-form .teamcard {
  margin-bottom: 3em;
  display: none;
  gap: 1em;
  align-items: center;
}
#enquiry-form .teamcard img {
  max-width: 10em;
}
#enquiry-form .teamcard h3 {
  margin: 0;
  padding: 0;
}
#enquiry-form .teamcard p {
  padding-top: 0;
  margin-top: 0;
}
#enquiry-form .teamcard a {
  color: #fff;
}
#enquiry-form .teamcard div {
  flex: initial;
}
#enquiry-form h2, #enquiry-form h3, #enquiry-form h4 {
  color: #fff;
}
#enquiry-form form p {
  padding: 0;
  margin: 0;
}
#enquiry-form form .flex p {
  display: flex;
  gap: 1em;
  width: 100%;
}
#enquiry-form form .flex p label {
  flex: 1;
}
#enquiry-form form input {
  width: 100%;
  height: 2.4em;
  border: none;
  border-radius: 4px;
  margin-bottom: 1em;
  font-size: 1em;
  padding-left: 1em;
}
#enquiry-form form select {
  width: 100%;
  height: 2.4em;
  border: none;
  border-radius: 4px;
  margin-bottom: 1em;
  font-size: 1em;
  padding-left: 1em;
}
#enquiry-form form textarea {
  height: 7em;
  padding: 1em;
  width: 100%;
  border: none;
  border-radius: 4px;
  margin-bottom: 1em;
  font-size: 1em;
  font-family: "ClanProReg", "helvetica", sans-serif;
}
#enquiry-form form .wpcf7-submit {
  width: auto;
  border: 2px solid;
  color: #fff;
  border-radius: 0;
  background-color: transparent;
  padding: 0 1em;
}
#enquiry-form .content ul {
  display: flex;
  gap: 1em;
}
#enquiry-form .content > h3 {
  padding-top: 1em;
}

input::placeholder, textarea::placeholder, select {
  color: #494949;
}

#content-repeater {
  padding: 0;
  background-color: #fff;
}
#content-repeater .row {
  gap: 0;
}
#content-repeater .row div {
  flex: 1;
}
#content-repeater .row:nth-of-type(even) {
  flex-direction: row-reverse;
}
#content-repeater .content {
  display: flex;
  align-items: center;
  min-height: 40vw;
}
#content-repeater .cotentpad {
  padding: 4em 4vw;
}
#content-repeater .imagearea img {
  object-fit: cover;
  height: 100%;
  width: 100%;
}
#content-repeater .imagearea.no-stretch img {
  object-fit: contain;
  height: 100%;
  width: 100%;
}
#content-repeater h3 {
  font-size: 1.5em;
}

#textarea {
  color: #fff;
  background-color: #664C8A;
}
#textarea .container {
  text-align: center;
  max-width: 60em;
}
#textarea h2 {
  color: #fff;
}

#faqs {
  background-color: #fff;
  padding-bottom: 6em;
  padding-top: 6em;
}
#faqs .container {
  max-width: 70em;
}
#faqs .faq-answer {
  display: none;
  padding: 1em 2em;
  border-top: 1px solid #ccc;
  transition: all 0.3s;
}
#faqs .faq-answer ul {
  list-style: disc;
  margin-left: 2em;
}
#faqs .faq-answer ul li {
  padding-bottom: 1em;
}
#faqs .faq-question {
  cursor: pointer;
  padding: 1em 2em;
  background-color: #fff;
  border: 1px solid #B19FD5;
  margin-top: 1em;
}

#locations {
  padding-bottom: 2em;
}
#locations ul {
  display: flex;
}
#locations ul li {
  padding: 2em;
  border-right: 1px solid rgba(112, 112, 112, 0.3333333333);
  flex: 1;
}
#locations ul li h3 {
  color: #707070;
}
#locations ul li:last-of-type {
  border-right: none;
}

#team {
  background-color: #664C8A;
}
#team #search-input {
  max-width: 40em;
  height: 2.4em;
  border: none;
  border-radius: 4px;
  padding-left: 1em;
  display: block;
  width: 100%;
  justify-content: center;
}
#team #searcharea {
  display: flex;
  gap: 2em;
  justify-content: center;
}
#team select {
  height: 2.4em;
  border: none;
  border-radius: 4px;
  padding-left: 1em;
  display: block;
  background-image: url("../assets/images/selectarrow.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right center;
}
#team h2, #team p {
  color: #fff;
}
#team ul {
  padding-top: 4em;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2%;
}
#team ul li {
  margin-bottom: 2em;
  width: 23%;
}
#team ul li .teamcontent p, #team ul li .teamcontent h3 {
  color: #fff;
  text-align: center;
}
#team .headshot {
  margin-bottom: 2em;
  width: 16vw;
  height: 16vw;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 100%;
  max-width: 15em;
  max-height: 15em;
  background-size: cover;
  background-position: center;
}
#team .headshot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
#team .popupTeam {
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
}
#team .modal h3, #team .modal p {
  text-align: left;
}
#team .modal .modal-content {
  max-width: 50em;
}
#team .modal .flex {
  align-items: center;
}
#team .modal .headshot {
  border-radius: 0;
}
#team .modal .headshot .imgcontain {
  width: 14vw;
  height: auto;
  margin: 1em auto;
  border-radius: 0;
}
#team .modal .headshot .imgcontain img {
  width: 100%;
  height: auto;
  border-radius: 0;
}
#team .modal .headshot {
  padding-bottom: 0;
}
#team .modal .headshot img {
  width: 100%;
  border-radius: 100%;
  margin: 0 auto;
}
#team .modal p {
  color: #707070;
}

#team.teampage .headshot img {
  width: 100%;
  height: auto;
  object-position: center;
}

#team.teampage .headshot {
  background-image: none !important;
}

#team.teampage .modal .headshot .imgcontain {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  border-radius: 100em;
}
#team.teampage .modal .headshot .imgcontain img {
  object-fit: cover;
  object-position: center;
}

#team.partners .headshot img {
  width: 90%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

#team.teampage #team ul li {
  width: 18%;
}

#team.teampage .modal .headshot {
  display: block;
}

#team.teampage ul li {
  margin-bottom: 2em;
  width: 18%;
}

#team.teampage .modal .headshot .imgcontain img {
  object-fit: cover;
  object-position: center;
  height: 100%;
  width: 100%;
}

footer {
  background-color: #D7DEE9;
  padding: 4em;
}
footer a {
  color: #4E4A40;
}
footer h5 {
  font-size: 1em;
  margin-bottom: 1em;
}
footer hr {
  color: #fff;
}
footer .footertop {
  padding: 2em 0;
  align-items: baseline;
  gap: 2em;
}
footer .footertop img {
  height: 4em;
}
#product-header {
  padding: 0;
  background-color: #fff;
}
#product-header h1 {
  font-size: 2em;
  color: #674B8A;
}
#product-header .row {
  gap: 0;
  flex-direction: row-reverse;
}
#product-header .row div {
  flex: 1;
}
#product-header .content {
  display: flex;
  align-items: center;
  min-height: 40vw;
}
#product-header .cotentpad {
  padding: 4em 4vw;
}
#product-header .cotentpad p:first-of-type {
  font-weight: bold;
  font-size: 1em;
}
#product-header .cotentpad ul {
  list-style: disc;
  margin-left: 1em;
}
#product-header .cotentpad ul li {
  padding-bottom: 0.5em;
}
#product-header .cotentpad ul li ul {
  padding-top: 0.5em;
}
#product-header .imagearea img {
  object-fit: cover;
  height: 100%;
  width: 100%;
}
#product-header h3 {
  font-size: 1.5em;
}

#archives {
  background-image: url(../assets/images/background.jpg);
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: contain;
  padding-bottom: 8em;
}

.home #services {
  background-image: url(../assets/images/background.jpg);
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: contain;
}

#archivefeed {
  display: flex;
  gap: 2%;
  flex-wrap: wrap;
}
#archivefeed .newstop {
  height: 20em;
}
#archivefeed img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
#archivefeed li {
  width: 32%;
  background-color: #fff;
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.1294117647);
  padding: 1em;
  border-radius: 14px;
  margin-bottom: 2%;
}
#archivefeed li a {
  color: #707070;
}
#archivefeed li a h3 {
  color: #707070;
}
#archivefeed .newsbottom {
  padding: 2em 1em;
}
#archivefeed .newstop {
  position: relative;
}
#archivefeed .newstop span {
  position: absolute;
  padding: 1em 3em;
  background-color: #406595;
  color: #fff;
}
#archivefeed .avatarcontain {
  display: flex;
  gap: 1em;
  margin-bottom: 2em;
  align-items: center;
}
#archivefeed .avatarcontain img {
  width: 20%;
  border-radius: 100px;
}

.pagination {
  display: flex;
  justify-content: center;
  gap: 1em;
}
.pagination .page-numbers {
  width: 2em;
  height: 2em;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #664C8A;
  border-radius: 4px;
  color: #fff;
}
.pagination .page-numbers.current {
  background-color: #7E9C56;
}
.pagination .next {
  width: auto;
  color: #664C8A;
  background-color: transparent;
}
.pagination .prev {
  width: auto;
  color: #664C8A;
  background-color: transparent;
}

.industries-template-default #product-header h1 {
  margin-bottom: 0.2em;
}
.industries-template-default #product-header h2 {
  margin-bottom: 2em;
  font-size: 1.2em;
  font-weight: 300;
}

.filtercat {
  background-color: #2E1C45;
  margin: 0 auto;
  max-width: 40em;
  display: flex;
  justify-content: center;
  padding: 1em;
  height: 5em;
  margin-top: -2.5em;
  position: relative;
  z-index: 4;
}
.filtercat select {
  padding-left: 1em;
  padding-right: 4em;
}

#blogpageheader.archivehead {
  margin-bottom: 0;
}
#blogpageheader.archivehead .textcontent {
  color: #fff;
}
#blogpageheader.archivehead .textcontent h1, #blogpageheader.archivehead .textcontent h2, #blogpageheader.archivehead .textcontent p {
  text-shadow: 0 0 8px rgba(0, 0, 0, 0.4);
}

.archive #blogpageheader .container {
  min-height: 330px;
  height: 10vh;
  display: flex;
  align-items: center;
  max-width: initial;
  position: relative;
  z-index: 3;
  margin: 0;
  justify-content: center;
  text-align: center;
  padding: 0;
}
.archive #blogpageheader .container h1, .archive #blogpageheader .container h2 {
  color: #fff;
}

.spareshead {
  background-size: cover;
  background-position: center;
}
.spareshead h1 {
  margin-bottom: 0;
  font-size: 1.5em;
}
.spareshead h2 {
  color: #fff;
}
.spareshead:after {
  content: "";
  height: 100%;
  width: 60vw;
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  background: rgb(0, 0, 0);
  background: linear-gradient(265deg, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 100%);
  opacity: 0.7;
}

.event-dropdown {
  background-image: url(../assets/images/selectarrow.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right center;
}

#schematics {
  background-color: #fff;
}
#schematics .flex {
  align-items: center;
}
#schematics .hotspot {
  background-image: url(../assets/images/plus-icon.svg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transform: translate(-20px, -20px);
  cursor: pointer;
}
#schematics .hotspot:hover {
  zoom: 1.2;
}
#schematics .hotspot.air {
  background-image: url(../assets/images/water.svg);
}
#schematics .hotspot.water {
  background-image: url(../assets/images/air.svg);
}
#schematics .hotspot.surface {
  background-image: url(../assets/images/surface.svg);
}
#schematics .bttntext {
  margin-top: 2em;
  display: inline-block;
  margin-bottom: 1em;
  background-image: url("../assets/images/linkarrow.svg");
  background-position: right;
  background-size: contain;
  padding: 0.1em 2em 0.1em 0;
  background-repeat: no-repeat;
  transition: all 0.3s;
}
#schematics .bttntext:hover {
  padding: 0.1em 3em 0.1em 0;
}
#schematics .hotspot-content {
  z-index: 10;
}
#schematics .hotspot-content h3 {
  color: #664B8A;
  font-size: 1em;
}
#schematics .hotspot-content p {
  color: #707070;
  font-size: 0.8em;
}
#schematics .hotspot-content a {
  display: inline-block;
  margin-bottom: 1em;
  font-weight: bold;
  color: #5897C7;
  font-size: 0.8em;
  margin-top: 2em;
}
#schematics img {
  display: block;
  height: auto;
  width: 100%;
}

.section-head p {
  max-width: 50em !important;
  margin: 0 auto !important;
  font-size: 1.2em !important;
  line-height: 1.6em !important;
}

.is-layout-flex > :is(*, div) {
  margin: 0;
  flex: 1;
}

#blogpage .share {
  display: flex;
  font-size: 1.2em;
  align-items: center;
  column-gap: 10px;
  list-style: none;
  margin: 0;
  font-weight: bold;
  padding: 0;
  border-top: 2px solid #2E1B45;
  margin-top: 100px;
  padding-top: 30px;
  margin-bottom: 100px;
}

h1 span {
  font-size: 0.7em;
  color: #7E9C56;
  display: block;
}

#blogpage .share img {
  height: 2.6em;
  width: 2.6em;
}

.inlinecta {
  background: rgb(212, 46, 145);
  background: linear-gradient(63deg, rgb(212, 46, 145) 0%, rgb(106, 23, 73) 100%);
  padding: 30px 10vw;
  margin-left: -20vw;
  margin-right: -20vw;
}

.inlinecta .ctacontainer {
  margin: 0 auto;
  max-width: 900px;
  display: flex;
  flex-direction: column;
  background-color: #D42E91;
  padding: 30px;
  align-items: center;
  color: #fff;
}

.inlinecta .ctacontainer h2 {
  color: #fff;
}

#blogpageheader {
  background-color: #707070;
  position: relative;
  margin-bottom: 60px;
  padding: 0;
}

#blogpageheader .supportingimage {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  overflow: hidden;
}

#blogpageheader .avatarcontain {
  margin-top: 40px;
  color: #fff;
  display: flex;
  gap: 20px;
  align-items: center;
}

#blogpageheader .avatarcontain img {
  border-radius: 100%;
}

#blogpageheader .supportingimage:after {
  content: "";
  height: 100%;
  width: 60vw;
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  background: rgb(0, 0, 0);
  background: linear-gradient(265deg, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 100%);
  opacity: 0.7;
}

#blogpageheader .supportingimage img {
  object-fit: cover;
  height: 100%;
  width: 100%;
}

#blogpageheader .container {
  min-height: 590px;
  height: 60vh;
  display: flex;
  align-items: center;
  max-width: initial;
  position: relative;
  z-index: 3;
  margin: 0 8vw;
}

#blogpageheader h1 {
  color: #fff;
}

.textcontent {
  max-width: 650px;
}

#blogpage article > p, #blogpage article > h2, #blogpage article > h3, #blogpage article > h4, #blogpage article > ul {
  max-width: 80em;
  margin: 0 auto;
  display: block;
}

#blogpage article {
  margin: 0 auto;
  position: relative;
  max-width: 50em;
}

#blogpage article > p:first-of-type {
  font-size: 1.2em;
  font-weight: bold;
  line-height: 1.4em;
  margin-bottom: 1.2em;
  border-left: 4px solid #2E1C45;
  padding-left: 20px;
  margin-left: -20px;
  padding-top: 20px;
  padding-bottom: 20px;
}

#blogpage article > p:last-of-type {
  padding-bottom: 30px;
}

#blogpage article > p {
  padding-bottom: 1.4em;
}

#blogpage article blockquote {
  font-size: 1.2em;
  font-weight: bold;
  line-height: 1.2em;
  border-left: 3px solid #e70094;
  padding-left: 20px;
  margin-left: -20px;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #e70094;
  font-size: 2.4rem;
}

#blogpage article blockquote p:last-of-type {
  margin-bottom: 0;
}

#blogpage article h3 {
  color: #707070;
  padding-bottom: 0.5em;
  font-size: 1.6rem;
  padding-top: 2.2em;
}

#blogpage article h2 {
  padding-bottom: 0.5em;
  font-size: 1.6rem;
  padding-top: 1em;
}

article .blockrepeater {
  display: flex;
  margin-left: -20vw;
  margin-right: -20vw;
}

article .blockrepeater.alright {
  flex-direction: row-reverse;
}

article .blockrepeater > div {
  flex: 1;
}

article .blockrepeater .contactcontain {
  display: flex;
  align-items: center;
}

article .blockrepeater .contactcontain .containerpad {
  padding: 80px 15vw 80px 5vw;
}

article .blockrepeater.alright .containerpad {
  padding: 80px 5vw 80px 15vw;
}

article .blockrepeater .imgcontainer {
  display: flex;
  min-height: 40vw;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

article .blockrepeater .imgcontainer img {
  object-fit: cover;
  height: 100%;
  width: 100%;
}

#newsSection {
  padding: 60px 10vw;
  background: rgb(212, 46, 145);
  background: linear-gradient(63deg, rgb(212, 46, 145) 0%, rgb(106, 23, 73) 100%);
}

#newsSection ul {
  display: flex;
  gap: 2em;
}

#newsSection ul {
  padding: 0;
}

#newsSection ul li a {
  color: #fff;
  font-weight: bold;
  font-size: 1.2em;
  margin-top: 20px;
}

#newsSection ul h4 {
  color: #fff;
  font-size: 1.2em;
}

#newsSection ul p {
  color: #fff;
  line-height: 1.4em;
}

#newsSection ul li {
  display: flex;
  flex-direction: column;
}

#newsSection ul .imgcontainer {
  height: 16em;
  overflow: hidden;
  width: 100%;
  margin-bottom: 2em;
}

#newsSection ul .imgcontainer img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: center;
}

#newsSection h2 {
  color: #fff;
  font-size: 1.8em;
  padding-bottom: 20px;
}

ul#header-main-menu a {
  font-size: 16px;
  font-weight: 500;
  line-height: 26px;
  white-space: nowrap;
}

ul#header-main-menu li {
  margin-left: 2em;
}

#blogpage .size-full img {
  width: 100% !important;
}

#blogpage .alignleft.size-full {
  width: 50% !important;
}

@media only screen and (max-width: 1024px) {
  #blogpage article {
    margin: 0 5vw;
    position: relative;
  }
  article .blockrepeater {
    display: flex;
    margin-left: -5vw;
    margin-right: -5vw;
  }
  article .blockrepeater .containerpad {
    padding: 80px 5vw 80px 5vw;
  }
  article .blockrepeater.alright .containerpad {
    padding: 80px 5vw 80px 5vw;
  }
  .single #page {
    overflow: hidden;
  }
}
@media only screen and (max-width: 768px) {
  #blogpage article .blockrepeater {
    display: flex;
    margin-left: -5vw;
    margin-right: -5vw;
    flex-direction: column;
  }
  #newsSection ul {
    display: flex;
    gap: 2em;
    flex-direction: column;
  }
  .textcontent {
    max-width: 650px;
    padding-right: 20%;
  }
  #blogpageheader .supportingimage:after {
    content: "";
    height: 100%;
    width: 100vw;
    opacity: 0.8;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    background: rgb(0, 0, 0);
    background: linear-gradient(265deg, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 100%);
  }
  article .blockrepeater .contactcontain .containerpad {
    padding: 0 5vw 0 5vw !important;
  }
  .blockrepeater.pbottom {
    margin-bottom: 0;
  }
  .blockrepeater.ptop {
    margin-top: 0;
  }
  article .blockrepeater .imgcontainer {
    display: flex;
    min-height: 40vw;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin: 2em 0;
  }
  .inlinecta {
    background: rgb(212, 46, 145);
    background: linear-gradient(63deg, rgb(212, 46, 145) 0%, rgb(106, 23, 73) 100%);
    padding: 30px 5vw;
    margin-left: -5vw;
    margin-right: -5vw;
  }
}
@media only screen and (max-width: 920px) {
  .flex {
    flex-direction: column;
  }
  #content-repeater .row:nth-of-type(even) {
    flex-direction: column;
  }
  #newsfeed.reduced ul {
    display: flex;
    gap: 1em;
    flex-wrap: wrap;
    flex-direction: column;
  }
  #newsfeed.reduced .newshead, #newsfeed.full .newshead {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
  }
  #newsfeed.reduced .newshead .bttncontain, #newsfeed.full .newshead .bttncontain {
    display: flex;
    justify-content: flex-start;
    gap: 1em;
    padding-bottom: 3em;
  }
  footer {
    background-color: #D7DEE9;
    padding: 0 2em 4em;
  }
  #mainheader .img1, #mainheader .img2, #mainheader .img3 {
    clip-path: none;
    position: initial;
    height: auto;
    flex: 1;
    position: relative !important;
    left: 0 !important;
    height: 23em !important;
  }
  #mainheader .images {
    position: relative;
    display: none !important;
    flex: auto;
    height: 10em;
  }
  #mainheader .heropage p {
    color: #fff;
    margin-right: 0;
    font-size: 1.4em;
    padding-top: 0;
  }
  #team ul li {
    margin-bottom: 2em;
    width: 43%;
  }
  #team .headshot {
    margin-bottom: 2em;
    width: 30vw;
    height: 30vw;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 100%;
  }
  #team.teampage .headshot img {
    width: 100%;
    height: auto;
    object-position: center;
  }
  .heropage {
    flex-direction: column-reverse !important;
  }
  header .container {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    max-width: 100%;
    padding: 0;
    position: relative;
    flex-direction: row;
    padding: 3em 0;
  }
  #enquiry-form .teamcard {
    margin-bottom: 3em;
    gap: 1em;
    align-items: initial;
  }
  #newsfeed.full ul {
    display: flex;
    gap: 1em;
    flex-wrap: wrap;
    flex-direction: column;
  }
  #newsfeed.full ul li:first-of-type a {
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  #newsfeed.full ul li:first-of-type .newstop {
    width: 100%;
    height: 20em;
  }
  .wp-block-image .alignleft {
    float: initial;
    margin: 0 0 2em;
    width: 100%;
  }
  .wp-block-image img {
    box-sizing: border-box;
    height: auto;
    max-width: 100%;
    vertical-align: bottom;
    width: 100% !important;
  }
  #blogpageheader .container {
    flex-direction: row;
  }
  #archivefeed li {
    width: 100%;
  }
  #product-header .row {
    gap: 0;
    flex-direction: column-reverse;
  }
  #product-header .row .imagearea {
    height: 16em;
  }
  #product-header .row #services ul.flex li {
    width: 100%;
  }
  #services ul.flex li {
    width: 100%;
  }
  #locations ul {
    display: flex;
    flex-direction: column;
    border: none;
  }
  #locations ul li {
    padding: 0 2em 2em 2em;
    border: none;
    flex: 1;
  }
  #team.teampage ul li {
    margin-bottom: 2em;
    width: 38%;
  }
  #download.cta .ctaimage {
    position: relative;
    background-color: transparent;
    top: -1em;
    bottom: -4em;
    left: 2vw;
    min-width: 16em;
    display: flex;
    max-width: 14em;
    align-items: center;
  }
  #download.cta .ctainner.ctaimageshow {
    padding: 2em 4em 3em 3em;
    align-items: left;
  }
  #mainheader .images {
    display: none !important;
  }
  #mainheader .headcontent .bttncontain .bttn {
    color: #fff;
    min-width: 90%;
    width: 100%;
    float: left;
    clear: left;
    max-width: 97%;
    text-align: center;
    height: auto;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}
@media screen and (max-width: 1400px) {
  html {
    zoom: 1;
  }
}