@import url("https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css");
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,700,300,500,600,800|Open+Sans:400,700,300,400italic,600|Lato:400,700|Jost:400");
@import url("https://fonts.googleapis.com/css2?family=Birthstone&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Zen+Loop:ital@0;1&display=swap");

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

.mt-2 {
    margin-top: 2vw;
}

.mt-4 {
    margin-top: 4vw;
}

.mt-8 {
    margin-top: 8vw;
}

.w-100 {
    max-width: 100% !important;
    width: 100% !important;
}

/* MAIN MENU */

.top-menu-mobile {
    display: none;
}

.top-menu {
    align-items: center;
    background: linear-gradient(
        180deg,
        rgba(44, 73, 129, 0) 0%,
        rgba(14, 14, 41, 0) 100%
    );
    display: flex;
    height: 5.14vw;
    justify-content: center;
    left: 0;
    min-width: 100%;
    position: fixed;
    top: 0;
    gap: 10vw;
    z-index: 1000000000;
}

.top-menu:hover {
    background: rgba(0, 0, 0, 0.2);
}

.top-menu-logo {
    align-self: center;
}

.marketing10-header-logo {
    height: auto;
    width: 10vw;
}

.navbar {
    align-items: center;
    display: flex;
    gap: 3.33vw;
}

.navbar-link-portfolio {
    min-width: 4.58vw;
}

.navbar-link,
.navbar a:link,
.navbar a:visited {
    letter-spacing: 0;
    line-height: normal;
    color: var(--white);
    font-family: var(--font-family-montserrat);
    font-size: calc(10px + 0.2vw) !important;
    font-weight: 500;
    font-style: normal;
    cursor: pointer;
    text-decoration: none;
}

.navbar-link .active {
    font-weight: 700 !important;
}

.navbar-link a:hover {
    text-decoration: underline;
    text-underline-offset: 0.5vw;
    -webkit-text-decoration-color: rgba(255, 255, 255, 0.7); /* Safari */
    text-decoration-color: rgba(255, 255, 255, 0.7);
}

.request-a-quote-menu-button {
    align-items: center;
    align-self: center;
    border: 1px solid;
    border-color: var(--indigo);
    border-radius: 6.94vw;
    display: flex;
    height: 2.71vw;
    min-width: 13.54vw;
    justify-content: center;
}

.request-a-quote {
    letter-spacing: 0;
    line-height: normal;
    text-align: center;
    font-size: calc(10px + 0.2vw) !important;
}

/* MOBILE MENU */
/* 
.mobile-menu {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;

  background: #21336A;
  opacity: 0.98;
  display: flex;
  flex-direction: column;
  gap: 10vw;
  height: calc(var(--vh, 1vh) * 100);
  width: 100%;
  padding: 10vw;
  z-index: 10000000;
}

.mobile-menu-links {
  padding: 5vw;
  display: flex;
  flex-direction: column;
  gap: 12.5vw;
}

.navbar-link-mobile, .mobile-menu a:link, .mobile-menu a:visited {
  font-family: var(--font-family-montserrat);
  font-style: normal;
  font-weight: 500;
  font-size: 4.5vw;
  line-height: normal;
  cursor: pointer;
  text-decoration: none;
  text-transform: uppercase;

  color: #fff;

  display: flex;
  flex-direction: row;
  gap: 3vw;

} */

.marketing10-header-logo-mobile {
    height: auto;
    width: 90vw;
    margin-left: 10vw;
}

.request-a-quote-menu-button-mobile {
    margin-top: 15vw;
    align-items: center;
    align-self: center;
    border: 1px solid;
    border-color: var(--indigo);
    border-radius: 10vw;
    display: flex;
    justify-content: center;
    padding: 5vw 15vw;
    width: 80vw !important;
    margin-left: 10vw;
}

.request-a-quote-mobile {
    letter-spacing: 0;
    line-height: normal;
    text-align: center;
    font-size: calc(18px + 0.2vw) !important;
}

.mobile-menu .footer-socials {
    margin-left: 0 !important;
    margin-top: 10vw !important;
}

.footer-socials-mobile-menu {
    padding-bottom: 25vw;
}

/* HEADER BANNER */

.hero-banner-container {
    align-items: center;
    background-position: center calc(100% - 300px), center bottom !important;
    background: url(../images/herobanner-lines.svg),
        linear-gradient(
            180deg,
            rgb(44, 73, 129) 0%,
            rgb(12.42, 12.42, 64.81) 100%
        );
    background-size: 100% auto;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    min-height: 50.25vw;
    padding: 0 0 6vw 0;
    width: 100%;
    margin: 0;
    justify-content: space-between;
}

.hero-top-banner {
    display: flex;
    flex-direction: row;
    width: 100%;
    padding: 1vw 0;
    background: linear-gradient(
        180deg,
        rgba(19, 28, 46, 1) 0%,
        rgba(3, 3, 17, 1) 100%
    );
    /* background: rgba(255, 255, 255, 0.2); */
    flex-shrink: 0;
    flex-grow: 0;
    margin-top: 7vw;
    align-items: center;
    overflow: hidden;
    margin-bottom: -7vw;
}

.hero-top-banner:hover {
    cursor: pointer;
}

.hero-top-banner div {
    color: var(--white) !important;
    text-align: center;
    font-family: var(--font-family-open_sans);
    font-style: normal;
    align-items: center !important;
    font-size: var(--font-size-m);
    line-height: var(--font-size-m);
    font-weight: 400;
    display: flex;
    flex-direction: row;
    gap: 0.5vw;
    flex-shrink: 0;
    flex-grow: 0;
}

.hero-top-banner a:link,
.hero-top-banner a:visited,
.hero-top-banner a:hover,
.hero-top-banner a:active {
    color: var(--white);
    font-size: var(--font-size-m);
    font-weight: 400;
    text-decoration: none;
}

.hero-top-banner img {
    height: 2vw;
    width: auto;
    border: 0;
    border-radius: 0.25vw;
    margin-left: 2vw;
}

.hero-banner-title {
    color: var(--white);
    font-family: var(--font-family-montserrat);
    font-size: 5.5vw;
    font-weight: 800;
    line-height: 5.5vw;
    margin-top: 10vw;
    max-width: 90vw;
    text-align: center;
}

.hero-banner-subtitle {
    font-family: var(--font-family-open_sans);
    color: var(--white);
    text-transform: uppercase;
    font-weight: 300;
    text-align: center;
    letter-spacing: 0.33em;
}

.hero-banner-desc {
    color: var(--white);
    font-family: var(--font-family-open_sans);
    font-size: 1.4vw;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 2vw;
    margin-top: 4vw;
    margin-bottom: 2vw;
    opacity: 1;
    text-align: center;
    max-width: 85vw;
}

.hero-banner-desc-homepage {
    color: var(--white);
    font-family: var(--font-family-open_sans);
    font-size: 4vw;
    font-style: italic;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 2vw;
    margin-top: 4vw;
    margin-bottom: 2vw;
    opacity: 1;
    text-align: center;
}

.hero-banner-desc-smaller {
    color: var(--white);
    font-family: var(--font-family-open_sans);
    font-size: 1.6vw;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 150%;
    margin-top: 3vw;
    opacity: 1;
    text-align: center;
}

.hero-banner-desc-smaller a:link,
.hero-banner-desc-smaller a:visited {
    color: #fff;
}

.hero-banner-desc-smaller a:hover,
.hero-banner-desc-smaller a:active {
    font-weight: 700;
}

.portfolio .hero-banner-desc {
    max-width: 75vw !important;
}

.hero-banner-bottom {
    align-items: flex-start;
    background-image: url(../images/herobanner-lines.svg);
    background-size: cover;
    display: flex;
    flex-direction: column;
    gap: 1vh;
    padding: 0 7.5vw 4.31vw 7.5vw;
    width: 100%;
    position: absolute;
    bottom: 0;
}

/* Z LOGOTIPI
  .hero-banner-logos-container {
  align-items: center;
  display: flex;
  gap: 5vw;
  min-width: 85vw;
} */

.hero-banner-logos-container {
    align-items: center;
    display: flex;
    flex-direction: row;
    gap: 1vw;
    min-width: 85vw;
    align-items: center;
    align-self: center;
    justify-content: center;
    margin-top: 3vw;
}

.gd10-capital-logo {
    height: 3vw;
    width: auto;
}

.button-container {
    align-items: flex-start;
    align-self: center;
    display: flex;
    gap: 1.5vw;
    margin-left: 0;
    margin-top: 4vw;
}

.join-our-community-button {
    align-items: center;
    border: 1px solid;
    border-color: var(--white);
    border-radius: 7.04vw;
    display: flex;
    gap: 1.46vw;
    height: 3.5vw;
    text-align: center;
    justify-content: center;
    padding: 0 3vw;
}

.discord-icon {
    height: 1.5vw;
    width: auto;
}

.join-our-community {
    color: var(--white);
    font-family: var(--font-family-open_sans);
    font-size: 16px;
    font-weight: 300;
    line-height: normal;
}

.schedule-a-call-button {
    align-items: center;
    background-color: var(--white);
    border-radius: 7.04vw;
    display: flex;
    height: 3.5vw;
    padding: 0 3vw;
    text-align: center;
    justify-content: center;
}

.schedule-a-call {
    color: #0e0e29;
    font-family: var(--font-family-montserrat);
    font-size: 16px;
    font-weight: 800;
    line-height: normal;
}

.hero-banner-project-logos {
    height: auto;
    width: 13.5vw;
}

/* SUBPAGES BANNER */

.subhero-banner-container {
    align-items: center;
    background-image: url(../images/subpage-banner-lines.svg),
        linear-gradient(
            180deg,
            rgb(44, 73, 129) 0%,
            rgb(12.42, 12.42, 64.81) 100%
        );
    background-position: center bottom;
    background-size: cover;
    display: flex;
    flex-direction: column;
    min-height: 60vh;
    padding: 16vh 0;
    width: 100%;
    margin: 0;
}

.subhero-banner-container.portfolio {
    padding-bottom: 10vh !important;
}

.subhero-banner-title {
    margin-top: 2vw !important;
}

/* HOMEPAGE VIDEO SLIDER */

.homepage-video-slider-container {
    width: 100%;
    padding: 4vw 0;
    display: flex;
    gap: 2vw;
}

.slider-video {
    display: flex;
    width: 40vw;
    min-width: 40vw;
    height: auto;
}

#video-slider-streams {
    margin-top: 4vw;
}

.slider-video-streams {
    position: relative;
    border: 10px solid #080a19;
    flex-direction: column;
    gap: 10px;
    background: #080a19;
    border-radius: 1vw;
    padding-bottom: 20px;
    margin-left: 0.5vw;
    margin-right: 0.5vw;
}

.video-style-streams {
    border-radius: 0.5vw;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.video-style {
    border-radius: 0.5vw;
    width: 97%;
    height: 100%;
    object-fit: cover;
}

/* OUR SERVICES - HOMEPAGE */

.services-container {
    background-image: url(../images/maincontainer-lines.svg),
        linear-gradient(
            180deg,
            rgba(240.12, 240.12, 240.12, 0) 0%,
            rgb(240.12, 240.12, 240.12) 46.88%
        );
    width: 100%;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: 100%;
    padding-bottom: 5vw;
    padding-top: 4vw;
}

.services-intro-container {
    width: 70vw;
    margin-left: 15vw;
    display: flex;
    flex-direction: row;
    gap: 6vw;
    margin-top: 4vw;
}

.services-intro-left,
.services-intro-right {
    display: flex;
    flex-direction: column;
    width: 100%;
    text-align: center;
}

.services-intro-left {
    gap: 2vw;
}

.services-intro-right {
    gap: 1vw;
}

.services-main-element-title {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.6vw;
}

.our-innovative-approach-title {
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: linear-gradient(
        45deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    background-clip: text;
    color: transparent;
    font-family: var(--font-family-montserrat);
    font-size: calc(30px + 2vw);
    font-weight: 700;
    line-height: normal;
    text-fill-color: transparent;
}

.our-innovative-approach-desc {
    color: var(--gravel);
    font-family: var(--font-family-open_sans);
    font-size: calc(14px + 0.5vw);
    font-weight: 400;
    line-height: 1.98vw;
}

.services-value-title {
    font-size: calc(14px + 0.2vw) !important;
}

.services-value-desc {
    font-size: calc(12px + 0.2vw) !important;
}

.services-value-title,
.services-value-desc {
    line-height: 1.67vw;
}

.tick {
    height: 0.83vw;
    width: auto;
}

.services-grid-container {
    margin-top: 4vw;
    align-self: center;
    justify-content: center;
    width: 70vw;
    display: grid;
    margin-left: 15vw;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: minmax(17vw, auto);
    grid-gap: 2vw;
}

.services-grid-element {
    align-items: center;
    background-color: var(--white-2);
    border-radius: 0.63vw;
    box-shadow: 0vw 0.11vw 1.21vw #00000021;
    display: flex;
    flex-direction: column;
    padding: 1.5vw 1.5vw;
    gap: 1vw;
    justify-content: center;
    align-items: center;
    /* transition: all 300ms ease-in-out; */
}

.services-grid-element:hover {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255) 0%,
        rgb(240, 240, 240) 100%
    );
    /* transform: scale(1.05); */
    /* cursor: pointer; */
}

.service-icon {
    height: 3vw;
    width: auto;
}

.services-grid-element-title {
    line-height: normal;
    text-align: center;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: linear-gradient(
        45deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    background-clip: text;
    color: transparent;
    font-family: var(--font-family-montserrat);
    font-size: calc(18px + 0.1vw);
    font-weight: 700;
    line-height: normal;
    text-fill-color: transparent;
}

.services-grid-element-desc {
    line-height: 1.25vw;
    text-align: center;
}

.services-grid-element-divider {
    height: auto;
    width: 5vw;
}

.stats-container {
    align-items: center;
    background: linear-gradient(
        180deg,
        rgb(43.93, 73.16, 128.56) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    border-radius: 0.95vw;
    box-shadow: 0vw 0.32vw 1.83vw #1920e078;
    display: grid;
    grid-template-columns: 17vw 0.66vw 17vw 0.66vw 17vw 0.66vw 17vw;
    height: 13.54vw;
    width: 70vw;
    margin-left: 15vw;
    margin-top: 4vw;
}

.stat-inner-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 1.32vw;
    overflow: hidden;
}

.stat-divider {
    align-self: center;
    background-color: var(--white);
    height: 8.06vw;
    opacity: 0.37;
    width: 0.07vw;
}

.services-show-more-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
}

/* SERVICES - SLIDER */

.services-slider-container {
    margin-top: 2vw;
    padding-top: 2vw;
    overflow: hidden;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 5vw;
    width: 100%;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 20vw;
    align-items: center;
    gap: 2vw;
}

.services-slider-container::-webkit-scrollbar {
    width: 50vw;
    border-radius: 10vw;
    height: 0.7vw;
}

.services-slider-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10vw;
    margin-top: 4vw;
    max-width: 50vw !important;
    margin-left: 15vw !important;
    margin-right: 15vw !important;
}

.services-slider-container::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, #5d81c7 0%, #0c0c41 100%);
    border-radius: 10vw;
}

.services-slider-container::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.services-slider-container > div:first-child {
    margin-left: 2vw;
}
.services-slider-container > div:last-child {
    margin-right: 2vw;
}

.services-slider-element {
    min-height: 17vw !important;
}

/* CASE STUDY */

.case-study-container {
    align-items: flex-start;
    background: linear-gradient(
        180deg,
        rgb(43.93, 73.16, 128.56) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    width: 100%;
    overflow: hidden;
}

.case-study-slides {
    display: flex;

    overflow-x: auto;
    scroll-snap-type: x mandatory;

    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    scroll-snap-points-x: repeat(100%);
    scroll-snap-type: mandatory;
    min-height: 40vw;
}

.case-study-slides::-webkit-scrollbar {
    display: none;
}

.case-study-slides > div {
    scroll-snap-align: start;
    flex-shrink: 0;
    width: 100%;
    transform-origin: center center;
    transform: scale(1);
    transition: transform 0.5s;
    position: relative;
    display: flex;
}

.case-study-inner-container {
    display: flex;
    flex-direction: row;
    gap: 5vw;
    margin-left: 7.5vw;
    width: 85vw;
    align-items: center;
}

.case-study-image-container {
    align-items: flex-end !important;
    display: flex;
    width: 40vw;
    height: 40vw;
}

.case-study-slider-image {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

.case-study-content-container {
    width: 40vw;
    justify-content: right;
    text-align: right;
    align-items: flex-end;
    gap: 2vw;
    display: flex;
    flex-direction: column;
}

.case-study-desc {
    letter-spacing: 0;
    line-height: 2vw;
    text-align: right;
}

.img-placeholder {
    height: auto;
    width: 100%;
}

.customer-logo {
    height: auto;
    width: 20.83vw;
}

.case-study-prev-next-container {
    display: flex;
    flex-direction: row;
    gap: 4vw;
    margin-top: 2vw;
}

.previous-link,
.next-link {
    align-items: center;
    display: flex;
    gap: 0.5vw;
}

.case-study-arrow {
    height: 1.04vw;
    width: auto;
}

.case-study-button {
    margin-top: 2vw;
    align-items: center;
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(47.67, 47.67, 117.94) 100%
    );
    border-radius: 1.77vw;
    display: flex;
    padding: 1vw 2vw;
    color: var(--white);
    font-family: var(--font-family-montserrat);
    font-size: var(--font-size-l);
    font-weight: 700;
    letter-spacing: 0;
    line-height: normal;
    text-align: center;
}

/* LATEST PROJECT INSIGHTS - HOMEPAGE */

/* .latest-projects-insights-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    margin-top: 6.46vw;
    width: 85vw;
    margin-left: 7.5vw;
} */

.latest-projects-insights-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    margin-top: 4vw;
    width: 85vw;
}

.latest-insights-project-page {
    margin-top: 0 !important;
    margin-left: 7.5vw;
}

.latest-projects-insights-inner-container {
    margin-top: 3.19vw;
    display: flex;
    flex-direction: row;
    gap: 3vw;
}

.latest-project-insights-articles-container::-webkit-scrollbar {
    width: 60vw;
    border-radius: 10vw;
    height: 0.7vw;
}

.latest-project-insights-articles-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10vw;
    margin-top: 4vw;
    max-width: 50vw !important;
    margin-left: 15vw !important;
    margin-right: 15vw !important;
}

.latest-project-insights-articles-container::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, #5d81c7 0%, #0c0c41 100%);
    border-radius: 10vw;
}

.latest-project-insights-articles-container::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.latest-project-insights-articles-container {
    display: flex;
    flex-direction: row;
    gap: 2vw;
    width: 76vw;
    overflow: hidden;
    overflow-x: scroll;
    padding-bottom: 5vw;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

.latest-project-insights-article {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    cursor: pointer;
}

.latest-project-insights-image {
    height: 13.36vw;
    object-fit: cover;
    width: 23.75vw;
    border-radius: 1vw;
}

.latest-project-insights-subtitle {
    letter-spacing: 0;
    line-height: 1.94vw;
    margin-top: 1.39vw;
}

.latest-project-insights-desc {
    letter-spacing: 0;
    line-height: 1.5vw;
    margin-top: 0.7vw;
    max-width: 23.75vw;
}

.latest-project-insights-navigation {
    width: 1vw;
}

.latest-insights-arrow {
    margin-top: 8.7vw;
    width: 1vw;
}

.latest-insights-slider-container {
    align-items: flex-start;
    background-color: #e6e6e6;
    border-radius: 3.06vw;
    display: flex;
    margin-left: 0.38vw;
    margin-top: 3.54vw;
    min-width: 39.03vw;
    padding: 0 14.86vw;
}

.divider-10 {
    background: linear-gradient(
        180deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    border-radius: 3.06vw;
    height: 0.56vw;
    width: 9.24vw;
}

/* TEAM SECTION - HOMEPAGE */

.note-from-team-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 2vw;
    padding-bottom: 5vw !important;
}

.note-from-team-left {
    position: relative;
    display: flex;
    width: 100%;
    flex-direction: column;
}

.note-from-team-right {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 0.5vw;
    align-items: center;
    justify-content: center;
    align-items: stretch;
    margin-top: 3vw;
}

.about-nx {
    border-radius: 1vw;
    background: #fff;
    width: 20%;
    position: relative;
    padding: 1vw;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
}

.meet-our-team-container {
    align-items: center;
    background: linear-gradient(
        180deg,
        rgba(240.12, 240.12, 240.12, 0) 0%,
        rgb(240.12, 240.12, 240.12) 46.88%
    );
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
    margin-top: 10vw;
    padding-bottom: 5vw;
}

.meet-our-team-no-margin {
    margin-top: 0 !important;
    background: rgb(226.31, 226.31, 226.31);
}

.team-container {
    align-items: flex-start;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 4vw;
    margin-top: 3.54vw;
    width: 80vw;
    justify-content: center;
}

.team-container-flex {
    display: flex;
    flex-direction: row;
    gap: 1vw;
    width: 80vw;
    justify-content: center;
}

.team-card {
    align-items: center;
    display: flex;
    flex-direction: column;
}

.team-card-bordered {
    padding: 1vw;
    border-radius: 1vw;
    background: #fff;
    width: 19.25vw;
}

.member-image {
    height: auto;
    object-fit: cover;
    width: 17vw;
    border-radius: 1vw;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    transition: all 300ms ease-in-out;
}

.team-member-image-new img {
    height: auto;
    object-fit: cover;
    width: 17vw;
    height: 17vw;
    border-radius: 1vw;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    transition: all 300ms ease-in-out;
}

.member-image:hover,
.team-member-image-new img:hover,
.team-card-bordered:hover img {
    -webkit-filter: none;
    filter: none;
    transform: scale(1.05);
}

.member-name {
    margin-top: 1.39vw;
}

.member-name-flex {
    display: flex;
    flex-direction: row;
    gap: 0.5vw;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.member-name-flex img {
    width: 1.5vw;
    height: auto;
    transition: all 300ms ease-in-out;
    cursor: pointer;
}

.member-name-flex:hover img {
    transform: scale(1.1);
}

.member-role {
    color: var(--sonic-silver);
    font-family: var(--font-family-lato);
    font-size: var(--font-size-m);
    font-weight: 400;
    line-height: normal;
    margin-top: 0.5vw;
    text-align: center !important;
}

.member-desc {
    color: var(--gravel);
    font-family: var(--font-family-open_sans);
    font-size: var(--font-size-l);
    font-weight: 400;
    line-height: normal;
    margin-top: 0.76vw;
    text-align: center !important;
}

/* CTA SECTION - HOMEPAGE */

.cta-container {
    align-items: center;
    background: linear-gradient(
        180deg,
        rgb(44, 73, 129) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    display: flex;
    flex-direction: column;
    padding: 3.82vw 0;
    width: 100%;
}

.cta-schedule-a-call-button {
    align-items: flex-start;
    border: 0.1vw solid;
    border-color: var(--indigo);
    border-radius: 8.72vw;
    display: flex;
    margin-top: 2.85vw;
    padding: 1.37vw 3.47vw;
}

.cta-schedule-a-call {
    line-height: normal;
    text-align: center;
}

.cta-desc {
    letter-spacing: 0;
    line-height: 1.81vw;
    margin-top: 1.94vw;
    text-align: center;
    width: 60vw;
}

.cta-title {
    line-height: normal;
    text-align: center;
    width: 70vw;
}

/* PORTFOLIO */

.portfolio-container {
    align-items: center;
    background: linear-gradient(
        180deg,
        rgba(226.31, 226.31, 226.31, 0) 0%,
        rgb(226.31, 226.31, 226.31) 100%
    );
    display: flex;
    flex-direction: column;
    padding: 4.93vw 10vw;
    width: 100%;
}

.portfolio-container.portfolio-page {
    padding-top: 0.8vw !important;
}

.portfolio-container.active {
    display: flex !important;
}

.portfolio-container.inactive {
    display: none !important;
}

.logos-container {
    align-items: center;
    align-self: center;
    width: 85vw;
    display: flex;
    flex-wrap: wrap;
    gap: 4vw;
    justify-content: center;
    margin-top: 4.17vw;
}

.logo-col {
    width: 13.8vw;
    align-items: center;
    justify-content: center;
    text-align: center;
    height: 5vw;
    display: flex;
}

.portfolio-logo {
    width: 13.8vw;
    height: auto;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

.portfolio-additional-text {
    margin-top: 4vw !important;
}

.portfolio-article-container {
    padding-bottom: 5vw !important;
}

.project-banner-desc {
    letter-spacing: 0;
    line-height: 2vw;
    text-align: left;
    margin-top: 2vw;
}

.project-assets-container {
    display: flex;
    flex-direction: column;
    gap: 8vw;
    margin-bottom: 5vw;
    width: 100%;
}

.project-assets-images-container {
    display: grid;
    align-items: flex-start;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 1%;
    width: 100%;
    margin-top: 3vw;
}

.project-assets-videos-container {
    display: grid;
    align-items: flex-start;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2%;
    width: 100%;
    margin-top: 3vw;
}

/* PROJECT BANNER */

.project-hero-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    min-height: 60vh;
    padding: 0;
    width: 100%;
    margin: 0;
}

.project-image {
    max-width: 30vw;
}

.project-socials {
    align-self: flex-start;
    display: flex;
    flex-direction: row;
    gap: 2vw;
    align-items: flex-start;
    margin-top: 3vw;
}

.social-icon-project {
    height: 2vw;
    width: auto;
}

.project-hero-inner-container {
    display: flex;
    flex-direction: row;
    gap: 4vw;
    width: 90vw;
    margin-left: 5vw;
}

.project-hero-left-container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.project-hero-logo-container {
    align-self: flex-start;
}

/* PROJECT ARTICLE */

.project-container {
    background-image: url(../images/projectcontainer-lines.svg);
    width: 100%;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: 100%;
    padding-bottom: 18vw;
}

.project-empty-space {
    height: 4vw;
}

.project-article-container {
    display: flex;
    flex-direction: row;
    gap: 5vw;
    width: 100%;
    align-items: flex-start;
    margin-top: 3vw;
    margin-bottom: 3vw;
}

.project-article-subtitle {
    letter-spacing: 0.41vw;
    line-height: 2.22vw;
    text-transform: uppercase;
    color: var(--storm-dust);
    font-family: var(--font-family-open_sans);
    font-size: 1vw;
    font-weight: 400;
    font-style: normal;
}

.project-article-left {
    display: flex;
    flex-direction: column;
    width: 60%;
}

.project-article-left p {
    margin-top: 1vw;
}

.project-article-right {
    display: flex;
    flex-direction: column;
    width: 40%;
    gap: 2vw;
}

.project-stats-container {
    display: flex;
    flex-direction: row;
    margin-top: 1vw;
}

.project-stat {
    display: flex;
    flex-direction: column;
    gap: 0.5vw;
}

h2.project-article {
    margin: 0 !important;
}

.project-article-feedback-container {
    display: flex;
    flex-direction: row;
    gap: 1vw;
    align-items: center;
}

.numbers-by-month {
    font-size: 1.3vw;
    font-weight: bold;
    margin-top: 3vw !important;
    margin-bottom: 0.5vw;
}

.project-article-feedback-author {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.project-stat-divider {
    width: 0.1vw;
    height: 4vw;
    background-color: #e3e3e3;
    margin-left: 2vw;
    margin-right: 2vw;
    align-self: center;
    justify-content: center;
}

.project-article-monthly-followers-container-all {
    display: flex;
    flex-direction: column;
    gap: 1.5vw;
    margin-top: 1.5vw;
}

.project-article-monthly-followers-container {
    display: flex;
    flex-direction: row;
    gap: 1vw;
}

.project-article-month {
}

.project-article-line-container {
    height: 0.5vw;
    width: 100%;
    background-color: #d9d9d9;
    border-radius: 1vw;
    align-items: center;
}

.project-article-line {
    background: linear-gradient(90deg, #5d81c7 0%, #0c0c41 100%);
    height: 0.5vw;
    border-radius: 1vw;
}

.project-article-followers-number {
}

.project-article-month,
.project-article-followers-number {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 0.8vw;
    line-height: 0.8vw;
    color: #3e3d3d;
}

.feedback-image {
    width: 5vw;
    height: 5vw;
    object-fit: cover;
    border-radius: 1vw;
}

.blue {
    color: #3b508e !important;
}

/* OUR CUSTOMERS REVIEWS - HOMEPAGE */

.customer-reviews-container {
    align-items: center;
    background-image: url(../images/maincontainer-lines.svg),
        linear-gradient(
            180deg,
            rgb(44, 73, 129) 0%,
            rgb(12.42, 12.42, 64.81) 100%
        );
    width: 100%;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: 100%;
    padding-bottom: 5vw;
    display: flex;
    flex-direction: column;
    padding: 4vw 0;
    /* margin-top: 4vw; */
}

.customers-reviews-inner-container {
    margin-top: 4vw;
    overflow: hidden;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 5vw;
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 2vw;
}

/*
.customers-reviews-inner-container:first-child {
  margin-left: 2vw !important;
}

.customers-reviews-inner-container:last-child {
  margin-right: 2vw;
}
*/

.customers-reviews-inner-container::-webkit-scrollbar {
    width: 50vw;
    border-radius: 10vw;
    height: 0.7vw;
}

.customers-reviews-inner-container::-webkit-scrollbar-track {
    background: rgb(255, 255, 255, 0.5);
    border-radius: 10vw;
    margin-top: 4vw;
    max-width: 50vw !important;
    margin-left: 25vw !important;
    margin-right: 25vw !important;
}

.customers-reviews-inner-container::-webkit-scrollbar-thumb {
    background: #fff;
    border-radius: 10vw;
}

.customers-reviews-inner-container::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.customers-reviews-inner-container > div:first-child {
    margin-left: 2vw;
}
.customers-reviews-inner-container > div:last-child {
    margin-right: 2vw;
}

.review-card {
    align-items: center;
    background: linear-gradient(
        180deg,
        rgb(43.93, 73.16, 128.56) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    border-radius: 0.63vw;
    box-shadow: 0vw 0.11vw 0.74vw #131778a8;
    display: flex;
    flex-direction: column;
    gap: 2vw;
    padding: 3vw;
    width: 35vw !important;
    flex-shrink: 0;
    justify-content: center;
}

.review-content {
    line-height: 1.5vw;
    text-align: center;
}

.review-customer-logo {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
}

.review-logo {
    height: auto;
    width: 15vw;
}

.review-customer-container {
    align-self: center;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1vw;
}

.review-customer-name-title-container {
    justify-content: left !important;
    gap: 0.5vw;
    display: flex;
    flex-direction: column;
}

.review-customer-image {
    align-self: flex-start;
    height: 4.58vw;
    width: 4.58vw;
    object-fit: cover;
    border-radius: 50%;
}

/* CONTAC FORM SECTION - HOMEPAGE */

.contact-container {
    background-image: url(../images/maincontainer-lines.svg),
        linear-gradient(
            180deg,
            rgba(240.12, 240.12, 240.12, 0) 0%,
            rgb(240.12, 240.12, 240.12) 46.88%
        );
    width: 100%;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: 100%;
    padding-bottom: 20vw;
    margin-top: 5vw;
}

.contact-container.contact-page {
    background-image: url(../images/herobanner-lines.svg);
}

.contact-container.contact-page-success {
    display: flex;
    align-items: center;
    justify-content: center;
}

.contact-inner-container {
    display: flex;
    flex-direction: row;
    width: 75vw;
    gap: 8vw;
    margin-left: 12.5vw;
    align-items: flex-start !important;
}

.contact-section-title {
    text-align: left !important;
}

.contact-section-subtitle {
    text-align: left !important;
    width: 100% !important;
}

.contact-section-desc {
    text-align: left !important;
    max-width: 35vw;
}

.contact-form-content-container {
    width: 35vw;
}

.tell-us-about-you {
    font-size: 45px !important;
    text-transform: none !important;
}

.contact-form-container {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    width: 35vw;
}

.contact-form-input-fields {
    margin-top: 2vw;
    display: flex;
    flex-direction: column;
    gap: 0.7vw;
}

.contact-form-stats-container {
    align-items: center;
    display: flex;
    margin-top: 1.74vw;
    gap: 2vw;
}

.contact-form-inner-stat-container {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: 0.62vw;
}

.contact-form-stat-title {
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: linear-gradient(
        180deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    background-clip: text;
    line-height: normal;
    text-fill-color: transparent;
}

.contact-form-stat-title.contact-page {
    background: none !important;
    -webkit-text-fill-color: #fff;
}

.contact-form-stat-desc {
    line-height: 1.67vw;
}

.contact-form-content-divider {
    background-color: var(--sonic-silver);
    height: 3.61vw;
    opacity: 0.2;
    width: 0.07vw;
}

.contact-form-fn-ln-container {
    gap: 0.49vw;
    margin-top: 3.4vw;
    align-items: flex-start;
    display: flex;
}

.contact-form-input-field {
    align-items: flex-start;
    background-color: var(--alto);
    border-radius: 4.65vw;
    padding: 1.32vw 1.94vw;
    width: 35vw;
    border: 0 !important;
    color: #464646 !important;
}

.contact-form-input-field::placeholder,
.newsletters-input-field::placeholder {
    color: #a7a7a7;
    opacity: 1;
}

.contact-form-input-field:-ms-input-placeholder,
.contact-form-input-field:-ms-input-placeholder {
    color: #a7a7a7;
}

.contact-form-input-field::-ms-input-placeholder,
.contact-form-input-field:-ms-input-placeholder {
    color: #a7a7a7;
}

.get-in-touch-button {
    align-items: center;
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    border-radius: 8.72vw;
    justify-content: center;
    margin-top: 1.32vw;
    padding: 1.8vw 2.44vw;
    width: 35vw !important;
    letter-spacing: 0;
    line-height: normal;
    text-align: center;
    border: 0;
    cursor: pointer;
}

.contact-read-more-button {
    align-items: center;
    display: flex;
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    border-radius: 1.77vw;
    justify-content: center;
    margin-top: 2vw;
    padding: 0.97vw 2vw;
    color: var(--white);
    font-family: var(--font-family-montserrat);
    font-size: 0.97vw;
    font-weight: 600;
    letter-spacing: 0;
    line-height: normal;
    text-align: center;
    width: fit-content;
    cursor: pointer;
}

.our-projects-button {
    margin-top: 0 !important;
}

.contact-form-additional-desc {
    letter-spacing: 0;
    line-height: 1.4vw;
    margin-top: 1vw;
    text-align: center;
    width: 30vw;
    justify-content: center;
    align-self: center;
}

.contact-section-values {
    margin-top: 2vw;
    display: flex;
    gap: 1vw;
    flex-direction: column;
}

.contact-page-success {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 60vw;
    margin-left: 20vw;
    justify-content: center;
}

h1.contact-thankyou {
    color: #fff !important;
    text-align: center;
    justify-content: center;
    font-family: var(--font-family-montserrat) !important;
    font-size: 5vw;
    font-weight: 700 !important;
    font-style: normal !important;
    text-transform: uppercase;
    align-self: center;
    display: inline;
    margin-top: 18vh;
    line-height: 3vw;
}

.contact-thankyou-smaller {
    font-size: 2vw;
}

.contact-success-text {
    color: #fff !important;
    text-align: center;
    margin-top: 4vw;
    line-height: normal;
}

/* TWITTER SPACES */

.twitter-spaces-outer-container {
    display: flex;
    background: linear-gradient(180deg, rgba(8, 5, 20, 0) 34.04%, #080514 100%),
        radial-gradient(
            91.92% 38.3% at 50% 50%,
            #0f2860 0%,
            #0e255c 36%,
            #0b1e50 70%,
            #081540 100%
        );
    /* background: linear-gradient(
        180deg,
        rgba(240.12, 240.12, 240.12, 0) 0%,
        rgb(240.12, 240.12, 240.12) 46.88%
    ); */
    width: 100vw;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 6vw 0;
}

.twitter-spaces-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    width: 100vw;
    align-items: center;
    justify-content: center;
}

.twitter-spaces-container a:link,
.twitter-spaces-container a:visited {
    color: #fff;
    text-decoration: none;
    font-weight: 600;
}

.twitter-spaces-container a:hover,
.twitter-spaces-container a:active {
    text-decoration: underline;
}

.spaces-outer-container {
    position: relative;
    display: flex;
    flex-direction: row;
    gap: 2vw;
    width: 100vw;
    margin-top: 2vw;
}

.spaces-slider-space {
    height: 1vw;
    width: 100%;
}

.spaces-slide-container {
    display: flex;
    flex-direction: column;
    padding: 1vw;
    border-radius: 1vw;
    background: linear-gradient(
        180deg,
        rgba(44, 73, 129, 0.3) 0%,
        rgba(12, 12, 65, 0.3) 100%
    );
    justify-content: space-between;
    height: auto;
    min-height: 230px;
    margin-left: 0.5vw;
    margin-right: 0.5vw;
    transition: all 0.4s ease-in-out;
    width: 25vw;
}

/* Tooltip Styling */
.spaces-tooltip {
    position: absolute;
    top: 10px; /* Adjust this to position the tooltip above */
    right: 10px;
    /*     transform: translateX(-50%); */
    display: none;
    border-radius: 10px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 1000000;
}

.spaces-tooltip img {
    width: auto; /* Adjust size */
    height: 200px;
    border-radius: 10px;
}

/* Show tooltip on hover */
.spaces-slide-container {
    position: relative;
}

.spaces-slide-container:hover .spaces-tooltip {
    display: block;
}

.spaces-speakers-image img {
    position: relative;
    border-radius: 20px;
    width: 100%;
    height: auto;
    margin: 20px 0;
}

.blog-container .spaces-slide-container {
    background: linear-gradient(90deg, #5d81c7 0%, #0c0c41 100%) !important;
    width: 40vw;
    min-height: 30vh;
    opacity: 0.8;
}

.blog-container .spaces-slide-container:hover {
    background: linear-gradient(90deg, #5d81c7 0%, #0c0c41 100%) !important;
    opacity: 1;
}

.spaces-slide-container:hover {
    transform: scale(1.08);
    cursor: pointer;
}

.spaces-first-container {
    display: flex;
    flex-direction: column;
    gap: 1vw;
}

.handle-container {
    display: flex;
    flex-direction: row;
    gap: 0.5vw;
    align-items: center;
}

.handle-container .handle-logo {
    width: 1.5vw;
    height: 1.5vw;
    border-radius: 50%;
    border: 2px solid var(--white);
    object-fit: cover;
}

.handle-name {
    color: var(--white);
    font-family: var(--font-family-montserrat);
    font-size: 1vw;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
}

.tbadge {
    height: 1vw;
    width: auto;
}

.host-container {
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.3);
    padding: 0.3vw 0.5vw;
    border-radius: 0.3vw;
    color: var(--white);
    font-family: var(--font-family-montserrat);
    font-size: 0.8vw;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
}

.space-title {
    color: var(--white);
    font-family: var(--font-family-montserrat);
    font-size: 1.5vw;
    font-style: normal;
    font-weight: 800;
    line-height: 100%;
}

.space-details {
    display: flex;
    flex-direction: row;
    gap: 0.4vw;
    align-items: center;
}

.details-text {
    color: var(--white);
    font-family: var(--font-family-montserrat);
    font-size: 1vw;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
}

.space-details .circle {
    width: 0.2vw;
    height: 0.2vw;
    border-radius: 50%;
    background-color: var(--white);
}

.space-play-button {
    display: flex;
    flex-direction: row;
    gap: 1vw;
    width: 100%;
    padding: 0.5vw 0;
    background-color: #eff3f4;
    align-items: center;
    justify-content: center;
    border-radius: 2vw;
    transition: all 0.4s ease-in-out;
    align-self: center;
    margin-top: 30px;
}

.stream-play-button {
    position: relative;
    display: flex;
    flex-direction: row;
    gap: 1vw;
    width: 100%;
    padding: 0.5vw 0;
    background-color: #eff3f4;
    align-items: center;
    justify-content: center;
    border-radius: 2vw;
    transition: all 0.4s ease-in-out;
    align-self: center;
}

.spaces-slide-container:hover .space-play-button,
.space-play-button:hover,
.stream-play-button:hover {
    cursor: pointer;
    animation: spacePlayButton 1s infinite ease-in-out;
}

@keyframes spacePlayButton {
    0% {
        width: 100%;
    }
    50% {
        width: 50%;
    }
    100% {
        width: 100%;
    }
}

.play-text {
    color: #000;
    font-family: var(--font-family-montserrat);
    font-size: 1vw;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
}

/* FOOTER */

.footer-container {
    align-items: center;
    background: linear-gradient(
        180deg,
        rgb(44, 73, 129) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: center;
}

.newsletters-section {
    margin-top: 5vw;
    width: 70vw;
    display: flex;
    flex-direction: column;
    gap: 2vw;
    justify-content: center;
    align-items: center;
}

.section-desc-newsletters {
    margin-top: 0 !important;
}

.newsletters-form-container {
    display: flex;
    flex-direction: row;
}

.newsletters-input-container {
    align-items: flex-end;
    background-color: #efefef;
    border-radius: 4.74vw;
    display: flex;
    height: 5.35vw;
    min-width: 51.53vw;
    padding: 1.87vw 4.46vw;
    height: 5.35vw;
    width: 50vw;
}

.newsletters-join-button {
    align-items: center;
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    border-radius: 10vw;
    cursor: pointer;
    height: 5.35vw;
    justify-content: center;
    padding: 1.42vw 4vw;
    transition: all 0.2s ease;
    color: var(--white);
    font-family: var(--font-family-montserrat);
    font-size: var(--font-size-l);
    font-weight: 400;
    letter-spacing: 0;
    line-height: normal;
    width: fit-content;
    align-self: flex-end;
    margin-left: -10vw;
    border: 0 !important;
}

.newsletters-input-field {
    background-color: transparent;
    border: 0;
    color: var(--sonic-silver);
    font-family: var(--font-family-montserrat);
    font-size: var(--font-size-l);
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.56vw;
    padding: 0;
    text-align: center;
    white-space: nowrap;
    width: 40vw;
}

.footer-columns-container {
    align-items: flex-start;
    display: flex;
    margin-top: 6.46vw;
    width: 75vw;
    align-self: center;
    gap: 5vw;
}

.footer-column1 {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    width: 25vw;
}

.footer-column2 {
    align-items: flex-start;
    align-self: flex-start;
    display: flex;
    flex-direction: column;
    width: 10vw;
}

.footer-column3 {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    width: 15vw;
}

.footer-column4 {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    width: 10vw;
}

.footer-socials-inner-container {
    align-items: center;
    display: flex;
    flex-direction: row;
    align-self: center;
    gap: 2vw;
}

.footer-socials-email-container {
    align-items: center;
    display: flex;
    align-self: center;
    gap: 0.5vw;
}

.footer-socials {
    align-items: center;
    display: flex;
    align-self: flex-start;
}

.footer-logo {
    height: auto;
    width: 20vw;
}

.footer-column-title {
    line-height: normal;
    margin-bottom: 2vw;
}

.footer-company-desc {
    line-height: 1.81vw;
    margin-top: 2.15vw;
}

.footer-company-info-container {
    align-items: flex-start;
    display: flex;
    gap: 1.25vw;
    margin-top: 1.67vw;
}

.footer-company-info-icon {
    height: auto;
    width: 1vw;
}

.footer-company-info-text {
}

.footer-location-text {
    display: flex;
    flex-direction: column;
    gap: 1vw;
}

.footer-recent-news-posts-container {
    display: flex;
    flex-direction: column;
    gap: 2vw;
}

.footer-recent-news-post {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: 0.42vw;
}

.footer-recent-news-divider {
    background-color: var(--white);
    height: 0.1vw;
    opacity: 0.23;
    width: 100%;
}

.footer-recent-news-post-title {
    letter-spacing: 0;
    line-height: normal;
}

.footer-recent-news-post-published {
    color: #aeadad !important;
    letter-spacing: 0;
    line-height: normal;
}

.footer-socials {
    display: flex;
    flex-direction: row;
    gap: 2vw;
    margin-left: 12.5vw;
    margin-top: 5vw;
}

.footer-send-email-label {
    color: var(--white);
    font-family: var(--font-family-montserrat);
    font-size: var(--font-size-l);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.67vw;
    white-space: nowrap;
}

.social-icon-footer {
    height: 3vw;
    width: auto;
}

.social-icon-footer-mobile-menu {
    height: 7vw !important;
    width: auto;
}

.footer-send-email-arrow {
    height: 1.04vw;
    width: auto;
}

.footer-arrow-top {
    margin: 2vw 0;
}

.footer-arrow-back-to-top {
    height: 1vw;
    width: auto;
}

ul#footer-navigation {
    display: flex;
    flex-direction: column;
    gap: 2vw;
    list-style-image: url(../images/footer-navigation-arrow.svg);
    list-style-position: inside;
}

ul#footer-navigation {
    margin: 0 !important;
    padding: 0 !important;
}

li.footer-navigation-link {
    margin: 0 !important;
    padding: 0 !important;
}

li.footer-navigation-link::before {
    margin: 0 !important;
    padding: 0 !important;
}

.footer-navigation-link .navbar-link {
    font-size: 16px !important;
}

.selected {
    font-weight: 700 !important;
}

/* PORTFOLIO PAGE */

.portfolio-hero-banner-tags {
    display: flex;
    flex-direction: row;
    gap: 1vw;
    margin-top: 2vw;
}

.portfolio-tag-button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 1vw 2vw;

    border: 0.14vw solid rgba(255, 255, 255, 0.8);
    border-radius: 10vw;

    font-family: var(--font-family-montserrat);
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 1vw;

    color: var(--white);
}

.portfolio-tag-button:hover,
.portfolio-tag-button.active {
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    border: 0;
    padding: 1.14vw 2.14vw;
    cursor: pointer;
}

.portfolio-tag-button.active {
    font-weight: 600;
}

.portfolio-browse-projects-container {
    padding: 2vw 0;
    display: flex;
    flex-direction: row;
    gap: 1vw;
}

.portfolio-browse-projects-text {
    font-family: var(--font-family-montserrat);
    font-style: normal;
    font-weight: 400;
    font-size: 1.4vw;
    opacity: 0.8;

    text-align: center;

    color: var(--white);
}

.portfolio-browse-projects-arrow {
    width: 1vw;
    height: auto;
}

.case-study-badge {
    justify-content: center;
    align-items: center;
    align-self: center;
    padding: 0.5vw 1vw;
    min-width: 6vw;
    position: absolute;
    z-index: 2;
    margin-top: 2.5vw;

    background: linear-gradient(90deg, #5d81c7 0%, #252574 100%);
    border-radius: 1vw;

    font-family: "Montserrat";
    font-style: normal;
    font-weight: 600;
    font-size: 10px;
    line-height: 19px;

    color: #ffffff;
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
}

.bw-inverted {
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    -webkit-filter: invert(100%); /* Safari/Chrome */
    filter: invert(100%);
}

/* CONTACT PAGE */
.hero-banner-container-contact-page {
    padding-top: 2vw;
}

/* BLOG PAGE */

.blog-container {
    align-items: flex-start;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 4vw 2vw;
    margin-top: 3.54vw;
    width: 80vw;
    margin-left: 10vw;
    margin-bottom: 5vw;
}

.spaces-page-container .blog-container {
    grid-template-columns: 1fr 1fr !important;
    grid-gap: 1vw 1vw;
    margin-top: 3.54vw;
    width: 82vw;
    margin-left: 9vw;
    margin-bottom: 5vw;
}

.blog-article-container img {
    border-radius: 1vw;
}

.blog-article-container {
    padding-bottom: 15vw;
}

.blog-pagination {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-bottom: 5vw;
}

.blog-pagination .small {
    display: none;
    visibility: hidden;
}

.blog-article-content-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 4vw;
    width: 100%;
    margin-bottom: 5vw;
}

.flex-start {
    align-items: flex-start !important;
}

.flex-center {
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100%;
}

.blog-article-content-left,
.blog-article-content-right {
    width: 50%;
}

.blog-article-container ul {
    list-style: disc;
    color: var(--sonic-silver) !important;
}

/* PAGINATION */

.page-item {
    margin: 0 5px;
    text-align: center;
}

.page-link {
    outline: initial !important;
    box-shadow: initial !important;
    border: initial;
    padding: 8px 9px;
    line-height: 1.5;
    font-size: 1.5em;
    min-width: 3.25rem;
    min-height: 3.25rem;
    color: 10px;
    border-radius: 15px !important;
    background: #fff;
    color: #274077 !important;
}
.page-link:focus {
    background: #fff;
    color: #274077;
}
.page-link:hover,
.page-link:hover:focus {
    background: #274077;
    color: #fff;
}
.page-link svg {
    width: 15px;
    height: 15px;
    vertical-align: top;
    margin-top: 2px;
    margin-left: 2px;
}
.page-link i {
    margin-left: 1px;
}

.page-item.active .page-link {
    background: #274077 !important;
    box-shadow: initial !important;
    border: 0 !important;
    color: #fff !important;
}

.page-item.disabled .page-link {
    opacity: 0.5;
    color: #274077;
    background: #fff;
    box-shadow: initial !important;
}

.page-item:first-child .page-link,
.page-item:last-child .page-link {
    border-radius: 10px;
    padding-top: 3px !important;
}

.pagination.bordered .page-item .page-link {
    color: #274077;
    box-shadow: inset 0 0 0 1px #274077 !important;
    border-radius: 10px;
    background-color: transparent;
}
.pagination.bordered .page-item .page-link:hover {
    background: #274077;
    color: #fff;
}
.pagination.bordered .page-item.active .page-link {
    box-shadow: initial !important;
    background: #274077;
    color: #fff;
}

.pagination.semibordered .page-item .page-link:hover {
    background-color: transparent;
    color: #274077;
    box-shadow: inset 0 0 0 1px #274077 !important;
    border-radius: 10px;
}
.pagination.semibordered .page-item.active .page-link {
    background-color: transparent;
    color: #274077;
    box-shadow: inset 0 0 0 1px #274077 !important;
    border-radius: 10px;
}

.pagination.pagination-xl .page-link {
    line-height: 1;
    font-size: 1em;
    height: 44px;
    padding: 14px 26px;
    width: 65px;
}
.pagination.pagination-xl .page-link svg {
    margin-top: 0;
}

.pagination.pagination-lg .page-link {
    font-size: 1em;
    line-height: 18px;
    width: 50px;
    padding: 8px 15px;
}

.pagination.pagination-sm .page-link {
    font-size: 0.9em;
    height: 30px;
    width: 30px;
    line-height: 1;
    padding: 9px 3px;
}
.pagination.pagination-sm .page-link svg {
    margin-top: -1px;
}

/* SECTIONS - GENERAL */

.section-subtitle {
    letter-spacing: 0.41vw;
    line-height: 2.22vw;
    text-align: center;
    max-width: 85vw;
    text-transform: uppercase;
}

.article-subtitle {
    letter-spacing: 0.41vw;
    line-height: 2.22vw;
    text-align: left;
    text-transform: uppercase;
    color: rgba(99, 99, 99, 1);
    font-family: "Open Sans";
    font-size: 18px;
    font-weight: 400;
    font-style: normal;
}

.section-assets-subtitle {
    letter-spacing: 0.41vw;
    line-height: 2.22vw;
    text-align: center;
    justify-content: center;
    width: 100vw;
}

.section-subtitle.contact-page,
.section-title.contact-page,
.section-desc.contact-page,
.contact-form-stat-desc.contact-page,
.services-value-desc.contact-page,
.services-value-title.contact-page,
.contact-form-stat-title.contact-page,
.contact-form-additional-desc.contact-page {
    color: #fff !important;
}

.section-title {
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    background-clip: text;
    letter-spacing: 0;
    line-height: normal;
    text-align: center;
    text-fill-color: transparent;
    text-transform: uppercase;
    margin-top: 1vw;
}

.section-title.contact-page {
    background: none !important;
    -webkit-text-fill-color: #fff;
}

.section-title-white {
    letter-spacing: 0;
    line-height: normal;
    text-align: center;
    text-fill-color: transparent;
    text-transform: uppercase;
    margin-top: 1vw;
    color: #fff;
}

.section-desc {
    line-height: 1.81vw;
    text-align: center;
    width: 60vw;
    margin-top: 2vw;
}

.section-desc-about-tenx {
    position: relative;
    font-family: "Zen Loop", cursive !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-size: 30px !important;
    line-height: 36px;
    text-align: center;
    margin-top: 2vw;
}

.show-more-link-container {
    align-items: center;
    display: flex;
    gap: 1.04vw;
    margin-top: 4vw;
}

.show-more-link-container-hero-banner {
    align-items: center !important;
    display: flex;
    gap: 1.04vw;
    margin-top: 0.5vw;
    justify-content: center !important;
    min-width: 85vw !important;
}

.show-more-link {
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    background-clip: text;
    color: transparent;
    font-family: var(--font-family-montserrat);
    font-size: var(--font-size-l);
    letter-spacing: 0;
    line-height: normal;
    text-align: center;
    text-fill-color: transparent;
    font-weight: 600;
}

.show-more-link-hero-banner {
    color: #fff;
    font-family: var(--font-family-montserrat);
    font-size: var(--font-size-l);
    letter-spacing: 0.2vw;
    line-height: normal;
    text-align: center;
    text-fill-color: transparent;
    font-weight: 300;
    align-self: center;
    justify-content: center;
    text-decoration: none;
    text-transform: uppercase;
}

/* HERO OUR PROJECTS */
.hero-banner-our-projects-outer-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2vw;
    margin-top: 100px;
}
.hero-banner-our-projects-container {
    display: flex;
    flex-direction: row;
    align-items: stretch; /* change from center to stretch */
    justify-content: center;
    gap: 2vw;
}
.our-project-container {
    border-radius: 20px;
    background: linear-gradient(180deg, #131c2e 0%, #030311 100%);
    display: flex;
    flex-direction: column;
    gap: 30px;
    justify-content: space-between;
    align-items: center;
    width: 22vw;
    padding: 2vw;
    transition: all 0.4s ease-in-out;
    border: 2px transparent;
}

.gd10-container {
    background: url(../images/gd10-container-bg.png) center / cover no-repeat,
        linear-gradient(180deg, rgba(19, 28, 46, 1) 0%, rgba(3, 3, 17, 1) 100%) !important;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.lyra-container {
    background: url(../images/lyra-container-bg.png) center / cover no-repeat,
        linear-gradient(180deg, rgba(19, 28, 46, 1) 0%, rgba(3, 3, 17, 1) 100%) !important;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.opus-container {
    background: url(../images/opus-container-bg.png) center / cover no-repeat,
        linear-gradient(180deg, rgba(19, 28, 46, 1) 0%, rgba(3, 3, 17, 1) 100%) !important;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.moonedge-container {
    background: url(../images/moonedge-container-bg.png) center / cover
            no-repeat,
        linear-gradient(180deg, rgba(19, 28, 46, 1) 0%, rgba(3, 3, 17, 1) 100%) !important;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.our-project-container:hover {
    transform: scale(1.05);
    border: 2px solid #243352;
}

.our-project-container img {
    position: relative;
    max-width: 85%;
    filter: grayscale(1);
    -webkit-filter: grayscale(1);
}
/* .show-more-link-hero-banner a:hover {
  font-weight: 500;
  text-decoration: none;
  color: #fff;
} */

.show-more-arrow {
    width: 1vw;
}

.show-more-arrow-hero-banner {
    width: 0.5vw;
}

.rotate180 {
    transform: rotate(180deg);
}

.rotate90-right {
    transform: rotate(-90deg);
}

.white {
    color: #fff !important;
}

input:focus,
textarea:focus {
    border: 0.2vw solid #222b65 !important;
    color: #464646;
    outline: none;
}

.newsletters-input-field:focus {
    border: 0 !important;
}

.bold {
    font-weight: 700;
}

.only-mobile {
    display: none;
}

h2 {
    font-family: var(--font-family-montserrat) !important;
    font-size: var(--font-size-xxxl) !important;
    font-weight: 700 !important;
    font-style: normal !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    background-clip: text;
    letter-spacing: 0;
    line-height: normal !important;
    text-fill-color: transparent;
    width: auto;
    display: inline-block !important;
    margin-bottom: 2vw !important;
    margin-top: 1vw !important;
}

h3 {
    font-family: var(--font-family-montserrat) !important;
    font-size: var(--font-size-xxl) !important;
    font-weight: 700 !important;
    font-style: normal !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    background-clip: text;
    letter-spacing: 0;
    line-height: normal !important;
    text-fill-color: transparent;
    width: auto;
    display: inline-block !important;
    margin-bottom: 2vw !important;
    margin-top: 1vw !important;
}

p {
    color: var(--sonic-silver) !important;
    font-family: var(--font-family-open_sans) !important;
    font-size: var(--font-size-m) !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 28px !important;
    margin-bottom: 2vw;
}

.review-content p {
    color: var(--white) !important;
    font-family: var(--font-family-open_sans) !important;
    font-size: var(--font-size-l) !important;
    font-weight: 400 !important;
    font-style: italic !important;
    line-height: 2.01vw !important;
    text-align: center !important;
}

.footer-container p {
    color: #fff !important;
}

strong {
    font-weight: bold !important;
}

.footer-container a:link,
.footer-container a:visited {
    color: #fff;
    text-decoration: none;
}

/* BUTTONS ANIMATIONS */

.logo-col,
.footer-arrow-top,
.cta-schedule-a-call-button,
.request-a-quote-menu-button,
.request-a-quote-menu-button-mobile,
.newsletters-join-button,
.get-in-touch-button,
.contact-read-more-button,
.footer-social-icon,
.footer-socials-email-container,
.show-more-link-container,
.schedule-a-call-button,
.tg-check-button,
.join-our-community-button,
.case-study-button,
.show-more-link-container,
.cookies-consent-button,
.social-icon-project {
    cursor: pointer;
    transition: all 300ms ease-in-out;
}

.logo-col:hover,
.footer-arrow-top:hover,
.cta-schedule-a-call-button:hover,
.request-a-quote-menu-button-mobile:hover,
.request-a-quote-menu-button:hover,
.newsletters-join-button:hover,
.get-in-touch-button:hover,
.contact-read-more-button:hover,
.footer-social-icon:hover,
.footer-socials-email-container:hover,
.show-more-link-container:hover,
.tg-check-button:hover,
.schedule-a-call-button:hover,
.join-our-community-button:hover,
.case-study-button:hover,
.show-more-link-container:hover,
.cookies-consent-button:hover,
.social-icon-project:hover {
    transform: scale(1.1);
}

.logo-col:hover .case-study-badge {
    filter: none;
    -webkit-filter: none;
}

/* COOKIES - GDPR */

.cookie-consent {
    position: fixed;
    bottom: 2vw;
    right: 1.5vw;
    width: 20vw;
    margin: 0 !important;
    z-index: 10000;
    border-radius: 0;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center;
    background-image: linear-gradient(
        180deg,
        rgb(44, 73, 129, 0.9) 0%,
        rgb(12.42, 12.42, 64.81, 0.9) 100%
    );
    padding: 2vw;
    gap: 1vw;
    border-radius: 1vw;
}

.cookie-consent__message {
    color: #fff !important;
}

.cookies-consent-button {
    border: 0 !important;
    align-items: center;
    background-color: var(--white);
    border-radius: 1vw;
    display: flex;
    padding: 0.5vw 1vw;
    text-align: center;
    justify-content: center;
    color: #0e0e29;
    font-family: var(--font-family-montserrat);
    font-size: 16px;
    font-weight: 700;
    line-height: normal;
    cursor: pointer;
}

/* TOOLTIP */
.tippy-box[data-theme~="marketing10"] {
    background-color: transparent !important;
    background-image: linear-gradient(
        180deg,
        rgb(44, 73, 129, 0.9) 0%,
        rgb(12.42, 12.42, 64.81, 0.9) 100%
    );
    color: #ffffff;
    padding: 1vw;
}

.convert-to-black {
    -webkit-filter: invert(1);
    filter: invert(1);
}

/* ARTICLE PAGE */
.article-grid-container {
    margin-top: 2vw;
    align-self: center;
    justify-content: center;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: minmax(17vw, auto);
    grid-gap: 2vw;
}

ul.tick {
    list-style-image: url("../images/tick.svg");
    display: inline-block !important;
    margin: 0;
}

ul.tick li {
    font-weight: bold;
    color: #364986;
    padding: 0.5vw 0;
}

.tick-list-blue {
    color: #364986;
    font-weight: bold;
}

.tick-list {
    left: 0.5vw;
    position: relative;
}

ul.circle {
    display: inline-block !important;
    margin: 0;
    list-style: none;
    padding: 0;
}

ul.circle li::before {
    content: "\2022";
    color: #5d81c7;
    display: inline-block;
    font-size: 1vw;
    width: 1vw;
    margin-left: -1vw;
}

ul.circle li {
    color: rgba(114, 114, 114, 1);
    padding: 0.5vw 0;
    margin-left: 1vw;
}

.click-on-project-logo {
    color: #364986;
    margin-top: 1vw;
    font-weight: 600;
}

/* WHAT WE DID */

.what-we-did-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 4vw;
    margin-top: 2vw;
}

.what-we-did-inner-container {
    display: flex;
    gap: 2vw;
    flex-direction: row;
    align-items: flex-start;
}
.what-we-did-left {
    font-family: "Montserrat";
    font-size: 3vw;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    background-clip: text;
    line-height: normal;
    text-fill-color: transparent;
    font-weight: bold;
}
.what-we-did-right {
}
.what-we-did-title {
    font-weight: bold;
    font-family: "Montserrat";
    font-size: 1vw;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    background: linear-gradient(
        90deg,
        rgb(92.72, 129.33, 198.69) 0%,
        rgb(12.42, 12.42, 64.81) 100%
    );
    background-clip: text;
    line-height: normal;
    text-fill-color: transparent;
    margin-bottom: 0.5vw;
}

/* TELEGRAM CHECKER POP-UP */

.check-handle-title {
    font-family: var(--font-family-montserrat);
    font-size: var(--font-size-xxxl);
    text-align: center;
    line-height: 100%;
    color: var(--white);
    font-weight: 700;
}

.check-handle-text {
    font-family: var(--font-family-open_sans);
    font-size: var(--font-size-m);
    text-align: center;
    line-height: 150%;
    color: var(--white);
    font-weight: 400;
    margin-top: 30px;
}

.popup-form-container {
    display: flex !important;
    flex-direction: column;
    gap: 1vw;
    align-items: center;
    justify-content: center;
}

.tg-check-button {
    color: #0e0e29;
    font-family: var(--font-family-montserrat);
    font-size: 1vw;
    font-weight: 800;
    line-height: normal;
    align-items: center;
    background-color: var(--white);
    border-radius: 7.04vw;
    display: flex;
    height: 3.5vw;
    padding: 0 3vw;
    text-align: center;
    justify-content: center;
    align-self: center !important;
    margin: 30px auto 0 auto;
}

#popup-box {
    margin-top: 12.5vw;
    color: #ffffff;
    max-width: 60vw;
    padding: 3vw 2vw;
    border-radius: 2vw;
    z-index: 10000000000000;
    justify-content: center;
    text-align: center;
}

#check-message-box {
    display: none;
}

#popup-close {
    position: absolute;
    top: -15px;
    right: -15px;
    cursor: pointer;
    width: 40px;
    height: auto;
}

#popup-box input {
    padding: 1vw 2vw;
    border: 0.15vw solid #333;
    width: 100%;
    border-radius: 1vw;
    margin-top: 30px;
}

.check-handle-icon {
    width: 4.5vw;
    height: auto;
    margin-bottom: 0.7vw;
}

#valid-true,
#valid-false {
    display: none;
}

/* YOUTUBE VIDEOS */
.embed-container {
    position: relative;
    padding-bottom: 30.25%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
}
.embed-container iframe,
.embed-container object,
.embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 1vw;
}

.loader,
.loader-black {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: block;
    margin: 15px auto;
    position: relative;
    color: #fff;
    box-sizing: border-box;
    animation: animloader 2s linear infinite;
}

.subscribed-contact-success,
.subscribed-contact-error {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.loader {
    color: #fff;
}

.loader-black {
    color: #fff;
}

@keyframes animloader {
    0% {
        box-shadow: 14px 0 0 -2px, 38px 0 0 -2px, -14px 0 0 -2px, -38px 0 0 -2px;
    }
    25% {
        box-shadow: 14px 0 0 -2px, 38px 0 0 -2px, -14px 0 0 -2px, -38px 0 0 2px;
    }
    50% {
        box-shadow: 14px 0 0 -2px, 38px 0 0 -2px, -14px 0 0 2px, -38px 0 0 -2px;
    }
    75% {
        box-shadow: 14px 0 0 2px, 38px 0 0 -2px, -14px 0 0 -2px, -38px 0 0 -2px;
    }
    100% {
        box-shadow: 14px 0 0 -2px, 38px 0 0 2px, -14px 0 0 -2px, -38px 0 0 -2px;
    }
}

/* MOONEDGE LATEST PROEJCTS */

.latest-projects-container {
    padding: 0;
    background: linear-gradient(0deg, #fff 5.37%, #0d0f43 80.25%);
    margin-bottom: 50px;
    margin-top: -2px;
}

.latest-projects-inner-container {
    display: flex;
    flex-direction: column;
}

.slider-container {
    position: relative;
    width: 100vw;
    margin-top: 30px;
}

.slide-item-container {
    border-radius: 1vw;
    background: linear-gradient(180deg, #131c2e 0%, #030311 100%);
    display: flex;
    flex-direction: column;
    padding: 0.7vw 0.7vw 1.5vw 0.7vw;
    width: 25vw;
    gap: 1vw;
}

.slide-item-container:hover {
    cursor: pointer;
}

img.slider-item {
    width: 100%;
    height: 20vw !important;
    object-fit: cover;
    border-radius: 1vw 1vw 0 0;
}

.slide-item-title {
    color: #fff;
    font-size: 26px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    text-transform: capitalize;
    padding: 0.4vw 0.7vw 0 0.7vw;
}

.slide-item-raised-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0 0.7vw;
}

.slide-item-container p,
.slide-item-raised-container p {
    color: #fff !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
}

.fw-700 {
    font-weight: 700 !important;
}

.slide-item-divider,
.item-divider {
    width: 100%;
    height: 0.15vh;
    opacity: 0.15;
    background: var(
        --liner-white-15,
        linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0) 100%)
    );
}

.slide-item-divider {
    margin: 0.4vw 0.7vw;
}

.slide-item-status-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0 0.7vw;
    align-items: center;
}

.status-icon-container {
    display: flex;
    flex-direction: row;
    gap: 0.5vw;
    align-items: center !important;
    justify-content: center !important;
}

.status-icon-container p {
    align-self: center !important;
    margin-top: 0.5vw;
}

img.status-icon {
    width: 1.35vw;
    height: auto;
}

.round-container {
    width: fit-content;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    text-transform: uppercase;
    color: #000;
    border-radius: 20px;
}

.community-round,
.vc-round {
    background-color: #f7e26d;
}

.ido-round {
    background-color: #3772ff;
    color: #fff !important;
}

.roi-container {
    display: flex;
    width: fit-content;
    padding: 0.4vw 0.93vw;
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
    color: var(--white);
    font-family: var(--basic-font);
    font-size: var(--s-s);
    font-style: normal;
    font-weight: 500;
    line-height: var(--s-s);
    background: #3772ff;
    border-radius: 3.2vw;
}

.filled-container,
.progress-line {
    display: flex;
    height: 1.2vh;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    flex-grow: 0;
    border-radius: 3vw;
    background: #131f60;
    justify-content: left;
}

.filled-container,
.progress-line {
    width: 50%;
    background: #272727;
}

.progress-line {
    background: linear-gradient(90deg, #5d81c7 0%, #0c0c41 100%);
}

img.prev-next-arrow {
    width: 3.5vw;
    height: auto;
    opacity: 0.85;
    transition: all 0.4s ease-in-out;
}

img.prev-next-arrow:hover {
    opacity: 1;
    transform: scale(1.1);
}

/* MOBILE */

@media screen and (max-width: 600px) and (orientation: portrait) {
    .note-from-team-left {
        width: 85vw !important;
    }

    .note-from-team-right {
        width: 85vw;
        flex-direction: column;
        gap: 3vw;
        align-items: center;
        justify-content: center;
        margin-top: 10vw;
    }

    .about-nx {
        border-radius: 3vw;
        width: 100%;
        padding: 10vw;
        min-height: 40vw;
    }

    .team-container-flex {
        display: flex;
        flex-direction: column;
        gap: 3vw;
        width: 85vw;
        justify-content: center;
    }

    .team-card-bordered {
        padding: 6vw;
        border-radius: 3vw;
        background: #fff;
        width: 100%;
        gap: 3vw;
    }

    .team-member-image-new img {
        width: 73vw;
        height: 50vw;
        border-radius: 3vw;
    }

    .member-name-flex {
        gap: 3vw;
    }

    .member-name-flex img {
        width: 6vw;
    }

    /* TOP MENU */

    .top-menu {
        display: none;
    }

    .top-menu-mobile {
        display: flex;
        flex-direction: row;
        height: 15vh;
        left: 0;
        min-width: 100vw;
        position: absolute;
        top: 0;
    }

    .top-menu-mobile-left {
        align-self: flex-start;
        margin-top: 5vh;
    }

    .top-menu-mobile-right {
        align-self: flex-start;
        text-align: right;
        justify-content: right;
        top: 5vh;
        right: 10vw;
        position: absolute;
    }

    .marketing10-header-logo-mobile {
        height: auto;
        width: 60vw;
        margin-left: 0;
        z-index: 100000000000000;
    }

    .hamburger-menu-icon {
        height: auto;
        width: 6vw;
    }

    /* HERO HEADER */

    .hero-top-banner {
        width: 100%;
        padding: 4vw 0;
        margin-top: 10vw;
    }

    .hero-top-banner div {
        font-size: var(--font-size-m);
        line-height: var(--font-size-m);
        gap: 2vw;
    }

    .hero-top-banner img {
        height: 6vw;
        border-radius: 1vw;
        margin-left: 6vw;
    }

    .hero-banner-container {
        min-height: 100vh;
        padding: 10vh 0 18vw 0;
        justify-content: flex-start;
        gap: 2vh;
    }

    .hero-banner-title {
        font-size: calc(36px + 1vh) !important;
        line-height: calc(36px + 1vh) !important;
        text-align: center;
        max-width: 80vw !important;
        margin-top: 5vh;
    }

    .hero-banner-desc-homepage {
        font-size: 30px;
        line-height: 30px;
        margin-top: 4vw;
        margin-bottom: 2vw;
    }

    .subhero-banner-container .hero-banner-title {
        text-align: center !important;
    }

    .hero-banner-desc {
        margin-top: 16px;
        font-size: 2.2vh;
        line-height: 3vh;
        text-align: left;
        max-width: 80vw !important;
    }

    .subhero-banner-container .hero-banner-desc {
        text-align: center !important;
        margin-top: 8vw !important;
    }

    .hero-banner-bottom {
        padding: 0;
        width: 100%;
        margin-top: 6vh;
        position: relative !important;
        gap: 5vh;
    }

    .button-container {
        flex-direction: column !important;
        gap: 3vh;
        align-self: flex-start;
        margin-left: 10vw;
    }

    .join-our-community-button {
        gap: 5vw;
        height: 7vh;
        width: 80vw;
    }

    .discord-icon {
        height: 3vh;
    }

    .join-our-community {
        font-size: 18px;
    }

    .schedule-a-call-button,
    .tg-check-button {
        height: 7vh;
        width: 80vw;
    }

    .schedule-a-call {
        font-size: 18px;
    }

    .hero-banner-logos-container::-webkit-scrollbar {
        display: none;
        width: 0;
    }

    .hero-banner-logos-container {
        gap: 9.51vw;
        width: 100%;
        overflow: hidden;
        overflow-x: scroll;
        white-space: nowrap;
    }

    .hero-banner-project-logos {
        width: 60vw;
    }

    .hero-banner-logos-container .first-logo {
        margin-left: 10vw;
    }

    .hero-banner-logos-container .last-logo {
        margin-right: 10vw;
    }

    /* SUBPAGES BANNER */

    .subhero-banner-container {
        background-image: url(../images/subpage-banner-lines-mobile.svg),
            linear-gradient(
                180deg,
                rgb(44, 73, 129) 0%,
                rgb(12.42, 12.42, 64.81) 100%
            );
        min-height: 50vh;
    }

    /* HOMEPAGE VIDEO SLIDER */

    .homepage-video-slider-container {
        padding-bottom: 12vw;
        gap: 6vw;
        padding-top: 18vw;
    }

    .slider-video {
        width: 80vw;
        min-width: 80vw;
        height: auto;
    }

    .video-style {
        border-radius: 2vw;
    }

    /* SERVICES */

    .services-container {
        background-size: 200%;
        padding-bottom: 15vw;
    }

    .services-intro-container {
        width: 80vw;
        margin-left: 10vw;
        flex-direction: column;
        margin-top: 10vw;
    }

    .services-intro-left,
    .services-intro-right {
        width: 100% !important;
    }

    .services-intro-left {
        gap: 4vw;
    }

    .services-intro-right {
        gap: 5vw;
    }

    .our-innovative-approach-title {
        font-size: calc(26px + 2vw);
    }

    .our-innovative-approach-desc {
        font-size: var(--font-size-l);
        line-height: normal;
    }

    .services-main-element-title {
        gap: 3vw;
    }

    .services-value-title,
    .services-value-desc {
        line-height: normal;
    }

    .services-value-desc {
        margin-top: 4vw;
    }

    .tick {
        height: 5vw;
        width: auto;
    }

    .services-grid-container {
        margin-top: 15vw;
        width: 80vw;
        margin-left: 10vw;
        grid-template-columns: 1fr;
        grid-gap: 10vw;
    }

    .article-grid-container {
        margin-top: 15vw;
        width: 100%;
        grid-template-columns: 1fr;
        grid-gap: 10vw;
    }

    .services-grid-element {
        gap: 6vw;
        padding: 10vw;
        border-radius: 3vw;
        box-shadow: 0vw 1vw 3vw #00000021;
    }

    .service-icon {
        width: 15vw !important;
        height: auto !important;
    }

    .services-grid-element-title {
        font-size: calc(12px + 2vw);
    }

    .services-grid-element-desc {
        font-size: 16px !important;
        line-height: normal;
    }

    .services-grid-element-divider {
        margin-top: 4vw;
        width: 30vw;
    }

    .stats-container {
        border-radius: 3vw;
        box-shadow: 0vw 0.32vw 1.83vw #1920e078;
        display: grid;
        grid-template-columns: 39vw 2vw 39vw;
        width: 80vw;
        margin-left: 10vw;
        height: auto !important;
        margin-top: 10vw;
        align-items: center;
    }

    .stat-inner-container {
        gap: 5vw;
        padding: 9vw 5vw;
    }

    .stat-divider {
        height: 20vw;
        opacity: 0.37;
        width: 0.2vw;
        align-self: center;
        justify-content: center;
    }

    .stat-title {
        font-size: calc(20px + 2vw) !important;
    }

    .stat-description {
        font-size: calc(10px + 1vw) !important;
        text-align: center;
    }

    /* SERVICES - SLIDER */

    .services-slider-container {
        grid-auto-columns: 90vw !important;
        gap: 5vw;
    }

    .services-slider-container::-webkit-scrollbar {
        height: 3vw;
    }

    .services-slider-container::-webkit-scrollbar-thumb {
        min-width: 15vw;
    }

    .services-slider-container > div:first-child {
        margin-left: 5vw;
    }
    .services-slider-container > div:last-child {
        margin-right: 5vw;
    }

    .services-slider-element {
        min-height: 17vw !important;
    }

    /* CASE STUDY */
    .case-study-inner-container {
        flex-direction: column-reverse;
        padding: 10vw 0;
    }

    .case-study-image-container,
    .case-study-content-container,
    .case-study-image-container {
        width: 85vw;
    }

    .case-study-content-container {
        justify-content: center;
        text-align: center;
        align-items: center;
        gap: 10vw;
    }

    .customer-logo {
        width: 60vw;
    }

    .case-study-desc {
        font-size: 16px !important;
        text-align: center;
    }

    .case-study-button {
        padding: 3vw 8vw;
        border-radius: 10vw;
    }

    .case-study-prev-next-container {
        gap: 10vw;
    }

    .previous-link,
    .next-link {
        gap: 2vw;
    }

    .case-study-arrow {
        height: 4vw;
        width: auto;
    }

    /* PROJECTS INSIGHTS - HOMEPAGE */

    .latest-project-insights-articles-container::-webkit-scrollbar {
        height: 3vw;
    }

    .latest-project-insights-articles-container::-webkit-scrollbar-thumb {
        min-width: 15vw;
    }

    .latest-projects-insights-container,
    .twitter-spaces-container {
        margin-top: 15vw;
    }

    .latest-insights-project-page {
        margin-top: 5vw !important;
    }

    .latest-projects-insights-inner-container {
        margin-top: 8vw;
    }

    .latest-project-insights-article {
        width: 76vw;
    }

    .latest-project-insights-articles-container {
        gap: 5vw;
    }

    .latest-project-insights-image {
        height: 42.75vw;
        object-fit: cover;
        width: 76vw;
        border-radius: 4vw;
    }

    .latest-project-insights-subtitle {
        line-height: normal;
        margin-top: 4vw;
    }

    .latest-project-insights-desc {
        line-height: normal;
        margin-top: 3vw;
        max-width: 76vw;
    }

    .latest-project-insights-navigation {
        width: 3vw;
        margin-top: -10vw;
    }

    .latest-insights-arrow {
        margin-top: 30vw;
        width: 3vw;
    }

    /* TEAM MEMBER SECTION - HOMEPAGE */

    .meet-our-team-container {
        margin-top: 20vw;
        padding-bottom: 15vw;
    }

    .team-container {
        grid-template-columns: 1fr 1fr;
        margin-top: 10vw;
        row-gap: 15vw;
        margin-left: -5vw;
        align-items: center;
    }

    .member-name {
        margin-top: 3vw;
        font-size: 16px !important;
    }

    .member-role {
        font-size: 14px !important;
        margin-top: 1vw;
    }

    .member-image {
        height: auto;
        width: 40vw;
    }

    .show-more-link-container {
        gap: 3vw;
        margin-top: 10vw;
    }

    .show-more-link {
        font-size: 16px;
    }

    .show-more-arrow {
        width: 3vw;
    }

    /* CTA SECTION - HOMEPAGE */

    .cta-container {
        padding: 15vw 0;
    }

    .cta-schedule-a-call-button {
        border: 0.5vw solid;
        border-color: var(--indigo);
        border-radius: 15vw;
        margin-top: 10vw;
        padding: 4vw 8vw;
    }

    .cta-desc {
        line-height: normal;
        margin-top: 5vw;
        width: 70vw;
    }

    .cta-title {
        font-size: 26px !important;
        width: 75vw;
    }

    /* PORTFOLIO - HOMEPAGE */
    .portfolio-container {
        padding: 15vw 0;
        width: 100%;
    }

    .logos-container {
        margin-top: 10vw;
        gap: 5vw;
    }

    .logo-col {
        width: 40vw;
        height: 20vw;
    }

    .portfolio-logo {
        width: 40vw;
    }

    .portfolio-additional-text {
        margin-top: 10vw !important;
    }

    /* REVIEWS - HOMEPAGE */
    .customer-reviews-container {
        padding: 15vw 0;
        background-size: 200%;
    }

    .customers-reviews-inner-container {
        margin-top: 8vw;
        gap: 7.5vw;
        padding-bottom: 10vw;
    }

    .customers-reviews-inner-container > div:first-child {
        margin-left: 7.5vw !important;
    }

    .customers-reviews-inner-container > div:last-child {
        margin-right: 7.5vw;
    }

    .customers-reviews-inner-container::-webkit-scrollbar {
        height: 3vw;
    }

    .customers-reviews-inner-container::-webkit-scrollbar-thumb {
        min-width: 15vw;
    }

    .customers-reviews-inner-container > div:first-child {
        margin-left: 2vw;
    }
    .customers-reviews-inner-container > div:last-child {
        margin-right: 8vw;
    }

    .review-card {
        width: 85vw !important;
        gap: 5vw;
        padding: 10vw 0;
        border-radius: 3vw;
    }

    .review-content {
        line-height: normal;
        width: 70vw;
        font-size: 15px !important;
    }

    .review-logo {
        width: 50vw;
    }

    .review-customer-container {
        gap: 4vw;
        margin-top: 2vw;
    }

    .review-customer-name-title-container {
        gap: 2vw;
    }

    .review-customer-name,
    .review-customer-title {
        font-size: 14px !important;
    }

    .review-customer-image {
        width: 15vw;
        height: 15vw;
    }

    /* CONTACT FORM SECTION - HOMEPAGE */

    h1.contact-thankyou {
        font-size: 10vw;
        margin-top: 0;
        line-height: 10vw;
    }

    .subscribed-contact-success {
        margin-top: 8vw;
        margin-left: -2.5vw;
    }

    .contact-thankyou-smaller {
        font-size: 6vw;
    }

    .contact-container {
        background-size: 200%;
        padding-bottom: 40vw;
        margin-top: 15vw;
    }

    .contact-inner-container {
        flex-direction: column;
        width: 75vw;
        gap: 5vw;
        margin-left: 12.5vw;
    }

    .contact-section-desc {
        max-width: 75vw;
    }

    .contact-form-content-container {
        width: 75vw;
    }

    .tell-us-about-you {
        font-size: calc(24px + 1vw) !important;
        text-align: left !important;
    }

    .contact-form-container {
        width: 75vw;
    }

    .contact-form-input-fields {
        margin-top: 5vw;
        gap: 2vw;
    }

    .contact-form-stats-container {
        margin-top: 5vw;
        gap: 2vw;
    }

    .contact-form-inner-stat-container {
        gap: 1vw;
    }

    .contact-form-stat-title {
    }

    .contact-form-stat-desc {
        line-height: normal;
    }

    .contact-form-content-divider {
        height: 15vw;
        opacity: 0.2;
        width: 0.5vw;
    }

    .contact-form-fn-ln-container {
        gap: 0.49vw;
        margin-top: 3.4vw;
        align-items: flex-start;
        display: flex;
    }

    .contact-form-input-field {
        border-radius: 10vw;
        padding: 3vw 6vw;
        width: 75vw;
    }

    .get-in-touch-button {
        border-radius: 10vw;
        justify-content: center;
        margin-top: 1.32vw;
        padding: 5vw 6vw;
        width: 75vw !important;
        font-size: calc(14px + 0.5vw) !important;
    }

    .contact-read-more-button {
        border-radius: 10vw;
        margin-top: 5vw;
        padding: 3vw 6vw;
        font-size: calc(12px + 1vw);
    }

    .contact-form-additional-desc {
        line-height: normal;
        margin-top: 4vw;
        width: 75vw;
        font-size: calc(10px + 1vw) !important;
    }

    .contact-section-values {
        margin-top: 5vw;
        gap: 4vw;
    }

    .contact-page-contact-form {
        margin-top: 8vw;
    }

    /* TWITTER SPACES */

    .twitter-spaces-outer-container {
        padding: 0 0 6vw 0;
    }

    .spaces-outer-container {
        margin-top: 6vw;
    }

    .spaces-slider-space {
        height: 3vw;
    }

    .spaces-slide-container {
        padding: 5vw;
        border-radius: 3vw;
        height: auto;
        margin-left: 7.5vw;
        margin-right: 7.5vw;
        width: 85vw;
        gap: 10vw;
    }

    .spaces-first-container {
        gap: 5vw;
    }

    .handle-container {
        gap: 1.5vw;
    }

    .handle-container .handle-logo {
        width: 6vw;
        height: 6vw;
        border: 2px solid var(--white);
    }

    .handle-name {
        font-size: 3vw;
    }

    .tbadge {
        height: 3vw;
    }

    .host-container {
        padding: 1vw 1.5vw;
        border-radius: 0.9vw;
        font-size: 2.4vw;
    }

    .space-title {
        font-size: 4.5vw;
    }

    .space-details {
        gap: 1.2vw;
    }

    .details-text {
        font-size: 3vw;
    }

    .space-details .circle {
        width: 0.6vw;
        height: 0.6vw;
    }

    .space-play-button {
        gap: 3vw;
        width: 100%;
        padding: 1.5vw 0;
        border-radius: 6vw;
    }

    .play-text {
        font-size: 3vw;
    }

    /* FOOTER */

    .footer-columns-container {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        margin-top: 15vw;
        width: 85vw;
        align-self: center;
        gap: 5vw;
    }

    .footer-column1 {
        grid-column: 1 / 3 !important;
        grid-row: 1;
        width: 100%;
        gap: 5vw;
        margin-bottom: 7vw;
        margin-top: 5vw;
    }

    .footer-column2 {
        grid-row: 2;
        grid-column: 1;
        width: 100%;
    }

    .footer-column4 {
        grid-row: 2;
        grid-column: 2;
        width: 100%;
    }

    .footer-company-desc {
        line-height: normal;
        margin-bottom: 3vw;
    }

    .footer-logo {
        width: 60vw;
    }

    .footer-company-info-icon {
        width: 5vw;
    }

    .footer-column-title {
        margin-bottom: 8vw;
    }

    .footer-company-info-container {
        gap: 4vw;
    }

    .footer-socials {
        margin-top: 15vw;
        flex-direction: column !important;
        gap: 10vw;
        margin-left: 0 !important;
        align-items: center;
        align-self: center;
    }

    .footer-socials-inner-container {
        gap: 9vw;
    }

    .footer-arrow-top {
        margin-top: 10vw;
        margin-bottom: 5vw;
    }

    .footer-send-email-arrow {
        width: 7vw;
        height: auto;
    }

    .footer-arrow-back-to-top {
        width: 8vw;
        height: auto;
    }

    .social-icon-footer {
        width: 12vw !important;
        height: auto;
    }

    .footer-send-email-label {
        font-size: calc(12px + 1vw);
    }

    ul#footer-navigation {
        gap: 5vw;
    }

    .newsletters-section {
        margin-top: 10vw;
    }

    .section-desc-newsletters {
        margin-top: 2vw !important;
    }

    .newsletters-form-container {
        flex-direction: column;
        gap: 6vw;
        margin-top: 5vw;
    }

    .newsletters-join-button {
        justify-content: center;
        padding: 8vw 12vw;
        align-self: center;
        margin-left: 0;
        border: 0 !important;
    }

    .newsletters-input-container {
        align-items: center;
        border-radius: 10vw;
        display: flex;
        padding: 4vw 8vw;
        height: 15vw;
        width: 75vw;
    }

    .newsletters-input-field {
        font-size: var(--font-size-m);
        line-height: normal;
        width: 55vw;
    }

    /* PORTFOLIO PAGE */

    .project-banner-desc {
        font-size: 16px !important;
        text-align: center;
    }

    .portfolio-hero-banner-tags {
        overflow: hidden !important;
        overflow-x: scroll !important;
        padding-bottom: 0;
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        width: 100% !important;
        -ms-overflow-style: none; /* IE and Edge */
        scrollbar-width: none; /* Firefox */
        gap: 2.5vw;
    }

    .portfolio-hero-banner-tags > div:first-child {
        margin-left: 5vw;
    }
    .portfolio-hero-banner-tags > div:last-child {
        margin-right: 5vw;
    }

    .portfolio-hero-banner-tags::-webkit-scrollbar {
        display: none !important;
    }

    .portfolio-tag-button {
        padding: 4vw 6vw;
        font-size: 18px;
        line-height: 18px;
        white-space: nowrap;
    }

    .portfolio-tag-button:hover,
    .portfolio-tag-button.active {
        padding: 4.14vw 6.14vw;
    }

    .portfolio-browse-projects-arrow {
        width: 4vw;
    }

    .portfolio-browse-projects-container {
        gap: 4vw;
        margin: 5vw 0 0 0 !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        max-width: 90%;
    }

    .project-blogs {
        margin-left: 5vw !important;
    }

    /* PROJECT PAGE */

    .project-container {
        background-size: 200%;
        padding-bottom: 25vw;
    }

    .project-empty-space {
        height: 10vw;
    }

    .project-hero-inner-container {
        margin-top: 25vw;
        padding-bottom: 5vw;
    }

    .project-hero-logo-container {
        align-self: center !important;
    }

    .project-hero-container {
        padding-bottom: 5vh;
        background-image: linear-gradient(
            180deg,
            rgb(44, 73, 129) 0%,
            rgb(12.42, 12.42, 64.81) 100%
        ) !important;
    }

    .project-image {
        margin-top: 2vw;
        max-width: 55vw;
    }

    .project-banner-desc {
        margin-top: 5vw;
    }

    .project-assets-container {
        gap: 20vw;
    }

    .project-assets-images-container {
        grid-template-columns: 1fr;
        margin-top: 5vw;
        margin-bottom: 20vw;
    }

    .project-assets-videos-container {
        grid-template-columns: 1fr;
        margin-top: 5vw;
    }

    .project-socials {
        align-self: center;
        display: flex;
        flex-direction: row;
        gap: 7vw;
        align-items: center;
        margin-top: 8vw;
    }

    .project-article-container {
        flex-direction: column;
        gap: 20vw;
        margin-top: 10vw;
    }

    .project-article-left {
        width: 100%;
        gap: 4vw;
    }

    .project-article-right {
        width: 100%;
        gap: 5vw;
    }

    .project-article-subtitle {
        letter-spacing: 1vw;
        line-height: 5vw;
        font-size: 5vw;
    }

    .mobile-smaller {
        font-size: 3vw !important;
    }

    .project-stats-container {
        gap: 5vw;
    }

    .project-stat {
        width: 50%;
    }

    .project-article-feedback-container {
        gap: 3vw;
    }

    .numbers-by-month {
        font-size: 6vw;
        margin-top: 9vw !important;
        margin-bottom: 1.5vw;
    }

    p.recent-months-followers-text {
        margin-top: -4vw;
    }

    .project-article-feedback-author {
        gap: 1vw;
    }

    .project-stat-divider {
        width: 0.6vw;
        height: 20vw;
    }

    .project-article-monthly-followers-container-all {
        gap: 5vw;
        margin-top: -2vw;
    }

    .project-article-monthly-followers-container {
        gap: 3vw;
    }

    .project-article-line-container,
    .project-article-line {
        height: 2.5vw;
        border-radius: 3vw;
    }

    .project-article-month,
    .project-article-followers-number {
        font-size: 2.5vw;
        line-height: 2.5vw;
    }

    .feedback-image {
        width: 15vw;
        height: 15vw;
        object-fit: cover;
        border-radius: 3vw;
    }

    .social-icon-project {
        height: 6vw;
        width: auto;
    }

    .section-assets-title {
        margin-left: 5vw;
        width: 90vw !important;
        text-align: center;
        justify-content: center;
        align-items: center;
    }

    .section-assets-subtitle {
        line-height: normal;
    }

    .section-assets-subtitle-videos {
        margin-top: 8vw;
    }

    /* SECTIONS - GENERAL */

    .section-subtitle,
    .article-subtitle {
        line-height: normal;
    }

    .section-title,
    .section-title-white {
        width: 80vw;
        margin-top: 4vw;
        text-transform: uppercase;
    }

    .section-desc {
        line-height: normal;
        margin-top: 5vw;
        width: 70vw;
        font-size: 14px !important;
    }

    .only-desktop {
        display: none;
    }

    .only-mobile {
        display: flex !important;
    }

    /* COOKIES - GDPR */

    .cookie-consent {
        width: 60vw;
        padding: 3vw !important;
        gap: 0vw !important;
    }

    .cookie-consent__message {
        color: #fff !important;
        font-size: 12px !important;
        line-height: normal !important;
    }

    .cookies-consent-button {
        padding: 0.5vw 3vw;
        font-size: 14px;
    }

    /* BLOG PAGE */

    .blog-article-container {
        padding-bottom: 5vw !important;
    }

    .blog-container {
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 10vw 4vw;
        margin-top: 10vw;
        margin-bottom: 10vw;
    }

    .spaces-page-container .blog-container {
        display: grid;
        grid-template-columns: 1fr !important;
        grid-gap: 5vw 4vw;
        margin-top: 10vw;
        margin-bottom: 10vw;
        margin-left: -2.5vw !important;
    }

    .blog-container .spaces-slide-container {
        background: linear-gradient(90deg, #5d81c7 0%, #0c0c41 100%) !important;
        width: 90vw;
        min-height: auto;
        opacity: 1;
        gap: 8vw;
    }

    .blog-container .spaces-slide-container:hover {
        background: linear-gradient(90deg, #5d81c7 0%, #0c0c41 100%) !important;
        opacity: 1;
    }

    .page-link {
        line-height: 2em !important;
        font-size: 1.5em;
    }

    .blog-article-container {
        padding-bottom: 25vw !important;
    }

    .blog-article-content-container {
        display: flex;
        flex-direction: column;
    }

    .blog-article-content-left,
    .blog-article-content-right {
        width: 100%;
        margin-top: 8vw;
    }

    /* ARTICLE PAGE */
    .portfolio-article-container {
        padding-bottom: 15vw !important;
    }

    .project-assets-videos-container {
        margin-bottom: 10vw;
    }

    ul.tick {
        margin-left: -3vw;
    }

    .tick-list {
        left: 4vw;
    }

    ul.circle {
        margin-left: -5vw;
    }

    ul.circle li::before {
        font-size: 5vw;
        width: 5vw;
        margin-left: -5vw;
    }

    ul.circle li {
        color: rgba(114, 114, 114, 1);
        padding: 0.5vw 0;
        margin-left: 10vw;
    }

    h2 {
        margin-top: 5vw !important;
        margin-bottom: 5vw !important;
    }

    /* WHAT WE DID */

    .what-we-did-container {
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 4vw;
        margin-top: 2vw;
    }

    .what-we-did-inner-container {
        gap: 4vw;
    }
    .what-we-did-left {
        font-size: 8vw;
    }
    .what-we-did-title {
        font-size: 5vw;
        margin-bottom: 2vw;
    }

    /* TELEGRAM CHECKER POP-UP */

    .tg-check-button {
        font-size: var(--font-size-l);
        border-radius: 7.04vw;
        height: auto;
        padding: 3vw 3vw;
        margin: 15px auto 0 auto;
    }

    #popup-box {
        padding: 9vw 6vw;
        border-radius: 6vw;
    }

    #popup-close {
        top: -7.5px;
        right: -7.5px;
        width: 25px;
    }

    #popup-box input {
        padding: 3vw 6vw;
        border: 0.45vw solid #333;
        border-radius: 3vw;
        margin-top: 30px;
    }

    .check-handle-icon {
        width: 12vw;
        height: auto;
        margin-bottom: 3vw;
    }

    .portfolio-browse-projects-text {
        font-size: 2.2vh !important;
    }

    /* YOUTUBE */

    .embed-container {
        position: relative;
        padding-bottom: 56.25%;
        height: 0;
        overflow: hidden;
        max-width: 100%;
    }
    .embed-container iframe,
    .embed-container object,
    .embed-container embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 1vw;
    }

    .mobile-reverse {
        flex-direction: column-reverse;
    }

    /*     .hero-banner-our-projects-outer-container {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 2vw;
        margin-top: 100px;
    } */

    .hero-banner-our-projects-container {
        flex-direction: column;
        align-items: center; /* change from center to stretch */
        justify-content: center;
        gap: 30px;
        margin-top: 30px;
    }
    .our-project-container {
        border-radius: 20px;
        gap: 30px;
        justify-content: center;
        align-items: center;
        width: 90%;
        padding: 30px;
    }

    .our-project-container:hover {
        transform: scale(1.05);
        border: 2px solid #243352;
    }

    .our-project-container img {
        position: relative;
        max-width: 85%;
        filter: grayscale(1);
        -webkit-filter: grayscale(1);
    }

    .section-desc-about-tenx {
        font-size: 28px !important;
    }

    .slide-item-container {
        border-radius: 3vw;
        padding: 2vw 2vw 4.5vw 2vw;
        width: 85vw;
        gap: 3vw;
        margin-left: 7.5vw;
        margin-right: 7.5vw;
    }

    img.slider-item {
        width: auto;
        height: 100% !important;
        object-fit: cover;
        border-radius: 3vw 3vw 0 0;
    }
}

@media screen and (min-height: 700px) and (orientation: portrait) {
    .hero-banner-title {
        font-size: calc(36px + 1.5vh) !important;
        line-height: calc(40px + 1.5vh) !important;
    }

    .hero-banner-desc {
        font-size: calc(12px + 1vh) !important;
        line-height: calc(16px + 1vh) !important;
    }
}

/* DESKTOP MAX 1600px */

@media screen and (max-width: 1600px) {
    .hero-banner-title {
        max-width: 80vw;
    }

    .hero-banner-desc {
        max-width: 65vw;
    }

    .case-study-desc,
    .project-banner-desc {
        line-height: normal;
    }
}

/* DESKTOP 3k+ */

@media screen and (min-width: 2440px) {
    .hero-banner-title {
        margin-top: 25vh;
    }

    .our-innovative-approach-desc {
        font-size: calc(14px + 1vw);
    }

    .navbar-link,
    .navbar a:link,
    .navbar a:visited {
        font-size: calc(10px + 0.5vw) !important;
    }

    .request-a-quote {
        font-size: calc(10px + 0.5vw) !important;
    }

    .services-grid-element {
        padding: 2vw 2vw;
    }

    .services-value-title {
        font-size: calc(11px + 1vw) !important;
    }

    .services-value-desc {
        font-size: calc(12px + 0.5vw) !important;
        margin-top: 0.5vw !important;
    }

    .services-grid-element-title {
        font-size: calc(18px + 0.5vw);
    }

    .services-grid-element-desc {
        line-height: normal;
        font-size: calc(10px + 0.5vw) !important;
    }

    .stat-title {
        font-size: calc(40px + 1vw) !important;
    }

    .stat-description {
        font-size: calc(20px + 0.5vw) !important;
    }

    .case-study-desc,
    .project-banner-desc {
        font-size: calc(18px + 0.5vw) !important;
    }

    .prev-next-link-text {
        font-size: calc(16px + 0.5vw) !important;
    }

    .case-study-button {
        font-size: calc(20px + 0.5vw) !important;
    }

    .section-subtitle,
    .article-subtitle,
    .hero-banner-subtitle,
    .section-assets-subtitle {
        font-size: calc(20px + 0.5vw) !important;
    }

    .section-title,
    .section-title-white,
    h2 {
        font-size: calc(50px + 0.5vw) !important;
    }

    .section-desc {
        font-size: calc(20px + 0.5vw) !important;
    }

    .latest-project-insights-subtitle {
        font-size: calc(16px + 0.5vw) !important;
    }

    .latest-project-insights-desc {
        font-size: calc(20px + 0.5vw) !important;
    }

    .member-name {
        font-size: calc(30px + 0.5vw) !important;
    }

    .member-role {
        font-size: calc(20px + 0.5vw) !important;
    }
    /* CTA SECTION - HOMEPAGE */

    .cta-schedule-a-call,
    .schedule-a-call,
    .join-our-community {
        font-size: calc(20px + 0.5vw) !important;
    }

    .cta-desc {
        font-size: calc(20px + 0.5vw) !important;
    }

    .cta-title {
        font-size: calc(50px + 0.5vw) !important;
    }

    .show-more-link {
        font-size: calc(20px + 0.5vw) !important;
    }

    .review-content {
        font-size: calc(20px + 0.5vw) !important;
    }

    .review-customer-title {
        font-size: calc(16px + 0.5vw) !important;
    }

    .review-customer-name {
        font-size: calc(16px + 0.5vw) !important;
    }

    .contact-form-input-field {
        font-size: calc(16px + 0.5vw) !important;
    }

    .get-in-touch-button {
        font-size: calc(30px + 0.5vw) !important;
    }

    .contact-form-additional-desc {
        font-size: calc(14px + 0.5vw) !important;
        width: 30vw !important;
    }

    .contact-form-stat-title {
        font-size: calc(30px + 0.5vw) !important;
    }

    .contact-form-stat-desc {
        font-size: calc(10px + 0.5vw) !important;
    }

    .tell-us-about-you {
        font-size: calc(50px + 1vw) !important;
    }

    .footer-navigation-link,
    .footer-navigation-link .navbar-link {
        font-size: calc(16px + 0.5vw) !important;
    }

    .footer-send-email-label {
        font-size: calc(16px + 0.5vw) !important;
    }

    .footer-company-desc,
    .footer-company-desc p {
        font-size: calc(16px + 0.5vw) !important;
        line-height: normal !important;
    }

    .footer-company-info-text {
        font-size: calc(16px + 0.5vw) !important;
    }

    .footer-column-title {
        font-size: calc(30px + 0.5vw) !important;
    }

    .footer-recent-news-post-title {
        font-size: calc(16px + 0.5vw) !important;
    }

    .footer-recent-news-post-published {
        font-size: calc(12px + 0.5vw) !important;
        margin-top: 0.5vw !important;
    }

    .newsletters-join-button {
        font-size: calc(20px + 0.5vw) !important;
    }

    .newsletters-input-field {
        font-size: calc(16px + 0.5vw) !important;
    }

    .what-we-did-title {
        font-size: calc(12px + 1vw) !important;
    }

    .seemore-button-link,
    .portfolio-browse-projects-text {
        font-size: calc(16px + 0.5vw) !important;
    }

    .portfolio-tag-button {
        font-size: calc(16px + 0.5vw) !important;
        border: 0.09vw solid rgba(255, 255, 255, 0.8);
    }

    p {
        font-size: calc(18px + 0.5vw) !important;
        line-height: 150% !important;
    }

    ul.tick li,
    ul.circle li {
        font-size: calc(18px + 0.5vw) !important;
    }

    .tippy-box[data-theme~="marketing10"] {
        font-size: calc(18px + 0.5vw) !important;
        width: 50vw !important;
    }

    .tippy-box {
        width: 50vw !important;
    }
}