@import url(https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css);
@import url(https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap);

html {
    -ms-scroll-behavior: smooth;
    -moz-scroll-behavior: smooth;
    -webkit-scroll-behavior: smooth;
    scroll-behavior: smooth
}

.unscrolledbody {
    display: block
}

body {
    overflow-x: clip;
    display: block;
    background: var(--white-one);
    color: var(--gray-800);
    box-sizing: border-box
}

body::-webkit-scrollbar {
    height: 6px;
    width: 2.5px;
    background: transparent none
}

body::-webkit-scrollbar-button {
    height: 10px;
    width: 2.5px;
    background: transparent none
}

body::-webkit-scrollbar-thumb {
    background: var(--gray-400);
    border-radius: 4px;
    height: 16px !important
}

.smooth-wrapper {
    width: 100%;
    height: auto
}

.lenis {
    height: auto
}

.lenis.lenis-smooth {
    scroll-behavior: auto
}

.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain
}

.lenis.lenis-scrolling iframe {
    pointer-events: none
}

.lenis.lenis-stopped {
    overflow: hidden
}

body.unscrolled {
    overflow-y: hidden !important;
    display: block
}

.modal-backdrop.show {
    opacity: 1 !important;
    background-color: rgba(0, 0, 0, .5);
    border-radius: 0;
    box-shadow: none !important;
    backdrop-filter: blur(4.5px) !important;
    -ms-backdrop-filter: blur(4.5px) !important;
    -moz-backdrop-filter: blur(4.5px) !important;
    -webkit-backdrop-filter: blur(4.5px) !important;
    width: 105vw;
    height: 105vh;
    left: -2.5%;
    top: -2.5%
}

:root {
    --font-arial: "Arial", Helvetica, sans-serif;
    --font-spectral: "Spectral", serif;
    --white-trans-full: rgba(255, 255, 255, 0);
    --white-trans-2: rgba(255, 255, 255, 0.2);
    --white-one: #ffffff;
    --gray-950: #12171c;
    --gray-900: #212830;
    --gray-800: #212831;
    --gray-700: #3b4754;
    --gray-600: #46515d;
    --gray-500: #6e7887;
    --gray-400: #98a1ae;
    --gray-300: #d1d5db;
    --gray-200: #e2e5e9;
    --gray-100: #f3f5f6;
    --gray-50: #f9fafb;
    --gray-25: #fcfcfb;
    --gray-15: #fefefe;
    --green-950: #042f1a;
    --green-900: #125533;
    --green-800: #14673a;
    --green-700: #138949;
    --green-600: #12a755;
    --green-500: #1ec96b;
    --green-400: #46e28c;
    --green-300: #83f2b4;
    --green-200: #b9f9d5;
    --green-100: #dbfdea;
    --green-50: #f0fdf5
}

.overflow-unset {
    overflow: unset
}

.container-large {
    max-width: 99.86%;
    margin: 0 auto;
    margin-right: auto;
    margin-left: auto
}

.centered-container {
    max-width: 1170px;
    margin: 0 auto;
    margin-right: auto;
    margin-left: auto;
    margin-right: auto;
    margin-left: auto
}

.navbar-mobile {
    display: none
}

.header {
    width: 100%;
    height: auto;
    min-height: 64px;
    position: sticky;
    top: 0;
    z-index: 9;
    -webkit-transition: 1s ease-in-out;
    -moz-transition: 1s ease-in-out;
    -o-transition: 1s ease-in-out;
    transition: .5s ease-in-out
}

.header.scroll {
    transform: translateY(-98px);
    -webkit-transition: 1s ease-in-out;
    -moz-transition: 1s ease-in-out;
    -o-transition: 1s ease-in-out;
    transition: .4s ease-in-out
}

.navbar-desc {
    background: var(--white-one);
    min-height: 72px;
    width: 100%;
    transition: .4s;
    -moz-transition: .4s;
    -ms-transition: .4s;
    -o-transition: .4s;
    -webkit-transition: .4s
}

.navbar-flex {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    flex-direction: row;
    padding-left: 0;
    padding-right: 0;
    position: relative
}

.logo-brand {
    width: 256px;
    overflow: unset;
    position: relative;
    transition: .4s;
    -moz-transition: .4s;
    -ms-transition: .4s;
    -o-transition: .4s;
    -webkit-transition: .4s
}

.logo-brand a img {
    max-width: 100% !important
}

.logo-brand-centered {
    width: 304px
}

.logo-brand-centered a img {
    max-width: 100%
}

.mobile-floating-search {
    display: none
}

.mobile-floating-centered {
    display: none
}

.horizontal-navigation {
    display: none
}

.icon-more-swipeup {
    display: none
}

.observasi-mobile-setting {
    display: none
}

.label-forecast-mobile {
    display: none
}

#content-search-form {
    z-index: 9;
    position: absolute
}

.navbar-desc {
    width: 100%;
    min-height: 63px;
    width: 100%;
    position: sticky;
    top: 0;
    z-index: 10
}

.navbar-desc.swipe-up-nav {
    min-height: 63px;
    background: var(--white-one);
    transition: .4s;
    -moz-transition: .4s;
    -ms-transition: .4s;
    -o-transition: .4s;
    -webkit-transition: .4s;
    box-shadow: 0 1px 10px rgba(151, 164, 175, .24);
    -ms-box-shadow: 0 1px 10px rgba(151, 164, 175, .24);
    -moz-box-shadow: 0 1px 10px rgba(151, 164, 175, .24);
    -webkit-box-shadow: 0 1px 10px rgba(151, 164, 175, .24)
}

.navbar-flex {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    flex-direction: row;
    padding-left: 10px;
    padding-right: 10px;
    position: relative
}

.logo-brand-navbar {
    width: 100%;
    min-height: 52px;
    text-decoration: none;
    outline: 0
}

.logo-brand-navbar img {
    max-width: 100%
}

.logo-brand-navbar svg {
    max-width: 100%
}

.logo-brand-navbar svg .st0 {
    fill: var(--white-one)
}

.wrp-nav-item {
    min-width: 496px;
    width: auto
}

.navbar-align-right {
    min-width: 486px;
    width: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -webkit-align-items: center;
    -moz-align-items: center
}

.navbar-nav {
    flex-direction: row
}

.navbar-align-right ul li a {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    cursor: pointer;
    position: relative;
    overflow: unset;
    transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    -webkit-transition: .5s;
    color: var(--gray-950);
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 120%;
    padding-left: 5px;
    padding-right: 5px
}

.navbar-align-right ul li.dropdown-hover::before {
    position: absolute;
    width: 0;
    height: 4.64px;
    background: linear-gradient(to right, #4c1a02 0, #582005 7%, #7a310d 18%, #82330c 27%, #9b4011 37%, #cc6b35 54%, #df7d44 77%, #e18750 100%);
    content: "";
    margin-left: 0 auto;
    margin-right: 0 auto;
    left: 0;
    right: 0;
    bottom: -15.6px;
    transition: all .4s;
    transition: width .5s ease;
    opacity: 1
}

.navbar-align-right ul li.dropdown-hover:hover::before {
    transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
    transition-duration: .6s;
    transition: all .4s;
    width: 100%;
    background: linear-gradient(to right, #4c1a02 0, #582005 7%, #7a310d 18%, #82330c 27%, #9b4011 37%, #cc6b35 54%, #df7d44 77%, #e18750 100%);
    transition: width .5s ease;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0
}

.navbar-align-right ul li a:hover {
    text-decoration: none;
    outline: 0;
    color: var(--gray-950)
}

.text-parent {
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%;
    width: 80%
}

.navbar-align-right ul li:hover .text-parent {
    transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
    transition-duration: .6s;
    transition: all .4s;
    color: #e18750;
    background: #541e04;
    background: linear-gradient(to top, #541e04 0, #84340c 16%, #943a0c 40%, #df7c43 57%, #e0834b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font: normal 600 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
}

.chevron-down {
    width: 14px;
    height: 14px;
    padding: 2px 2px;
    margin-top: -7.6px
}

.navbar-align-right ul li:hover .chevron-down svg g path.st1 {
    fill: #943a0c;
    transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
    transition-duration: .6s;
    transition: all .4s
}

.navbar-align-right ul li a:focus {
    text-decoration: none;
    outline: 0;
    color: var(--gray-950)
}

.dropdown-menu {
    position: absolute;
    left: 0;
    top: 100%;
    min-width: 280px;
    z-index: 100;
    display: none;
    box-shadow: 0 9px 8px 4px rgba(0, 0, 0, .056);
    -webkit-box-shadow: 0 9px 8px 4px rgba(0, 0, 0, .056);
    -moz-box-shadow: 0 9px 8px 4px rgba(0, 0, 0, .056)
}

.navbar-align-right ul li.dropdown-hover ul li {
    position: relative;
    min-width: 100%
}

.navbar-align-right ul li.dropdown-hover ul li a {
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    color: var(--gray-950);
    letter-spacing: .14px;
    line-height: 124%;
    text-align: left;
    justify-content: flex-start;
    -ms-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    padding-left: 0;
    padding-right: 0
}

.navbar-align-right ul li.dropdown-hover ul li a:hover {
    background: #541e04;
    background: linear-gradient(to top, #541e04 0, #84340c 16%, #943a0c 40%, #df7c43 57%, #e0834b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.navbar-align-right ul li.dropdown-hover ul li::before {
    opacity: 0;
    width: 2.6px;
    height: 0;
    position: absolute;
    left: 0;
    transform: translateY(13.64%);
    content: "";
    background: #fff;
    transition: all .4s
}

.navbar-align-right ul li.dropdown-hover ul li:hover::before {
    opacity: 1;
    width: 2.6px;
    height: 52%;
    position: absolute;
    left: 0;
    transform: translateY(13.64%);
    content: "";
    background: #541e04;
    background: linear-gradient(to bottom, #e18750 0, #df7d44 23%, #cc6b35 46%, #9b4011 66%, #82330c 77%, #7a310d 84%, #582005 93%, #4c1a02 100%);
    transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
    transition-duration: .9s;
    transition: all .4s
}

.slideIn {
    -webkit-animation-name: slideIn;
    animation-name: slideIn
}

.animate {
    animation-duration: .3s;
    -webkit-animation-duration: .3s;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both
}

.navbar-nav li:hover>ul.first-level {
    border-top: 12px solid transparent
}

@keyframes slideIn {
    0% {
        transform: translateY(1rem);
        opacity: 0
    }

    100% {
        transform: translateY(0);
        opacity: 1
    }
}

@-webkit-keyframes slideIn {
    0% {
        -webkit-transform: transform;
        -webkit-opacity: 0
    }

    100% {
        -webkit-transform: translateY(0);
        -webkit-opacity: 1
    }
}

.slideIn {
    -webkit-animation-name: slideIn;
    animation-name: slideIn
}

.dropdown-hover:hover>.dropdown-menu {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    position: absolute;
    left: 0;
    top: 114%;
    border-image-source: linear-gradient(0deg, rgba(221, 221, 221, 1) 54%, rgba(255, 255, 255, 0) 100%);
    border-image-slice: 1;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    height: auto;
    max-width: 296px;
    min-width: 232px;
    width: auto;
    margin-top: -5px
}

.dropdown-hover:hover>ul.first-level {
    border-top: 16px solid transparent !important;
    border-right: 0px;
    border-bottom: 0;
    border-left: 0;
    padding-bottom: 16px
}

.dropdown-menu li {
    min-width: 100%;
    width: 100%;
    padding: 5.6px 16px
}

.dropdown-menu li a {
    font-size: clamp(.8475rem, .5304rem + .4955vw, 1.125rem) var(--font-arial);
    color: var(--gray-500);
    letter-spacing: .14px;
    line-height: 138%;
    text-decoration: none;
    outline: 0
}

.dropdown-menu li a:hover {
    color: var(--gray-950) !important;
    text-decoration: none
}

.navbar-align-right ul li {
    min-width: 130.5px
}

.navbar-align-right ul li:first-child {
    min-width: 128.5px;
    max-width: 128.5px
}

.navbar-align-right ul li:nth-child(2) {
    min-width: 125.5px;
    max-width: 125.5px
}

.navbar-align-right ul li:nth-child(3) {
    min-width: 138.5px;
    max-width: 138.5px
}

.navbar-align-right ul li:nth-child(4) {
    min-width: 105.5px;
    max-width: 105.5px
}

.music-icon {
    padding: 0 2px 0 2px;
    margin-right: 10px;
    width: 24px;
    height: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.embeded-music {
    visibility: visible;
    position: absolute;
    top: 34px;
    z-index: 999
}

.music-icon svg {
    max-width: 100%;
    width: 20px;
    height: 20px;
    margin: 0 auto;
    fill: var(--gray-950)
}

.music-icon svg path {
    fill: var(--gray-950)
}

.music-icon svg.mute path.st0 {
    fill: #fff !important
}

.search-navbar {
    padding: 0 2px 0 2px;
    margin-left: 4px;
    margin-right: 4px;
    width: 24px;
    display: flex;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.search-navbar svg {
    max-width: 100%;
    margin: 0 auto;
    fill: var(--gray-950)
}

.search-navbar svg path {
    fill: var(--gray-950)
}

.caret-down {
    width: 14px;
    height: 11px;
    position: relative;
    justify-content: end;
    margin-left: 6px
}

.caret-down::after {
    content: " ";
    width: 12px;
    position: absolute;
    height: auto;
    min-height: 11px;
    background: url(../images/svg/caret-arrow-down-black.svg);
    background-size: auto;
    background-size: 100%;
    text-align: center;
    display: block;
    top: 3px;
    left: 4px
}

.search-content-form {
    width: 100%;
    background: #fff;
    margin-top: -82px;
    text-align: center;
    padding: 25px 0;
    opacity: 0;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
    z-index: 999;
    -webkit-box-shadow: 0 7px 14px -6px #123a38;
    -moz-box-shadow: 0 7px 14px -6px #123a38;
    box-shadow: 0 7px 14px -6px #123a38;
    position: absolute
}

.search-content-form-active {
    width: 100%;
    height: 100vh;
    background: rgba(255, 255, 255, .55);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, .37);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, .18);
    margin-top: 0;
    top: 0;
    text-align: center;
    padding: 48px 36px;
    opacity: 1;
    z-index: 9;
    -webkit-box-shadow: 0 7px 14px -6px #123a38;
    -moz-box-shadow: 0 7px 14px -6px #123a38;
    box-shadow: 0 7px 14px -6px #123a38;
    position: fixed;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    border-radius: 4.6px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center
}

.desktop-floating-search {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    z-index: 9;
    position: relative;
    min-height: 68px
}

.search-content-form-active .desktop-floating-search {
    width: 378px;
    display: flex;
    flex-wrap: wrap
}

.detect-locations {
    width: 100%;
    height: auto
}

.detect-locations a {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    -ms-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    padding: 8px 6px;
    margin-bottom: 12px;
    text-decoration: none
}

.text-detect-location {
    color: #76767e;
    font: normal 400 13px/20.64px var(--font-mulish);
    padding-left: 10px;
    width: 89%
}

.text-detect-location p {
    margin-bottom: 1px
}

.desktop-floating-search .btn-white-search {
    position: absolute;
    width: 41px;
    height: 41px;
    background: var(--white-one);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    right: 6px;
    border-top: 1.5px solid var(--white-one);
    border-right: 1.5px solid var(--white-one);
    border-bottom: 1.5px solid var(--white-one);
    border-left: 1.5px solid var(--white-one);
    border-top-right-radius: 12.56px;
    border-bottom-right-radius: 12.56px;
    z-index: 5
}

.desktop-floating-search .btn-white-search:focus {
    background: var(--white-one);
    box-shadow: none;
    outline: 0;
    border-top: 1.5px solid var(--white-one);
    border-right: 1.5px solid var(--white-one);
    border-bottom: 1.5px solid var(--white-one);
    border-left: 1.5px solid var(--white-one)
}

.desktop-floating-search .btn-white-search svg {
    max-width: 100%
}

.desktop-floating-search .btn-white-search svg path {
    fill: var(--gray-400)
}

.desktop-floating-search .input-search {
    margin-top: 14px;
    width: 100%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    padding: 1px 1.24px
}

.desktop-floating-search .input-search input[type=text] {
    background: var(--white-one);
    width: 100%;
    height: 48px;
    padding: 12.5px 15px;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-mulish);
    color: var(--gray-800);
    border-top: 1.5px solid var(--gray-300);
    border-right: 1.5px solid var(--gray-300);
    border-bottom: 1.5px solid var(--gray-300);
    border-left: 1.5px solid var(--gray-300);
    border-radius: 10.56px !important
}

.desktop-floating-search .input-search input[type=text]:focus {
    border-top: 1.5px solid var(--gray-400);
    border-right: 1.5px solid var(--gray-400);
    border-bottom: 1.5px solid var(--gray-400);
    border-left: 1.5px solid var(--gray-400);
    border-radius: 12.56px
}

.search-title {
    width: 100%;
    height: auto
}

.desktop-floating-search form {
    width: 100%;
    display: flex;
    flex-wrap: wrap
}

.search-title h5 {
    color: var(--gray-800);
    font: normal 600 clamp(1.015rem, 0.0848rem + 1.1628vw, 1.0775rem) var(--font-mulish);
    margin-bottom: 2px
}

.wrp-type-sugestion {
    width: 94.24%;
    height: auto;
    min-height: 224px;
    background: #fff;
    position: absolute;
    z-index: 10
}

.search-route .input-search {
    position: relative
}

.pointing-start {
    width: 18px;
    height: 18px;
    padding: 2px 2px;
    position: absolute;
    left: 12.5px;
    top: 12.5px;
    position: absolute;
    z-index: 6
}

.pointing-start svg {
    max-width: 100%
}

.pointing-start svg path.path-satu {
    fill: rgb(61, 141, 248)
}

.pointing-start svg path.path-dua {
    fill: #fff
}

.pointing-end {
    width: 18px;
    height: 18px;
    padding: 2px 2px;
    position: absolute;
    left: 12.5px;
    top: 12.5px;
    position: absolute;
    z-index: 6
}

.pointing-end svg {
    max-width: 100%
}

.pointing-end svg path.path-satu {
    fill: #f74b54
}

.pointing-end svg path.path-dua {
    fill: #fff
}

.search-route .input-search:first-child::before {
    position: absolute;
    content: " ";
    width: 86%;
    height: 1.5px;
    background: var(--gray-300);
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    top: unset;
    bottom: 0;
    z-index: 6
}

.search-route .input-search:first-child input[type=text] {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    padding-left: 38px;
    border-bottom: 1.25px solid #fff
}

.search-route .input-search:last-child input[type=text] {
    border-top-right-radius: 0 !important;
    border-top-left-radius: 0 !important;
    padding-left: 38px;
    border-top: 1.25px solid #fff
}

.search-route .input-search:not(:first-child) {
    margin-top: -1.5px;
    margin-bottom: 10px
}

.wrp-list-type {
    width: 100%;
    height: auto;
    padding: 0;
    min-height: 225px
}

.large-card-type {
    width: 100%;
    padding: 10px 0;
    border-radius: 12.5px;
    border: 1px solid var(--grey-two);
    margin-top: 1px
}

.label-list-type {
    width: 100%;
    background: #f5f5f5;
    min-height: 32px;
    color: #76767e;
    padding: 6px 18px 10px 18px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    font: normal 400 13px/20.64px var(--font-mulish)
}

.label-list-type {
    color: #76767e;
    font: normal 400 13px/20.64px var(--font-mulish)
}

.type-list-link {
    width: 100%;
    height: auto
}

.type-list-link a {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    background: #fff;
    padding: 6.4px 18px 7.6px 10px;
    text-decoration: none;
    outline: 0
}

.icon-type-left {
    width: 24px;
    height: 24px
}

.state-first-type svg {
    max-width: 100%
}

.state-first-type svg path {
    fill: var(--gray-500)
}

.text-type-search {
    min-width: 76%;
    max-width: 94.56%;
    height: auto;
    padding: 3px 14px 3px 12px;
    font: normal 500 16.64px/21.64px var(--font-mulish);
    border-radius: 2.6px;
    text-align: left;
    color: var(--gray-800);
    word-break: break-word;
    white-space: pre-line;
    white-space: wrap;
    overflow-wrap: break-word;
    -ms-word-break: break-word;
    word-break: break-word;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
    max-height: 50.24px;
    overflow-y: hidden
}

.text-type-search {
    min-width: 76%;
    max-width: 91.56%;
    height: auto;
    padding: 3px 14px 3px 12px;
    font: normal 500 15.64px/21px var(--font-mulish);
    border-radius: 2.6px;
    text-align: left;
    color: var(--gray-700);
    word-break: break-word;
    white-space: wrap;
    overflow-wrap: break-word;
    -ms-word-break: break-word;
    word-break: break-word;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
    max-height: 50.24px;
    overflow-y: hidden
}

.icon-type-loader {
    display: inline-block;
    width: 16px;
    height: 1em;
    position: relative;
    overflow: hidden;
    background-color: #dddbdd;
    border-radius: 3.6px
}

.icon-type-loader::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: shimmer 2s infinite;
    animation: shimmer 2s infinite;
    content: ""
}

.type-list-link a:nth-of-type(odd) .text-type-search .type-search-loader {
    width: 86%
}

.type-list-link a:nth-of-type(2n) .text-type-search .type-search-loader {
    width: 90%
}

.type-search-loader {
    display: inline-block;
    width: 90%;
    height: 1em;
    position: relative;
    overflow: hidden;
    background-color: #dddbdd;
    border-radius: 3.5px
}

.search-route {
    position: relative
}

.type-search-loader::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, 0));
    -webkit-animation: search-shimmer 2.5s infinite;
    animation: search-shimmer 2.5s infinite;
    content: ""
}

.search-route .input-search {
    position: relative
}

.search-route .input-search input[type=text] {
    background: var(--white-one);
    width: 100%;
    height: 48px;
    padding: 12.5px 15px;
    padding-left: 15px;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-mulish);
    color: var(--gray-800);
    border-top: 1.5px solid var(--gray-300);
    border-right: 1.5px solid var(--gray-300);
    border-bottom: 1.5px solid var(--gray-300);
    border-left: 1.5px solid var(--gray-300);
    border-radius: 10.56px !important;
    border-bottom-right-radius: 10.56px;
    border-bottom-left-radius: 10.56px
}

.search-route .input-group-static.input-search:first-child input[type=text] {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    padding-left: 38px;
    border-bottom: 1.25px solid #fff
}

.search-route .input-group-static.input-search:last-child input[type=text] {
    border-top-right-radius: 0 !important;
    border-top-left-radius: 0 !important;
    padding-left: 38px;
    border-top: 1.25px solid #fff
}

.form-location .btn-white-search {
    position: absolute;
    width: 41px;
    height: 41px;
    background: var(--white-one);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    right: 6px;
    border-top: 1.5px solid var(--white-one);
    border-right: 1.5px solid var(--white-one);
    border-bottom: 1.5px solid var(--white-one);
    border-left: 1.5px solid var(--white-one);
    border-top-right-radius: 12.56px;
    border-bottom-right-radius: 12.56px;
    z-index: 5;
    top: 2px
}

.search-route .btn-white-search svg path {
    fill: var(--gray-400)
}

@-webkit-keyframes search-shimmer {
    100% {
        transform: translateX(100%)
    }
}

@keyframes search-shimmer {
    100% {
        transform: translateX(100%)
    }
}

.wrp-burger-menu {
    width: 45px;
    min-height: 14px;
    display: none;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    justify-content: flex-end;
    -ms-justify-content: flex-end;
    -moz-justify-content: flex-end;
    -webkit-justify-content: flex-end
}

.text-menu {
    width: auto;
    padding-right: 12px
}

.text-menu h5 {
    color: var(--green-700);
    font: normal 700 clamp(0.9375rem, 0.5804rem + 0.558vw, 1.25rem) var(--font-geist);
    margin-bottom: .5px
}

.hamburger-box {
    width: 36px
}

.hamburger-inner,
.hamburger-inner::after,
.hamburger-inner::before {
    width: 26px;
    background-color: var(--gray-950);
    height: 2px
}

.hamburger.is-active .hamburger-inner::after,
.hamburger.is-active .hamburger-inner::before {
    background-color: var(--gray-950)
}

.burger-mobile .hamburger {
    padding: 12px 5px 10px 5px;
    margin-right: -1px
}

.burger-mobile .hamburger:hover {
    opacity: 1
}

.hamburger-box::before {
    display: none;
    content: "Menu";
    color: var(--gray-950);
    font: normal 700 clamp(0.9375rem, 0.5804rem + 0.558vw, 1.25rem) var(--font-geist);
    margin-left: -64px;
    letter-spacing: .9px;
    opacity: 1
}

.section-hero-images {
    width: 100%;
    min-height: 532px;
    background: var(--white-one);
    height: calc(100vh - 128px)
}

main.container-mansonry {
    max-width: 99.86%;
    margin: 0 auto;
    margin-right: auto;
    margin-left: auto;
    margin-right: auto;
    margin-left: auto;
    border: 1px solid #cf0000;
    min-height: 124px;
    padding: 5px 5px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-auto-rows: 174px;
    gap: 10px
}

main div {
    overflow: hidden;
    background: var(--gray-400);
    border-radius: 5px;
    border: 1px solid #125533
}

main img {
    max-width: 100%
}

main .span-short {
    grid-row: span 1
}

main .span-short.column-1 {
    height: 186px
}

main .span-short.column-1 img {
    max-width: 100%;
    height: auto;
    object-fit: unset
}

main .span-medium {
    grid-row: span 2
}

main .span-high {
    grid-row: span 3
}

.row-grid {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    padding-left: 10px;
    padding-right: 10px
}

.column-gallery {
    background: var(--white-one);
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
    padding: 2.5px 2.5px;
    position: relative
}

.column-gallery.height-full {
    padding: 4.5px .75px
}

.rowed {
    width: calc(100vw - 56px);
    margin: 0 auto
}

.co-rtwo {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    width: 100%;
    height: 100%
}

.slick-rtwo {
    height: 100%;
    flex: 1
}

.co-rtwo .slick-list {
    position: absolute
}

.co-rtwo .slick-slider {
    position: absolute;
    width: 100%;
    height: 100%
}

.ctw-rtwo {
    position: absolute;
    top: 0;
    margin: 0 auto;
    width: 100%;
    height: 100%
}

.ctw-rtwo .slick-list {
    position: absolute
}

.ctw-rtwo .slick-slider {
    position: absolute;
    width: 100%;
    height: 100%
}

.slick-rtwo {
    height: 100%;
    flex: 1
}

.slick-ctw-rtwo {
    height: 100%;
    flex: 1
}

.co-rtwo .slick-list {
    position: absolute
}

.co-rtwo .slick-slider {
    position: absolute;
    width: 100%;
    height: 100%
}

.ctw-rtwo {
    position: absolute;
    top: 0;
    margin: 0 auto;
    width: 100%;
    height: 100%
}

.ctw-rtwo .slick-list {
    position: absolute;
    width: 100%
}

.ctw-rtwo .slick-slider {
    position: absolute;
    width: 100%;
    height: 100%
}

.cfo-rton {
    position: absolute;
    top: 0;
    margin: 0 auto;
    width: 100%;
    height: 100%
}

.cfo-rton .slick-list {
    position: absolute;
    width: 100%
}

.cfo-rton .slick-slider {
    position: absolute;
    width: 100%;
    height: 100%
}

.cfo-rthr {
    position: absolute;
    top: 0;
    margin: 0 auto;
    width: 100%;
    height: 100%
}

.cfo-rthr .slick-list {
    position: absolute;
    width: 100%
}

.cfo-rthr .slick-slider {
    position: absolute;
    width: 100%;
    height: 100%
}

.co-fvon {
    position: absolute;
    top: 0;
    margin: 0 auto;
    width: 100%;
    height: 100%
}

.co-fvon .slick-list {
    position: absolute;
    width: 100%
}

.co-fvon .slick-slider {
    position: absolute;
    width: 100%;
    height: 100%
}

.rowed .column-gallery:first-child .card-project-case.flex-1:nth-child(2) {
    flex: 0 0 30%;
    margin-top: 1px;
    margin-bottom: 1px
}

.rowed .column-gallery:nth-child(2) .card-project-case.flex-1:first-child {
    flex: 0 0 56%;
    margin-bottom: 1.5px
}

.rowed .column-gallery:nth-child(3) .card-project-case.flex-1:first-child {
    flex: 0 0 53%;
    margin-bottom: 1.5px
}

.rowed .column-gallery:nth-child(4) .card-project-case.flex-1:nth-child(2) {
    flex: 0 0 30%;
    margin-top: 1px;
    margin-bottom: 1px
}

.rowed .column-gallery:nth-child(5) .card-project-case.flex-1:first-child {
    flex: 0 0 58%;
    margin-bottom: 1.5px
}

.column-gallery.height-full {
    flex: 0 0 1;
    flex-direction: column;
    display: flex;
    width: 100%;
    height: calc(100vh - 128px);
    overflow: hidden;
    flex-direction: column
}

.justify-between {
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between
}

.gap-2 {
    gap: 3px 3px !important
}

.column-odd {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    flex-direction: column;
    gap: 5px 0
}

.card-project-case {
    position: relative;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    overflow: hidden
}

.card-project-case img {
    max-width: 100%
}

.card-project-case.flex-1 {
    flex: 1;
    border: 2.5px 2px solid #fff
}

.continue {
    padding: 8px 10px;
    color: var(--white-one);
    text-decoration: none;
    outline: 0;
    border-radius: 4.5px;
    cursor: pointer;
    z-index: 2;
    position: relative
}

.continue:hover {
    text-decoration: underline
}

.collase-1 {
    position: relative
}

.collase-1 img {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    top: 0;
    bottom: unset;
    text-align: center
}

.collase-2 {
    position: relative
}

@-webkit-keyframes zoom {
    from {
        -webkit-transform: scale(1, 1)
    }

    to {
        -webkit-transform: scale(1.4, 1.4)
    }
}

@keyframes zoom {
    from {
        transform: scale(1, 1)
    }

    to {
        transform: scale(1.4, 1.4)
    }
}

@-webkit-keyframes zoomtwo {
    from {
        -webkit-transform: scale(1, 1)
    }

    to {
        -webkit-transform: scale(1.4, 1.4)
    }
}

@keyframes zoomtwo {
    from {
        transform: scale(1, 1)
    }

    to {
        transform: scale(1.4, 1.4)
    }
}

.img {
    opacity: 0;
    transition: 3.9s ease-in-out;
    max-width: 100%;
    z-index: 1
}

.imgtwo {
    opacity: 0;
    transition: opacity 2s ease-in-out, transform 10s ease-in-out;
    transform: scale(1)
}

.img.showing {
    opacity: 1;
    max-width: 100%;
    animation: zoom 50s linear infinite ease-in-out forwards;
    -moz-animation: zoom 50s linear infinite ease-in-out forwards;
    -ms-animation: zoom 50s linear infinite ease-in-out forwards;
    -webkit-animation: zoom 50s linear infinite ease-in-out forwards;
    transform: scale(1.04, 1.04);
    z-index: 3;
    position: absolute
}

.imgtwo.showingtwo {
    opacity: 1;
    max-width: 100%;
    transform: scale(1, 1);
    transition: 3.9s ease-in-out;
    -webkit-animation: zoomtwo 50s;
    z-index: 3;
    position: absolute
}

@-webkit-keyframes zoomthree {
    from {
        -webkit-transform: scale(1, 1)
    }

    to {
        -webkit-transform: scale(1.2, 1.2)
    }
}

@keyframes zoomthree {
    from {
        transform: scale(1, 1)
    }

    to {
        transform: scale(1.4, 1.4)
    }
}

.imgthree {
    opacity: .2;
    max-width: 100%;
    z-index: 1
}

.imgthree.showingthree {
    opacity: 1;
    max-width: 100%;
    transform: scale(1, 1);
    transition: 2.9s ease-in-out;
    -webkit-animation: zoomthree 40s;
    z-index: 3;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center
}

@-webkit-keyframes zoomfourth {
    from {
        -webkit-transform: scale(1, 1)
    }

    to {
        -webkit-transform: scale(1.1, 1.1)
    }
}

@keyframes zoomfourth {
    from {
        transform: scale(1, 1)
    }

    to {
        transform: scale(1.1, 1.1)
    }
}

.imgfourth {
    opacity: 0;
    transition: 2.9s ease-in-out;
    max-width: 100%;
    z-index: 1;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center
}

.imgfourth.showingfourth {
    opacity: 1;
    max-width: 100%;
    transform: scale(1, 1);
    transition: 2.9s ease-in-out;
    -webkit-animation: zoomfourth 40s;
    z-index: 3;
    position: absolute
}

@-webkit-keyframes zoomfiveth {
    from {
        -webkit-transform: scale(1, 1)
    }

    to {
        -webkit-transform: scale(1.1, 1.1)
    }
}

@keyframes zoomfiveth {
    from {
        transform: scale(1, 1)
    }

    to {
        transform: scale(1.1, 1.1)
    }
}

.imgfiveth {
    opacity: 0;
    transition: 2.9s ease-in-out;
    max-width: 100%;
    z-index: 1;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center
}

.imgfiveth.showingfiveth {
    opacity: 1;
    max-width: 100%;
    transform: scale(1, 1);
    transition: 2.9s ease-in-out;
    -webkit-animation: zoomfiveth 40s;
    z-index: 3;
    position: absolute
}

@-webkit-keyframes zoomfourth {
    from {
        -webkit-transform: scale(1, 1)
    }

    to {
        -webkit-transform: scale(1.4, 1.4)
    }
}

@keyframes zoomnineth {
    from {
        transform: scale(1, 1)
    }

    to {
        transform: scale(1.4, 1.4)
    }
}

.imgnineth {
    opacity: 0;
    transition: 2.9s ease-in-out;
    max-width: 100%;
    z-index: 1;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center
}

.imgnineth.showingnineth {
    opacity: 1;
    max-width: 100%;
    transform: scale(1, 1);
    transition: 2.9s ease-in-out;
    -webkit-animation: zoomnineth 40s;
    z-index: 3;
    position: absolute
}

@-webkit-keyframes zoomfourth {
    from {
        -webkit-transform: scale(1, 1)
    }

    to {
        -webkit-transform: scale(1.4, 1.4)
    }
}

@keyframes zoomnineth {
    from {
        transform: scale(1, 1)
    }

    to {
        transform: scale(1.4, 1.4)
    }
}

.imgnineth {
    opacity: 0;
    transition: 2.9s ease-in-out;
    max-width: 100%;
    z-index: 1;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center
}

.imgnineth.showingnineth {
    opacity: 1;
    max-width: 100%;
    transform: scale(1, 1);
    transition: 2.9s ease-in-out;
    -webkit-animation: zoomnineth 40s;
    z-index: 3;
    position: absolute
}

.row-grid {
    position: relative;
    top: -2px
}

.column-event {
    display: flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    flex-direction: column;
    gap: 5px 0
}

.card-project-case {
    background: var(--gray-200)
}

.row-grid .column-gallery:first-child .card-project-case:nth-child(1) {
    min-height: 184px;
    max-height: 184px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:first-child .card-project-case:nth-child(2) {
    min-height: 146px;
    max-height: 146px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:first-child .card-project-case:nth-child(3) {
    min-height: 152px;
    max-height: 152px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:nth-child(4) .card-project-case:first-child {
    min-height: 184px;
    max-height: 184px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(2) {
    min-height: 146px;
    max-height: 146px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(3) {
    min-height: 152px;
    max-height: 152px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:nth-child(2) .card-project-case:first-child {
    min-height: 269px;
    max-height: 269px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:nth-child(2) .card-project-case:nth-child(2) {
    max-height: 218px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:nth-child(3) .card-project-case:first-child {
    min-height: 247px;
    max-height: 247px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:nth-child(3) .card-project-case:nth-child(2) {
    min-height: 240px;
    max-height: 240px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:nth-child(5) .card-project-case:first-child {
    min-height: 269px;
    max-height: 269px !important;
    overflow: hidden !important
}

.row-grid .column-gallery:nth-child(5) .card-project-case:nth-child(2) {
    max-height: 218px !important;
    overflow: hidden !important
}

.wslider-two {
    width: 259px;
    min-height: 269px;
    max-height: 269px !important;
    background: #ddd;
    width: 100%;
    position: relative;
    overflow: hidden
}

.wslider {
    width: 269px;
    height: 269px;
    background: #ddd;
    width: 100%;
    height: 100vh;
    overflow: hidden
}

.slidesv-two {
    position: relative;
    width: 269px;
    height: 269px !important;
    max-height: 269px !important;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    flex-direction: row;
    transition: transform 1s ease-in-out;
    z-index: 2;
    top: 0;
    left: 0
}

.slidesv {
    position: relative;
    width: 259px;
    min-height: 269px;
    max-height: 269px !important;
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    transition: transform 1s ease-in-out
}

.slidevsatu-two {
    flex: 0 0 100%;
    width: 100%;
    height: 100vh;
    background-size: cover;
    background-position: center;
    transition: opacity .5s ease-in-out;
    opacity: 1;
    z-index: 2;
    min-width: 259px;
    height: 100%;
    background-size: 100% !important;
    background-position: center;
    background-repeat: no-repeat
}

.slidevsatu-two.active-two {
    opacity: 1;
    z-index: 3
}

.slick-slider.co-rtwo .slick-list {
    transform: rotate(180deg)
}

.slick-slider.co-rtwo .slick-slide {
    transform: rotate(180deg)
}

#scroll-down {
    width: 259px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    position: relative;
    padding-top: 12px;
    text-align: center
}

@-moz-document url-prefix() {
    #scroll-down {
        padding-top: 16px
    }
}

.right-text-arrow {
    width: 89%
}

.arrow-down {
    display: block;
    margin: 0 auto;
    width: 10px;
    height: 38px
}

.arrow-down:after {
    content: "";
    display: block;
    margin: 0;
    padding: 0;
    width: 8px;
    height: 8px;
    border-top: 2px solid var(--gray-950);
    border-right: 2px solid var(--gray-950);
    behavior: url(-ms-transform.htc);
    -moz-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg)
}

#scroll-title {
    width: auto;
    text-transform: uppercase;
    color: var(--gray-950);
    font: normal 400 clamp(0.7588rem, 0.6657rem + 0.1163vw, 0.765rem) var(--font-arial);
    letter-spacing: .1em
}

#scroll-down::before {
    -webkit-animation: elasticus .5s cubic-bezier(1, 0, 0, 1) infinite;
    -moz-animation: elasticus .5s cubic-bezier(1, 0, 0, 1) infinite;
    -o-animation: elasticus .5s cubic-bezier(1, 0, 0, 1) infinite;
    animation: elasticus .5s cubic-bezier(1, 0, 0, 1) infinite;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -1px;
    width: 2px;
    height: 90px;
    background: var(--gray-950);
    content: " ";
    display: none
}

@-webkit-keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0)
    }

    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0)
    }
}

@-moz-keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0)
    }

    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0)
    }
}

@-o-keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0)
    }

    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0)
    }
}

@keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0)
    }

    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }

    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0)
    }
}

#paschka {
    display: block;
    color: #fff;
    font-family: arial;
    font-size: 32px;
    text-decoration: none;
    position: fixed;
    bottom: 0;
    right: 0;
    padding: 0;
    transition: all .1s ease;
    background: #000;
    height: 40px;
    line-height: 30px;
    vertical-align: middle;
    width: 40px;
    text-align: center;
    border-radius: 5%;
    bottom: 20px;
    right: 20px
}

#paschka:hover {
    background: #232323;
    transition: all .1s ease;
    color: #f0f0f0
}

.scrd-down {
    width: 274px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.wrp-arrow {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    opacity: 1;
    -webkit-transition: all .1s ease;
    -moz-transition: all .1s ease;
    transition: all .1s ease;
    height: auto
}

.wrp-arrow.swipe-up-nav {
    animation: fadeIn-fadeOut ease .1s;
    opacity: 0;
    overflow: hidden
}

#down-text,
#employee,
#employee-dance {
    height: 700px
}

#employee {
    background: green
}

#employee-dance {
    background: red
}

#down-text {
    background: orange
}

@keyframes fadeIn-fadeOut {
    10% {
        opacity: 1
    }

    20% {
        opacity: .75
    }

    90% {
        opacity: .33
    }

    100% {
        opacity: 0
    }
}

.icon-arrow-down {
    width: 12px;
    height: 12px;
    margin-top: 8px;
    margin-right: 0
}

.playing {
    cursor: pointer;
    display: none
}

.mute {
    cursor: pointer
}

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

.arrow-down-projects {
    position: absolute !important;
    z-index: 4;
    right: 8px;
    top: 4px;
    width: 12px !important;
    height: 12px !important;
    background: var(--white-one);
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.frame-book {
    background: #fff;
    width: 100%;
    min-height: 832px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    margin-top: 18px;
    margin-bottom: 24px
}

.download-wrapper {
    position: relative;
    width: 768px;
    min-height: 60px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center
}

.download-container {
    width: 90%;
    height: 90%;
    position: relative
}

.download-container a {
    background: #385623;
    text-align: center;
    text-decoration: none;
    outline: 0;
    padding: 18px 24px;
    display: block;
    color: #fff;
    margin-bottom: 40px
}

.download-container a:hover {
    text-decoration: underline
}

.book-wrapper {
    position: relative;
    width: 768px;
    min-height: 486px;
    height: 800px;
    transform-style: preserve-3d;
    transition: transform .3s ease;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.book-container {
    width: 90%;
    height: 90%;
    position: relative;
    transform-style: preserve-3d;
    justify-content: center;
    align-items: center;
    margin-top: 50px;
    margin: 0 auto
}

.page {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    transform-style: preserve-3d;
    transform-origin: left center;
    cursor: url('../images/company-profile/mdi_gesture-swipe.svg'), auto
}

.page-face {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #fff
}

.front {
    transform: rotateY(0);
    z-index: 2;
    /*border-right: 1px solid #212840;
    box-shadow: inset -5px 0 10px rgba(0, 0, 0, .2);*/
    overflow: hidden
}

.back {
    transform: rotateY(180deg);
    z-index: 1;
    /*border-left: 1px solid #000;
    box-shadow: inset 5px 0 10px rgba(0, 0, 0, .05);*/
    overflow: hidden
}

.page-number {
    position: absolute;
    bottom: 20px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    font-weight: 700;
    background: rgba(0, 0, 0, .9);
    /*box-shadow: 0 2px 5px rgba(0, 0, 0, .1)*/
}

.left-page .page-number {
    left: 20px;
    display: none
}

.right-page .page-number {
    right: 20px;
    display: none
}

.flip-instruction {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(255, 255, 255, .9);
    padding: 8px 15px;
    border-radius: 20px;
    font-size: .9rem;
    color: #333;
   /* box-shadow: 0 2px 10px rgba(0, 0, 0, .1);*/
    z-index: 100;
    opacity: 0;
    transition: opacity .3s;
    pointer-events: none
}

.book-container:hover .flip-instruction {
    opacity: 1
}

.page::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 15px;
    height: 100%;
    pointer-events: none
}

.arrow-down-projects img {
    max-width: 100%
}

.name-container {
    height: 30px;
    overflow: hidden
}

.logo-name {
    opacity: 0;
    color: #fff;
    font-size: 20px;
    letter-spacing: 12px;
    text-transform: uppercase;
    margin-left: 20px;
    font-weight: bolder;
    z-index: 9
}

#continue {
    opacity: 0
}

.contain-preload.logo-name {
    margin-left: 0
}

.scroll-down {
    position: absolute;
    top: 80.64%;
    left: 50%;
    transform: translate(-50%, -56%)
}

.scroll-down::before {
    width: 169px;
    content: "SCROLL DOWN TO EXPLORE";
    position: absolute;
    top: unset;
    bottom: -86px;
    left: 50%;
    transform: translate(-50%, -6.64%);
    color: var(--white-one);
    text-align: center;
    font: normal 400 clamp(0.7225rem, 0.3132rem + 0.5116vw, 0.75rem) var(--font-arial)
}

.scroll-down span {
    display: block;
    width: 14px;
    height: 14px;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    margin: -10px;
    animation: animatedown 10ms infinite
}

.scroll-down span:nth-child(2) {
    animation-delay: 10ms
}

.scroll-down span:nth-child(3) {
    animation-delay: 10ms
}

@keyframes animatedown {
    0% {
        opacity: 0;
        transform: rotate(45deg) translate(-18px, -18px)
    }

    50% {
        opacity: .01
    }

    100% {
        opacity: 0;
        transform: rotate(45deg) translate(18px, 18px)
    }
}

.wrp-card-services {
    width: 100%;
    display: block;
    position: relative
}

.wrp-card-services ul {
    display: flex;
    flex-direction: row;
    margin: 0;
    list-style-type: none;
    padding-left: 0
}

.services-items {
    list-style: none;
    width: calc(100%/2);
    height: 100%;
    background: #fff;
    box-shadow: -60px 0 50px -90px #000, 60px 0 50px -90px #000;
    -webkit-box-shadow: -60px 0 50px -90px #000, 60px 0 50px -90px #000;
    -moz-box-shadow: -60px 0 50px -90px #000, 60px 0 50px -90px #000;
    padding: 30px 30px 20px 30px;
    position: relative;
    top: 0;
    z-index: 1;
    transition: .36s ease-in-out;
    -webkit-transition: .36s ease-in-out;
    -moz-transition: .36s ease-in-out;
    border: 1px solid var(--gray-200);
    overflow: unset;
    box-shadow: 0 1px 10px rgba(151, 164, 175, .24);
    -ms-box-shadow: 0 1px 10px rgba(151, 164, 175, .24);
    -moz-box-shadow: 0 1px 10px rgba(151, 164, 175, .24);
    -webkit-box-shadow: 0 1px 10px rgba(151, 164, 175, .24);
    min-height: 411px
}

.services-items:not(:first-child) {
    margin-left: -20rem
}

.services-items.active,
.services-items:hover {
    z-index: 3;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    transition: .46s ease-in-out;
    -webkit-transition: .46s ease-in-out;
    -moz-transition: .46s ease-in-out
}

.services-items.active~.services-items,
.services-items:hover~.services-items {
    transform: translateX(20rem);
    -webkit-transform: translateX(20rem);
    -moz-transform: translateX(20rem);
    transition: .46s ease-in-out;
    -webkit-transition: .46s ease-in-out;
    -moz-transition: .46s ease-in-out
}

.card-services-desc {
    min-height: 166px;
    max-height: 166px;
    padding-bottom: 5px;
    position: relative;
    overflow: hidden
}

.card-services-desc::before {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0 auto;
    right: 0 auto;
    bottom: 3.6px;
    width: 101%;
    min-height: 98px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #fff 100%)
}

.wrp-card-services:hover>ul>.services-items .card-services-desc,
.wrp-card-services:hover>ul>.services-items .card-services-images {
    opacity: .2;
    transition: .36s ease-in-out;
    -webkit-transition: .36s ease-in-out;
    -moz-transition: .36s ease-in-out
}

.wrp-card-services:hover>ul>.services-items .card-services-desc {
    overflow: unset;
    max-height: unset;
    opacity: .2;
    transition: .36s ease-in-out;
    -webkit-transition: .36s ease-in-out;
    -moz-transition: .36s ease-in-out
}

.wrp-card-services:hover>ul>.services-items .card-services-desc::before {
    background: transparent none
}

.wrp-card-services:hover>ul>.services-items:hover .card-services-desc,
.wrp-card-services:hover>ul>.services-items:hover .card-services-images {
    opacity: 1;
    transition: .36s ease-in-out;
    -webkit-transition: .36s ease-in-out;
    -moz-transition: .36s ease-in-out
}

.services-items a {
    text-decoration: none;
    outline: 0;
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    color: var(--gray-700);
    letter-spacing: .2px;
    line-height: 18.64px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    min-height: 408px
}

.card-services-desc {
    background: var(--white-one);
    margin-top: unset;
    padding: unset;
    width: unset;
    align-self: unset;
    color: var(--gray-700)
}

.card-services-desc h2 {
    font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-spectral);
    color: var(--gray-950);
    margin-bottom: 14px;
    line-height: 24px;
    padding-right: 30px
}

.card-services-images {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial)
}

.card-services-images figure {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    max-height: 274px;
    overflow-y: hidden
}

.card-services-images img {
    max-width: 100%
}

.section-home-services {
    width: 100%;
    min-height: 424px;
    padding: 56px 0 64px 0
}

.section-projects-home {
    width: 100%;
    padding: 18px 0 48px 0
}

.wrp-item-projects {
    width: 100%;
    height: auto;
    min-height: 124px
}

.wrp-item-projects a {
    width: 100%;
    height: auto;
    text-decoration: none;
    color: var(--gray-950);
    outline: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center
}

.wrp-item-projects a:focus,
.wrp-item-projects a:hover {
    text-decoration: none;
    color: var(--gray-950);
    outline: 0
}

.card-home-projects {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 373px;
    max-height: 373px;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    -ms-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.card-home-projects img {
    max-width: 100%;
    transform: scale(1, 1);
    transition-property: all;
    transition-duration: .5s
}

.wrp-item-projects:hover a img {
    transform: scale(1.1, 1.1)
}

.desc-home-projects {
    width: 100%;
    height: auto
}

.title-projects-home {
    width: 100%
}

.title-projects-home h2 {
    font: normal 600 clamp(1.125rem, 0.5297rem + 0.7442vw, 1.165rem) var(--font-spectral);
    margin-top: 27px;
    margin-bottom: 6.64px;
    letter-spacing: .2px;
    text-align: left
}

.more-projects-home {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    justify-content: flex-start;
    -ms-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    margin-top: 18px;
    margin-bottom: 56.64px
}

.icon-arrow {
    width: 16px;
    height: 16px;
    padding: 2px 2px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    -ms-transform: rotate(270deg);
    -moz--ms-transform: rotate(270deg);
    -webkit--ms-transform: rotate(270deg);
    transform: rotate(270deg);
    margin-top: 1px;
    margin-left: 6px
}

.icon-arrow svg {
    max-width: 100%
}

.text-seemore h4 {
    font: normal 400 clamp(0.8425rem, 0.3588rem + 0.6047vw, 0.875rem) var(--font-arial);
    color: var(--gray-900);
    margin-bottom: 0
}

.more-projects-home h5 {
    font: normal 400 clamp(0.8425rem, 0.3588rem + 0.6047vw, 0.875rem) var(--font-arial);
    color: var(--gray-900);
    margin-top: 61px;
    margin-bottom: 56.64px;
    letter-spacing: .2px;
    text-align: left
}

.row-projects .col-lg-3.col-md-4:nth-last-child(4) .more-projects-home {
    margin-bottom: 0
}

.row-projects .col-lg-3.col-md-4:nth-last-child(3) .more-projects-home {
    margin-bottom: 0
}

.row-projects .col-lg-3.col-md-4:nth-last-child(2) .more-projects-home {
    margin-bottom: 0
}

.row-projects .col-lg-3.col-md-4:last-child .more-projects-home {
    margin-bottom: 0
}

.row-card-people {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    gap: 24px 36px
}

.wrp-card-people {
    width: 18.86%;
    min-height: 204px;
    background: var(--white-one);
    padding-left: 0;
    padding-right: 0;
    position: relative;
    overflow: unset
}

.wrp-according-catalog .accordion-body.accordion-body-catalog a {
    text-decoration: none !important
}

.row-card-people .wrp-card-people::before {
    content: " ";
    width: 1px;
    height: 99.24%;
    background: var(--gray-200);
    position: absolute;
    right: -18.5px;
    top: 1px
}

.row-card-people .wrp-card-people:last-child::before {
    content: " ";
    width: 0;
    height: 100%;
    background: var(--white-one);
    position: absolute;
    right: -18.5px;
    top: 0
}

.wrp-card-people a {
    text-decoration: none;
    outline: 0;
    color: var(--gray-950);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center
}

.card-photo-people {
    width: 100%;
    min-height: 263px;
    max-height: 263px;
    overflow: hidden;
    margin-bottom: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.card-photo-people img {
    margin: 0 auto;
    max-width: 100%
}

.wrp-card-people a img {
    max-width: 100%;
    transform: scale(1, 1);
    transition-property: all;
    transition-duration: .5s
}

.wrp-card-people:hover a img {
    transform: scale(1.1, 1.1)
}

.people-name-home {
    width: 100%;
    text-align: left;
    padding-left: 0;
    padding-right: 0
}

.people-name-home h2 {
    font: normal 600 clamp(1.0713rem, 0.9782rem + 0.1163vw, 1.0775rem) var(--font-arial);
    margin-bottom: 6.64px;
    letter-spacing: .04px;
    text-align: left
}

.people-title-home {
    width: 100%;
    padding-left: 0;
    padding-right: 0
}

.people-title-home h3 {
    font: normal 400 clamp(0.9775rem, 0.6426rem + 0.4186vw, 1rem) var(--font-arial);
    color: var(--gray-900);
    margin-bottom: 18px
}

.desc-people-home {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    font: normal 400 clamp(0.715rem, 0.051rem + 0.8637vw, 0.7925rem) var(--font-arial);
    color: var(--gray-700);
    letter-spacing: .04px;
    line-height: 18.64px;
    height: 131px;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis
}

.desc-people-home p {
    margin-bottom: 5px
}

.section-about-people {
    width: 100%;
    height: auto;
    padding: 24px 0 48px 0;
    overflow-x: clip
}

.wrp-people-detail {
    width: 100%;
    min-height: 124px;
    background: var(--gray-300);
    top: 89px;
    position: sticky
}

.card-photo-detail {
    width: 100%;
    margin-bottom: 1px
}

.card-photo-detail img {
    max-width: 100%
}

.title-section-page h2 {
    font: normal 400 clamp(0.9775rem, 0.6426rem + 0.4186vw, 1rem) var(--font-arial);
    color: var(--gray-900);
    margin-bottom: 18px
}

.floating-title-page {
    width: 100%;
    height: auto;
    min-height: 1px;
    position: sticky;
    top: 62.5px
}

.section-about-people .dynamic-content {
    text-align: justify
}

#modalseePeople {
    border-color: transparent none !important;
    border: 0 !important;
    --bs-modal-border-color: var(--white-trans-full)
}

#modalseePeople1 {
    border-color: transparent none !important;
    border: 0 !important;
    --bs-modal-border-color: var(--white-trans-full)
}

#modalseePeople-7 .modal-dialog-people,
#modalseePeople7 .modal-dialog-people {
    max-width: 876px;
    min-height: 296px;
    height: auto;
    border-radius: 0 !important;
    overflow: hidden;
    border: 0 !important;
    outline: 0;
    box-shadow: none !important;
    margin-top: 76px
}

#modalseePeople-6 .modal-dialog-people,
#modalseePeople6 .modal-dialog-people {
    max-width: 876px;
    min-height: 296px;
    height: auto;
    border-radius: 0 !important;
    overflow: hidden;
    border: 0 !important;
    outline: 0;
    box-shadow: none !important;
    margin-top: 76px
}

#modalseePeople-5 .modal-dialog-people,
#modalseePeople5 .modal-dialog-people {
    max-width: 876px;
    min-height: 296px;
    height: auto;
    border-radius: 0 !important;
    overflow: hidden;
    border: 0 !important;
    outline: 0;
    box-shadow: none !important;
    margin-top: 76px
}

#modalseePeople-4 .modal-dialog-people,
#modalseePeople4 .modal-dialog-people {
    max-width: 876px;
    min-height: 296px;
    height: auto;
    border-radius: 0 !important;
    overflow: hidden;
    border: 0 !important;
    outline: 0;
    box-shadow: none !important;
    margin-top: 76px
}

#modalseePeople-3 .modal-dialog-people,
#modalseePeople3 .modal-dialog-people {
    max-width: 876px;
    min-height: 296px;
    height: auto;
    border-radius: 0 !important;
    overflow: hidden;
    border: 0 !important;
    outline: 0;
    box-shadow: none !important;
    margin-top: 76px
}

#modalseePeople-2 .modal-dialog-people,
#modalseePeople2 .modal-dialog-people {
    max-width: 876px;
    height: auto;
    border-radius: 0 !important;
    overflow: hidden;
    border: 0 !important;
    outline: 0;
    box-shadow: none !important;
    margin-top: 76px
}

#modalseePeople .modal-dialog-people,
#modalseePeople-1 .modal-dialog-people {
    max-width: 876px;
    min-height: 396px;
    height: auto;
    border-radius: 0 !important;
    overflow: hidden;
    border: 0 !important;
    outline: 0;
    box-shadow: none !important;
    margin-top: 76px
}

#modalseePeople-1 .modal-dialog-people,
#modalseePeople1 .modal-dialog-people {
    max-width: 876px;
    min-height: 396px;
    height: auto;
    border-radius: 0 !important;
    overflow: hidden;
    border: 0 !important;
    outline: 0;
    box-shadow: none !important;
    margin-top: 76px
}

#modalseePeople2 .side-right-people {
    cursor: pointer
}

#modalseePeople3 .side-right-people {
    cursor: pointer
}

.side-right-people {
    cursor: pointer
}

.modal-header-people {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    position: relative;
    border-bottom: 0;
    background: transparent none;
    padding-top: 1px;
    padding-bottom: 1px;
    border-bottom: 1px solid transparent none;
    border-top-left-radius: calc(.3rem - 1px);
    border-top-right-radius: calc(.3rem - 1px)
}

.modal-header-people h2 {
    font-size: 16px;
    line-height: 19px;
    width: 92%;
    font-family: Poppins-SemiBold, sans-serif;
    margin-top: 3.5px;
    color: #363636
}

.modal-header-people .close {
    background: var(--gray-950);
    text-align: center;
    width: 35px;
    border-radius: 25px;
    height: 35px;
    overflow: hidden;
    z-index: 2;
    opacity: 1;
    line-height: 6px;
    border: 1px solid var(--gray-200);
    box-shadow: 0 1px 14px rgba(0, 0, 0, .11);
    right: 24.5px;
    position: absolute;
    top: 24.5px
}

.modal-header-people a img {
    width: 12px;
    cursor: pointer;
    margin-left: 0;
    margin-top: 11px
}

#modalseePeople4 .modal-dialog-people .modal-content {
    background: transparent none;
    border-radius: 1.125rem;
    min-height: 520px;
    padding-left: 0 0 20px 0;
    border: 0 !important
}

#modalseePeople3 .modal-dialog-people .modal-content {
    background: transparent none;
    border-radius: 1.125rem;
    min-height: 520px;
    padding-left: 0 0 20px 0;
    border: 0 !important
}

#modalseePeople2 .modal-dialog-people .modal-content {
    background: transparent none;
    border-radius: 1.125rem;
    min-height: 520px;
    padding-left: 0 0 20px 0;
    border: 0 !important
}

#modalseePeople .modal-dialog-people .modal-content {
    background: transparent none;
    border-radius: 1.125rem;
    min-height: 520px;
    padding-left: 0 0 20px 0;
    border: 0 !important
}

#modalseePeople1 .modal-dialog-people .modal-content {
    background: transparent none;
    border-radius: 1.125rem;
    min-height: 520px;
    padding-left: 0 0 20px 0;
    border: 0 !important
}

#modalseePeople4 .modal-dialog-people .modal-content .modal-body-people {
    padding: 0;
    background: transparent none;
    margin-top: -4.5px
}

#modalseePeople3 .modal-dialog-people .modal-content .modal-body-people {
    padding: 0;
    background: transparent none;
    margin-top: -4.5px
}

#modalseePeople2 .modal-dialog-people .modal-content .modal-body-people {
    padding: 0;
    background: transparent none;
    margin-top: -4.5px
}

#modalseePeople .modal-dialog-people .modal-content .modal-body-people {
    padding: 0;
    background: transparent none;
    margin-top: -4.5px
}

.row-modal-people {
    display: flex;
    flex-wrap: wrap;
    margin-top: -3px
}

.side-left-people {
    max-width: 28%;
    flex: 0 0 28%;
    -ms-flex: 0 0 28%;
    height: 100vh;
    background: transparent none;
    padding-right: 15px;
    overflow-y: hidden !important
}

.card-people-image-modal {
    width: 100%;
    height: auto
}

.card-people-image-modal img {
    max-width: 100%;
    height: auto;
    position: relative;
    margin-top: -3px
}

.people-name-dialog {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    min-height: 76px;
    padding: 20px 24px;
    height: auto;
    font-family: Poppins-Regular, sans-serif;
    font-size: 1.125rem;
    line-height: 1.75rem;
    color: #fff
}

.people-name-dialog h3 {
    font-family: Poppins-SemiBold, sans-serif;
    font-size: 1.5rem;
    line-height: 1.85rem;
    position: relative
}

.people-name-dialog h3::before {
    content: " ";
    width: 54px;
    height: 4.5px;
    position: absolute;
    bottom: -20px;
    left: -2px;
    background: #fca700
}

.people-social-network {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    min-height: 76px;
    padding: 20px 24px;
    height: auto;
    font-family: Poppins-Regular, sans-serif;
    font-size: 1.125rem;
    line-height: 1.75rem;
    color: #fff
}

.button-dialog-socmed {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    height: auto;
    padding: 10px 6px;
    border: 1px solid #fefefe;
    border-radius: 32px;
    border-radius: 30px
}

.button-dialog-socmed a {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    justify-content: flex-start;
    -moz--justify-content: flex-start;
    -ms-justify-content: flex-start;
    -webkit--justify-content: flex-start;
    text-decoration: none !important;
    outline: 0
}

.button-dialog-socmed a:focus,
.button-dialog-socmed a:hover {
    text-decoration: none;
    outline: 0
}

.left-icon-sn-dialog {
    width: 18px;
    height: 18px
}

.right-icon-ar-dialog {
    width: 18px;
    height: 18px;
    padding: 3px 3px;
    margin-left: 8px;
    margin-right: 8px
}

.right-icon-ar-dialog svg {
    max-width: 100%;
    height: auto
}

.right-icon-ar-dialog svg path.st0 {
    fill: var(--gray-950)
}

.button-dialog-socmed-outline {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    height: auto;
    padding: 14px 6px 10px .5px;
    border-radius: 32px;
    border-radius: 30px
}

.icon-linkedin-arrow {
    width: 18px;
    height: 18px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    padding: 2px 2px;
    margin-right: 10px;
    position: relative;
    margin-top: -3px
}

.button-dialog-socmed-outline a {
    text-decoration: none !important;
    outline: 0;
    width: 166.5px;
    height: 48px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    padding: 8px 10px;
    border: 1px solid var(--gray-950);
    border-radius: 1.6px
}

.action-button {
    width: 100%
}

.action-button .button-dialog-socmed-outline a {
    min-width: 131.24px;
    width: auto
}

.righ-icon-sn-dialog {
    height: auto;
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    color: var(--gray-700);
    padding-left: 6px;
    margin-top: 2.5px
}

.righ-icon-sn-dialog p {
    margin-bottom: 1px !important
}

.side-right-people {
    display: flex;
    flex-wrap: wrap;
    max-width: 72%;
    flex: 0 0 72%;
    -ms-flex: 0 0 72%;
    background: transparent none
}

.wrp-content-dialog {
    width: 100%;
    height: auto;
    background: #fff;
    padding: 24px 20px .5px 26px
}

.wrp-desc-people-dialog {
    background: transparent none
}

.title-right-desc {
    height: auto;
    font-family: var(--font-arial);
    font-size: 1.5rem;
    line-height: 1.85rem;
    color: #323232
}

.title-right-desc h3 {
    font: normal 600 clamp(1.125rem, 0.5297rem + 0.7442vw, 1.165rem) var(--font-arial);
    margin-bottom: 6.64px;
    margin-top: 3.64px;
    letter-spacing: .2px;
    text-align: left
}

.wrp-content-biography {
    max-width: 100%;
    text-align: justify;
    padding-bottom: 0;
    -ms-scroll-behavior: smooth;
    -moz-scroll-behavior: smooth;
    -webkit-scroll-behavior: smooth;
    scroll-behavior: smooth
}

.wrp-content-biography::-webkit-scrollbar {
    height: 6px;
    width: 2.5px;
    background: transparent none
}

.wrp-content-biography::-webkit-scrollbar-button {
    height: 10px;
    width: 2.5px;
    background: transparent none
}

.wrp-content-biography::-webkit-scrollbar-thumb {
    background: var(--gray-400);
    border-radius: 4px;
    height: 16px !important;
    top: 10px;
    position: relative;
    left: -10px
}

.content-biography {
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    color: var(--gray-700);
    letter-spacing: .2px;
    line-height: 19.64px;
    padding: 10px 6px 15px 0
}

.content-biography h5 {
    font: normal 400 clamp(0.9775rem, 0.6426rem + 0.4186vw, 1rem) var(--font-arial);
    color: var(--gray-900);
    margin-top: -8px;
    margin-bottom: 24px
}

.content-biography h3 {
    font-family: Poppins-SemiBold, sans-serif;
    color: #323232;
    font-size: 1rem;
    line-height: 1.4rem;
    letter-spacing: .32px;
    margin-bottom: 6px
}

.content-biography h4 {
    font-family: Poppins-SemiBold, sans-serif;
    color: #323232;
    font-size: 1.15rem;
    line-height: 1.5rem;
    letter-spacing: .32px;
    margin-bottom: 6px
}

.content-biography p {
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    color: var(--gray-700);
    letter-spacing: .2px;
    line-height: 18.64px;
    text-align: left;
    margin-bottom: 14px;
    text-align: justify
}

.content-biography a {
    color: var(--gray-950);
    text-decoration: underline
}

.content-biography a:focus,
.content-biography a:hover {
    color: var(--gray-950);
    text-decoration: underline;
    outline: 0
}

.content-biography i {
    font-family: Mulish-Italic, sans-serif
}

.content-biography p i {
    font-family: Mulish-Italic, sans-serif
}

.content-biography b {
    font-family: Mulish-Bold, sans-serif
}

.content-biography p b {
    font-family: Mulish-Bold, sans-serif
}

.content-biography p strong {
    font-family: Mulish-Bold, sans-serif
}

.content-biography ul {
    padding-left: 15px
}

.content-biography ul li {
    padding-left: 10px
}

.content-biography ul li p {
    margin-bottom: 3px
}

.content-biography ol {
    list-style-type: decimal;
    padding-left: 18px
}

.content-biography ol li {
    padding-left: 10px
}

.content-biography ol li p {
    margin-bottom: 3px
}

.modal-backdrop.show {
    -webkit-filter: blur(4px) !important;
    -moz-filter: blur(4px) !important;
    -o-filter: blur(4px) !important;
    -ms-filter: blur(4px) !important;
    filter: blur(4px) !important
}

.section-home-people {
    width: 100%;
    padding: 18px 0 20px 0
}

.section-home-clients {
    width: 100%;
    min-height: 86px;
    padding: 48px 0 54px 0
}

.section-home-clients .centered-container .row:nth-child(2) .slick-list {
    overflow: hidden
}

.title-section-home {
    width: 100%;
    text-align: center
}

.title-section-home h2 {
    font: normal 600 clamp(1.1025rem, -8.758rem + 12.3256vw, 1.765rem) var(--font-spectral);
    color: var(--gray-950);
    margin-bottom: 36px
}

.section-our-clients {
    width: 100%
}

.section-our-clients {
    padding-top: 24px;
    padding-bottom: 32px
}

.slick.marquee .slick-slide {
    min-width: 92px;
    max-width: 104px;
    height: auto;
    padding: 10px 0
}

.slick.marquee .slick-track {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center
}

.slick.marquee .slick-slide .inner {
    padding-left: 10px;
    padding-right: 10px;
    margin-left: 5px;
    margin-right: 5px;
    min-width: 92px;
    max-width: 114px;
    width: auto;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center
}

.slick.marquee .slick-slide .inner img {
    max-width: 100%
}

.section-about-team {
    width: 100%;
    height: auto;
    overflow: hidden;
    padding: 8px 0 64px 0
}

.wrp-form {
    width: 100%;
    height: auto;
    overflow: hidden;
    padding: 20px 0
}

.title-say-hi {
    width: 100%;
    display: block;
    height: auto;
    overflow: hidden
}

.title-say-hi h5 {
    font-family: Rubik-Medium, sans-serif;
    font-size: 18px;
    color: #212831;
    line-height: 24px;
    margin-top: 15px;
    margin-bottom: 15px;
    display: block
}

.form-label-group {
    position: relative
}

.form-label-group>input,
.form-label-group>label {
    height: 50px;
    padding: 16px 15px 16px 2px;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial);
    color: var(--gray-900)
}

.form-group-line>input {
    margin-bottom: 26px !important;
    border: 0;
    border-bottom: 1.5px solid #888;
    border-radius: 0
}

.form-label-group>label {
    position: absolute;
    top: -2.3px;
    -ms-top: -2.3px;
    -moz-top: -2.3px;
    -webkit-top: -2.3px;
    left: .77px;
    display: block;
    width: 100%;
    margin-bottom: 0;
    line-height: 1.5;
    color: #b6b6b8;
    pointer-events: none;
    cursor: text;
    border-radius: .25rem;
    transition: all .1s ease-in-out
}

.form-label-group>label span {
    color: #ea4335
}

.form-label-group input::-webkit-input-placeholder {
    color: transparent
}

.form-label-group input:-ms-input-placeholder {
    color: transparent
}

.form-label-group input::-ms-input-placeholder {
    color: transparent
}

.form-label-group input::-moz-placeholder {
    color: transparent
}

.form-label-group input::-webkit-inner-spin-button,
.form-label-group input::-webkit-outer-spin-button {
    -ms-appearance: none;
    -webkit-appearance: none;
    -moz-appearance: textfield !important
}

.form-label-group input[type=number] {
    -ms-appearance: none;
    -webkit-appearance: none;
    -moz-appearance: textfield !important
}

.form-label-group input::placeholder {
    color: transparent
}

.form-label-group input:not(:placeholder-shown) {
    padding-top: 9px;
    padding-bottom: 9px;
    top: unset
}

.form-label-group input:not(:placeholder-shown)~label {
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 13px;
    color: #777;
    top: -13px;
    -moz-top: -13px;
    -webkit-top: -13px;
    -ms-top: -13px;
    background: #fff;
    padding-right: 4px;
    padding-left: 10px;
    z-index: 1 !important;
    width: auto;
    margin-bottom: 0;
    height: 25px;
    left: -8px;
    letter-spacing: .4px
}

.select2-container--default .select2-selection--multiple {
    background-color: #fff;
    border: 1px solid #aaa;
    border-radius: 4px
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    color: #797979;
    line-height: 30px;
    font-size: 14.5px;
    padding-left: 12px
}

.select2-container .select2-selection--multiple .select2-selection__rendered {
    display: block;
    padding-left: 8px;
    padding-right: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.select2-container .select2-search--inline .select2-search__field {
    margin-top: 4px
}

.select2-container--default .select2-selection--single {
    height: 47px !important;
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    border-radius: 3.5px
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #aeaeae !important;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial);
    color: var(--gray-900);
    line-height: 24px
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #797979;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial);
    color: var(--gray-900);
    padding-left: 4px;
    line-height: 40px
}

.select2-container--default .select2-results__option[aria-selected=true] {
    color: #fff;
    background-color: var(--gray-950);
    padding-left: 12px
}

.select2-container--default .select2-results__option[aria-selected=false] {
    color: #797979;
    padding-left: 12px
}

.select2-container--default .select2-results__option[aria-selected=false]:hover {
    color: #4e4e4e;
    background-color: #f2f7fa;
    padding-left: 12px
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 10px;
    right: 10px
}

.select2-container {
    width: 100% !important;
    display: block
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered li {
    margin-bottom: 3px
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered li :last-child {
    margin-bottom: 3px !important
}

.form-label-group textarea::-webkit-textarea-placeholder {
    color: transparent
}

.form-label-group textarea:-ms-textarea-placeholder {
    color: transparent
}

.form-label-group textarea::-ms-textarea-placeholder {
    color: transparent
}

.form-label-group textarea::-moz-placeholder {
    color: transparent
}

.form-label-group textarea::placeholder {
    color: transparent
}

.form-label-group textarea:not(:placeholder-shown) {
    padding-top: 9px;
    padding-bottom: 9px
}

.form-label-group textarea:not(:placeholder-shown)~label {
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 11px;
    color: #777;
    top: -12px;
    background: #fff;
    padding-right: 4px;
    padding-left: 10px;
    z-index: 1 !important;
    width: auto;
    margin-bottom: 0;
    height: 25px;
    left: 4px
}

.reset-box-shadow:focus {
    border-color: var(--gray-400) !important;
    box-shadow: none !important;
    border-bottom: 1.5px solid var(--gray-400) !important;
    border-radius: 0
}

.form-group-line textarea.textarea-contact {
    border: 0;
    border-bottom: 1px solid #dedede;
    padding-left: 2.5px;
    font-size: 16.5px;
    line-height: 24px;
    margin-top: 6px
}

.btn-contact-us {
    background: var(--gray-400);
    color: #fff;
    font-family: Rubik-Regular, sans-serif;
    font-size: 18px;
    line-height: 24px;
    font-weight: 500;
    padding: 14px 24px;
    border-radius: 5px;
    letter-spacing: .5px;
    outline: 0;
    width: 100%;
    display: block;
    margin-top: 25px;
    margin-bottom: 15px
}

.btn-contact-us:hover {
    color: #fff;
    background: var(--gray-400);
    text-decoration: none;
    box-shadow: 0 1px 7px rgba(44, 155, 76, .25)
}

.btn-contact-us:focus {
    color: #fff;
    background: var(--gray-400);
    text-decoration: none;
    box-shadow: 0 1px 7px rgba(44, 155, 76, .25);
    outline: 0 !important
}

.contact-form,
.wrp-date-of-birth {
    width: auto;
    min-height: 48px;
    padding: 0 0 4.5px 0;
    font: normal 400 clamp(0.89rem, 0.183rem + 0.8837vw, 0.9375rem) var(--font-arial)
}

.contact-form {
    width: 100%
}

.floating-label-country {
    margin-top: -1.5px;
    height: 52px;
    position: relative;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial)
}

.floating-label-country label {
    color: #71716c;
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    position: absolute;
    pointer-events: none;
    left: -11px;
    top: 29px;
    transition: .2s ease all;
    -moz-transition: .2s ease all;
    -webkit-transition: .2s ease all;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial)
}

.floating-select-month:focus~label {
    top: 5px;
    pointer-events: none
}

.section-test-links {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    position: sticky;
    top: 78px;
    background: var(--white-trans-2);
    border: 1px solid #cf0000;
    border-radius: 6px;
    z-index: 9
}

.section-test-links ul {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row
}

.section-test-links ul li a {
    color: #cf0000;
    padding: 6px 10px
}

.floating-label-country>.form-select {
    border-radius: 0;
    border: 0;
    border-bottom: 1.5px solid #888;
    padding-left: 2.5px;
    padding-top: 18px;
    min-height: 52px;
    height: 52px;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial);
    color: var(--gray-900)
}

.floating-label-country>.form-select:focus {
    box-shadow: none !important
}

.floating-label-country>.form-select~label {
    transform: scale(.9) translateY(-.8rem) translateX(-.1rem)
}

.floating-select:focus~label,
.floating-select:not([value=""]):valid~label {
    font-size: 13.5px;
    pointer-events: none
}

.floating-select-month:focus~label,
.floating-select-month:not([value=""]):valid~label {
    top: 4px !important;
    left: -11px;
    color: #777;
    position: absolute;
    pointer-events: none !important
}

.contact-form label,
.wrp-date-of-birth label {
    margin-bottom: .5rem
}

.wrp-date-of-birth label span {
    color: #ec1c24
}

.contact-form input[type=text] {
    background: var(--white-one);
    width: 100%;
    height: 50px;
    padding: 12.5px 15px;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial);
    color: var(--gray-900);
    border: 1.5px solid var(--gray-300);
    border-radius: 5px
}

.contact-form input[type=text]:focus {
    box-shadow: 0 0 12px rgba(79, 79, 79, .08);
    border: 1.5px solid var(--gray-400);
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial)
}

.contact-form label span {
    color: #ec1c24
}

.contact-form .select2-container--default .select2-selection--single {
    height: 47px !important;
    border: 1px solid #aeaeae !important;
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #0160af;
    border-radius: 0
}

.contact-form .select2-container {
    width: 100% !important;
    display: block
}

.contact-form .select2-container--default .select2-selection--single {
    height: 47px !important;
    border: 1px solid #aeaeae !important;
    border-top: 1px solid #fff !important;
    border-left: 1px solid #fff !important;
    border-right: 1px solid #fff !important;
    border-bottom: 1.5px solid #888 !important;
    border-radius: 0;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial) !important
}

.maps-contact-desc {
    padding: 24px 0 24px 0;
    font: normal 500 clamp(0.875rem, 0.7448rem + 0.1628vw, 0.8838rem) var(--font-arial);
    color: var(--gray-800);
    letter-spacing: .18px
}

.maps-contact-desc h5 {
    margin-bottom: 14px;
    font: normal 600 clamp(0.91rem, 0.7186rem + 0.2991vw, 1.0775rem) var(--font-arial);
    line-height: 136%;
    color: var(--gray-950);
    letter-spacing: .24px
}

.maps-contact-desc p {
    margin-bottom: 8px
}

.contact-phone-whatsapp {
    width: 100%
}

.contact-phone-whatsapp {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    -ms-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.phone-whatasapp-dark {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    -ms-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    padding: 5px 0 6px 0
}

.contact-phone-whatsapp .containts-label {
    width: 98px
}

.contact-phone-whatsapp .containts-label p {
    margin-bottom: 0
}

.contact-phone-whatsapp .containts-label p::before {
    content: ":";
    font: normal 400 clamp(0.875rem, 0.7448rem + 0.1628vw, 0.8838rem) var(--font-arial);
    color: var(--gray-950);
    letter-spacing: .18px;
    position: absolute;
    right: 12px;
    left: unset;
    top: 8%
}

.contact-phone-whatsapp .conatains-link a {
    font: normal 400 clamp(0.875rem, 0.7448rem + 0.1628vw, 0.8838rem) var(--font-arial);
    color: var(--gray-950);
    letter-spacing: .18px;
    text-decoration: underline;
    margin-right: 1.5px
}

.form-contact-us {
    padding: 18px 0 48px 0
}

.section-detail-project {
    width: 100%;
    min-height: 536px
}

.special-case-gandaria {
    text-decoration: unset
}

.description-detail-project {
    width: 100%;
    min-height: 538px;
    display: flex;
    flex-wrap: wrap;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    margin-bottom: 68px;
    position: relative
}

#gandariacity {
    position: absolute;
    width: 100%;
    height: 18px;
    background: transparent none;
    left: 0;
    top: -94px
}

#gandariaheights {
    position: absolute;
    width: 100%;
    height: 18px;
    background: transparent none;
    left: 0;
    top: -94px
}

#gandaria-heights {
    position: absolute;
    width: 100%;
    height: 18px;
    background: transparent none;
    left: 0;
    top: -94px
}

#gandaria-8 {
    position: absolute;
    width: 100%;
    height: 18px;
    background: transparent none;
    left: 0;
    top: -94px
}

#gandariacity-mall {
    position: absolute;
    width: 100%;
    height: 18px;
    background: transparent none;
    left: 0;
    top: -94px
}

#gandaria-city-mall {
    position: absolute;
    width: 100%;
    height: 18px;
    background: transparent none;
    left: 0;
    top: -94px
}

#sheraton-grand-jakarta {
    position: absolute;
    width: 100%;
    height: 18px;
    background: transparent none;
    left: 0;
    top: -94px
}

.scale-detail-projects {
    width: 100%;
    height: auto
}

.description-detail-projects div {
    flex: 1;
    width: 100%
}

.title-of-projects {
    width: 100%;
    padding-top: 24px
}

.title-of-projects h1 {
    font: normal 600 clamp(1.1025rem, -8.758rem + 12.3256vw, 1.765rem) var(--font-spectral);
    color: var(--gray-950);
    margin-bottom: 36px;
    margin-bottom: 5.5px;
    line-height: 30px
}

.title-of-projects h2 {
    color: var(--gray-700);
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    letter-spacing: .2px;
    line-height: 16.64px;
    text-transform: capitalize;
    margin-bottom: 6.5px
}

.title-of-projects h4 {
    color: var(--gray-950);
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    letter-spacing: .2px;
    line-height: 16.64px;
    text-transform: capitalize;
    margin-bottom: 1.5px
}

.number-projects {
    width: 100%;
    border-top: 5px solid #385623;
    padding-top: 8px
}

.number-projects h3 {
    color: #385623;
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    letter-spacing: .2px;
    line-height: 16.64px;
    text-transform: normal;
    margin-bottom: 1.5px
}

.number-projects h2 {
    font: normal 600 clamp(1.6563rem, 0.2609rem + 1.7442vw, 1.75rem) var(--font-arial);
    color: #385623;
    margin-bottom: 0
}

.description-detail-projects {
    text-align: justify;
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    color: var(--gray-700);
    letter-spacing: .2px;
    line-height: 18.64px;
    margin-bottom: 14px;
    padding-top: 24px;
    padding-bottom: 4px
}

.catalog-projects-detail {
    width: 100%;
    min-height: 269px;
    overflow: hidden !important;
    background: var(--gray-200);
    padding-top: 24px
}

.catalog-projects-detail img {
    max-width: 100%
}

.other-related-projects {
    width: 100%;
    height: auto;
    padding: 32px 0 13.24px 0
}

.other-related-projects h2 {
    color: var(--gray-950);
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    letter-spacing: .2px;
    line-height: 16.64px;
    text-transform: capitalize;
    margin-bottom: 1.5px
}

.wrp-related-projects {
    position: relative;
    width: 100%;
    min-height: 186px;
    overflow: hidden !important
}

.wrp-related-projects a {
    text-decoration: none;
    outline: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    color: var(--gray-950);
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    letter-spacing: .2px;
    line-height: 16.64px;
    margin-bottom: 1.5px
}

.card-related-projects {
    width: 100%;
    min-height: 112px;
    max-height: 116px;
    overflow: hidden !important;
    background: var(--gray-200)
}

.card-related-projects img {
    max-width: 100%
}

.wrp-related-projects a img {
    transform: scale(1, 1);
    transition-property: all;
    transition-duration: .5s
}

.wrp-related-projects:hover a img {
    transform: scale(1.1, 1.1)
}

.title-related-projects {
    width: 100%;
    height: auto;
    padding: 15px 0 15px 0;
    margin-bottom: 24px
}

.title-related-projects h2 {
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    margin-bottom: 6.64px;
    letter-spacing: .05px;
    text-align: left;
    text-transform: normal
}

.card-project-detail {
    position: relative;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    background: var(--gray-200);
    margin-top: 24px;
    margin-bottom: 32px
}

.left-column-residential {
    flex: 0 0 auto;
    width: 17%;
    min-height: 64px;
    background: var(--white-one)
}

.center-column-residential {
    flex: 0 0 auto;
    width: 22%;
    min-height: 218px
}

.left-column-residential .thumb-of-projects a {
    min-height: 218px;
    cursor: default
}

.left-column-residential .thumb-of-projects a:hover .card-projects-thumb img {
    transform: none
}

.center-column-residential .thumb-of-projects a {
    min-height: 218px;
    cursor: default
}

.center-column-residential .thumb-of-projects a:hover .card-projects-thumb img {
    transform: none
}

.center-column-residential .thumb-of-projects a .card-projects-thumb {
    width: 100%;
    min-height: 218px
}

.right-column-residential {
    flex: 0 0 auto;
    width: 17%;
    min-height: 64px;
    background: var(--white-one)
}

.right-column-residential .thumb-of-projects a {
    min-height: 218px;
    cursor: default
}

.right-column-residential .thumb-of-projects a:hover .card-projects-thumb img {
    transform: none
}

.left-column-residential {
    min-height: 218px
}

.left-column-residential .thumb-of-projects a {
    min-height: 218px
}

.left-column-residential .thumb-of-projects a .card-projects-thumb {
    width: 100%;
    min-height: 218px
}

.right-column-residential {
    min-height: 218px
}

.right-column-residential .thumb-of-projects a {
    min-height: 218px
}

.right-column-residential .thumb-of-projects a .card-projects-thumb {
    width: 100%;
    min-height: 218px
}

.table-residential-housing {
    margin-top: 24px
}

.project-name-residential {
    width: 100%;
    height: auto;
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%
}

.project-name-residential h2 {
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%;
    margin-bottom: 1px
}

.project-name-residential h3 {
    font: normal 400 clamp(0.715rem, 0.051rem + 0.8637vw, 0.7925rem) var(--font-arial);
    color: var(--gray-700);
    letter-spacing: .04px;
    line-height: 18.64px;
    margin-bottom: 1px;
    display: none
}

.project-location-residential {
    width: 100%;
    height: auto;
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%
}

.project-location-residential h2 {
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%;
    margin-bottom: 1px
}

.project-location-residential h3 {
    font: normal 400 clamp(0.715rem, 0.051rem + 0.8637vw, 0.7925rem) var(--font-arial);
    color: var(--gray-700);
    letter-spacing: .04px;
    line-height: 18.64px;
    margin-bottom: 1px;
    display: none
}

.table-residential-housing thead tr th {
    font: normal 600 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%;
    margin-bottom: 1px;
    border-top: 6px solid #a84c1b
}

.table-residential-housing thead tr th:last-child {
    text-align: right
}

.table-residential-housing tbody tr td:last-child {
    text-align: right
}

.table.table-residential-housing thead tr th {
    border-bottom: 1px solid rgba(236, 181, 133, .76)
}

.table.table-residential-housing tbody tr:nth-child(24n-24) td {
    border-bottom: 1px solid rgba(236, 181, 133, .8)
}

.table.table-residential-housing tbody tr:nth-child(24n-23) td {
    border-bottom: 1px solid rgba(236, 181, 133, .84)
}

.table.table-residential-housing tbody tr:nth-child(24n-22) td {
    border-bottom: 1px solid rgba(236, 181, 133, .88)
}

.table.table-residential-housing tbody tr:nth-child(24n-21) td {
    border-bottom: 1px solid rgba(236, 181, 133, .92)
}

.table.table-residential-housing tbody tr:nth-child(24n-20) td {
    border-bottom: 1px solid rgba(236, 181, 133, .96)
}

.table.table-residential-housing tbody tr:nth-child(24n-19) td {
    border-bottom: 1px solid #ecb585
}

.table.table-residential-housing tbody tr:nth-child(24n-18) td {
    border-bottom: 1px solid #e0834b
}

.table.table-residential-housing tbody tr:nth-child(24n-17) td {
    border-bottom: 1px solid #df7c43
}

.table.table-residential-housing tbody tr:nth-child(24n-16) td {
    border-bottom: 1px solid #df7c43
}

.table.table-residential-housing tbody tr:nth-child(24n-15) td {
    border-bottom: 1px solid #df7c43
}

.table.table-residential-housing tbody tr:nth-child(24n-14) td {
    border-bottom: 1px solid #df7c43
}

.table.table-residential-housing tbody tr:nth-child(24n-13) td {
    border-bottom: 1px solid rgba(148, 58, 12, .64)
}

.table.table-residential-housing tbody tr:nth-child(24n-12) td {
    border-bottom: 1px solid rgba(148, 58, 12, .68)
}

.table.table-residential-housing tbody tr:nth-child(24n-11) td {
    border-bottom: 1px solid rgba(148, 58, 12, .72)
}

.table.table-residential-housing tbody tr:nth-child(24n-10) td {
    border-bottom: 1px solid rgba(148, 58, 12, .76)
}

.table.table-residential-housing tbody tr:nth-child(24n-9) td {
    border-bottom: 1px solid rgba(148, 58, 12, .8)
}

.table.table-residential-housing tbody tr:nth-child(24n-8) td {
    border-bottom: 1px solid rgba(148, 58, 12, .84)
}

.table.table-residential-housing tbody tr:nth-child(24n-7) td {
    border-bottom: 1px solid rgba(148, 58, 12, .88)
}

.table.table-residential-housing tbody tr:nth-child(24n-6) td {
    border-bottom: 1px solid rgba(148, 58, 12, .92)
}

.table.table-residential-housing tbody tr:nth-child(24n-5) td {
    border-bottom: 1px solid rgba(148, 58, 12, .96)
}

.table.table-residential-housing tbody tr:nth-child(24n-4) td {
    border-bottom: 1px solid #84340c
}

.table.table-residential-housing tbody tr:nth-child(24n-3) td {
    border-bottom: 1px solid #4e2512
}

.table.table-residential-housing tbody tr:nth-child(24n-2) td {
    border-bottom: 1px solid rgba(62, 29, 14, .92)
}

.table.table-residential-housing tbody tr:nth-child(24n-1) td {
    border-bottom: 1px solid #3e1d0e
}

.table.table-residential-housing tbody tr:last-child td {
    border-bottom: 1px solid #3e1d0e
}

.project-stories-residential {
    width: 100%;
    height: auto;
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%
}

.project-stories-residential h2 {
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%;
    margin-bottom: 1px
}

.project-stories-residential h3 {
    font: normal 400 clamp(0.715rem, 0.051rem + 0.8637vw, 0.7925rem) var(--font-arial);
    color: var(--gray-700);
    letter-spacing: .04px;
    line-height: 18.64px;
    margin-bottom: 1px;
    display: none
}

.psliderone {
    width: 100%;
    height: auto;
    min-height: 512px;
    max-height: 512px !important;
    background: #ddd
}

.slidespone {
    position: relative;
    width: 100%;
    min-height: 512px;
    max-height: 512px !important;
    overflow: hidden !important;
    overflow: hidden;
    background-repeat: no-repeat
}

.slidepone {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 2.5s ease-in-out, transform 8.64s ease-in-out;
    transform: scale(1);
    z-index: 1
}

.slidepone.active {
    opacity: 1;
    transform: scale(1.1);
    z-index: 3
}

.pslidertwo {
    width: 100%;
    height: auto;
    min-height: 512px;
    max-height: 512px !important;
    background: #ddd
}

.slidesptwo {
    position: relative;
    width: 100%;
    min-height: 512px;
    max-height: 512px !important;
    overflow: hidden !important;
    overflow: hidden;
    background-repeat: no-repeat
}

.slideptwo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 2s ease-in-out, transform 8.64s ease-in-out;
    transform: scale(1);
    z-index: 1
}

.slideptwo.active {
    opacity: 1;
    transform: scale(1.1);
    z-index: 3
}

.psliderthree {
    width: 100%;
    height: auto;
    min-height: 512px;
    max-height: 512px !important;
    background: #ddd
}

.slidespthree {
    position: relative;
    width: 100%;
    min-height: 512px;
    max-height: 512px !important;
    overflow: hidden !important;
    overflow: hidden;
    background-repeat: no-repeat
}

.slidepthree {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 2s ease-in-out, transform 8.64s ease-in-out;
    transform: scale(1);
    z-index: 1
}

.slidepthree.active {
    opacity: 1;
    transform: scale(1.1);
    z-index: 3
}

.psliderfourth {
    width: 100%;
    height: auto;
    min-height: 512px;
    max-height: 512px !important;
    background: #ddd
}

.slidespfourth {
    position: relative;
    width: 100%;
    min-height: 512px;
    max-height: 512px !important;
    overflow: hidden !important;
    overflow: hidden;
    background-repeat: no-repeat
}

.slidepfourth {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 2s ease-in-out, transform 8.64s ease-in-out;
    transform: scale(1);
    z-index: 1
}

.slidepfourth.active {
    opacity: 1;
    transform: scale(1.1);
    z-index: 3
}

.psliderfiveth {
    width: 100%;
    height: auto;
    min-height: 512px;
    max-height: 512px !important;
    background: #ddd
}

.slidespfiveth {
    position: relative;
    width: 100%;
    min-height: 512px;
    max-height: 512px !important;
    overflow: hidden !important;
    overflow: hidden;
    background-repeat: no-repeat
}

.slidepfiveth {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 2s ease-in-out, transform 8.64s ease-in-out;
    transform: scale(1);
    z-index: 1
}

.slidepfiveth.active {
    opacity: 1;
    transform: scale(1.1);
    z-index: 3
}

.projects-list {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    padding: 32px 0 42.5px 0
}

.projects-item-one {
    width: 27.64%;
    min-height: 364px;
    height: auto;
    position: relative;
    padding: 0 2.5px
}

.card-project-one {
    width: 100%;
    min-height: 364px;
    height: auto;
    position: relative;
    overflow: hidden
}

.card-project-one a {
    text-decoration: none;
    outline: 0;
    font: normal 400 clamp(0.8425rem, 0.3588rem + 0.6047vw, 0.875rem) var(--font-arial);
    color: var(--gray-100);
    margin-bottom: 0
}

.card-project-one a img {
    transform: scale(1, 1);
    transition-property: all;
    transition-duration: .5s
}

.card-project-one:hover a img {
    transform: scale(1.1, 1.1)
}

.card-project-collection {
    width: 100%;
    height: auto
}

.thumbnail-collection-projects {
    width: 100%;
    height: auto
}

.thumbnail-collection-projects img {
    max-width: 100%
}

.projects-item-two {
    width: 44.72%;
    min-height: 364px;
    height: auto;
    position: relative
}

.card-half-projects {
    width: 50%;
    padding: 0 0;
    position: relative;
    overflow: hidden;
    margin-top: 3px
}

.card-half-projects a {
    text-decoration: none;
    padding: 0 2.5px !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.card-half-projects a img {
    max-width: 100%
}

.card-half-image {
    position: relative;
    overflow: hidden
}

.card-half-projects a img {
    transform: scale(1, 1);
    transition-property: all;
    transition-duration: .5s
}

.card-half-projects:hover a img {
    transform: scale(1.1, 1.1)
}

.caption-title-projects {
    width: 100%;
    text-align: left;
    position: absolute;
    padding: 14px 15px;
    bottom: 0;
    left: 0;
    z-index: 3
}

.caption-title-projects h2 {
    color: var(--gray-100);
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    letter-spacing: .2px;
    line-height: 16.64px;
    text-transform: none;
    margin-bottom: 1.5px
}

.caption-title-projects h2 {
    color: var(--gray-100);
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    letter-spacing: .2px;
    line-height: 16.64px;
    text-transform: none;
    margin-bottom: 1.5px
}

.projects-list a:hover .caption-title-projects h2 {
    background: #541e04;
    background: linear-gradient(to top, #541e04 0, #84340c 16%, #943a0c 40%, #df7c43 57%, #e0834b 100%);
    background-clip: border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.card-project-two {
    width: 100%;
    min-height: 209px;
    height: auto;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between
}

.projects-item-two .card-project-two:last-child {
    margin-bottom: 5px
}

.projects-item-three {
    width: 27.64%;
    min-height: 364px;
    height: auto;
    position: relative;
    padding: 0 2.5px
}

.card-project-three {
    width: 100%;
    min-height: 364px;
    height: auto;
    position: relative;
    overflow: hidden
}

.card-project-three a img {
    transform: scale(1, 1);
    transition-property: all;
    transition-duration: .5s
}

.card-project-three:hover a img {
    transform: scale(1.1, 1.1)
}

.card-full-projects {
    width: 100%;
    padding: 0 0;
    position: relative;
    overflow: hidden
}

.card-full-projects a {
    text-decoration: none;
    padding: 0 2.5px !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.card-full-image {
    width: 100%;
    overflow: hidden;
    position: relative
}

.card-full-image::before {
    position: absolute;
    margin: 0 auto;
    content: " ";
    width: 102%;
    min-height: 98px;
    left: 0;
    bottom: 0;
    z-index: 1;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%)
}

.thumbnail-collection-projects::before {
    position: absolute;
    margin: 0 auto;
    content: " ";
    width: 102%;
    min-height: 98px;
    left: 0;
    bottom: 0;
    z-index: 1;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%)
}

.card-half-image::before {
    position: absolute;
    margin: 0 auto;
    content: " ";
    width: 102%;
    min-height: 98px;
    left: 0;
    bottom: 0;
    z-index: 1;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%)
}

.card-full-image img {
    max-width: 100%
}

.card-full-projects a img {
    transform: scale(1, 1);
    transition-property: all;
    transition-duration: .5s
}

.card-full-projects:hover a img {
    transform: scale(1.1, 1.1)
}

.thumb-of-projects {
    width: 100%;
    background: var(--gray-200);
    overflow: hidden;
    padding-top: 2.5px;
    padding-bottom: 2.5px
}

.thumb-of-projects a {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    min-height: 244px;
    height: auto;
    max-height: 257px;
    position: relative;
    height: auto;
    overflow: hidden
}

.card-projects-thumb::before {
    position: absolute;
    margin: 0 auto;
    content: " ";
    width: 102%;
    min-height: 98px;
    left: 0;
    bottom: 0;
    z-index: 1;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%)
}

.thumb-of-projects a:hover .card-projects-thumb::before {
    min-height: 106px;
    left: 0;
    bottom: 0;
    z-index: 1;
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .02) 9%, rgba(255, 255, 255, .01) 22%, rgba(255, 255, 255, .03) 24%, rgba(255, 255, 255, .19) 36%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, .78) 74%, rgba(255, 255, 255, .8) 100%);
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .02) 9%, rgba(255, 255, 255, .01) 22%, rgba(255, 255, 255, .03) 24%, rgba(255, 255, 255, .19) 36%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, .78) 74%, rgba(255, 255, 255, .8) 100%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .02) 9%, rgba(255, 255, 255, .01) 22%, rgba(255, 255, 255, .03) 24%, rgba(255, 255, 255, .19) 36%, rgba(255, 255, 255, .5) 60%, rgba(255, 255, 255, .78) 74%, rgba(255, 255, 255, .8) 100%)
}

.projects-list-residential .thumb-of-projects a:hover .card-projects-thumb::before {
    min-height: 106px;
    left: 0;
    bottom: 0;
    z-index: 1;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .02) 9%, rgba(0, 0, 0, .04) 22%, rgba(0, 0, 0, .1) 35%, rgba(0, 0, 0, .17) 47%, rgba(0, 0, 0, .24) 60%, rgba(0, 0, 0, .32) 74%, rgba(0, 0, 0, .56) 100%)
}

.thumb-of-projects a img {
    transform: scale(1, 1);
    transition-property: all;
    transition-duration: .5s
}

.thumb-of-projects:hover a img {
    transform: scale(1.1, 1.1)
}

.thumb-of-projects:hover a:hover .caption-title-projects h2 {
    background: #541e04;
    background: linear-gradient(to top, #541e04 0, #84340c 16%, #943a0c 40%, #df7c43 57%, #e0834b 100%);
    background-clip: border-box;
    background-clip: border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.card-projects-thumb {
    width: 100%;
    min-height: 244px
}

.card-projects-thumb img {
    max-width: 100%
}

.projects-list .row.gutter--p25 .col-lg-6.col-md-6 .thumb-of-projects a {
    max-height: 420px
}

.projects-list .row.gutter--p25 .col-lg-5.col-md-5 .thumb-of-projects a {
    max-height: 415px
}

.thumb-of-projects a:hover .card-projects-thumb img {
    transform: scale(1.1, 1.1)
}

.caption-title-projects {
    width: 100%;
    position: absolute;
    padding: 14px 15px
}

.caption-title-projects h2 {
    color: var(--gray-100);
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .2px;
    line-height: 16.64px;
    text-transform: none;
    margin-bottom: 1.5px
}

.section-about {
    width: 100%
}

.summary-about {
    max-width: 96%
}

.slick.aboutmarquee {
    text-decoration: none
}

.aboutmarquee {
    max-height: 254px;
    overflow: hidden
}

.summary-about h2 {
    font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-spectral);
    color: var(--gray-950);
    margin-bottom: 14px;
    line-height: 24px;
    padding-right: 30px
}

.section-about-image {
    width: 100%;
    height: auto;
    min-height: 246px;
    background: var(--white-one);
    padding: 15px 0 0 0
}

.card-head-about {
    width: 320px
}

.card-head-about img {
    max-width: 100%
}

.cover-image-head {
    width: 100%;
    height: auto;
    margin-bottom: 18px
}

.cover-image-head img {
    max-width: 100%;
    filter: grayscale(84%)
}

.desc-image-head {
    width: 100%;
    height: auto
}

.desc-image-head h3 {
    font: normal 600 clamp(0.91rem, 0.7186rem + 0.2991vw, 1.0775rem) var(--font-arial);
    color: var(--gray-950);
    letter-spacing: .32px;
    padding-right: 18px
}

.aboutmarquee .slick-slide {
    margin-left: 2px;
    margin-right: 2px;
    margin-left: 4px;
    margin-right: 4px
}

.section-president-message {
    padding-top: 20px
}

.containt-presiden-message {
    width: 100%;
    height: auto;
    padding: 10px 0 10px 0
}

.presiden-message {
    width: 100%;
    min-height: 224px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    background: #e1e0e0
}

.president-photos {
    width: 48%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: flex-end;
    -ms-align-items: flex-end;
    -moz-align-items: flex-end;
    -webkit-align-items: flex-end;
    padding-left: 48px;
    padding-right: 48px
}

.president-photos img {
    max-width: 100%
}

.message-text {
    width: 52%;
    padding-left: 76px;
    padding-right: 15px
}

.title-people {
    width: 100%
}

.title-people h3 {
    font: normal 400 clamp(0.8425rem, 0.3588rem + 0.6047vw, 0.875rem) var(--font-arial);
    color: var(--gray-900);
    margin-bottom: 0
}

.message-inner {
    width: 100%;
    position: relative;
    overflow: unset
}

.message-inner::before {
    content: " ";
    width: 18px;
    height: 18px;
    background: url(../images/svg/icon-quote.svg) top center no-repeat;
    background-size: 100%;
    position: absolute;
    left: -32px;
    top: 2px
}

.message-inner h3 {
    font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-spectral);
    color: var(--gray-950);
    margin-bottom: 14px;
    line-height: 24px;
    padding-right: 10px
}

.section-dynamic-text {
    padding: 10px 0 24px 0
}

.dynamic-content {
    padding: 15px 0 15px 0;
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%;
    color: var(--gray-700);
    letter-spacing: .2px;
    line-height: 18.64px
}

.dynamic-content p {
    margin-bottom: 0
}

.dynamic-content p:not(:last-child) {
    margin-bottom: 18px
}

.section-dynamic-text .dynamic-content {
    text-align: justify
}

.containt-presiden {
    width: 100%;
    min-height: 412px;
    background: #b9b9b7
}

.presiden-message-photo {
    width: 100%;
    min-height: 412px;
    position: relative
}

.presiden-message-photo img {
    max-width: 100%;
    object-fit: contain
}

.message-presiden {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    justify-content: flex-start;
    -ms-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    height: auto;
    min-height: 124px;
    position: absolute;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.content-caption-carousel {
    animation-name: sectionIntroStripe;
    animation-duration: 1.5s
}

@keyframes sectionIntroStripe {
    from {
        background-position: right -500%
    }

    to {
        background-position: right 0
    }
}

[data-aos=fade-down-small] {
    transform: translate3d(0, -12%, 0)
}

[data-aos=fade-down-small]:nth-child(4n-0).aos-animate {
    transition-delay: 0.5s
}

[data-aos=fade-down-small]:nth-child(4n-1).aos-animate {
    transition-delay: 0.4s
}

[data-aos=fade-down-small]:nth-child(4n-2).aos-animate {
    transition-delay: 0.3s
}

[data-aos=fade-down-small]:nth-child(4n-3).aos-animate {
    transition-delay: 0.conts
}

.row-card-people [data-aos=fade-down-small] {
    transform: translate3d(0, -12%, 0)
}

.row-card-people [data-aos=fade-down-small]:nth-child(4n-0).aos-animate {
    transition-delay: 10s
}

.row-card-people [data-aos=fade-down-small]:nth-child(6n-1).aos-animate {
    transition-delay: 0.5s
}

.row-card-people [data-aos=fade-down-small]:nth-child(6n-2).aos-animate {
    transition-delay: 0.4s
}

.row-card-people [data-aos=fade-down-small]:nth-child(6n-3).aos-animate {
    transition-delay: 0.3s
}

.row-card-people [data-aos=fade-down-small]:nth-child(6n-4).aos-animate {
    transition-delay: 0.2s
}

.row-card-people [data-aos=fade-down-small]:nth-child(6n-5).aos-animate {
    transition-delay: 0.1s
}

.section-cover-page {
    background: var(--white-one);
    width: 100%;
    min-height: 64px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.gutter--48.container,
.gutter--48.container-fluid,
.gutter--48.customized-container,
.gutter--48.row {
    margin-left: -48px;
    margin-right: -48px
}

.gutter--48>[class^=col-] {
    padding-left: 48px;
    padding-right: 48px
}

.gutter--45.container,
.gutter--45.container-fluid,
.gutter--45.customized-container,
.gutter--45.row {
    margin-left: -45px;
    margin-right: -45px
}

.gutter--45>[class^=col-] {
    padding-left: 45px;
    padding-right: 45px
}

.gutter--3.container,
.gutter--3.container-fluid,
.gutter--3.container.centered-container,
.gutter--3.customized-container,
.gutter--3.row {
    margin-left: -3px !important;
    margin-right: -3px !important
}

.gutter--3>[class^=col-] {
    padding-left: 3px !important;
    padding-right: 3px !important
}

.gutter--p25.container,
.gutter--p25.container-fluid,
.gutter--p25.container.centered-container,
.gutter--p25.customized-container,
.gutter--p25.row {
    margin-left: -2.5px !important;
    margin-right: -2.5px !important
}

.gutter--p25>[class^=col-] {
    padding-left: 2.5px !important;
    padding-right: 2.5px !important
}

.separate-border {
    border-right: 1px solid var(--gray-200)
}

.form-date-birth {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.sparator {
    width: 24px;
    text-align: center;
    padding: 4px 8px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.sparator p {
    margin-bottom: 0
}

.title-section-page h1 {
    font: normal 600 clamp(1.1025rem, -8.758rem + 12.3256vw, 1.765rem) var(--font-spectral);
    color: var(--gray-950);
    margin-bottom: 1px
}

.left-title-section {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    position: relative;
    top: -36px;
    margin-bottom: 15px
}

.left-title-section h1 {
    font: normal 600 clamp(1.1025rem, -8.758rem + 12.3256vw, 1.765rem) var(--font-spectral);
    color: var(--gray-950);
    margin-bottom: 1px
}

.wrp-fill-form {
    width: 100%;
    height: auto
}

.summary-form {
    width: 100%;
    height: auto;
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    color: var(--gray-700);
    letter-spacing: .2px;
    line-height: 18.64px
}

.summary-form p {
    margin-bottom: 6px
}

.form-career-page {
    padding-bottom: 24px;
    margin-bottom: 20px
}

.wrp-submit-cv {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    padding-top: 36px
}

#structural-design {
    position: absolute;
    background: transparent none;
    height: 12px;
    width: 100%;
    z-index: 1;
    top: -69px
}

#structural-assessment-retrofitting-design {
    position: absolute;
    background: transparent none;
    height: 12px;
    width: 100%;
    z-index: 1;
    top: -64px
}

#value-engineering {
    position: absolute;
    background: transparent none;
    height: 12px;
    width: 100%;
    z-index: 1;
    top: -65px
}

#structural-bim-detailing {
    position: absolute;
    background: transparent none;
    height: 12px;
    width: 100%;
    z-index: 1;
    top: -86px
}

#site-supervision {
    position: absolute;
    background: transparent none;
    height: 12px;
    width: 100%;
    z-index: 1;
    top: -69px
}

#concrete-technology-consulting {
    position: absolute;
    background: transparent none;
    height: 12px;
    width: 100%;
    z-index: 1;
    top: -68px
}

.form-contact-us .wrp-submit-cv {
    padding-top: 14px
}

.btn-md-submit {
    display: block;
    -webkit-appearance: none;
    background: #385623 !important;
    border-color: #385623 !important;
    color: #fff !important;
    font-size: 15.5px;
    padding: 14.5px 24px;
    border-radius: 3.4px;
    cursor: pointer;
    font: normal 400 clamp(0.89rem, 0.183rem + 0.8837vw, 0.9375rem) var(--font-arial);
    min-width: 100%;
    letter-spacing: .4px;
    margin-bottom: 5px;
    border-radius: 0
}

.carrer-form,
.wrp-date-of-birth {
    width: auto;
    min-height: 48px;
    padding: 9.64px 0;
    font: normal 400 clamp(0.89rem, 0.183rem + 0.8837vw, 0.9375rem) var(--font-arial)
}

.carrer-form label,
.wrp-date-of-birth label {
    margin-bottom: .5rem
}

.wrp-date-of-birth label span {
    color: #ec1c24
}

.carrer-form input[type=text] {
    background: var(--white-one);
    width: 100%;
    height: 50px;
    padding: 12.5px 15px;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial);
    color: var(--gray-900);
    border: 1.5px solid var(--gray-300);
    border-radius: 5px
}

.carrer-form input[type=text]:focus {
    box-shadow: 0 0 12px rgba(79, 79, 79, .08);
    border: 1.5px solid var(--gray-400);
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial)
}

.carrer-form label span {
    color: #ec1c24
}

.form-of-date {
    width: 30.14%
}

.form-of-date input[type=text] {
    background: var(--white-one);
    width: 100%;
    height: 50px;
    padding: 12.5px 15px;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial);
    color: var(--gray-900);
    border: 1.5px solid var(--gray-300)
}

.form-of-date input[type=text]:focus {
    box-shadow: 0 0 12px rgba(79, 79, 79, .08);
    border: 1.5px solid var(--gray-400);
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial)
}

.wrp-date-of-birth {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.select2-container .select2-selection--multiple {
    min-height: 44px !important;
    border: 1px solid #ced4da !important;
    border: 1px solid #ced4da;
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    height: auto;
    user-select: none;
    -webkit-user-select: none
}

.select2-container--default .select2-selection--multiple {
    background-color: #fff;
    border: 1px solid #aaa;
    border-radius: 4px
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    color: #797979;
    line-height: 30px;
    font-size: 14.5px;
    padding-left: 12px
}

.select2-container .select2-selection--multiple .select2-selection__rendered {
    display: block;
    padding-left: 8px;
    padding-right: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.select2-container .select2-search--inline .select2-search__field {
    margin-top: 4px
}

.select2-container--default .select2-selection--single {
    height: 50px !important;
    border: 1px solid #ced4da
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #aeaeae !important;
    font-size: 14.5px;
    line-height: 24px
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--gray-900);
    line-height: 46px;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial);
    padding-left: 1.5px;
    line-height: 48px
}

.contact-form .select2-container--default .select2-selection--single .select2-selection__rendered {
    margin-bottom: 56px
}

#inputCity {
    margin-top: 20px
}

.select2-container--default .select2-results__option[aria-selected=true] {
    color: #fff;
    background-color: var(--gray-900);
    padding-left: 12px
}

.select2-container--default .select2-results__option[aria-selected=false] {
    color: #797979;
    padding-left: 12px
}

.select2-container--default .select2-results__option[aria-selected=false]:hover {
    color: #4e4e4e;
    background-color: #f2f7fa;
    padding-left: 12px
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 10px;
    right: 10px
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered li {
    margin-bottom: 3px
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered li :last-child {
    margin-bottom: 3px !important
}

.wrp-f-radio {
    position: relative;
    padding-left: 48px;
    padding-right: 15px;
    color: #797979;
    font-size: 13.5px;
    line-height: 22px;
    font-weight: 400;
    letter-spacing: .1px;
    margin-top: 16.5px
}

.gender {
    font-size: 12px;
    color: #797979;
    margin-top: -8px;
    position: absolute
}

.wrp-f-radio p {
    font-size: 14.5px
}

.p-absolute {
    position: absolute;
    left: 9px;
    top: .5px
}

.pretty .state label::before {
    content: '';
    width: calc(1em + 8px);
    height: calc(1em + 8px)
}

.pretty .state label::after,
.pretty .state label::before {
    content: '';
    width: calc(1em + 8px);
    height: calc(1em + 8px)
}

.pretty.p-default input:checked~.state label::before {
    border: 1px solid #385623 !important
}

.pretty.p-default input:checked~.state label::after {
    background-color: #385623 !important;
    border: 1px solid #385623 !important
}

.label-form {
    height: auto
}

.label-form label {
    color: #385623;
    font-size: 18px;
    line-height: normal;
    margin-bottom: 20px
}

.check {
    display: block;
    position: relative;
    padding-left: 36px;
    margin-top: -24px;
    padding-right: 15px;
    cursor: pointer;
    font-size: 18px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    color: var(--gray-900)
}

.check input {
    position: absolute;
    opacity: 0;
    cursor: pointer
}

.checkmark {
    position: absolute;
    top: 3px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #fff;
    border-color: #385623;
    border-style: solid;
    border-width: 2px;
    border-radius: 2px
}

.check input:checked~.checkmark {
    background-color: #fff
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none
}

.check input:checked~.checkmark:after {
    display: block
}

.check .checkmark:after {
    left: 5px;
    top: 3px;
    width: 5px;
    height: 10px;
    border: solid;
    border-color: #385623;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.agreement-terms {
    margin-top: 56px;
    font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial);
    color: var(--gray-700);
    letter-spacing: .2px;
    line-height: 18.64px
}

.wrp-services-list {
    width: 100%;
    min-height: 94px;
    background: white;
    margin-bottom: 48px;
    margin-top: 24px
}

.title-services-list {
    width: 100%
}

.our-services-contents {
    cursor: auto
}

.title-services-list h2 {
    font: normal 600 clamp(1.1025rem, -8.758rem + 12.3256vw, 1.765rem) var(--font-spectral);
    color: var(--gray-950);
    margin-bottom: 1px;
    line-height: 114.24%
}

.card-services-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.card-services-list figure {
    margin-bottom: 0
}

.card-services-list img {
    max-width: 100%
}

.left-table-of-content {
    width: 100%;
    min-height: 124px;
    height: auto;
    top: 124px;
    position: sticky;
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%
}

.left-table-of-content ul {
    height: auto;
    padding-left: 0;
    position: relative;
    top: -40px
}

.left-table-of-content ul li {
    list-style: none;
    border-bottom: 1px solid var(--gray-200);
    padding: 11px 0;
    position: relative
}

.left-table-of-content ul li a {
    list-style: none;
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%;
    color: var(--gray-950);
    text-decoration: none;
    display: flex
}

.left-table-of-content ul li a.active {
    transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
    transition-duration: .6s;
    transition: all .4s;
    color: #e18750;
    background: #541e04;
    background: linear-gradient(to right, #541e04 0, #84340c 28%, #943a0c 51%, #df7c43 63%, #e0834b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background: #541e04;
    background: linear-gradient(to top, #541e04 0, #84340c 16%, #943a0c 40%, #df7c43 57%, #e0834b 100%);
    background-clip: border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.left-table-of-content ul li:hover a {
    transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
    transition-duration: .6s;
    transition: all .4s;
    color: #e18750;
    background: #541e04;
    background: linear-gradient(to right, #541e04 0, #84340c 28%, #943a0c 51%, #df7c43 63%, #e0834b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background: #541e04;
    background: linear-gradient(to top, #541e04 0, #84340c 16%, #943a0c 40%, #df7c43 57%, #e0834b 100%);
    background-clip: border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.left-table-of-content ul li a::before {
    opacity: 0;
    width: 2.6px;
    height: 0;
    position: absolute;
    right: 0;
    transform: translateY(24.64%);
    content: "";
    background: #fff;
    background: linear-gradient(to bottom, #e18750 0, #df7d44 23%, #cc6b35 46%, #9b4011 66%, #82330c 77%, #7a310d 84%, #582005 93%, #4c1a02 100%);
    transition: all .4s
}

.left-table-of-content ul li a:hover::before {
    opacity: 1;
    width: 2.6px;
    height: 93%;
    top: -4px;
    position: absolute;
    right: 0;
    transform: translateY(13.64%);
    content: "";
    background: #541e04;
    background: linear-gradient(to bottom, #e18750 0, #df7d44 23%, #cc6b35 46%, #9b4011 66%, #82330c 77%, #7a310d 84%, #582005 93%, #4c1a02 100%);
    transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
    transition-duration: .9s;
    transition: all .4s
}

.left-table-of-content ul li.anchor.active {
    transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
    transition-duration: .6s;
    transition: all .4s;
    color: #e18750;
    background: #541e04;
    background: linear-gradient(to right, #541e04 0, #84340c 28%, #943a0c 51%, #df7c43 63%, #e0834b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background: #541e04;
    background: linear-gradient(to top, #541e04 0, #84340c 16%, #943a0c 40%, #df7c43 57%, #e0834b 100%);
    background-clip: border-box;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.left-table-of-content ul li a.anchor.active::before {
    opacity: 1;
    width: 2.6px;
    height: 93%;
    top: -4px;
    position: absolute;
    right: 0;
    transform: translateY(13.64%);
    content: "";
    background: #541e04;
    background: linear-gradient(to bottom, #e18750 0, #df7d44 23%, #cc6b35 46%, #9b4011 66%, #82330c 77%, #7a310d 84%, #582005 93%, #4c1a02 100%);
    transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
    transition-duration: .9s;
    transition: all .4s
}

.scrollbar {
    display: none;
    position: fixed;
    left: 360px;
    top: calc(23.24% - 10vh);
    height: 350px;
    width: 2px;
    border-radius: 2px;
    background: #a94242
}

.scrollbar .scrollball {
    display: none;
    width: 10px;
    height: 40.5px;
    border-radius: 5px;
    left: -4px;
    position: absolute;
    background: #000
}

.scrollbar .scrollball span {
    position: absolute;
    left: 15px;
    top: -4px
}

.desc-ssi-choosed {
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%;
    color: var(--gray-700);
    padding-right: 32px;
    position: relative
}

#care {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -186%;
    z-index: 2
}

#experienced {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -289%;
    z-index: 2
}

#innovative {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -303%;
    z-index: 2
}

#reliable {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -308%;
    z-index: 2
}

#widenetwork {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -311%;
    z-index: 2
}

#wide-networking {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -311%;
    z-index: 2
}

#understandingkh {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -289%;
    z-index: 2
}

#understanding-know-how {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -289%;
    z-index: 2
}

#optimumstructuraldesign {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -299%;
    z-index: 2
}

#optimum-structural-design {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -299%;
    z-index: 2
}

#comprehensivedetailed {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -211%;
    z-index: 2
}

#comprehensive-detailed-and-constructible-designs {
    background: transparent none;
    height: 376px;
    width: 100%;
    position: absolute;
    top: -211%;
    z-index: 2
}

.item-list-choosed {
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%;
    color: var(--gray-700);
    min-height: 64px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.item-list-choosed ul {
    padding-left: 36px
}

.item-list-choosed ul li {
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%;
    position: relative;
    list-style: none
}

.item-list-choosed ul li p {
    font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial);
    letter-spacing: .14px;
    line-height: 124%
}

.item-list-choosed ul li::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 4px;
    background: url(../images/checklist.png) no-repeat;
    background-size: auto;
    width: 24px;
    height: 24px;
    background-size: cover;
    z-index: 1;
    left: -35px;
    top: 2.5px
}

.desc-ssi-choosed h2 {
    margin-bottom: 14px;
    font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-arial);
    line-height: 136%;
    color: var(--gray-950)
}

.img-choosed-icon {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    -ms-justify-content: center;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    min-height: 124px;
    position: relative
}

.img-choosed-icon::before {
    content: '';
    background: #cf0000;
    background: linear-gradient(45deg, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0) 0, rgba(255, 136, 0, .46) 100%);
    opacity: .5;
    position: absolute;
    left: 0;
    top: -33.24%;
    transform: rotate(45deg);
    width: 200px;
    height: 200px;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0
}

.row-choosed-services {
    min-height: 486px;
    padding-top: 48px;
    padding-bottom: 48px;
    margin-bottom: 32px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.img-choosed-icon::after {
    content: '';
    opacity: .5;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%) rotate(-45deg);
    -ms-transform: translateY(-50%) rotate(-45deg);
    transform: translateY(-50%) rotate(-45deg);
    width: 200px;
    height: 200px;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0
}

.choosed-icon {
    width: 124px;
    height: auto;
    top: 0;
    position: relative
}

.choosed-icon img {
    max-width: 100%
}

.choosed-icon svg {
    max-width: 100%
}

.photo-choosed-ssi {
    position: relative;
    width: 100%;
    padding-left: 15px;
    max-height: 405px;
    overflow: hidden
}

.img-choosed-icon img {
    max-width: 100%
}

.footer {
    width: 100%;
    height: auto;
    min-height: 124px;
    padding: 34px 0 0 0;
    background-color: #0e1a10;
    background-image: radial-gradient(at 100% 27%, #101d11 0, transparent 50%), radial-gradient(at 0 100%, #0e1a10 0, transparent 50%), radial-gradient(at 80% 100%, #0e1a10 0, transparent 50%), radial-gradient(at 93% 0, #101d11 0, transparent 50%);
    overflow: hidden;
    position: relative
}

.footer::before {
    content: "";
    width: 524px;
    height: 314px;
    background: url('../images/footer-background-texture_1_1.png') no-repeat top center;
    position: absolute;
    right: 0;
    top: -15px;
    z-index: 2
}

.footer-row-one {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    align-items: flex-start;
    -ms-align-items: flex-start;
    -moz-align-items: flex-start;
    -webkit-align-items: flex-start;
    padding: 24px 0 37px 0;
    position: relative;
    z-index: 3
}

.left-col-footer {
    width: 31.86%;
    height: auto;
    position: relative;
    font: normal 500 clamp(0.875rem, 0.7448rem + 0.1628vw, 0.8838rem) var(--font-arial);
    color: var(--gray-100);
    letter-spacing: .18px;
    padding-right: 32px
}

.left-col-footer p {
    margin-bottom: 12px
}

.left-col-footer h5 {
    margin-bottom: 18px;
    font: normal 600 clamp(0.91rem, 0.7186rem + 0.2991vw, 1.0775rem) var(--font-arial);
    line-height: 136%;
    color: var(--white-one);
    letter-spacing: .24px
}

.center-col-footer {
    width: 31.24%;
    height: auto;
    position: relative;
    font: normal 500 clamp(0.7575rem, 0.3482rem + 0.5116vw, 0.785rem) var(--font-arial);
    color: var(--gray-100);
    letter-spacing: .18px;
    margin-bottom: 1px
}

.frame-maps-griya {
    width: 100%;
    min-height: 224px
}

.phone-whatasapp {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    -ms-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center
}

.containts-label {
    width: 98px
}

.containts-label p {
    margin-bottom: 0;
    position: relative
}

.containts-label p::before {
    content: ":";
    font: normal 400 clamp(0.875rem, 0.7448rem + 0.1628vw, 0.8838rem) var(--font-arial);
    color: var(--gray-100);
    letter-spacing: .18px;
    position: absolute;
    right: 12px;
    left: unset;
    top: 8%
}

.conatains-link {
    width: auto
}

.conatains-link a {
    font: normal 400 clamp(0.875rem, 0.7448rem + 0.1628vw, 0.8838rem) var(--font-arial);
    color: var(--gray-100);
    letter-spacing: .18px;
    text-decoration: underline;
    margin-right: 1.5px
}

.left-col-footer .w-100:nth-child(2) .contain-contacts {
    width: 100%;
    padding: 8px 0 6.6px 0
}

.left-col-footer .w-100:nth-child(3) .contain-contacts {
    padding: 13px 0 9px 0
}

.left-col-footer .w-100:last-child .contain-contacts {
    padding: 10px 0 10px 0
}

.right-col-footer {
    padding-left: 48px;
    width: 34.98%;
    min-height: 222.5px;
    position: relative;
    font: normal 500 clamp(0.7575rem, 0.3482rem + 0.5116vw, 0.785rem) var(--font-arial);
    color: var(--gray-100);
    letter-spacing: .18px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    flex-wrap: wrap;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    -ms-justify-content: space-between;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between
}

.right-col-footer .row {
    width: 100%;
    height: auto !important
}

.right-col-footer .row .col-lg-6.col-md-6.col-sm-12 {
    height: 60px !important
}

.right-col-footer .row .col-12 {
    height: 34px !important
}

.right-col-footer .row:first-child {
    height: 190.5px !important
}

.right-col-footer .row:last-child {
    height: 33px !important
}

.right-col-footer ul {
    padding-left: 0
}

.right-col-footer ul li {
    list-style: none
}

.right-col-footer ul li a {
    text-decoration: none;
    outline: 0;
    font: normal 500 clamp(0.875rem, 0.7448rem + 0.1628vw, 0.8838rem) var(--font-arial);
    color: var(--gray-100);
    letter-spacing: .2px;
    padding: 9.86px 0;
    display: flex
}

.item-copyright-music {
    width: 100%;
    height: auto;
    font: normal 500 clamp(0.875rem, 0.7448rem + 0.1628vw, 0.8838rem) var(--font-arial)
}

.item-copyright-music p {
    margin-bottom: 0
}

.footer-row-two {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    -ms-justify-content: flex-end;
    -moz-justify-content: flex-end;
    -webkit-justify-content: flex-end;
    align-items: center;
    -ms-align-items: center;
    -moz-align-items: center;
    -webkit-align-items: center;
    border-top: 1px solid #819474;
    padding: 14px 0 10px 0
}

.item-nav-footer li:first-child a {
    padding-top: 0
}

.footer-copyright {
    font: normal 400 clamp(0.7225rem, 0.3132rem + 0.5116vw, 0.75rem) var(--font-arial);
    color: var(--white-one);
    letter-spacing: .24px;
    width: auto;
    padding-right: 15px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    -ms-justify-content: flex-end;
    -moz-justify-content: flex-end;
    -webkit-justify-content: flex-end
}

.footer-copyright p {
    margin-bottom: 1.5px
}

.footer-logo {
    width: 20px;
    min-height: 20px
}

.footer-logo svg {
    max-width: 100%
}

.footer-logo svg path.st0 {
    fill: var(--white-one)
}

.select2-container--default .select2-selection--single .select2-selection__rendered+label {
    transform: translateY(-100%);
    color: inherit
}

.contact-form .select2-container+label {
    position: absolute;
    top: 0;
    left: 0;
    padding: 5px;
    transition: transform .2s ease;
    color: #999;
    pointer-events: none
}

.contact-form .select2-container--default .select2-selection--single .select2-selection__rendered+label {
    transform: translateY(-100%)
}

.contact-form .input-wrapper {
    padding-top: 30px
}

.contact-form.selection {
    position: relative
}

.contact-form.selection label {
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial);
    color: #b6b6b8;
    position: absolute;
    z-index: 1;
    top: 49%;
    transform: translateY(-50%);
    transition: all .2s ease 0s
}

.contact-form.selection label.selected {
    top: 1px;
    left: 0;
    font: normal 400 clamp(0.8275rem, 0.4554rem + 0.4651vw, 0.8525rem) var(--font-arial);
    transform: translateY(0);
    color: #777
}

@media only screen and (min-width:1681px) and (max-width:1919px) {
    .navbar-desc {
        width: 100%;
        min-height: 76px
    }

    .logo-brand {
        width: 286px
    }

    .centered-container {
        max-width: 1440px;
        margin: 0 auto;
        margin-right: auto;
        margin-left: auto;
        margin-right: auto;
        margin-left: auto
    }

    .wrp-nav-item {
        min-width: 498px;
        width: auto
    }

    .navbar-align-right ul li {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .navbar-align-right ul li a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .text-parent {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .navbar-align-right ul li:hover .text-parent {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .navbar-align-right ul li:hover .text-parent {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .navbar-align-right ul li.dropdown-hover ul li a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .card-services-desc {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .card-home-projects {
        min-height: 466px;
        max-height: 466px
    }

    .wrp-card-people {
        width: 18.86%
    }

    .card-photo-people {
        width: 100%;
        min-height: 324px;
        max-height: 324px;
        overflow: hidden;
        margin-bottom: 23px;
        margin-bottom: 20px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        align-items: center;
        -ms-align-items: center;
        -moz-align-items: center;
        -webkit-align-items: center
    }

    .slick.marquee .slick-slide .inner {
        margin-left: 12px;
        margin-right: 12px;
        padding-left: 16px;
        padding-right: 16px;
        width: 216px
    }

    .slick.marquee .slick-slide .inner img {
        max-width: 105%
    }

    .row-grid .column-gallery:nth-child(3) .card-project-case:first-child {
        min-height: 363px;
        max-height: 363px !important
    }

    @-moz-document url-prefix() {
        #scroll-down {
            padding-top: 24px
        }
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -196px
    }

    .row-grid .column-gallery:nth-child(3) .card-project-case:nth-child(2) {
        min-height: 412px;
        max-height: 412px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(2) .card-project-case:first-child,
    .row-grid .column-gallery:nth-child(5) .card-project-case:first-child {
        min-height: 424px;
        max-height: 424px !important
    }

    .wslider-two {
        min-height: 424px;
        max-height: 424px !important
    }

    .slidesv-two {
        min-height: 424px;
        max-height: 424px !important
    }

    .row-grid .column-gallery:nth-child(2) .card-project-case:nth-child(2),
    .row-grid .column-gallery:nth-child(5) .card-project-case:nth-child(2) {
        min-height: 351px;
        max-height: 351px !important
    }

    .section-hero-images {
        margin-top: 2px
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(1),
    .row-grid .column-gallery:nth-child(4) .card-project-case:first-child {
        min-height: 300px;
        max-height: 300px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(2),
    .row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(2) {
        min-height: 238px;
        max-height: 238px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(3),
    .row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(3) {
        min-height: 230.5px;
        max-height: 230.5px !important;
        overflow: hidden !important
    }

    .title-section-home h2 {
        font: normal 600 clamp(1.79rem, 1.79rem + 0vw, 1.79rem) var(--font-spectral);
        color: var(--gray-950);
        margin-bottom: 44px
    }

    .content-biography p {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial);
        line-height: 22.24px;
        margin-bottom: 15px
    }

    .button-dialog-socmed-outline a {
        text-decoration: none !important;
        outline: 0;
        width: 186.5px
    }

    #modalseePeople2 .modal-dialog-people {
        max-width: 914px;
        margin-top: 114px
    }

    #modalseePeople .modal-dialog-people {
        max-width: 914px;
        margin-top: 114px
    }

    #modalseePeople1 .modal-dialog-people {
        max-width: 914px;
        margin-top: 114px
    }

    .chevron-down {
        width: 14px;
        height: 14px;
        padding: 2px 2px;
        margin-top: -8.6px
    }

    .side-left-people {
        max-width: 28%;
        flex: 0 0 28%;
        -ms-flex: 0 0 28%;
        height: 100vh;
        background: transparent none;
        padding-right: 15px
    }

    .side-right-people {
        display: flex;
        flex-wrap: wrap;
        max-width: 72%;
        flex: 0 0 72%;
        -ms-flex: 0 0 72%
    }

    .people-name-home h2 {
        font: normal 600 clamp(1.125rem, 0.5297rem + 0.7442vw, 1.165rem) var(--font-arial);
        margin-bottom: 6.64px;
        letter-spacing: .05px;
        text-align: left
    }

    .desc-people-home {
        display: -webkit-box;
        -webkit-line-clamp: 8;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        height: 155px;
        padding-bottom: 6px;
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .dynamic-content {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .description-detail-projects {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial);
        letter-spacing: .14px;
        line-height: 124%
    }

    .title-of-projects h2 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .title-of-projects h4 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .other-related-projects h2 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .number-projects h3 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial);
        letter-spacing: .14px;
        line-height: 124%
    }

    .title-related-projects h2 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .slidesp {
        min-height: 576px;
        max-height: 576px !important
    }

    .description-detail-project {
        min-height: 606px;
        margin-bottom: 78px
    }

    .footer {
        -webkit-animation: both
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.1025rem, -8.758rem + 12.3256vw, 1.765rem) var(--font-spectral)
    }

    .right-col-footer ul li a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .projects-list {
        padding: 32px 0 48.5px 0
    }

    .left-col-footer {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .containts-label {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .conatains-link a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial);
        text-decoration: underline
    }

    .caption-title-projects h2 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .contain-contacts {
        width: 100%;
        padding: 8.5px 0
    }

    .services-items {
        padding: 44px 42px 15px 42px
    }

    .services-items:hover {
        z-index: 3;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        transition: .46s ease-in-out;
        -webkit-transition: .46s ease-in-out;
        -moz-transition: .46s ease-in-out;
        padding: 44px 42px 15px 42px
    }

    .services-items a {
        min-height: 594px
    }

    .card-services-images figure {
        min-height: 389px;
        max-height: 389px;
        margin-top: 6px;
        overflow: hidden
    }

    .card-services-images img {
        max-width: 105%
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 15px;
        width: 100%;
        z-index: 1;
        top: -176px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -250px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -219px
    }

    .section-home-services {
        padding: 56px 0 60px 0
    }

    .section-projects-home {
        width: 100%;
        padding: 26px 0 56px 0
    }

    .section-home-clients {
        padding: 66px 0 62px 0
    }

    .footer-row-one {
        padding: 34px 0 28px 0
    }

    .desc-ssi-choosed {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .photo-choosed-ssi {
        min-height: 574px
    }

    .item-list-choosed {
        min-height: 572px
    }

    .left-table-of-content ul li a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .desc-ssi-choosed p {
        margin-bottom: 25px
    }

    .item-list-choosed ul li p {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .item-list-choosed ul {
        padding-left: 40px
    }

    .item-list-choosed ul li::before {
        left: -38px;
        width: 28px;
        height: 28px
    }

    .maps-contact-desc {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .contact-phone-whatsapp .conatains-link a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .item-copyright-music {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .footer-copyright {
        font: normal 400 clamp(0.8125rem, 0.2172rem + 0.7442vw, 0.8525rem) var(--font-arial)
    }

    .right-col-footer .row:first-child {
        height: 186.5px !important
    }

    .card-related-projects {
        width: 100%;
        min-height: 143px;
        max-height: 146px
    }

    .column-gallery.height-full {
        flex: 0 0 1;
        flex-direction: column;
        display: flex;
        width: 100%;
        height: calc(100vh - 146px);
        overflow: hidden
    }

    .slidespone {
        position: relative;
        width: 100%;
        min-height: 576px;
        max-height: 576px !important
    }

    .slidesptwo {
        position: relative;
        width: 100%;
        min-height: 576px;
        max-height: 576px !important;
        margin-bottom: 56px
    }

    .slidespthree {
        position: relative;
        width: 100%;
        min-height: 576px;
        max-height: 576px !important;
        margin-bottom: 56px
    }

    .slidespfourth {
        position: relative;
        width: 100%;
        min-height: 576px;
        max-height: 576px !important;
        margin-bottom: 56px
    }

    .slidespfiveth {
        position: relative;
        width: 100%;
        min-height: 576px;
        max-height: 576px !important;
        margin-bottom: 56px
    }

    .thumb-of-projects a {
        min-height: 312px;
        max-height: 332px
    }

    .section-home-people {
        width: 100%;
        padding: 89px 0 98px 0
    }

    .navbar-align-right ul li:first-child {
        min-width: 138.5px;
        max-width: 138.5px
    }

    .navbar-align-right ul li:nth-child(2) {
        min-width: 134.5px;
        max-width: 134.5px
    }

    .navbar-align-right ul li:nth-child(3) {
        min-width: 148.5px;
        max-width: 148.5px
    }

    .navbar-align-right ul li:nth-child(4) {
        min-width: 121.5px;
        max-width: 121.5px
    }

    .navbar-align-right ul li:hover .text-parent {
        font: normal 600 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }
}

@media only screen and (min-width:1660px) and (max-width:1680px) {
    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -186px
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -186px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -186px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -186px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -186px
    }
}

@media only screen and (min-width:1920px) and (max-width:1920px) {
    .column-gallery.height-full {
        flex: 0 0 1;
        flex-direction: column;
        display: flex;
        width: 100%;
        height: calc(100vh - 145px);
        overflow: hidden;
        padding: 4px 1px
    }

    .navbar-desc {
        width: 100%;
        min-height: 76px
    }

    .logo-brand {
        width: 286px
    }

    .centered-container {
        max-width: 1440px;
        margin: 0 auto;
        margin-right: auto;
        margin-left: auto;
        margin-right: auto;
        margin-left: auto
    }

    .wrp-nav-item {
        min-width: 562px;
        width: auto
    }

    .navbar-align-right ul li {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .navbar-align-right ul li a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .text-parent {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .navbar-align-right ul li:hover .text-parent {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .navbar-align-right ul li:hover .text-parent {
        font: normal 600 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .navbar-align-right ul li.dropdown-hover ul li a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .card-services-desc {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .navbar-align-right ul li:first-child {
        min-width: 149.5px;
        max-width: 149.5px
    }

    .navbar-align-right ul li:nth-child(2) {
        min-width: 145.5px;
        max-width: 145.5px
    }

    .navbar-align-right ul li:nth-child(3) {
        min-width: 156.5px;
        max-width: 156.5px
    }

    .navbar-align-right ul li:nth-child(4) {
        min-width: 120.5px;
        max-width: 120.5px
    }

    .navbar-align-right ul li.dropdown-hover ul li {
        min-width: 100%;
        width: 100%
    }

    .card-home-projects {
        min-height: 466px;
        max-height: 466px
    }

    .wrp-card-people {
        width: 18.86%
    }

    .card-photo-people {
        width: 100%;
        min-height: 324px;
        max-height: 324px;
        overflow: hidden;
        margin-bottom: 23px;
        margin-bottom: 20px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        align-items: center;
        -ms-align-items: center;
        -moz-align-items: center;
        -webkit-align-items: center
    }

    .slick.marquee .slick-slide .inner {
        margin-left: 12px;
        margin-right: 12px;
        padding-left: 16px;
        padding-right: 16px;
        width: 216px
    }

    .slick.marquee .slick-slide .inner img {
        max-width: 105%
    }

    .row-grid .column-gallery:nth-child(3) .card-project-case:first-child {
        min-height: 363px;
        max-height: 363px !important
    }

    @-moz-document url-prefix() {
        #scroll-down {
            padding-top: 24px
        }
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -196px
    }

    .row-grid .column-gallery:nth-child(3) .card-project-case:nth-child(2) {
        min-height: 412px;
        max-height: 412px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(2) .card-project-case:first-child,
    .row-grid .column-gallery:nth-child(5) .card-project-case:first-child {
        min-height: 424px;
        max-height: 424px !important
    }

    .wslider-two {
        min-height: 424px;
        max-height: 424px !important
    }

    .slidesv-two {
        min-height: 424px;
        max-height: 424px !important
    }

    .row-grid .column-gallery:nth-child(2) .card-project-case:nth-child(2),
    .row-grid .column-gallery:nth-child(5) .card-project-case:nth-child(2) {
        min-height: 351px;
        max-height: 351px !important
    }

    .section-hero-images {
        margin-top: 2px
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(1),
    .row-grid .column-gallery:nth-child(4) .card-project-case:first-child {
        min-height: 300px;
        max-height: 300px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(2),
    .row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(2) {
        min-height: 238px;
        max-height: 238px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(3),
    .row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(3) {
        min-height: 230.5px;
        max-height: 230.5px !important;
        overflow: hidden !important
    }

    .title-section-home h2 {
        font: normal 600 clamp(1.79rem, 1.79rem + 0vw, 1.79rem) var(--font-spectral);
        color: var(--gray-950);
        margin-bottom: 44px
    }

    .content-biography p {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial);
        line-height: 22.24px;
        margin-bottom: 15px
    }

    .button-dialog-socmed-outline a {
        text-decoration: none !important;
        outline: 0;
        width: 186.5px
    }

    #modalseePeople2 .modal-dialog-people {
        max-width: 914px;
        margin-top: 114px
    }

    #modalseePeople .modal-dialog-people {
        max-width: 914px;
        margin-top: 114px
    }

    .chevron-down {
        width: 14px;
        height: 14px;
        padding: 2px 2px;
        margin-top: -8.6px
    }

    .side-left-people {
        max-width: 28%;
        flex: 0 0 28%;
        -ms-flex: 0 0 28%;
        height: 100vh;
        background: transparent none;
        padding-right: 15px
    }

    .side-right-people {
        display: flex;
        flex-wrap: wrap;
        max-width: 72%;
        flex: 0 0 72%;
        -ms-flex: 0 0 72%
    }

    .people-name-home h2 {
        font: normal 600 clamp(1.125rem, 0.5297rem + 0.7442vw, 1.165rem) var(--font-arial);
        margin-bottom: 6.64px;
        letter-spacing: .05px;
        text-align: left
    }

    .desc-people-home {
        display: -webkit-box;
        -webkit-line-clamp: 8;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        height: 155px;
        padding-bottom: 6px;
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .dynamic-content {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .description-detail-projects {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial);
        letter-spacing: .14px;
        line-height: 124%
    }

    .title-of-projects h2 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .title-of-projects h4 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .other-related-projects h2 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .number-projects h3 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial);
        letter-spacing: .14px;
        line-height: 124%
    }

    .title-related-projects h2 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .slidesp {
        min-height: 576px;
        max-height: 576px !important
    }

    .description-detail-project {
        min-height: 606px;
        margin-bottom: 78px
    }

    .footer {
        padding: 25px 0 0 0
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.1025rem, -8.758rem + 12.3256vw, 1.765rem) var(--font-spectral)
    }

    .right-col-footer ul li a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .projects-list {
        padding: 32px 0 48.5px 0
    }

    .left-col-footer {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .containts-label {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .conatains-link a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial);
        text-decoration: underline
    }

    .caption-title-projects h2 {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .contain-contacts {
        width: 100%;
        padding: 8.5px 0
    }

    .services-items {
        padding: 44px 42px 15px 42px
    }

    .services-items:hover {
        z-index: 3;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        transition: .46s ease-in-out;
        -webkit-transition: .46s ease-in-out;
        -moz-transition: .46s ease-in-out;
        padding: 44px 42px 15px 42px
    }

    .services-items a {
        min-height: 594px
    }

    .card-services-images figure {
        min-height: 389px;
        max-height: 389px;
        margin-top: 6px;
        overflow: hidden
    }

    .card-services-images img {
        max-width: 105%
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 15px;
        width: 100%;
        z-index: 1;
        top: -176px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -250px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -219px
    }

    .section-home-services {
        padding: 56px 0 60px 0
    }

    .section-projects-home {
        width: 100%;
        padding: 26px 0 56px 0
    }

    .section-home-clients {
        padding: 66px 0 62px 0
    }

    .footer-row-one {
        padding: 34px 0 37px 0
    }

    .desc-ssi-choosed {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .photo-choosed-ssi {
        min-height: 574px
    }

    .item-list-choosed {
        min-height: 24px
    }

    .left-table-of-content ul li a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .desc-ssi-choosed p {
        margin-bottom: 25px
    }

    .item-list-choosed ul li p {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .item-list-choosed ul {
        padding-left: 40px
    }

    .item-list-choosed ul li::before {
        left: -38px;
        width: 28px;
        height: 28px
    }

    .maps-contact-desc {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .contact-phone-whatsapp .conatains-link a {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .item-copyright-music {
        font: normal 400 clamp(0.9775rem, 0.8014rem + 0.178vw, 1.015rem) var(--font-arial)
    }

    .footer-copyright {
        font: normal 400 clamp(0.8125rem, 0.2172rem + 0.7442vw, 0.8525rem) var(--font-arial)
    }

    .right-col-footer .row:first-child {
        height: 186.5px !important
    }

    .card-related-projects {
        width: 100%;
        min-height: 143px;
        max-height: 146px
    }

    .slidespone {
        position: relative;
        width: 100%;
        min-height: 576px;
        max-height: 576px !important
    }

    .slidesptwo {
        position: relative;
        width: 100%;
        min-height: 576px;
        max-height: 576px !important;
        margin-bottom: 56px
    }

    .slidespthree {
        position: relative;
        width: 100%;
        min-height: 576px;
        max-height: 576px !important;
        margin-bottom: 56px
    }

    .slidespfourth {
        position: relative;
        width: 100%;
        min-height: 576px;
        max-height: 576px !important;
        margin-bottom: 56px
    }

    .slidespfiveth {
        position: relative;
        width: 100%;
        min-height: 576px;
        max-height: 576px !important;
        margin-bottom: 56px
    }

    .thumb-of-projects a {
        min-height: 312px;
        max-height: 332px
    }

    .projects-list .row.gutter--p25 .col-lg-6.col-md-6 .thumb-of-projects a {
        max-height: 454px
    }

    .projects-list .row.gutter--p25 .col-lg-5.col-md-5 .thumb-of-projects a {
        max-height: 454px
    }

    .section-home-people {
        width: 100%;
        padding: 89px 0 98px 0
    }

    #structural-design {
        position: absolute;
        background: transparent none;
        background: #cf0000;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -135px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -189px
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -176px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 15px;
        width: 100%;
        z-index: 1;
        top: -186px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -179px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -170px
    }

    .row-choosed-services {
        margin-bottom: 40px;
        min-height: 724px
    }

    #care {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -324%;
        z-index: 2
    }

    #reliable {
        background: #cf0000;
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -426%;
        z-index: 2
    }

    #innovative {
        background: #cf0000;
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -396%;
        z-index: 2
    }

    #experienced {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -396%;
        z-index: 2
    }

    #widenetwork {
        background: #cf0000;
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -396%;
        z-index: 2
    }

    #wide-networking {
        background: #cf0000;
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -396%;
        z-index: 2
    }

    #understandingkh {
        background: #cf0000;
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -396%;
        z-index: 2
    }

    #understanding-know-how {
        background: #cf0000;
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -396%;
        z-index: 2
    }

    #optimumstructuraldesign {
        background: #cf0000;
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -396%;
        z-index: 2
    }

    #optimum-structural-design {
        background: #cf0000;
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -396%;
        z-index: 2
    }

    #comprehensivedetailed {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -309%;
        z-index: 2
    }

    #comprehensive-detailed-and-constructible-designs {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -309%;
        z-index: 2
    }
}

@media only screen and (min-width:1677px) and (max-width:1680px) and (orientation:landscape) {
    .text-parent {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .services-items a {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .text-seemore h4 {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .content-biography p {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .right-col-footer ul li a {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .left-col-footer {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .maps-contact-desc {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .summary-form {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .title-people h3 {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .description-detail-projects {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .number-projects h3 {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .content-biography {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(1),
    .row-grid .column-gallery:nth-child(4) .card-project-case:first-child {
        min-height: 321px;
        max-height: 321px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(2),
    .row-grid .column-gallery:first-child .card-project-case:nth-child(3),
    .row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(2),
    .row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(3) {
        min-height: 214.5px;
        max-height: 214.5px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(2) .card-project-case:first-child,
    .row-grid .column-gallery:nth-child(5) .card-project-case:first-child {
        min-height: 419px;
        max-height: 419px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(2) .card-project-case:nth-child(2),
    .row-grid .column-gallery:nth-child(5) .card-project-case:nth-child(2) {
        min-height: 336px;
        max-height: 336px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(3) .card-project-case:nth-child(2) {
        max-height: 364.5px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(3) .card-project-case:first-child {
        max-height: 390.1px !important;
        overflow: hidden !important
    }

    .row-grid {
        position: relative;
        top: 2.64px
    }

    .scroll-down {
        position: absolute;
        top: 76.86%
    }

    .section-hero-images {
        width: 100%;
        min-height: 624px;
        background: var(--white-one);
        display: flex;
        flex-wrap: wrap;
        align-items: center
    }

    @-moz-document url-prefix() {
        #scroll-down {
            padding-top: 24px
        }
    }

    .section-home-services {
        padding: 56px 0 60px 0
    }

    .section-projects-home {
        width: 100%;
        padding: 26px 0 56px 0
    }

    .section-home-clients {
        padding: 56px 0 62px 0
    }

    .footer-row-one {
        padding: 34px 0 28px 0
    }

    .description-detail-project {
        width: 100%;
        min-height: 542px
    }

    .thumb-of-projects a {
        min-height: 250px;
        max-height: 267px
    }

    #structural-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -117px
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -134px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -132px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -121px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -118px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -136px
    }
}

@media only screen and (min-width:1526px) and (max-width:1582px) and (orientation:landscape) {
    .text-parent {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .services-items a {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .text-seemore h4 {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .content-biography p {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .right-col-footer ul li a {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .left-col-footer {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .maps-contact-desc {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .summary-form {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .title-people h3 {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .description-detail-projects {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .number-projects h3 {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .content-biography {
        font: normal 400 clamp(0.8663rem, 0.736rem + 0.1628vw, 0.875rem) var(--font-arial)
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(1),
    .row-grid .column-gallery:nth-child(4) .card-project-case:first-child {
        min-height: 246.5px;
        max-height: 246.5px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(2),
    .row-grid .column-gallery:first-child .card-project-case:nth-child(3),
    .row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(2),
    .row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(3) {
        min-height: 164.5px;
        max-height: 164.5px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(2) .card-project-case:first-child,
    .row-grid .column-gallery:nth-child(5) .card-project-case:first-child {
        min-height: 314px;
        max-height: 314px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(2) .card-project-case:nth-child(2),
    .row-grid .column-gallery:nth-child(5) .card-project-case:nth-child(2) {
        min-height: 267px;
        max-height: 267px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(3) .card-project-case:nth-child(2) {
        max-height: 309px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(3) .card-project-case:first-child {
        max-height: 272px !important;
        overflow: hidden !important
    }

    .row-grid {
        position: relative;
        top: 2.64px
    }

    .scroll-down {
        position: absolute;
        top: 76.86%
    }

    .section-hero-images {
        width: 100%;
        min-height: 624px;
        background: var(--white-one);
        display: flex;
        flex-wrap: wrap;
        align-items: center
    }

    @-moz-document url-prefix() {
        #scroll-down {
            padding-top: 24px
        }
    }

    .section-home-services {
        padding: 56px 0 60px 0
    }

    .section-projects-home {
        width: 100%;
        padding: 26px 0 56px 0
    }

    .section-home-clients {
        padding: 56px 0 62px 0
    }

    .footer-row-one {
        padding: 35px 0 46px 0
    }

    .description-detail-project {
        width: 100%;
        min-height: 542px
    }

    .thumb-of-projects a {
        min-height: 250px;
        max-height: 267px
    }

    #structural-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -117px
    }

    .footer-row-two {
        padding: 21px 0 16px 0
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -134px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -132px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -121px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -118px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -136px
    }
}

@media only screen and (min-width:1280px) and (max-device-width:1280px) and (orientation:landscape) {
    .container-large {
        max-width: 99.24%;
        margin: 0 auto
    }

    .logo-brand {
        width: 232px
    }

    .navbar-align-right ul li a {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .navbar-align-right ul li.dropdown-hover ul li a {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .text-parent {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .navbar-align-right ul li:hover .text-parent {
        font: normal 600 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .text-seemore h4 {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .card-services-images figure {
        max-height: 309px
    }

    .right-col-footer ul li a {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .item-copyright-music {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .left-col-footer {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .conatains-link a {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .dynamic-content {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .item-list-choosed {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .item-list-choosed ul li p {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .left-table-of-content ul li a {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .maps-contact-desc {
        font: normal 400 clamp(0.8525rem, 0.5176rem + 0.4186vw, 0.875rem) var(--font-arial)
    }

    .row-grid .column-gallery:nth-child(2) .card-project-case:first-child {
        min-height: 249px;
        max-height: 249px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(5) .card-project-case:first-child {
        min-height: 249px;
        max-height: 249px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(2) .card-project-case:nth-child(2) {
        min-height: 205px !important;
        max-height: 205px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(5) .card-project-case:nth-child(2) {
        min-height: 205px !important;
        max-height: 205px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(1) {
        min-height: 179px;
        max-height: 179px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(4) .card-project-case:first-child {
        min-height: 179px;
        max-height: 179px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(2) {
        min-height: 134px;
        max-height: 134px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:first-child .card-project-case:nth-child(3) {
        min-height: 134px;
        max-height: 134px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(2) {
        min-height: 134px;
        max-height: 134px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(4) .card-project-case:nth-child(3) {
        min-height: 134px;
        max-height: 134px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(3) .card-project-case:first-child {
        min-height: 218px;
        max-height: 218px !important;
        overflow: hidden !important
    }

    .row-grid .column-gallery:nth-child(3) .card-project-case:nth-child(2) {
        min-height: 236px;
        max-height: 236px !important;
        overflow: hidden !important
    }

    .title-section-home h2 {
        font: normal 600 clamp(1.5rem, 1.2767rem + 0.2791vw, 1.515rem) var(--font-spectral);
        color: var(--gray-950)
    }

    #structural-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -54px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -64px
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -54px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -56px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -50px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -50px
    }

    .row-choosed-services {
        min-height: 456px;
        padding-top: 48px;
        padding-bottom: 48px;
        margin-bottom: 24px;
        margin-bottom: 36px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        -ms-align-items: center;
        -moz-align-items: center;
        -webkit-align-items: center
    }

    #care {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -186%;
        z-index: 2
    }

    #experienced {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -289%;
        z-index: 2
    }

    #innovative {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -303%;
        z-index: 2
    }

    #reliable {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -308%;
        z-index: 2
    }

    #widenetwork {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -311%;
        z-index: 2
    }

    #wide-networking {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -311%;
        z-index: 2
    }

    #understandingkh {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -289%;
        z-index: 2
    }

    #understanding-know-how {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -289%;
        z-index: 2
    }

    #optimumstructuraldesign {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -299%;
        z-index: 2
    }

    #optimum-structural-design {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -299%;
        z-index: 2
    }

    #comprehensivedetailed {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -211%;
        z-index: 2
    }

    #comprehensive-detailed-and-constructible-designs {
        background: transparent none;
        height: 376px;
        width: 100%;
        position: absolute;
        top: -211%;
        z-index: 2
    }
}

@media only screen and (min-device-width:1194px) and (max-device-width:1194px) and (orientation:landscape) {
    .thumb-of-projects a {
        max-height: 276px
    }

    .row-choosed-services {
        min-height: 100vh;
        padding-top: 0;
        margin: 0;
        position: relative
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -172px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -172px
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -172px
    }
}

@media only screen and (min-device-width:1080px) and (max-device-width:1080px) and (orientation:landscape) {
    .card-projects-thumb {
        min-height: 210px
    }

    .thumb-of-projects a {
        min-height: 210px
    }

    .row-choosed-services {
        min-height: 100vh;
        padding-top: 0;
        margin: 0;
        position: relative
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -177px
    }
}

@media screen and (min-device-width:1081px) and (max-device-width:1194px) {
    .thumb-of-projects a {
        max-height: 274px
    }
}

@media only screen and (min-width:1120px) and (max-width:1180px) and (orientation:landscape) {
    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }
}

@media only screen and (min-device-width:1180px) and (max-device-width:1180px) and (orientation:landscape) {
    .card-projects-thumb {
        min-height: 210px
    }

    .thumb-of-projects a {
        min-height: 210px
    }

    .row-choosed-services {
        min-height: 100vh;
        padding-top: 0;
        margin: 0;
        position: relative
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -172px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -172px
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -172px
    }
}

@media screen and (min-width:1025px) and (max-width:1079px) {

    body,
    html {
        overflow-x: clip;
        display: block
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }
}

@media only screen and (min-device-width:1024px) and (max-device-width:1024px) and (orientation:portrait) {
    .row-choosed-services {
        min-height: 100vh;
        padding-top: 0;
        margin: 0;
        position: relative
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -177px
    }
}

@media only screen and (min-device-width:1024px) and (max-device-width:1024px) and (orientation:landscape) {
    .card-projects-thumb {
        min-height: 210px
    }

    .thumb-of-projects a {
        min-height: 210px
    }

    .row-choosed-services {
        min-height: 100vh;
        padding-top: 0;
        margin: 0;
        position: relative
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #structural-assessment-retrofitting-design {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -174px
    }

    #value-engineering {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #structural-bim-detailing {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #site-supervision {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -178px
    }

    #concrete-technology-consulting {
        position: absolute;
        background: transparent none;
        height: 12px;
        width: 100%;
        z-index: 1;
        top: -177px
    }
}

@media screen and (min-device-width:992px) and (max-device-width:1023px) {
    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }
}

@media screen and (min-width:951px) and (max-width:991px) {
    .centered-container {
        max-width: 97.64%;
        margin: 0 auto
    }

    .thumb-of-projects a {
        min-height: 164px
    }

    .card-projects-thumb {
        width: 100%;
        min-height: 164px
    }

    .right-col-footer {
        min-height: 194.5px
    }

    .right-col-footer .row:first-child {
        height: 172.5px !important
    }

    .gutter--45.container,
    .gutter--45.container-fluid,
    .gutter--45.customized-container,
    .our-services-contents .gutter--45.row {
        margin-left: -24px;
        margin-right: -24px
    }

    .our-services-contents .gutter--45>[class^=col-] {
        padding-left: 20px;
        padding-right: 20px
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }
}

@media screen and (min-width:835px) and (max-width:950px) {
    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }
}

@media only screen and (min-device-width:834px) and (max-device-width:834px) and (orientation:portrait) {
    #carouselExampleIndicators .carousel-control-next {
        width: 20%;
        background: rgba(255, 255, 255, 0);
        border-radius: 0;
        overflow: hidden;
        padding: 4px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        top: 0;
        right: -2.5%;
        opacity: .82;
        z-index: 5
    }

    #carouselExampleIndicators .carousel-control-next .carousel-control-next-icon {
        width: 1.4rem;
        height: 1.4rem;
        filter: invert(0%)
    }

    #carouselExampleIndicators .carousel-control-prev {
        width: 20%;
        background: rgba(255, 255, 255, 0);
        border-radius: 0;
        overflow: hidden;
        padding: 4px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        top: 0;
        left: -2.5%;
        opacity: .82;
        z-index: 5
    }

    #carouselExampleIndicators .carousel-control-prev .carousel-control-prev-icon {
        width: 1.4rem;
        height: 1.4rem;
        filter: invert(0%)
    }

    .book-wrapper {
        height: auto;
        padding-bottom: 20px
    }

    .canvas-book-mobile {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        max-width: 90% !important;
        width: 90% !important;
        margin: 0 auto !important;
        height: auto !important
    }

    .navbar-flex {
        padding-left: 0;
        padding-right: 0
    }

    .thumb-of-projects a {
        min-height: 174px
    }

    .card-projects-thumb {
        min-height: 174px
    }

    .card-related-projects {
        width: 100%;
        min-height: 74px;
        max-height: 76px
    }

    .right-col-footer {
        padding-left: 48px;
        width: 34.98%;
        min-height: 204.5px
    }

    .right-col-footer .row:first-child {
        height: 170.5px !important
    }

    .description-detail-project {
        width: 100%;
        min-height: 396px
    }

    .description-detail-project {
        width: 100%;
        min-height: 366px
    }

    .psliderfiveth,
    .psliderfourth,
    .psliderone,
    .psliderthree,
    .pslidertwo {
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespfiveth,
    .slidespfourth,
    .slidespone,
    .slidespthree,
    .slidesptwo {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .containt-presiden {
        width: 100%;
        min-height: 312px;
        background: #b9b9b7
    }

    .presiden-message-photo {
        width: 100%;
        min-height: 315px;
        position: relative
    }

    .message-text {
        width: 58%;
        padding-left: 74px;
        padding-right: 48px;
        padding-right: 15px
    }

    .card-photo-people {
        width: 100%;
        min-height: 176px;
        max-height: 178px
    }

    .people-name-home h2 {
        font: normal 600 clamp(1rem, 0.325rem + 1.3333vw, 1.02rem) var(--font-arial)
    }

    #modalseePeople .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople2 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople3 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople4 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople5 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople6 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }

    .our-services-contents .col-md-7 {
        width: 100%
    }

    .our-services-contents .col-md-5 {
        width: 100%
    }

    .our-services-contents .row:nth-child(3) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(3) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(5) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(5) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(7) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(7) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row.gutter--45.align-items-center.position-relative {
        min-height: 766px;
        height: 100% !important;
        padding: 30px 0 32px 0;
        border: 4px solid #fff;
        border: 4px solid transparent;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: space-between;
        -ms-justify-content: space-between;
        -moz-justify-content: space-between;
        -webkit-justify-content: space-between
    }

    .rowed {
        width: calc(100vw - 36px);
        margin: 0 auto
    }

    .section-hero-images {
        width: 100%;
        min-height: 532px;
        background: var(--white-one);
        height: calc(706px - 128px)
    }

    .column-gallery.height-full {
        flex: 0 0 1;
        flex-direction: column;
        display: flex;
        width: 100%;
        height: calc(706px - 128px);
        overflow: hidden;
        flex-direction: column
    }

    .wrp-card-people {
        width: 21.36%
    }
}

@media only screen and (min-device-width:820px) and (max-device-width:820px) and (orientation:portrait) {
    #carouselExampleIndicators .carousel-control-next {
        width: 20%;
        background: rgba(255, 255, 255, 0);
        border-radius: 0;
        overflow: hidden;
        padding: 4px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        top: 0;
        right: -2.5%;
        opacity: .82;
        z-index: 5
    }

    #carouselExampleIndicators .carousel-control-next .carousel-control-next-icon {
        width: 1.4rem;
        height: 1.4rem;
        filter: invert(0%)
    }

    #carouselExampleIndicators .carousel-control-prev {
        width: 20%;
        background: rgba(255, 255, 255, 0);
        border-radius: 0;
        overflow: hidden;
        padding: 4px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        top: 0;
        left: -2.5%;
        opacity: .82;
        z-index: 5
    }

    #carouselExampleIndicators .carousel-control-prev .carousel-control-prev-icon {
        width: 1.4rem;
        height: 1.4rem;
        filter: invert(0%)
    }

    .book-wrapper {
        height: auto;
        padding-bottom: 20px
    }

    .canvas-book-mobile {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        max-width: 90% !important;
        width: 90% !important;
        margin: 0 auto !important;
        height: auto !important
    }

    .navbar-flex {
        padding-left: 0;
        padding-right: 0
    }

    .people-name-home h2 {
        font: normal 600 clamp(1rem, 0.325rem + 1.3333vw, 1.02rem) var(--font-arial)
    }

    .thumb-of-projects a {
        min-height: 172px
    }

    .card-projects-thumb {
        min-height: 172px
    }

    .description-detail-project {
        width: 100%;
        min-height: 366px
    }

    .psliderfiveth,
    .psliderfourth,
    .psliderone,
    .psliderthree,
    .pslidertwo {
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespfiveth,
    .slidespfourth,
    .slidespone,
    .slidespthree,
    .slidesptwo {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .card-related-projects {
        width: 100%;
        min-height: 74px;
        max-height: 76px
    }

    iframe.footer-maps {
        width: 100%;
        min-height: 225px !important
    }

    .containt-presiden {
        width: 100%;
        min-height: 312px;
        background: #b9b9b7
    }

    .presiden-message-photo {
        width: 100%;
        min-height: 315px;
        position: relative
    }

    .message-text {
        width: 58%;
        padding-left: 74px;
        padding-right: 48px;
        padding-right: 15px
    }

    .card-photo-people {
        width: 100%;
        min-height: 174px;
        max-height: 176px
    }

    #modalseePeople .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople2 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople3 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople4 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople5 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople6 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }

    .our-services-contents .col-md-7 {
        width: 100%
    }

    .our-services-contents .col-md-5 {
        width: 100%
    }

    .our-services-contents .row:nth-child(3) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(3) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(5) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(5) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(7) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(7) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row.gutter--45.align-items-center.position-relative {
        min-height: 766px;
        height: 100% !important;
        padding: 30px 0 32px 0;
        border: 4px solid #fff;
        border: 4px solid transparent;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: space-between;
        -ms-justify-content: space-between;
        -moz-justify-content: space-between;
        -webkit-justify-content: space-between
    }

    .rowed {
        width: calc(100vw - 36px);
        margin: 0 auto
    }

    .section-hero-images {
        width: 100%;
        min-height: 532px;
        background: var(--white-one);
        height: calc(694px - 128px)
    }

    .column-gallery.height-full {
        flex: 0 0 1;
        flex-direction: column;
        display: flex;
        width: 100%;
        height: calc(694px - 128px);
        overflow: hidden;
        flex-direction: column
    }
}

@media only screen and (min-device-width:810px) and (max-device-width:810px) and (orientation:portrait) {
    #carouselExampleIndicators .carousel-control-next {
        width: 20%;
        background: rgba(255, 255, 255, 0);
        border-radius: 0;
        overflow: hidden;
        padding: 4px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        top: 0;
        right: -2.5%;
        opacity: .82;
        z-index: 5
    }

    #carouselExampleIndicators .carousel-control-next .carousel-control-next-icon {
        width: 1.4rem;
        height: 1.4rem;
        filter: invert(0%)
    }

    #carouselExampleIndicators .carousel-control-prev {
        width: 20%;
        background: rgba(255, 255, 255, 0);
        border-radius: 0;
        overflow: hidden;
        padding: 4px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        top: 0;
        left: -2.5%;
        opacity: .82;
        z-index: 5
    }

    #carouselExampleIndicators .carousel-control-prev .carousel-control-prev-icon {
        width: 1.4rem;
        height: 1.4rem;
        filter: invert(0%)
    }

    .book-wrapper {
        height: auto;
        padding-bottom: 20px
    }

    .canvas-book-mobile {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        max-width: 90% !important;
        width: 90% !important;
        margin: 0 auto !important;
        height: auto !important
    }

    .people-name-home h2 {
        font: normal 600 clamp(1rem, 0.325rem + 1.3333vw, 1.02rem) var(--font-arial)
    }

    .navbar-flex {
        padding-left: 0;
        padding-right: 0
    }

    .thumb-of-projects a {
        min-height: 172px
    }

    .card-projects-thumb {
        min-height: 172px
    }

    .description-detail-project {
        width: 100%;
        min-height: 366px
    }

    .psliderfiveth,
    .psliderfourth,
    .psliderone,
    .psliderthree,
    .pslidertwo {
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespfiveth,
    .slidespfourth,
    .slidespone,
    .slidespthree,
    .slidesptwo {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .card-related-projects {
        width: 100%;
        min-height: 74px;
        max-height: 76px
    }

    iframe.footer-maps {
        width: 100%;
        min-height: 224px !important
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.4375rem, 1.4375rem + 0vw, 1.4375rem) var(--font-spectral);
        line-height: 29px
    }

    .logo-brand {
        width: 250px
    }

    .row-grid {
        padding-left: 0;
        padding-right: 0
    }

    .containt-presiden {
        width: 100%;
        min-height: 312px;
        background: #b9b9b7
    }

    .presiden-message-photo {
        width: 100%;
        min-height: 315px;
        position: relative
    }

    .message-text {
        width: 58%;
        padding-left: 74px;
        padding-right: 48px;
        padding-right: 15px
    }

    .card-photo-people {
        width: 100%;
        min-height: 172px;
        max-height: 175px
    }

    #modalseePeople .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople2 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople3 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople4 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople5 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    #modalseePeople6 .modal-dialog-people {
        margin-top: 36px;
        max-width: 92.24%
    }

    .gutter--45.container,
    .gutter--45.container-fluid,
    .gutter--45.customized-container,
    .gutter--45.row {
        margin-left: -24px;
        margin-right: -24px
    }

    .gutter--45>[class^=col-] {
        padding-left: 24px;
        padding-right: 24px
    }

    .our-services-contents .col-md-7 {
        width: 100%
    }

    .our-services-contents .col-md-5 {
        width: 100%
    }

    .our-services-contents .row:nth-child(3) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(3) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(5) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(5) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(7) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(7) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row.gutter--45.align-items-center.position-relative {
        min-height: 766px;
        height: 100% !important;
        padding: 30px 0 32px 0;
        border: 4px solid #fff;
        border: 4px solid transparent;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: space-between;
        -ms-justify-content: space-between;
        -moz-justify-content: space-between;
        -webkit-justify-content: space-between
    }

    .rowed {
        width: calc(100vw - 36px);
        margin: 0 auto
    }

    .section-hero-images {
        width: 100%;
        min-height: 532px;
        background: var(--white-one);
        height: calc(686px - 128px)
    }

    .column-gallery.height-full {
        flex: 0 0 1;
        flex-direction: column;
        display: flex;
        width: 100%;
        height: calc(686px - 128px);
        overflow: hidden;
        flex-direction: column
    }

    .wrp-card-people {
        width: 21.35%
    }
}

@media screen and (min-width:540px) and (max-width:809px) {
    #carouselExampleIndicators .carousel-control-next {
        width: 20%;
        background: rgba(255, 255, 255, 0);
        border-radius: 0;
        overflow: hidden;
        padding: 4px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        top: 0;
        right: -2.5%;
        opacity: .82;
        z-index: 5
    }

    #carouselExampleIndicators .carousel-control-next .carousel-control-next-icon {
        width: 1.4rem;
        height: 1.4rem;
        filter: invert(0%)
    }

    #carouselExampleIndicators .carousel-control-prev {
        width: 20%;
        background: rgba(255, 255, 255, 0);
        border-radius: 0;
        overflow: hidden;
        padding: 4px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        top: 0;
        left: -2.5%;
        opacity: .82;
        z-index: 5
    }

    #carouselExampleIndicators .carousel-control-prev .carousel-control-prev-icon {
        width: 1.4rem;
        height: 1.4rem;
        filter: invert(0%)
    }

    .canvas-book-mobile {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        max-width: 90% !important;
        width: 90% !important;
        margin: 0 auto !important;
        height: auto !important
    }

    .book-wrapper {
        position: relative;
        height: auto;
        padding-bottom: 24px
    }

    .centered-container {
        max-width: 100%
    }

    .logo-brand {
        width: 98px;
        order: 1
    }

    .navbar-align-right .wrp-nav-item {
        display: none
    }

    .navbar-align-right {
        min-width: 106px;
        order: 2
    }

    .burger-mobile {
        display: flex
    }

    .burger-mobile .hamburger {
        padding: 8px 4px 6px 4px
    }

    .burger-mobile .hamburger {
        margin-top: 4.64px;
        margin-right: 4.64px
    }

    .weather-search-result {
        width: 100%;
        left: 0
    }

    .logo-brand {
        order: 1
    }

    .logo-brand-centered {
        order: 3;
        width: 100%;
        padding-top: 12px;
        padding-bottom: 5px
    }

    .container-large {
        max-width: 100%
    }

    .frame-maps-griya {
        width: 100%;
        margin-top: 33px;
        margin-bottom: 32px
    }

    .logo-brand {
        width: 256px
    }

    .navbar-flex {
        padding-left: 0;
        padding-right: 0
    }

    .wrp-burger-menu {
        order: 2;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center
    }

    .wrp-content-maps.unfull {
        min-width: 100%;
        max-width: 100%
    }

    .navbar-desc {
        position: fixed;
        width: 100vw !important
    }

    .navbar-mobile.active {
        background: var(--white-one);
        visibility: visible;
        z-index: 9
    }

    .burger-mobile {
        display: flex
    }

    .navbar-align-right {
        min-width: 112px;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        -ms-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -webkit-justify-content: flex-end;
        margin-right: -15px
    }

    .navbar-align-right .wrp-nav-item {
        display: none
    }

    .search-navbar {
        margin-right: 14px
    }

    .separate-menu {
        width: 100%;
        display: block;
        border-bottom: 1px solid #efefef;
        padding: 18px 0 18px 0;
        color: #73767a;
        font-size: 12px;
        line-height: 18px;
        text-transform: uppercase;
        letter-spacing: .45px;
        cursor: pointer;
        position: relative
    }

    .separate-menu::before {
        content: " + ";
        position: absolute;
        right: 15px;
        top: 15px;
        width: 12px;
        height: 12px;
        font-size: 22px
    }

    .navbar-mobile {
        width: 100vw;
        height: auto;
        min-height: 99.96%;
        max-height: 100%;
        background: var(--gray-950);
        top: 0;
        position: fixed;
        z-index: 1;
        display: flex;
        overflow-y: scroll;
        visibility: hidden
    }

    .wrp-navbar-mobile {
        width: 100%;
        height: auto;
        display: block
    }

    .navbar-mobile .account-session-user {
        margin-top: 10px
    }

    .container-mobile {
        padding: 96px 15px 0 15px
    }

    .wrp-mobile-item {
        display: block;
        width: 100%;
        height: 84vh;
        position: relative;
        background: var(--white-one);
        z-index: 5;
        opacity: 0;
        margin-top: unset;
        margin-bottom: -40px;
        padding: 15px 0 15px 0
    }

    .wrp-mobile-item.active {
        opacity: 1;
        transition: all .5s;
        top: 0;
        margin-top: 0;
        transform: translateY(-20px);
        -webkit-transition: 1s ease-in-out;
        -moz-transition: 1s ease-in-out;
        -o-transition: 1s ease-in-out;
        transition: .5s ease-in-out;
        margin-bottom: unset;
        margin-bottom: 76px
    }

    .bottom-nav-mobile {
        width: 100%;
        display: block;
        position: fixed;
        background: #fcfcfb;
        min-height: 64px;
        padding: 5px 0;
        box-shadow: 0 10px 25px 4px rgba(0, 0, 0, .15);
        -ms-box-shadow: 0 10px 25px 4px rgba(0, 0, 0, .15);
        left: 0;
        bottom: 0;
        z-index: 3
    }

    .wrp-bottom-nav-icon {
        width: 100%;
        height: auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
        -ms-justify-content: space-around
    }

    .item-bottom-nav-icon {
        width: 20%;
        height: auto
    }

    .item-bottom-nav-icon a {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        text-decoration: none;
        color: #adafae;
        padding: 8.5px 0 8.5px 0
    }

    .item-bottom-nav-icon a.active {
        color: #385623
    }

    .mobile-icon {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center
    }

    .accordionMenu {
        width: 100%;
        height: auto;
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 24px;
        margin-bottom: 56px
    }

    .accordionMenu {
        width: 100%;
        height: auto
    }

    .accordionMenu a {
        padding: 16px 0 17px 0;
        width: 100%;
        height: auto;
        display: block;
        color: var(--gray-950);
        position: relative;
        text-decoration: none
    }

    .menu-head-accordions {
        width: 100%;
        height: auto;
        padding: 10px 0;
        color: var(--gray-950);
        font: normal 400 clamp(0.915rem, 0.8036rem + 0.5571vw, 0.9913rem) var(--font-arial);
        letter-spacing: .35px;
        text-transform: normal;
        cursor: pointer;
        border-bottom: 1px solid var(--blue-800)
    }

    .accordionMenu ul.sub-menu-child {
        list-style: none;
        padding-left: 0;
        margin-bottom: 6px
    }

    .has-submenu-child {
        height: auto;
        position: relative
    }

    .has-submenu-child::before {
        content: " ";
        position: absolute;
        right: 34px;
        top: 19px;
        width: 12px;
        height: 12px;
        background: url(../images/svg/caret-arrow-down-black.svg) top center no-repeat;
        background-size: auto;
        background-size: auto;
        background-size: 100%;
        -webkit-filter: invert(100%);
        filter: invert(0%)
    }

    .section-desk-nav.active {
        position: fixed;
        background: var(--white-one);
        z-index: 11
    }

    .section-desk-nav.active .logo-brand a svg path.st0 {
        fill: var(--blue-two);
        -moz-transition: .5s;
        -ms--transition: 0.5s;
        -webkit-transition: .5s;
        -o-transition: .5s
    }

    .section-desk-nav.active .logo-brand a svg path.st1 {
        fill: var(--orange-500);
        -moz-transition: .5s;
        -ms--transition: 0.5s;
        -webkit-transition: .5s;
        -o-transition: .5s
    }

    .section-desk-nav.active .logo-brand a svg polygon.st0 {
        fill: var(--blue-two);
        -moz-transition: .5s;
        -ms--transition: 0.5s;
        -webkit-transition: .5s;
        -o-transition: .5s
    }

    .section-desk-nav.active #dropdownLangdesk::after {
        background-color: var(--black-100);
        color: var(--black-100)
    }

    .section-desk-nav.active #dropdownLangdesk {
        color: var(--black-100)
    }

    .thumb-of-projects a {
        min-height: 156px
    }

    .card-projects-thumb {
        width: 100%;
        min-height: 156px
    }

    .row.gutter--p25 .col-sm-6:nth-child(12),
    .row.gutter--p25 .col-sm-6:nth-child(15),
    .row.gutter--p25 .col-sm-6:nth-child(18),
    .row.gutter--p25 .col-sm-6:nth-child(3),
    .row.gutter--p25 .col-sm-6:nth-child(6),
    .row.gutter--p25 .col-sm-6:nth-child(9) {
        flex: 0 0 auto;
        width: 100%
    }

    .row.gutter--p25 .col-sm-6:nth-child(12) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(15) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(3) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(6) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(9) .card-projects-thumb {
        width: 100%;
        min-height: 236px;
        max-height: 236px
    }

    .header {
        overflow: hidden
    }

    .header-content,
    .main-wrapper,
    .nav-header {
        overflow: hidden
    }

    .accordionMenu ul.sub-menu-child li:first-child {
        margin-top: 10px
    }

    .accordionMenu ul.sub-menu-child li a {
        font: normal 400 17.24px/25.64px var(--font-arial);
        padding: 14px 10px 15px 3px !important
    }

    .has-submenu-child::before {
        content: " ";
        position: absolute;
        right: 8px;
        top: 18px
    }

    .row-card-people .wrp-card-people::before {
        content: " ";
        position: absolute;
        right: -12.5px;
        top: 1px
    }

    .img-wrapper-icon {
        width: 22px;
        height: 26px
    }

    .img-wrapper-icon svg {
        max-width: 100%;
        fill: #1C3C6F
    }

    .text-wrapper-icon {
        font-size: 13.5px;
        line-height: 14px;
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center
    }

    .text-wrapper-icon p {
        margin-top: 3px;
        margin-bottom: 3px
    }

    .mobile-icon {
        height: auto
    }

    .navbar-flex {
        align-items: center;
        -ms-align-items: center;
        -moz-align-items: center;
        -webkit-align-items: center
    }

    .gutter--45.container,
    .gutter--45.container-fluid,
    .gutter--45.customized-container,
    .gutter--45.row {
        margin-left: -24px;
        margin-right: -24px
    }

    .gutter--45>[class^=col-] {
        padding-left: 24px;
        padding-right: 24px
    }

    .gutter--m25.container,
    .gutter--m25.container-fluid,
    .gutter--m25.container.centered-container,
    .gutter--m25.customized-container,
    .gutter--m25.row {
        margin-left: -2.5px !important;
        margin-right: -2.5px !important
    }

    .gutter--m25>[class^=col-] {
        padding-left: 2.5px !important;
        padding-right: 2.5px !important
    }

    .card-related-projects {
        width: 100%;
        min-height: 76px;
        max-height: 114px
    }

    .row-card-people {
        gap: 24px 24px;
        margin-top: 11px
    }

    .wrp-card-people {
        width: 46.24%
    }

    .section-home-clients {
        padding: 32px 0 54px 0
    }

    .card-photo-people {
        width: 100%;
        min-height: 398px;
        margin-bottom: 18px
    }

    .card-photo-detail {
        margin-bottom: 24px
    }

    .row.gutter--p25 .col-sm-6:nth-child(12),
    .row.gutter--p25 .col-sm-6:nth-child(15),
    .row.gutter--p25 .col-sm-6:nth-child(18),
    .row.gutter--p25 .col-sm-6:nth-child(3),
    .row.gutter--p25 .col-sm-6:nth-child(6),
    .row.gutter--p25 .col-sm-6:nth-child(9) {
        flex: 0 0 auto;
        width: 33.33%
    }

    .row.gutter--p25 .col-sm-6:nth-child(6) {
        flex: 0 0 auto;
        width: 33.33%
    }

    .row.gutter--p25 .col-md-4.col-sm-6:nth-child(9) {
        flex: 0 0 auto;
        width: 33.33%
    }

    .row.gutter--p25 .col-md-3.col-sm-6:nth-child(9) {
        flex: 0 0 auto;
        width: 25%
    }

    .action-button .button-dialog-socmed-outline {
        padding-left: 0;
        padding-right: 0
    }

    .row-projects {
        content: "";
        margin-top: 11px
    }

    .title-projects-home h2 {
        letter-spacing: -.2px
    }

    .section-home-people {
        padding: 8px 0 20px 0
    }

    .sm-wrp-card-services {
        display: flex !important
    }

    .row-projects.container,
    .row-projects.container-fluid,
    .row-projects.row {
        margin-left: -4px;
        margin-right: -4px
    }

    .row-projects>[class^=col-] {
        padding-left: 4px;
        padding-right: 4px
    }

    .card-home-projects {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 339px;
        max-height: 486px;
        overflow: hidden
    }

    .card-services-images figure {
        max-height: 712px
    }

    .right-col-footer {
        padding-left: 0
    }

    .accordionMenu ul.sub-menu-child li a {
        font: normal 400 clamp(0.915rem, 0.8036rem + 0.5571vw, 0.9913rem) var(--font-arial)
    }

    .wrp-card-services {
        display: none
    }

    .section-home-services {
        width: 100%;
        min-height: 424px;
        height: auto;
        display: flex;
        flex-wrap: wrap;
        padding: 56px 0 43px 0
    }

    .section-hero-mobile {
        width: 100%;
        min-height: 480px;
        background: var(--white-one);
        padding-top: 5px;
        padding-bottom: 5px
    }

    #accordionSubcatalog {
        padding: 0
    }

    .wrp-according-catalog {
        width: 100%;
        height: auto;
        margin-top: 11px
    }

    .row-grid {
        padding-left: 5px;
        padding-right: 5px
    }

    .row-grid-5.container,
    .row-grid-5.container-fluid,
    .row-grid-5.customized-container,
    .row-grid-5.row {
        margin-left: -2.5px;
        margin-right: -2.5px
    }

    .row-grid-5>[class^=col-] {
        padding-left: 2.5px;
        padding-right: 2.5px
    }

    .home-project-portraite {
        background: var(--gray-200);
        width: 100%;
        min-height: 306px;
        max-height: 306px !important;
        overflow: hidden !important;
        position: relative
    }

    .home-project-landscape {
        background: var(--gray-200);
        width: 100%;
        min-height: 350px;
        max-height: 350px !important;
        overflow: hidden !important;
        position: relative
    }

    .row-projects .col-lg-3.col-md-4:nth-last-child(3) .more-projects-home {
        margin-top: 18px;
        margin-bottom: 56.64px
    }

    .row-projects .col-lg-3.col-md-4:nth-last-child(4) .more-projects-home {
        margin-top: 18px;
        margin-bottom: 56.64px
    }

    .card-services-why {
        min-height: 286px;
        height: auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        align-items: center;
        -ms-align-items: center;
        -moz-align-items: center;
        -webkit-align-items: center
    }

    .card-services-why .choosed-icon::before {
        content: '';
        background: rgba(255, 255, 255, 0) 0, -o-linear-gradient(230deg, rgba(255, 136, 0, .36) 52.09%);
        background: linear-gradient(-140deg, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 52.09%);
        background: #cf0000;
        background: linear-gradient(140deg, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 52.09%);
        background: linear-gradient(to bottom, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(45deg, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(135deg, rgba(255, 255, 255, 0) 0, rgba(255, 136, 0, .46) 100%);
        opacity: .5;
        position: absolute;
        top: -25.5%;
        -webkit-transform: translateY(-50%) rotate(-45deg);
        transform: rotate(45deg);
        width: 186px;
        height: 186px;
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        left: -23%;
        right: 0
    }

    .item-list-choosed {
        min-height: 24px;
        padding: 15px 15px
    }

    .card-services-why .choosed-icon {
        width: 124px;
        height: auto;
        top: unset;
        position: relative;
        z-index: 3
    }

    .card-services-why .choosed-icon img {
        max-width: 100%;
        position: relative;
        top: -4px
    }

    .card-services-why {
        order: 2;
        width: 50%
    }

    .card-why-ssi {
        order: 1;
        width: 50%
    }

    .mconron {
        width: 100%;
        height: auto;
        min-height: 306px;
        max-height: 306px !important;
        background: #ddd
    }

    .slideconron {
        position: relative;
        width: 100%;
        min-height: 306px;
        max-height: 306px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconron {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconron.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .mctwron {
        width: 100%;
        height: auto;
        min-height: 306px;
        max-height: 306px !important;
        background: #ddd
    }

    .slidectwron {
        position: relative;
        width: 100%;
        min-height: 306px;
        max-height: 306px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemctwron {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 2s ease-in-out, transform 9.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemctwron.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .mconrtw {
        width: 100%;
        height: auto;
        min-height: 350px;
        max-height: 350px !important;
        background: #ddd
    }

    .slideconrtw {
        position: relative;
        width: 100%;
        min-height: 350px;
        max-height: 350px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconrtw {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 2s ease-in-out, transform 9.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconrtw.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-portraite-38 {
        width: 100%;
        min-height: 314px;
        max-height: 314px !important
    }

    .mconrth {
        width: 100%;
        height: auto;
        min-height: 314px;
        max-height: 314px !important;
        background: #ddd
    }

    .slideconrth {
        position: relative;
        width: 100%;
        min-height: 314px;
        max-height: 314px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconrth {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconrth.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-landscape-62 {
        width: 100%;
        min-height: 314px;
        max-height: 314px !important
    }

    .mctwrth {
        width: 100%;
        height: auto;
        min-height: 314px;
        max-height: 314px !important;
        background: #ddd
    }

    .slidectwrth {
        position: relative;
        width: 100%;
        min-height: 314px;
        max-height: 314px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemctwrth {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemctwrth.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-equilateral {
        width: 100%;
        min-height: 314px;
        max-height: 314px !important
    }

    .mconrfr {
        width: 100%;
        height: auto;
        min-height: 314px;
        max-height: 314px !important;
        background: #ddd
    }

    .slideconrfr {
        position: relative;
        width: 100%;
        min-height: 318px;
        max-height: 318px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconrfr {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconrfr.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-equilateral {
        width: 100%;
        min-height: 314px;
        max-height: 314px !important
    }

    .mctwrfr {
        width: 100%;
        height: auto;
        min-height: 314px;
        max-height: 314px !important;
        background: #ddd
    }

    .slidectwrfr {
        position: relative;
        width: 100%;
        min-height: 318px;
        max-height: 318px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemctwrfr {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemctwrfr.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .psliderfiveth,
    .psliderfourth,
    .psliderone,
    .psliderthree,
    .pslidertwo {
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespone,
    .slidespone.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidesptwo,
    .slidesptwo.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespthree,
    .slidespthree.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespfourth,
    .slidespfourth.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespfiveth,
    .slidespfiveth.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .center-column-residential {
        min-height: 64px
    }

    .center-column-residential .thumb-of-projects a .card-projects-thumb {
        width: 100%;
        min-height: 64px
    }

    .projects-list-residential .row.gutter--p25 .left-column-residential {
        width: 33.33%;
        min-height: 104px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:first-child {
        width: 33.33%
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(2) {
        width: 33.33%
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(3) {
        width: 33.33%
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(4) {
        width: 60%
    }

    .projects-list-residential .row.gutter--p25 .right-column-residential {
        width: 40%;
        min-height: 156px
    }

    .thumb-of-projects a {
        max-height: 216px
    }

    .projects-list-residential .row.gutter--p25 .left-column-residential .thumb-of-projects a {
        min-height: 102px;
        max-height: 102px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(2) .thumb-of-projects a {
        min-height: 102px;
        max-height: 102px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(3) .thumb-of-projects a {
        min-height: 102px;
        max-height: 102px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(4) .thumb-of-projects a {
        min-height: 157px;
        max-height: 160px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(4) .thumb-of-projects a img {
        margin-top: -18px;
        position: relative
    }

    .projects-list-residential .row.gutter--p25 .right-column-residential .thumb-of-projects a {
        min-height: 157px;
        max-height: 160px
    }

    .table-residential-housing thead tr th:first-child {
        padding-left: 0
    }

    .table-residential-housing thead tr th:nth-child(3) {
        padding-right: 0
    }

    .table-residential-housing tbody tr td:first-child {
        padding-left: 0
    }

    .table-residential-housing tbody tr td:nth-child(3) {
        padding-right: 0
    }

    .projects-list.projects-list-residential {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center
    }

    .special-residential {
        padding-left: 1px;
        padding-right: 1px
    }

    .portraite-column-projects-home {
        background: var(--gray-100);
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
        padding: 2px
    }

    .landscape-column-projects-home {
        background: var(--gray-100);
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        padding: 2px
    }

    .portraite-column-projects-home-38 {
        background: var(--gray-100);
        -ms-flex: 0 0 38%;
        flex: 0 0 38%;
        max-width: 38%;
        padding: 2px
    }

    .portraite-column-projects-home-62 {
        background: var(--gray-100);
        -ms-flex: 0 0 62%;
        flex: 0 0 62%;
        max-width: 62%;
        padding: 2px
    }

    .title-section-home h2 {
        font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-spectral)
    }

    .wrp-according-catalog .accordion-button {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 1px solid var(--gray-600);
        border-bottom: 1px solid var(--gray-100);
        border-left: 1px solid var(--white-one);
        border-right: 1px solid var(--white-one)
    }

    #accordionCatalog .accordion-button:first-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionCatalog .accordion-button {
        padding: 10px 8px 9px 8px
    }

    #accordionWhy .accordion-button:first-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionWhy .accordion-button {
        padding: 10px 8px 9px 8px
    }

    .card-services-desc {
        padding: 10px 8px 9px 8px
    }

    .card-services-desc p {
        margin-bottom: 8.5px
    }

    .card-services-images figure {
        padding: 0 8px 0 8px
    }

    #accordionCatalog .accordion-button:last-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionWhy .accordion-button:last-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionSubcatalog .accordion-button {
        background: var(--gray-100);
        border: 0
    }

    #accordionSubcatalog .accordion-item {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 1px solid var(--gray-100);
        border-bottom: 1px solid var(--gray-200);
        border-left: 1px solid var(--gray-100);
        border-right: 1px solid var(--gray-100);
        background: var(--gray-100)
    }

    #accordionSubcatalog .accordion-item .accordion-button {
        padding-left: 10px;
        padding-right: 10px
    }

    #accordionSubcatalog .accordion-item:first-child .accordion-button {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 0 solid var(--gray-100);
        border-bottom: 1px solid var(--gray-100);
        border-left: 0 solid var(--gray-100);
        border-right: 0px solid var(--gray-100);
        background: var(--gray-100)
    }

    .services-items a {
        padding: 6px 0
    }

    #accordionSubcatalog .accordion-item:last-child .accordion-button {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 1px solid var(--gray-100);
        border-bottom: 0 solid var(--white-one);
        border-left: 0 solid var(--white-one);
        border-right: 0px solid var(--white-one)
    }

    .wrp-according-catalog .accordion-button:not(.collapsed) {
        background-color: var(--white-one)
    }

    .wrp-according-catalog .accordion-button {
        border-radius: 0;
        padding-left: 0;
        padding-right: 0
    }

    #accordionCatalog {
        border: 2px solid var(--gray-100);
        border-radius: 0
    }

    #accordionCatalog .accordion-item .accordion-header {
        padding: 0 0
    }

    #accordionWhy {
        border: 2px solid var(--gray-100);
        border-radius: 0
    }

    #accordionWhy .accordion-item .accordion-header {
        padding: 0 0
    }

    .wrp-according-catalog .accordion-item {
        border: 1px solid #cf0000 !important;
        border-radius: 16.64px
    }

    #accordionCatalog .accordion-item {
        border-radius: 0;
        border: 0 solid var(--white-one) !important;
        padding-left: 6px;
        padding-right: 6px
    }

    #accordionCatalog .accordion-item:first-child {
        border-radius: 16.64px 16.64px 0 0
    }

    #accordionCatalog .accordion-item:last-child {
        border-radius: 0 0 16.64px 16.64px
    }

    #accordionWhy .accordion-item {
        border-radius: 0;
        border: 0 solid var(--white-one) !important;
        padding-left: 6px;
        padding-right: 6px
    }

    #accordionWhy .accordion-item:first-child {
        border-radius: 16.64px 16.64px 0 0
    }

    #accordionWhy .accordion-item:last-child {
        border-radius: 0 0 16.64px 16.64px
    }

    .wrp-according-catalog .accordion-body.accordion-body-catalog {
        border: 1px solid #fff !important;
        padding: 4px 0;
        display: flex;
        flex-wrap: wrap
    }

    .wrp-according-catalog .accordion-body.accordion-body-catalog a {
        text-decoration: none !important
    }

    #accordionSubcatalog .accordion-item {
        border-radius: 0;
        border-bottom: 1px solid var(--gray-200) !important
    }

    #accordionSubcatalog .accordion-item:last-child {
        border-bottom: 0 solid var(--gray-200) !important
    }

    .wrp-according-catalog .accordion-button::after {
        display: none
    }

    .wrp-scroll-horizontal {
        width: 100%;
        min-height: 156px;
        overflow-x: scroll
    }

    .row-catalog-mobile {
        display: inline-flex;
        flex-wrap: nowrap;
        overflow-x: scroll
    }

    .row-catalog-mobile.container,
    .row-catalog-mobile.container-fluid,
    .row-catalog-mobile.row {
        margin-left: -8px;
        margin-right: -8px
    }

    .row-catalog-mobile>[class^=col-] {
        padding-left: 8px;
        padding-right: 8px
    }

    .row-catalog-mobile .col-12.column-sm-news {
        flex: 0 0 auto;
        width: 314px !important
    }

    .wrp-according-subcatalog .accordion-button h4 {
        color: var(--gray-950);
        font: normal 600 clamp(1.125rem, 0.9964rem + 0.6431vw, 1.2275rem) var(--font-poppins)
    }

    .wrp-according-subcatalog #accordionSubcatalog .accordion-button h4 {
        color: var(--gray-950);
        font: normal 600 15.64px/24.64px var(--font-poppins);
        margin-bottom: .6px
    }

    .card-services-desc {
        min-height: 114px;
        max-height: unset
    }

    .tabulation-title h3 {
        color: var(--gray-950);
        font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-spectral);
        margin-bottom: 0;
        line-height: 22.64px
    }

    #accordionCatalog .accordion-pluss {
        position: relative;
        width: 100%;
        min-height: 32px
    }

    #accordionCatalog .accordion-pluss::after {
        display: block;
        position: absolute;
        content: "";
        right: 10px;
        background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M8 0a1 1 0 0 1 1 1v6h6a1 1 0 1 1 0 2H9v6a1 1 0 1 1-2 0V9H1a1 1 0 0 1 0-2h6V1a1 1 0 0 1 1-1z' clip-rule='evenodd'/%3e%3c/svg%3e") !important;
        background-size: 80% !important
    }

    #accordionCatalog .accordion-pluss:not(.collapsed)::after {
        display: block;
        position: absolute;
        content: "";
        right: 10px;
        background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M0 8a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H1a1 1 0 0 1-1-1z' clip-rule='evenodd'/%3e%3c/svg%3e") !important;
        background-size: 80% !important
    }

    #accordionSubcatalog .accordion-button::after {
        display: block;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
        background-size: 86% !important
    }

    #accordionSubcatalog .accordion-button:not(.collapsed)::after {
        display: block;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
        transform: rotate(-180deg) !important;
        background-size: 86% !important
    }

    .tabulation-title {
        width: 84.14%
    }

    .tabultaion-with-icon {
        min-width: 314px;
        max-width: 314px;
        min-height: 26px;
        display: flex;
        flex-wrap: wrap
    }

    .left-title-section {
        display: none
    }

    .left-table-of-content ul {
        top: unset
    }

    .section-detail-project.special-case-gandaria .row.detail-odd {
        text-decoration: none
    }

    .section-detail-project.special-case-gandaria .row.detail-even .col-sm-12.col-12:first-child {
        order: 2
    }

    .section-detail-project.special-case-gandaria .row.detail-even .col-sm-12.col-12:last-child {
        order: 1
    }

    .our-services-contents .row:first-child .col-sm-7 {
        order: 2
    }

    .our-services-contents .row:first-child .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(2) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(2) .col-md-5.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(3) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(3) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(5) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(5) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(7) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(7) .col-md-5.col-12 {
        order: 2
    }

    .wrp-services-list {
        margin-bottom: 20px
    }

    .thumb-of-projects a {
        min-height: 164px
    }

    .card-projects-thumb {
        width: 100%;
        min-height: 164px
    }

    .row-modal-people {
        display: flex;
        flex-wrap: wrap;
        margin-top: -1px;
        flex-direction: column
    }

    .people-social-network {
        display: none
    }

    #modalseePeople .modal-dialog-people {
        margin-top: 36px;
        max-width: 404px
    }

    #modalseePeople2 .modal-dialog-people {
        margin-top: 36px;
        max-width: 404px
    }

    #modalseePeople3 .modal-dialog-people {
        margin-top: 36px;
        max-width: 404px
    }

    #modalseePeople4 .modal-dialog-people {
        margin-top: 36px;
        max-width: 404px
    }

    #modalseePeople5 .modal-dialog-people {
        margin-top: 36px;
        max-width: 404px
    }

    #modalseePeople6 .modal-dialog-people {
        margin-top: 36px;
        max-width: 404px
    }

    .modal-dialog-people {
        max-width: 100%;
        padding-left: 5px;
        padding-right: 5px
    }

    .side-left-people {
        max-width: 100%;
        flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        height: 100vh;
        background: transparent none;
        padding-right: 0
    }

    .wrp-content-dialog {
        padding: 24px 20px 5px 26px
    }

    .button-dialog-socmed-outline a {
        cursor: pointer
    }

    .side-right-people {
        display: flex;
        flex-wrap: wrap;
        max-width: 100%;
        flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        background: #fff;
        background: transparent none
    }

    .summary-about {
        max-width: 100%
    }

    .card-head-about {
        width: 276px
    }

    .president-photos {
        width: 100%;
        padding-bottom: 24px;
        padding-top: 15px
    }

    .message-text {
        width: 100%;
        padding-left: 56px;
        padding-right: 4px;
        padding-bottom: 30px
    }

    .section-hero-images {
        display: none
    }

    .section-hero-images-mobile {
        display: flex;
        width: 100%;
        min-height: 224px;
        background: #efefef
    }

    .description-detail-project {
        width: 100%;
        min-height: 32px
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.6875rem, 1.6875rem + 0vw, 1.6875rem) var(--font-spectral)
    }

    .projects-list .row.gutter--p25 .col-md-3.col-sm-6 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .projects-list .row.gutter--p25 .col-md-3.col-sm-6:nth-child(4),
    .projects-list .row.gutter--p25 .col-md-3.col-sm-6:nth-child(5) {
        flex: 0 0 auto;
        width: 50%
    }

    .projects-list .row.gutter--p25 .col-sm-6:nth-child(6),
    .projects-list .row.gutter--p25 .col-sm-6:nth-child(7),
    .projects-list .row.gutter--p25 .col-sm-6:nth-child(8) {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .projects-list .row.gutter--p25 .col-sm-6:nth-child(10),
    .projects-list .row.gutter--p25 .col-sm-6:nth-child(5),
    .projects-list .row.gutter--p25 .col-sm-6:nth-child(9) {
        flex: 0 0 auto;
        width: 50%
    }

    .frame-maps-griya {
        width: 100%;
        margin-top: 33px;
        margin-bottom: 32px
    }

    .containt-presiden {
        width: 100%;
        min-height: 212px;
        background: #b9b9b7
    }

    .presiden-message-photo {
        width: 100%;
        min-height: 212px;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        flex-direction: column;
        overflow: hidden
    }

    .presiden-message-photo img {
        max-width: 118%;
        object-fit: contain;
        left: -12.64%;
        top: -4.86%;
        position: relative
    }

    .presiden-message-photo img {
        max-width: 118%;
        object-fit: contain;
        left: -12.64%;
        top: -4.86%;
        position: relative
    }

    .message-presiden {
        position: relative;
        top: 0;
        left: 0;
        transform: translate(0, 0)
    }

    .message-text {
        width: 100%;
        padding-left: 56px;
        padding-left: 48px;
        padding-right: 4px;
        padding-bottom: 32px;
        padding-top: 26px
    }

    .message-inner::before {
        content: " ";
        width: 18px;
        height: 18px;
        background: url(../images/svg/icon-quote.svg) top center no-repeat;
        background-size: auto;
        background-size: 100%;
        position: absolute;
        left: -30px;
        top: 2px
    }

    .w-desk {
        display: none !important
    }

    #accordionWhy .accordion-item {
        padding-left: 0;
        padding-right: 0
    }

    #accordionWhy .accordion-button:not(.collapsed) {
        position: relative
    }

    .wrp-according-catalog #accordionWhy .accordion-button::after {
        display: none
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed)::before {
        width: 100%;
        height: 2px;
        background: linear-gradient(to right, #4c1a02 0, #582005 7%, #7a310d 18%, #82330c 27%, #9b4011 37%, #cc6b35 54%, #df7d44 77%, #e18750 100%) !important;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        position: absolute;
        bottom: 0;
        display: block;
        z-index: 4;
        content: " "
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed) {
        background: var(--white-one);
        color: var(--bs-accordion-active-color)
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed) .tabulation-title h3 {
        color: var(--gray-950)
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed) .tabulation-title h3 {
        transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
        transition-duration: .6s;
        transition: all .4s;
        color: #e18750;
        background: #541e04;
        background: linear-gradient(to right, #541e04 0, #84340c 28%, #943a0c 51%, #df7c43 63%, #e0834b 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background: #541e04;
        background: linear-gradient(to top, #541e04 0, #84340c 16%, #943a0c 40%, #df7c43 57%, #e0834b 100%);
        background-clip: border-box;
        background-clip: border-box;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent
    }

    .left-col-footer {
        width: 100%;
        padding-bottom: 6px
    }

    .center-col-footer {
        width: 100%
    }

    .frame-maps-griya {
        width: 100%;
        min-height: 210px;
        margin-top: 33px;
        margin-bottom: 32px
    }

    .frame-maps-griya iframe {
        height: 194px !important
    }

    .right-col-footer {
        width: 100%
    }

    .left-col-footer .w-100:nth-child(2) .contain-contacts {
        width: 100%;
        padding: 4px 0 6.6px 0
    }

    .left-col-footer .w-100:last-child .contain-contacts {
        padding: 10px 0 14px 0
    }

    .right-col-footer {
        min-height: 201px;
        margin-bottom: 11px
    }

    .right-col-footer ul {
        margin-top: 3px;
        margin-bottom: 0
    }

    .right-col-footer ul li a {
        padding: 8px 0
    }

    .right-col-footer .row:first-child {
        height: 124.5px !important
    }

    .footer-row-one {
        padding: 34px 0 25px 0
    }

    .footer {
        width: 100%;
        height: auto;
        min-height: 124px;
        padding: 18px 0 0 0;
        background: url('../images/footer-background-texture_1_1.png') no-repeat, linear-gradient(45deg, #0e1a10 0, #0f1d11 64%, #132011 100%);
        background-position-y: -5px;
        background-position-x: 102%;
        background-size: 90.76%
    }
}

@media only screen and (min-device-width:768px) and (max-device-width:768px) and (orientation:portrait) {
    .description-detail-project {
        width: 100%;
        min-height: 366px
    }

    .frame-maps-griya {
        width: 100%;
        margin-top: 33px;
        margin-bottom: 32px
    }

    .form-contact-us .wrp-submit-cv {
        padding-bottom: 48px
    }

    .message-presiden {
        position: absolute;
        top: 50%;
        left: 30%;
        transform: translate(-50%, -50%);
        width: 58%
    }

    .our-services-contents .col-md-7 {
        width: 100%
    }

    .our-services-contents .col-md-5 {
        width: 100%
    }

    .our-services-contents .row:nth-child(3) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(3) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(5) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(5) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(7) .col-md-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(7) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row.gutter--45.align-items-center.position-relative {
        min-height: 766px;
        height: 100% !important;
        padding: 30px 0 32px 0;
        border: 4px solid #fff;
        border: 4px solid transparent;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: space-between;
        -ms-justify-content: space-between;
        -moz-justify-content: space-between;
        -webkit-justify-content: space-between
    }
}

@media screen and (min-device-width:481px) and (max-device-width:539px) {
    .centered-container {
        max-width: 100%
    }

    .logo-brand {
        width: 98px;
        order: 1
    }

    .navbar-align-right .wrp-nav-item {
        display: none
    }

    .navbar-align-right {
        min-width: 106px;
        order: 2
    }

    .burger-mobile {
        display: flex
    }

    .burger-mobile .hamburger {
        padding: 8px 4px 6px 4px
    }

    .burger-mobile .hamburger {
        margin-top: 4.64px;
        margin-right: 4.64px
    }

    .weather-search-result {
        width: 100%;
        left: 0
    }

    .logo-brand {
        order: 1
    }

    .logo-brand-centered {
        order: 3;
        width: 100%;
        padding-top: 12px;
        padding-bottom: 5px
    }

    .container-large {
        max-width: 100%
    }

    .logo-brand {
        width: 220px
    }

    .navbar-flex {
        padding-left: 0;
        padding-right: 0
    }

    .wrp-burger-menu {
        order: 2;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center
    }

    .wrp-content-maps.unfull {
        min-width: 100%;
        max-width: 100%
    }

    .form-contact-us .wrp-submit-cv {
        padding-bottom: 48px
    }

    .navbar-desc {
        position: fixed;
        width: 100vw !important
    }

    .navbar-mobile.active {
        background: var(--white-one);
        visibility: visible;
        z-index: 9
    }

    .burger-mobile {
        display: flex
    }

    .navbar-align-right {
        min-width: 112px;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        -ms-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -webkit-justify-content: flex-end;
        margin-right: -15px
    }

    .navbar-align-right .wrp-nav-item {
        display: none
    }

    .search-navbar {
        margin-right: 14px
    }

    .separate-menu {
        width: 100%;
        display: block;
        border-bottom: 1px solid #efefef;
        padding: 18px 0 18px 0;
        color: #73767a;
        font-size: 12px;
        line-height: 18px;
        text-transform: uppercase;
        letter-spacing: .45px;
        cursor: pointer;
        position: relative
    }

    .separate-menu::before {
        content: " + ";
        position: absolute;
        right: 15px;
        top: 15px;
        width: 12px;
        height: 12px;
        font-size: 22px
    }

    .navbar-mobile {
        width: 100vw;
        height: auto;
        min-height: 99.96%;
        max-height: 100%;
        background: var(--gray-950);
        top: 0;
        position: fixed;
        z-index: 1;
        display: flex;
        overflow-y: scroll;
        visibility: hidden
    }

    .wrp-navbar-mobile {
        width: 100%;
        height: auto;
        display: block
    }

    .navbar-mobile .account-session-user {
        margin-top: 10px
    }

    .container-mobile {
        padding: 96px 15px 0 15px
    }

    .wrp-mobile-item {
        display: block;
        width: 100%;
        height: 84vh;
        position: relative;
        background: var(--white-one);
        z-index: 5;
        opacity: 0;
        margin-top: unset;
        margin-bottom: -40px;
        padding: 15px 0 15px 0
    }

    .wrp-mobile-item.active {
        opacity: 1;
        transition: all .5s;
        top: 0;
        margin-top: 0;
        transform: translateY(-20px);
        -webkit-transition: 1s ease-in-out;
        -moz-transition: 1s ease-in-out;
        -o-transition: 1s ease-in-out;
        transition: .5s ease-in-out;
        margin-bottom: unset;
        margin-bottom: 76px
    }

    .bottom-nav-mobile {
        width: 100%;
        display: block;
        position: fixed;
        background: #fcfcfb;
        min-height: 64px;
        padding: 5px 0;
        box-shadow: 0 10px 25px 4px rgba(0, 0, 0, .15);
        -ms-box-shadow: 0 10px 25px 4px rgba(0, 0, 0, .15);
        left: 0;
        bottom: 0;
        z-index: 3
    }

    .wrp-bottom-nav-icon {
        width: 100%;
        height: auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
        -ms-justify-content: space-around
    }

    .item-bottom-nav-icon {
        width: 20%;
        height: auto
    }

    .item-bottom-nav-icon a {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        text-decoration: none;
        color: #adafae;
        padding: 8.5px 0 8.5px 0
    }

    .item-bottom-nav-icon a.active {
        color: #385623
    }

    .mobile-icon {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center
    }

    .accordionMenu {
        width: 100%;
        height: auto;
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 24px;
        margin-bottom: 56px
    }

    .accordionMenu {
        width: 100%;
        height: auto
    }

    .accordionMenu a {
        padding: 16px 0 17px 0;
        width: 100%;
        height: auto;
        display: block;
        color: var(--gray-950);
        position: relative;
        text-decoration: none
    }

    .menu-head-accordions {
        width: 100%;
        height: auto;
        padding: 10px 0;
        color: var(--gray-950);
        font: normal 400 clamp(0.915rem, 0.8036rem + 0.5571vw, 0.9913rem) var(--font-arial);
        letter-spacing: .35px;
        text-transform: normal;
        cursor: pointer;
        border-bottom: 1px solid var(--blue-800)
    }

    .accordionMenu ul.sub-menu-child {
        list-style: none;
        padding-left: 0;
        margin-bottom: 6px
    }

    .has-submenu-child {
        height: auto;
        position: relative
    }

    .has-submenu-child::before {
        content: " ";
        position: absolute;
        right: 34px;
        top: 19px;
        width: 12px;
        height: 12px;
        background: url(../images/svg/caret-arrow-down-black.svg) top center no-repeat;
        background-size: auto;
        background-size: auto;
        background-size: 100%;
        -webkit-filter: invert(100%);
        filter: invert(0%)
    }

    .section-desk-nav.active {
        position: fixed;
        background: var(--white-one);
        z-index: 11
    }

    .section-desk-nav.active .logo-brand a svg path.st0 {
        fill: var(--blue-two);
        -moz-transition: .5s;
        -ms--transition: 0.5s;
        -webkit-transition: .5s;
        -o-transition: .5s
    }

    .section-desk-nav.active .logo-brand a svg path.st1 {
        fill: var(--orange-500);
        -moz-transition: .5s;
        -ms--transition: 0.5s;
        -webkit-transition: .5s;
        -o-transition: .5s
    }

    .section-desk-nav.active .logo-brand a svg polygon.st0 {
        fill: var(--blue-two);
        -moz-transition: .5s;
        -ms--transition: 0.5s;
        -webkit-transition: .5s;
        -o-transition: .5s
    }

    .section-desk-nav.active #dropdownLangdesk::after {
        background-color: var(--black-100);
        color: var(--black-100)
    }

    .section-desk-nav.active #dropdownLangdesk {
        color: var(--black-100)
    }

    .thumb-of-projects a {
        min-height: 156px
    }

    .card-projects-thumb {
        width: 100%;
        min-height: 156px
    }

    .row.gutter--p25 .col-sm-6:nth-child(12),
    .row.gutter--p25 .col-sm-6:nth-child(15),
    .row.gutter--p25 .col-sm-6:nth-child(18),
    .row.gutter--p25 .col-sm-6:nth-child(3),
    .row.gutter--p25 .col-sm-6:nth-child(6),
    .row.gutter--p25 .col-sm-6:nth-child(9) {
        flex: 0 0 auto;
        width: 100%
    }

    .row.gutter--p25 .col-sm-6:nth-child(12) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(15) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(3) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(6) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(9) .card-projects-thumb {
        width: 100%;
        min-height: 236px;
        max-height: 236px
    }

    .header {
        overflow: hidden
    }

    .header-content,
    .main-wrapper,
    .nav-header {
        overflow: hidden
    }

    .accordionMenu ul.sub-menu-child li:first-child {
        margin-top: 10px
    }

    .accordionMenu ul.sub-menu-child li a {
        font: normal 400 17.24px/25.64px var(--font-arial);
        padding: 14px 10px 15px 3px !important
    }

    .has-submenu-child::before {
        content: " ";
        position: absolute;
        right: 8px;
        top: 18px
    }

    .row-card-people .wrp-card-people::before {
        content: " ";
        position: absolute;
        right: -12.5px;
        top: 1px
    }

    .img-wrapper-icon {
        width: 22px;
        height: 26px
    }

    .img-wrapper-icon svg {
        max-width: 100%;
        fill: #1C3C6F
    }

    .text-wrapper-icon {
        font-size: 13.5px;
        line-height: 14px;
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center
    }

    .text-wrapper-icon p {
        margin-top: 3px;
        margin-bottom: 3px
    }

    .mobile-icon {
        height: auto
    }

    .navbar-flex {
        align-items: center;
        -ms-align-items: center;
        -moz-align-items: center;
        -webkit-align-items: center
    }

    .gutter--m25.container,
    .gutter--m25.container-fluid,
    .gutter--m25.container.centered-container,
    .gutter--m25.customized-container,
    .gutter--m25.row {
        margin-left: -2.5px !important;
        margin-right: -2.5px !important
    }

    .gutter--m25>[class^=col-] {
        padding-left: 2.5px !important;
        padding-right: 2.5px !important
    }

    .card-related-projects {
        width: 100%;
        min-height: 109px;
        max-height: 114px
    }

    .row-card-people {
        gap: 24px 24px;
        margin-top: 11px
    }

    .wrp-card-people {
        width: 46.24%
    }

    .section-home-clients {
        padding: 32px 0 54px 0
    }

    .card-photo-people {
        width: 100%;
        min-height: 180px;
        margin-bottom: 18px
    }

    .card-photo-detail {
        margin-bottom: 24px
    }

    .action-button .button-dialog-socmed-outline {
        padding-left: 0;
        padding-right: 0
    }

    .row-projects {
        content: "";
        margin-top: 11px
    }

    .title-projects-home h2 {
        letter-spacing: -.2px
    }

    .section-home-people {
        padding: 8px 0 20px 0
    }

    .row-projects.container,
    .row-projects.container-fluid,
    .row-projects.row {
        margin-left: -4px;
        margin-right: -4px
    }

    .row-projects>[class^=col-] {
        padding-left: 4px;
        padding-right: 4px
    }

    .card-home-projects {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 248px;
        max-height: 249px;
        overflow: hidden
    }

    .right-col-footer {
        padding-left: 0
    }

    .accordionMenu ul.sub-menu-child li a {
        font: normal 400 clamp(0.915rem, 0.8036rem + 0.5571vw, 0.9913rem) var(--font-arial)
    }

    .wrp-card-services {
        display: none
    }

    .section-home-services {
        width: 100%;
        min-height: 424px;
        height: auto;
        display: flex;
        flex-wrap: wrap;
        padding: 56px 0 43px 0
    }

    .containt-presiden {
        width: 100%;
        min-height: 212px;
        background: #b9b9b7
    }

    .presiden-message-photo {
        width: 100%;
        min-height: 212px;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        flex-direction: column;
        overflow: hidden
    }

    .presiden-message-photo img {
        max-width: 118%;
        object-fit: contain;
        left: -12.64%;
        top: -4.86%;
        position: relative
    }

    .presiden-message-photo img {
        max-width: 118%;
        object-fit: contain;
        left: -12.64%;
        top: -4.86%;
        position: relative
    }

    .message-presiden {
        position: relative;
        top: 0;
        left: 0;
        transform: translate(0, 0)
    }

    .message-text {
        width: 100%;
        padding-left: 56px;
        padding-left: 30px;
        padding-right: 4px;
        padding-bottom: 30px;
        padding-top: 24px
    }

    .section-hero-mobile {
        width: 100%;
        min-height: 480px;
        background: var(--white-one);
        padding-top: 5px;
        padding-bottom: 5px
    }

    #accordionSubcatalog {
        padding: 0
    }

    .wrp-according-catalog {
        width: 100%;
        height: auto;
        margin-top: 11px
    }

    .row-grid {
        padding-left: 5px;
        padding-right: 5px
    }

    .row-grid-5.container,
    .row-grid-5.container-fluid,
    .row-grid-5.customized-container,
    .row-grid-5.row {
        margin-left: -2.5px;
        margin-right: -2.5px
    }

    .row-grid-5>[class^=col-] {
        padding-left: 2.5px;
        padding-right: 2.5px
    }

    .home-project-portraite {
        background: var(--gray-200);
        width: 100%;
        min-height: 221px;
        max-height: 221px !important;
        overflow: hidden !important;
        position: relative
    }

    .home-project-landscape {
        background: var(--gray-200);
        width: 100%;
        min-height: 176px;
        max-height: 176px !important;
        overflow: hidden !important;
        position: relative
    }

    .row-projects .col-lg-3.col-md-4:nth-last-child(3) .more-projects-home {
        margin-top: 18px;
        margin-bottom: 56.64px
    }

    .row-projects .col-lg-3.col-md-4:nth-last-child(4) .more-projects-home {
        margin-top: 18px;
        margin-bottom: 56.64px
    }

    .card-services-why {
        order: 1
    }

    .card-why-ssi {
        order: 2
    }

    .card-services-why {
        min-height: 286px;
        height: auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        align-items: center;
        -ms-align-items: center;
        -moz-align-items: center;
        -webkit-align-items: center;
        width: 100%
    }

    .card-services-why .choosed-icon::before {
        content: '';
        background: rgba(255, 255, 255, 0) 0, -o-linear-gradient(230deg, rgba(255, 136, 0, .36) 52.09%);
        background: linear-gradient(-140deg, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 52.09%);
        background: #cf0000;
        background: linear-gradient(140deg, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 52.09%);
        background: linear-gradient(to bottom, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(45deg, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(135deg, rgba(255, 255, 255, 0) 0, rgba(255, 136, 0, .46) 100%);
        opacity: .5;
        position: absolute;
        top: -24%;
        -webkit-transform: translateY(-50%) rotate(-45deg);
        transform: rotate(45deg);
        width: 186px;
        height: 186px;
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        left: -23%;
        right: 0
    }

    .item-list-choosed {
        min-height: 24px;
        padding: 15px 15px
    }

    .card-services-why .choosed-icon {
        width: 124px;
        height: auto;
        top: unset;
        position: relative;
        z-index: 3
    }

    .card-services-why .choosed-icon img {
        max-width: 100%;
        position: relative;
        top: -4px
    }

    .mconron {
        width: 100%;
        height: auto;
        min-height: 221px;
        max-height: 221px !important;
        background: #ddd
    }

    .slideconron {
        position: relative;
        width: 100%;
        min-height: 221px;
        max-height: 221px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconron {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconron.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .mctwron {
        width: 100%;
        height: auto;
        min-height: 221px;
        max-height: 221px !important;
        background: #ddd
    }

    .slidectwron {
        position: relative;
        width: 100%;
        min-height: 221px;
        max-height: 221px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemctwron {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 2s ease-in-out, transform 9.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemctwron.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .mconrtw {
        width: 100%;
        height: auto;
        min-height: 176px;
        max-height: 176px !important;
        background: #ddd
    }

    .slideconrtw {
        position: relative;
        width: 100%;
        min-height: 176px;
        max-height: 176px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconrtw {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 2s ease-in-out, transform 9.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconrtw.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-portraite-38 {
        width: 100%;
        min-height: 190px;
        max-height: 190px !important
    }

    .mconrth {
        width: 100%;
        height: auto;
        min-height: 190px;
        max-height: 190px !important;
        background: #ddd
    }

    .slideconrth {
        position: relative;
        width: 100%;
        min-height: 190px;
        max-height: 190px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconrth {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconrth.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-landscape-62 {
        width: 100%;
        min-height: 190px;
        max-height: 190px !important
    }

    .mctwrth {
        width: 100%;
        height: auto;
        min-height: 190px;
        max-height: 190px !important;
        background: #ddd
    }

    .slidectwrth {
        position: relative;
        width: 100%;
        min-height: 190px;
        max-height: 190px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemctwrth {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemctwrth.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-equilateral {
        width: 100%;
        min-height: 190px;
        max-height: 190px !important
    }

    .mconrfr {
        width: 100%;
        height: auto;
        min-height: 190px;
        max-height: 190px !important;
        background: #ddd
    }

    .slideconrfr {
        position: relative;
        width: 100%;
        min-height: 194px;
        max-height: 194px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconrfr {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconrfr.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-equilateral {
        width: 100%;
        min-height: 190px;
        max-height: 190px !important
    }

    .mctwrfr {
        width: 100%;
        height: auto;
        min-height: 190px;
        max-height: 190px !important;
        background: #ddd
    }

    .slidectwrfr {
        position: relative;
        width: 100%;
        min-height: 194px;
        max-height: 194px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemctwrfr {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemctwrfr.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .scale-detail-projects .row {
        display: flex;
        flex-wrap: wrap
    }

    .scale-detail-projects .row .col-lg-4.col-md-4.col-sm-6.col-12 {
        flex: 0 0 auto;
        width: 33.333%
    }

    .number-projects h2 {
        font: normal 600 clamp(0.9775rem, 0.6025rem + 1.875vw, 1.165rem) var(--font-arial)
    }

    .number-projects h3 {
        font: normal 400 clamp(0.8275rem, 0.6525rem + 0.875vw, 0.915rem) var(--font-arial);
        min-height: 32.64px;
        display: flex;
        flex-wrap: wrap;
        align-items: end;
        -ms-align-items: end;
        -moz-align-items: end;
        -webkit-align-items: end;
        margin-bottom: 3.5px
    }

    .psliderfiveth,
    .psliderfourth,
    .psliderone,
    .psliderthree,
    .pslidertwo {
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespone,
    .slidespone.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidesptwo,
    .slidesptwo.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespthree,
    .slidespthree.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespfourth,
    .slidespfourth.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespfiveth,
    .slidespfiveth.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .center-column-residential {
        min-height: 64px
    }

    .center-column-residential .thumb-of-projects a .card-projects-thumb {
        width: 100%;
        min-height: 64px
    }

    .projects-list-residential .row.gutter--p25 .left-column-residential {
        width: 33.33%;
        min-height: 104px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:first-child {
        width: 33.33%
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(2) {
        width: 33.33%
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(3) {
        width: 33.33%
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(4) {
        width: 60%
    }

    .projects-list-residential .row.gutter--p25 .right-column-residential {
        width: 40%;
        min-height: 156px
    }

    .thumb-of-projects a {
        max-height: 186px
    }

    .projects-list-residential .row.gutter--p25 .left-column-residential .thumb-of-projects a {
        min-height: 102px;
        max-height: 102px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(2) .thumb-of-projects a {
        min-height: 102px;
        max-height: 102px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(3) .thumb-of-projects a {
        min-height: 102px;
        max-height: 102px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(4) .thumb-of-projects a {
        min-height: 157px;
        max-height: 160px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(4) .thumb-of-projects a img {
        margin-top: -18px;
        position: relative
    }

    .projects-list-residential .row.gutter--p25 .right-column-residential .thumb-of-projects a {
        min-height: 157px;
        max-height: 160px
    }

    .table-residential-housing thead tr th:first-child {
        padding-left: 0
    }

    .table-residential-housing thead tr th:nth-child(3) {
        padding-right: 0
    }

    .table-residential-housing tbody tr td:first-child {
        padding-left: 0
    }

    .table-residential-housing tbody tr td:nth-child(3) {
        padding-right: 0
    }

    .projects-list.projects-list-residential {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center
    }

    .special-residential {
        padding-left: 1px;
        padding-right: 1px
    }

    .portraite-column-projects-home {
        background: var(--gray-100);
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
        padding: 2px
    }

    .landscape-column-projects-home {
        background: var(--gray-100);
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        padding: 2px
    }

    .portraite-column-projects-home-38 {
        background: var(--gray-100);
        -ms-flex: 0 0 38%;
        flex: 0 0 38%;
        max-width: 38%;
        padding: 2px
    }

    .portraite-column-projects-home-62 {
        background: var(--gray-100);
        -ms-flex: 0 0 62%;
        flex: 0 0 62%;
        max-width: 62%;
        padding: 2px
    }

    .title-section-home h2 {
        font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-spectral)
    }

    .wrp-according-catalog .accordion-button {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 1px solid var(--gray-600);
        border-bottom: 1px solid var(--gray-100);
        border-left: 1px solid var(--white-one);
        border-right: 1px solid var(--white-one)
    }

    #accordionCatalog .accordion-button:first-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionCatalog .accordion-button {
        padding: 10px 8px 9px 8px
    }

    #accordionWhy .accordion-button:first-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionWhy .accordion-button {
        padding: 10px 8px 9px 8px
    }

    .card-services-desc {
        padding: 10px 8px 9px 8px
    }

    .card-services-desc p {
        margin-bottom: 8.5px
    }

    .card-services-images figure {
        padding: 0 8px 0 8px
    }

    #accordionCatalog .accordion-button:last-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionWhy .accordion-button:last-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionSubcatalog .accordion-button {
        background: var(--gray-100);
        border: 0
    }

    #accordionSubcatalog .accordion-item {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 1px solid var(--gray-100);
        border-bottom: 1px solid var(--gray-200);
        border-left: 1px solid var(--gray-100);
        border-right: 1px solid var(--gray-100);
        background: var(--gray-100)
    }

    #accordionSubcatalog .accordion-item .accordion-button {
        padding-left: 10px;
        padding-right: 10px
    }

    #accordionSubcatalog .accordion-item:first-child .accordion-button {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 0 solid var(--gray-100);
        border-bottom: 1px solid var(--gray-100);
        border-left: 0 solid var(--gray-100);
        border-right: 0px solid var(--gray-100);
        background: var(--gray-100)
    }

    .services-items a {
        padding: 6px 0
    }

    #accordionSubcatalog .accordion-item:last-child .accordion-button {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 1px solid var(--gray-100);
        border-bottom: 0 solid var(--white-one);
        border-left: 0 solid var(--white-one);
        border-right: 0px solid var(--white-one)
    }

    .wrp-according-catalog .accordion-button:not(.collapsed) {
        background-color: var(--white-one)
    }

    .wrp-according-catalog .accordion-button {
        border-radius: 0;
        padding-left: 0;
        padding-right: 0
    }

    #accordionCatalog {
        border: 2px solid var(--gray-100);
        border-radius: 0
    }

    #accordionCatalog .accordion-item .accordion-header {
        padding: 0 0
    }

    #accordionWhy {
        border: 2px solid var(--gray-100);
        border-radius: 0
    }

    #accordionWhy .accordion-item .accordion-header {
        padding: 0 0
    }

    .wrp-according-catalog .accordion-item {
        border: 1px solid #cf0000 !important;
        border-radius: 16.64px
    }

    #accordionCatalog .accordion-item {
        border-radius: 0;
        border: 0 solid var(--white-one) !important;
        padding-left: 6px;
        padding-right: 6px
    }

    #accordionCatalog .accordion-item:first-child {
        border-radius: 16.64px 16.64px 0 0
    }

    #accordionCatalog .accordion-item:last-child {
        border-radius: 0 0 16.64px 16.64px
    }

    #accordionWhy .accordion-item {
        border-radius: 0;
        border: 0 solid var(--white-one) !important;
        padding-left: 6px;
        padding-right: 6px
    }

    #accordionWhy .accordion-item:first-child {
        border-radius: 16.64px 16.64px 0 0
    }

    #accordionWhy .accordion-item:last-child {
        border-radius: 0 0 16.64px 16.64px
    }

    .wrp-according-catalog .accordion-body.accordion-body-catalog {
        border: 1px solid #fff !important;
        padding: 4px 0;
        display: flex;
        flex-wrap: wrap
    }

    #accordionSubcatalog .accordion-item {
        border-radius: 0;
        border-bottom: 1px solid var(--gray-200) !important
    }

    #accordionSubcatalog .accordion-item:last-child {
        border-bottom: 0 solid var(--gray-200) !important
    }

    .wrp-according-catalog .accordion-button::after {
        display: none
    }

    .wrp-scroll-horizontal {
        width: 100%;
        min-height: 156px;
        overflow-x: scroll
    }

    .row-catalog-mobile {
        display: inline-flex;
        flex-wrap: nowrap;
        overflow-x: scroll
    }

    .row-catalog-mobile.container,
    .row-catalog-mobile.container-fluid,
    .row-catalog-mobile.row {
        margin-left: -8px;
        margin-right: -8px
    }

    .row-catalog-mobile>[class^=col-] {
        padding-left: 8px;
        padding-right: 8px
    }

    .row-catalog-mobile .col-12.column-sm-news {
        flex: 0 0 auto;
        width: 314px !important
    }

    .wrp-according-subcatalog .accordion-button h4 {
        color: var(--gray-950);
        font: normal 600 clamp(1.125rem, 0.9964rem + 0.6431vw, 1.2275rem) var(--font-poppins)
    }

    .wrp-according-subcatalog #accordionSubcatalog .accordion-button h4 {
        color: var(--gray-950);
        font: normal 600 15.64px/24.64px var(--font-poppins);
        margin-bottom: .6px
    }

    .card-services-desc {
        min-height: 114px;
        max-height: unset
    }

    .tabulation-title h3 {
        color: var(--gray-950);
        font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-spectral);
        margin-bottom: 0;
        line-height: 22.64px
    }

    #accordionCatalog .accordion-pluss {
        position: relative;
        width: 100%;
        min-height: 32px
    }

    #accordionCatalog .accordion-pluss::after {
        display: block;
        position: absolute;
        content: "";
        right: 10px;
        background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M8 0a1 1 0 0 1 1 1v6h6a1 1 0 1 1 0 2H9v6a1 1 0 1 1-2 0V9H1a1 1 0 0 1 0-2h6V1a1 1 0 0 1 1-1z' clip-rule='evenodd'/%3e%3c/svg%3e") !important;
        background-size: 80% !important
    }

    #accordionCatalog .accordion-pluss:not(.collapsed)::after {
        display: block;
        position: absolute;
        content: "";
        right: 10px;
        background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M0 8a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H1a1 1 0 0 1-1-1z' clip-rule='evenodd'/%3e%3c/svg%3e") !important;
        background-size: 80% !important
    }

    #accordionSubcatalog .accordion-button::after {
        display: block;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
        background-size: 86% !important
    }

    #accordionSubcatalog .accordion-button:not(.collapsed)::after {
        display: block;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
        transform: rotate(-180deg) !important;
        background-size: 86% !important
    }

    .tabulation-title {
        width: 84.14%
    }

    .tabultaion-with-icon {
        min-width: 314px;
        max-width: 314px;
        min-height: 26px;
        display: flex;
        flex-wrap: wrap
    }

    #accordionWhy .accordion-item {
        padding-left: 0;
        padding-right: 0
    }

    #accordionWhy .accordion-button:not(.collapsed) {
        position: relative
    }

    .wrp-according-catalog #accordionWhy .accordion-button::after {
        display: none
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed)::before {
        width: 100%;
        height: 2px;
        background: linear-gradient(to right, #4c1a02 0, #582005 7%, #7a310d 18%, #82330c 27%, #9b4011 37%, #cc6b35 54%, #df7d44 77%, #e18750 100%) !important;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        position: absolute;
        bottom: 0;
        display: block;
        z-index: 4;
        content: " "
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed) {
        background: var(--white-one);
        color: var(--bs-accordion-active-color)
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed) .tabulation-title h3 {
        color: var(--gray-950)
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed) .tabulation-title h3 {
        transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
        transition-duration: .6s;
        transition: all .4s;
        color: #e18750;
        background: #541e04;
        background: linear-gradient(to right, #541e04 0, #84340c 28%, #943a0c 51%, #df7c43 63%, #e0834b 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background: #541e04;
        background: linear-gradient(to top, #541e04 0, #84340c 16%, #943a0c 40%, #df7c43 57%, #e0834b 100%);
        background-clip: border-box;
        background-clip: border-box;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent
    }

    .left-title-section {
        display: none
    }

    .left-table-of-content ul {
        top: unset
    }

    .section-detail-project.special-case-gandaria .row.detail-odd {
        text-decoration: none
    }

    .section-detail-project.special-case-gandaria .row.detail-even .col-sm-12.col-12:first-child {
        order: 2
    }

    .section-detail-project.special-case-gandaria .row.detail-even .col-sm-12.col-12:last-child {
        order: 1
    }

    .our-services-contents .row:first-child .col-sm-7 {
        order: 2
    }

    .our-services-contents .row:first-child .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(2) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(2) .col-md-5.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(3) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(3) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(5) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(5) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(7) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(7) .col-md-5.col-12 {
        order: 2
    }

    .wrp-services-list {
        margin-bottom: 20px
    }

    .row-modal-people {
        display: flex;
        flex-wrap: wrap;
        margin-top: -1px;
        flex-direction: column
    }

    .people-social-network {
        display: none
    }

    #modalseePeople .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople1 .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople2 .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople3 .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople4 .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople5 .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople6 .modal-dialog-people {
        margin-top: 36px
    }

    .modal-dialog-people {
        max-width: 100%;
        padding-left: 5px;
        padding-right: 5px
    }

    .side-left-people {
        max-width: 100%;
        flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        height: 100vh;
        background: transparent none;
        padding-right: 0
    }

    .wrp-content-dialog {
        padding: 24px 20px 5px 26px
    }

    .button-dialog-socmed-outline a {
        cursor: pointer
    }

    .side-right-people {
        display: flex;
        flex-wrap: wrap;
        max-width: 100%;
        flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        background: #fff;
        background: transparent none
    }

    .summary-about {
        max-width: 100%
    }

    .card-head-about {
        width: 276px
    }

    .president-photos {
        width: 100%;
        padding-bottom: 24px;
        padding-top: 15px
    }

    .message-text {
        width: 100%;
        padding-left: 50px;
        padding-right: 4px;
        padding-bottom: 30px
    }

    .section-hero-images {
        display: none
    }

    .section-hero-images-mobile {
        display: flex;
        width: 100%;
        min-height: 224px;
        background: #efefef
    }

    .description-detail-project {
        width: 100%;
        min-height: 32px
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-spectral)
    }

    .projects-list {
        padding: 35px 0 52.5px 0
    }

    .book-wrapper {
        position: relative;
        width: 100%;
        min-height: 432px
    }

    .book-container {
        width: 96%;
        height: 100%;
        margin-left: 0
    }

    .page-face.front.left-page {
        background-size: 86%;
        background-repeat: no-repeat
    }

    .page-face.back.right-page {
        background-size: 86%;
        background-repeat: no-repeat
    }

    .book-container {
        width: 46%;
        height: 52.5%;
        margin-left: 52%
    }

    .book-wrapper {
        height: 714px
    }

    .download-wrapper {
        width: 100%
    }

    .download-container {
        width: 100%
    }

    .left-col-footer {
        width: 100%;
        padding-bottom: 6px
    }

    .center-col-footer {
        width: 100%
    }

    .frame-maps-griya {
        width: 100%;
        min-height: 210px;
        margin-top: 33px;
        margin-bottom: 32px
    }

    .frame-maps-griya iframe {
        height: 194px !important
    }

    .right-col-footer {
        width: 100%
    }

    .left-col-footer .w-100:nth-child(2) .contain-contacts {
        width: 100%;
        padding: 4px 0 6.6px 0
    }

    .left-col-footer .w-100:last-child .contain-contacts {
        padding: 10px 0 14px 0
    }

    .right-col-footer {
        min-height: 201px;
        margin-bottom: 11px
    }

    .right-col-footer ul {
        margin-top: 3px;
        margin-bottom: 0
    }

    .right-col-footer ul li a {
        padding: 8px 0
    }

    .right-col-footer .row:first-child {
        height: 124.5px !important
    }

    .footer-row-one {
        padding: 34px 0 25px 0
    }

    .footer {
        width: 100%;
        height: auto;
        min-height: 124px;
        padding: 18px 0 0 0;
        background: #385623 url(../images/footer-background-texture_1_1.png) top right no-repeat;
        background-position-x: right;
        background-size: auto;
        background-size: 74.76%;
        background-position-x: 124%
    }
}

@media screen and (max-width :480px) {
    body {
        overflow-x: clip
    }

    #carouselExampleIndicators .carousel-control-next {
        width: 30%;
        background: rgba(255, 255, 255, 0);
        border-radius: 0;
        overflow: hidden;
        padding: 4px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        top: 0;
        right: -9%;
        opacity: .82;
        z-index: 5
    }

    #carouselExampleIndicators .carousel-control-next .carousel-control-next-icon {
        width: 1.4rem;
        height: 1.4rem;
        filter: invert(0%)
    }

    #carouselExampleIndicators .carousel-control-prev {
        width: 30%;
        background: rgba(255, 255, 255, 0);
        border-radius: 0;
        overflow: hidden;
        padding: 4px 8px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        top: 0;
        left: -9%;
        opacity: .82;
        z-index: 5
    }

    #carouselExampleIndicators .carousel-control-prev .carousel-control-prev-icon {
        width: 1.4rem;
        height: 1.4rem;
        filter: invert(0%)
    }

    .book-wrapper {
        overflow: hidden
    }

    .canvas-book-mobile {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        max-width: 100%;
        margin: 0 auto;
        height: auto !important
    }

    .centered-container {
        max-width: 100%
    }

    .section-home-clients .centered-container .row:nth-child(2) .slick-list {
        overflow: hidden
    }

    .logo-brand {
        width: 98px;
        order: 1
    }

    .navbar-align-right .wrp-nav-item {
        display: none
    }

    .navbar-align-right {
        min-width: 106px;
        order: 2
    }

    .burger-mobile {
        display: flex
    }

    .burger-mobile .hamburger {
        padding: 8px 4px 6px 4px
    }

    .burger-mobile .hamburger {
        margin-top: 4.64px;
        margin-right: 4.64px
    }

    .weather-search-result {
        width: 100%;
        left: 0
    }

    .logo-brand {
        order: 1
    }

    .logo-brand-centered {
        order: 3;
        width: 100%;
        padding-top: 12px;
        padding-bottom: 5px
    }

    .container-large {
        max-width: 100%
    }

    .logo-brand {
        width: 220px
    }

    .navbar-flex {
        padding-left: 0;
        padding-right: 0
    }

    .wrp-burger-menu {
        order: 2;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center
    }

    .wrp-content-maps.unfull {
        min-width: 100%;
        max-width: 100%
    }

    .navbar-desc {
        position: fixed;
        width: 100vw !important
    }

    .navbar-mobile.active {
        background: var(--white-one);
        visibility: visible;
        z-index: 9
    }

    .burger-mobile {
        display: flex
    }

    .navbar-align-right {
        min-width: 112px;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        -ms-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -webkit-justify-content: flex-end;
        margin-right: -15px
    }

    .navbar-align-right .wrp-nav-item {
        display: none
    }

    .search-navbar {
        margin-right: 14px
    }

    .separate-menu {
        width: 100%;
        display: block;
        border-bottom: 1px solid #efefef;
        padding: 18px 0 18px 0;
        color: #73767a;
        font-size: 12px;
        line-height: 18px;
        text-transform: uppercase;
        letter-spacing: .45px;
        cursor: pointer;
        position: relative
    }

    .separate-menu::before {
        content: " + ";
        position: absolute;
        right: 15px;
        top: 15px;
        width: 12px;
        height: 12px;
        font-size: 22px
    }

    .navbar-mobile {
        width: 100vw;
        height: auto;
        min-height: 99.96%;
        max-height: 100%;
        background: var(--gray-950);
        top: 0;
        position: fixed;
        z-index: 1;
        display: flex;
        overflow-y: scroll;
        visibility: hidden
    }

    .wrp-navbar-mobile {
        width: 100%;
        height: auto;
        display: block
    }

    .navbar-mobile .account-session-user {
        margin-top: 10px
    }

    .container-mobile {
        padding: 96px 15px 0 15px
    }

    .wrp-mobile-item {
        display: block;
        width: 100%;
        height: 84vh;
        position: relative;
        background: var(--white-one);
        z-index: 5;
        opacity: 0;
        margin-top: unset;
        margin-bottom: -40px;
        padding: 15px 0 15px 0
    }

    .wrp-mobile-item.active {
        opacity: 1;
        transition: all .5s;
        top: 0;
        margin-top: 0;
        transform: translateY(-20px);
        -webkit-transition: 1s ease-in-out;
        -moz-transition: 1s ease-in-out;
        -o-transition: 1s ease-in-out;
        transition: .5s ease-in-out;
        margin-bottom: unset;
        margin-bottom: 76px
    }

    .bottom-nav-mobile {
        width: 100%;
        display: block;
        position: fixed;
        background: #fcfcfb;
        min-height: 64px;
        padding: 5px 0;
        box-shadow: 0 10px 25px 4px rgba(0, 0, 0, .15);
        -ms-box-shadow: 0 10px 25px 4px rgba(0, 0, 0, .15);
        left: 0;
        bottom: 0;
        z-index: 3
    }

    .wrp-bottom-nav-icon {
        width: 100%;
        height: auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
        -ms-justify-content: space-around
    }

    .item-bottom-nav-icon {
        width: 20%;
        height: auto
    }

    .item-bottom-nav-icon a {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        text-decoration: none;
        color: #adafae;
        padding: 8.5px 0 8.5px 0
    }

    .item-bottom-nav-icon a.active {
        color: #385623
    }

    .mobile-icon {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center
    }

    .accordionMenu {
        width: 100%;
        height: auto;
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 24px;
        margin-bottom: 56px
    }

    .accordionMenu {
        width: 100%;
        height: auto
    }

    .accordionMenu a {
        padding: 16px 0 17px 0;
        width: 100%;
        height: auto;
        display: block;
        color: var(--gray-950);
        position: relative;
        text-decoration: none
    }

    .menu-head-accordions {
        width: 100%;
        height: auto;
        padding: 10px 0;
        color: var(--gray-950);
        font: normal 400 clamp(0.915rem, 0.8036rem + 0.5571vw, 0.9913rem) var(--font-arial);
        letter-spacing: .35px;
        text-transform: normal;
        cursor: pointer;
        border-bottom: 1px solid var(--blue-800)
    }

    .accordionMenu ul.sub-menu-child {
        list-style: none;
        padding-left: 0;
        margin-bottom: 6px
    }

    .has-submenu-child {
        height: auto;
        position: relative
    }

    .has-submenu-child::before {
        content: " ";
        position: absolute;
        right: 34px;
        top: 19px;
        width: 12px;
        height: 12px;
        background: url(../images/svg/caret-arrow-down-black.svg) top center no-repeat;
        background-size: auto;
        background-size: auto;
        background-size: 100%;
        -webkit-filter: invert(100%);
        filter: invert(0%)
    }

    .section-desk-nav.active {
        position: fixed;
        background: var(--white-one);
        z-index: 11
    }

    .section-desk-nav.active .logo-brand a svg path.st0 {
        fill: var(--blue-two);
        -moz-transition: .5s;
        -ms--transition: 0.5s;
        -webkit-transition: .5s;
        -o-transition: .5s
    }

    .section-desk-nav.active .logo-brand a svg path.st1 {
        fill: var(--orange-500);
        -moz-transition: .5s;
        -ms--transition: 0.5s;
        -webkit-transition: .5s;
        -o-transition: .5s
    }

    .section-desk-nav.active .logo-brand a svg polygon.st0 {
        fill: var(--blue-two);
        -moz-transition: .5s;
        -ms--transition: 0.5s;
        -webkit-transition: .5s;
        -o-transition: .5s
    }

    .section-desk-nav.active #dropdownLangdesk::after {
        background-color: var(--black-100);
        color: var(--black-100)
    }

    .section-desk-nav.active #dropdownLangdesk {
        color: var(--black-100)
    }

    .thumb-of-projects a {
        min-height: 142px
    }

    .card-projects-thumb {
        width: 100%;
        min-height: 120px
    }

    .projects-list {
        padding: 35px 0 52.5px 0
    }

    .row.gutter--p25 .col-sm-6:nth-child(12),
    .row.gutter--p25 .col-sm-6:nth-child(15),
    .row.gutter--p25 .col-sm-6:nth-child(18),
    .row.gutter--p25 .col-sm-6:nth-child(3),
    .row.gutter--p25 .col-sm-6:nth-child(6),
    .row.gutter--p25 .col-sm-6:nth-child(9) {
        flex: 0 0 auto;
        width: 100%
    }

    .row.gutter--p25 .col-sm-6:nth-child(12) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(15) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(3) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(6) .card-projects-thumb,
    .row.gutter--p25 .col-sm-6:nth-child(9) .card-projects-thumb {
        width: 100%;
        min-height: 236px;
        max-height: 236px
    }

    .header {
        overflow: hidden;
        position: sticky;
        top: 0
    }

    .header-content,
    .main-wrapper,
    .nav-header {
        overflow: hidden
    }

    .accordionMenu ul.sub-menu-child li:first-child {
        margin-top: 10px
    }

    .accordionMenu ul.sub-menu-child li a {
        font: normal 400 17.24px/25.64px var(--font-arial);
        padding: 14px 10px 15px 3px !important
    }

    .has-submenu-child::before {
        content: " ";
        position: absolute;
        right: 8px;
        top: 18px
    }

    .row-card-people .wrp-card-people::before {
        content: " ";
        position: absolute;
        right: -12.5px;
        top: 1px
    }

    .img-wrapper-icon {
        width: 22px;
        height: 26px
    }

    .img-wrapper-icon svg {
        max-width: 100%;
        fill: #1C3C6F
    }

    .text-wrapper-icon {
        font-size: 13.5px;
        line-height: 14px;
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center
    }

    .text-wrapper-icon p {
        margin-top: 3px;
        margin-bottom: 3px
    }

    .mobile-icon {
        height: auto
    }

    .navbar-flex {
        align-items: center;
        -ms-align-items: center;
        -moz-align-items: center;
        -webkit-align-items: center
    }

    .gutter--m25.container,
    .gutter--m25.container-fluid,
    .gutter--m25.container.centered-container,
    .gutter--m25.customized-container,
    .gutter--m25.row {
        margin-left: -2.5px !important;
        margin-right: -2.5px !important
    }

    .gutter--m25>[class^=col-] {
        padding-left: 2.5px !important;
        padding-right: 2.5px !important
    }

    .card-related-projects {
        width: 100%;
        min-height: 99px;
        max-height: 114px
    }

    .row-card-people {
        gap: 24px 24px;
        margin-top: 11px
    }

    .wrp-card-people {
        width: 46.24%
    }

    .section-home-clients {
        padding: 32px 0 54px 0
    }

    .card-photo-people {
        width: 100%;
        min-height: 180px;
        margin-bottom: 18px
    }

    .card-photo-detail {
        margin-bottom: 24px
    }

    .action-button .button-dialog-socmed-outline {
        padding-left: 0;
        padding-right: 0
    }

    .row-projects {
        content: "";
        margin-top: 11px
    }

    .title-projects-home h2 {
        letter-spacing: -.2px
    }

    .section-home-people {
        padding: 8px 0 20px 0
    }

    .row-projects.container,
    .row-projects.container-fluid,
    .row-projects.row {
        margin-left: -4px;
        margin-right: -4px
    }

    .row-projects>[class^=col-] {
        padding-left: 4px;
        padding-right: 4px
    }

    .card-home-projects {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 248px;
        max-height: 249px;
        overflow: hidden
    }

    .right-col-footer {
        padding-left: 0
    }

    .accordionMenu ul.sub-menu-child li a {
        font: normal 400 clamp(0.915rem, 0.8036rem + 0.5571vw, 0.9913rem) var(--font-arial)
    }

    .wrp-card-services {
        display: none
    }

    .section-home-services {
        width: 100%;
        min-height: 424px;
        height: auto;
        display: flex;
        flex-wrap: wrap;
        padding: 56px 0 43px 0
    }

    .section-hero-mobile {
        width: 100%;
        min-height: 480px;
        background: var(--white-one);
        padding-top: 5px;
        padding-bottom: 5px
    }

    #accordionSubcatalog {
        padding: 0
    }

    .wrp-according-catalog {
        width: 100%;
        height: auto;
        margin-top: 11px
    }

    .row-grid {
        padding-left: 5px;
        padding-right: 5px
    }

    .row-grid-5.container,
    .row-grid-5.container-fluid,
    .row-grid-5.customized-container,
    .row-grid-5.row {
        margin-left: -2.5px;
        margin-right: -2.5px
    }

    .row-grid-5>[class^=col-] {
        padding-left: 2.5px;
        padding-right: 2.5px
    }

    .home-project-portraite {
        background: var(--gray-200);
        width: 100%;
        min-height: 221px;
        max-height: 221px !important;
        overflow: hidden !important;
        position: relative
    }

    .home-project-landscape {
        background: var(--gray-200);
        width: 100%;
        min-height: 176px;
        max-height: 176px !important;
        overflow: hidden !important;
        position: relative
    }

    .row-projects .col-lg-3.col-md-4:nth-last-child(3) .more-projects-home {
        margin-top: 18px;
        margin-bottom: 56.64px
    }

    .row-projects .col-lg-3.col-md-4:nth-last-child(4) .more-projects-home {
        margin-top: 18px;
        margin-bottom: 56.64px
    }

    .card-services-why {
        min-height: 286px;
        height: auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        align-items: center;
        -ms-align-items: center;
        -moz-align-items: center;
        -webkit-align-items: center;
        order: 1
    }

    .card-why-ssi {
        order: 2
    }

    .card-services-why .choosed-icon::before {
        content: '';
        background: rgba(255, 255, 255, 0) 0, -o-linear-gradient(230deg, rgba(255, 136, 0, .36) 52.09%);
        background: linear-gradient(-140deg, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 52.09%);
        background: #cf0000;
        background: linear-gradient(140deg, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 52.09%);
        background: linear-gradient(to bottom, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(45deg, rgba(255, 136, 0, .36) 0, rgba(255, 255, 255, 0) 100%);
        background: linear-gradient(135deg, rgba(255, 255, 255, 0) 0, rgba(255, 136, 0, .46) 100%);
        opacity: .5;
        position: absolute;
        top: -24%;
        -webkit-transform: translateY(-50%) rotate(-45deg);
        transform: rotate(45deg);
        width: 186px;
        height: 186px;
        position: absolute;
        margin-left: auto;
        margin-right: auto;
        left: -23%;
        right: 0
    }

    .item-list-choosed {
        min-height: 24px;
        padding: 15px 15px
    }

    .card-services-why .choosed-icon {
        width: 124px;
        height: auto;
        top: unset;
        position: relative;
        z-index: 3
    }

    .card-services-why .choosed-icon img {
        max-width: 112%;
        position: relative
    }

    .containt-presiden {
        width: 100%;
        min-height: 212px;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: space-between;
        -ms-justify-content: space-between;
        -moz-justify-content: space-between;
        -webkit-justify-content: space-between
    }

    .presiden-message-photo {
        width: 100%;
        min-height: 212px;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center;
        flex-direction: column;
        overflow: hidden
    }

    .presiden-message-photo img {
        order: 2
    }

    .message-presiden {
        position: relative;
        top: 0;
        left: 0;
        transform: translate(0, 0);
        order: 1
    }

    .mconron {
        width: 100%;
        height: auto;
        min-height: 221px;
        max-height: 221px !important;
        background: #ddd
    }

    .slideconron {
        position: relative;
        width: 100%;
        min-height: 221px;
        max-height: 221px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconron {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconron.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .mctwron {
        width: 100%;
        height: auto;
        min-height: 221px;
        max-height: 221px !important;
        background: #ddd
    }

    .slidectwron {
        position: relative;
        width: 100%;
        min-height: 221px;
        max-height: 221px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemctwron {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 2s ease-in-out, transform 9.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemctwron.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .mconrtw {
        width: 100%;
        height: auto;
        min-height: 176px;
        max-height: 176px !important;
        background: #ddd
    }

    .slideconrtw {
        position: relative;
        width: 100%;
        min-height: 176px;
        max-height: 176px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconrtw {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 2s ease-in-out, transform 9.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconrtw.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-portraite-38 {
        width: 100%;
        min-height: 190px;
        max-height: 190px !important
    }

    .mconrth {
        width: 100%;
        height: auto;
        min-height: 190px;
        max-height: 190px !important;
        background: #ddd
    }

    .slideconrth {
        position: relative;
        width: 100%;
        min-height: 190px;
        max-height: 190px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconrth {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconrth.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-landscape-62 {
        width: 100%;
        min-height: 190px;
        max-height: 190px !important
    }

    .mctwrth {
        width: 100%;
        height: auto;
        min-height: 190px;
        max-height: 190px !important;
        background: #ddd
    }

    .slidectwrth {
        position: relative;
        width: 100%;
        min-height: 190px;
        max-height: 190px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemctwrth {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemctwrth.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-equilateral {
        width: 100%;
        min-height: 190px;
        max-height: 190px !important
    }

    .mconrfr {
        width: 100%;
        height: auto;
        min-height: 190px;
        max-height: 190px !important;
        background: #ddd
    }

    .slideconrfr {
        position: relative;
        width: 100%;
        min-height: 194px;
        max-height: 194px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemconrfr {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemconrfr.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .home-project-equilateral {
        width: 100%;
        min-height: 190px;
        max-height: 190px !important
    }

    .mctwrfr {
        width: 100%;
        height: auto;
        min-height: 190px;
        max-height: 190px !important;
        background: #ddd
    }

    .slidectwrfr {
        position: relative;
        width: 100%;
        min-height: 194px;
        max-height: 194px !important;
        overflow: hidden !important;
        overflow: hidden;
        background-repeat: no-repeat
    }

    .slidemctwrfr {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity 1s ease-in-out, transform 8.64s ease-in-out;
        transform: scale(1);
        z-index: 1
    }

    .slidemctwrfr.active {
        opacity: 1;
        transform: scale(1.1);
        z-index: 3
    }

    .psliderfiveth,
    .psliderfourth,
    .psliderone,
    .psliderthree,
    .pslidertwo {
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespone,
    .slidespone.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidesptwo,
    .slidesptwo.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespthree,
    .slidespthree.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespfourth,
    .slidespfourth.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .slidespfiveth,
    .slidespfiveth.active {
        position: relative;
        width: 100%;
        min-height: 336px;
        max-height: 336px !important
    }

    .scale-detail-projects .row {
        display: flex;
        flex-wrap: wrap;
        margin-left: -5px !important;
        margin-right: -5px !important
    }

    .scale-detail-projects .row>[class^=col-] {
        padding-left: 5px !important;
        padding-right: 5px !important
    }

    .scale-detail-projects .row .col-lg-4.col-md-4.col-sm-6.col-12 {
        flex: 0 0 auto;
        width: 33.333%
    }

    .number-projects h2 {
        font: normal 600 clamp(0.9775rem, 0.6025rem + 1.875vw, 1.165rem) var(--font-arial)
    }

    .number-projects h3 {
        font: normal 400 clamp(0.8275rem, 0.6525rem + 0.875vw, 0.915rem) var(--font-arial);
        min-height: 32.64px;
        display: flex;
        flex-wrap: wrap;
        align-items: end;
        -ms-align-items: end;
        -moz-align-items: end;
        -webkit-align-items: end;
        margin-bottom: 3.5px
    }

    .center-column-residential {
        min-height: 64px
    }

    .center-column-residential .thumb-of-projects a .card-projects-thumb {
        width: 100%;
        min-height: 64px
    }

    .projects-list-residential .row.gutter--p25 .left-column-residential {
        width: 33.33%;
        min-height: 104px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:first-child {
        width: 33.33%
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(2) {
        width: 33.33%
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(3) {
        width: 33.33%
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(4) {
        width: 60%
    }

    .projects-list-residential .row.gutter--p25 .right-column-residential {
        width: 40%;
        min-height: 156px
    }

    .thumb-of-projects a {
        max-height: 142px
    }

    .projects-list-residential .row.gutter--p25 .left-column-residential .thumb-of-projects a {
        min-height: 102px;
        max-height: 102px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(2) .thumb-of-projects a {
        min-height: 102px;
        max-height: 102px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(3) .thumb-of-projects a {
        min-height: 102px;
        max-height: 102px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(4) .thumb-of-projects a {
        min-height: 157px;
        max-height: 160px
    }

    .projects-list-residential .row.gutter--p25 .center-column-residential:nth-child(4) .thumb-of-projects a img {
        margin-top: -18px;
        position: relative
    }

    .projects-list-residential .row.gutter--p25 .right-column-residential .thumb-of-projects a {
        min-height: 157px;
        max-height: 160px
    }

    .table-residential-housing thead tr th:first-child {
        padding-left: 0
    }

    .table-residential-housing thead tr th:nth-child(3) {
        padding-right: 0
    }

    .table-residential-housing tbody tr td:first-child {
        padding-left: 0
    }

    .table-residential-housing tbody tr td:nth-child(3) {
        padding-right: 0
    }

    .projects-list.projects-list-residential {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center
    }

    .row.gutter--p25 .col-sm-6:nth-child(12) .thumb-of-projects a,
    .row.gutter--p25 .col-sm-6:nth-child(15) .thumb-of-projects a,
    .row.gutter--p25 .col-sm-6:nth-child(18) .thumb-of-projects a,
    .row.gutter--p25 .col-sm-6:nth-child(21) .thumb-of-projects a,
    .row.gutter--p25 .col-sm-6:nth-child(24) .thumb-of-projects a,
    .row.gutter--p25 .col-sm-6:nth-child(3) .thumb-of-projects a,
    .row.gutter--p25 .col-sm-6:nth-child(6) .thumb-of-projects a,
    .row.gutter--p25 .col-sm-6:nth-child(9) .thumb-of-projects a {
        width: 100%;
        min-height: 206px !important;
        height: 206px !important
    }

    .special-residential {
        padding-left: 1px;
        padding-right: 1px
    }

    .desc-people-home {
        width: 100%;
        line-height: 18.86px;
        height: 130px;
        display: -webkit-box;
        -webkit-line-clamp: 7;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis
    }

    .portraite-column-projects-home {
        background: var(--gray-100);
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
        padding: 2px
    }

    .landscape-column-projects-home {
        background: var(--gray-100);
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        padding: 2px
    }

    .portraite-column-projects-home-38 {
        background: var(--gray-100);
        -ms-flex: 0 0 38%;
        flex: 0 0 38%;
        max-width: 38%;
        padding: 2px
    }

    .portraite-column-projects-home-62 {
        background: var(--gray-100);
        -ms-flex: 0 0 62%;
        flex: 0 0 62%;
        max-width: 62%;
        padding: 2px
    }

    .title-section-home h2 {
        font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-spectral)
    }

    .wrp-according-catalog .accordion-button {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 1px solid var(--gray-600);
        border-bottom: 1px solid var(--gray-100);
        border-left: 1px solid var(--white-one);
        border-right: 1px solid var(--white-one)
    }

    #accordionCatalog .accordion-button:first-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionCatalog .accordion-button {
        padding: 10px 8px 9px 8px
    }

    #accordionWhy .accordion-button:first-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionWhy .accordion-button {
        padding: 10px 8px 9px 8px
    }

    .card-services-desc {
        padding: 10px 8px 9px 8px
    }

    .card-services-desc p {
        margin-bottom: 8.5px
    }

    .card-services-images figure {
        padding: 0 8px 0 8px
    }

    #accordionCatalog .accordion-button:last-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionWhy .accordion-button:last-child {
        border-top: 0 solid var(--white-one)
    }

    #accordionSubcatalog .accordion-button {
        background: var(--gray-100);
        border: 0
    }

    #accordionSubcatalog .accordion-item {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 1px solid var(--gray-100);
        border-bottom: 1px solid var(--gray-200);
        border-left: 1px solid var(--gray-100);
        border-right: 1px solid var(--gray-100);
        background: var(--gray-100)
    }

    #accordionSubcatalog .accordion-item .accordion-button {
        padding-left: 10px;
        padding-right: 10px
    }

    #accordionSubcatalog .accordion-item:first-child .accordion-button {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 0 solid var(--gray-100);
        border-bottom: 1px solid var(--gray-100);
        border-left: 0 solid var(--gray-100);
        border-right: 0px solid var(--gray-100);
        background: var(--gray-100)
    }

    .services-items a {
        padding: 6px 0
    }

    #accordionSubcatalog .accordion-item:last-child .accordion-button {
        text-decoration: none;
        outline: 0;
        box-shadow: none !important;
        border-top: 1px solid var(--gray-100);
        border-bottom: 0 solid var(--white-one);
        border-left: 0 solid var(--white-one);
        border-right: 0px solid var(--white-one)
    }

    .wrp-according-catalog .accordion-button:not(.collapsed) {
        background-color: var(--white-one)
    }

    .wrp-according-catalog .accordion-button {
        border-radius: 0;
        padding-left: 0;
        padding-right: 0
    }

    #accordionCatalog {
        border: 2px solid var(--gray-100);
        border-radius: 0
    }

    #accordionCatalog .accordion-item .accordion-header {
        padding: 0 0
    }

    #accordionWhy {
        border: 2px solid var(--gray-100);
        border-radius: 0
    }

    #accordionWhy .accordion-item .accordion-header {
        padding: 0 0
    }

    .wrp-according-catalog .accordion-item {
        border: 1px solid #cf0000 !important;
        border-radius: 16.64px
    }

    #accordionCatalog .accordion-item {
        border-radius: 0;
        border: 0 solid var(--white-one) !important;
        padding-left: 6px;
        padding-right: 6px
    }

    #accordionCatalog .accordion-item:first-child {
        border-radius: 16.64px 16.64px 0 0
    }

    #accordionCatalog .accordion-item:last-child {
        border-radius: 0 0 16.64px 16.64px
    }

    #accordionWhy .accordion-item {
        border-radius: 0;
        border: 0 solid var(--white-one) !important;
        padding-left: 6px;
        padding-right: 6px
    }

    #accordionWhy .accordion-item:first-child {
        border-radius: 16.64px 16.64px 0 0
    }

    #accordionWhy .accordion-item:last-child {
        border-radius: 0 0 16.64px 16.64px
    }

    .wrp-according-catalog .accordion-body.accordion-body-catalog {
        border: 1px solid #fff !important;
        padding: 4px 0;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        -ms-justify-content: center;
        -moz-justify-content: center;
        -webkit-justify-content: center
    }

    #accordionSubcatalog .accordion-item {
        border-radius: 0;
        border-bottom: 1px solid var(--gray-200) !important
    }

    #accordionSubcatalog .accordion-item:last-child {
        border-bottom: 0 solid var(--gray-200) !important
    }

    .wrp-according-catalog .accordion-button::after {
        display: none
    }

    .wrp-scroll-horizontal {
        width: 100%;
        min-height: 156px;
        overflow-x: scroll
    }

    .row-catalog-mobile {
        display: inline-flex;
        flex-wrap: nowrap;
        overflow-x: scroll
    }

    .row-catalog-mobile.container,
    .row-catalog-mobile.container-fluid,
    .row-catalog-mobile.row {
        margin-left: -8px;
        margin-right: -8px
    }

    .row-catalog-mobile>[class^=col-] {
        padding-left: 8px;
        padding-right: 8px
    }

    .row-catalog-mobile .col-12.column-sm-news {
        flex: 0 0 auto;
        width: 314px !important
    }

    .wrp-according-subcatalog .accordion-button h4 {
        color: var(--gray-950);
        font: normal 600 clamp(1.125rem, 0.9964rem + 0.6431vw, 1.2275rem) var(--font-poppins)
    }

    .wrp-according-subcatalog #accordionSubcatalog .accordion-button h4 {
        color: var(--gray-950);
        font: normal 600 15.64px/24.64px var(--font-poppins);
        margin-bottom: .6px
    }

    .card-services-desc {
        min-height: 114px;
        max-height: unset
    }

    .tabulation-title h3 {
        color: var(--gray-950);
        font: normal 600 clamp(1.2575rem, -0.082rem + 1.6744vw, 1.3475rem) var(--font-spectral);
        margin-bottom: 0;
        line-height: 22.64px
    }

    #accordionCatalog .accordion-pluss {
        position: relative;
        width: 100%;
        min-height: 32px
    }

    #accordionCatalog .accordion-pluss::after {
        display: block;
        position: absolute;
        content: "";
        right: 10px;
        background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M8 0a1 1 0 0 1 1 1v6h6a1 1 0 1 1 0 2H9v6a1 1 0 1 1-2 0V9H1a1 1 0 0 1 0-2h6V1a1 1 0 0 1 1-1z' clip-rule='evenodd'/%3e%3c/svg%3e") !important;
        background-size: 80% !important
    }

    #accordionCatalog .accordion-pluss:not(.collapsed)::after {
        display: block;
        position: absolute;
        content: "";
        right: 10px;
        background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' d='M0 8a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H1a1 1 0 0 1-1-1z' clip-rule='evenodd'/%3e%3c/svg%3e") !important;
        background-size: 80% !important
    }

    #accordionSubcatalog .accordion-button::after {
        display: block;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
        background-size: 86% !important
    }

    #accordionSubcatalog .accordion-button:not(.collapsed)::after {
        display: block;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
        transform: rotate(-180deg) !important;
        background-size: 86% !important
    }

    .tabulation-title {
        width: 84.14%
    }

    .tabultaion-with-icon {
        min-width: 314px;
        max-width: 314px;
        min-height: 26px;
        display: flex;
        flex-wrap: wrap
    }

    #accordionWhy .accordion-item {
        padding-left: 0;
        padding-right: 0
    }

    #accordionWhy .accordion-button:not(.collapsed) {
        position: relative
    }

    .wrp-according-catalog #accordionWhy .accordion-button::after {
        display: none
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed)::before {
        width: 100%;
        height: 2px;
        background: linear-gradient(to right, #4c1a02 0, #582005 7%, #7a310d 18%, #82330c 27%, #9b4011 37%, #cc6b35 54%, #df7d44 77%, #e18750 100%) !important;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
        position: absolute;
        bottom: 0;
        display: block;
        z-index: 4;
        content: " "
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed) {
        background: var(--white-one);
        color: var(--bs-accordion-active-color)
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed) .tabulation-title h3 {
        color: var(--gray-950)
    }

    .wrp-according-catalog #accordionWhy .accordion-button:not(.collapsed) .tabulation-title h3 {
        transition-timing-function: cubic-bezier(0, 0, 0.4, 1);
        transition-duration: .6s;
        transition: all .4s;
        color: #e18750;
        background: #541e04;
        background: linear-gradient(to right, #541e04 0, #84340c 28%, #943a0c 51%, #df7c43 63%, #e0834b 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background: #541e04;
        background: linear-gradient(to top, #541e04 0, #84340c 16%, #943a0c 40%, #df7c43 57%, #e0834b 100%);
        background-clip: border-box;
        background-clip: border-box;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent
    }

    .left-title-section {
        display: none
    }

    .left-table-of-content ul {
        top: unset
    }

    .section-detail-project.special-case-gandaria .row.detail-odd {
        text-decoration: none
    }

    .section-detail-project.special-case-gandaria .row.detail-even .col-sm-12.col-12:first-child {
        order: 2
    }

    .section-detail-project.special-case-gandaria .row.detail-even .col-sm-12.col-12:last-child {
        order: 1
    }

    .our-services-contents .row:first-child .col-sm-7 {
        order: 2
    }

    .our-services-contents .row:first-child .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(2) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(2) .col-md-5.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(3) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(3) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(5) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(5) .col-md-5.col-12 {
        order: 2
    }

    .our-services-contents .row:nth-child(7) .col-sm-7.col-12 {
        order: 1
    }

    .our-services-contents .row:nth-child(7) .col-md-5.col-12 {
        order: 2
    }

    .wrp-services-list {
        margin-bottom: 20px
    }

    .row-modal-people {
        display: flex;
        flex-wrap: wrap;
        margin-top: -1px;
        flex-direction: column
    }

    .people-social-network {
        display: none
    }

    #modalseePeople .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople1 .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople2 .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople3 .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople4 .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople5 .modal-dialog-people {
        margin-top: 36px
    }

    #modalseePeople6 .modal-dialog-people {
        margin-top: 36px
    }

    .modal-dialog-people {
        max-width: 100%;
        padding-left: 5px;
        padding-right: 5px
    }

    .side-left-people {
        max-width: 100%;
        flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        height: 100vh;
        background: transparent none;
        padding-right: 0
    }

    .wrp-content-dialog {
        padding: 24px 20px 5px 26px
    }

    .button-dialog-socmed-outline a {
        cursor: pointer
    }

    .side-right-people {
        display: flex;
        flex-wrap: wrap;
        max-width: 100%;
        flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        background: #fff;
        background: transparent none
    }

    .section-about-image {
        width: 100%;
        height: auto;
        min-height: 196px
    }

    .summary-about {
        max-width: 100%
    }

    .card-head-about {
        width: 232px
    }

    .president-photos {
        width: 100%;
        padding-bottom: 24px;
        padding-top: 15px
    }

    .message-text {
        width: 100%;
        padding-left: 30px;
        padding-right: 4px;
        padding-bottom: 30px;
        padding-top: 24px
    }

    .message-inner::before {
        content: " ";
        width: 12px;
        height: 12px;
        background: url(../images/svg/icon-quote.svg) top center no-repeat;
        background-size: auto;
        background-size: 100%;
        position: absolute;
        left: -16px;
        top: 2px
    }

    .presiden-message-photo img {
        max-width: 118%;
        object-fit: contain;
        left: -12.64%;
        top: -4.86%;
        position: relative
    }

    .section-hero-images {
        display: none
    }

    .section-hero-images-mobile {
        display: flex;
        width: 100%;
        min-height: 224px;
        background: #efefef
    }

    .description-detail-project {
        width: 100%;
        min-height: 32px;
        margin-bottom: 24px
    }

    .title-of-projects h1 {
        font: normal 600 clamp(1.5rem, 1.4057rem + 0.4717vw, 1.5625rem) var(--font-spectral)
    }

    .form-contact-us .wrp-submit-cv {
        padding-bottom: 64px
    }

    .left-col-footer {
        width: 100%;
        padding-bottom: 6px
    }

    .center-col-footer {
        width: 100%
    }

    .frame-maps-griya {
        width: 100%;
        min-height: 210px;
        margin-top: 33px;
        margin-bottom: 32px
    }

    .frame-maps-griya iframe {
        height: 194px !important
    }

    .right-col-footer {
        width: 100%
    }

    .left-col-footer .w-100:nth-child(2) .contain-contacts {
        width: 100%;
        padding: 4px 0 6.6px 0
    }

    .left-col-footer .w-100:last-child .contain-contacts {
        padding: 10px 0 14px 0
    }

    .right-col-footer {
        min-height: 201px;
        margin-bottom: 11px
    }

    .right-col-footer ul {
        margin-top: 3px;
        margin-bottom: 0
    }

    .right-col-footer ul li a {
        padding: 8px 0
    }

    .right-col-footer .row:first-child {
        height: 124.5px !important
    }

    .footer-row-one {
        padding: 34px 0 25px 0
    }

    .footer {
        width: 100%;
        height: auto;
        min-height: 124px;
        padding: 18px 0 0 0;
        background: url('../images/footer-background-texture_1_1.png') no-repeat, linear-gradient(45deg, #0e1a10 0, #0f1d11 64%, #132011 100%);
        background-position-y: -5px;
        background-position-x: 102%;
        background-size: 90.76%
    }

    .card-project-detail {
        margin-top: 24px;
        margin-bottom: 56px
    }

    .title-related-projects {
        margin-bottom: 20px
    }

    .our-services-contents .row.gutter--45.align-items-center.position-relative {
        height: 100% !important;
        padding: 30px 0 32px 0;
        border: 4px solid transparent;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        justify-content: space-between;
        -ms-justify-content: space-between;
        -moz-justify-content: space-between;
        -webkit-justify-content: space-between
    }

    .summary-about h2 {
        padding-right: 0
    }

    .title-section-page h1 {
        font: normal 600 clamp(1.5rem, 1.4057rem + 0.4717vw, 1.5625rem) var(--font-spectral)
    }

    .title-services-list h2 {
        font: normal 600 clamp(1.25rem, 1.25rem + 0vw, 1.25rem) var(--font-spectral)
    }

    .book-wrapper {
        position: relative;
        width: 100%;
        min-height: 410px
    }

    .frame-book {
        min-height: 60vh
    }

    .book-container {
        width: 96%;
        height: 100%;
        margin-left: 0
    }

    .page-face.front.left-page {
        background-size: 86%;
        background-repeat: no-repeat
    }

    .page-face.back.right-page {
        background-size: 86%;
        background-repeat: no-repeat
    }

    .book-container {
        width: 100%;
        height: 98.5%;
        margin: 0 auto
    }

    .download-container {
        margin-top: 37px
    }

    .book-wrapper {
        height: auto
    }

    .download-wrapper {
        width: 100%
    }

    .download-container {
        width: 100%
    }
}

@media screen and (min-width:415px) and (max-width:440px) {
    .card-home-projects {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 238px;
        max-height: 239px;
        overflow: hidden
    }
}

@media screen and (min-width:375px) and (max-width:414px) {
    .weekly-forecast {
        width: 410px
    }

    .card-home-projects {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 235px;
        max-height: 236px;
        overflow: hidden
    }
}

@media screen and (min-width:321px) and (max-width:374px) {
    .weekly-forecast {
        width: 424px
    }

    .card-home-projects {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 235px;
        max-height: 236px;
        overflow: hidden
    }
}

@media screen and (max-width :320px) {
    .logo-brand {
        width: 198px
    }

    .projects-list {
        padding: 35px 0 52.5px 0
    }

    .card-home-projects {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 235px;
        max-height: 236px;
        overflow: hidden
    }
}