@charset "UTF-8";
@font-face {
  font-family: "asap_condensedbold";
  src: url("../resources/fonts/asapcondensed-bold-webfont.woff2") format("woff2"), url("../resources/fonts/asapcondensed-bold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "asap_condensedbold_italic";
  src: url("../resources/fonts/asapcondensed-bolditalic-webfont.woff2") format("woff2"), url("../resources/fonts/asapcondensed-bolditalic-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "asap_condensedmedium";
  src: url("../resources/fonts/asapcondensed-medium-webfont.woff2") format("woff2"), url("../resources/fonts/asapcondensed-medium-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "asap_condensedmedium_italic";
  src: url("../resources/fonts/asapcondensed-mediumitalic-webfont.woff2") format("woff2"), url("../resources/fonts/asapcondensed-mediumitalic-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "asap_condensedregular";
  src: url("../resources/fonts/asapcondensed-regular-webfont.woff2") format("woff2"), url("../resources/fonts/asapcondensed-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "asap_condenseditalic";
  src: url("../resources/fonts/asapcondensed-regularitalic-webfont.woff2") format("woff2"), url("../resources/fonts/asapcondensed-regularitalic-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "asap_condensedsemibold";
  src: url("../resources/fonts/asapcondensed-semibold-webfont.woff2") format("woff2"), url("../resources/fonts/asapcondensed-semibold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "asap_condensedsemibold_italic";
  src: url("../resources/fonts/asapcondensed-semibolditalic-webfont.woff2") format("woff2"), url("../resources/fonts/asapcondensed-semibolditalic-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
header {
  position: relative;
}
header .header-items {
  display: block;
  overflow: hidden;
  clear: both;
  background-color: #efefef;
  border-right: 1px solid #e7e7e7;
  position: fixed;
  width: 10rem;
  height: 100%;
  z-index: 2;
}
header .logo {
  margin: 2rem;
}
header .logo span {
  display: flex;
  background-image: url("../resources/icons/logo.svg");
  width: 5.8rem;
  height: 7.4rem;
  background-repeat: no-repeat;
  background-size: cover;
}
header .icon-toggle-wrapper {
  position: relative;
  top: calc(50% - 12rem);
  padding: 2rem 0;
  cursor: pointer;
}
header .icon-toggle-wrapper .icon {
  background: #282A49;
  position: relative;
  width: 5rem;
  margin: 0 2rem;
  height: 0.2rem;
  transition: transform 0.3s;
}
header .icon-toggle-wrapper .icon:after {
  content: "";
  background: #282A49;
  display: block;
  top: 0.8rem;
  right: 0;
  width: 50%;
  height: 0.2rem;
  position: absolute;
  transition: transform 0.3s;
}
header .social-media-list {
  position: absolute;
  bottom: 0;
}
header .social-media-list ul {
  padding: 0;
  margin: 0;
}
header .social-media-list ul li {
  list-style: none;
}
header .social-media-list ul li a {
  display: block;
  margin: 4rem;
}
header .social-media-list ul li a svg {
  width: 2.5rem;
  height: 2.5rem;
  background-repeat: no-repeat;
  background-size: cover;
}
header .social-media-list ul li a g:hover {
  fill: #000;
}
header .nav-items-wrapper {
  background-color: #efefef;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  width: 40.2rem;
  transform: translateX(-100%);
  position: fixed;
  top: 0;
  height: 100%;
  transition: transform 0.7s cubic-bezier(0.32, 0.01, 0, 1) 0s;
  z-index: 1;
}
header .nav-items-wrapper ul {
  margin: 0;
  padding: 0;
}
header .nav-items-wrapper li {
  list-style: none;
}
header .nav-items-wrapper a {
  color: #A1A1A1;
  display: block;
  text-decoration: none;
  font-family: asap_condensedsemibold;
  font-size: 2.8rem;
  margin: 1.3rem 4rem;
  cursor: pointer;
}
header .nav-items-wrapper a:hover, header .nav-items-wrapper a.active {
  color: #DE1E37;
}
header.nav-open .icon-toggle-wrapper .icon {
  background: #DE1E37;
  transform: rotate(45deg);
}
header.nav-open .icon-toggle-wrapper .icon:after {
  background: #DE1E37;
  transform: rotate(90deg);
  width: 100%;
  top: 0;
}
header.nav-open .nav-items-wrapper {
  transform: translateX(10rem);
}

@media (orientation: portrait) {
  html {
    font-size: 0.598vh !important;
  }

  header .header-items {
    width: 100%;
    height: 12rem;
  }
  header .logo {
    float: left;
  }
  header .social-media-list {
    display: none;
  }
  header .icon-toggle-wrapper {
    float: right;
    padding: 6rem 2rem;
    top: 0 !important;
  }
  header .icon-toggle-wrapper .icon {
    height: 0.4rem;
  }
  header .icon-toggle-wrapper .icon:after {
    height: 0.4rem;
  }
  header .nav-items-wrapper {
    text-align: center;
    width: 100%;
  }
  header .nav-items-wrapper .nav-list {
    width: 100%;
  }
  header .nav-items-wrapper a {
    font-size: 6rem;
    margin: 2rem;
  }
  header.nav-open .nav-items-wrapper {
    transform: translateX(0rem) !important;
  }
}
.home-page-wrapper .home-header-section {
  position: relative;
  background-image: url("../resources/images/home-banner.png");
  width: 100%;
  height: 75%;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: -1;
  opacity: 0;
  transition: all 1.5s ease;
  transition-delay: 0.1s;
}
.home-page-wrapper .home-header-section .red-band {
  width: 0;
  height: 0;
  border-top: 7.4rem solid #DE1E37;
  border-left: 7.4rem solid transparent;
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  transform: translateX(200%);
  transition: transform 0.9s cubic-bezier(0.32, 0.01, 0, 1) 1s;
}
.home-page-wrapper .home-header-section .left-caption-section {
  font-family: asap_condensedmedium;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 5rem;
  font-size: 4.8rem;
  color: #FFF;
  transform: translateX(-100%);
  opacity: 0;
  transition: all 1.5s ease;
  transition-delay: 0.6s;
}
.home-page-wrapper .home-header-section .right-caption-content-box {
  background-color: #DE1E37;
  font-family: asap_condensedmedium;
  width: 34.7rem;
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 5rem;
  font-size: 4.8rem;
  color: #fff;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0.2s;
}
.home-page-wrapper .home-footer-section {
  display: block;
  overflow: hidden;
  clear: both;
  display: flex;
  flex-flow: wrap;
  align-items: flex-end;
  height: 25%;
  transform: translateY(100%);
  opacity: 0;
  transition: all 2s ease;
  transition-delay: 1s;
}
.home-page-wrapper .home-footer-section .bottom-branding {
  width: 26rem;
  height: 18rem;
  background-image: url("../resources/icons/logo.svg");
  background-repeat: no-repeat;
  background-size: cover;
  margin-left: 2rem;
}
.home-page-wrapper .home-footer-section .content-section {
  font-family: asap_condensedregular;
  color: #4a4a4a;
  padding-left: 4rem;
  font-size: 2.4rem;
  width: calc(100% - 40.6rem);
  align-self: center;
}
.home-page-wrapper .home-footer-section .more {
  display: inline-block;
}
.home-page-wrapper .home-footer-section .more a {
  display: inline-block;
  text-decoration: none;
  color: #282A49;
  margin-top: 2rem;
}
.home-page-wrapper .home-footer-section .more a:after {
  content: "";
  background-image: url("../resources/icons/right-arrow.svg");
  width: 2.9rem;
  height: 2.9rem;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  margin-left: 2rem;
  transform: rotate(0);
  transition: transform 0.7s cubic-bezier(0.32, 0.01, 0, 1) 0s;
}
.home-page-wrapper .home-footer-section .more a:hover {
  color: #DE1E37;
}
.home-page-wrapper .home-footer-section .more a:hover:after {
  transform: rotate(90deg);
}
.home-page-wrapper.active .home-header-section {
  opacity: 1;
}
.home-page-wrapper.active .home-header-section .red-band, .home-page-wrapper.active .home-header-section .left-caption-section, .home-page-wrapper.active .home-header-section .right-caption-content-box {
  transform: translate(0);
  opacity: 1;
}
.home-page-wrapper.active .home-footer-section {
  transform: translate(0);
  opacity: 1;
  animation-fill-mode: both;
  backface-visibility: visible;
  animation-duration: 2s;
  animation-delay: 1s;
  animation-iteration-count: 1;
  opacity: 1;
}

/* The animation code */
@keyframes home-footer-animation {
  0% {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  100% {
    transform: perspective(400px);
  }
}
@media (orientation: portrait) {
  .page-wrapper {
    margin-left: 0 !important;
    padding-top: 12rem;
  }

  .home-page-wrapper .home-header-section {
    height: calc(60% - 12rem);
  }
  .home-page-wrapper .home-footer-section {
    height: 40%;
  }
  .home-page-wrapper .home-footer-section .content-section {
    font-size: 2.8rem;
  }
}
.our-vision-page-wrapper {
  display: flex;
  height: 100%;
  position: relative;
}
.our-vision-page-wrapper .left-section,
.our-vision-page-wrapper .right-section {
  display: inline-flex;
  width: 50%;
  height: 100%;
  padding: 0;
  justify-content: center;
}
.our-vision-page-wrapper .right-section {
  flex-flow: column;
  width: 46%;
  margin: 0 2%;
  overflow: hidden;
}
.our-vision-page-wrapper .right-section .red-band {
  width: 0;
  height: 0;
  border-top: 7.4rem solid #DE1E37;
  border-left: 7.4rem solid transparent;
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
}
.our-vision-page-wrapper .right-section h3 {
  font-size: 3.6rem;
  color: #282A49;
  margin: 0;
  transform: translateX(-200%);
  transition: transform 1.5s cubic-bezier(0.32, 0.01, 0, 1) 0s;
}
.our-vision-page-wrapper .right-section h3 span {
  color: #DE1E37;
}
.our-vision-page-wrapper .right-section .content-items .item {
  display: block;
  overflow: hidden;
  clear: both;
  display: flex;
  margin: 2rem 0;
  transform: translateX(-200%);
}
.our-vision-page-wrapper .right-section .content-items .item-first {
  transition: transform 1.5s cubic-bezier(0.32, 0.01, 0, 1) 0s;
}
.our-vision-page-wrapper .right-section .content-items .item-first .left {
  background-color: #EC4C4C;
}
.our-vision-page-wrapper .right-section .content-items .item-first span {
  color: #EC4C4C;
}
.our-vision-page-wrapper .right-section .content-items .item-second {
  transition: transform 1.5s cubic-bezier(0.32, 0.01, 0, 1) 0.2s;
}
.our-vision-page-wrapper .right-section .content-items .item-second .left {
  background-color: #F7B948;
}
.our-vision-page-wrapper .right-section .content-items .item-second span {
  color: #F7B948;
}
.our-vision-page-wrapper .right-section .content-items .item-third {
  transition: transform 1.5s cubic-bezier(0.32, 0.01, 0, 1) 0.3s;
}
.our-vision-page-wrapper .right-section .content-items .item-third .left {
  background-color: #438D98;
}
.our-vision-page-wrapper .right-section .content-items .item-third span {
  color: #438D98;
}
.our-vision-page-wrapper .right-section .content-items .item-fourth {
  transition: transform 1.5s cubic-bezier(0.32, 0.01, 0, 1) 0.4s;
}
.our-vision-page-wrapper .right-section .content-items .item-fourth .left {
  background-color: #132237;
}
.our-vision-page-wrapper .right-section .content-items .item-fourth span {
  color: #132237;
}
.our-vision-page-wrapper .right-section .content-items .left {
  float: left;
  width: 9.2rem;
  height: 9.2rem;
  margin-right: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: asap_condensedsemibold;
  align-self: center;
  font-size: 2rem;
}
.our-vision-page-wrapper .right-section .content-items .right {
  float: left;
  width: calc(100% - 9.6rem);
  height: 9.2rem;
  background-color: #EDEDED;
  display: table;
}
.our-vision-page-wrapper .right-section .content-items .right div {
  display: table-cell;
  vertical-align: middle;
  padding: 1rem;
  font-size: 1.8rem;
}
.our-vision-page-wrapper .right-section .content-items .right div span {
  font-family: asap_condensedsemibold;
}
.our-vision-page-wrapper .left-section {
  background-color: #f4f4f4;
  flex-flow: column;
  flex-wrap: wrap;
}
.our-vision-page-wrapper .boxes {
  display: block;
  overflow: hidden;
  clear: both;
  width: calc(61rem + 10px);
  margin: 0 auto;
}
.our-vision-page-wrapper .box {
  background-color: #f4f4f4;
  font-family: asap_condensedmedium;
  width: 26.5rem;
  height: 26.5rem;
  float: left;
  margin: 2px;
  padding: 2rem;
  display: flex;
  flex-flow: column;
  text-align: center;
  justify-content: center;
}
.our-vision-page-wrapper .box h5 {
  font-size: 4rem;
  color: #282A49;
  position: relative;
  padding: 4rem;
  transform: translateX(300%);
  transition: transform 1.5s cubic-bezier(0.32, 0.01, 0, 1) 0.8s;
}
.our-vision-page-wrapper .box h5:after, .our-vision-page-wrapper .box h5:before {
  content: "";
  height: 0.6rem;
  width: 4rem;
  background-color: #DE1E37;
  position: absolute;
  top: calc(50% - .6rem);
}
.our-vision-page-wrapper .box h5:after {
  right: -1rem;
}
.our-vision-page-wrapper .box h5:before {
  left: -1rem;
}
.our-vision-page-wrapper .box .icon {
  background-repeat: no-repeat;
  background-size: cover;
  margin: 0 auto;
}
.our-vision-page-wrapper .box .heading {
  font-size: 2.4rem;
  font-family: asap_condensedsemibold;
  color: #fff;
  padding: 2rem 0;
}
.our-vision-page-wrapper .box .desc {
  font-size: 1.6rem;
  color: #FFF;
}
.our-vision-page-wrapper .box.second {
  background-color: #DE1E37;
  transform: translateX(200%);
  transition: transform 1.5s cubic-bezier(0.32, 0.01, 0, 1) 0.2s;
}
.our-vision-page-wrapper .box.second .icon {
  background-image: url("../resources/icons/our-vision-icon.svg");
  width: 6.6rem;
  height: 6.6rem;
}
.our-vision-page-wrapper .box.third {
  background-color: #F2C528;
  transform: translateX(-200%);
  transition: transform 1.5s cubic-bezier(0.32, 0.01, 0, 1) 0s;
}
.our-vision-page-wrapper .box.third .icon {
  background-image: url("../resources/icons/our-proposition-icon.svg");
  width: 6rem;
  height: 8.1rem;
}
.our-vision-page-wrapper .box.fourth {
  background-color: #282A49;
  transform: translateX(200%);
  transition: transform 1.5s cubic-bezier(0.32, 0.01, 0, 1) 0s;
}
.our-vision-page-wrapper .box.fourth .icon {
  background-image: url("../resources/icons/our-mission-icon.svg");
  width: 6.1rem;
  height: 6.1rem;
}
.our-vision-page-wrapper .box.fourth .desc {
  color: #fff;
}
.our-vision-page-wrapper .bottom-branding {
  width: 26rem;
  height: 18rem;
  background-image: url("../resources/icons/logo.svg");
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}
.our-vision-page-wrapper.active .box.second, .our-vision-page-wrapper.active .box.third, .our-vision-page-wrapper.active .box.fourth,
.our-vision-page-wrapper.active .box h5 {
  transform: translate(0);
}
.our-vision-page-wrapper.active .right-section h3 {
  transform: translate(0);
}
.our-vision-page-wrapper.active .right-section .content-items .item {
  transform: translate(0);
}

@media (orientation: portrait) {
  .our-vision-page-wrapper {
    display: block;
  }
  .our-vision-page-wrapper .left-section,
.our-vision-page-wrapper .right-section {
    display: flex;
    width: 100%;
    height: 45%;
  }
  .our-vision-page-wrapper .right-section {
    position: relative;
    margin: 0;
    height: calc(55% - 12rem);
  }
  .our-vision-page-wrapper .right-section .red-band {
    top: 2.5rem;
    right: 2.5rem;
  }
  .our-vision-page-wrapper .right-section h3 {
    width: calc(100% - 4rem);
    margin: 0 auto;
    font-size: 6rem;
  }
  .our-vision-page-wrapper .right-section .content-items {
    width: calc(100% - 4rem);
    margin: 0 auto;
  }
  .our-vision-page-wrapper .right-section .content-items .left {
    width: 14.2rem;
    height: 14.2rem;
    font-size: 4rem;
  }
  .our-vision-page-wrapper .right-section .content-items .right {
    width: calc(100% - 14.6rem);
    height: 14.6rem;
  }
  .our-vision-page-wrapper .right-section .content-items .right div {
    padding: 0 1rem;
    font-size: 2.8rem;
  }
  .our-vision-page-wrapper .boxes {
    width: calc(74rem + 10px);
  }
  .our-vision-page-wrapper .box {
    width: 33rem;
    height: 33rem;
  }
  .our-vision-page-wrapper .box h5 {
    font-size: 5.5rem;
  }
  .our-vision-page-wrapper .box h5:after, .our-vision-page-wrapper .box h5:before {
    height: 1rem;
  }
  .our-vision-page-wrapper .box .heading {
    font-size: 3.4rem;
  }
  .our-vision-page-wrapper .box .desc {
    font-size: 2.4rem;
  }
  .our-vision-page-wrapper .box.second .icon {
    width: 8.6rem;
    height: 8.6rem;
  }
  .our-vision-page-wrapper .box.third .icon {
    width: 8rem;
    height: 10.1rem;
  }
  .our-vision-page-wrapper .box.fourth .icon {
    width: 8.1rem;
    height: 8.1rem;
  }
  .our-vision-page-wrapper .bottom-branding {
    display: none;
  }
}
.who-we-are-wrapper {
  display: flex;
  height: 100%;
  position: relative;
}
.who-we-are-wrapper h2 {
  font-size: 4rem;
  color: #282A49;
  position: relative;
  padding: 0 4rem;
  display: inline-block;
  align-self: flex-start;
}
.who-we-are-wrapper h2:after, .who-we-are-wrapper h2:before {
  content: "";
  height: 0.6rem;
  width: 4rem;
  background-color: #DE1E37;
  position: absolute;
  top: calc(50% - .6rem);
}
.who-we-are-wrapper h2:after {
  right: -1rem;
}
.who-we-are-wrapper h2:before {
  left: -1rem;
}
.who-we-are-wrapper .left-section,
.who-we-are-wrapper .right-section {
  display: inline-flex;
  width: 60%;
  height: 100%;
  padding-top: 10rem;
}
.who-we-are-wrapper .right-section {
  background-color: #282A49;
  flex-flow: column;
  width: 30%;
  padding: 10rem 5% 0;
  overflow: hidden;
  color: #fff;
  transform: translateY(100%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 0.5s;
}
.who-we-are-wrapper .right-section h2 {
  color: #fff;
  margin: 0 0 2rem 0;
}
.who-we-are-wrapper .right-section .content {
  font-size: asap_condensedregular;
  font-size: 2rem;
}
.who-we-are-wrapper .left-section {
  background-color: #f4f4f4;
  flex-flow: column;
  flex-wrap: wrap;
  position: relative;
}
.who-we-are-wrapper .left-section h2 {
  margin: 0 0 2rem 8rem;
  transform: translateX(-200%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 1s;
}
.who-we-are-wrapper .boxes {
  display: block;
  overflow: hidden;
  clear: both;
  width: 83.2rem;
  margin: 0 auto;
}
.who-we-are-wrapper .box {
  background-color: #f4f4f4;
  font-family: asap_condensedmedium;
  width: 20.7rem;
  height: 12.6rem;
  float: left;
  margin: 1.5rem;
  padding: 2rem;
  font-size: 1.6rem;
  color: #fff;
}
.who-we-are-wrapper .box h6 {
  font-family: asap_condensedsemibold;
  font-size: 1.6rem;
  padding: 1.2rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  margin: 0;
}
.who-we-are-wrapper .box .copy {
  font-family: asap_condensedregular;
  margin-top: 1.2rem;
}
.who-we-are-wrapper .box-01 {
  background-color: #5ED3B6;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0s;
}
.who-we-are-wrapper .box-02 {
  background-color: #C7AC8E;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0.2s;
}
.who-we-are-wrapper .box-03 {
  background-color: #50BFEA;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0.4s;
}
.who-we-are-wrapper .box-04 {
  background-color: #F8B238;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0.6s;
}
.who-we-are-wrapper .box-05 {
  background-color: #F37E53;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0.8s;
}
.who-we-are-wrapper .box-06 {
  background-color: #A3CDA5;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 1s;
}
.who-we-are-wrapper .box-07 {
  background-color: #849D9A;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 1.2s;
}
.who-we-are-wrapper .box-08 {
  background-color: #F75167;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 1.4s;
}
.who-we-are-wrapper .red-band {
  width: 0;
  height: 0;
  border-top: 7.4rem solid #DE1E37;
  border-left: 7.4rem solid transparent;
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  transform: translateY(-200%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 1.6s;
}
.who-we-are-wrapper .bottom-branding {
  width: 26rem;
  height: 18rem;
  background-image: url("../resources/icons/logo.svg");
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  bottom: 0;
  right: 0;
  margin-bottom: 10rem;
  transform: translateY(100%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 1.6s;
}
.who-we-are-wrapper.active .box-01, .who-we-are-wrapper.active .box-02, .who-we-are-wrapper.active .box-03, .who-we-are-wrapper.active .box-04, .who-we-are-wrapper.active .box-05, .who-we-are-wrapper.active .box-06, .who-we-are-wrapper.active .box-07, .who-we-are-wrapper.active .box-08 {
  transform: translate(0);
}
.who-we-are-wrapper.active .right-section,
.who-we-are-wrapper.active .left-section h2,
.who-we-are-wrapper.active .bottom-branding,
.who-we-are-wrapper.active .red-band {
  transform: translate(0);
}

@media (orientation: portrait) {
  .who-we-are-wrapper {
    flex-flow: column;
  }
  .who-we-are-wrapper .left-section,
.who-we-are-wrapper .right-section {
    width: 100%;
  }
  .who-we-are-wrapper .left-section {
    padding-top: 0;
  }
  .who-we-are-wrapper .left-section h2 {
    margin: 2rem 4rem;
  }
  .who-we-are-wrapper .right-section {
    width: 100%;
    padding: 0;
  }
  .who-we-are-wrapper .right-section h2 {
    margin: 0rem 0rem 0rem 5rem;
    padding: 4rem;
    font-size: 5rem;
  }
  .who-we-are-wrapper .right-section .content {
    padding: 0 4rem 4rem;
    font-size: 2.5rem;
  }
  .who-we-are-wrapper .boxes {
    width: 74.2rem;
  }
  .who-we-are-wrapper .box {
    width: 19.7rem;
    height: 19.4rem;
    margin: 0.5rem;
    font-size: 2.6rem;
  }
  .who-we-are-wrapper .box h6 {
    font-size: 2.6rem;
  }
  .who-we-are-wrapper h6 {
    font-size: 2rem;
  }
  .who-we-are-wrapper .bottom-branding {
    margin-bottom: 2rem;
  }
}
#our-services {
  background-color: #f4f4f4;
}
#our-services .top-section {
  border-bottom: 1px solid #eaeaea;
  position: relative;
  margin-bottom: 2rem;
  text-align: center;
  background-color: #FFF;
  transform: translateY(-200%);
  transition: transform 0.5s cubic-bezier(0.32, 0.01, 0, 1) 0.5s;
}
#our-services .top-section .red-band {
  width: 0;
  height: 0;
  border-top: 7.4rem solid #DE1E37;
  border-left: 7.4rem solid transparent;
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
}
#our-services .top-section h2 {
  font-size: 4rem;
  color: #282A49;
  position: relative;
  padding: 0 4rem;
  display: inline-block;
  align-self: flex-start;
}
#our-services .top-section h2:after, #our-services .top-section h2:before {
  content: "";
  height: 0.6rem;
  width: 4rem;
  background-color: #DE1E37;
  position: absolute;
  top: calc(50% - .6rem);
}
#our-services .top-section h2:after {
  right: -1rem;
}
#our-services .top-section h2:before {
  left: -1rem;
}
#our-services .tabs {
  border-top: 1px solid #eaeaea;
  border-bottom: 1px solid #eaeaea;
  width: calc(106.51rem + 6px);
  margin: 0 auto;
  background-color: #FFF;
  transform: translateX(200%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 1s;
}
#our-services .tabs ul {
  display: block;
  overflow: hidden;
  clear: both;
  padding: 0;
  margin: 0;
}
#our-services .tabs span {
  display: block;
}
#our-services .tabs span.icon {
  margin-bottom: 2.4rem;
  background-repeat: no-repeat;
  background-size: cover;
}
#our-services .tabs span.tab-name {
  font-family: asap_condensedbold;
  font-size: 1.8rem;
  color: #282A49;
}
#our-services .tabs li {
  border-right: 1px solid #eaeaea;
  cursor: pointer;
  float: left;
  display: flex;
  flex-flow: column;
  justify-content: center;
  list-style: none;
  width: 21.3rem;
  height: 12.8rem;
  text-align: center;
  background-color: #FFF;
  transition: 0.8s;
}
#our-services .tabs li:first-child {
  border-left: 1px solid #eaeaea;
}
#our-services .tabs li .tab-name {
  font-family: asap_condensedbold;
  font-size: 1.8rem;
  color: #282A49;
}
#our-services .tabs li:hover, #our-services .tabs li.active {
  background-color: #DE1E37;
  background-position: 0 100%;
}
#our-services .tabs li:hover .icon svg g, #our-services .tabs li.active .icon svg g {
  fill: #fff;
  opacity: 1;
}
#our-services .tabs li:hover .tab-name, #our-services .tabs li.active .tab-name {
  color: #fff;
}
#our-services .tabs #accounts .icon svg {
  width: 5.2rem;
  height: 4.5rem;
}
#our-services .tabs #management .icon svg {
  width: 4rem;
  height: 4.8rem;
}
#our-services .tabs #educational .icon svg {
  width: 6rem;
  height: 5rem;
}
#our-services .tabs #advertising .icon svg {
  width: 4.8rem;
  height: 4.8rem;
}
#our-services .tabs #technical .icon svg {
  width: 4.9rem;
  height: 5.1rem;
}
#our-services .tab-content-wrapper {
  width: 107.4rem;
  margin: 0 auto;
  padding-top: 1rem;
  transform: translateX(-200%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 1s;
}
#our-services .accounts-content-wrapper {
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 1s;
  display: grid;
  grid-template-columns: 25.9rem 25.9rem 25.9rem;
  column-gap: 1rem;
  grid-template-rows: auto;
  grid-template-areas: "ac fc fc erp" "pr ps ad erp";
  row-gap: 1rem;
}
#our-services .accounts-content-wrapper.hide {
  display: none;
  opacity: 0;
}
#our-services .accounts-content-wrapper.show {
  display: grid;
  opacity: 1;
}
#our-services .accounts-content-wrapper .card-name {
  font-family: asap_condensedbold;
  font-size: 1.6rem;
  color: #FFF;
}
#our-services .accounts-content-wrapper .icon {
  margin-bottom: 2rem;
  background-repeat: no-repeat;
  background-size: cover;
}
#our-services .accounts-content-wrapper h5 {
  font-family: asap_condensedbold;
}
#our-services .accounts-content-wrapper .flip-card {
  width: 25.9rem;
  height: 25.9rem;
  perspective: 100rem;
  cursor: pointer;
}
#our-services .accounts-content-wrapper .flip-card .flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}
#our-services .accounts-content-wrapper .flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}
#our-services .accounts-content-wrapper .flip-card .flip-card-front, #our-services .accounts-content-wrapper .flip-card .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
#our-services .accounts-content-wrapper .flip-card .flip-card-front {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
}
#our-services .accounts-content-wrapper .flip-card .flip-card-back {
  color: #282A49;
  font-family: asap_condensedregular;
  font-size: 1.6rem;
  transform: rotateY(180deg);
  text-align: left;
  padding: 0 2rem;
  width: auto;
}
#our-services .accounts-content-wrapper .flip-card .flip-card-back h5 {
  font-family: asap_condensedbold;
}
#our-services .accounts-content-wrapper .flip-card .flip-card-back ul {
  margin: 0;
  padding: 0 2rem;
}
#our-services .accounts-content-wrapper .flip-card .flip-card-back ul li {
  position: relative;
  list-style: none;
}
#our-services .accounts-content-wrapper .flip-card .flip-card-back ul li:before {
  content: "";
  position: absolute;
  background-image: url("../resources/icons/right-arrow.svg");
  width: 1.2rem;
  height: 1.2rem;
  background-repeat: no-repeat;
  background-size: cover;
  left: -2rem;
  top: 0.4rem;
}
#our-services .accounts-content-wrapper .accounting {
  background-color: #5ED3B6;
  grid-area: ac;
}
#our-services .accounts-content-wrapper .accounting .icon {
  background-image: url("../resources/icons/accounting-icon.svg");
  width: 6.5rem;
  height: 6.4rem;
}
#our-services .accounts-content-wrapper .financial-services {
  background-color: #C7AC8E;
  grid-area: fc;
  width: calc(51.8rem + 1rem);
}
#our-services .accounts-content-wrapper .financial-services .icon {
  background-image: url("../resources/icons/financial-icon.svg");
  width: 6.4rem;
  height: 6.4rem;
}
#our-services .accounts-content-wrapper .erp-software {
  background-color: #50BFEA;
  grid-area: erp;
  height: calc(51.8rem + 1rem);
}
#our-services .accounts-content-wrapper .erp-software .icon {
  background-image: url("../resources/icons/erp-icon.svg");
  width: 6.4rem;
  height: 6.4rem;
}
#our-services .accounts-content-wrapper .payroll-services {
  background-color: #F8B238;
  grid-area: pr;
}
#our-services .accounts-content-wrapper .payroll-services .icon {
  background-image: url("../resources/icons/payroll-icon.svg");
  width: 5.4rem;
  height: 6.4rem;
}
#our-services .accounts-content-wrapper .vat {
  background-color: #F37E53;
  grid-area: ps;
}
#our-services .accounts-content-wrapper .vat .icon {
  background-image: url("../resources/icons/vat-icon.svg");
  width: 6.1rem;
  height: 6rem;
}
#our-services .accounts-content-wrapper .vat.flip-card .flip-card-back {
  width: 100%;
  padding: 0;
  margin-left: -2rem;
}
#our-services .accounts-content-wrapper .interal-audit {
  background-color: #A3CDA5;
  grid-area: ad;
}
#our-services .accounts-content-wrapper .interal-audit .icon {
  background-image: url("../resources/icons/audit-icon.svg");
  width: 6.4rem;
  height: 6.5rem;
}
#our-services .management {
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 1s;
}
#our-services .management.hide {
  display: none;
  opacity: 0;
}
#our-services .management.show {
  display: block;
  opacity: 1;
}
#our-services .management .content {
  margin-bottom: 2rem;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("../resources/icons/educational-content.svg");
  width: 88.2rem;
  height: 47.4rem;
  margin: 0 auto;
}
#our-services .educational {
  display: flex;
  flex-flow: row wrap;
}
#our-services .educational.hide {
  display: none;
  opacity: 0;
}
#our-services .educational.show {
  display: flex;
  opacity: 1;
}
#our-services .educational .educational-right-section {
  width: 54rem;
  display: block;
  overflow: hidden;
  clear: both;
}
#our-services .educational .educational-right-section .box {
  width: 24.8rem;
  height: 24.8rem;
  float: left;
  margin-left: 2rem;
}
#our-services .educational .educational-right-section .box h6 {
  font-size: 2.4rem;
  font-family: asap_condensedbold;
  color: #FFF;
  padding: 9.2rem 0;
  margin: 0px;
  text-align: center;
  padding: 9.2rem 2rem;
}
#our-services .educational .educational-right-section .first {
  background-color: #EC4C4C;
  margin-bottom: 2rem;
}
#our-services .educational .educational-right-section .second {
  background-color: #F7B948;
  margin-bottom: 2rem;
}
#our-services .educational .educational-right-section .second h6 {
  padding: 7.6rem 2rem;
}
#our-services .educational .educational-right-section .third {
  background-color: #438D98;
}
#our-services .educational .educational-right-section .fourth {
  background-color: #132237;
}
#our-services .educational .educational-left-section {
  background-color: #282A49;
  font-family: asap_condensedbold;
  position: relative;
  font-size: 1.4rem;
  color: #FFF;
  width: 53.2rem;
  height: 51.6rem;
}
#our-services .educational .educational-left-section .center-circle {
  position: relative;
  display: block;
  width: 19.3rem;
  height: 19.3rem;
  background-color: #FFF;
  border-radius: 50%;
  margin: 16rem auto;
  color: #282A49;
}
#our-services .educational .educational-left-section .center-circle .t {
  position: absolute;
  height: 4.2rem;
  top: -4.2rem;
  left: 9.65rem;
  width: 2px;
  background-color: #FFF;
  bottom: unset;
}
#our-services .educational .educational-left-section .center-circle .t:before {
  content: "";
  width: 3.2rem;
  height: 2px;
  display: block;
  margin-left: -1.5rem;
  background-color: #FFF;
}
#our-services .educational .educational-left-section .center-circle .t.right-t {
  top: 7.8rem;
  right: -2.15rem;
  transform: rotate(90deg);
  left: unset;
}
#our-services .educational .educational-left-section .center-circle .t.bottom-t {
  bottom: -4.2rem;
  left: 9.65rem;
  transform: rotate(180deg);
  top: unset;
}
#our-services .educational .educational-left-section .center-circle .t.left-t {
  top: 7.8rem;
  left: -2.16rem;
  transform: rotate(270deg);
  right: unset;
}
#our-services .educational .educational-left-section .center-circle h3 {
  font-family: asap_condensedbold;
  position: absolute;
  font-size: 2.4rem;
  padding: 8.2rem 3.6rem;
  margin: 0;
}
#our-services .educational .educational-left-section .top-content {
  position: absolute;
  top: 7.6rem;
  left: 13rem;
  color: #FFF;
}
#our-services .educational .educational-left-section .top-content .left, #our-services .educational .educational-left-section .top-content .right {
  font-family: asap_condensedregular;
  display: inline-block;
  width: 10rem;
  font-size: 1.2rem;
  opacity: 0.5;
}
#our-services .educational .educational-left-section .top-content .left {
  width: 8.8rem;
  text-align: right;
}
#our-services .educational .educational-left-section .top-content .center {
  font-family: asap_condensedbold;
  font-size: 1.4rem;
  padding: 0 2rem;
  display: inline-block;
  width: 6.2rem;
  text-align: center;
}
#our-services .educational .educational-left-section .left-content {
  position: absolute;
  top: 25.2rem;
  left: 8rem;
}
#our-services .educational .educational-left-section .right-content {
  position: absolute;
  top: 24.2rem;
  right: 5rem;
  width: 6.8rem;
}
#our-services .educational .educational-left-section .bottom-content {
  position: absolute;
  bottom: 9.8rem;
  left: 23rem;
}
#our-services .advertising.hide {
  display: none;
  opacity: 0;
}
#our-services .advertising.show {
  display: block;
  opacity: 1;
}
#our-services .advertising .advertising-right-content {
  display: inline-block;
  width: 48.6rem;
  height: 41.8rem;
}
#our-services .advertising .advertising-right-content img {
  width: 48.6rem;
  height: 41.8rem;
}
#our-services .advertising .advertising-left-contnet {
  display: inline-block;
  width: 50.6rem;
  margin-right: 8rem;
}
#our-services .advertising .advertising-left-contnet h3 {
  font-family: asap_condensedmedium;
  color: #282A49;
  font-size: 2rem;
  padding: 2rem 0;
}
#our-services .advertising .advertising-left-contnet ul {
  padding: 0;
  margin: 0;
}
#our-services .advertising .advertising-left-contnet ul li {
  position: relative;
  font-size: 1.6rem;
  padding: 0.69rem 4rem;
  background-color: #FFF;
  margin: 0.2rem 0;
  list-style: none;
}
#our-services .advertising .advertising-left-contnet ul li:before {
  content: "";
  position: absolute;
  background-image: url("../resources/icons/right-arrow.svg");
  width: 1.2rem;
  height: 1.2rem;
  background-size: cover;
  background-repeat: no-repeat;
  left: 1.5rem;
  top: 1rem;
}
#our-services.active .top-section, #our-services.active .tabs, #our-services.active .tab-content-wrapper {
  transform: translate(0);
}

@media (orientation: portrait) {
  #our-services .top-section h2 {
    font-size: 5rem;
  }
  #our-services .tabs {
    width: calc(82.51rem + 6px);
  }
  #our-services .tabs li {
    width: 16.5rem;
  }
  #our-services .tab-content-wrapper {
    width: 100%;
  }
  #our-services .accounts-content-wrapper {
    grid-template-columns: 40.4rem 37.9rem;
    grid-template-areas: "ac erp" "pr erp" "fc fc" "ps ad";
    width: 82rem;
    margin: 0 auto;
  }
  #our-services .accounts-content-wrapper .flip-card {
    width: 40.4rem;
    height: 25.9rem;
  }
  #our-services .accounts-content-wrapper .erp-software {
    height: calc(51.8rem + 1rem);
  }
  #our-services .accounts-content-wrapper .card-name {
    font-size: 2.6rem;
  }
  #our-services .accounts-content-wrapper .flip-card .flip-card-back {
    font-size: 1.9rem;
  }
  #our-services .accounts-content-wrapper .accounting .icon {
    width: 9.5rem;
    height: 9.4rem;
  }
  #our-services .accounts-content-wrapper .payroll-services .icon {
    width: 7.4rem;
    height: 8.8rem;
  }
  #our-services .accounts-content-wrapper .vat .icon {
    width: 9.1rem;
    height: 9rem;
  }
  #our-services .accounts-content-wrapper .erp-software .icon {
    width: 9.4rem;
    height: 9.4rem;
  }
  #our-services .accounts-content-wrapper .interal-audit .icon {
    width: 9.4rem;
    height: 9.5rem;
  }
  #our-services .accounts-content-wrapper .financial-services {
    width: calc(80.8rem + 1rem);
  }
  #our-services .accounts-content-wrapper .financial-services .icon {
    width: 9.4rem;
    height: 9.4rem;
  }
  #our-services .educational {
    width: 77rem;
    margin: 0 auto;
  }
  #our-services .educational .educational-left-section {
    width: 100%;
  }
  #our-services .educational .educational-left-section .right-content {
    right: 17rem;
  }
  #our-services .educational .educational-left-section .left-content {
    left: 20rem;
  }
  #our-services .educational .educational-left-section .bottom-content {
    left: 35rem;
  }
  #our-services .educational .educational-left-section .top-content {
    left: 24.5rem;
  }
  #our-services .educational .educational-right-section {
    width: 77rem;
  }
  #our-services .educational .educational-right-section .box {
    width: 100%;
    height: 13.8rem;
    margin: 1rem 0;
  }
  #our-services .educational .educational-right-section .box.first {
    margin-top: 2rem;
  }
  #our-services .educational .educational-right-section .box h6 {
    padding: 5.4rem;
  }
  #our-services .management .content {
    width: 80.5rem;
    height: 43.4rem;
  }
  #our-services .advertising {
    width: 82rem;
    margin: 0 auto;
  }
  #our-services .advertising .advertising-left-contnet {
    width: 100%;
    margin-right: 0;
  }
  #our-services .advertising .advertising-left-contnet h3 {
    font-size: 4rem;
    padding: 0;
    margin: 2rem 0;
  }
  #our-services .advertising .advertising-left-contnet ul li {
    font-size: 3.2rem;
    padding: 1.8rem 6rem;
  }
  #our-services .advertising .advertising-left-contnet ul li:before {
    width: 2.2rem;
    height: 2.2rem;
    top: 2.8rem;
    left: 1.5rem;
  }
  #our-services .advertising .advertising-right-content {
    display: none;
  }
}
.why-us-wrapper {
  display: flex;
  height: 100%;
  position: relative;
}
.why-us-wrapper h2 {
  font-size: 4rem;
  color: #282A49;
  position: relative;
  padding: 0 4rem;
  display: inline-block;
  align-self: flex-start;
}
.why-us-wrapper h2:after, .why-us-wrapper h2:before {
  content: "";
  height: 0.6rem;
  width: 4rem;
  background-color: #DE1E37;
  position: absolute;
  top: calc(50% - .6rem);
}
.why-us-wrapper h2:after {
  right: -1rem;
}
.why-us-wrapper h2:before {
  left: -1rem;
}
.why-us-wrapper .left-section,
.why-us-wrapper .right-section {
  display: inline-flex;
  width: 60%;
  height: 100%;
  padding-top: 10rem;
}
.why-us-wrapper .right-section {
  background-color: #282A49;
  flex-flow: column;
  width: 30%;
  padding: 10rem 5% 0;
  overflow: hidden;
  color: #fff;
  transform: translateY(100%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 0.5s;
}
.why-us-wrapper .right-section h2 {
  color: #fff;
  margin: 0 0 2rem 0;
}
.why-us-wrapper .right-section .content {
  font-size: asap_condensedregular;
  font-size: 1.6rem;
}
.why-us-wrapper .right-section .content .client-logo {
  display: block;
  height: 16.7rem;
}
.why-us-wrapper .right-section .content .client-logo img {
  background-size: cover;
}
.why-us-wrapper .right-section .quotation {
  position: absolute;
  font-size: 12rem;
  color: #FFF;
  opacity: 0.5;
}
.why-us-wrapper .right-section .quotation.top {
  top: 31.6rem;
  right: 4.5rem;
}
.why-us-wrapper .right-section .quotation.bottom {
  top: 55.5rem;
  left: 8rem;
}
.why-us-wrapper .right-section .content-slider-wrapper {
  background-image: url("../resources/icons/client-review-icon.svg");
  width: 51rem;
  height: 52.8rem;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 2rem;
}
.why-us-wrapper .right-section .content-slider-wrapper h6, .why-us-wrapper .right-section .content-slider-wrapper h5 {
  font-family: asap_condensedsemibold;
  margin: 0;
  padding: 0;
  font-size: 1.6rem;
}
.why-us-wrapper .right-section .slick-next, .why-us-wrapper .right-section .slick-prev {
  top: unset;
  bottom: 1.5rem;
}
.why-us-wrapper .right-section .slick-next::before, .why-us-wrapper .right-section .slick-prev::before {
  content: "";
  background-image: url("../resources/icons/right-arrow.svg");
  position: absolute;
  width: 5.4rem;
  height: 5.4rem;
  background-size: cover;
  background-repeat: no-repeat;
}
.why-us-wrapper .right-section .slick-next:hover::before, .why-us-wrapper .right-section .slick-prev:hover::before {
  background-image: url("../resources/icons/left-arrow-whitle.svg");
}
.why-us-wrapper .right-section .slick-next {
  right: 4rem;
}
.why-us-wrapper .right-section .slick-next:hover::before {
  transform: rotate(180deg);
}
.why-us-wrapper .right-section .slick-prev {
  left: unset;
  right: 12rem;
}
.why-us-wrapper .right-section .slick-prev::before {
  transform: rotate(180deg);
}
.why-us-wrapper .right-section .slick-prev:hover::before {
  transform: initial;
}
.why-us-wrapper .left-section {
  background-color: #f4f4f4;
  flex-flow: column;
  flex-wrap: wrap;
  position: relative;
}
.why-us-wrapper .left-section h2 {
  margin: 0 0 2rem 8rem;
  transform: translateX(-200%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 1s;
}
.why-us-wrapper .boxes {
  display: block;
  overflow: hidden;
  clear: both;
  width: 83.2rem;
  margin: 0 auto;
}
.why-us-wrapper .box {
  background-color: #f4f4f4;
  font-family: asap_condensedmedium;
  width: 20.7rem;
  height: 12.6rem;
  float: left;
  margin: 1.5rem;
  padding: 2rem;
  font-size: 1.6rem;
  color: #fff;
}
.why-us-wrapper .box h6 {
  font-family: asap_condensedsemibold;
  font-size: 1.6rem;
  padding: 1.2rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  margin: 0;
}
.why-us-wrapper .box .copy {
  font-family: asap_condensedregular;
  margin-top: 1.2rem;
}
.why-us-wrapper .box-01 {
  background-color: #5ED3B6;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0s;
}
.why-us-wrapper .box-02 {
  background-color: #C7AC8E;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0.2s;
}
.why-us-wrapper .box-03 {
  background-color: #50BFEA;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0.4s;
}
.why-us-wrapper .box-04 {
  background-color: #F8B238;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0.6s;
}
.why-us-wrapper .box-05 {
  background-color: #F37E53;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 0.8s;
}
.why-us-wrapper .box-06 {
  background-color: #A3CDA5;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 1s;
}
.why-us-wrapper .box-07 {
  background-color: #849D9A;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 1.2s;
}
.why-us-wrapper .box-08 {
  background-color: #F75167;
  transform: translateX(400%);
  transition: transform 1s cubic-bezier(0.32, 0.01, 0, 1) 1.4s;
}
.why-us-wrapper .red-band {
  width: 0;
  height: 0;
  border-top: 7.4rem solid #DE1E37;
  border-left: 7.4rem solid transparent;
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  transform: translateY(-200%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 1.6s;
}
.why-us-wrapper .bottom-branding {
  width: 26rem;
  height: 18rem;
  background-image: url("../resources/icons/logo.svg");
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  bottom: 0;
  right: 0;
  margin-bottom: 10rem;
  transform: translateY(100%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 1.6s;
}
.why-us-wrapper.active .box-01, .why-us-wrapper.active .box-02, .why-us-wrapper.active .box-03, .why-us-wrapper.active .box-04, .why-us-wrapper.active .box-05, .why-us-wrapper.active .box-06, .why-us-wrapper.active .box-07, .why-us-wrapper.active .box-08 {
  transform: translate(0);
}
.why-us-wrapper.active .right-section,
.why-us-wrapper.active .left-section h2,
.why-us-wrapper.active .bottom-branding,
.why-us-wrapper.active .red-band {
  transform: translate(0);
}

@media (orientation: portrait) {
  .why-us-wrapper {
    flex-flow: column;
  }
  .why-us-wrapper .left-section,
.why-us-wrapper .right-section {
    width: 100%;
  }
  .why-us-wrapper .left-section {
    padding-top: 0;
  }
  .why-us-wrapper .left-section h2 {
    margin: 2rem 4rem;
  }
  .why-us-wrapper .right-section {
    width: 100%;
    padding: 0;
  }
  .why-us-wrapper .right-section h2 {
    margin: 0rem 0rem 0rem 5rem;
    padding: 4rem;
    font-size: 4rem;
  }
  .why-us-wrapper .right-section .content {
    padding: 0 4rem 4rem;
    font-size: 1.8rem;
  }
  .why-us-wrapper .right-section .quotation.top {
    top: 28.6rem;
    right: 17.5rem;
  }
  .why-us-wrapper .right-section .quotation.bottom {
    top: 51.5rem;
    left: 17rem;
  }
  .why-us-wrapper .right-section .content-slider-wrapper {
    margin: 0 auto;
  }
  .why-us-wrapper .right-section .slick-prev,
.why-us-wrapper .right-section .slick-next {
    bottom: 3rem;
  }
  .why-us-wrapper .boxes {
    width: 74.2rem;
  }
  .why-us-wrapper .box {
    width: 19.7rem;
    height: 19.4rem;
    margin: 0.5rem;
    font-size: 2.6rem;
  }
  .why-us-wrapper .box h6 {
    font-size: 2.6rem;
  }
  .why-us-wrapper h6 {
    font-size: 2rem;
  }
  .why-us-wrapper .bottom-branding {
    margin-bottom: 2rem;
  }
}
.contact-us-wrapper {
  display: flex;
  height: 100%;
  position: relative;
}
.contact-us-wrapper h2 {
  font-size: 4rem;
  color: #282A49;
  position: relative;
  padding: 0 4rem;
  display: inline-block;
  align-self: flex-start;
}
.contact-us-wrapper h2:after, .contact-us-wrapper h2:before {
  content: "";
  height: 0.6rem;
  width: 4rem;
  background-color: #DE1E37;
  position: absolute;
  top: calc(50% - .6rem);
}
.contact-us-wrapper h2:after {
  right: -1rem;
}
.contact-us-wrapper h2:before {
  left: -1rem;
}
.contact-us-wrapper .left-section,
.contact-us-wrapper .right-section {
  display: inline-block;
  width: 60%;
  height: 100%;
  padding-top: 6rem;
}
.contact-us-wrapper .right-section {
  background-color: #f4f4f4;
  position: relative;
  width: 30%;
  padding: 10rem 5% 0;
  overflow: hidden;
  color: #fff;
  transform: translateY(100%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 0.5s;
}
.contact-us-wrapper .right-section .address-section {
  color: #282A49;
  font-family: asap_condensedregular;
  font-size: 2.4rem;
  margin-top: 12rem;
}
.contact-us-wrapper .right-section .address-section h6 {
  font-family: asap_condensedbold;
  color: #DE1E37;
  font-size: 2.4rem;
  margin: 2rem 0;
}
.contact-us-wrapper .right-section .address-section .follow-us ul {
  padding: 0;
  margin: 0;
}
.contact-us-wrapper .right-section .address-section .follow-us ul li {
  list-style: none;
  float: left;
  margin-right: 2rem;
}
.contact-us-wrapper .right-section .address-section .follow-us ul li a svg {
  width: 2.5rem;
  height: 2.5rem;
  background-repeat: no-repeat;
  background-size: cover;
}
.contact-us-wrapper .right-section .address-section .follow-us ul li a g:hover {
  fill: #000;
}
.contact-us-wrapper .left-section {
  display: block;
  overflow: hidden;
  clear: both;
  background-color: #282A49;
  position: relative;
  transform: translateY(-100%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 0.5s;
}
.contact-us-wrapper .left-section h2 {
  float: left;
  color: #FFF;
  margin: 0 0 2rem 8rem;
  transform: translateX(-200%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 1s;
}
.contact-us-wrapper .left-section .container {
  padding: 8rem 7.4rem;
}
.contact-us-wrapper .left-section label {
  font-family: asap_condensedbold;
  font-size: 2rem;
  color: #FFF;
  margin-top: 2.4rem;
  display: block;
}
.contact-us-wrapper .left-section input, .contact-us-wrapper .left-section textarea {
  background-color: #282A49;
  font-family: asap_condensedregular;
  display: block;
  width: 100%;
  border: none;
  border-bottom: 0.2rem solid #FFF;
  padding: 1.5rem 0;
  color: #FFF;
}
.contact-us-wrapper .left-section input::placeholder, .contact-us-wrapper .left-section textarea::placeholder {
  opacity: 0.3;
}
.contact-us-wrapper .left-section input.submit-btn {
  background-color: #DE1E37;
  font-family: asap_condensedbold;
  color: #FFF;
  float: right;
  border: none;
  font-size: 2rem;
  width: 16rem;
  height: 6rem;
  margin-top: 4rem;
}
.contact-us-wrapper .left-section input.submit-btn:hover {
  color: #DE1E37;
  background-color: #FFF;
}
.contact-us-wrapper .left-section form.hide {
  display: none;
}
.contact-us-wrapper .left-section .on-sucess {
  display: none;
}
.contact-us-wrapper .left-section .on-sucess.show {
  display: block;
  font-size: 4rem;
  color: #FFF;
}
.contact-us-wrapper .red-band {
  width: 0;
  height: 0;
  border-top: 7.4rem solid #DE1E37;
  border-left: 7.4rem solid transparent;
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  transform: translateY(-200%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 1.6s;
}
.contact-us-wrapper .bottom-branding {
  width: 26rem;
  height: 18rem;
  background-image: url("../resources/icons/logo.svg");
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  bottom: 0;
  left: 2rem;
  margin-bottom: 10rem;
  transform: translateY(100%);
  transition: transform 1.8s cubic-bezier(0.32, 0.01, 0, 1) 1.6s;
}
.contact-us-wrapper.active .right-section,
.contact-us-wrapper.active .left-section,
.contact-us-wrapper.active .left-section h2,
.contact-us-wrapper.active .bottom-branding,
.contact-us-wrapper.active .red-band {
  transform: translate(0);
}

@media (orientation: portrait) {
  .contact-us-wrapper {
    flex-flow: column;
  }
  .contact-us-wrapper .left-section,
.contact-us-wrapper .right-section {
    width: 100%;
  }
  .contact-us-wrapper .left-section {
    padding-top: 0;
  }
  .contact-us-wrapper .left-section .container {
    padding: 8rem 4rem;
  }
  .contact-us-wrapper .left-section input, .contact-us-wrapper .left-section textarea {
    font-size: 2rem;
  }
  .contact-us-wrapper .left-section h2 {
    margin: 2rem 4rem;
  }
  .contact-us-wrapper .right-section {
    width: 100%;
    padding: 0;
  }
  .contact-us-wrapper .right-section .address-section {
    font-size: 3.2rem;
    padding: 0 4rem;
  }
  .contact-us-wrapper .right-section .address-section h6 {
    font-size: 3.2rem;
  }
  .contact-us-wrapper .right-section .address-section .follow-us ul li a svg {
    width: 4rem;
    height: 4rem;
  }
}
/* Slider */
.slick-loading .slick-list {
  background: #fff url("./ajax-loader.gif") center center no-repeat;
}

/* Icons */
@font-face {
  font-family: "slick";
  src: url("./fonts/slick.eot");
  src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
}
.slick-prev:hover, .slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  outline: none;
  background: transparent;
  color: transparent;
}
.slick-prev:hover:before, .slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
  opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: 0.25;
}
.slick-prev:before,
.slick-next:before {
  font-family: "slick";
  font-size: 20px;
  line-height: 1;
  color: white;
  opacity: 0.75;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
  left: -25px;
}
[dir=rtl] .slick-prev {
  left: auto;
  right: -25px;
}
.slick-prev:before {
  content: "←";
}
[dir=rtl] .slick-prev:before {
  content: "→";
}

.slick-next {
  right: -25px;
}
[dir=rtl] .slick-next {
  left: -25px;
  right: auto;
}
.slick-next:before {
  content: "→";
}
[dir=rtl] .slick-next:before {
  content: "←";
}

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px;
}

.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
}
.slick-dots li {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}
.slick-dots li button {
  border: 0;
  background: transparent;
  display: block;
  height: 20px;
  width: 20px;
  outline: none;
  line-height: 0px;
  font-size: 0px;
  color: transparent;
  padding: 5px;
  cursor: pointer;
}
.slick-dots li button:hover, .slick-dots li button:focus {
  outline: none;
}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {
  opacity: 1;
}
.slick-dots li button:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "•";
  width: 20px;
  height: 20px;
  font-family: "slick";
  font-size: 6px;
  line-height: 20px;
  text-align: center;
  color: black;
  opacity: 0.25;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
  color: black;
  opacity: 0.75;
}

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.slick-track:before, .slick-track:after {
  content: "";
  display: table;
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}
[dir=rtl] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

html {
  font-size: 0.598vw;
}

body {
  font-family: asap_condensedregular;
  margin: 0;
  height: 100%;
  background-color: #f9f9f9;
}

.page-wrapper {
  margin-left: 10rem;
  overflow: hidden;
}

/*# sourceMappingURL=styles.css.map */