/* CSS Document */


@media only screen and (min-width: 1000px) {
    .member-pos{
        height: 5rem;
    }
    .eye-shape{
        width: 21rem;
        height: 21rem;
        /*background-image: url("img/eye.svg");*/
        background-size: 29rem;
        position: absolute;
        right: -10.5rem;
        top:-10.5rem;
        border: 10px solid #F4F5FB;
        border-radius: 50%;
        filter: drop-shadow(0px 26px 13px rgba(0, 0, 0, 0.1));
        background-position: top right ;
        background-size: 200rem;

        animation: magnify_glass 7s;
        animation-iteration-count: infinite;
        animation-fill-mode: forwards;
        background-repeat: no-repeat;




        box-sizing: border-box;
    }
    @keyframes magnify_glass  {

        0%{
            right: -10.5rem;
            top:-10.5rem;
            background-position: top right ;
        }

        25%{
            right: calc(50% - 10.5rem);
            top:calc(50% - 10.5rem);
            background-position: top -64rem right -84rem;
        }
        35%{
            right: calc(50% - 10.5rem);
            top:calc(50% - 10.5rem);
            background-position: top -64rem right -84rem;
        }

        60%{
            right: -10.5rem;
            top:-10.5rem;
            background-position: top right ;
        }
        100%{
            right: -10.5rem;
            top:-10.5rem;
            background-position: top right ;
        }

    }
    footer .footer-logo{
        filter: brightness(0) invert(1);

    }
    .team-memebers-list li{
        flex: 0 0 37.4rem;
        column-gap: 2rem;
        row-gap: 2rem;

    }

    .footer-logo.mobile{
        display: none;
    }

    .footer-logo.desktop{
        display: block;
    }
}


@media only screen and (min-width: 1000px) and (max-width: 1399px) {

    html,.home-hero-an-stage-perspective{
        font-size: 7px;
    }

    .main-nav li{
        margin-right: 5rem;
    }

}

@media only screen and (min-width: 1400px) and (max-width: 1700px){
    html,.home-hero-an-stage-perspective{
        font-size: 9px;
    }


}


@media only screen and (min-width: 1700px) {
    html{
        font-size: 10px;
    }

}




/*mobile/tablet header*/

@media only screen and (max-width: 1000px) {



    .home-hero-width {
        width: 100%;
    }

    section.home-hero {
        display: block !important;
        max-height: 69.7rem;
    }

    .an-mover {
        position: static;
        width: 62rem;
        width: 100vw;
    }

    .an-mover, .home-hero-an-stage-perspective {
        transform: none !important;


    }


    .home-hero{
    border-radius: 0px 0px 0px 40px;
    }
    .home-hero-text h1 {
        font-size: 3rem;
        text-align: center;
        padding: 0 1rem;
        box-sizing: border-box;
        margin-top: 0;
    }

    .home-hero-text {
        display: block;
        text-align: center;
        flex-direction: column;
        align-items: center;
    }

    .home-hero-text {
        padding-top: 13rem;
    }

    .base-width, .under-hero-area p.sub {
        width: 100%;
    }

    section.under-hero-area {
        display: block !important;
    }

    .under-hero-area h2 {
        font-size: 3.6rem;
        line-height: 3.5rem;
        white-space: pre-line;
    }
    .page-template-story .under-hero-area h2{
        white-space: normal;
    }
    .under-hero-area {
        padding: 7rem 2.3rem 0 2.3rem;
    }

    .under-hero-area p.sub {
        font-size: 2rem;
        line-height: 1.5;
    }

    .iconized-blts-list {
        width: 100%;
        display: block;
        padding: 0 3.2rem;
        box-sizing: border-box;
    }

    section.testemonials-area {
        display: block !important;
    }

    .preview {
        display: none;
    }

    .main-view-items .quote {
        font-size: 2.5rem;
    }

    .main-view {
        padding: 0 3.2rem;
        box-sizing: border-box;
        text-align: center;
    }
    .home-hero-width{
        display: block;
    }
    .quotes-area:before {
        content: '';
        display: block;
        position: absolute;
        width: 13rem;
        height: 9.6rem;
        background-image: url(img/q_mark.svg);
        background-size: contain;
        left: 0;
        top: -13rem;
        right: 0;
        margin: auto;
        background-repeat: no-repeat;
    }

    .quotes-area .splide__pagination {
        justify-content: center;
        width: 100%;
        top: auto;
        bottom: -4rem !important;
    }

    .testemonials-area {
        padding-bottom: 13rem;
    }

    section.from-to-area {
        display: block !important;
        padding: 0 2.6rem;
        box-sizing: border-box;

    }

    section.from-to-area .base-width {
        padding-bottom: 5rem;
        border-bottom: 1px solid #333333;
        margin-bottom: 5rem;
    }

    .ft-left h2 {
        text-align: center;
        font-size: 3.4rem;
    }

    .ft-left p {
        width: 100%;
    }

    .from-to-area .base-width {
        display: block;
    }

    .ft-right .img-con {
        width: calc(100vw - 10rem);
        margin: auto;
        height: 26rem;

    }

    .eye-shape {



        width: 12rem;
        height: 12rem;
        right: -3.5rem;
        top: -4.5rem;
        background-size: 100rem;
        position: absolute;
        border: 10px solid #F4F5FB;
        border-radius: 50%;
        filter: none;
        background-position: top 0 right 0;
        background-repeat: no-repeat;
animation: magnify_glass_2 7s;
        animation-iteration-count: infinite;


    }
    .eye-shape:before {
        position: absolute;
        display: block;
        content: '';
        width: 16.2rem;
        height: 14.7rem;
        background-image: url("img/shad2.png");
        background-size: 16.2rem;
        right: -3.3rem;
        top: 1.4rem;
    }
    .ft-left p {
        text-align: center;
    }

    @keyframes magnify_glass_2 {

        0% {
            right: -3.5rem;
            top: -4.5rem;
            background-position: top right;
        }

        25% {
            right: calc(50% - 6.5rem);
            top: calc(50% - 6.5rem);
            background-position: top -33rem right -43rem;
        }
        35% {
            right: calc(50% - 6.5rem);
            top: calc(50% - 6.5rem);
            background-position: top -33rem right -43rem;
        }

        60% {
            right: -3.5rem;
            top: -4.5rem;
            background-position: top right;
        }
        100% {
            right: -3.5rem;
            top: -4.5rem;
            background-position: top right;
        }

    }


    .ft-left {
        text-align: center;
    }

    .from-to-area .prpl-btn {
        margin-bottom: 4rem;
    }

    section.team {
        display: block !important;
    }

    section.team .splide__pagination {
        width: 100%;
        justify-content: center;
    }

    .member-text {
        padding: 0 2.3rem;
        box-sizing: border-box;
        text-align: center;
    }

    .member-header {
        flex-direction: column;
        align-items: center;
    }

    .member-image {
        width: 12rem;
        height: 12rem;
    }

    .member-title {
        margin: 1rem 0 0 0;
        text-align: center;
    }

    .team-splide {
        width: 100vw !important;
    }
    .dialer-con{
        width: calc(100vw - 4.6rem);

    }

    section.partners-area {
        display: block !important;
    }

    .partners-area h2 {
        font-size: 2.4rem;
        margin-bottom: 8rem;
    }

    .team {
        margin-bottom: 9rem;
    }

    .partners-area {
        padding-top: 0;
    }

    .logos-list {
        column-gap: 0;
        padding: 0 2rem;
        box-sizing: border-box;
        justify-content: space-between;
        row-gap: 1.6rem;

    }

    .logos-list li {
        flex: 0 0 25%;
        padding: 0 .5rem;
        box-sizing: border-box;
    }

    .logos-list li img {
        width: 100%;
        height: auto;
    }

    section.story-hero {
        display: block !important;
        padding: 15rem 2.6rem 0 2.6rem;
        box-sizing: border-box;
        min-height: 75rem;
    }

    .story-hero .base-width {
        display: block;
    }

    .story-hero-text h1, .contact-hero-text h1 {
        font-size: 3rem;
        text-align: center;
        margin: 0;
        white-space: normal;
    }


    .story-hero-an-stage {
        margin-top: 8rem;
    }

    .red-shad {
        background: url(img/shad.png) no-repeat center;
        background-size: contain;
        width: 129vw;
        height: 130vw;
        left: -19vw;
        top: -10%;
        opacity: 0;
    }

    .story-hero-an-stage svg {
        width: 90%;
        height: auto;
        margin: auto;
        display: block;
        position: relative;

        left: -4%;
    }

    .story-hero {
        height: 100vh;

    }

    .s-uh-width {
        width: 100%;
    }

    section.s-u-h-a {

        padding:7rem 2.3rem 11rem 2.3rem;
        box-sizing: border-box;
    }
    .page-template-story section.s-u-h-a{
        padding-top: 5rem;
    }
    .dial-wrapper {
        width: 15rem;
        height: 15rem;
    }

    section.full-story-area {
        display: block !important;
    }

    .dial-1 {
        width: 15rem;
        height: 15em;
        background-size: 15rem;
    }

    .dial-2 {
        width:12rem;
        height: 12rem;
        background-size: 12rem;
    }

    .dial-3 {
        width: 9rem;
        height: 9rem;
        background-size: 9rem;
    }

    .dial-4 {
        width: 4rem;
        height: 4rem;
        background-size: 4rem;
    }

    .dialer-con {

        bottom: -7.7rem;
    }

    .story-1 .story-left{
        padding-left: 0;
    }

    .story{
       flex-direction: column;
        padding: 0 2.3rem;
        box-sizing: border-box;
    }
    .story .small-title{
        text-align: center;
    }
    .story h2{
        font-size: 3rem;
        text-align: center;
    }
    .story-left, .story-right{
        flex:auto;
    }
    .story .paragraph,.story-left, .story-right{
        width: 100%;
        text-align: center;
    }
    .full-story-width{
        width: 100%;
    }
    .p1-1 {
        width: 5.9rem;
        height: 5.9rem;
        background-image: url(img/plx_1_1.svg);
        background-size: 5.9rem;

        right:-10rem;
    }
    .p1-2 {
        width: 14.7rem;
        height: 12.9rem;
        background-size:19.7rem;
        right: 5rem;
    }
    .p1-3 {
        width: 19.6rem;
        height: 12.9rem;
        background: url(img/plx_1_2.svg);
        background-size: 19.6rem;
        background-repeat: no-repeat;
        position: absolute;
        left: 5rem;
        top: 17rem;
        z-index: 0;
    }
    .p1-4 {
        width: 5rem;
        height: 5rem;
        position: absolute;
        right: 5rem;
        top: 30rem;
        background: url(img/plx_1_3.svg);
        background-size: 5rem;
        z-index: 999999;
    }
    .story-right{
        padding: 0 4rem;
        box-sizing: border-box;
        margin-top: 7rem;
    }
    .story-1 .story-right{
        height: 21rem;;
    }
    .story-2{
        flex-direction: column-reverse;
    }
    .story-2 .story-right{
        padding: 0;
    }
    .story-1{
        margin-bottom: 8rem;

    }
    .story-2 .story-left{
        margin-top: 7rem;
    }
    .full-story-area{
        padding-bottom: 10rem;
        padding-top: 10rem;
    }
.offices-area{
    padding: 5rem 2.3rem;
    box-sizing: border-box;
}
    section.standing-out-area{
        display: block !important;
    }
    .s-o-frame{
        display: block;
        border-radius: 0;
        width: 100%;
        padding:8rem 2.3rem;
        box-sizing: border-box;

    }
    .s-o-icon{
        display: flex;
        justify-content: center;
    }
    .s-o-left{
        display: block;
    }
    .s-o-left p{
        text-align: center;
    }

    .s-o-left h2{
        font-size: 3rem;
        text-align: center;
    }
    .s-o-right{
        padding-left: 0;
    }
    .s-o-q{
        font-size: 2.5rem;
        text-align: center;
        margin-bottom: 4rem;
    }
    .grad-line {
margin-top: 8.7rem;
    }
    .s-o-n{
        font-size: 2rem;
        text-align: center;
    }
    .s-o-w{
        font-size: 1.6rem;
        text-align: center;
    }

    section.team-area{
        display: block !important;
        padding: 0 2.6rem;
        box-sizing: border-box;
    }
    .team-list li{
        flex: 0 0 48.5%;
    }
    .team-list{
        column-gap: 0;
        justify-content: space-between;
    }
    .tm-image{
        height: 21rem;
    }

    .team-area h2{
        font-size: 3rem;
        text-align: center;
        margin: 8rem 0;
    }
    .team-list li h3{
        font-size: 1.8rem;
    }
    .team-list li p{
        font-size: 1.6rem;
    }
    .team-list  {
        row-gap: 4.6rem;
    }
    .mt66{
        margin: 2rem 0 10rem 0;
    }
    .c-con-1{
        right: -8rem;
        top: 4.2rem;
    }
    .c-con-3 {
        position: absolute;
        left: -4.8rem;
        top: 6rem;
    }

    .c-circ-1 {
        width: 15rem;
        height:15rem;

        background-size:15rem;
    }
    .c-circ-3{
        width:9.9rem;
        height:9.9rem;

        background-size:9.9rem;
    }
    section.story-hero{
        padding-top: 20rem;
    }
    .contact-hero-text p{
        text-align: center;
    }

    section.jobs-area{
        display: block !important;
        padding-left: 2.3rem;
        padding-right: 2.3rem;
        box-sizing: border-box;
        padding-top: 7rem;
        padding-bottom: 7rem;
    }

    .jobs-list{
        display: block;
        float: none;
        width: 100%;
    }
    .jobs-area h2{
        font-size: 3rem;
        text-align: center;
    }
    .jobs-list h3{
        text-align: left;
    }
    .jobs-list li{
        padding-left: 2.3rem;
    }

    .c-circ-2 {
        width: 36rem;
        height: 36rem;

    }

    .c-con-2 {
        position: absolute;
        right: -11rem;
        top: 49rem;
    }

    .c-circ-4 {
        width: 11rem;
        height: 11rem;
        border-radius: 50%;
        background: url(img/cc-4.svg) top center no-repeat;
        background-color: #3043D2;
        opacity: 1;
        background-size: 11rem;
    }
    .c-con-4 {
        position: absolute;
        right: 2.4rem;
        top: 42.9rem;
    }

    .c-circ-5 {
        width: 27rem;
        height: 27rem;

        background-size: 27rem;
    }

    .c-con-5 {
        position: absolute;
        left: -13.5rem;
        top: 36rem;
        z-index: 99999999999;
        display: none;
    }

    section.c-form-area{
        display: block !important;
        padding: 0 2.3rem;
        box-sizing: border-box;
    }

    .c-form-area h2{
        font-size: 3rem;
        text-align: center;
        margin-top: 7rem;
    }
    .form-area .form-flex{
        display: block;
    }
    .form-area input:not(input[type="submit"]), .form-area select{
        height: 7rem;
    }
    .wpcf7-form-control-wrap{
        margin-bottom: 1.3rem;
    }
    .wpcf7 form.invalid .wpcf7-response-output {

        transform: translateY(2.5rem);
    }
    .sub-holder{
        display: flex;
        justify-content: center;
    }
    .wpcf7-spinner{
        position: absolute;
        right: 2rem;
    }
    .form-area input[type="submit"]{
        padding: 0 5rem;
    }
    .thank-you-msg{
        height: 30rem;
        top: auto;
        bottom: 9rem;
    }
    .home-hero-an-stage-perspective {

       perspective: none;
        right: auto;
        left: 0;
       bottom: 0;
        position: static;
    }
    .home-hero-an-stage{
        position: static;
    }
    #phone{
        top: 0;
        left: 0;
        width: 14em;
        height: 30em;
        transform: translate(calc(50vw - 7em));

    }
    #top-blue-circle{
        width: 10rem;
        height: 10rem;
        top:0;
        left: 0;
        transform: translate(calc(50vw + 2em),2em);
    }
    #switches{
        z-index: 1;
        width: 4rem;
        left: 0;
        top: 0;

        transform: translate(calc(50vw + 9em),3em);

    }
    #grad-line{
        width: 12rem;
        height: 12rem;
        left: 0;
        top:0;
   transform:  translate(calc(50vw - 13em),14em);
    }
    .phone-bg{
        border-radius: 2.7em;
    }

    #scene_2_tiktok {
        width: 2.6em;
        top: calc(50% - 14em);
        left: 10em;
        transform: translateZ(13.2em);
    }

    .middle-third{
        display: none;
    }

    header{
        height: 7rem;
        padding: 0 2.4rem;

    }

    .header-content,header.smaller .header-content{
        height: 7rem;
        position: relative;
    }
    .footer-logo.mobile{
        display: block;
        margin-bottom: 0.5rem;
    }

    .footer-logo.desktop{
        display: none;
    }
    footer .f-c{
        width: 100%;
        height: 0;
position: absolute;
        padding-bottom: 100%;
    }
    .main-slide{
        max-width: calc(100vw - 6.4rem);
    }
    .mobile-f-c{
        height: 100vw;
        width: 100vw;
        display: block;

        position: fixed;
        bottom: 0;
        left: 0;
        overflow: hidden;
    }
    footer ul, footer nav, footer .footer-content{
        display: block;
    }

    footer{
        padding: 0 2rem;
        box-sizing: border-box;
    }
    .get-in-touch a{
        display: block;
    }
    .small-width{
        width: 100%;
    }
    footer .social-menu ul{
        display: flex;
        justify-content: flex-start;
    }
    #maskd1{
        background-position: center;
        background-repeat: no-repeat;
        width: 10rem;
        height: 10rem;
        left: 0;
        top:0;
        background-size: 10rem;
transform:translate(calc(50vw - 8em),10em);
    }
    .home-hero-an-stage{
        margin-top: 4rem;
    }
    #tikotaks {
        width: 2em;
        top: 0;
        left: 0;
        transform: translateZ(0);
        transform: translate(calc(57vw - 11em),3em);
    }
    #dashed{
        width: 10rem;
        height: 10rem;
        background-size: contain;
        background-position: center;
        left: 0;
        top:0;
        z-index: 2;
        transform: translate(calc(57vw - 7em),4em);

    }
    .masked1-inner svg circle {
        stroke-width: 73px;
    }
   #maskd2{
       width: 6rem;
       height: 6rem;
       background-size: contain;
       background-position: center;
       left: 0;
       top: 0;
       z-index: 2;
       transform: translate(calc(50vw - 0em),21em);
    }
    .masked1-inner {
        width: 100%;
        height: 100%;
        transform: translateX(2.6em) translateY(4.2em);
    }
    footer nav{
        margin: 4rem 0;
    }
    footer nav li{
        margin-bottom: 2rem;
    }
    #up-arrow{
        position: absolute;
        right: 0;
        top: 0;
        z-index: 99999999;
    }
#scene_2_tiktok{
    display: none !important;
}
    .partners-area{
        padding-bottom: 5rem;
    }
    .team-memebers-list{
        column-gap: 0;
    }
    .splide_width{
        display: block;
        width: 100vw;
    }
    .team .prpl-btn{
        margin-top: 4rem;
    }
    .story-hero-text h1{
        white-space: pre-line;
    }
    #bubbles{
        width: 4rem;
        height: 4rem;
        top:0;
        left: 0;
        transform: translate(calc(50vw - 14rem ),22em);
    }
    .story-left{
        padding-top: 5rem;
    }
    .ft-left{
        padding-top: 7rem;
    }
    .thank-you-msg{
        width: 100%;
        padding: 0 2rem;
        box-sizing: border-box;
    }
    #phone ul {
        font-size: 1.6em;
        transform: translate(0, -1.6em);
        height: 18em;
    }

    .pli-4, .pli-2 {
        transform: translateX(-0.5em);
    }
    .pli-5, .pli-1 {
        transform: translateX(-2em);
    }
    .main-nav a{
        font-size: 1.8rem;
    }
/*
    #top-blue-circle{
        width: 12rem;
        height: 12rem;
        transform: translate(-6rem, 6rem);
    }

    #bubbles{
        width: 8rem;
        height: 8rem;
        top:0;
        left: 0;
        transform: translate(-4rem ,8em);
        z-index: 99;
    }

    #grad-line{
        width: 23rem;
        height: 23rem;
        transform: translate(-11.5rem ,.5em);
    }

    .g-line{
        stroke-width: 7;
    }

    #dashed{
        width: 23rem;
        height: 23rem;
        transform: translate(-11.5rem ,.5em);
        background-size: contain;
    }
#maskd1{
    width: 36rem;
    height: 36rem;
    transform: translate(-18rem ,-5.9em) rotate(90deg);

}
    .masked1-inner{
        transform: translate(0,0);
    }
    .masked1-inner svg circle{
        stroke-width: 45;
    }

    .g-line-2 {

        stroke-width: 3;

        stroke-dasharray: 10,14;
    }*/

    .naked-page h1 {
        font-size: 3.4rem;
    }

    .naked-page p, .naked-page ul, .naked-page li {
        font-size: 1.4rem;
    }

    .page-template-Textual .base-width {
        width: 100%;
        padding: 0 3rem;
        box-sizing: border-box;
        margin-top: 11rem;
    }
}




    /*mobile devices*/
@media only screen and (max-width: 600px) {


}