/*
Theme Name: the Concept Stadium
Theme URI:
Author: the Concpet Stadium
Author URI: https://conceptstadium.com/
Description: the Concept Stadium website theme
Version: 1.0.2
License:
License URI:
Text Domain: theconceptstadium
Tags:
*/

:root {
    --amaranth: #f02851;
    --light-blue: #00dce1;
    --navy-blue: #011e3c;
    --aquamarine: #04d7a0;
    --yellow: #ffd100;
}

html,
*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    font-size: 17px;
    margin: 0;
    margin-left: auto;
    margin-right: auto;
    overflow-x: hidden;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    position: relative;
}

h2,
h3,
h4 {
    margin: 0;
    font-weight: normal;
}

ul {
    padding-left: 20px;
}

ul li {
    font-size: 17px;
}

ul li span {
    font-size: 15px;
}

h3.subtitle {
    margin-top: 0px;
}

.load-gif {
    max-width: 20px;
}

input:focus,
textarea:focus {
    outline: none;
    background-color: #e5fbf5;
    transition: 0.3s all ease-in-out;
}

select {
    color: #bdc6cd;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
}

select,
input {
    width: 100%;
    background-color: #e4e8eb;
    padding: 8px 15px;
    border: none;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #011e3c;
    font-size: 17px;
    line-height: 18px;
}

.inputlabel {
    position: relative;
    box-sizing: border-box;
    display: block;
    margin-bottom: 35px;
    background-color: #e4e8eb;
    padding: 8px 15px;
    color: #bdc6cd;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    overflow: hidden;
    line-height: 18px;
    height: 32px;
}

label[for="join-the-team-resume"],
label[for="join-the-team-portfolio"] {
    padding-top: 0;
}

.inputspan {
    width: 100%;
    text-overflow: ellipsis;
}

.inputlabel.active {
    background-color: #e5fbf5;
}

.inputfile {
    opacity: 0;
    width: 0.1px;
    height: 0.1px;
    overflow: hidden;
    pointer-events: none;
}

.join-the-team-form button {
    cursor: pointer;
}

input:not(:last-of-type):not(.newsletter-input) {
    margin-bottom: 35px;
}

input::placeholder,
textarea::placeholder {
    color: #bdc6cd;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
}

textarea {
    height: 100%;
    width: 100%;
    background-color: #e4e8eb;
    border: none;
    resize: none;
    padding: 10px 15px;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #011e3c;
    font-size: inherit;
}

[data-enllax-ratio] {
    transition: 0.5s all ease;
}

.notransition {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
}

a {
    color: #04d7a0;
    text-decoration: underline;
}

.button {
    padding: 5px 15px;
    border: 1px solid transparent;
    color: #011e3c;
    text-decoration: none;
    text-transform: uppercase;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 500;
    font-size: 15px;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}

button[type="submit"]:focus {
    outline: 0;
}

.button.white {
    background-color: #fff;
    border-color: #fff;
}

.button.black {
    background-color: #000;
    border-color: #000;
    color: #fff;
}

.button.amaranth {
    background-color: #f02851;
    border-color: #f02851;
    color: #011e3c;
}

.button.light-blue {
    background-color: #00dce1;
    border-color: #00dce1;
}

.button.navy-blue {
    background-color: #011e3c;
    border-color: #011e3c;
    color: #04d7a0;
}

.button.navy-blue.secondary {
    color: #f02851;
}

.button.aquamarine {
    background-color: #04d7a0;
    border-color: #04d7a0;
}

.button.yellow {
    background-color: #ffd100;
    border-color: #ffd100;
    color: #011e3c;
}

.button:hover {
    filter: contrast(150%);
}

.wrapper-small {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.wrapper {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.wrapper-wide {
    max-width: 1140px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.wrapper-super-wide {
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.slanted {
    position: relative;
}

.slanted + section {
    padding-top: 70px;
}

.slanted:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 71px;
    bottom: -70px;
    z-index: 1;
}

.slanted.slanted-slider:after {
    -webkit-clip-path: polygon(0 0, 0% 100%, 100% 100%);
    clip-path: polygon(0 0, 0% 100%, 100% 100%);
    bottom: -1px !important;
}

.slanted.slanted-right:after {
    -webkit-clip-path: polygon(100% 0, 0 0, 100% 100%);
    clip-path: polygon(100% 0, 0 0, 100% 100%);
}

.slanted.slanted-left:after {
    -webkit-clip-path: polygon(100% 0, 0 0, 0 100%);
    clip-path: polygon(100% 0, 0 0, 0 100%);
}

.slanted.slanted-amaranth:after {
    background-color: #f02851;
}

.slanted.slanted-light-blue:after {
    background-color: #00dce1;
}

.slanted.slanted-light-aquamarine:after {
    background-color: #e6fbf6;
}

.slanted.slanted-navy-blue:after {
    background-color: #011e3c;
}

.slanted.slanted-white:after {
    background-color: white;
}

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

.bg-image.parallax {
    background-attachment: fixed;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .bg-image.parallax {
        background-attachment: scroll;
    }
}

.bg-image.slanted {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 90%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 90%);
}

.bg-image.slanted.slanted-right {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 90%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 90%);
}

.bg-image.slanted.slanted-left {
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);
}

.bg-image.slanted:after {
    display: none;
}

.site-content section:first-child.bg-image.slanted {
    padding-bottom: 70px;
}

header {
    width: 100%;
    position: fixed;
    background: none;
    z-index: 999;
}

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

.img-1024 img {
    max-width: 1024px;
}

.container {
    padding-top: 60px;
    padding-bottom: 60px;
}

h2 {
    font-size: 60px;
    font-weight: bold;
    color: #04d7a0;
    font-family: "kepler-std",serif;
    font-weight: 700;
    line-height: 60px;
}

h2.title {
    max-width: 660px;
}

h2.title.small {
    font-size: 40px;
    line-height: 1;
    margin-bottom: 10px;
}

h2.smaller {
    margin-bottom: 32px;
    font-size: 40px;
    line-height: 1;
}

h3 {
    margin-top: 30px;
    font-size: 30px;
    color: #011e3c;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
}

h3.secondary {
    font-family: "kepler-std",serif;
    font-weight: 700;
}

h4 {
    font-size: 25px;
    font-weight: bold;
    color: #04d7a0;
    font-family: "kepler-std",serif;
    font-weight: 700;
}

.bg-white {
    background-color: #fff;
}

.bg-black {
    background-color: #000;
}

.bg-amaranth {
    background-color: #f02851;
}

.bg-light-blue {
    background-color: #00dce1;
}

.bg-navy-blue {
    background-color: #011e3c;
}

.bg-aquamarine {
    background-color: #04d7a0;
}

.bg-light-aquamarine {
    background-color: #e6fbf6;
}

.bg-yellow {
    background-color: #ffd100;
}

.text-white {
    color: #fff;
}

.text-black {
    color: #000;
}

.text-amaranth {
    color: #f02851;
}

.text-light-blue {
    color: #00dce1;
}

.text-navy-blue {
    color: #011e3c;
}

.text-aquamarine {
    color: #04d7a0;
}

.text-yellow {
    color: #ffd100;
}

.overlay {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.6;
}

.overlay.dark {
    background-color: rgba(0, 0, 0, 0.6);
}

.overlay.light {
    background-color: rgba(255, 255, 255, 1);
}

.overlay.amaranth {
    background-color: #f02851;
}

.overlay.light-blue {
    background-color: #00dce1;
}

.overlay.navy-blue {
    background-color: #011e3c;
}

.overlay.aquamarine {
    background-color: #04d7a0;
}

.overlay.yellow {
    background-color: #ffd100;
}

section:not(.slider) .overlay {
    z-index: -1;
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.agreement {
    line-height: 20px;
    display: flex;
}

.agreement > * {
    display: inline-block;
}

.agreement-checkbox {
    display: inline-block;
    position: relative;
    width: 0px;
    opacity: 0;
}

.cf-submit-wrapper {
    display: flex;
    justify-content: flex-end;
    margin-top: 30px;
}

.cf-submit-wrapper .button {
    width: auto!important;
}   

#join-the-team-form [type="checkbox"]:not(:checked) + label::before,
#join-the-team-form [type="checkbox"]:checked + label::before,
#contact-page-contact [type="checkbox"]:not(:checked) + label::before,
#contact-page-contact [type="checkbox"]:checked + label::before,
.site-footer [type="checkbox"]:not(:checked) + label::before,
.site-footer [type="checkbox"]:checked + label::before {
    background: white none repeat scroll 0 0;
    border: 1px solid #aaa;
    content: "";
    height: 32px;
    left: -38px;
    position: absolute;
    top: 0;
    width: 32px;
}

#join-the-team-form [type="checkbox"]:not(:checked) + label::after,
#contact-page-contact [type="checkbox"]:not(:checked) + label::after,
.site-footer [type="checkbox"]:not(:checked) + label::after {
    opacity: 0;
    transform: scale(0);
}

#join-the-team-form [type="checkbox"]:not(:checked) + label::after,
#join-the-team-form [type="checkbox"]:checked + label::after,
#contact-page-contact [type="checkbox"]:not(:checked) + label::after,
#contact-page-contact [type="checkbox"]:checked + label::after,
.site-footer [type="checkbox"]:not(:checked) + label::after,
.site-footer [type="checkbox"]:checked + label::after {
    color: #04d7a0;
    content: "✔";
    font-size: 32px;
    line-height: 0.8;
    position: absolute;
    top: 4px;
    left: -35px;
    transition: all 0.2s ease 0s;
}

#join-the-team-form [type="checkbox"]:not(:checked) + label,
#join-the-team-form [type="checkbox"]:checked + label,
#contact-page-contact [type="checkbox"]:not(:checked) + label,
#contact-page-contact [type="checkbox"]:checked + label,
.site-footer [type="checkbox"]:not(:checked) + label,
.site-footer [type="checkbox"]:checked + label {
    margin-left: 32px;
    cursor: pointer;
    position: relative;
}

/* Projects Section start */

.projects-container {
    display: flex;
}

.projects-container > * {
    width: 100%;
}

.projects-container a {
    position: relative;
    height: 450px;
}

.projects-container a > * {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
}

.projects-container .news-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Prjects section end */

/* HEADER START */

header {
    width: 100%;
    position: fixed;
    background: none;
    z-index: 999;
    transition: all 0.3s ease-in-out;
}

header.sticky {
    background-color: #fff;
    -webkit-box-shadow: 0px 0px 38px -8px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 0px 38px -8px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 38px -8px rgba(0, 0, 0, 0.25);
}

header.sticky:not(.scrolled) {
    background-color: transparent;
}

.header-container {
    display: flex;
    justify-content: space-between;
    transition: 0.3s all ease-in-out;
}

.header-container .menu-container {
    text-align: right;
}

.header-container .menu-wrap a {
    position: relative;
    display: inline-block;
}

ul.menu,
ul.sub-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.header-container .menu-wrap li {
    transition: all 0.3s ease-in-out;
}

.header-container .menu-wrap a {
    text-decoration: none;
    color: #011e3c;
    text-transform: uppercase;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    font-size: 18px;
    transition: all 0.3s ease-in-out;
    align-self: flex-end;
}

header.light:not(.sticky) .header-container .menu-wrap ul.menu > li > a {
    color: #fff;
}

header.sticky.menu-open .header-container .menu-wrap {
    margin-top: 0;
}

.main-navigation ul.menu li a:after {
    content: "" !important;
    position: absolute;
    border-bottom: 1px solid #04d7a0;
    width: 100%;
    bottom: -2px;
    left: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: -webkit-transform 0.3s ease;
    transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

.main-navigation ul.menu li.menu-item-has-children li a:after {
    bottom: 0;
}

.main-navigation ul.menu li:hover > a:after {
    webkit-transform: scaleX(1);
    transform: scaleX(1);
}

ul.menu ul.sub-menu {
    display: none;
    position: absolute;
    margin-top: 20px;
    background-color: #fff;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

ul.menu ul.sub-menu:before {
    content: "";
    position: absolute;
    width: 100%;
    padding-top: 20px;
    top: -20px;
    right: 0;
}

ul.menu li ul.sub-menu a {
    color: #011e3c;
    padding: 12px 16px;
    width: 100%;
}

/** MENU ICON **/
/* Closed */
.menu-icon {
    margin-left: 5px;
    display: inline-block;
    width: 25px;
    height: 25px;
    cursor: pointer;
}

.menu-icon .patty {
    position: relative;
    top: -1px;
    margin: 10px 0;
    display: inline-block;
    background: none repeat scroll 0 0 #011e3c;
    border-radius: 5px;
    transition: all 0.3s ease-in-out;
    z-index: 1;
}

.menu-icon .patty,
.menu-icon .patty:after,
.menu-icon .patty:before {
    width: 25px;
    height: 3px;
}

.menu-icon .patty:after,
.menu-icon .patty:before {
    content: "";
    position: absolute;
    display: inline-block;
    background: none repeat scroll 0 0 #011e3c;
    border-radius: 5px;
    height: 3px;
    right: 0;
    transition: all 0.3s ease-in-out;
    z-index: 1;
}

.menu-icon .patty:before {
    top: -7px;
}

.menu-icon .patty:after {
    top: 7px;
}

.menu-icon:hover .patty:before {
    top: -5px;
}

.menu-icon:hover .patty:after {
    top: 5px;
}

header.light:not(.sticky):not(.menu-open) .menu-icon .patty,
header.light:not(.sticky) .menu-icon .patty:after,
header.light:not(.sticky) .menu-icon .patty:before {
    background-color: #fff;
}

/* Open */
header.menu-open .menu-icon .patty {
    background: none;
}

header.menu-open .menu-icon .patty:before,
header.menu-open .menu-icon .patty:after {
    background-color: #011e3c;
    top: 0;
}

header.menu-open .menu-icon .patty:before {
    transform: rotate(-45deg);
}

header.menu-open .menu-icon .patty:after {
    transform: rotate(45deg);
}

header.menu-open .menu-icon:hover .patty:before,
header.menu-open .menu-icon:hover .patty:after {
    opacity: 0.8;
}

svg {
    width: 100%;
}

header {
    padding: 30px 0;
}

header.sticky:not(.menu-open) {
    padding: 15px 0;
}

.header-logo svg {
    max-width: 150px;
    max-height: 130px;
    transition: 0.3s all ease-in-out;
}

header .header-logo svg path {
    fill: #011e3c;
    transition: 0.3s all ease-in-out;
}

header:not(.sticky) .header-logo:hover svg path {
    fill: #fff;
}

header.light:not(.sticky) .header-logo svg path {
    fill: #fff;
}

header.light:not(.sticky) .header-logo:hover svg path {
    fill: #04d7a0;
}

header.sticky:not(.menu-open) .header-logo svg {
    max-width: 100px;
    max-height: 77px;
}

header .main-navigation {
    margin-top: 8px;
    transition: all 0.3s ease-in-out;
}

/* HEADER END */

/* Social Icons */
.social-icons {
    font-size: 0;
}

.social-icon:not(:first-child) {
    margin-left: 5px;
}

.social-icons svg {
    max-width: 26px;
    max-height: 26px;
}

header .social-icons {
    display: inline;
}

header .social-icons svg {
    fill: #011e3c;
    max-width: 20px;
    max-height: 20px;
}

header:not(.sticky) .social-icon:hover svg,
header.menu-open .social-icon:hover svg {
    fill: #fff !important;
}

header.light:not(.sticky) .social-icons svg {
    fill: #fff;
}

header.light:not(.sticky) .social-icon:hover svg {
    fill: #04d7a0 !important;
}

footer .social-icons {
    display: none;
}

.social-icon svg path,
.social-icon svg polygon {
    transition: all 0.3s ease-in-out;
}

.social-icon:hover svg {
    fill: #04d7a0;
}

/* Social Icons end */

/* WELCOME SECTION START */

#welcome {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.welcome-before-title {
    display: block;
    color: #011e3c;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    font-size: 48px;
    margin-bottom: 15px;
}

.overlay.dark + .content .welcome-before-title {
    color: #04d7a0;
}

.slider .content.slider-content-wrapper {
    padding-left: 10px;
    padding-right: 10px;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.welcome-title {
    display: block;
    color: white;
    font-family: "kepler-std",serif;
    font-weight: 700;
    font-size: 95px;
    line-height: 90px;
    margin-bottom: 20px;
}

.slide.slide_single .welcome-title {
    word-spacing: 100vw;
}

.slide.slide_single.home-page-permanent .welcome-title {
    word-spacing: normal;
    max-width: 1000px;
}

.slider .slide-background {
    max-height: 100%;
}

.slider .content {
    /* position: static; */
}

.flexslider .flex-control-nav.hidden,
.site-header.hidden,
.flex-nav-prev.hidden,
.flex-nav-next.hidden {
    opacity: 0;
    pointer-events: none;
}

.video-modal {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    opacity: 0;
    background-color: black;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    transition: 0.5s opacity ease-in-out;
    z-index: 9999999999999999999999999999999;
    padding: 50px 100px 100px 100px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 100%;
}

.video-modal.active {
    opacity: 1;
    pointer-events: all;
}

.video-modal iframe {
    width: 100%;
    height: 100%;
}

.close-modal {
    display: block;
    width: 30px;
    height: 30px;
    top: 50px;
    right: 50px;
    z-index: 999;
    position: absolute;
    margin-bottom: 10px;
}

span.close-modal:after,
span.close-modal:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 5px;
    background-color: white;
    left: 0;
    top: 12px;
}

span.close-modal:before {
    transform: rotate(315deg);
}

span.close-modal:after {
    transform: rotate(45deg);
}

/* WELCOME SECTION END */

/* PR SECTION START */

.bg-with-slanted-div {
    position: relative;
    margin-bottom: 10%;
}

.bg-with-slanted-div-container {
    position: absolute;
    width: 100vw;
    top: 13%;
    right: 0;
    bottom: -12%;
    left: 10%;
    z-index: -1;
}

.slanted-bg {
    width: 100%;
    height: 100%;
    background-color: #00dce1;
}

#pr > .flex-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position: relative;
    height: 100%;
}

#pr > .flex-container > .project {
    width: 45%;
}

#pr .project {
    padding-top: 45%;
    position: relative;
}

#pr .flex-container > .project:nth-of-type(2) {
    transform: translateY(20%);
}

#pr .news-image-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

#pr .news-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#pr .button {
    color: #ffd100;
}

.pr-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #011e3c;
    opacity: 0.5;
    transition: all 0.3s ease-in-out;
}

.project:hover .pr-overlay {
    opacity: 0.2;
}

.pr-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 7%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    transition: all 0.3s ease-in-out;
    align-items: flex-start;
}

.project:hover .pr-content {
    padding-bottom: 10%;
}

.pr-content .pr-title {
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    color: white;
    font-size: 40px;
    line-height: 40px;
    margin-bottom: 15px;
}

.pr-content .pr-job {
    font-family: "kepler-std",serif;
    font-weight: 700;
    color: white;
    font-size: 22px;
}

.pr-cta {
    display: inline-block;
    margin-top: 25px;
}

.pr-content .share-icon {
    max-width: 35px;
    margin-top: 25px;
    fill: #011e3c;
}

#pr .button {
    position: absolute;
    bottom: -20%;
    left: 22%;
}

/* PR SECTION END */

/* WHAT WE DO SECTION START */

.what-we-do {
    padding-top: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding-bottom: 40px;
}

.what-we-do-element {
    flex-shrink: 0;
    height: 150px;
    width: 33%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    text-decoration: none;
    margin-bottom: 40px;
    /*text-align: center;*/
}

#what-we-do .what-we-do-element .what-we-do-name {
    width: 300px;
    margin: auto 0;
    margin-top: 15px;
}

.what-we-do-icon {
    width: 80px;
    height: 80px;
    /*margin: auto;*/
}

.what-we-do-icon path {
    stroke: #04d7a0;
}

.what-we-do-name {
    text-transform: uppercase;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    font-size: 22px;
    color: #011e3c;
}

.what-we-do-element svg path,
.capability svg path,
.service-icon svg path,
.discipline svg path {
    stroke-dasharray: 320;
    stroke-dashoffset: 0;
}

.what-we-do-element:hover svg path,
.capability:hover svg path,
.service-icon svg path,
.discipline:hover svg path {
    animation: dash 2s linear forwards;
}

@keyframes dash {
    from {
        stroke-dashoffset: 320;
    }

    to {
        stroke-dashoffset: 0;
    }
}

/* WHAT WE DO SECTION END */

/* PLAYER SECTION START */

#player {
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    #player {
        background-attachment: scroll;
    }
}

#player .wrapper {
    z-index: 1;
    position: relative;
}

.player-color-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0.25;
    z-index: 0;
}

.circled {
    position: relative;
    -webkit-clip-path: ellipse(125% 100% at 50% 100%);
    clip-path: ellipse(125% 100% at 50% 100%);
}

.circled-inverted {
    position: relative;
    -webkit-clip-path: ellipse(125% 100% at 50% 0%);
    clip-path: ellipse(125% 100% at 50% 0%);
}

.circled-bottom + .circled {
    transform: translateY(-160px);
    margin-bottom: -100px;
    padding-top: 100px;
}

.player-title {
    color: #ffd100;
    font-size: 30px;
    line-height: 30px;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    display: block;
    margin-bottom: 0px;
    font-weight: normal;
}

.player-title::first-letter {
    text-transform: capitalize;
}

.player-subtitle {
    color: white;
    font-size: 60px;
    line-height: 60px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    margin-top: 0px;
}

.player-container {
    padding-top: 170px;
    padding-bottom: 170px;
    max-width: 450px;
}

.player-container .read-more {
    font-size: 16px;
    line-height: 16px;
    display: block;
    color: #ffd100;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    text-decoration: underline;
    margin-top: 10px;
}

#player .button {
    display: inline-block;
}

/* PLAYER SECTION END */

/* PORTFOLIO SECTION START */

#portfolio .title {
    padding-top: 130px;
}

#portfolio .subtitle {
    margin-top: 0;
}

.portfolio-container {
    display: flex;
    padding-bottom: 150px;
    padding-top: 0px;
}

.portfolio-container > div {
    width: 50%;
}

.portfolio-container > div:first-of-type {
    padding-right: 15px;
}

.portfolio-container > div:nth-of-type(2) {
    padding-left: 15px;
}

.testimonial {
    display: inline-block;
    margin-top: 50px;
    margin-bottom: 35px;
}

.testimonial-author {
    font-family: "kepler-std",serif;
    font-weight: 700;
    color: #04d7a0;
    display: block;
}

.testimonial-company {
    color: #04d7a0;
    font-size: 24px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    display: block;
}

.dotted-line {
    padding-left: 15px;
    background-image: linear-gradient(#b5b5b5 33%, rgba(255, 255, 255, 0) 0%);
    background-position: left;
    background-size: 1px 4px;
    background-repeat: repeat-y;
}

.dotted-line.line-right {
    background-position: right;
    padding-right: 25px !important;
}

.dotted-line:after {
    clear: both;
}

.portfolio-slider {
    overflow: hidden;
    position: relative;
}

.portfolio-slider .logos-container {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    height: 260px;
    transition: 0.5s all ease-in-out;
}

.portfolio-slider .slider-navigation {
    position: absolute;
    left: 20px;
    top: calc(50% - 17px);
    right: 20px;
    display: flex;
    justify-content: space-between;
    opacity: 0;
    transition: 0.3s opacity ease;
    z-index: 2;
}

.portfolio-slider:hover .slider-navigation {
    opacity: 1;
}

.portfolio-slider .slider-navigation .arrow-left,
.portfolio-slider .slider-navigation .arrow-right {
    width: 32px;
    height: 32px;
    text-align: center;
    cursor: pointer;
}

.portfolio-slider .slider-navigation svg {
    width: 100%;
    height: auto;
    fill: #04d7a0;
    pointer-events: none;
}

.portfolio-slider .slider-item {
    height: 130px;
    width: 33.333%;
    flex-grow: 0;
    flex-shrink: 0;
    transition: 0.3s all ease-in-out;
    transform: translateX(0);
    cursor: pointer;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    filter: grayscale(100%);
}

.portfolio-slider .slider-item:hover {
    filter: grayscale(0%);
}

.portfolio-slider .slider-item.no-link {
    cursor: default;
}

.portfolio-slider img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* PORTFOLIO SECTION END */

/* NEWS SECTION START */

#news {
    background-color: #e4e8eb;
}

#news .news-text {
    color: black;
    font-size: 15px;
}

#news .news-text .link-more {
    display: none;
}

.news-container {
    padding: 0;
    display: flex;
}

.news-container > div {
    width: 50%;
}

.news-container > div:first-of-type {
    transform: translateY(-7%);
    position: relative;
    z-index: 1;
}

.news-container > div:first-of-type img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-container > div:nth-of-type(2) {
    padding: 6% 8%;
}

.news-container .title::first-letter {
    text-transform: capitalize;
}

.news-container .title {
    margin-bottom: 40px;
    font-size: 50px;
}

.button-container {
    margin-top: 50px;
    display: block;
}

.news-container .read-more {
    font-size: 16px;
    color: #04d7a0;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    text-decoration: underline;
}

.no-posts {
    cursor: default;
}

/* NEWS SECTION END */

/* VACANCY SECTION START */

#vacancy {
    padding-top: 50px;
    padding-bottom: 30px;
    background-color: #011e3c;
    position: relative;
    z-index: 2;
}

#vacancy.vacancy-join-the-team {
    background-color: white;
}

.vacancy-container {
    /* display: flex; */
}

.vacancy-container > div {
}

.vacancy-container > .right {
    margin-bottom: 50px;
}

.vacancy-container > .left {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin-bottom: 50px;
}

.vacancy-container > .left h2 {
    font-size: 40px;
}

.vacancy-container > .right h2 {
    color: #f02851;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    line-height: 1;
}

#vacancy.vacancy-join-the-team .vacancy-container > .right h2 {
    /* color: #011e3c; */
}

.vacancy-container h3 {
    color: white;
    font-family: "kepler-std",serif;
    font-weight: 700;
    font-size: 22px;
    margin-top: 25px;
}

.vacancy-container .button {
    display: inline-block;
    margin-top: 35px;
    align-self: flex-start;
}

/* VACANCY SECTION END */

/* INSTAGRAM SECTION START */

#instagram {
    margin-top: 0;
    margin-bottom: 100px;
    position: relative;
    z-index: 1;
    padding-top: 0px;
}

/* INSTAGRAM SECTION END */

/* CONTACT START */

#contact-page-contact .container {
    padding-top: 0;
}

.contact-container {
    padding-top: 100px;
    padding-bottom: 140px;
}

.contact-container .title {
    max-width: 100%;
}

.contact-container .subtitle {
    display: inline-block;
    margin-right: 10px;
    margin-top: 15px;
}

.contact-container h4 {
    display: inline-block;
    font-size: 16px;
    color: black;
    font-weight: normal;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
}

.contact-container .title::first-letter {
    text-transform: capitalize;
}

.contact-form-columns {
    display: flex;
    padding-top: 30px;
    margin: -10px;
}

.contact-form .contact-form-columns > div {
    width: 50%;
    padding: 0 10px;
}

.contact-form .input-container {
    width: 100%;
}

.contact-form .button-container {
    text-align: center;
    width: 100%;
}

.contact-form .button {
    background-color: #011e3c;
    color: #04d7a0;
}

.contact-form-response {
    display: none;
    margin-top: 5px;
}

.contact-form-response.success {
    color: #00cd00;
}

.contact-form-response.error {
    color: #ff3425;
}

/* CONTACT END */

/* ABOUT PAGE START */

#cta {
    padding: 70px 0;
}

#office {
    padding-top: 0;
}

/* ABOUT PAGE END */

/* ABOUT PAGE START */
/** Content **/
#about .container {
    padding-top: 200px;
    padding-bottom: 120px;
}

.grid-container {
    height: 100%;
    align-items: end;
    grid-row-gap: 80px;
    display: flex;
    flex-direction: row;
}

.grid-container > div {
    height: 100%;
    margin: 0 10px;
}

.grid-container > div:first-of-type {
    width: 60%;
    padding-right: 10px;
}

.grid-container > div:nth-of-type(2) {
    width: 40%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.grid-container > div:nth-of-type(2) a {
    text-decoration: none;
}

.grid-container .right {
    padding-left: 55px;
}

#about .grid-container .right {
    padding-left: 25px;
}

/** Content end **/

/** Team Start **/
#team {
    margin-top: -80px;
    padding-top: 70px;
}

#team .container {
    padding-top: 180px;
}

.team-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 32px -10px 0px -10px;
}

.team-grid > .player {
    width: 33%;
    padding: 0 10px 20px 10px;
}

.team-grid .player .image {
    position: relative;
    margin-bottom: 20px;
    width: 100%;
    height: 350px;
}

.team-grid .player .image img {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    -webkit-filter: contrast(2);
    filter: contrast(2);
    transition: all 0.3s ease-in-out;
    vertical-align: middle;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-grid .player .image:hover img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
    -webkit-filter: contrast(1);
    filter: contrast(1);
}

.team-grid .player .image .overlay {
    transition: all 0.3s ease-in-out;
    z-index: 0;
}

.team-grid .player .image:hover .overlay {
    opacity: 0;
}

.team-grid p {
    margin-top: 0;
}

.team-grid .social-icons img {
    width: 25px;
}

.team-grid .player .player-designation {
    margin-bottom: 0;
}

.team-grid .player .player-additional-text {
    margin: 0 0 5px 0;
    font-size: 0.85em;
    color: #000000;
}

.team-grid .player .social-icons {
    margin-top: 5px;
}

/** Team end **/

/* ABOUT PAGE END */

/* FOOTER START */

footer {
    background-color: #011e3c;
}

footer .trademark-info {
    display: block;
    margin-top: 20px;
}

footer .footer-container {
    padding: 30px 10px;
    color: white;
    display: flex;
    justify-content: space-between;
}

footer div:first-of-type {
    align-self: flex-end;
}

footer div:nth-of-type(2) {
    flex-shrink: 0;
}

footer .footer-icons {
    display: flex;
    justify-content: flex-end;
    gap: 20px;
    flex-wrap: wrap;
}

footer .footer-icons .footer-icon {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

footer .footer-icons .footer-icon img {
    height: 50px;
    width: auto;
    align-self: center;
    margin-bottom: 5px;
}

footer .footer-memebers-title {
    text-align: right;
    font-size: 12px;
    margin-top: 25px;
}

footer .footer-members {
    display: flex;
    justify-content: flex-end;
    gap: 20px;
}

footer .footer-members .footer-icon {
    display: flex;
    flex-direction: column;
}

footer .footer-members .footer-icon img {
    max-height: 30px;
    align-self: center;
}

footer .footer-agreement a {
    color: #04d7a0;
    text-decoration: underline;
    font-weight: bold;
}

footer .newsletter-title {
    margin-bottom: 15px;
    font-size: 28px;
    color: white;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    font-weight: normal;
}

footer .newsletter-form {
    width: 100%;
}

footer .newsletter-input-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 10px;
}

footer .newsletter-form > * {
    /* display: inline-block; */
    width: auto;
}

footer .newsletter-form .newsletter-input {
    /* flex: 1; */
    margin-right: 20px;
}

footer .button {
    background-color: #04d7a0;
    color: #011e3c;
    /* flex-shrink: 0; */
    width: auto;
    cursor: pointer;
}

footer .button[disabled] {
    background-color: #435060;
    cursor: not-allowed;
}

footer .button[disabled]:hover {
    filter: contrast(100%);
}

footer .agreement-container {
    display: none;
    padding-bottom: 5px;
}

footer .footer-agreement {
    display: flex;
}

footer .footer-left .site-info {
    text-transform: uppercase;
}

footer a {
    color: white;
    text-decoration: none;
}

footer .site-info {
    margin-top: 15px;
    font-size: 10px;
}

footer .site-info a {
    display: inline-block;
}

footer .site-info a:not(:first-of-type) {
    padding-left: 5px;
    border-left: 1px solid white;
    margin-left: 5px;
}

footer .footer-right {
    align-self: flex-end;
    font-size: 10px;
    text-align: right;
}

footer .contact-details {
    font-size: 12px;
    margin-top: 25px;
}

footer .agreement-checkbox {
    margin-top: 5px;
}

/* FOOTER END */

/* OVERRIDING STYLES START */

.full-width {
    width: 100%;
    max-width: 100%;
}

/* OVERRIDING STYLES END */

/* MAILCHIMP START */

#mailchimp-response.success {
    color: #00cd00;
}

#mailchimp-response.error {
    color: #ff3425;
}

#mailchimp-response a {
    text-decoration: underline;
}

/* MAILCHIMP END */

/* PLAYER PAGE START */

#player-page-welcome {
    width: 100%;
    height: 80vh;
    background-color: #e6fbf6;
    overflow: hidden;
    transition: background 0.7s ease-in-out;
}

#player-page-welcome .wrapper {
    height: 100%;
}

#player-page-welcome .player-photos {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    overflow: hidden;
    z-index: -1;
    display: none;
}

#player-page-welcome .player-photos img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: opacity 0.5s ease-in;
}

#player-page-welcome .player-photos img + img {
    opacity: 0;
}

#player-page-welcome .wrapper .player-profile {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.player-profile .player-name {
    padding-top: 170px;
}

.player-profile .player-name h2 {
    font-size: 80px;
}

.player-profile .player-caption {
    font-family: brandon-grotesque, sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    margin-top: 10px;
    font-size: 18px;
}

.player-profile .player-position {
    font-family: "kepler-std",serif;
    font-weight: 700;
    font-size: 18px;
}

.player-profile .player-social {
    margin-top: 20px;
}

.player-profile .player-social svg {
    max-width: 30px;
    fill: #011e3c;
}

#player-page-welcome .wrapper > img {
    margin-top: 15%;
    width: 50%;
    float: left;
}

#player-page-description .text-aquamarine {
    font-size: 36px;
    padding-bottom: 20px;
    line-height: 36px;
}

#player-page-description .container {
    padding-bottom: 40px;
}

#player-page-qa {
    padding-bottom: 100px;
}

#player-page-qa .qa-title {
    text-transform: uppercase;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    font-size: 26px;
    margin-bottom: 20px;
}

#player-page-qa .grid-container {
    align-items: flex-start;
}

#player-page-qa .grid-container div:nth-of-type(2) {
    padding: 0 30px;
}

.player-question {
    color: #04d7a0;
    font-family: "kepler-std",serif;
    font-weight: 700;
    display: block;
    font-size: 26px;
}

.player-question:not(:first-of-type) {
    margin-top: 30px;
}

.player-answer {
    display: block;
    max-width: 450px;
}

.player-qa {
    margin-bottom: 50px;
}

.join-the-team {
    padding: 0 15px;
}

#join-the-team-form .join-the-team {
    padding: 50px 10px;
}

#join-the-team-form.single-vacancy {
    background-color: white;
}

#join-the-team-form.single-vacancy .container {
    padding-top: 30px;
}

.join-the-team h2 {
    font-size: 36px;
    margin-bottom: 25px;
}

.join-the-team .button {
    width: 100%;
    box-sizing: border-box;
    display: block;
    text-align: center;
    margin-top: 35px;
}

.join-the-team-form {
    margin-bottom: 50px;
}

.join-the-team-form input[name="phone"] {
    margin-bottom: 35px;
}

#player-page-skills {
    background-color: #e6fbf6;
}

#player-page-skills .skills-container {
    display: flex;
    margin-top: 30px;
}

#player-page-skills .skills-container > * {
    width: 33%;
}

#player-page-skills h3,
#player-page-projects h3 {
    font-size: 40px;
    margin-top: 70px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    font-weight: bold;
}

.discipline a {
    text-decoration: none;
}

#player-page-skills .discipline-icon svg {
    width: 100%;
    max-width: 80px;
}

#player-page-skills .discipline-icon path {
    stroke: #04d7a0;
}

#player-page-projects {
    background-color: #e6fbf6;
}

#player-page-projects h3 {
    margin: 0 0 70px;
}

/* PLAYER PAGE END */

/* CONTACT PAGE START */

#contact-page-welcome {
    height: 80vh;
}

#contact-page-contact textarea {
    margin-top: 35px;
    height: 250px;
    margin-bottom: 20px;
}

#contact-page-contact .grid-container {
    margin: 0 0 30px 0;
}

#contact-page-contact .grid-container .button {
    text-align: center;
    width: 100%;
}

#contact-page-contact .wrapper .container > .grid-container {
    align-items: flex-start;
}

#contact-page-contact iframe {
    width: 100%;
    height: 350px;
}

#contact-page-contact .dotted-line {
    background-position: right;
    margin-right: 10px;
    padding-left: 0;
}

#open-positions {
    padding-bottom: 150px;
}

.vacancy-position {
    width: calc(50% - 15px);
    background-color: transparent;
    padding: 3% 4%;
    display: block;
    text-decoration: none;
    display: flex;
    border: 1px solid #04d7a0;
    transition: all 0.3s ease-in-out;
}

.vacancy-position:hover {
    background-color: #fff;
    border-color: var(--navy-blue);
}

.vacancy-position .title {
    padding-top: 5px;
    max-width: 100%;
    line-height: 1;
}

.vacancy-position-logo {
    max-width: 60px;
    margin-right: 25px;
    flex-shrink: 0;
}

.vacancy-position-logo svg {
    height: 60px;
}

.vacancy-position svg path {
    stroke: #04d7a0;
}

.vacancies-cta {
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
    margin-top: 30px;
}

/* CONTACT PAGE END */

/* JOURNAL PAGE START */

#journal-page-welcome {
    padding-top: 200px;
}

.news-share .share-icon {
    width: 25px;
    margin-right: 10px;
    fill: #011e3c;
}

.news-menu {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 30px;
    grid-row-gap: 10px;
    padding-bottom: 30px;
    border-bottom: 1px solid #d3d3d3;
    position: relative;
}

.news-menu .news-menu-item {
    text-transform: uppercase;
    padding: 5px 15px;
    text-align: center;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    background-color: white;
    color: #bebebe;
    cursor: pointer;
}

.news-menu .news-menu-item.active {
    background-color: #e4e8eb;
    color: #011e3c;
    cursor: default;
}

.journal-container {
    margin-top: 30px;
    display: grid;
    display: -ms-grid;
    grid-template-columns: repeat(4, 1fr);
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 30px;
    grid-row-gap: 30px;
}

.news-single .news-thumbnail {
    position: relative;
    padding-top: 100%;
    margin-bottom: 20px;
}

.news-single {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.news-single .news-thumbnail .news-thumbail-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.news-single .news-thumbnail .news-thumbail-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 1em auto;
}

.news-single .news-title {
    display: inline-block;
    margin: 10px 0;
    font-size: 24px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    text-decoration: none;
}

.news-single .read-more {
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    display: block;
    margin-top: 5px;
    margin-bottom: 15px;
}

.news-single .news-share {
    display: flex;
}

.news-single .news-share img {
    background-color: #011e3c;
    width: 25px;
    height: 25px;
    flex-shrink: 0;
    flex-grow: 0;
    margin-right: 15px;
}

.news-single .news-share .news-date {
    line-height: 25px;
}

.load-more-button-container {
    padding-top: 40px;
    text-align: center;
    min-width: 50%;
    padding-bottom: 100px;
}

.load-more-button-container .load-more {
    min-width: 50%;
    color: #04d7a0;
    display: inline-block;
    height: 34px;
    overflow: hidden;
}

/* JOURNAL PAGE END */

/* CLIENT PAGE START */

#client-page-welcome {
    height: 55vh;
}

#client-page-welcome.with-image {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

#client-page-welcome.with-image::after {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.3);
    content: "";
    z-index: -1;
}

#client-page-description .text-aquamarine {
    font-size: 32px;
    line-height: 1.2;
}

#client-page-description .text-aquamarine p {
    margin: 0;
}

#client-page-description .title {
    font-size: 40px;
    margin-bottom: 0px;
}

#client-page-description .container {
    padding-bottom: 25px;
}

#client-page-content {
    margin-top: 50px;
}

#client-page-content .company-logo {
    max-width: 300px;
    display: block;
}

#client-page-content .company-link {
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    display: block;
    margin-top: 30px;
}

#client-page-content .see-all {
    color: #04d7a0;
    display: block;
    width: 100%;
    margin-top: 100px;
    text-align: center;
}

#client-page-content .dotted-line {
    background-position: left;
}

#client-page-content .dotted-line p:first-of-type {
    margin-top: 0;
}

.client-page-testimonial .grid-container,
#client-page-content .grid-container {
    align-items: flex-start;
}

.grid-container > div {
    margin: 0;
}

.grid-container .title {
    font-size: 36px;
}

.what-they-say {
    font-size: 36px;
    line-height: 1.2;
    margin-bottom: 15px;
    text-transform: lowercase;
}

#client-page-content .clients-testimonial,
.client-page-testimonial .clients-testimonial {
    /* padding-left: 10px; */
}

#client-page-content .testimonial,
.client-page-testimonial .testimonial {
    margin-top: 20px;
}

#client-page-welcome .client-welcome-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}

#client-page-welcome .wrapper {
    height: 100%;
}

#client-page-welcome h1 {
    font-size: 60px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    margin: 0;
}

#client-page-welcome .industry {
    color: #04d7a0;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    display: inline-block;
    text-transform: uppercase;
    font-size: 18px;
    opacity: 0.5;
}

#client-page-welcome .industry-name {
    color: #04d7a0;
    opacity: 1;
}

.client-page-testimonial {
    padding: 100px 0;
}

/* CLIENT PAGE END */

/* SERVICE PAGE START */

#service-page-welcome {
    height: 80vh;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#service-page-welcome .overlay {
    z-index: -1;
}

#service-page-welcome .service-welcome-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}

#service-page-welcome .service-name-container {
    /*display: flex;
     flex-direction: row;*/
}

#service-page-welcome .service-welcome-container svg {
    height: 60px;
    width: 60px;
    /*margin-right: 20px;*/
}

#service-page-welcome .service-welcome-container svg path {
    stroke: #04d7a0;
}

#service-page-welcome .wrapper {
    height: 100%;
}

#service-page-welcome h1 {
    font-size: 60px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    margin: 0;
}

#service-page-description .text-aquamarine {
    font-size: 36px;
    line-height: 36px;
    margin-bottom: 15px;
}

#service-page-description .container {
    padding-bottom: 30px;
}

#service-page-content .grid-container {
    align-items: flex-start;
}

#service-page-content .grid-container div:nth-of-type(2) h2 {
    font-size: 36px;
    line-height: 36px;
    margin-bottom: 0px;
}

#service-page-content .grid-container textarea {
    margin-top: 35px;
    height: 250px;
}

#service-page-content .grid-container .button {
    display: inline-block;
    margin-top: 35px;
    width: 100%;
    text-align: center;
}

#service-page-content .contact-subtitle-small {
    margin-top: 5px;
    margin-bottom: 15px;
    display: block;
}

#service-page-content .subtitle {
    font-size: 24px;
    margin-top: 15px;
}

.subtitle-small {
    margin-top: 5px;
    margin-bottom: 35px;
    font-size: 16px;
    color: #011e3c;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    font-weight: normal;
}

#service-page-content .capabilities-text {
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    color: #011e3c;
    font-size: 30px;
    line-height: 30px;
    font-weight: normal;
    text-transform: uppercase;
    margin: 25px 0 20px 0;
}

#service-page-content .grid-container div:nth-of-type(1) .button {
    color: #04d7a0;
}

#service-page-content .grid-container > div:nth-of-type(1) {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

/* SERVICE PAGE END */

/* capabilities page start */

#capabilities-page-welcome {
    height: 80vh;
}

#capabilities-page-welcome.bg-image {
    position: relative;
}

#capabilities-page-welcome .overlay {
    z-index: 0;
}

#capabilities-page-welcome .wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    z-index: 1;
    position: relative;
}

#capabilities-page-welcome .wrapper h1 {
    font-size: 60px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    margin: 0;
}

#capabilities-page-list {
    margin-top: -80px;
    padding-top: 70px;
}

#capabilities-page-list .wrapper .container {
    padding-bottom: 70px;
    padding-top: 120px;
}

.capabilities-grid-container,
#capabilities-page-list .capabilities-grid-container {
    display: flex;
    flex-wrap: wrap;
}

.capabilities-grid-container > *,
#capabilities-page-list .capabilities-grid-container > * {
    width: 33%;
    margin-bottom: 80px;
}

.capability {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 15px;
}

.capability .capability-title {
    display: table;
}

.capability .capability-title a {
    text-decoration: none;
    display: table-cell;
    vertical-align: middle;
}

.capability .capability-title h2 {
    color: #011e3c;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 28px;
    display: block;
    margin-bottom: 15px;
    margin-top: 10px;
    line-height: normal;
}

.capability .read-more {
    /*     display: inline-block;*/
    margin-top: 20px;
    /*     border-color: #000;*/
    /*     flex-grow: 0;*/
    align-self: flex-start;
}

/*.capability .read-more:hover{
background-color: #000;
color: #fff;
}*/

#capabilities-page-more .wrapper-wide {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 100% 10vh;
}

#capabilities-page-more .wrapper-wide .container {
    padding: 150px 0 150px 0;
}

#capabilities-page-more .wrapper-wide .container h3 {
    font-family: "kepler-std",serif;
    font-weight: 700;
    font-size: 40px;
}

#capabilities-page-more .wrapper-wide .container .button {
    margin-top: 30px;
    display: inline-block;
}

/* capabilities page end */

/* case study page start */

#case-study-page-welcome .wrapper .container {
    padding-top: 250px;
    padding-bottom: 150px;
}

#case-study-page-welcome h1 {
    font-size: 64px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    margin: 0;
    line-height: 0.9;
    margin-bottom: 25px;
}

#case-study-page-welcome .subtitle {
    font-size: 24px;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    text-transform: uppercase;
}

#case-study-page-welcome .subtitle sup {
    text-transform: lowercase;
}

#case-study-page-welcome span {
    display: block;
    font-size: 14px;
}

#case-study-page-welcome .button {
    display: inline-block;
    margin-top: 15px;
}

#case-study-page-welcome .company {
    font-family: "kepler-std",serif;
    font-weight: 700;
    font-size: 20px;
    margin-bottom: 10px;
}

#case-study-page-welcome .industry {
    text-transform: uppercase;
    font-size: 12px;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 500;
    margin-bottom: 10px;
}

#case-study-page-welcome .description-big {
    font-size: 36px;
    margin-top: 70px;
    margin-bottom: 50px;
}

#case-study-page-welcome .grid-container {
    align-items: flex-start;
}

#case-study-page-welcome .casestudy-right a {
    text-decoration: none;
    display: inline-block;
}

#case-study-page-welcome .casestudy-right h3 {
    text-transform: uppercase;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    margin: 0;
    font-size: 22px;
}

#case-study-page-welcome .casestudy-right > *:not(:first-of-type) {
    margin-top: 15px;
}

#case-study-page-welcome .casestudy-right h3:first-of-type {
    margin-bottom: 5px;
}

#case-study-page-welcome .casestudy-right .service {
    color: white;
    text-transform: uppercase;
    display: block;
    margin-left: 10px;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    margin-top: 0;
}

#case-study-page-welcome .case-study-description p {
    margin-top: 0;
}

.case-study-description a {
    color: #fff;
}

#case-study-page-content {
    margin-top: -100px;
    margin-bottom: 0 !important;
    text-align: center;
}

#case-study-page-content img {
    vertical-align: middle;
    margin: auto;
    display: block;
    width: 100%;
}

#case-study-page-content.slanted:after {
    bottom: 0;
    background-color: #e6fbf6;
    -webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}

#case-study-page-calltoaction .container {
    padding-bottom: 130px;
    padding-top: 130px;
}

#case-study-page-calltoaction h3 {
    color: #04d7a0;
    font-family: "kepler-std",serif;
    font-weight: 700;
    font-size: 45px;
    margin-top: 0;
    margin-bottom: 50px;
}

#case-study-page-calltoaction h3.text-navy-blue {
    color: var(--navy-blue);
}

/* case study page end */

/* SLIDER */
.flex-control-nav {
    max-width: 1125px;
    margin-left: auto;
    margin-right: auto;
    bottom: 100px;
    left: 50%;
    transform: translate(-50%, 0);
    text-align: left;
}

.flex-control-paging li a {
    width: 7px;
    height: 7px;
    background-color: rgba(255, 255, 255, 0.7);
    transition: 0.3s all ease;
}

.flex-control-paging li a.flex-active {
    background-color: rgba(255, 255, 255, 1);
}

.slider .slide-background {
    height: 100vh;
}

.flexslider {
    margin: 0 !important;
}

.slider {
    height: auto;
}

.slider .content .button {
    display: inline-block;
    margin-top: 15px;

    border-color: #011e3c;
}

.slider .content .button:hover {
    background-color: #011e3c;
    color: #fff;
}

.slider .overlay.dark + .content .button {
    border-color: #fff;
    color: #fff;
}

.slider .overlay.dark + .content .button:hover {
    background-color: #04d7a0;
    color: #000;
    border-color: #04d7a0;
}

/* portfolio */

.filter-section {
    width: 100%;
    margin-bottom: 50px;
}

.terms-filter-group {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    display: none;
    transition: 0.3 all ease;
}

.terms-filter-group.active {
    display: flex;
}

.terms-filter-group button {
    width: 100%;
    background: white;
    text-transform: uppercase;
    border: 0;
    font-weight: bold;
    color: #cdd2d8;
    cursor: pointer;
}

.filter-section .filter-taxonomies {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    border-bottom: 1px dotted #011e3c;
}

.filter-container {
    margin-top: 30px;
}

.filter-section button:focus {
    outline: 0;
}

.filter-section button {
    width: 25%;
    margin: 0;
    background-color: white;
    border: 0;
    text-transform: uppercase;
    font-weight: bold;
    padding: 5px 0;
    font-size: 17px;
    color: #cdd2d8;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}

.filter-section .filter-terms button {
    font-size: 10px;
    padding: 5px 0;
    height: 45px;
}

.projects {
    width: 100%;
    background-color: white;
    background-image: url("assets/img/stripes-light.png");
}

.filter-section .filter-terms button.selected,
.filter-section .filter-taxonomies button.clicked {
    color: #011e3c;
}

.filter-container {
    display: none;
}

.filter-container.active {
    display: flex;
}

.project-item {
    position: relative;
    width: 20%;
    padding-top: 20%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    background-color: #ffffff;
    background-blend-mode: multiply;
    transition-timing-function: ease-in-out;
    transition-duration: 0.3s;
    transition-property: background;
}

.project-item-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px;
    font-size: 24px;
    line-height: 27px;
    color: white;
    z-index: 2;
    transition: all 0.3s ease-in-out;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.project-item-image {
    flex-grow: 1;
    border: 1px solid #efefef;
    overflow: hidden;
    transition: 1s all cubic-bezier(.36,1.14,.86,.97);
}

.project-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 1s all cubic-bezier(.36,1.14,.86,.97);
}

.project-item-overlay {
    position: absolute;
    opacity: 0;
    background-color: #00dce1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    transition: 0.3s all ease-in-out;
}

.project-item:hover .project-item-overlay {
    opacity: 0;
}

.project-item-client {
    font-size: 16px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    margin-top: 10px;
}

.project-item.width2 {
    width: 40%;
}

.project-item.height2 {
    padding-top: 40%;
}

.project-item-title-bar {
    color: #000000;
    padding: 20px 15px 20px 15px;
    border-bottom: 1px solid #efefef;
    border-left: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
    font-size: 24px;
    line-height: 1;
    transition: 1s all cubic-bezier(.36,1.14,.86,.97);
}

.project-item:hover .project-item-image {
    border: 1px solid var(--aquamarine);
    border-bottom: 0;
}

.project-item:hover .project-item-image img {
    transform: scale(1.1);
}

.project-item:hover .project-item-title-bar {
    border-bottom: 1px solid var(--aquamarine);
    border-left: 1px solid var(--aquamarine);
    border-right: 1px solid var(--aquamarine);
}


@media screen and (max-width: 1200px) {
    .project-item {
        width: 25%;
        padding-top: 25%;
    }

    .project-item.width2 {
        width: 50%;
    }

    .project-item.height2 {
        padding-top: 50%;
    }
}

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

    .project-item {
        width: 33%;
        padding-top: 33%;
    }

    .project-item.width2 {
        width: 66%;
    }

    .project-item.height2 {
        padding-top: 66%;
    }
}


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

    .project-item {
        width: 50%;
        padding-top: 50%;
    }

    .project-item.width2 {
        width: 100%;
    }

    .project-item.height2 {
        padding-top: 100%;
    }

}

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

    .project-item {
        width: 100%;
        padding-top: 100%;
    }

    .project-item.width2 {
        width: 100%;
    }

    .project-item.height2 {
        padding-top: 100%;
    }
}

.portfolio-big-menu {
    display: flex;
    width: 100%;
}

.portfolio-big-menu .big-item {
    color: #cdd2d8;
    background-color: #e4e8eb;
    font-family: "kepler-std",serif;
    font-weight: 700;
    font-size: 50px;
    width: 50%;
    padding-top: 20px;
    padding-bottom: 20px;
    cursor: default;
    transition: 0.3s all ease-in-out;
    border: 0;
}

.portfolio-big-menu .big-item:focus {
    outline: 0;
}

.portfolio-big-menu .big-item:not(.active) {
    cursor: pointer;
}

.portfolio-big-menu .big-item.active {
    background-color: white;
    color: #04d7a0;
}

.portfolio-big-menu .big-item-left {
    text-align: right;
    padding-right: 50px;
}

.portfolio-big-menu .big-item-right {
    text-align: left;
    padding-left: 50px;
}

#clients-full {
    padding: 70px 0;
    background-color: #e6fbf6;
}

#clients-full .clients-container {
    display: flex;
    margin: -25px;
    margin-top: 50px;
    text-align: center;
    flex-wrap: wrap;
}

#clients-full .clients-container .client-logo {
    width: 25%;
    padding: 25px;
    height: 120px;
    /*background-color: white;*/
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#clients-full .clients-container .client-logo img {
    width: 100%;
    height: auto;
}

#office-slider {
    height: 80vh;
    padding-top: 0;
}

#office-slider .flexslider {
    height: 100%;
    border: 0;
}

#office-slider .flexslider > *,
#office-slider .flexslider .slide.bg-image,
#office-slider .flexslider .slide.bg-image > *,
#office-slider .flexslider .slides {
    height: 100%;
}

/* single post page start */

#single-post-welcome .wrapper-wide .single-post-welcome-container,
#single-post-welcome .wrapper .single-post-welcome-container {
    padding-top: 250px;
    padding-bottom: 150px;
}

#single-post-welcome.bg-image::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #011e3c;
    z-index: -1;
    opacity: 0.9;
}

#single-post-welcome.bg-image.no-overlay::after {
    opacity: 0;
}

#single-post-welcome.bg-image.light-overlay::after {
    opacity: 0.5;
}

#single-post-welcome h1 {
    font-size: 64px;
    line-height: 64px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    margin: 0;
    margin-bottom: 20px;
}

#single-post-welcome .overlay.dark {
    z-index: -1;
}

#single-post-welcome .subtitle {
    font-size: 24px;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    color: #04d7a0;
}

#single-post-welcome.universal .subtitle {
    text-transform: none;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 300;
    font-weight: normal;
}

#single-post-welcome + .the-post-thumbnail {
    margin-top: -70px;
    height: 600px;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

#single-post-content .single-post-container ul,
#single-post-content .single-post-container ol {
    padding-left: 15px;
}

#single-post-content .single-post-container h6 {
    font-size: 17px;
}

#single-post-content .single-post-container > .post-content {
    display: flex;
    flex-direction: row;
}

#single-post-content
    .single-post-container
    .post-content-content
    > *:first-of-type {
    margin-top: 0;
}

#single-post-content
    .single-post-container
    .post-content-content
    > h6:first-of-type {
    margin-bottom: 20px;
}

.single-post-container .post-content .post-content-thumbnail {
    width: 0;
    height: auto;
}

.single-post-container .post-content > .post-content-content {
    width: 100%;
}

.single-post-container
    .post-content
    > .post-content-content
    figcaption.wp-caption-text {
    font-size: 11px;
    font-style: italic;
}

.single-post-container .post-content > .post-content-content iframe {
    width: 100%;
    /*      height: 250px; */
}

.single-post-container .post-content .post-content-thumbnail.with-image {
    width: 35%;
    height: auto;
}

.single-post-container .post-content > .post-content-content.with-image {
    width: 65%;
    padding-left: 50px;
}

#single-post-content .single-post-navigation {
    display: flex;
    flex-direction: row;
    color: #04d7a0;
    clear: both;
}

#single-post-content .single-post-navigation > * {
    width: 50%;
    text-decoration: none;
    transition: 0.3s all ease-in-out;
}

#single-post-content .single-post-navigation > *:hover {
    transform: scale(1.05);
}

#single-post-content .single-post-navigation .prev-post {
    padding-right: 20px;
}

#single-post-content .single-post-navigation .next-post {
    text-align: right;
    padding-left: 20px;
}

#single-post-content .single-post-navigation h3 {
    font-family: "kepler-std",serif;
    font-weight: 700;
    color: #04d7a0;
}

/* single post page end */

/* archive page start */

#archive-page-welcome .wrapper .archive-page-welcome-container {
    padding-top: 250px;
    padding-bottom: 150px;
}

#archive-page-welcome h1 {
    font-size: 64px;
    line-height: 64px;
    font-family: "kepler-std",serif;
    font-weight: 700;
    margin: 0;
    margin-bottom: 20px;
}

#archive-content .container {
    display: flex;
    margin: 0 -10px;
    flex-wrap: wrap;
}

#archive-content .container > * {
    width: 25%;
    padding: 10px;
}

/* archive page end */

/* gallery in posts */

.gallery:after {
    content: "";
    display: table;
    clear: both;
}

img.aligncenter,
div.aligncenter,
figure.aligncenter,
img.wp-post-image {
    display: block;
    margin: 1em auto;
}

img.alignright,
div.alignright,
figure.alignright {
    float: right;
    margin: 1em 0 1em 2em;
}

img.alignleft,
div.alignleft,
figure.alignleft,
img.wp-post-image.attachment-thumb {
    float: left;
    margin: 1em 1em 2em 0;
}

figure {
    max-width: 100%;
    height: auto;
    margin: 1em 0;
}

p img.alignright,
p img.alignleft {
    margin-top: 0;
}

.gallery figure img {
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    display: block;
}

.gallery figure {
    float: left;
    margin: 0 2% 1em 0;
}

.gallery.gallery-columns-1 figure {
    width: 100%;
    margin: 0 0 1em 0;
    float: none;
}

.gallery.gallery-columns-3 figure {
    width: 32%;
}

.gallery.gallery-columns-3 figure:nth-of-type(3n + 3) {
    margin-right: 0;
}

.gallery.gallery-columns-3 figure:nth-of-type(3n + 4) {
    clear: left;
}

.gallery.gallery-columns-2 figure {
    width: 49%;
}

.gallery.gallery-columns-2 figure:nth-of-type(even) {
    margin-right: 0;
}

.gallery.gallery-columns-2 figure:nth-of-type(odd) {
    clear: left;
}

.gallery.gallery-columns-4 figure {
    width: 23.25%;
}

.gallery.gallery-columns-4 figure:nth-of-type(4n + 4) {
    margin-right: 0;
}

.gallery.gallery-columns-4 figure:nth-of-type(4n + 5) {
    clear: left;
}

.gallery.gallery-columns-5 figure {
    width: 18%;
}

.gallery.gallery-columns-5 figure:nth-of-type(5n + 5) {
    margin-right: 0;
}

.gallery.gallery-columns-5 figure:nth-of-type(5n + 6) {
    clear: left;
}

.gallery.gallery-columns-6 figure {
    width: 14.2%;
}

.gallery.gallery-columns-6 figure:nth-of-type(6n + 6) {
    margin-right: 0;
}

.gallery.gallery-columns-6 figure:nth-of-type(6n + 7) {
    clear: left;
}

.gallery.gallery-columns-7 figure {
    width: 12%;
}

.gallery.gallery-columns-7 figure:nth-of-type(7n + 7) {
    margin-right: 0;
}

.gallery.gallery-columns-7 figure:nth-of-type(7n + 8) {
    clear: left;
}

.gallery.gallery-columns-8 figure {
    width: 10.2%;
}

.gallery.gallery-columns-8 figure:nth-of-type(8n + 8) {
    margin-right: 0;
}

.gallery.gallery-columns-8 figure:nth-of-type(8n + 9) {
    clear: left;
}

.gallery.gallery-columns-9 figure {
    width: 8.85%;
}

.gallery.gallery-columns-9 figure:nth-of-type(9n + 9) {
    margin-right: 0;
}

.gallery.gallery-columns-9 figure:nth-of-type(9n + 10) {
    clear: left;
}

@media (max-width: 767px) {
    img.alignright,
    div.alignright,
    figure.alignright,
    img.alignleft,
    div.alignleft,
    figure.alignleft,
    img.wp-post-image.attachment-thumb {
        display: block;
        margin: 1em auto;
        float: none;
    }

    .gallery.gallery-columns-4 figure,
    .gallery.gallery-columns-5 figure,
    .gallery.gallery-columns-6 figure,
    .gallery.gallery-columns-7 figure,
    .gallery.gallery-columns-8 figure,
    .gallery.gallery-columns-9 figure {
        width: 100%;
        margin: 0 0 1em 0;
        float: none;
    }
}

/* gallery in posts end */

/* join the team start */

#join-the-team {
    padding: 150px 0 40px 0;
    margin-top: -120px;
    z-index: -3;
}

#join-the-team.single-vacancy {
    margin-top: 0;
    z-index: 1;
    padding-top: 50px;
    padding-bottom: 20px;
}

/* #join-the-team.join-the-team-page{
padding-top: 100px;
} */

#join-the-team .tiles-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 0 -30px;
}

#join-the-team .tiles-container > * {
    width: 50%;
    padding: 30px;
}

#join-the-team .tiles-container .join-the-team-tile {
    display: flex;
    flex-direction: row;
}

#join-the-team .tile-icon {
    border-radius: 50%;
    padding: 10px;
    flex-shrink: 0;
    flex-grow: 0;
    width: 120px;
    height: 120px;
    align-self: flex-start;
}

#join-the-team .tile-icon path {
    /*stroke: #04d7a0;*/
}

#join-the-team .tile-title {
    font-size: 22px;
    line-height: 22px;
    margin-bottom: 15px;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    color: #011e3c;
    text-transform: uppercase;
}

#join-the-team .tile-content-wrapper {
    padding-left: 15px;
}

.tile-icon img {
}

/* join the team end */

/* timeline start */

#timeline.circled {
    margin-top: -120px;
    padding: 100px 0;
}

/* --------------------------------

Vertical Timeline - by CodyHouse.co

-------------------------------- */
.timeline-content-single {
    display: flex;
    flex-direction: row;
}

.cd-timeline .timeline-title {
    margin-bottom: 100px;
}

.timeline-content-single:not(:last-of-type) {
    margin-bottom: 15px;
}

.timeline-content-single svg {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    flex-grow: 0;
}

.timeline-content-single svg path,
.timeline-content-single svg polyline,
.timeline-content-single svg line,
.timeline-content-single svg circle,
.timeline-content-single svg polygon {
    stroke: black;
}

.timeline-content-single .timeline-single-text {
    align-self: center;
    padding-left: 20px;
}

.cd-timeline {
    overflow: hidden;
    margin: 2em auto;
}

.cd-timeline__container {
    position: relative;
    width: 90%;
    max-width: 1170px;
    margin: 0 auto;
    padding: 2em 0;
}

.cd-timeline__container::before {
    /* this is the vertical line */
    content: "";
    position: absolute;
    top: 0;
    left: 18px;
    height: 100%;
    width: 4px;
    background: #d7e4ed;
}

@media only screen and (min-width: 1170px) {
    .cd-timeline {
        margin-top: 3em;
        margin-bottom: 3em;
    }

    .cd-timeline__container::before {
        left: 50%;
        margin-left: -2px;
    }
}

.cd-timeline__block {
    position: relative;
    margin: 2em 0;
}

.cd-timeline__block:after {
    /* clearfix */
    content: "";
    display: table;
    clear: both;
}

.cd-timeline__block:first-child {
    margin-top: 0;
}

.cd-timeline__block:last-child {
    margin-bottom: 0;
}

@media only screen and (min-width: 1170px) {
    .cd-timeline__block {
        margin: 4em 0;
    }
}

.cd-timeline__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.cd-timeline__img img {
    display: block;
    width: 24px;
    height: 24px;
    position: relative;
    left: 50%;
    top: 50%;
    margin-left: -12px;
    margin-top: -12px;
}

@media only screen and (min-width: 1170px) {
    .cd-timeline__img {
        width: 60px;
        height: 60px;
        left: 50%;
        margin-left: -30px;
        /* Force Hardware Acceleration */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }

    .cd-timeline__img.cd-timeline__img--bounce-in {
        visibility: visible;
        -webkit-animation: cd-bounce-1 0.6s;
        animation: cd-bounce-1 0.6s;
    }
}

@-webkit-keyframes cd-bounce-1 {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes cd-bounce-1 {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.cd-timeline__content {
    position: relative;
    position: relative;
    margin-left: 81px;
    background: white;
    border-radius: 0.25em;
    padding: 1em;
    -webkit-box-shadow: 0 3px 0 #011e3c;
    box-shadow: 0 3px 0 #011e3c;
}

.cd-timeline__content:after {
    /* clearfix */
    content: "";
    display: table;
    clear: both;
}

.cd-timeline__content::before {
    /* triangle next to content block */
    content: "";
    position: absolute;
    top: 24px;
    right: 100%;
    height: 0;
    width: 0;
    border: 7px solid transparent;
    border-right: 7px solid #011e3c;
}

.cd-timeline__content h2 {
    margin: 0;
    color: #3b436f;
    font-family: "Centrale Sans";
    font-size: 1.2rem;
    line-height: initial;
}

.cd-timeline__content p,
.cd-timeline__read-more,
.cd-timeline__date {
    font-size: 1.3rem;
}

.cd-timeline__content p {
    margin: 1em 0;
    line-height: 1.6;
}

.cd-timeline__read-more,
.cd-timeline__date {
    display: inline-block;
}

.cd-timeline__read-more {
    float: right;
    padding: 0.8em 1em;
    background: #acb7c0;
    color: white;
    border-radius: 0.25em;
}

.cd-timeline__read-more:hover {
    background-color: #bac4cb;
}

.cd-timeline__date {
    float: left;
    padding: 0.4em 0;
    opacity: 0.7;
    color: #011e3c;
}

@media only screen and (min-width: 768px) {
    .cd-timeline__content h2 {
        font-size: 1.2rem;
    }

    .cd-timeline__content p {
        font-size: 1rem;
    }

    .cd-timeline__date {
        color: inherit;
    }

    .cd-timeline__read-more,
    .cd-timeline__date {
        font-size: 1.4rem;
    }
}

@media only screen and (min-width: 1170px) {
    .cd-timeline__content {
        margin-left: 0;
        padding: 1.6em;
        width: 41%;
        /* Force Hardware Acceleration */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }

    .cd-timeline__content::before {
        top: 24px;
        left: 100%;
        border-color: transparent;
        border-left-color: #011e3c;
    }

    .cd-timeline__read-more {
        float: left;
    }

    .cd-timeline__date {
        position: absolute;
        width: 100%;
        text-align: center;
        font-size: 1.6rem;
        /*margin-top: 50px;*/
    }

    .cd-timeline__block:nth-child(even) .cd-timeline__content {
        float: right;
    }

    .cd-timeline__block:nth-child(even) .cd-timeline__content::before {
        top: 24px;
        left: auto;
        right: 100%;
        border-color: transparent;
        border-right-color: #011e3c;
    }

    .cd-timeline__block:nth-child(even) .cd-timeline__read-more {
        float: right;
    }

    .cd-timeline__block:nth-child(even) .cd-timeline__date {
        left: auto;
    }

    .cd-timeline__content.cd-timeline__content--bounce-in {
        visibility: visible;
        -webkit-animation: cd-bounce-2 0.6s;
        animation: cd-bounce-2 0.6s;
    }
}

@media only screen and (min-width: 1170px) {
    /* inverse bounce effect on even content blocks */
    .cd-timeline__block:nth-child(even)
        .cd-timeline__content.cd-timeline__content--bounce-in {
        -webkit-animation: cd-bounce-2-inverse 0.6s;
        animation: cd-bounce-2-inverse 0.6s;
    }
}

@-webkit-keyframes cd-bounce-2 {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100px);
        transform: translateX(-100px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes cd-bounce-2 {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100px);
        transform: translateX(-100px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@-webkit-keyframes cd-bounce-2-inverse {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100px);
        transform: translateX(100px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes cd-bounce-2-inverse {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100px);
        transform: translateX(100px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

span.cd-timeline__date {
    font-weight: 600;
    font-family: "kepler-std",serif;
    font-weight: 700;
    font-size: 2rem;
}

/* timneline end */

/* CSR page start */

.wpostahs-slider-design-1
    .wpostahs-slider-nav-title.slick-current
    .wpostahs-main-title {
    background-color: #011e3c;
}

.wpostahs-slider-design-1
    .wpostahs-slider-nav-title.slick-current
    .wpostahs-main-title:after {
    border-top-color: #011e3c;
}

.wpostahs-slider-design-1
    .wpostahs-slider-nav-title.slick-current
    .wpostahs-main-title:before {
    border-top-color: #011e3c;
}

.wpostahs-slider-design-1 .wpostahs-slider-nav-title .wpostahs-main-title {
    font-size: 12px;
}

.wpostahs-slider-design-1 .wpostahs-slider-for .wpostahs-centent {
    padding-bottom: 100px;
}

#history-slider-text.circled {
    margin-top: -120px;
}

.wpostahs-slider-design-1 .wpostahs-slider-nav-title .wpostahs-main-title {
    color: #011e3c;
}

.wpostahs-slider-design-1 *:focus {
    outline: 0 !important;
}

/* csr page end */

/* timeline end */

/* Video Embed */
.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
}

.embed-container-cinema {
    position: relative;
    padding-bottom: 38.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
}

.embed-container-cinema .sound-icon {
    position: absolute;
    /* top: 50%; */
    /* left: 50%; */
    /* transform: translateX(-50%) translateY(-50%); */
    bottom: 8%;
    right: 5%;
    width: 5%;
    transition: 0.3s opacity ease-in-out;
    opacity: 0;
    pointer-events: none;
    max-width: 120px;
}

.embed-container-cinema .sound-icon.muted {
    opacity: 1;
}

.embed-container-cinema .sound-icon.unmuted {
    opacity: 1;
}

.embed-container-cinema .sound-icon.muted:after {
    content: "";
    width: 10%;
    height: 120%;
    border-radius: 3px;
    background: #ffffff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%) rotate(45deg);
}

.embed-container-cinema .sound-icon svg {
    fill: #ffffff;
    width: 100%;
    height: auto;
}

.embed-container-cinema video {
    object-fit: cover;
    cursor: pointer;
}

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

#case-study-page-content .embed-container {
    max-width: 1024px;
    margin: 0 auto;
}

.portfolio-extra-content {
    padding: 70px 0;
    color: #ffffff;
}

@media screen and (min-width: 1024px) {
    #case-study-page-content .embed-container {
        padding-bottom: 40%;
    }
}

/* end Video Embed */

/* Accordian */
.accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}

.accordion.active,
.accordion:hover {
    background-color: #ccc;
}

.panel {
    padding: 0 18px;
    display: none;
    background-color: white;
    overflow: hidden;
}

/* end Accordian */

/* Privacy Policy Page */
.page-id-3 section#content .container {
    padding-bottom: 20px;
}

.page-id-3 section#accordian .container {
    padding-top: 0;
}

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

.table-wrapper td {
    padding: 5px;
}

.page-id-3 ul li {
    font-size: 17px;
}

/* launch */
.share-icon {
    display: none;
}

/** Portfolio **/
.portfolio-big-menu {
    display: none;
}

.filter-section button {
    width: 50%;
}

button[data-filter=".discipline-all.project"],
.terms-filter-group.discipline-menu,
button[data-filter=".client-all.project"],
.terms-filter-group.client-menu,
button[data-filter=".discipline-all.casestudy"],
button[data-filter=".client-all.casestudy"] {
    display: none;
}

#capabilities-page-more .wrapper-wide {
    background-image: none !important;
}

#vacancy .container.vacancy-container {
    padding: 0;
}

/* launch */

/* JonC Memorial Page */
.slider #slide-105919 .content {
    top: 56%;
    left: 62%;
}

@media (min-width: 768px) {
    .slider #slide-105919 .content {
        left: 70%;
    }
}

@media (min-width: 1024px) {
    .slider #slide-105919 .content {
        left: 66%;
    }
}

@media (max-width: 767px) {
    .slider #slide-105919 .content {
        top: 75%;
        left: 50%;
    }

    .slider #slide-105919 .content .button {
        background-color: #011e3c;
        color: #fff;
    }
}

.page-id-105921 #welcome + #content {
    position: relative;
    padding-top: 0;
    background-color: #011e3c;
    color: #fff;
}

.page-id-105921 #welcome + #content:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 71px;
    top: -70px;
    z-index: 1;
    -webkit-clip-path: polygon(0 0, 0% 100%, 100% 100%);
    clip-path: polygon(0 0, 0% 100%, 100% 100%);
    bottom: -1px !important;
    background: #011e3c;
}

.page-id-105921 #welcome + #content .container {
    margin: 0 auto;
    max-width: 60%;
    text-align: justify;
}

@media (max-width: 767px) {
    .page-id-105921 #welcome {
        margin-bottom: 0;
        padding-bottom: 0;
    }

    .page-id-105921 #welcome + #content .container {
        max-width: 100%;
    }

    .page-id-105921 #welcome + #content:before {
        height: 26px;
        top: -25px;
    }
}

#client-page-welcome.with-image h1,
#client-page-welcome.with-image .industry,
#client-page-welcome.with-image .industry-name {
    color: white;
}

.terms-filter-group.industry-menu {
    flex-wrap: wrap;
}

.terms-filter-group.industry-menu button {
    width: 10%;
}

@media (max-width: 1000px) {
    .terms-filter-group.industry-menu button {
        width: 20%;
    }
}

@media (max-width: 700px) {
    .terms-filter-group.industry-menu button {
        width: 25%;
    }
}

/** JonC portoflio **/
.postid-103984 #player-page-projects {
    display: none;
}

/** JC Programme **/

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.page-template-page-jcp header.sticky {
    background-color: #fec465;
}

.jcp-section {
    padding: 70px 0;
}

.jcp-container {
    display: flex;
    flex-wrap: wrap;
}

.jcp-container .jcp-left {
    width: 50%;
    padding-right: 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.jcp-container .jcp-right {
    width: 50%;
    text-align: center;
}

.jcp-banner {
    background: rgb(204, 203, 217);
    background: linear-gradient(58deg, #16a2d3 0%, #fec465 100%);
    background-size: 200% 200%;
    -webkit-animation: gradient 7s infinite;
    animation: gradient 7s infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
}

.jcp-wrapper {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 20px;
}

.jcp-wrapper-big {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 20px;
}

.jcp-banner img {
    vertical-align: middle;
    margin-top: 150px;
}

.jcp-intro {
    padding: 70px 0 80px 0;
    background-color: #e87d60;
    color: #ffffff;
}

.jcp-intro h2 {
    color: #ffffff;
    margin-bottom: 20px;
    margin-top: 0;
}

.jcp-whoarewe {
    padding: 70px 0 40px 0;
    background-color: #fec465;
}

.jcp-whoarewe-container {
    display: flex;
    flex-wrap: wrap;
}

.jcp-whoarewe-col {
    width: 33.333%;
    padding: 0 20px;
    text-align: center;
    margin-bottom: 30px;
}

.jcp-whoarewe-col a {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    color: #011e3c;
}

.jcp-whoarewe h2 {
    color: #2a3761;
    margin-bottom: 30px;
    margin-top: 0;
    text-align: center;
}

.jcp-whoarewe h3 {
    margin-bottom: 3px;
    line-height: 1;
    color: #011e3c;
}

.jcp-whoarewe p.role {
    margin-top: 3px;
    font-weight: bold;
    color: #011e3c;
}

.jcp-whoarewe p {
    margin-top: 10px;
    margin-bottom: 10px;
    color: #011e3c;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
}

.jcp-why {
    padding: 70px 0 80px 0;
    background-color: #16a2d3;
}

.jcp-why-container {
    color: #ffffff;
}

.jcp-why-container h2 {
    color: #ffffff;
    margin-bottom: 30px;
    margin-top: 0;
}

.jcp-video {
    padding: 70px 0 70px 0;
    background-color: #fec465;
    color: #ffffff;
}

.jcp-video-content h2 {
    text-align: center;
    margin-bottom: 50px;
    color: #2a3761;
}

.jcp-video-wrapper {
    position: relative;
    padding-bottom: 56.25%;
}

.jcp-video iframe {
    /* position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%; */
}

.jcp-gallery-wrapper {
    margin-left: -15px;
    margin-right: -15px;
}

.jcp-button-wrapper {
    text-align: center;
    margin-top: 25px;
}

.jcp-button {
    padding: 12px 20px;
    text-align: center;
    background-color: #16a2d3;
    border-radius: 3px;
    text-decoration: none;
    font-weight: bold;
    color: #ffffff;
    display: inline-block;
}

.jcp-button-2 {
    padding: 12px 20px;
    text-align: center;
    background-color: #e87d60;
    border-radius: 3px;
    text-decoration: none;
    font-weight: bold;
    color: #ffffff;
    display: inline-block;
}

.jcp-logo-inspiration {
    padding: 70px 0;
    background-color: #e69984;
    color: #2a3761;
}

.jcp-logo-inspiration a {
    color: #2a3761;
}

.jcp-logo-inspiration .jcp-logo-inspiration-container {
    display: flex;
    flex-wrap: wrap;
}

.jcp-logo-inspiration h2 {
    color: #2a3761;
    margin-bottom: 30px;
}

.jcp-logo-inspiration
    .jcp-logo-inspiration-container
    .jcp-logo-inspiration-left {
    width: 50%;
    padding-right: 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.jcp-logo-inspiration .jcp-logo {
    margin-top: 35px;
}

.jcp-logo-inspiration
    .jcp-logo-inspiration-container
    .jcp-logo-inspiration-right {
    width: 50%;
    text-align: center;
}

.jcp-logo-inspiration
    .jcp-logo-inspiration-container
    .jcp-logo-inspiration-right
    img {
    max-width: 350px;
    width: 100%;
}

.jcp-grant {
    padding: 70px 0 70px 0;
    background-color: #fec465;
    color: #2a3761;
}

.jcp-grant h2 {
    color: #2a3761;
    margin-bottom: 30px;
}

.jcp-grant ol {
    list-style-position: inside;
    padding-left: 0;
}

.jcp-grant ol li {
    margin: 5px 0;
}

.jcp-grant-container {
    display: flex;
    flex-wrap: wrap;
}

.jcp-grant-container .jcp-grant-left {
    width: 50%;
    text-align: center;
}

.jcp-grant-container .jcp-grant-left img {
    max-width: 340px;
    width: 100%;
}

.jcp-grant-container .jcp-grant-right {
    width: 50%;
    padding-left: 50px;
}

.jcp-athlete {
    padding: 70px 0;
    background-color: #16a2d3;
    color: #ffffff;
}

.jcp-athlete h2 {
    color: #ffffff;
}

.jcp-athelete-container {
    display: flex;
    flex-wrap: wrap;
}

.jcp-athelete-left {
    width: 50%;
    padding-right: 50px;
}

.jcp-athelete-right {
    width: 50%;
}

.jcp-athlete .quote {
    font-style: italic;
    display: block;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 30px;
}

.jcp-athlete .quote-author {
    display: block;
    text-align: right;
    padding-left: 10px;
    padding-right: 10px;
}

.jcp-athlete .jcp-button,
.jcp-camino .jcp-button {
    padding: 12px 20px;
    text-align: center;
    background-color: #011e3c;
    border-radius: 3px;
    text-decoration: none;
    font-weight: bold;
    color: #ffffff;
    margin-top: 15px;
    display: inline-block;
}

.jcp-camino {
    background-color: #0ab1b9;
    color: #ffffff;
}

.jcp-camino h2 {
    color: #ffffff;
    margin-bottom: 30px;
}

.jcp-camino a {
    color: #ffffff;
}

@media screen and (max-width: 600px) {
    .jcp-container .jcp-left {
        width: 100%;
        padding-right: 0;
        margin-bottom: 50px;
    }

    .jcp-container .jcp-right {
        width: 100%;
    }

    .jcp-whoarewe-col {
        width: 100%;
    }

    .jcp-athelete-left {
        width: 100%;
        padding-right: 0;
        margin-bottom: 30px;
    }

    .jcp-athelete-right {
        width: 100%;
    }

    .jcp-logo-inspiration
        .jcp-logo-inspiration-container
        .jcp-logo-inspiration-left {
        width: 100%;
        padding-right: 0;
        margin-bottom: 50px;
    }

    .jcp-logo-inspiration
        .jcp-logo-inspiration-container
        .jcp-logo-inspiration-right {
        width: 100%;
    }

    .jcp-logo-inspiration
        .jcp-logo-inspiration-container
        .jcp-logo-inspiration-right
        img {
        max-width: 100%;
    }

    .jcp-logo-inspiration .jcp-logo {
        text-align: center;
    }

    .jcp-logo-inspiration .jcp-logo img {
        max-width: 400px;
        width: 100%;
    }

    .jcp-grant-container .jcp-grant-right {
        width: 100%;
        order: 1;
        padding-left: 0;
        margin-bottom: 30px;
    }

    .jcp-grant-container .jcp-grant-left {
        width: 100%;
        order: 2;
    }
}

/* Gravity Forms */
.gform_wrapper.gravity-theme .gfield input[type="checkbox"],
.gform_wrapper.gravity-theme .gfield input[type="radio"] {
    width: initial;
}
.gform_wrapper.gravity-theme .gform_previous_button.button svg,
.gform_wrapper.gravity-theme .gform_save_link.button svg {
    width: initial;
}

/* MACE page */
.mace-video {
    padding: 50px 0;
}

.video-wrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
}

.video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.mace-intro {
    padding: 70px 0;
    background-color: #efefef;
}

.mace-intro img.alignleft {
    margin: 10px;
}

.button.mace {
    background-color: #ff6900;
    border-color: #ff6900;
    color: #011e3c;
}

.mace-gallery {
    padding: 70px 0;
}

.mace-gallery .section-title {
    text-align: center;
    margin-bottom: 30px;
    font-size: 44px;
}

.gf-checkbox input {
    margin-bottom: 0 !important;
}

.ginput_container.ginput_container_consent {
    width: 100% !important;
}

.gform_wrapper.gravity-theme .ginput_container_date input {
    width: 100% !important;
}

.gform_wrapper.gravity-theme .gfield_description {
    padding-top: 0 !important;
}

.gform_fileupload_rules {
    margin-top: 0 !important;
}

.gform_drop_area {
    margin-bottom: 0 !important;
}

#full-width-image img {
    width: 100%;
	vertical-align: middle;
}

.page-id-106946 .container {
    padding-top: 30px;
    padding-bottom: 30px;
}

.page-id-106946 h2.title {
    max-width: initial;
}

.padded {
    padding: 70px 0;
}

.pt30 {
    padding-top: 30px;
}

.pt40 {
    padding-top: 40px;
}

.pt50 {
    padding-top: 50px;
}

.pt60 {
    padding-top: 60px;
}

.pt70 {
    padding-top: 70px;
}

.pb20 {
    padding-bottom: 20px;
}

.pb30 {
    padding-bottom: 30px;
}

.pb40 {
    padding-bottom: 40px;
}

.pb50 {
    padding-bottom: 50px;
}

.pb60 {
    padding-bottom: 60px;
}

.pb70 {
    padding-bottom: 70px;
}

.quote {
    position: relative;
    text-align: center;
    /* max-width: 700px; */
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 30px;
    padding-bottom: 30px;
    background-color: #efefef;
    font-style: italic;
}

.quote::before,
.quote::after {
    line-height: 1;
    display: block;
    font-size: 100px;
    position: absolute;
    font-weight: bold;
    z-index: 0;
    opacity: 0.2;
    color: var(--aquamarine);
    font-family: "kepler-std",serif;
    font-weight: 700;
    width: 25px;
    height: 25px;
    text-align: center;
    font-style: normal;
}

.quote::before {
    content: "“";
    top: -20px;
    left: -10px;
}

.quote::after {
    content: "”";
    bottom: 0px;
    right: 0;
}

.placeholder {
    color: var(--navy-blue);
    background-color: var(--yellow);
    padding: 20px;
    margin-top: 25px;
    text-align: center;
    border: 3px solid var(--amaranth);
    font-weight: bold;
}

.core-values {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.core-value {
    text-align: center;
    box-sizing: border-box;
}

.core-value-subtitle {
    color: var(--yellow);
    font-size: 0.9em;
}

.core-value-title {
    color: var(--amaranth);
    font-size: 24px;
    font-weight: bold;
    font-family: "kepler-std",serif;
    font-weight: 700;
}

.featured {
    text-align: center;
    font-family: "kepler-std",serif;
    font-weight: 700;
    font-size: 26px;
    color: var(--navy-blue);
    padding: 20px;
    background-color: var(--yellow);
}
/* 
.tk-filson-pro { font-family: "filson-pro",sans-serif; }
.tk-filson-soft { font-family: "filson-soft",sans-serif; }
.tk-swear-display-cilati { font-family: "swear-display-cilati",sans-serif; }
.tk-swear-display { font-family: "swear-display",serif; } 
*/

.page-template-page-rsvp .header-container .menu-wrap a {
    color: #ffffff;
}

.page-template-page-rsvp .header-logo svg path {
    fill: #ffffff;
}

.page-template-page-rsvp header .social-icons svg path {
    fill: #ffffff;
}

.page-template-page-rsvp ul.menu li ul.sub-menu a {
    color: #000000;
}

.page-template-page-rsvp header.menu-open .menu-icon .patty:before, 
.page-template-page-rsvp header.menu-open .menu-icon .patty:after {
    background-color: #ffffff;
}

.page-template-page-rsvp .menu-icon .patty::before,
.page-template-page-rsvp .menu-icon .patty::after,
.page-template-page-rsvp .menu-icon .patty {
    background-color: #ffffff;
}

.page-template-page-rsvp header.site-header.sticky {
    background-color: #000000;
}

.rsvp-page {
    background-color: #000000;
    color: #ffffff;
    padding: 200px 30px 150px 30px;
    line-height: 1.1em;
    font-size: 29px;
}

.rsvp-intro-img {
    width: 100%;
    height: auto;
    margin-bottom: 1em;
}

.rsvp-page .tk-swear-display-cilati {
    font-weight: 800;
}

.rsvp-wrapper {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.rsvp-calendar-wrapper {
    display: flex;
    max-width: 600px;
    column-gap: 1em;
    align-items: flex-start;
    font-size: 0.8em;
    margin-top: 3em;
    margin-bottom: 2em;
}

.rsvp-page .button.aquamarine {
    background-color: #04d7a0!important;
    color: #000000!important;
    display: inline-block;
    text-align: center;
}

.rsvp-calendar-button-wrapper {
    flex-shrink: 0;
}

.rsvp-calendar-info a {
    color: #ffffff;
    text-decoration: none;
}

.rsvp-page hr {
    background-color: #ffffff;
    height: 1px;
    margin: 3em 0;
}

.rsvp-heading {
    color: #04d7a0;
    font-family: "kepler-std",serif;
    font-weight: 800;
    font-style: italic;
    font-size: 43px;
    line-height: 1em;
}

.rsvp-page input {
    background-color: #000000;
    color: #ffffff;
    padding: 10px 0;
    border-bottom: 1px solid #ffffff;
    font-size: 24px;
}

.rsvp-page input::placeholder {
    font-weight: 400;
    text-transform: none;
    color: #ffffff;
}

.rsvp-form-wrapper .gform-body {
    max-width: 500px;
}

.rsvp-buttons {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 1em;
    row-gap: 0.5em;
    margin-top: 2em;
}

.rsvp-notice .rsvp-heading {
    margin: 0 0 0.3em 0;
}

.rsvp-notice {
    margin: 3em 0;
}

.rsvp-notice p {
    margin: 0;
}

.rsvp-buttons .button {
    width: 100px;
}

.rsvp-form-wrapper .gform_required_legend {
    display: none;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gfield_label {
    font-size: 24px;
    font-weight: 400;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme input[type=text],
.rsvp-form-wrapper .gform_wrapper.gravity-theme input[type=tel],
.rsvp-form-wrapper .gform_wrapper.gravity-theme input[type=email] {
    background-color: #000000;
    color: #ffffff;
    padding: 10px 0;
    border-bottom: 1px solid #ffffff;
    font-size: 24px;
    margin-top: 1em;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gfield_radio label {
    font-size: 24px;
}

.rsvp-form-wrapper .gfield_radio {
    display: flex;
    flex-wrap: wrap;
    column-gap: 1em;
    row-gap: 1em;
    margin-top: 0.5em;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme fieldset.gfield--type-radio {
    display: flex;
    flex-wrap: wrap;
    column-gap: 1em;
    margin-top: 1em;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gform_validation_errors>h2 {
    font-family: brandon-grotesque, sans-serif;
    font-size: 21px;
    color: #04d7a0;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gform_footer {
    margin-top: 1em;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gform_footer input {
    background-color: #04d7a0 !important;
    color: #000000 !important;
    display: inline-block;
    text-align: center;
    padding: 5px 15px;
    font-size: 15px;
    border-bottom: 0;
    width: 160px;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gfield_error [aria-invalid=true] {
    border-bottom-color: #04d7a0;
    border: 1px solid #04d7a0;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gform_validation_errors {
    background-color: transparent;
    font-family: brandon-grotesque, sans-serif;
    border-radius: 0;
    border-color: #04d7a0;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gfield_validation_message, .gform_wrapper.gravity-theme .validation_message {
    background-color: transparent;
    padding: 5px 10px;
    padding-top: 5px!important;
    color: #04d7a0;
    border-color: #04d7a0;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gfield_error legend {
    color: #ffffff;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gfield input[type="radio"] {
    accent-color: #04d7a0;
}

.rsvp-form-wrapper .gform_wrapper.gravity-theme .gfield_error label {
    color: #ffffff;
}

@media screen and (max-width: 768px) {
    .rsvp-page {
        font-size: 21px;
    }

    .rsvp-heading {
        font-size: 26px;
    }

    .rsvp-form-wrapper .gform_wrapper.gravity-theme input[type=text],
    .rsvp-form-wrapper .gform_wrapper.gravity-theme input[type=tel],
    .rsvp-form-wrapper .gform_wrapper.gravity-theme input[type=email] {
        font-size: 18px;
    }

    .rsvp-form-wrapper .gform_wrapper.gravity-theme .gfield_label {
        font-size: 18px;
    }

    .rsvp-form-wrapper .gform_wrapper.gravity-theme .gfield_radio label {
        font-size: 18px;
    }

    .rsvp-form-wrapper .gform_wrapper.gravity-theme .gform_validation_errors>h2 {
        font-size: 18px;
    }
}