@media (min-width: 1025px) {
    html body {
        font-size: 0.694vw;
    }
}

@media (min-width: 768px) {
    html body {
        font-size: 0.9vw;
    }

    .d-md-block {
        display: block !important;
    }

    .d-md-none {
        display: none !important;
    }

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

    .section-two .layout {
        padding: 0 3.6rem;
    }

    .section-two .title-wrapper {
        padding: 0 3rem;
    }

    .whydo {
        left: 0;
        padding: 0;
        position: absolute;
        top: 0.6rem;
        width: 2rem;
    }

    .section-two .title {
        font-size: 3rem;
        line-height: 3rem;
        max-width: 84%;
        text-indent: 3rem;
    }

    .half-cricle {
        position: absolute;
        bottom: -60px;
        left: 69px;
        transform: rotate(20deg);
        width: 4rem;
        height: 2rem;
        background-color: var(--dark-choclate);
        border-radius: 0 0 10rem 10rem;
    }

    .section-two .text {
        display: flex;
        gap: 1rem;
        margin-top: 3rem;
        padding: 0 0 0 8rem;
    }

    .section-two .inner {
        position: relative;
    }

    .section-two svg {
        position: absolute;
        top: 0;
        left: -140px;
        height: 300px;
        object-fit: contain;
        opacity: 0.6;
        color: #fbc4c5;
    }

    .section-three svg {
        /* position: absolute;
        top: 2rem;
        left: -140px;
        height: 300px;
        object-fit: contain;
        opacity: 0.6;
        color: #fcf3f3; */
    }

    .section-five img.dark-logo {
        position: absolute;
        top: 2rem;
        left: -140px;
        height: 300px;
        object-fit: contain;
        opacity: 0.6;
    }

    /* #adFilmProduction .title-section,
  #transitMedia .title-section {
    padding: 2.2rem 0 0 3rem;
  } */
}

@media (max-width: 768px) {
    .menu-icon {
        width: 2.2rem;
        height: 2.2rem;
        position: unset;
    }

    .menu-top .closebtn i {
        font-size: 20px;
        line-height: 0;
    }

    .closebtn {
        width: 30px;
        height: 30px;
        background: white;
    }

    .closebtn i {
        color: white;
    }

    .menu-row {
        display: block;
    }

    .menu-row .menu-left-col {
        width: auto;
        padding: 0;
    }

    .overlay .closebtn {
        position: relative;
        z-index: 10;
        background: var(--text);
    }

    .menu-link ul li {
        font-size: 7rem;
        line-height: 8rem;
    }

    .menu-link p {
        font-size: 3rem;
        line-height: 2.6rem;
    }

    .menu-link {
        height: calc(100vh - 20rem);
        padding-top: 0;
        align-items: center;
        justify-content: center;
        padding: 0;
    }

    .more-menu {
        background: #eb8b8d;
        height: 12rem;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        width: 100%;
        bottom: 0;
        color: white;
    }

    .more-menu .menu-text {
        font-size: 12rem;
        text-transform: uppercase;
        opacity: 0.5;
        line-height: 9rem;
    }

    .more-menu .add {
        background: white;
        border-radius: 10rem;
        width: 4rem;
        height: 4rem;
        position: absolute;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 1;
    }

    .more-menu i {
        font-size: 3rem;
        color: var(--dark-pink);
        line-height: 0;
    }

    .menu-row .menu-right-col {
        position: absolute;
        z-index: 6;
        height: 100%;
        width: 100%;
        bottom: -94rem;
        transition: all 1s;
    }

    .menu-right-col ul li a {
        font-size: 7.6rem;
    }

    .close-more-menu {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        color: #f4babc;
        background: #eb8b8d;
    }

    .menu-right-col ul li {
        height: 14.28571428571429%;
    }

    .close-more-menu p {
        font-size: 10rem;
        color: #f4babc;
        font-weight: 500;
        text-transform: uppercase;
        line-height: 6rem;
    }

    .menu-right-col ul li i {
        background: white;
        border-radius: 10rem;
        width: 4rem;
        height: 4rem;
        position: absolute;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 1;
        font-size: 3rem;
    }

    .service-row {
        display: block;
        height: 100%;
    }

    .service-col-left {
        width: auto;
        background: none;
        height: calc(100% - 12rem);
    }

    .service-col-left .middle-content {
        width: auto;
        background: var(--light-pink-bg);
        padding-left: 0;
        padding: 2rem;
        /* height: 85%; */
    }

    .service-col-left .middle-content .title {
        font-size: 16rem;
        line-height: 11rem;
    }

    .service-col-left .middle-content .sub-title {
        font-size: 6rem;
        line-height: 5.6rem;
    }

    .service-logo {
        top: auto;
        right: auto;
        height: auto;
        width: 100%;
        bottom: -6rem;
    }

    .service-col-right {
        display: none;
    }

    .service-logo .service-logo-circle {
        width: 14rem;
        height: 14rem;
    }

    .service-logo img {
        width: 80%;
        height: auto;
        position: relative;
    }

    .fab-btn {
        /* position: fixed; */
        /* right: 2rem; */
        /* bottom: 2rem; */
        width: 6rem;
        height: 6rem;
        background: var(--dark-pink);
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 10rem;
        z-index: 2;
        font-size: 1.6rem;
        color: white;
    }

    #method-section {
        position: relative;
        z-index: 2;
    }

    #portfolio-section {
        position: relative;
        z-index: 2;
        padding: 5rem 0 0;
    }

    .form-section {
        position: relative;
        z-index: 2;
    }

    .social-links {
        position: relative;
        z-index: 2;
    }

    .footer-bottom {
        position: relative;
        z-index: 2;
    }

    .service-menu ul li a {
        font-size: 1.3rem;
        white-space: nowrap;
        padding: 0 1rem;
    }

    .m-service-menu {
        position: fixed;
        /* width: 2rem; */
        height: auto;
        bottom: 2rem;
        right: 2rem;
        z-index: 2;
        overflow: hidden;
        display: flex;
        align-items: flex-end;
        border-bottom-left-radius: 3rem;
        border-bottom-right-radius: 3rem;
        width: 8rem;
        justify-content: center;
        /* transition: all 1s; */
        cursor: pointer;
    }

    .m-service-menu:hover {
        transition: height 6s;
        height: 26.4rem;
    }

    .m-service-menu .service-list {
        position: absolute;
        bottom: -16rem;
        width: 100%;
    }

    .service-menu li {
        text-align: center;
    }

    .service-menu {
        background: white;
        margin-bottom: 1rem;
        border-radius: 0.5rem;
        width: 100%;
        transition: all 1s;
        bottom: -6rem;
    }

    .popover-up {
        bottom: 22rem;
    }

    .service-menu ul {
        line-height: 2.4rem;
    }

    .ooh-menu {
        right: unset;
        height: auto;
        bottom: 2rem;
    }

    .ooh-section {
        transform: none;
        gap: 1.6rem;
    }

    .ooh-menu-link {
        /* -ms-transform: scale(2);
    -webkit-transform: scale(2);
    transform: scale(2); */
        transform-origin: left;
        padding: 0.4rem 0.2rem;
        transition: all 1s;
    }

    .title-section {
        padding: 8rem 0 0 5rem;
    }

    .title-section .heading {
        display: block;
    }

    .title-section .heading .heading-title {
        font-size: 9rem;
        line-height: 6.6rem;
    }

    .title-section .heading h6 {
        font-size: 4.2rem;
        width: auto;
        line-height: 4.2rem;
        margin-left: 13rem;
        margin-top: 7rem;
        margin-right: 1.4rem;
    }

    .title-section p {
        font-size: 2.4rem;
        margin: 4rem 2rem 0 13rem;
        width: auto;
    }

    /* ohh section */
    #oohAdvertising .title-section p {
        margin-left: 0;
        font-size: 2.5rem;
        line-height: 2.5rem;
        margin-top: 1.5rem;
    }

    #oohAdvertising .title-section .heading h6 {
        margin-left: 0;
        margin-top: 2rem;
        margin-right: 0;
        font-size: 4rem;
        width: auto;
        line-height: 4rem;
    }

    #oohAdvertising .title-section .heading {
        /* margin-right: 2rem; */
    }

    #oohAdvertising .title-section p.sub-content {
        margin: 2rem 0 0 0;
        width: auto;
        color: var(--rhythm);
        font-size: 2.5rem;
        line-height: 2.5rem;
        font-weight: normal;
    }

    /* #oohAdvertising {
    display: none;
  } */
    #oohAdvertising #retailResidential .title-section .heading p.sub-content {
        width: auto;
    }

    #oohAdvertising .title-section {
        padding: 12rem 0 0 18rem;
        margin-right: 2rem;
    }

    #oohAdvertising .service-back-btn {
        /* top: 7.5rem;
    left: unset;
    right: 17rem; */
        display: none;
    }

    #oohAdvertising .title-section .heading .heading-title {
        font-size: 8rem;
        line-height: 6.2rem;
    }

    #oohAdvertising #oohAd .title-section .heading .heading-title span {
        font-size: 6rem;
    }

    #oohAdvertising #oohAd .title-section .heading .heading-title {
        white-space: normal;
        line-height: 5rem;
        margin-top: 1rem;
    }

    #oohAdvertising .ooh-menu {
        bottom: 0;
        top: 0;
        padding-top: 5rem;
        background: var(--lavender);
        z-index: 2;
    }

    #oohAdvertising .ooh-menu .ooh-section {
        gap: 1.4rem;
    }

    #oohAdvertising {
        padding-top: 5rem;
    }

    .service-back-btn {
        top: 4.5rem;
        left: 5rem;
    }

    .service-back-btn i {
        font-size: 2.5rem;
    }

    .title-section .sub-title {
        font-size: 2.8rem;
        line-height: 2.8rem;
    }

    .heading .sub-content {
        font-size: 1.4rem;
        font-family: "Manrope";
        line-height: normal;
        font-weight: bold;
        margin-top: 4rem;
    }

    .ooh-menu-link:hover {
        -ms-transform: scale(1.2);
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }

    .mall-sub-title,
    .media-sub-title,
    .sport-sub-title,
    .digital-sub-title {
        font-size: 3rem;
    }

    .title-section p.mall-sub-text {
        position: unset;
        margin: 0.5rem 2rem 0 0;
        font-size: 2.5rem;
        width: auto;
        color: var(--dark-pink);
        line-height: 2.5rem;
    }

    /* mobile section start */
    .oohAdvertising {
        position: relative;
        z-index: 2;
        background: var(--lavender);
    }

    .ohh-row {
        display: block;
        height: calc(100vh - 0px);
    }

    .oohAdvertising .ohh-row .heading {
        width: auto;
        min-width: auto;
        padding: 6rem 1.5rem;
        height: calc(100vh - 0px);
        gap: 2rem;
    }

    .oohAdvertising .ohh-row .heading .heading-title,
    .ohh-advert .ohh-content .ohh-sec .ohh-sec-title {
        font-size: 10rem;
        color: white;
        text-transform: uppercase;
        font-family: "Deutschlander 2.0";
        line-height: 8rem;
    }

    .oohAdvertising .ohh-row .heading h6 {
        color: var(--rhythm);
        text-transform: uppercase;
        margin-left: 0;
        margin-top: 2rem;
        margin-right: 0;
        font-size: 4rem;
        width: auto;
        line-height: 4rem;
    }

    .ohh-advert .ohh-content .sub-title {
        color: white;
        text-transform: uppercase;
        font-size: 2.8rem;
        line-height: 2.8rem;
    }

    .ohh-advert .ohh-content {
        padding: 2rem;
    }

    .oohAdvertising .ohh-row .heading p,
    .ohh-advert .ohh-content .ohh-sec p {
        color: var(--rhythm);
        margin-top: 0.4rem;
        font-size: 2.5rem;
        line-height: 2.5rem;
        text-transform: uppercase;
        font-weight: normal;
    }

    .oohAdvertising .ohh-row .ohh-advert {
        display: block;
        height: auto;
    }

    .ohh-advert .ohh-image {
        height: 100%;
    }

    .ohh-advert .ohh-image img {
        width: 100%;
        object-fit: cover;
        height: 100%;
    }

    /* ohh end  */
    #mediaBranding .title-section p.media-sub-text {
        position: unset;
        margin: 2rem 2rem 0 0;
        font-size: 2.5rem;
        line-height: 2.5rem;
        width: auto;
        color: #7a6e92;
    }

    .title-section p.sport-sub-text {
        position: unset;
        margin: 2rem 2rem 0 0;
        font-size: 2.5rem;
        line-height: 2.5rem;
        width: auto;
        color: white;
    }

    .gantry a {
        /* font-size: 4.6rem;
    line-height: 4rem; */
        font-size: calc(4.6rem * 1);
        line-height: calc(3.4rem * 1);
        height: calc(3.3rem * 1);
    }

    .skywalk a {
        /* font-size: 4.8rem;
    line-height: 4.2rem; */
        font-size: calc(4.6rem * 1.1);
        line-height: calc(3.4rem * 1.1);
        height: calc(3.3rem * 1.1);
    }

    .unipole a {
        /* font-size: 7rem;
    line-height: 6rem; */
        font-size: calc(4.6rem * 1.5);
        line-height: calc(3.4rem * 1.5);
        height: calc(3.3rem * 1.5);
    }

    .building-facade a {
        /* font-size: 3.6rem;
    line-height: 3.2rem; */
        font-size: calc(4.6rem * 0.8);
        line-height: calc(3.4rem * 0.8);
        height: calc(3.3rem * 0.8);
    }

    .billboard a {
        /* font-size: 4.8rem;
    line-height: 4.2rem; */
        font-size: calc(4.6rem * 1.04);
        line-height: calc(3.4rem * 1.04);
        height: calc(3.3rem * 1.04);
    }

    .retail-residential a {
        /* font-size: 2.4rem;
    line-height: 2.3rem; */
        font-size: calc(4.6rem * 0.5);
        line-height: calc(3.4rem * 0.5);
        height: calc(3.3rem * 0.5);
    }

    .pole-kiosk a {
        /* font-size: 3.8rem;
    line-height: 3.4rem; */
        font-size: calc(4.6rem * 0.8);
        line-height: calc(3.4rem * 0.8);
        height: calc(3.3rem * 0.8);
    }

    .bus-shelter a {
        /* font-size: 4.6rem;
    line-height: 4rem; */
        font-size: calc(4.6rem * 1);
        line-height: calc(3.4rem * 1);
        height: calc(3.3rem * 1);
    }

    .road-medians a {
        /* font-size: 3.4rem;
    line-height: 3rem; */
        font-size: calc(4.6rem * 0.7);
        line-height: calc(3.4rem * 0.7);
        height: calc(3.3rem * 0.7);
    }

    .mallbranding-menu {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        bottom: 1rem;
    }

    .mallbranding-section {
        width: calc(13.184rem * 2);
        height: calc(14.649rem * 2);
    }

    .mall-menu-facade-block {
        width: calc(6.836rem * 2);
        height: calc(5.8594rem * 2);
        margin-right: calc(3.418rem * 2);
    }

    .mall-menu-atrium-block {
        width: calc(6.836rem * 2);
        height: calc(6.836rem * 2);
        margin-right: calc(3.418rem * 2);
        bottom: 4.9534rem;
    }

    .mall-menu-floors-block {
        width: calc(2.9298rem * 2);
        height: calc(9.375rem * 2);
        padding-top: calc(0.8rem * 2);
        bottom: calc(1.9534rem * 2);
    }

    .mall-menu-auditorium-block {
        width: calc(3.418rem * 2);
        height: calc(11.3284rem * 2);
    }

    .mall-menu-parking-block {
        width: calc(9.7659rem * 2);
        height: calc(1.9534rem * 2);
    }

    .mall-menu-facade-block p {
        font-size: calc(2.6rem * 2);
        bottom: 4.9534rem;
    }

    .mall-menu-atrium-block p {
        font-size: calc(2.6rem * 2);
    }

    .mall-menu-floors-block p {
        font-size: calc(2.8rem * 2);
    }

    .mall-menu-auditorium-block p {
        font-size: calc(3.3rem * 2);
    }

    .mall-menu-parking-block p {
        font-size: calc(2rem * 2);
    }

    .mediabranding-section {
        width: 100%;
        height: calc(2.1096rem * 12.5);
    }

    .media-menu-block p {
        font-size: calc(1.8rem * 2.5);
        line-height: 4rem;
    }

    .mediabranding-menu {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        padding: 2rem 3rem;
        bottom: 1rem;
    }

    .mediabranding-menu .position-relative {
        width: 100%;
    }

    .media-menu-block {
        padding: 1.4rem;
    }

    .media-circle-icon {
        top: 0;
        left: 0;
    }

    .media-circle-icon svg {
        width: 14rem;
    }

    #sportBranding .sport-section-left {
        width: 100%;
    }

    #sportBranding .inner-section {
        /* height: 60%; */
    }

    .sport-row {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .m-bails-section {
        display: flex;
        align-items: flex-end;
        gap: 1rem;
        padding: 2rem 0;
    }

    .bails-icon {
        position: unset;
        margin-bottom: 2rem;
    }

    .sport-section-right .right-list {
        position: unset;
    }

    #sportBranding .sport-section-right {
        /* height: 40%; */
        background: #e48a8a;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .m-bails-section .left-list ul li {
        text-align: right;
    }

    .m-bails-section .left-list .sport-sub-heading {
        text-align: right;
        font-size: 2.2rem;
        color: #1f3031;
        opacity: 0.6;
        font-weight: 600;
    }

    .m-bails-section .right-list .sport-sub-heading {
        font-size: 2.2rem;
        color: #1f3031;
        opacity: 0.6;
        font-weight: 600;
    }

    .bails-icon svg {
        width: 7rem;
    }

    .sport-section-right .right-list ul li,
    .sport-section-right .left-list ul li {
        font-size: 2.5rem;
        color: white;
        line-height: 2.66rem;
        opacity: 0.6;
    }

    .m-bails-section .left-list ul,
    .m-bails-section .right-list ul {
        margin-bottom: 2rem;
        padding-left: 0;
    }

    .sport-section-right .right-list .sport-sub-heading,
    .sport-section-right .left-list .sport-sub-heading {
        font-size: 3rem;
        margin-top: 0;
        color: #871a22;
        opacity: 0.6;
    }

    .digital-row {
        display: block;
    }

    #digitalBrand .title-section p {
        margin: 2rem 0 0 0;
        position: unset;
        color: white;
        width: 14rem;
    }

    #digitalBranding .digital-section-left {
        width: auto;
    }

    #digitalBranding .digital-section-right {
        width: auto;
    }

    #digitalBranding .digital-section-right {
        position: absolute;
        bottom: 5rem;
        right: 0;
        display: flex;
        flex-direction: column;
        gap: 1.2rem;
        background: transparent;
        z-index: 2;
    }

    .digital-menu-list .strip {
        font-size: 2.4rem;
        /* padding-top: 0.1rem; */
        line-height: normal;
    }

    .digital-section-right .digital-menu-list {
        height: 2.4rem;
        width: 15.2rem;
        align-items: center;
        background: transparent;
    }

    .digital-menu-list .strip:hover {
        transform-origin: right;
        -ms-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    .title-section p.digital-sub-text {
        width: 14rem;
        margin: 2rem 0 0 0;
        position: unset;
        line-height: 2.2rem;
        font-size: 2.2rem;
    }

    .digital-menu-list .strip.active {
        transform-origin: right;
        -ms-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        background: #405565;
        color: white;
    }

    #transitMedia .title-section p.sub-text {
        margin: 2rem 2rem 0 0;
        position: unset;
        font-size: 2.5rem;
        line-height: 2.5rem;
    }

    .transit-media-card {
        right: 0;
        left: 0;
        width: 100%;
        /* transform: scale(2.5);
    bottom: 4rem; */
        height: calc(12rem * 2.02);
        z-index: 1;
    }

    .active.airport-card svg,
    .active.bus-card svg,
    .active.metro-card svg {
        width: calc(12rem * 2.4);
    }

    .metro-card {
        top: calc(-1rem * 2.5);
        /* transform: scale(1.4); */
    }

    .metro-card svg {
        width: calc(10rem * 2.4);
    }

    .bus-card svg {
        width: calc(8.4rem * 2.4);
    }

    .bus-card {
        top: calc(-2rem * 2.5);
        /* transform: scale(1.4); */
    }

    #adFilmProduction .title-section p.sub-text {
        position: unset;
        margin: 2rem 2rem 0 0;
        font-size: 2.5rem;
        line-height: 2.5rem;
        width: auto;
        color: white;
    }

    .adFilm-menu {
        position: absolute;
        right: 0;
        bottom: -6rem;
        z-index: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        transform: scale(2);
        z-index: 2;
    }

    #adFilmProduction .adFilm-menu .parent-circle svg {
        font-size: 1rem;
    }

    .method-row {
        display: block;
        /* height: calc(100vh - 0px); */
        /* overflow: auto; */
    }

    #method-section .heading {
        width: auto;
        min-width: auto;
        padding: 6rem 1.5rem;
        height: calc(100vh - 0px);
        gap: 2rem;
    }

    #method-section {
        overflow: hidden;
        height: auto;
    }

    .method-section {
        display: block;
    }

    .method-image img {
        width: 100%;
    }

    .method-logo {
        position: unset;
        height: auto;
        display: block;
        width: 100%;
        text-align: center;
    }

    .method-logo svg {
        width: 12rem;
    }

    #method-section .heading {
        font-size: 18rem;
        line-height: 16rem;
    }

    #method-section .heading p {
        font-size: 2rem;
    }

    .image-content {
        width: auto;
        padding: 2rem;
    }

    .image-content p {
        position: unset;
        padding: 0;
        font-size: 1.5rem;
        margin-top: 3rem;
    }

    .image-content .heading-title {
        font-size: calc(3.5rem * 1.5);
        line-height: 4rem;
    }

    .image-content h6 {
        font-size: 1.6rem;
        margin-top: 1rem;
        line-height: 2.6rem;
    }

    #portfolio-section .heading {
        padding: 2rem;
        text-align: center;
        position: relative;
    }

    #portfolio-section .heading .port-heading {
        font-size: 16rem;
        line-height: 11.4rem;
    }

    .airport-card svg {
        width: 20rem;
    }

    .airport-card {
        /* top: -2rem; */
        /* transform: scale(1.4); */
    }

    .transit-media-card .card-content .heading-title {
        font-size: calc(5.4rem * 2.2);
        line-height: calc(4rem * 2.2);
    }

    .transit-media-card .card-content p {
        /* font-size: 1rem;
    line-height: normal;
    color: white; */
        font-size: calc(0.5rem * 2.5);
        text-align: center;
        margin-bottom: calc(2rem * 2.5);
        margin-top: calc(0.5rem * 2.5);
        font-family: Manrope;
        line-height: calc(0.7rem * 2.5);
    }

    .portfolio-logo {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .portfolio-logo svg {
        color: var(--dark-choclate);
        height: 6rem;
    }

    .portfolio-row {
        display: block;
        padding: 0;
    }

    .portfolio-row .images {
        width: auto;
        height: 100%;
        padding: 0;
        overflow: hidden;
        position: relative;
    }

    .port-img::-webkit-scrollbar {
        width: 0;
        height: 0;
    }

    .portfolio-img-count {
        /* position: absolute; */
        width: 100%;
        padding: 1rem;
        top: 0;
        right: 0;
        left: 0;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .portfolio-img-count .portfolio-title {
        font-size: 2.5rem;
        line-height: 2rem;
        text-transform: uppercase;
    }

    /* .port-img {
    height: calc(100vh - 24rem);
    overflow: auto;
  } */
    .forms-wrapper {
        display: block;
        padding: 0;
    }

    .forms-wrapper .form-contact .inner-form {
        display: grid;
        row-gap: 4rem;
        margin-top: 4rem;
    }

    .forms-wrapper .form-contact .inner-form .input-text,
    .forms-wrapper .form-contact .inner-form .input-select {
        width: 100%;
    }

    .forms-wrapper .infos {
        width: auto;
        gap: 2rem;
    }

    .button-wrapper button {
        font-size: 4rem;
    }

    .forms-wrapper .infos .info .label {
        font-size: 2.6rem;
    }

    .forms-wrapper .infos .info .title a {
        font-size: 4rem;
        line-height: 4rem;
    }

    .form-section .layout .description {
        font-size: 1.8rem;
        line-height: 2.4rem;
        padding-left: 0;
        padding-bottom: 4rem;
        margin-top: 2rem;
        width: 24rem;
    }

    .form-section .layout .heading-title {
        font-size: 12rem;
        padding-left: 0;
        white-space: unset;
        width: 27rem;
        line-height: 10rem;
        margin-top: 2rem;
    }

    .input-text input,
    .input-text textarea,
    .input-select select {
        font-size: 1.8rem;
    }

    .input-checkbox label span {
        font-size: 1.4rem;
        line-height: normal;
    }

    .button-wrapper a {
        font-size: 3rem;
        padding: 0.8rem 2rem;
    }

    .button-wrapper {
        padding: 4rem 0;
    }

    .copyright {
        padding: 1rem;
    }

    .bottom-section-right {
        padding: 1.5rem;
    }

    .address .icone img {
        height: 2rem;
        object-fit: contain;
    }

    .input-checkbox {
        gap: 1rem;
    }

    .circle-active-indication {
        position: absolute;
        animation: spinAround 6s linear infinite;
        padding-right: calc(2.4rem * 2.5);
    }

    .media-circle-icon .circle-active-indication svg {
        width: 4rem;
        transform: rotate(90deg);
    }

    .ecommerce-row {
        display: block;
    }

    .ecommerce-col-left {
        width: auto;
    }

    .ecommerce-col-left .middle-content {
        width: auto;
        padding-left: 0;
        padding: 80px 20px 20px;
    }

    .ecommerce-col-left {
        height: 85%;
    }

    .ecommerce-logo {
        position: absolute;
        bottom: -6rem;
        height: auto;
        width: 100%;
        right: 0;
        top: unset;
    }

    .ecommerce-logo .logo-circle {
        width: 12rem;
        height: 12rem;
        box-shadow: 0px -4px 4px 0px rgb(0, 0, 0, 0.46) inset;
        -webkit-box-shadow: 0px -4px 4px 0px rgb(0, 0, 0, 0.46) inset;
        -moz-box-shadow: 0px -4px 4px 0px rgb(0, 0, 0, 0.46) inset;
    }

    .ecommerce-logo svg {
        width: 10rem;
    }

    .ecommerce-col-left .middle-content .title {
        font-size: 9rem;
        line-height: 6.5rem;
    }

    .ecommerce-col-left .middle-content .title {
        font-size: 12rem;
        line-height: 9rem;
        margin-bottom: 1.5rem;
        margin-top: 4rem;
    }

    .ecommerce-col-left .middle-content .sub-title {
        font-size: 3rem;
        line-height: 2.6rem;
        font-weight: normal;
        margin-right: 4rem;
    }

    .how-does-function .title,
    .what-covering .title,
    .why-ecommerce .title {
        font-size: 13rem;
        line-height: 10rem;
        margin-top: 1rem;
    }

    .how-does-function .menu-name,
    .what-covering .menu-name,
    .why-ecommerce .menu-name {
        font-size: 5.4rem;
        line-height: 4rem;
    }

    .how-does-function .sub-title,
    .what-covering .sub-title {
        font-size: 4.5rem;
        font-weight: normal;
        line-height: 3.8rem;
        margin-top: 2rem;
        text-transform: uppercase;
    }

    .ec-list {
        padding: 5rem 0 5rem 3rem;
    }

    .list-flex {
        gap: 1.5rem;
    }

    .ec-list-no {
        font-size: 8rem;
        line-height: 6rem;
    }

    .ec-list-title .heading-title {
        line-height: 7rem;
        font-size: 10rem;
    }

    .ec-list-title p {
        font-size: 1.6rem;
        font-weight: bold;
    }

    .ec-list-divider {
        width: auto;
        margin: 2rem 0;
    }

    .functions {
        position: relative;
        height: auto;
        padding: 4rem 0;
    }

    #startUp,
    #stepUp,
    #brandUp {
        padding-top: unset;
        margin-top: -6rem;
        height: auto;
    }

    .functions .heading {
        position: unset;
        padding-top: unset;
    }

    .slider-one .sub-title {
        text-transform: uppercase;
        line-height: 3.2rem;
        font-size: 3.4rem;
        width: 24rem;
        margin: 0 auto;
        padding-left: 1.4rem;
        height: auto;
        font-weight: normal;
    }

    #eCommerce .carousel-item {
        padding: unset;
        height: 28rem;
    }

    #eCommerce .carouser-btn {
        width: 9rem;
        height: auto;
    }

    #eCommerce .carouser-btn {
        position: absolute;
        bottom: 0;
        right: 2rem;
        z-index: 6;
        height: 4rem;
    }

    .functions .heading .title .heading-title {
        font-size: 14rem;
        line-height: 10rem;
    }

    .functions .heading .title h6 {
        font-size: 2rem;
        line-height: 2rem;
        font-weight: normal;
        margin-bottom: 0.5rem;
    }

    .functions .heading h4 {
        font-size: 6rem;
        line-height: 4.2rem;
    }

    #eCommerce .card-slide {
        height: 20rem;
        width: 22rem;
        padding: 1.6rem;
        transform: rotate(11deg);
        background: #fffffff2;
    }

    .carousel-inner {
        padding: 3rem 0 0;
    }

    #eCommerce .card-slide .card-title {
        line-height: 3rem;
        font-size: 4rem;
    }

    #eCommerce .card-slide p {
        margin-top: 1rem;
        font-size: 1.2rem;
    }

    #eCommerce .card-slide .card-no {
        font-size: 5rem;
        line-height: 3.6rem;
        /* margin: 0 -1.2rem -1.2rem; */
    }

    .slide-count {
        font-size: 3.3rem;
        line-height: 3rem;
        bottom: 0;
    }

    .tab-container .describe {
        font-size: 3rem;
        width: auto;
        line-height: 1.2em;
    }

    .tab-card {
        width: 100%;
        padding: 2.6rem;
    }

    .tab-container {
        height: auto;
        flex-direction: column;
        gap: 2rem;
    }

    .tab-section {
        padding: 3rem 3rem;
    }

    .tab-card .card-title {
        line-height: 4.4rem;
        font-size: 5.6rem;
    }

    .tab-card p {
        font-size: 1.6rem;
        line-height: 2rem;
        margin-top: 1.4rem;
        width: 20rem;
    }

    .tab-card .card-no {
        font-size: 8.2rem;
        line-height: 6rem;
    }

    .nav-pills .nav-link {
        font-size: 2.8rem;
    }

    .why-e-title .title {
        font-size: 12rem;
        line-height: 9.6rem;
    }

    .why-e-content {
        display: block;
        margin-top: 3.6rem;
    }

    .why-e-content p {
        font-size: 1.6rem;
    }

    .why-e-content h4 {
        font-size: 4rem;
        line-height: 4rem;
        margin-bottom: 1rem;
    }

    .why-e-content div {
        margin-left: 6rem;
        margin-top: 6rem;
    }

    .why-e-title .menu-name {
        font-size: 3.4rem;
        line-height: 3.2rem;
        font-weight: normal;
    }

    .list-group {
        padding: 3rem 0 0 4rem;
    }

    .list-group .list-item .list-no {
        font-size: 3.2rem;
    }

    .mrk-agn,
    .soft-agn,
    .crt-agn {
        padding: 6rem 0;
    }

    .list-group .list-item .list-title {
        line-height: 5rem;
        font-size: 5.4rem;
    }

    .mrk-agn .heading,
    .soft-agn .heading,
    .crt-agn .heading {
        text-align: center;
        font-size: 11rem;
        line-height: 9rem;
    }

    .list-group .list-item {
        gap: 2rem;
    }

    .list-divider {
        margin: 2rem 0;
    }

    .carouser-btn button {
        height: 4rem;
        width: 4rem;
    }

    .ecommerce-menu {
        position: fixed;
        top: 8rem;
        right: -140px;
        z-index: 3;
        bottom: unset;
        left: unset;
    }

    .ecommerce-menu ul li a {
        color: black;
        font-size: 1.6rem;
    }

    .ecommerce-menu ul li a span {
        color: white;
        visibility: hidden;
    }

    .ecommerce-menu ul li {
        background-color: rgb(255 255 255 / 40%);
        font-size: 1rem;
        padding: 0.8rem 1rem 0.8rem 1.6rem;
        border-top-left-radius: 10rem;
        border-bottom-left-radius: 10rem;
        backdrop-filter: blur(5px);
        border: 1px solid rgb(255 255 255 / 40%);
    }

    .ecommerce-menu ul {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    .ecommerce-menu ul li:hover {
        transform: translateX(6%) scale(1.1);
        transform-origin: right;
        transition: all 1s;
        background: var(--dark-choclate);
    }

    .ecommerce-menu ul li:hover a {
        color: white;
    }

    .ecommerce-menu ul li:hover a span {
        color: var(--dark-choclate);
    }

    .service-menu-container {
        height: 26.4rem;
        /* transition: all 1s; */
    }

    .images .port-img img {
        object-fit: contain;
        height: auto;
        width: 100%;
    }

    #mobileMenuOverlay.overlay {
        top: 0;
    }

    /* width */
    main::-webkit-scrollbar {
        width: 0;
        height: 0;
    }

    .why-e-title {
        margin-top: 6rem;
    }
}


/* About Contact Pages */

@media (max-width: 768px) {
    .section-two svg {
        display: none;
    }

    .section-two .title {
        font-size: 5rem;
    }

    .whydo {
        font-size: 2.5rem;
        font-weight: 500;
    }

    .section-two .heading h5 {
        font-size: 2.5rem;
    }

    .section-two .text p {
        font-size: 1.5rem;
        font-weight: 500;
    }

    .section-two .text {
        margin-top: 6rem;
        padding: 0 3rem 0 5rem;
        display: flex;
        flex-direction: column;
        gap: 3rem;
    }

    .section-two .inner .icon-half-circle-full {
        font-size: 8rem;
        color: var(--primary);
        transform: rotate(90deg);
        position: absolute;
        bottom: 20px;
        right: 60px;
    }

    .section-three svg {
        display: none;
    }

    .section-three .bg-text .bg-title {
        font-size: 24rem;
    }

    .section-three .bg-text {
        padding-left: 0rem;
    }

    #digitalMarketing .card-slide {
        height: 28rem;
        width: 25rem;
        padding: 3rem;
    }

    #digitalMarketing .card-slide .card-title {
        font-size: 5rem;
        line-height: 4rem;
        margin-bottom: 1rem;
    }

    #digitalMarketing .card-slide p {
        font-size: 1.4rem;
        font-weight: 600;
        font-family: "Manrope";
        width: 15rem;
    }

    #digitalMarketing .card-slide .card-no {
        font-size: 5.5rem;
        line-height: 4rem;
        position: absolute;
        right: 25px;
        bottom: 25px;
    }

    #digitalMarketing .carouser-btn {
        width: 86px;
    }

    #digitalMarketing .carouser-btn button {
        height: 4rem;
        width: 4rem;
    }

    .center-content {
        padding: 10rem 3rem 0 3rem;
        align-items: flex-start;
        margin-right: 3rem;
    }

    .center-content h1 {
        color: var(--primary);
        font-size: 10rem;
        text-transform: uppercase;
        line-height: 9rem;
    }

    .center-content .half-circle-top {
        top: -4rem;
        font-size: 8rem;
        left: 14rem;
    }

    .center-content .icon-triangle {
        font-size: 9rem;
    }

    .icons-overlay .half-circle-bottom {
        font-size: 24rem;
        right: 30px;
    }

    .icons-overlay .icon-half-circle-full {
        position: absolute;
        bottom: 5.5rem;
        font-size: 11rem;
        color: var(--light-blue2);
        right: 8rem;
        transform: rotate(6deg);
    }

    .tab-content .tab-1,
    .tab-content .tab-2 {
        font-size: 2rem;
    }

    .tab-content {
        gap: 1rem;
    }

    .tab-title {
        padding: 2rem 3rem;
    }

    .icons-overlay .icon-circle {
        position: absolute;
        bottom: 12rem;
        font-size: 16rem;
        color: var(--light-pink);
        left: -8rem;
    }

    .section-five .dark-logo {
        display: none;
    }

    .top-content {
        flex-direction: column-reverse;
    }

    .top-content p {
        font-size: 1.8rem;
        line-height: 2.2rem;
        width: auto;
        margin-left: 10rem;
    }

    .top-content {
        padding: 4rem 2rem;
    }

    .top-content h2 {
        font-size: 4.5rem;
        line-height: 4rem;
        margin-top: 8rem;
        margin-right: 6rem;
    }

    .our-job-btn {
        border-radius: 2rem;
        font-size: 2.5rem;
        color: var(--primary);
        border: 0;
        padding: 1rem 2.6rem;
        font-weight: bold;
        margin-top: 2rem;
        background: white;
    }

    .team-member .img-wrapper {
        height: 30rem;
        width: 30rem;
    }

    .circle-card {
        text-align: center;
        width: 30rem;
    }

    .team-member {
        padding: 0 2rem 1rem 4rem;
        gap: 4rem;
    }

    .team-member .name {
        font-size: 5rem;
        line-height: 4.2rem;
        font-weight: 500;
    }

    .team-member .status {
        font-size: 1.5rem;
    }

    .section-six-wrapper {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        gap: 4rem;
    }

    .section-six .year {
        border-radius: 1.2rem;
        padding: 0.5rem 2rem;
        font-size: 2.6rem;
    }

    .section-six-wrapper .left {
        margin-right: 0rem;
    }

    .section-six .head {
        font-size: 2.6rem;
    }

    .section-six .text {
        font-size: 1.8rem;
        line-height: 2.2rem;
        margin-top: 4rem;
        max-width: none;
    }

    .location-header {
        font-size: 2.6rem;
    }

    .locations-wrapper .location {
        font-size: 5rem;
        line-height: 5.5rem;
    }

    .section-six-wrapper .left .icon-half-circle-full {
        font-size: 7rem;
    }

    .section-six-wrapper .locations-wrapper .icon-triangle {
        font-size: 7.6rem;
    }

    .map-image {
        width: 100vw;
        position: inherit;
        height: 40rem;
        margin-top: -16rem;
    }

    .section-six-layout {
        display: flex;
        flex-direction: column-reverse;
    }

    .section-six-layout {
        padding: 3rem 4rem 0;
    }

    .section-seven-layout {
        padding: 6rem 2rem;
    }

    .section-seven-layout .intro {
        padding: 0 6rem;
        flex-direction: column;
    }

    .section-seven-layout .intro .tagline {
        font-size: 3rem;
        max-width: 8rem;
    }

    .section-seven-layout .intro .text {
        font-size: 2rem;
        max-width: 100%;
        margin-top: 4rem;
    }

    .section-seven-layout .title {
        font-size: 5.2rem;
        line-height: 5rem;
        margin: 0;
        margin-top: 4rem;
    }

    .section-seven-layout .clients .client {
        flex: 0 0 12rem;
    }

    .section-seven-layout .clients {
        gap: 3rem 3rem;
        justify-content: center;
        margin-top: 2rem;
    }

    .section-seven-layout .clients .client {
        width: auto;
        height: 12rem;
    }

    .section-seven-layout .clients .client img {
        min-width: 2.9rem;
        width: 11rem;
    }

    .socials li {
        width: 50%;
        flex: auto;
        height: 14rem;
    }

    .social-links .socials {
        flex-wrap: wrap;
    }

    .socials li a i {
        font-size: 3.6rem;
    }

    .join-contact {
        flex-direction: column;
    }

    .join-contact .contact .chapeau {
        font-size: 2rem;
    }

    .join-contact .contact .title {
        color: var(--primary);
        font-size: 5.2rem;
        line-height: 5rem;
        margin-top: 3rem;
        margin-bottom: 3.8rem;
    }

    .join-contact .contact .text {
        border-radius: 2rem;
        padding: 1rem 4rem;
        font-size: 2.6rem;
        font-weight: 500;
        margin-top: 0.4rem;
        background: var(--secondary);
    }

    .join-contact .contact:last-child {
        border-top: 1px solid #d3dcff;
        border-left: 0;
    }

    .join-contact .contact {
        width: 100%;
        padding: 6.6rem 0;
    }

    .address .texte b {
        font-size: 1.3rem;
    }

    .address .texte {
        font-size: 1.3rem;
    }

    .address .icone {
        height: 3.5rem;
        width: 3.5rem;
        border-radius: 0.6rem;
    }

    .bottom-section-right .address {
        gap: 0.6rem;
    }

    .scrolltop {
        border-radius: 1rem;
        padding: 0.8rem 1.6rem;
        font-size: 2.2rem;
    }

    .bottom-section-left .links {
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.5rem 2rem;
    }

    .bottom-section-left .links a,
    .bottom-section-left .links .copyright {
        font-size: 1rem;
    }

    .about-title .heading-title {
        font-size: 8rem;
        line-height: 7rem;
        width: auto;
        margin-right: 1rem;
    }

    .about-title {
        position: unset;
        height: 85%;
    }

    .about-heading {
        position: unset;
        width: 100%;
        height: 15%;
    }

    .elyts-logo {
        position: absolute;
        top: -12rem;
        bottom: 0;
        right: 0;
        left: 0;
        height: 12rem;
        width: 100%;
        z-index: 1;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .about-heading .heading-title {
        font-size: 7rem;
        line-height: 7rem;
        transform: none;
    }

    .scrollto {
        display: none;
    }

    .copyright {
        display: block;
        font-size: 1.2rem;
        color: var(--dark-choclate);
        font-family: Manrope;
        text-align: center;
    }

    .about-banner {
        display: block;
    }

    .right-section {
        height: auto;
        width: 100%;
    }

    .about-logo svg {
        height: 9rem;
        color: var(--primary);
    }

    .pin-container img {
        width: auto;
        height: 36rem;
    }

    .logo-text-bg {
        font-size: 69rem;
    }

    .contact-banner .title .heading-title {
        font-size: 9.6rem;
        line-height: 5.4rem;
    }

    .contact-banner .icon-circle-part-full {
        font-size: 8rem;
        right: 2rem;
        top: 16rem;
    }

    .contact-banner .icon-half-circle-full {
        font-size: 8rem;
        left: 4rem;
        bottom: 6rem;
        top: unset;
    }

    .mobile-service-img {
        margin-top: 2rem;
    }

    .mobile-service-img img {
        width: 100%;
    }

    .services a {
        background: white;
        color: var(--dark-pink);
    }

    .methods a {
        background: var(--dark-choclate);
        color: #bdd2db;
    }

    .portfolio a {
        background: #c8e7ea;
        color: white;
    }

    .commerce a {
        background: #e4d8d0;
        color: white;
    }

    .digital a {
        background: #9993ae;
        color: white;
    }

    .data-insight a {
        background: #e4d8d0;
        color: white;
    }

    .facts-figures a {
        background: #9993ae;
        color: white;
    }

    #digitalBranding .heading-title {
        font-size: 9rem;
        line-height: 6.6rem;
    }

    #transitMedia .sub-title {
        font-size: 2.8rem;
        line-height: 2.8rem;
    }

    #adFilmProduction .sub-title {
        font-size: 2.8rem;
        line-height: 2.8rem;
    }

    .oohAdvertising {
        height: auto;
        overflow: hidden;
    }

    .oohAdvertising .ohh-row {
        display: block;
        overflow: hidden;
        /* height: auto; */
    }
}


/* Services Pages */

@media (max-width: 768px) {
    .oohAdvertising .heading {
        width: auto;
        min-width: auto;
        padding: 9rem 1.5rem;
        height: calc(100vh - 0px);
        gap: 2rem;
    }

    .oohAdvertising .heading .heading-title {
        font-size: 11rem;
        line-height: 9rem;
        color: #4e4460;
        text-transform: uppercase;
        /* word-break: break-all; */
    }

    /* .oohAdvertising .heading h1 span {
    font-size: 14rem;
    line-height: 12rem;
  } */
    .oohAdvertising .heading h6 {
        font-size: 5rem;
        line-height: 5rem;
        color: #4e4460;
        text-transform: uppercase;
        margin-top: 1rem;
    }

    .oohAdvertising .heading p {
        font-size: 2rem;
        font-family: "Manrope";
        font-weight: bold;
        color: #4e4460;
        margin-top: 8rem;
    }

    .oohAdvertising .ohh-gt .ohh-content {
        background: #d3e3e2;
    }

    .oohAdvertising .ohh-sw .ohh-content {
        background: #EAB3B8;
    }

    .oohAdvertising .ohh-up .ohh-content {
        background: #FFE5E6;
    }

    .oohAdvertising .ohh-bf .ohh-content {
        background: #D5D5E1;
    }

    .oohAdvertising .ohh-bb .ohh-content {
        background: #D5D5E1;
    }

    .oohAdvertising .ohh-rar .ohh-content {
        background: #EAC0C0;
    }

    .oohAdvertising .ohh-pk .ohh-content {
        background: #F89E9E;
    }

    .oohAdvertising .ohh-bs .ohh-content {
        background: #FDCBCC;
    }

    .oohAdvertising .ohh-rm .ohh-content {
        background: #BBD5D5;
    }
}