@media screen and (max-width: 1030px) {
    .wrapper,
    .wrapper-wide,
    .wrapper-super-wide {
        padding: 0 10px;
    }

    .img-1024 img {
        max-width: 100%;
    }

    .site-footer .wrapper-wide {
        padding: 0;
    }
}

@media screen and (max-width: 960px) {
    .vacancy-container {
        flex-direction: column-reverse;
    }

    .vacancy-container > div {
        width: 100%;
    }

    .single-post-container .post-content .post-content-thumbnail.with-image {
        width: 45%;
    }

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

    .projects-container a {
        height: 300px;
    }

    #capabilities-page-more .wrapper-wide .container {
        width: 50%;
    }

    #capabilities-page-more .wrapper-wide .container h3 {
        font-size: 30px;
    }

    .grid-container > div:first-of-type,
    .grid-container > div:nth-of-type(2) {
        padding: 0;
        width: 100%;
        align-self: center;
    }

    .news-menu,
    .journal-container {
        grid-template-columns: 1fr 1fr;
    }

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

    .grid-container {
        flex-direction: column;
        margin: 0;
    }

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

    .bg-image.slanted {
        padding-bottom: 7%;
    }

    h2 {
        font-size: 45px;
        line-height: 38px;
    }

    h2.smaller {
        font-size: 38px;
    }

    h3 {
        font-size: 25px;
        margin-top: 5px;
    }

    .welcome-before-title {
        font-size: 36px;
    }

    .welcome-title {
        font-size: 90px;
        line-height: 76px;
    }

    .pr-content .pr-title {
        font-size: 34px;
    }

    .pr-content .pr-job {
        font-size: 18px;
    }

    #pr .button {
        left: 16%;
    }

    .what-we-do-element {
        width: 50%;
    }

    .player-title {
        font-size: 50px;
    }

    .player-subtitle {
        font-size: 18px;
    }

    .portfolio-container {
        padding-bottom: 30px;
        padding-top: 0;
        flex-direction: column;
    }

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

    .dotted-line {
        padding: 0;
        background: none;
    }

    #portfolio .title {
        padding: 7% 10% 0 10%;
    }

    .portfolio-container > div:first-of-type {
        padding: 0 10% 7% 10%;
    }

    .portfolio-container > div:nth-of-type(2) {
        padding: 0 10% 7% 10%;
    }

    #client-page-content .clients-testimonial {
        padding-left: 0;
        margin-top: 50px !important;
        border-top: 1px solid #efefef;
        padding-top: 30px;
    }

    .news-container {
        flex-direction: column;
    }

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

    .news-container > div:first-of-type {
        transform: translateY(0);
    }

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

    .vacancy-container {
        grid-template-columns: 1fr;
    }

    .vacancy-container > div:nth-of-type(2) {
        /* padding: 7% 10%; */
    }

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

    .contact-container {
        padding-top: 0px;
    }

    #instagram {
        margin-bottom: 70px;
    }

    .player-container {
        padding: 15% 0;
    }

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

    .contact-form-columns {
        flex-direction: column;
    }

    .contact-form .contact-form-columns > div {
        width: 100%;
    }

    .contact-form .contact-form-columns > div:nth-of-type(2) {
        margin-top: 25px;
    }

    .projects-3 {
        flex-direction: column;
    }

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

    footer .footer-container {
        display: block;
    }

    footer .contact-details {
        text-align: center;
    }

    footer .footer-icons {
        justify-content: center;
    }

    footer .footer-memebers-title {
        text-align: center;
    }

    footer .footer-members {
        justify-content: center;
    }

    footer .site-info {
        text-align: center;
        display: block;
        margin-bottom: 35px;
        margin-top: 5px;
    }

    .footer-container .footer-right {
        margin-top: 20px;
        text-align: center;
    }

    .footer-container .footer-right span {
        width: 100%;
        display: block;
        margin-bottom: 10px;
    }

    .footer-container .footer-right img {
        margin: 0;
    }
}

@media screen and (min-width: 769px) {
    header .social-icons {
        display: block;
    }

    .menu-icon {
        display: none;
    }

    header:not(.sticky) .main-navigation {
        margin-top: 31px;
    }

    .main-navigation ul.menu > li {
        display: inline-block;
    }

    .main-navigation ul.menu > li:not(:first-child) {
        margin-left: 10px;
    }

    .menu-top-menu-container ul.menu li:hover ul.sub-menu {
        display: block;
    }

    .header-container .menu-wrap ul.menu > li:hover {
        padding: 0 10px;
    }

    .slider .content.left {
        right: 0;
        left: 50%;
        text-align: left;
    }
}

@media screen and (max-width: 768px) {
    .core-values {
        grid-template-columns: repeat(2, 1fr);
    }

    .video-modal iframe {
        height: 75%;
    }

    .video-modal {
        padding: 10px;
    }

    header .header-container .menu-wrap {
        width: 100%;
        height: 100vh;
        background-color: #04d7a0;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        transition: all 0.3s ease-in-out;
        z-index: -1;
        justify-content: flex-start;
        padding-top: 120px;
    }

    .header-container .menu-wrap .wrapper-wide {
        display: flex;
        flex-direction: column;
        text-align: right;
    }

    .header-container .menu-wrap {
        display: none;
        opacity: 0;
        margin-top: -5px;
        font-size: 0;
        transition: all 0.1s ease-in;
    }

    header:not(.menu-open) .header-container .menu-wrap {
        pointer-events: none;
    }

    header.menu-open .header-container .menu-wrap {
        /*display: block;*/
        opacity: 1;
        margin-top: 0px;
    }

    header .header-container .menu-wrap {
        margin-top: -80px;
    }

    header .header-container .menu-wrap li {
        font-family: "kepler-std",serif;
        font-weight: 700;
        font-size: 13vw;
    }

    header .header-container .menu-wrap ul.sub-menu li {
        font-size: 7vw;
    }

    header .header-container .menu-wrap a {
        color: #fff;
        line-height: 8vh;
        box-sizing: content-box;
        font-family: inherit;
        font-size: inherit;
    }

    header .header-container .menu-wrap a {
        margin-bottom: 3vh;
    }

    ul.menu ul.sub-menu {
        position: initial;
        background-color: transparent;
        box-shadow: none;
    }

    ul.menu li.menu-item-has-children span {
        font-size: 8vw;
        font-family: inherit;
    }

    ul.menu li.menu-item-has-children span:after {
        content: ">";
        display: inline-block;
        font-family: brandon-grotesque, sans-serif;
        font-weight: 400;
        font-size: inherit;
        padding: 0 10px;
        color: #fff;
        transform: rotate(90deg);
        transition: all 0.3s ease-in-out;
    }

    ul.menu li.menu-item-has-children span.open:after {
        transform: rotate(-90deg) translateY(-7px);
    }

    ul.menu li span.blank {
        display: inline-block;
        margin: 0 0 0 12px;
    }

    ul.menu li ul.sub-menu {
        margin: 0;
        padding-right: 60px;
    }

    ul.menu li ul.sub-menu a {
        margin: 0 !important;
        padding: 0 16px;
        width: initial;
        font-family: brandon-grotesque, sans-serif;
        font-weight: 400;
    }

    .main-navigation ul.menu li a:after {
        border-color: #011e3c;
    }

    .flex-control-nav {
        left: auto;
        right: auto;
        transform: none;
        text-align: center;
    }

    .slider .content {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        bottom: initial;
    }

    .what-we-do-element {
        text-align: center;
    }

    .what-we-do-icon,
    .capability .capability-title {
        margin: 0 auto;
    }

    .capability .capability-title {
        text-align: center;
    }

    .capability-description {
        text-align: center;
    }

    .capability .read-more {
        margin: 20px auto 0;
    }

    #what-we-do .what-we-do-element .what-we-do-name {
        width: 100%;
    }

    #single-post-welcome h1 {
        font-size: 48px;
        line-height: 1;
    }

    #case-study-page-welcome h1 {
        font-size: 50px;
    }
}

@media screen and (min-width: 721px) {
    .team-grid:after {
        z-index: -1;
        content: "";
        grid-column: 3;
        grid-row: 1;
    }
}

@media screen and (max-width: 720px) {
    #contact-page-welcome {
        background-position: 20%;
    }

    .flexslider:not(:hover) .flex-direction-nav .flex-next {
        right: 10px;
    }

    .flexslider:not(:hover) .flex-direction-nav .flex-prev {
        left: 10px;
    }

    .single-post-container .post-content .post-content-thumbnail.with-image {
        width: 100%;
    }

    .single-post-container .post-content > .post-content-content.with-image {
        width: 100%;
        padding-left: 0;
        padding-top: 30px;
    }

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

    .projects-2 {
        flex-direction: column;
    }

    #player-page-skills .skills-container {
        flex-direction: column;
    }

    #player-page-skills .skills-container > * {
        width: 100%;
        text-align: center;
    }

    #player-page-skills .skills-container > *:not(:last-of-type) {
        margin-bottom: 50px;
    }

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

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

    .slanted {
        position: relative;
        margin-bottom: 40px;
    }

    .slanted:after {
        height: 41px;
        bottom: -40px;
    }

    #pr {
        margin-bottom: 50px;
    }

    #pr > .flex-container > a {
        width: 90%;
        margin: auto;
    }

    #pr a:not(.button) {
        padding-top: 50%;
    }

    #pr > .flex-container {
        flex-direction: column;
        justify-content: center;
    }

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

    #pr > .flex-container a:nth-of-type(2) {
        transform: translateY(0);
        margin-top: 20px;
        margin-bottom: 50px;
    }

    .bg-with-slanted-div-container {
        width: calc(100% - 10%);
        bottom: -15px;
    }

    #pr .button {
        bottom: 10px;
        left: 20%;
    }

    #portfolio .title {
        padding: 10% 0 0 0;
    }

    .portfolio-container > div:first-of-type {
        padding: 5px 0 10% 0;
    }

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

    .contact-form input:not(:last-of-type) {
        margin-bottom: 20px;
    }

    .contact-form > div:nth-of-type(2) {
        padding-top: 20px;
    }

    .contact-form textarea {
        height: 100px;
    }

    .player-container {
        float: none;
        max-width: none;
    }

    #what-we-do .title,
    #what-we-do .subtitle,
    #pr-section .title,
    #pr-section .subtitle {
        padding: 0;
    }

    #what-we-do .subtitle,
    #pr-section .subtitle {
        margin-top: 0;
        padding-top: 0;
    }

    .news-container > div:nth-of-type(2),
    .vacancy-container > div:nth-of-type(2) {
        padding: 7% 0;
        padding-top: 0;
    }

    .team-grid > .player {
        width: 50%;
        margin-bottom: 20px;
    }

    #capabilities-page-more,
    #player-page-welcome {
        height: auto;
    }

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

    #player-page-welcome .wrapper {
        padding-top: 130px;
        padding-bottom: 15%;
        background-size: 50%;
    }

    .capabilities-grid-container,
    #capabilities-page-list .capabilities-grid-container {
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (max-width: 540px) {
    #case-study-page-welcome h1 {
        font-size: 42px;
    }

    .vacancy-position {
        width: 100%;
    }

    #single-post-welcome h1 {
        font-size: 36px;
    }

    .core-values {
        grid-template-columns: repeat(1, 1fr);
    }

    .single-post #single-post-welcome h1 {
        font-size: 42px;
        line-height: 42px;
    }

    #clients-full .clients-container .client-logo {
        width: 33.33333%;
    }

    #player-page-welcome .wrapper {
        background-position: 100% 25vh;
    }

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

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

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

    .news-menu,
    .journal-container {
        grid-template-columns: 1fr;
    }

    header .social-icon {
        display: none;
    }

    .team-grid > .player {
        width: 100%;
    }

    footer .social-icons {
        display: block;
        text-align: center;
        margin-bottom: 15px;
        padding-top: 5px;
    }

    footer .social-icons .social-icon svg path {
        fill: white;
    }

    footer .footer-agreement-container {
        padding-bottom: 10px;
    }

    footer .newsletter-form input:not(.button) {
        margin-right: 10px;
        min-width: 0;
    }

    #welcome {
        width: 100%;
        padding: 0px 0 15% 0;
    }

    .slanted {
        position: relative;
        margin-bottom: 25px;
    }

    .slanted:after {
        height: 26px;
        bottom: -25px;
    }

    .welcome-before-title {
        font-size: 32px;
    }

    .welcome-title {
        font-size: 40px;
        line-height: 40px;
    }

    h2 {
        font-size: 38px;
    }

    h2.smaller {
        font-size: 25px;
    }

    .h3 {
        font-size: 22px;
    }

    .what-we-do-element {
        width: 100%;
    }

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

    .portfolio-slider .slider-item {
        width: 50%;
    }

    .portfolio-slider .logos-container {
        height: 390px;
    }

    footer .button {
        min-width: 130px;
    }

    #case-study-page-welcome h1 {
        font-size: 36px;
    }
}

@media screen and (max-width: 450px) {
    #player-page-welcome .wrapper {
        background-position: 150% 25vh;
        background-size: contain;
    }

    #capabilities-page-more .wrapper-wide {
        background-position: 150% 25vh;
        background-size: contain;
    }
}

@media screen and (max-width: 425px) {
    header .header-container .menu-wrap {
        padding-top: 140px;
    }
}