/* GOOGLE FONT */
@import url("https://fonts.googleapis.com/css2?family=Zalando+Sans+SemiExpanded:ital,wght@0,200..900;1,200..900&display=swap");

a img {
  border: 0px;
}

a {
  text-decoration: none;
  color: inherit;
}

img {
  max-width: 100%;
}

select::-ms-expand {
  display: none;
}

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px #fff inset;
}

input[type="number"] {
  -moz-appearance: textfield;
}

::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

::-webkit-outer-spin-button {
  -webkit-appearance: none;
}

.hiddenHeader {
  display: none;
}

ul {
  list-style: none;
}

* {
  padding: 0px;
  margin: 0px;
  outline: none;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  font-family: "Zalando Sans SemiExpanded", sans-serif;
}

html,
body {
  height: 100vh;
  min-height: 100%;
  position: relative;
  width: 100%;
}

body {
  width: 100%;
  -webkit-text-size-adjust: none;
}

#wrapper {
  background: #dbdbdb;
  height: auto;
  min-height: 100%;
  position: relative;
  width: 100%;
  font-family: "Zalando Sans SemiExpanded", sans-serif;
}

.hiddenheader {
  display: none;
}
.onlydevices {
  display: none;
}
@media (max-device-width: 1024px) and (min-device-width: 320px) {
  .onlydevices {
    display: block;
  }
}
.ipaddevice {
  display: none;
}
@media (max-device-width: 1224px) and (min-device-width: 767.1px) {
  .ipaddevice {
    display: block;
  }
}
.mobdevice {
  display: none;
}
@media (max-device-width: 767px) and (min-device-width: 320.1px) {
  .mobdevice {
    display: block;
  }
}
.startresp {
  display: none;
}
@media (max-width: 767px) {
  .startresp {
    display: block;
  }
}
.bp_sevensixtyseven {
  display: none;
}
@media (max-width: 767px) {
  .bp_sevensixtyseven {
    display: block;
  }
}
.bp_1024 {
  display: none;
}
@media (max-width: 1024px) {
  .bp_1024 {
    display: block;
  }
}
.noBottAppearance {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
}
.absoluteDivCreate {
  display: block;
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}
.centerBgImg {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.centeredObjFit {
  object-fit: cover;
  object-position: center center;
}
.centerflex {
  display: flex;
  justify-content: center;
  align-items: center;
}
.custbtm {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  border: 0px;
  justify-content: center;
  height: calc(var(--ratio) * 56px);
  transition: all 0.45s;
  border-radius: calc(var(--ratio) * 16px);
  border: 1px solid #e3e3e3;
  font-weight: 500;
  position: relative;
  background: none;
  padding-left: calc(var(--ratio) * 46px);
  padding-right: calc(var(--ratio) * 46px);
  text-align: center;
}
.custbtm.blue {
  background: #40a6bf;
  color: #fff;
  border-color: #40a6bf;
}
.custbtm img {
  margin-right: calc(var(--ratio) * 14px);
  max-height: calc(var(--ratio) * 30px);
  max-width: calc(var(--ratio) * 28px);
  display: block;
  object-fit: contain;
}
.custbtm img.arrow {
  max-width: calc(var(--ratio) * 20px);
}
.custbtm.loading {
  pointer-events: none;
}
.custbtm.loading:before {
  display: block;
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: #fff;
}
.custbtm.loading:after {
  margin: auto;
  bottom: 5px;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: absolute;
  left: 0;
  right: 0;
  text-indent: -9999em;
  -webkit-animation: load4 1.3s infinite linear;
  animation: load4 1.3s infinite linear;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  font-size: 5px;
  color: #000;
  pointer-events: none;
  display: block;
  content: "";
  top: 5px;
  transition: none;
}
@media (max-width: 767px) {
  .custbtm.loading:after {
    font-size: 4px;
  }
}
.inputField .field {
  position: relative;
  height: calc(var(--ratio) * 33px);
  background: none;
  border-radius: 0px;
  border-bottom: 1px solid #959595;
}
.inputField .field.missing {
  border-color: red !important;
}
.inputField .field.textfield {
  height: calc(var(--ratio) * 335px);
}
@media (max-width: 767px) {
  .inputField .field.textfield {
    height: calc(var(--ratio) * 140px);
  }
}
.inputField .field.arrow:after {
  display: flex;
  content: "\f107";
  font-family: FontAwesome;
  font-size: calc(var(--ratio) * 14px);
  position: absolute;
  top: calc(var(--ratio) * 2px);
  height: 100%;
  align-items: center;
  pointer-events: none;
  right: 0px;
  color: #959595;
}
.inputField .field img {
  height: calc(var(--ratio) * 20px);
  right: calc(var(--ratio) * 11px);
  position: absolute;
  top: 0px;
  bottom: 0px;
  margin: auto;
  display: block;
  object-fit: contain;
}
.inputField .custlabel {
  display: block;
  margin-bottom: 6px;
}
.inputField .custinput {
  font-family: "Zalando Sans SemiExpanded", sans-serif;
  border: 0px;
  border-radius: 0px;
  background: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  height: 100%;
  padding-right: calc(var(--ratio) * 15px);
  font-size: calc(var(--ratio) * 15px);
  line-height: 140%;
  font-weight: 300;
  color: #000000;
}
.inputField .custinput.dateinput,
.inputField .custinput.timeinput {
  padding-left: 65px;
}
.inputField .custinput.hascalendar {
  cursor: pointer;
}
.inputField .custtextarea {
  border: 0px;
  border-radius: 0px;
  background: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  resize: none;
  overflow: auto;
  display: block;
  width: 100%;
  height: 100%;
  font-family: "Zalando Sans SemiExpanded", sans-serif;
  font-size: calc(var(--ratio) * 15px);
  line-height: 140%;
  font-weight: 300;
  color: #000000;
}
.inputField .custselect {
  border: 0px;
  border-radius: 0px;
  background: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  height: 100%;
  font-size: calc(var(--ratio) * 15px);
  line-height: 140%;
  font-weight: 300;
  color: #000000;
  cursor: pointer;
  padding-right: calc(var(--ratio) * 35px);
}
.inputField .custselect option {
  color: #000000;
}
.inputField .dateinput,
.inputField .timeinput {
  display: flex !important;
  align-items: center !important;
  text-align: left !important;
  justify-content: flex-start !important;
}
.inputField input::-webkit-date-and-time-value {
  text-align: left !important;
}
.inputField input[type="date"]::-webkit-calendar-picker-indicator {
  background: transparent;
  bottom: 0;
  color: transparent;
  cursor: pointer;
  height: auto;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: auto;
}
.inputField input[type="time"]::-webkit-calendar-picker-indicator {
  background: transparent;
  bottom: 0;
  color: transparent;
  cursor: pointer;
  height: auto;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: auto;
}
.iti {
  display: block;
  height: 100%;
}
.iti .custinput {
  padding-left: 90px !important;
}
@media (max-width: 1300px) {
  .iti .custinput {
    padding-left: 80px !important;
  }
}
@media (max-width: 767px) {
  .iti .custinput {
    padding-left: 74px !important;
  }
}
.iti--allow-dropdown .iti__flag-container .iti__selected-flag {
  background: none !important;
  padding-left: 0px !important;
}
.iti__country-list {
  width: 320px;
  white-space: unset;
}
@media (max-width: 767px) {
  .iti__country-list {
    width: calc(100vw - 60px);
  }
}
@media (max-width: 767px) {
  .iti--allow-dropdown input,
  .iti--allow-dropdown input[type="text"],
  .iti--allow-dropdown input[type="tel"],
  .iti--separate-dial-code input,
  .iti--separate-dial-code input[type="text"],
  .iti--separate-dial-code input[type="tel"] {
    padding-left: 65px;
  }
}
.iti--separate-dial-code {
  margin-left: 20px;
}
@media (max-width: 767px) {
  .iti--separate-dial-code {
    margin-left: 15px;
  }
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background: black !important;
  opacity: 1 !important;
}
.mCSB_scrollTools .mCSB_draggerRail {
  background: none !important;
}
.swiper-pagination {
  position: relative;
  z-index: 1;
  bottom: auto;
  left: auto;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.swiper-pagination .swiper-pagination-bullet {
  opacity: 1 !important;
  transition: all 0.35s;
  background: rgba(255, 255, 255, 0.37);
  margin: 0px 3px 10px !important;
  border-radius: 0px;
  width: calc(var(--ratio) * 24px);
  height: calc(var(--ratio) * 4px);
}
.swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
  cursor: default;
}
#content {
  min-height: 100vh;
}
#content:before {
  display: block;
  content: "";
}
footer {
  position: relative;
  border-top: 1px solid #000;
}
footer .wrap {
  position: relative;
  background: #dbdbdb;
  padding: calc(var(--ratio) * 55px) 0px calc(var(--ratio) * 55px);
}
footer .cols {
  display: flex;
  flex-wrap: wrap;
}
footer .cols > li:nth-child(1) {
  width: 25%;
}
footer .cols > li:nth-child(2) {
  width: 75%;
}
footer .others {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: calc(var(--ratio) * 67px);
  align-items: flex-end;
}
footer .others > li:nth-child(1) {
  width: 25%;
}
footer .others > li:nth-child(2) {
  width: 75%;
  padding-left: calc((75% / 6) + (75% / 6));
}
footer .inner {
  padding-left: calc(25% + (75% / 6) + (75% / 6));
}
footer .end {
  padding: calc(var(--ratio) * 285px) 0px calc(var(--ratio) * 25px);
  background-color: #000;
  background-position: bottom center;
}
footer .copyright {
  color: #fff;
  font-size: calc(var(--ratio) * 14px);
  line-height: 140%;
}
footer .data {
  color: #fff;
  font-size: calc(var(--ratio) * 14px);
}
footer .logo {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(var(--ratio) * 210px);
  margin-bottom: calc(var(--ratio) * 31px);
  max-width: 80%;
}
footer .logo img {
  display: block;
  object-fit: contain;
  width: 100%;
}
footer .caption {
  color: #000;
  font-size: calc(var(--ratio) * 15px);
  line-height: 140%;
}
footer .list {
  display: flex;
  flex-wrap: wrap;
}
footer .list > li {
  width: calc(100% / 6);
}
footer .list > li:last-child {
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
}
footer .category {
  color: #000000;
  font-weight: bold;
  font-size: calc(var(--ratio) * 17px);
  line-height: 140%;
  transition: all 0.35s;
}
footer .in > li {
  display: flex;
}
footer .in > li + li {
  margin-top: calc(var(--ratio) * 7px);
}
footer .sublink {
  display: block;
  transition: all 0.35s;
  font-size: calc(var(--ratio) * 17px);
  line-height: 140%;
  color: #000000;
}
@media (max-width: 1300px) {
  footer .cols > li:nth-child(1) {
    width: 20%;
  }
  footer .cols > li:nth-child(2) {
    width: 80%;
  }
  footer .others > li:nth-child(1) {
    width: 20%;
  }
  footer .others > li:nth-child(2) {
    width: 80%;
    padding-left: calc((80% / 6) + (80% / 6));
  }
  footer .inner {
    padding-left: calc(20% + (80% / 6) + (80% / 6));
  }
}
@media (max-width: 1024px) {
  footer .cols > li:nth-child(1) {
    width: 100%;
  }
  footer .cols > li:nth-child(2) {
    width: 100%;
    margin-top: calc(var(--ratio) * 47px);
  }
  footer .others > li:nth-child(1) {
    width: 100%;
  }
  footer .others > li:nth-child(2) {
    width: 100%;
    padding-left: 0px;
    margin-top: calc(var(--ratio) * 47px);
  }
  footer .inner {
    padding-left: 0px;
  }
  footer .list {
    justify-content: space-between;
  }
  footer .list > li {
    width: auto;
  }
}
@media (max-width: 767px) {
  footer .list > li {
    width: 100%;
  }
  footer .list > li:last-child {
    justify-content: flex-start;
  }
  footer .list > li + li {
    margin-top: calc(var(--ratio) * 15px);
  }
  footer .logo {
    width: auto;
    max-width: calc(var(--ratio) * 182px);
  }
  footer .socialMedia {
    padding-top: calc(var(--ratio) * 12px);
  }
  footer .copyright {
    max-width: calc(var(--ratio) * 275px);
  }
}
.socialMedia {
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.socialMedia > li {
  margin-right: calc(var(--ratio) * 10px);
}
.socialMedia > li:last-child {
  margin-right: 0px;
}
.socialMedia .itemedia {
  padding-top: calc(var(--ratio) * 1px);
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.35s;
  border: 1px solid #000000;
  height: calc(var(--ratio) * 37px);
  width: calc(var(--ratio) * 37px);
  color: #000000;
  font-size: calc(var(--ratio) * 21px);
}
.socialMedia.white .itemedia {
  border-color: #fff;
  color: #fff;
}
.Slider {
  position: relative;
}
.Slider .screen {
  position: relative;
  overflow: hidden;
}
.Slider .item {
  display: block;
}
.Slider .swiper-slide {
  min-width: 100vw;
}
.Slider .pic {
  position: relative;
  overflow: hidden;
}
.Slider .pic img {
  height: 100vh;
  display: block;
  object-fit: cover;
  object-position: center center;
  width: 100%;
  min-height: 500px;
}
.Slider .pic:after {
  display: block;
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  /*background: linear-gradient(
    -180deg,
    rgba(255, 255, 255, 0.5) 0%,
    rgba(255, 255, 255, 0) 39%,
    rgba(255, 255, 255, 0) 100%
  );*/
}
.Slider .data {
  position: relative;
  pointer-events: none;
  position: absolute;
  left: 0px;
	padding-left: 40px;
  width: 100%;
  top: calc(var(--ratio) * 64%);
  z-index: 1;
  text-shadow: 0px 0px 10px #808080;
}
.Slider .caption {
  pointer-events: visible;
  text-transform: uppercase;
  color: #fff;
  font-weight: 200;
  font-size: calc(var(--ratio) * 45px);
  line-height: 105%;
}
.Slider .caption b {
  font-weight: 500;
}
@media (max-width: 767px) {
  .Slider .pic img {
    height: 82vh;
    min-height: 400px;
  }
}
header {
  position: fixed;
  z-index: 3;
  top: 0px;
  left: 0px;
  width: 100%;
  padding-top: calc(var(--ratio) * 30px);
}
header .wrap {
  position: relative;
  height: calc(var(--ratio) * 105px);
  transition: all 0.35s;
}
header .logo {
  height: calc(var(--ratio) * 47px);
  transition: all 0.35s;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0px;
  left: 0px;
  margin: auto;
  bottom: 0px;
}
header .logo img {
  height: 100%;
  object-fit: contain;
  display: block;
}
header .list {
  position: absolute;
  right: 0px;
  top: 0px;
  height: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
header .list > li {
  margin-right: calc(var(--ratio) * 225px);
}
header .list > li:last-child {
  margin-right: 0px;
}
header .holder {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
}
header .holder > li {
  margin-right: calc(var(--ratio) * 77px);
  display: flex;
}
header .holder > li:last-child {
  margin-right: 0px;
}
header .link {
  display: block;
  cursor: pointer;
  transition: all 0.35s;
  font-size: calc(var(--ratio) * 20px);
  color: #000000;
  font-weight: 200;
}
header .link.selected {
  font-weight: 500 !important;
}
header .openmenu {
  display: none;
}
header .closemenu {
  display: none;
}
@media (max-width: 1311px) {
  header .holder > li {
    margin-right: calc(var(--ratio) * 22px);
  }
  header .list > li {
    margin-right: calc(var(--ratio) * 44px);
  }
}
@media (max-width: 1024px) {
  header .openmenu {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    right: -5px;
    top: 0px;
    bottom: 0px;
    margin: auto;
    transition: all 0.35s;
    width: calc(var(--ratio) * 36px);
    height: calc(var(--ratio) * 36px);
    color: #000000;
    font-size: calc(var(--ratio) * 31px);
    cursor: pointer;
  }
  header .closemenu {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    right: calc(var(--ratio) * 24px);
    top: calc(var(--ratio) * 24px);
    transition: all 0.35s;
    width: calc(var(--ratio) * 36px);
    height: calc(var(--ratio) * 36px);
    color: #000;
    font-size: calc(var(--ratio) * 22px);
    cursor: pointer;
  }
  header .menu {
    position: fixed;
    z-index: 2;
    background: #dbdbdb;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    --ratio: 0.8 !important;
    opacity: 0;
    transition: all 0.35s;
    pointer-events: none;
  }
  header .in {
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 25px;
  }
  header .list {
    position: relative;
    top: unset;
    right: unset;
    height: auto;
  }
  header .list > li {
    margin-right: 0px;
    width: 100%;
  }
  header .list > li + li {
    margin-top: calc(var(--ratio) * 72px);
  }
  header .socialMedia {
    justify-content: center;
    --ratio: 1;
  }
  header .socialMedia > li {
    margin: 0px calc(var(--ratio) * 5px);
  }
  header .socialMedia .itemedia {
    border-color: #000000 !important;
    color: #000000 !important;
  }
  header .holder > li {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 0px;
  }
  header .holder > li + li {
    margin-top: calc(var(--ratio) * 27px);
  }
  header .link {
    font-size: calc(var(--ratio) * 31px) !important;
  }
}
@media (max-width: 767px) {
  header .logo {
    height: calc(var(--ratio) * 39px);
  }
}
@media (max-width: 1024px) {
  .open_menu {
    overflow: hidden;
  }
  .open_menu header .menu {
    opacity: 1;
    pointer-events: visible;
  }
}
.About {
  position: relative;
}
.About .bg {
  background-size: cover;
  background-position: center right;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}
.About .bg:after {
  display: block;
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  /*background: linear-gradient(40deg, #dadada 0%, rgba(218, 218, 218, 0) 100%);*/
}
.About .data {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  min-height: 100vh;
}
.About .container {
  width: 100%;
}
.About .info {
  padding-bottom: calc(var(--ratio) * 50px);
  max-width: 75%;
  padding-top: calc(var(--ratio) * 100px);
}
.About .caption {
  pointer-events: visible;
  text-transform: uppercase;
  color: #000000;
  font-weight: 400;
  font-size: calc(var(--ratio) * 45px);
  line-height: 105%;
}
.About .caption b {
  font-weight: 500;
}
.About .text {
  margin-top: calc(var(--ratio) * 100px);
  font-size: calc(var(--ratio) * 18px);
  line-height: 140%;
  font-weight: 200;
  color: #000000;
}
@media (max-width: 767px) {
  .About .info {
    max-width: 90%;
  }
  .About .text {
    margin-top: calc(var(--ratio) * 40px);
    font-size: calc(var(--ratio) * 13px);
  }
}
.scrollheader header {
  background: #dbdbdb;
  box-shadow: 0px 0px 10px #a69d9d;
}
.scrollheader header .wrap {
  height: calc(var(--ratio) * 75px);
}
.scrollheader header .menu {
  --ratio: 0.82;
}
.scrollheader header .logo {
  --ratio: 0.79;
}
.scrollheader header .socialMedia.white .itemedia {
  border-color: #000000;
  color: #000000;
}
.scrollheader header .openmenu {
  color: #000000;
}
.Team {
  padding: calc(var(--ratio) * 95px) 0px calc(var(--ratio) * 95px);
}
.Team .list > li + li {
  margin-top: calc(var(--ratio) * 40px);
}
.Team .item {
  display: flex;
}
.Team .pic {
  width: calc(var(--ratio) * 320px);
  margin-right: calc(var(--ratio) * 50px);
  position: relative;
  overflow: hidden;
}
.Team .pic img {
  object-position: center 10%;
  width: 100%;
  object-fit: cover;
}
.Team .data {
  width: calc(100% - var(--ratio) * 270px);
  padding-top: calc(var(--ratio) * 8px);
  padding-bottom: calc(var(--ratio) * 0px);
  align-content: flex-end;
  text-align: justify;
}
.Team .title {
  font-size: calc(var(--ratio) * 21px);
  color: #000000;
  text-transform: uppercase;
  font-weight: 500;
}
.Team .subtitle {
  color: #000000;
  font-size: calc(var(--ratio) * 18px);
  line-height: 140%;
  font-weight: 400;
}
.Team .text {
  margin-top: calc(var(--ratio) * 33px);
  font-size: calc(var(--ratio) * 18px);
  line-height: 140%;
  font-weight: 200;
  color: #000000;
}
@media (max-width: 767px) {
  .Team {
    padding: calc(var(--ratio) * 155px) 0px calc(var(--ratio) * 75px);
  }
  .Team .item {
    display: block;
  }
  .Team .pic {
    width: calc(var(--ratio) * 200px);
    margin-right: calc(var(--ratio) * 0px);
  }
  .Team .data {
    width: 100%;
    padding: 0px;
    margin-top: calc(var(--ratio) * 20px);
  }
  .Team .text {
    margin-top: calc(var(--ratio) * 21px);
  }
  .Team .list > li + li {
    margin-top: calc(var(--ratio) * 66px);
  }
}
.Portfolio {
  padding: calc(var(--ratio) * 95px) 0px calc(var(--ratio) * 95px);
  position: relative;
  overflow: hidden;
}
.Portfolio .swiper-slide {
  width: calc(var(--ratio) * (33.33% - calc(1 * 27px)));
  margin-right: auto;
  min-width: calc(var(--ratio) * 356px);
}
.Portfolio .swiper-slide:last-child {
  margin-right: 0px;
}
.Portfolio .item {
  display: block;
  height: 100%;
  position: relative;
}
.Portfolio .pic {
  height: calc(var(--ratio) * 600px);
  position: relative;
  overflow: hidden;
}
.Portfolio .pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
  transition: all 0.35s;
}
/*
.Portfolio .pic:after {
  display: block;
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    40deg,
    rgba(218, 218, 218, 0.8) 0%,
    rgba(218, 218, 218, 0) 40%,
    rgba(218, 218, 218, 0) 100%
  );
}
*/
.Portfolio .data {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  display: flex;
  z-index: 1;
  align-items: flex-end;
  padding: calc(var(--ratio) * 16px) calc(var(--ratio) * 16px)
    calc(var(--ratio) * 26px) calc(var(--ratio) * 19px);
}
.Portfolio .caption {
  color: #fff;
  font-size: calc(var(--ratio) * 18px);
  font-weight: 300;
}
.Portfolio .subtitle {
  margin-top: calc(var(--ratio) * 3px);
  color: #fff;
  font-size: calc(var(--ratio) * 15px);
  line-height: 140%;
  font-weight: 100;
  text-transform: uppercase;
}
.Details {
  padding: calc(var(--ratio) * 228px) 0px calc(var(--ratio) * 25px);
  overflow: hidden;
  position: relative;
}
.Details .box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.Details .box > li {
  width: calc(50% - var(--ratio) * 22px);
}
.Details .box > li:last-child {
  width: calc(50% - var(--ratio) * 22px);
}
.Details .screen {
  position: relative;
  overflow: hidden;
}
.Details .item {
  display: block;
  height: 100%;
  position: relative;
}
.Details .pic {
  position: relative;
  overflow: hidden;
}
.Details .pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
  transition: all 0.35s;
}
.Details .top {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: calc(var(--ratio) * 5px);
}
.Details .top > li {
  max-width: 49%;
}
.Details .top > li:nth-child(2) {
  display: flex;
  align-items: center;
}
.Details .prev,
.Details .next {
  height: calc(var(--ratio) * 25px);
  font-size: calc(var(--ratio) * 17px);
  transition: all 0.35s;
  display: flex;
  align-items: center;
  color: #000000;
  cursor: pointer;
}
.Details .count {
  margin-right: calc(var(--ratio) * 10px);
  font-size: calc(var(--ratio) * 15px);
  line-height: 140%;
  font-weight: 500;
  color: #000000;
  font-weight: 400;
}
.Details .holder {
  display: flex;
  align-items: flex-end;
  height: 100%;
}
.Details .text {
  font-size: calc(var(--ratio) * 17px);
  line-height: 140%;
  font-weight: 200;
  color: #000000;
  margin-top: calc(var(--ratio) * 13px);
  text-align: justify;
}
.Details .title {
  font-weight: 700;
  color: #000000;
  font-size: calc(var(--ratio) * 28px);
  text-transform: uppercase;
}
.Details .info {
  margin-top: calc(var(--ratio) * 33px);
  font-size: calc(var(--ratio) * 16px);
  line-height: 140%;
}
.Details .info > li + li {
  margin-top: calc(var(--ratio) * 22px);
}
.Details .caption {
  color: #767171;
  font-weight: 400;
}
.Details .subcaption {
  color: #000000;
  font-weight: 300;
}
@media (max-width: 991px) {
  .Details {
    padding: calc(var(--ratio) * 155px) 0px calc(var(--ratio) * 65px);
  }
  .Details .box > li,
  .Details .box > li:last-child {
    width: 100%;
  }
  .Details .box > li + li {
    margin-top: calc(var(--ratio) * 42px);
  }
}
@media (max-width: 767px) {
  .Details {
    padding: calc(var(--ratio) * 135px) 0px calc(var(--ratio) * 55px);
  }
}
.contactus {
  padding: calc(var(--ratio) * 95px) 0px calc(var(--ratio) * 95px);
  overflow: hidden;
  position: relative;
}
.contactus .gm-style {
  filter: grayscale(100%) !important;
}
.contactus .box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.contactus .box > li:nth-child(1) {
  width: calc(57% - var(--ratio) * 42px);
}
.contactus .box > li:nth-child(2) {
  width: calc(43% - var(--ratio) * 42px);
}
.contactus .top {
  margin-bottom: calc(var(--ratio) * 26px);
}
.contactus .title {
  color: #000000;
  font-size: calc(var(--ratio) * 21px);
  font-weight: 500;
  position: relative;
  display: flex;
}

.contactus .caption {
  margin-top: calc(var(--ratio) * 2px);
  color: #939393;
  font-size: calc(var(--ratio) * 17px);
  font-weight: 200;
}
.contactus .map_presence {
  background: rgba(255, 255, 255, 0.5);
  height: clamp(26.875rem, 28.654rem + 27.149vw, 36.875rem);
}
.contactus .list > li + li {
  margin-top: calc(var(--ratio) * 17px);
}
.contactus .more {
  margin-top: calc(var(--ratio) * 11px);
  display: flex;
  justify-content: flex-end;
}
.contactus .sendbtn {
  transition: all 0.35s;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  border: 0px;
  background: none;
  border-radius: 0px;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  font-size: calc(var(--ratio) * 15px);
  line-height: 140%;
  font-weight: 300;
  color: #000000;
  padding-right: calc(var(--ratio) * 21px);
  position: relative;
}
.contactus .sendbtn:after {
  content: "\f061";
  font-family: fontawesome;
  font-size: calc(var(--ratio) * 14px);
  position: relative;
  top: calc(var(--ratio) * 1px);
  display: block;
  position: absolute;
  right: 0px;
}
@media (max-width: 1111px) {
  .contactus .box > li:nth-child(1) {
    width: calc(60% - var(--ratio) * 32px);
  }
  .contactus .box > li:nth-child(2) {
    width: calc(40% - var(--ratio) * 32px);
  }
}
@media (max-width: 1024px) {
  .contactus .box > li:nth-child(1) {
    width: 100%;
  }
  .contactus .box > li:nth-child(2) {
    width: 100%;
    margin-top: calc(var(--ratio) * 44px);
  }
  .contactus .map_presence {
    height: clamp(15.625rem, 9.125rem + 27.735vw, 26.875rem);
  }
}
@media (max-width: 767px) {
  .contactus {
    padding: calc(var(--ratio) * 155px) 0px calc(var(--ratio) * 85px);
  }
}
.ourservices {
  overflow: hidden;
  min-height: 100vh;
  align-content: end;
  padding: calc(var(--ratio) * 95px) 0px calc(var(--ratio) * 25px);
}
.ourservices .box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.ourservices .box > li:nth-child(1) {
  width: calc(38% - var(--ratio) * 42px);
}
.ourservices .box > li:nth-child(2) {
  width: calc(62% - var(--ratio) * 42px);
}
.ourservices .box > li:nth-child(2) .warp {
  height: 100%;
  align-content: flex-end;
}
.ourservices .list > li + li {
  margin-top: calc(var(--ratio) * 30px);
}
.ourservices .unit {
  position: relative;
  display: block;
}
.ourservices .unit.active .name {
  color: #da5327;
}
.ourservices .unit.active .head:before {
  /*content: "\f068";*/
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60.67 60.67"><rect fill="%23070707" x="0" y="27.65" width="60.67" height="5.02"/></svg>');
}
.ourservices .unit.active .extraa {
  display: inline;
}
.ourservices .unit.active .read {
  display: none;
}
.ourservices .unit.inactive .holder {
  display: none;
}
.ourservices .head {
  position: relative;
  display: flex;
  cursor: pointer;
  transition: all 0.35s;
  user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  -moz-user-select: none;
}
.ourservices .head:after {
  display: block;
  content: "";
  /*position: absolute;*/
  right: 0px;
  top: calc(var(--ratio) * 23px);
  border-bottom: 1px solid #7e7c7c;
  width: 100%;
}
.ourservices .head:before {
  display: block;
  /*content: "\2b";
  font-family: fontawesome;
  font-size: calc(var(--ratio) * 14px);*/
  position: absolute;
  right: 0px;
  top: calc(var(--ratio) * 0px);
  color: #000000;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60.67 60.67"><polygon fill="%23000000" points="60.67 27.65 33.02 27.65 33.02 0 27.65 0 27.65 27.65 0 27.65 0 33.02 27.65 33.02 27.65 60.67 33.02 60.67 33.02 33.02 60.67 33.02 60.67 27.65"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  content: "";
  width: 15px;
  height: 15px;
  background-position: center;
}
.ourservices .name {
  color: #000000;
  text-transform: uppercase;
  font-weight: 500;
  font-size: calc(var(--ratio) * 28px);
  /*background: #dbdbdb;*/
  padding-right: calc(var(--ratio) * 12px);
  position: relative;
  z-index: 1;
  transition: all 0.35s;
  white-space: nowrap;
}
@media (max-width: 400px) {
  .ourservices .name {
    white-space: normal;
  }
}

.ourservices .text {
  font-size: calc(var(--ratio) * 17px);
  line-height: 140%;
  font-weight: 300;
  color: #625d5d;
}

.ourservices .extra {
  display: none;
  font-size: calc(var(--ratio) * 18px);
  line-height: 180%;
  font-weight: 200;
  color: #000;
}
.ourservices .info {
  padding-top: calc(var(--ratio) * 10px);
}
.ourservices .more {
  display: flex;
  margin-top: calc(var(--ratio) * 7px);
}
.ourservices .read {
  font-weight: 500;
  color: #000;
  font-size: calc(var(--ratio) * 15px);
  border-bottom: 2px solid #000;
  cursor: pointer;
  transition: all 0.35s;
  line-height: 100%;
}
.ourservices .subtitle {
  font-size: calc(var(--ratio) * 23px);
  color: #da5327;
  font-weight: 200;
}
.ourservices .screen {
  overflow: hidden;
  height: calc(var(--ratio) * 570px);
}
.ourservices .swiper-slide {
  height: auto;
}
.ourservices .data {
  height: 100%;
  display: flex;
  align-items: flex-end;
  padding-bottom: calc(var(--ratio) * 1px);
}
.ourservices .pic {
  height: 100%;
  display: block;
}
.ourservices .pic img {
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
  width: 100%;
}
@media (max-width: 991px) {
  .ourservices .box > li:nth-child(1) {
    width: 100%;
  }
  .ourservices .box > li:nth-child(2) {
    width: 100%;
    margin-top: calc(var(--ratio) * 47px);
  }
  .ourservices .data {
    padding-bottom: 0px;
  }
  .ourservices .unit.inactive {
    display: none;
  }
}
@media (max-width: 767px) {
  .ourservices {
    padding: calc(var(--ratio) * 153px) 0px calc(var(--ratio) * 80px);
  }
  .ourservices .screen {
    height: calc(var(--ratio) * 370px);
  }
}
.page_bg {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.page_bg img {
  object-fit: cover;
  object-position: center 0px;
  display: block;
  width: 100%;
  height: 100%;
}
.page_bg:after {
  background: linear-gradient(
    40deg,
    #dadada 0%,
    rgba(218, 218, 218, 0) 50%,
    rgba(218, 218, 218, 0.3) 90%,
    rgba(218, 218, 218, 0) 100%
  );
  display: block;
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}
.desktop .socialMedia .itemedia:hover {
  background: #000000;
  color: #fff;
}
.desktop .socialMedia.white .itemedia:hover {
  background: #fff;
  color: #000000;
}
.desktop.scrollheader .socialMedia.white .itemedia:hover {
  background: #000000;
  color: #fff;
}
.desktop .contactus .sendbtn:hover {
  opacity: 0.74;
}
.desktop footer .category[href]:hover {
  opacity: 0.64;
}
.desktop footer .sublink[href]:hover {
  opacity: 0.64;
}
.desktop header .closemenu:hover {
  opacity: 0.64;
}
.desktop header .link:hover {
  opacity: 0.64;
}
.desktop .Portfolio .item:hover .pic img {
  transform: scale(1.02);
}
.desktop .Details .prev:hover,
.desktop .Details .next:hover {
  opacity: 0.6;
}
.desktop .ourservices .head:hover {
  opacity: 0.77;
}
.desktop .ourservices .read:hover {
  opacity: 0.77;
}
@media (max-width: 1024px) {
  .desktop header .socialMedia .itemedia:hover {
    color: #fff !important;
  }
  .desktop.open_menu .socialMedia.white .itemedia:hover {
    background: #000000;
    color: #fff;
  }
}
.inputField ::-webkit-input-placeholder {
  /* Safari, Chrome and Opera */
  opacity: 1 !important;
  color: #000 !important;
}
.inputField :-moz-placeholder {
  /* Firefox 18- */
  opacity: 1 !important;
  color: #000 !important;
}
.inputField ::-moz-placeholder {
  /* Firefox 19+ */
  opacity: 1 !important;
  color: #000 !important;
}
.inputField :-ms-input-placeholder {
  /* IE 10+ */
  opacity: 1 !important;
  color: #000 !important;
}
.inputField ::-ms-input-placeholder {
  /* Edge */
  opacity: 1 !important;
  color: #000 !important;
}
:root {
  --ratio: 1;
}
@media (max-width: 1300px) {
  :root {
    --ratio: 0.9;
  }
}
@media (max-width: 767px) {
  :root {
    --ratio: 0.82;
  }
}
.container {
  position: relative;
  margin: 0px auto;
  width: 100%;
  max-width: 1700px;
}
@media (max-width: 1800px) {
  .container {
    padding: 0px 40px;
  }
}
@media (max-width: 767px) {
  .container {
    padding: 0px 20px;
  }
}

.about-data {
  position: absolute;
  width: 100%;
  top: calc(var(--ratio) * 64%);
}

.ourservices {
  background-image: url("../images/services.jpg");
  background-position: top;
  background-repeat: no-repeat;
}

.rotate {
  rotate: 180deg;
}

.page {
  margin-top: calc(var(--ratio) * 40px);
  border-top: 1px solid black;
  padding-top: calc(var(--ratio) * 25px);
}
.page .prev-page img {
  margin-right: 7px;
}
.page .next-page img {
  margin-left: 7px;
}
.Slider {
  margin-left: -40px;
  margin-right: -40px;
  width: calc(100% + 40px);
}

@media (max-width: 767px) {
  .Slider {
    margin-left: -20px;
    margin-right: -20px;
    width: calc(100% + 20px);
  }
}

















.projects-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 per row */
  gap: 20px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.project-item {
  width: 100%;
}

.project-item img {
  width: 100%;
  height: auto;
  display: block;
}

/* Optional: responsive */
@media (max-width: 992px) {
  .projects-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .projects-grid {
    grid-template-columns: 1fr;
  }
}