/*
 * Part from HTML5 Reset Stylesheet
 * http://html5doctor.com/html-5-reset-stylesheet/
 */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, a {
  margin: 0;
  padding: 0; }

/* @see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
/* apply a natural box layout model to all elements, but allowing components to change */
html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
  display: block; }

li {
  list-style-type: none; }

a, a:hover, a:active {
  outline: none; }

/* APPLICATION */
/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/roboto-v15-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Roboto"), local("Roboto-Regular"), url("../fonts/roboto-v15-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v15-latin-regular.woff2") format("woff2"), url("../fonts/roboto-v15-latin-regular.woff") format("woff"), url("../fonts/roboto-v15-latin-regular.ttf") format("truetype"), url("../fonts/roboto-v15-latin-regular.svg#Roboto") format("svg");
  /* Legacy iOS */ }

/* roboto-500 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/roboto-v15-latin-500.eot");
  /* IE9 Compat Modes */
  src: local("Roboto Medium"), local("Roboto-Medium"), url("../fonts/roboto-v15-latin-500.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v15-latin-500.woff2") format("woff2"), url("../fonts/roboto-v15-latin-500.woff") format("woff"), url("../fonts/roboto-v15-latin-500.ttf") format("truetype"), url("../fonts/roboto-v15-latin-500.svg#Roboto") format("svg");
  /* Legacy iOS */ }

/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/roboto-v15-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("Roboto Bold"), local("Roboto-Bold"), url("../fonts/roboto-v15-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-v15-latin-700.woff2") format("woff2"), url("../fonts/roboto-v15-latin-700.woff") format("woff"), url("../fonts/roboto-v15-latin-700.ttf") format("truetype"), url("../fonts/roboto-v15-latin-700.svg#Roboto") format("svg");
  /* Legacy iOS */ }

/* roboto-condensed-regular - latin */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/roboto-condensed-v13-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Roboto Condensed"), local("RobotoCondensed-Regular"), url("../fonts/roboto-condensed-v13-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto-condensed-v13-latin-regular.woff2") format("woff2"), url("../fonts/roboto-condensed-v13-latin-regular.woff") format("woff"), url("../fonts/roboto-condensed-v13-latin-regular.ttf") format("truetype"), url("../fonts/roboto-condensed-v13-latin-regular.svg#RobotoCondensed") format("svg");
  /* Legacy iOS */ }

/* lora-regular - latin */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/lora-v9-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Lora"), local("Lora-Regular"), url("../fonts/lora-v9-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/lora-v9-latin-regular.woff2") format("woff2"), url("../fonts/lora-v9-latin-regular.woff") format("woff"), url("../fonts/lora-v9-latin-regular.ttf") format("truetype"), url("../fonts/lora-v9-latin-regular.svg#Lora") format("svg");
  /* Legacy iOS */ }

/* lora-italic - latin */
@font-face {
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/lora-v9-latin-italic.eot");
  /* IE9 Compat Modes */
  src: local("Lora Italic"), local("Lora-Italic"), url("../fonts/lora-v9-latin-italic.eot?#iefix") format("embedded-opentype"), url("../fonts/lora-v9-latin-italic.woff2") format("woff2"), url("../fonts/lora-v9-latin-italic.woff") format("woff"), url("../fonts/lora-v9-latin-italic.ttf") format("truetype"), url("../fonts/lora-v9-latin-italic.svg#Lora") format("svg");
  /* Legacy iOS */ }

html {
  width: 100%;
  height: 100%; }

body {
  width: 100%;
  min-height: 100%;
  font: 14px/30px "Roboto", "Helvetica", "Arial", sans-serif;
  color: #848484;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }
  .touchevents body {
    cursor: pointer; }

h1, h2, h3, h4, h5, h6 {
  font-weight: normal; }

a {
  text-decoration: none;
  color: #000; }
  a img {
    border: none; }

input,
button {
  border: none;
  outline: none;
  cursor: pointer;
  background: none;
  padding: 0;
  margin: 0; }
  input:disabled,
  button:disabled {
    cursor: default; }

input,
textarea {
  padding: 0; }

.scroll-disabled {
  overflow-y: hidden; }

#nav {
  text-transform: uppercase;
  line-height: 0;
  letter-spacing: .1em; }
  .js #nav {
    visibility: hidden; }

#nav-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #2a2a2a;
  opacity: .9;
  z-index: 102;
  visibility: hidden; }
  #nav.opened #nav-overlay {
    visibility: visible; }
  @media screen and (min-width: 1024px) {
    #nav-overlay {
      display: none; } }

#nav-bar {
  width: 100%;
  z-index: 103; }
  .js #nav-bar {
    position: fixed;
    top: 0;
    left: 0; }
  #nav-bar::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 60px; }
    @media screen and (max-width: 1023px) {
      #nav-bar::before {
        background-color: #2A2A2A !important; } }
    #nav.opened #nav-bar::before {
      visibility: hidden; }
  @media screen and (min-width: 1024px) {
    #nav-bar {
      z-index: 102;
      opacity: 0;
      visibility: inherit;
      transition: opacity .8s, visibility 0s; }
      #nav-bar.visible {
        opacity: 1; }
      #nav.hidden #nav-bar {
        opacity: 0;
        transition-delay: 0s, .8s;
        visibility: hidden; }
      #nav-bar::before {
        height: 100px;
        opacity: 1;
        z-index: 1; } }

#nav-toggle {
  position: absolute;
  top: 17px;
  left: 8%;
  width: 35px;
  height: 25px;
  transition: transform 600ms cubic-bezier(1, 0, 0, 1); }
  @media screen and (min-width: 1024px) {
    #nav-toggle {
      display: none; } }

#nav-bar-page-title,
#nav-bar-menu-title {
  position: absolute;
  top: 17px;
  left: 8%;
  margin-left: 50px;
  text-transform: uppercase;
  font-size: 22px;
  line-height: 26px;
  font-family: "Roboto Condensed", "Roboto", "Helvetica", "Arial", sans-serif; }

#nav-bar-page-title {
  width: calc(92% - 60px);
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }
  #nav.opened #nav-bar-page-title {
    visibility: hidden; }
  @media screen and (min-width: 1024px) {
    #nav-bar-page-title {
      display: none; } }

#nav-bar-menu-title {
  color: #000;
  visibility: hidden; }
  #nav.opened #nav-bar-menu-title {
    visibility: visible; }
  @media screen and (min-width: 1024px) {
    #nav-bar-menu-title {
      display: none; } }

#nav-toggle span,
#nav-toggle span:before,
#nav-toggle span:after {
  content: "";
  position: absolute;
  display: block;
  height: 4px;
  width: 35px;
  background: #fff;
  transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1); }
  #nav.opened #nav-toggle span, #nav.opened
  #nav-toggle span:before, #nav.opened
  #nav-toggle span:after {
    background: #b09e82; }

#nav-toggle span {
  top: 10px; }

#nav-toggle span:before {
  top: -10px; }

#nav-toggle span:after {
  bottom: -10px; }

#nav.opened #nav-toggle span {
  background-color: transparent; }

#nav.opened #nav-toggle span:before {
  transform: rotate(45deg) translate(7px, 7px); }

#nav.opened #nav-toggle span:after {
  transform: rotate(-45deg) translate(7px, -7px); }

#nav-logo {
  display: none; }
  @media screen and (min-width: 1024px) {
    #nav-logo {
      position: absolute;
      top: 10px;
      left: 40px;
      display: inline-block;
      z-index: 103;
      font-family: "Roboto Condensed", "Roboto", "Helvetica", "Arial", sans-serif;
      line-height: 90px;
      mix-blend-mode: luminosity;
      opacity: 1;
      transition: opacity .8s, visibility 0s; }
      .js #nav-logo {
        position: fixed; }
      .page-id-not-found #nav-logo, .page-id-home #nav-logo, .page-id-about #nav-logo, .page-id-contact #nav-logo, .page-id-renault-integrity #nav-logo, .page-id-engie-digital-design #nav-logo, .page-id-cic #nav-logo, .page-id-shopping-robot #nav-logo {
        mix-blend-mode: screen; }
      #nav.hidden #nav-logo {
        opacity: 0;
        visibility: hidden;
        transition-delay: 0s, .8s; } }
  @media screen and (min-width: 1280px) {
    #nav-logo {
      left: 100px; } }

#nav-logo-img {
  width: 21px;
  height: 25px;
  margin-top: -2px;
  margin-right: 4px;
  vertical-align: middle; }

#nav-logo-name {
  display: inline-block;
  opacity: .5;
  transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .page-id-not-found #nav-logo-name, .page-id-home #nav-logo-name, .page-id-about #nav-logo-name, .page-id-contact #nav-logo-name, .page-id-renault-integrity #nav-logo-name, .page-id-engie-digital-design #nav-logo-name, .page-id-cic #nav-logo-name, .page-id-shopping-robot #nav-logo-name {
    opacity: 1;
    color: #fff; }

#nav-logo-img {
  transition: opacity .4s; }

#nav-items {
  position: absolute;
  top: 0;
  left: 0;
  width: 80%;
  height: 100%;
  padding-top: 20%;
  padding-left: 8%;
  background-color: #fff;
  z-index: 102;
  transform: translateX(-100%);
  transition: transform 500ms cubic-bezier(0.19, 1, 0.22, 1); }
  .js #nav-items {
    position: fixed; }
  #nav.opened #nav-items {
    transform: translateX(0); }
  @media screen and (min-width: 1024px) {
    #nav-items {
      top: 10px;
      width: 100%;
      height: auto;
      padding: 0;
      z-index: 102;
      background-color: transparent;
      transform: none !important;
      transition: opacity .8s, visibility 0s; }
      #nav.hidden #nav-items {
        opacity: 0;
        visibility: hidden;
        transition-delay: 0s, .8s; } }

@media screen and (min-width: 1024px) {
  #nav-pages {
    float: right; } }

.nav-pages-item {
  font-family: "Roboto Condensed", "Roboto", "Helvetica", "Arial", sans-serif;
  border-top: 1px solid #c4c4c4;
  height: 60px;
  line-height: 60px;
  overflow: hidden; }
  .nav-pages-item:first-child {
    border-top: none; }
  @media screen and (min-width: 1024px) {
    .nav-pages-item {
      display: inline-block;
      height: auto;
      line-height: 90px;
      font-family: "Roboto", "Helvetica", "Arial", sans-serif;
      font-weight: 500;
      border-top: none; } }

@media screen and (min-width: 1024px) {
  #nav-pages-item-home {
    display: none; } }

#nav-pages-item-work {
  transition: height 0.8s cubic-bezier(0.19, 1, 0.22, 1); }
  .touchevents #nav-pages-item-work {
    cursor: pointer; }
  #nav-pages-item-work:hover {
    height: 235px; }
  @media screen and (min-width: 1024px) {
    #nav-pages-item-work {
      transition: none; }
      #nav-pages-item-work:hover {
        height: auto; } }

.nav-pages-btn {
  display: block;
  font-size: 18px;
  color: #b09e82; }
  @media screen and (min-width: 1024px) {
    .nav-pages-btn {
      padding: 0 25px;
      font-size: 14px; }
      .page-id-not-found .nav-pages-btn, .page-id-home .nav-pages-btn, .page-id-about .nav-pages-btn, .page-id-contact .nav-pages-btn, .page-id-renault-integrity .nav-pages-btn, .page-id-engie-digital-design .nav-pages-btn, .page-id-cic .nav-pages-btn, .page-id-shopping-robot .nav-pages-btn {
        color: #fff; }
      .nav-pages-item.active .nav-pages-btn {
        cursor: default;
        color: #b09e82; }
      .page-id-not-found .nav-pages-item.active .nav-pages-btn, .page-id-home .nav-pages-item.active .nav-pages-btn, .page-id-about .nav-pages-item.active .nav-pages-btn, .page-id-contact .nav-pages-item.active .nav-pages-btn, .page-id-renault-integrity .nav-pages-item.active .nav-pages-btn, .page-id-engie-digital-design .nav-pages-item.active .nav-pages-btn, .page-id-cic .nav-pages-item.active .nav-pages-btn, .page-id-shopping-robot .nav-pages-item.active .nav-pages-btn {
        color: #fff; } }

#nav-pages-btn-work {
  cursor: default; }

@media screen and (min-width: 1024px) {
  .nav-pages-btn-label {
    position: relative;
    opacity: .4;
    transition: opacity .4s; }
    .nav-pages-btn:hover .nav-pages-btn-label {
      opacity: 1 !important; }
    .nav-pages-btn-label::after {
      content: "";
      position: absolute;
      bottom: -4px;
      left: 0;
      display: block;
      height: 2px;
      width: 100%;
      background-color: #b09e82;
      transform: scaleX(0);
      transform-origin: right;
      transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); }
      .page-id-not-found .nav-pages-btn-label::after, .page-id-home .nav-pages-btn-label::after, .page-id-about .nav-pages-btn-label::after, .page-id-contact .nav-pages-btn-label::after, .page-id-renault-integrity .nav-pages-btn-label::after, .page-id-engie-digital-design .nav-pages-btn-label::after, .page-id-cic .nav-pages-btn-label::after, .page-id-shopping-robot .nav-pages-btn-label::after {
        background-color: #fff; }
    .nav-pages-btn:hover .nav-pages-btn-label::after {
      transform-origin: left;
      transform: scaleX(1); } }

.nav-pages-item.active .nav-pages-btn-label {
  opacity: 1 !important; }

#nav-latest-works {
  padding-bottom: 15px; }
  @media screen and (min-width: 1024px) {
    #nav-latest-works {
      position: absolute;
      top: 90px;
      left: 0;
      width: 100%;
      height: 380px;
      padding-bottom: 0;
      line-height: 380px;
      visibility: hidden;
      transition: visibility 0s linear .25s;
      overflow: hidden; }
      #nav-pages-btn-work:hover #nav-latest-works {
        transition: none;
        visibility: visible; } }

@media screen and (min-width: 1024px) {
  .nav-latest-work {
    float: left;
    width: 25%;
    height: 100%; } }

.nav-latest-work-btn {
  position: relative;
  display: block;
  color: #868686; }
  @media screen and (min-width: 1024px) {
    .nav-latest-work-btn {
      width: 100%;
      height: 100%;
      padding: 0 30px;
      color: #fff; }
      .nav-latest-work-btn::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        width: 100%;
        height: 100%;
        background-color: #b09e82;
        transform: scaleY(0);
        transform-origin: left top;
        opacity: 0;
        transition: transform 0.25s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s 0.25s; }
        #nav-pages-btn-work:hover .nav-latest-work-btn::before {
          transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s;
          transform: scaleY(1);
          opacity: 1; }
      #nav-pages-btn-work:hover .nav-latest-work:nth-child(2) .nav-latest-work-btn::before {
        transition-delay: .1s; }
      #nav-pages-btn-work:hover .nav-latest-work:nth-child(3) .nav-latest-work-btn::before {
        transition-delay: .2s; }
      #nav-pages-btn-work:hover .nav-latest-work:nth-child(4) .nav-latest-work-btn::before {
        transition-delay: .3s; }
      .nav-latest-work-btn::after {
        content: "";
        position: absolute;
        bottom: 40px;
        left: 30px;
        display: block;
        width: calc(100% - 60px);
        height: 4px;
        background-color: #fff;
        z-index: 2;
        transform-origin: right;
        transform: scaleX(0);
        opacity: 0; }
        #nav-pages-btn-work:hover .nav-latest-work-btn::after {
          transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0s 0.25s;
          opacity: 1; }
      .nav-latest-work.active .nav-latest-work-btn::after, .nav-latest-work-btn:hover::after {
        transform-origin: left;
        transform: scaleX(1); } }
  .nav-latest-work.active .nav-latest-work-btn {
    cursor: default; }

@media screen and (max-width: 1023px) {
  .nav-latest-work-btn-inner {
    height: auto !important; } }

@media screen and (min-width: 1024px) {
  .nav-latest-work-btn-inner {
    position: relative;
    display: inline-block;
    width: 100%;
    vertical-align: middle;
    opacity: 0;
    transition: opacity 0s; }
    #nav-pages-btn-work:hover .nav-latest-work-btn-inner {
      transition-duration: .3s;
      opacity: 1; }
    #nav-pages-btn-work:hover .nav-latest-work:nth-child(1) .nav-latest-work-btn-inner {
      transition-delay: .1s; }
    #nav-pages-btn-work:hover .nav-latest-work:nth-child(2) .nav-latest-work-btn-inner {
      transition-delay: .2s; }
    #nav-pages-btn-work:hover .nav-latest-work:nth-child(3) .nav-latest-work-btn-inner {
      transition-delay: .3s; }
    #nav-pages-btn-work:hover .nav-latest-work:nth-child(4) .nav-latest-work-btn-inner {
      transition-delay: .4s; } }

.nav-latest-work-title {
  height: 40px;
  padding-left: 16%;
  font-size: 15px;
  line-height: 40px; }
  @media screen and (min-width: 1024px) {
    .nav-latest-work-title {
      position: relative;
      height: auto;
      padding-bottom: 30px;
      padding-left: 0;
      font-size: 23px;
      line-height: 35px;
      z-index: 2;
      overflow: hidden; } }
  @media screen and (min-width: 1400px) {
    .nav-latest-work-title {
      font-size: 27px; } }

@media screen and (min-width: 1024px) {
  .nav-latest-work-title-line {
    position: relative;
    display: block;
    float: left;
    clear: left; }
    .nav-latest-work-title-line::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      display: block;
      width: 100%;
      background-color: #fff; } }

@media screen and (min-width: 1024px) {
  .nav-latest-work-title-line-1::after {
    height: 4px; } }

@media screen and (min-width: 1024px) {
  .nav-latest-work-title-line-2 {
    font-family: "Lora", "Georgia", serif;
    text-transform: none;
    font-style: italic; }
    .nav-latest-work-title-line-2::after {
      bottom: 3px;
      height: 1px; } }

.nav-latest-work-desc {
  display: none;
  letter-spacing: 0; }
  @media screen and (min-width: 1024px) {
    .nav-latest-work-desc {
      position: relative;
      display: block;
      font-size: 14px;
      font-weight: 400;
      line-height: 26px;
      text-transform: none;
      z-index: 2; } }

#nav-lang {
  position: absolute;
  bottom: 4%;
  left: 8%;
  padding-right: 100px;
  font-family: "Roboto Condensed", "Roboto", "Helvetica", "Arial", sans-serif;
  font-size: 18px; }
  @media screen and (min-width: 1024px) {
    #nav-lang {
      position: static;
      float: right;
      padding-left: 25px;
      font-family: "Roboto", "Helvetica", "Arial", sans-serif;
      font-weight: 500;
      font-size: 14px;
      line-height: 90px; } }

#nav-lang-current,
#nav-lang-switch {
  display: inline-block; }
  @media screen and (min-width: 1024px) {
    #nav-lang-current,
    #nav-lang-switch {
      opacity: .6; } }

#nav-lang-current {
  color: #3c3c3c; }
  @media screen and (min-width: 1024px) {
    #nav-lang-current {
      color: #9a9a9a; }
      .page-id-not-found #nav-lang-current, .page-id-home #nav-lang-current, .page-id-about #nav-lang-current, .page-id-contact #nav-lang-current, .page-id-renault-integrity #nav-lang-current, .page-id-engie-digital-design #nav-lang-current, .page-id-cic #nav-lang-current, .page-id-shopping-robot #nav-lang-current {
        color: #949494; } }

#nav-lang-switch {
  color: #c4c4c4; }
  @media screen and (min-width: 1024px) {
    #nav-lang-switch {
      position: relative;
      color: #bfbfbf; }
      .page-id-not-found #nav-lang-switch, .page-id-home #nav-lang-switch, .page-id-about #nav-lang-switch, .page-id-contact #nav-lang-switch, .page-id-renault-integrity #nav-lang-switch, .page-id-engie-digital-design #nav-lang-switch, .page-id-cic #nav-lang-switch, .page-id-shopping-robot #nav-lang-switch {
        color: #585858; } }

@media screen and (min-width: 1024px) {
  #nav-lang-switch-txt {
    position: relative; }
    #nav-lang-switch-txt::after {
      content: "";
      position: absolute;
      bottom: -4px;
      left: 0;
      display: block;
      width: 100%;
      height: 2px;
      background-color: #9a9a9a;
      transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1);
      transform-origin: right;
      transform: scaleX(0); }
      .page-id-not-found #nav-lang-switch-txt::after, .page-id-home #nav-lang-switch-txt::after, .page-id-about #nav-lang-switch-txt::after, .page-id-contact #nav-lang-switch-txt::after, .page-id-renault-integrity #nav-lang-switch-txt::after, .page-id-engie-digital-design #nav-lang-switch-txt::after, .page-id-cic #nav-lang-switch-txt::after, .page-id-shopping-robot #nav-lang-switch-txt::after {
        background-color: #949494; }
      #nav-lang-switch:hover #nav-lang-switch-txt::after {
        transform-origin: left;
        transform: scaleX(1); } }

#footer-main-content {
  padding: 35px 25px 25px;
  background-color: #f6f5f5; }
  @media screen and (min-width: 1024px) {
    #footer-main-content {
      display: flex;
      padding: 90px 100px 100px;
      font-size: 0; } }

@media screen and (min-width: 1024px) {
  #footer-contact,
  #footer-chillout,
  #footer-map {
    display: inline-block;
    vertical-align: top;
    font-size: 14px; } }

.footer-title {
  padding-bottom: 20px;
  color: #b09e82;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 14px;
  line-height: 14px;
  letter-spacing: .1em; }
  @media screen and (min-width: 1024px) {
    .footer-title {
      padding-bottom: 30px; } }

@media screen and (min-width: 1024px) {
  #footer-contact {
    width: 62%;
    padding-right: 20px; } }

@media screen and (min-width: 1280px) {
  #footer-contact {
    padding-right: 50px; } }

@media screen and (min-width: 1400px) {
  #footer-contact {
    padding-right: 60px; } }

@media screen and (min-width: 1600px) {
  #footer-contact {
    padding-right: 80px; } }

@media screen and (min-width: 1024px) {
  #footer-contact-motto,
  #footer-contact-links {
    display: inline-block;
    vertical-align: top; } }

#footer-contact-motto {
  padding-right: 20px;
  padding-bottom: 25px;
  font-weight: 400;
  font-style: italic;
  font-family: "Lora", "Georgia", serif;
  font-size: 32px;
  line-height: 40px; }
  @media screen and (min-width: 1024px) {
    #footer-contact-motto {
      width: 36%;
      padding-bottom: 0;
      font-size: 20px;
      line-height: 30px; } }
  @media screen and (min-width: 1280px) {
    #footer-contact-motto {
      width: 45%;
      padding-right: 30px;
      font-size: 24px;
      line-height: 34px; } }
  @media screen and (min-width: 1400px) {
    #footer-contact-motto {
      width: 50%;
      padding-right: 50px;
      font-size: 28px;
      line-height: 38px; } }
  @media screen and (min-width: 1600px) {
    #footer-contact-motto {
      width: 53%; } }

@media screen and (min-width: 1024px) {
  #footer-contact-links {
    float: right;
    height: 169px;
    width: 64%;
    padding: 0 20px;
    border-left: 1px solid #d3d3d3;
    border-right: 1px solid #d3d3d3; } }

@media screen and (min-width: 1280px) {
  #footer-contact-links {
    width: 55%;
    padding: 0 30px; } }

@media screen and (min-width: 1400px) {
  #footer-contact-links {
    width: 50%; } }

@media screen and (min-width: 1600px) {
  #footer-contact-links {
    width: 47%; } }

#footer-offices {
  padding: 20px 0 5px;
  border-top: 1px solid #c4c4c4;
  border-bottom: 1px solid #c4c4c4; }
  @media screen and (min-width: 1024px) {
    #footer-offices {
      padding: 0;
      border: none; } }

.footer-office {
  position: relative;
  padding-top: 3px;
  padding-left: 60px; }
  @media screen and (min-width: 1024px) {
    .footer-office {
      padding-left: 65px; } }
  @media screen and (min-width: 1280px) {
    .footer-office {
      padding-left: 73px; } }

.footer-office-title {
  color: #545454;
  line-height: 14px; }

.footer-office-mail {
  display: inline-block;
  position: relative;
  padding-bottom: 3px;
  margin-bottom: 20px;
  color: #8c8c8c;
  line-height: 14px;
  white-space: nowrap;
  transition: color .3s; }
  .footer-office-mail:hover {
    color: #4a4a4a; }
  .footer-office-mail::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 1px;
    width: 100%;
    background-color: #d3d3d3;
    transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1);
    transform: scaleX(1);
    transform-origin: left; }
  .footer-office-mail:hover::after {
    transform-origin: right;
    transform: scaleX(0); }

.footer-office-picto {
  position: absolute;
  left: 0;
  top: 0;
  height: 42px; }
  #footer-office-lyon .footer-office-picto {
    width: 29px;
    margin-left: 14px; }
  #footer-office-london .footer-office-picto {
    width: 43px; }

#footer-social {
  font-size: 0;
  line-height: 0;
  border-bottom: 1px solid #c4c4c4; }
  @media screen and (min-width: 1024px) {
    #footer-social {
      border: none; } }

.footer-social-item {
  display: inline-block;
  width: 20%;
  height: 60px;
  text-align: center;
  line-height: 60px;
  vertical-align: top; }
  @media screen and (min-width: 1024px) {
    .footer-social-item {
      height: 40px;
      line-height: 40px; } }

.footer-social-link {
  display: block;
  text-align: left; }

.footer-social-picto {
  display: inline-block;
  fill: #b09e82;
  vertical-align: middle;
  transition: fill .2s; }
  #footer-twitter .footer-social-picto {
    width: 19px;
    height: 15px; }
  #footer-linkedin .footer-social-picto {
    width: 18px;
    height: 17px; }
  #footer-pinterest .footer-social-picto {
    width: 17px;
    height: 17px; }
  #footer-viadeo .footer-social-picto {
    width: 18px;
    height: 19px; }
  #footer-googleplus .footer-social-picto {
    width: 20px;
    height: 17px; }
  .footer-social-link:hover .footer-social-picto {
    transition: fill .4s;
    fill: #4a4a4a; }

@media screen and (min-width: 1024px) {
  #footer-chillout,
  #footer-map {
    width: 38%; } }

#footer-chillout-link,
#footer-map-link {
  display: block; }

#footer-chillout-title,
#footer-map-title {
  position: relative;
  display: inline-block;
  margin: 25px 0 5px;
  padding-right: 50px;
  vertical-align: top; }
  @media screen and (min-width: 1024px) {
    #footer-chillout-title,
    #footer-map-title {
      margin-top: 0; } }

#footer-chillout-title-arrow,
#footer-map-title-arrow {
  position: absolute;
  right: 10px;
  top: 7px;
  display: block;
  width: 13px;
  height: 9px;
  margin-left: -6px;
  margin-top: -5px;
  transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1); }
  #footer-chillout-link:hover #footer-chillout-title-arrow, #footer-chillout-link:hover
  #footer-map-title-arrow {
    transform: translateX(30px); }
  #footer-map-link:hover #footer-chillout-title-arrow, #footer-map-link:hover
  #footer-map-title-arrow {
    transform: translateX(30px); }
  #footer-chillout-title-arrow::before, #footer-chillout-title-arrow::after,
  #footer-map-title-arrow::before,
  #footer-map-title-arrow::after {
    content: "";
    position: absolute;
    display: block; }
  #footer-chillout-title-arrow::before,
  #footer-map-title-arrow::before {
    top: 50%;
    left: 0;
    width: 13px;
    height: 1px;
    margin-top: -1px;
    background-color: #545454;
    transform-origin: right;
    transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1); }
    #footer-chillout-link:hover #footer-chillout-title-arrow::before, #footer-chillout-link:hover
    #footer-map-title-arrow::before {
      transform: scaleX(2); }
    #footer-map-link:hover #footer-chillout-title-arrow::before, #footer-map-link:hover
    #footer-map-title-arrow::before {
      transform: scaleX(2); }
  #footer-chillout-title-arrow::after,
  #footer-map-title-arrow::after {
    top: 50%;
    right: 1px;
    width: 9px;
    height: 9px;
    margin-top: -5px;
    border-right: 1px solid #545454;
    border-bottom: 1px solid #545454;
    transform: rotate(-45deg); }

#footer-copyright {
  padding: 35px;
  text-align: center;
  font-size: 9px;
  line-height: 12px;
  color: #a4a4a4;
  letter-spacing: .1em;
  text-transform: uppercase;
  background-color: #dbdbdb; }
  @media screen and (min-width: 1024px) {
    #footer-copyright {
      padding: 50px; } }

#contact-btn {
  position: fixed;
  right: 25px;
  bottom: 25px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background-color: #ededed;
  z-index: 100; }
  .js #contact-btn {
    opacity: 0; }
  @media screen and (min-width: 1024px) {
    #contact-btn {
      right: 40px;
      bottom: 50px;
      width: 70px;
      height: 70px;
      overflow: hidden; }
      #contact-btn:hover {
        background-color: #ededed !important; } }
  @media screen and (min-width: 1280px) {
    #contact-btn {
      right: 100px; } }
  #contact-btn.pinned {
    position: absolute;
    bottom: -28px; }
    @media screen and (min-width: 1024px) {
      #contact-btn.pinned {
        bottom: -35px; } }

#contact-btn-picto {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 23px;
  height: 19px;
  margin-top: -10px;
  margin-left: -12px;
  fill: #2a2a2a; }
  @media screen and (min-width: 1024px) {
    #contact-btn-picto {
      width: 29px;
      height: 24px;
      margin-top: -12px;
      margin-left: -14px;
      transition: fill .6s; }
      #contact-btn:hover #contact-btn-picto {
        transition: none;
        animation: contact-btn-picto-roll-over 0.7s cubic-bezier(0.19, 1, 0.22, 1);
        fill: #b09e82 !important; } }

@keyframes contact-btn-picto-roll-over {
  from {
    transform: translateY(50px) rotate(45deg); }
  to {
    transform: translateY(0); } }

#contact-form-transition {
  position: fixed;
  top: 0;
  left: 0;
  border-radius: 50%;
  z-index: 110;
  visibility: hidden;
  background-color: #ededed; }

#contact-form-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 100px 25px;
  z-index: 110;
  overflow-y: hidden;
  visibility: hidden;
  transform: translateX(-100%);
  background-color: #ededed; }
  @media screen and (min-width: 1024px) {
    #contact-form-wrapper {
      padding: 100px 120px 0; } }
  #contact-form-wrapper.opened {
    overflow-y: auto; }

#contact-form {
  padding-top: 80px;
  padding-bottom: 80px;
  overflow: hidden; }

#contact-form-subtitle {
  padding-bottom: 0;
  max-width: 660px; }

#contact-form-close {
  position: absolute;
  top: 60px;
  right: 25px;
  width: 80px;
  height: 80px; }
  @media screen and (min-width: 1024px) {
    #contact-form-close {
      right: 120px; } }
  #contact-form-close::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #e3e3e3;
    border-radius: 50%;
    transform: scale(0.5);
    opacity: 0; }
  #contact-form-close:hover::after {
    opacity: 1;
    transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    transform: scale(1); }

#contact-form-close-picto {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 35px;
  height: 35px;
  margin-top: -18px;
  margin-left: -18px;
  z-index: 2; }
  #contact-form-close-picto::before, #contact-form-close-picto::after {
    content: "";
    position: absolute;
    display: block;
    height: 4px;
    width: 35px;
    background: #4a4a4a; }
    #contact-form-close:hover #contact-form-close-picto::before, #contact-form-close:hover #contact-form-close-picto::after {
      background: #b09e82; }
  #contact-form-close-picto::before {
    top: 16px;
    transform: rotate(45deg); }
    #contact-form-close:hover #contact-form-close-picto::before {
      animation: contact-form-close-over-line-1 0.4s cubic-bezier(0.19, 1, 0.22, 1); }
  #contact-form-close-picto::after {
    bottom: 15px;
    transform: rotate(-45deg); }
    #contact-form-close:hover #contact-form-close-picto::after {
      transform: rotate(-45deg) scaleX(0);
      animation: contact-form-close-over-line-2 0.4s cubic-bezier(0.19, 1, 0.22, 1) 0.1s forwards; }

@keyframes contact-form-close-over-line-1 {
  from {
    transform: rotate(45deg) scaleX(0); }
  to {
    transform: rotate(45deg) scaleX(1); } }

@keyframes contact-form-close-over-line-2 {
  from {
    transform: rotate(-45deg) scaleX(0); }
  to {
    transform: rotate(-45deg) scaleX(1); } }

.contact-form-item {
  position: relative;
  font-size: 14px;
  padding: 0 2%;
  min-height: 95px;
  margin-bottom: 60px;
  line-height: 95px; }
  @media screen and (min-width: 1000px) {
    .contact-form-item {
      float: left;
      width: 33.33%;
      height: 95px;
      margin-bottom: 95px; }
      .contact-form-item:nth-child(3n+1) {
        padding-right: 4%;
        padding-left: 0; }
      .contact-form-item:nth-child(3n) {
        padding-right: 0;
        padding-left: 4%; } }

.contact-form-label {
  position: relative;
  display: inline-block;
  width: 100%;
  line-height: 70px;
  vertical-align: middle; }
  .contact-form-label::before, .contact-form-label::after {
    content: "";
    position: absolute;
    left: 0;
    display: block;
    height: 5px;
    width: 100%;
    background-color: #b1b1b1;
    transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); }
  .contact-form-label.focus::before, .contact-form-label.focus::after {
    background-color: #b09e82; }
  .contact-form-label.focus::before {
    transform: translateY(-5px); }
  .contact-form-label.focus::after {
    transform: translateY(5px); }
  .contact-form-label::before {
    top: 0; }
  .contact-form-label::after {
    bottom: 0; }
  .contact-form-item:focus .contact-form-label::before,
  .contact-form-item:focus .contact-form-label::after {
    background-color: #b09e82; }

.contact-form-label-txt {
  position: absolute;
  top: -40px;
  left: 0;
  display: block;
  color: #b1b1b1;
  font-size: 16px;
  line-height: 18px;
  text-transform: uppercase;
  font-weight: 700;
  transform: translateY(68px);
  transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); }
  .contact-form-label.filled .contact-form-label-txt {
    transform: translateY(10px); }
  .contact-form-label.focus .contact-form-label-txt,
  .contact-form-label.filled.focus .contact-form-label-txt {
    color: #b09e82;
    transform: translateY(0); }

#contact-form input[type=text],
#contact-form input[type=email],
#contact-form textarea {
  width: 100%;
  font-family: "Roboto", "Helvetica", "Arial", sans-serif;
  color: #b1b1b1;
  font-size: 16px;
  font-weight: 700;
  border: none;
  background-color: transparent; }
  #contact-form input[type=text]:-webkit-autofill,
  #contact-form input[type=email]:-webkit-autofill,
  #contact-form textarea:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset;
    -webkit-text-fill-color: #b1b1b1 !important; }
  #contact-form input[type=text]:invalid,
  #contact-form input[type=email]:invalid,
  #contact-form textarea:invalid {
    box-shadow: none;
    outline: none; }
  #contact-form input[type=text]:focus,
  #contact-form input[type=email]:focus,
  #contact-form textarea:focus {
    color: #b09e82;
    outline: none; }
    #contact-form input[type=text]:focus:-webkit-autofill,
    #contact-form input[type=email]:focus:-webkit-autofill,
    #contact-form textarea:focus:-webkit-autofill {
      -webkit-text-fill-color: #b09e82 !important; }

#contact-form input[type=text],
#contact-form input[type=email] {
  line-height: 75px; }

#contact-form-item-message {
  height: auto;
  line-height: 0;
  font-size: 0;
  margin-bottom: 40px; }
  @media screen and (min-width: 1000px) {
    #contact-form-item-message {
      width: 66.66%;
      padding-right: 2%; } }

#contact-form-item-message .contact-form-label {
  line-height: 0; }

#contact-form-item-message textarea {
  height: 265px;
  padding-top: 20px;
  resize: vertical; }

#contact-form-mail {
  margin-bottom: 40px; }
  @media screen and (min-width: 1000px) {
    #contact-form-mail {
      padding-left: 4%;
      padding-right: 0; } }

#contact-form-mail-inner {
  height: 265px;
  background-color: #b09e82;
  color: #fff;
  text-align: center; }

#contact-form-mail-heading {
  height: 150px;
  line-height: 0; }

#contact-form-mail-title {
  position: relative;
  display: inline-block;
  height: 75px;
  padding: 0 10px;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 15px;
  line-height: 75px;
  letter-spacing: .1em; }
  #contact-form-mail-title::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    background-color: #fff; }

#contact-form-mail-title-text {
  display: inline-block;
  vertical-align: middle;
  line-height: 18px; }

#contact-form-mail-subtitle {
  height: 75px;
  padding: 0 10px;
  line-height: 75px;
  font-family: "Lora", "Georgia", serif;
  font-size: 20px;
  font-style: italic; }

#contact-form-mail-subtitle-text {
  display: inline-block;
  vertical-align: middle;
  line-height: 24px; }

#contact-form-mail-link {
  display: block;
  height: 115px;
  line-height: 115px;
  background-color: #c0ae93;
  color: #fff; }

#contact-form-mail-link-txt {
  position: relative; }
  #contact-form-mail-link-txt::after {
    content: "";
    position: absolute;
    bottom: -6px;
    left: 0;
    display: block;
    width: 100%;
    height: 2px;
    background-color: #fff;
    transform: scaleX(0);
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transform-origin: right; }
    #contact-form-mail-link:hover #contact-form-mail-link-txt::after {
      transition-duration: .4s;
      transform: scaleX(1);
      transform-origin: left; }

#contact-form-infos {
  height: auto;
  padding: 0;
  margin-bottom: 0;
  text-align: center; }
  @media screen and (min-width: 1000px) {
    #contact-form-infos {
      width: 66.66%; } }

.contact-form-info {
  display: none;
  font-size: 16px;
  line-height: 30px;
  text-transform: uppercase;
  font-weight: 700;
  color: #b09e82; }

.contact-form-success #contact-form-info-success {
  display: block; }

#contact-form-info-fail {
  color: red; }
  .contact-form-fail #contact-form-info-fail {
    display: block; }

#contact-form-submit {
  height: auto;
  margin-bottom: 0;
  padding: 0;
  text-align: center; }
  @media screen and (min-width: 1000px) {
    #contact-form-submit {
      width: 66.66%; } }

#contact-form-submit-btn-wrapper {
  position: relative;
  display: inline-block; }

#contact-form-submit-btn {
  display: inline-block;
  width: 152px;
  height: 152px;
  border: none;
  border-radius: 50%;
  background-color: #393939;
  font-size: 30px;
  font-family: "Lora", "Georgia", serif;
  font-style: italic;
  color: #fff;
  cursor: pointer;
  transition: background-color 0.2s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  #contact-form-submit-btn:hover,
  .contact-form-sending #contact-form-submit-btn {
    background-color: #e3e3e3;
    color: #b09e82; }
  .contact-form-sending #contact-form-submit-btn {
    visibility: hidden;
    transform: scale(0.7, 0.7); }

#contact-form-submit-anim {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  visibility: hidden; }
  .contact-form-sending #contact-form-submit-anim {
    visibility: visible; }
  #contact-form-submit-anim::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -50%;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #e3e3e3;
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
    .contact-form-sending #contact-form-submit-anim::before {
      transform: scale(0.7, 0.7); }

.contact-form-submit-anim-dot {
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 10px;
  margin-top: -5px;
  margin-left: -20px;
  border-radius: 50%;
  background-color: #b09e82;
  animation: contact-form-submit-anim-dot-anim 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275) infinite; }
  .contact-form-submit-anim-dot:nth-child(2) {
    margin-left: -5px;
    animation-delay: .2s; }
  .contact-form-submit-anim-dot:nth-child(3) {
    margin-left: 10px;
    animation-delay: .4s; }

@keyframes contact-form-submit-anim-dot-anim {
  0% {
    transform: translateY(0); }
  20% {
    transform: translateY(-15px); }
  40%,
  100% {
    transform: translateY(0); } }

.scroll-down-btn {
  opacity: .7;
  transition: opacity .2s; }
  .page-id-not-found .scroll-down-btn, .page-id-home .scroll-down-btn, .page-id-about .scroll-down-btn, .page-id-contact .scroll-down-btn, .page-id-renault-integrity .scroll-down-btn, .page-id-engie-digital-design .scroll-down-btn, .page-id-cic .scroll-down-btn, .page-id-shopping-robot .scroll-down-btn {
    opacity: .5; }
  .scroll-down-btn:hover {
    transition: opacity .4s;
    opacity: 1; }

.scroll-down-btn-picto {
  width: 18px;
  height: 28px;
  fill: #4a4a4a;
  animation: scroll-down-btn-picto-loop 5s infinite 6s; }
  .page-id-not-found .scroll-down-btn-picto, .page-id-home .scroll-down-btn-picto, .page-id-about .scroll-down-btn-picto, .page-id-contact .scroll-down-btn-picto, .page-id-renault-integrity .scroll-down-btn-picto, .page-id-engie-digital-design .scroll-down-btn-picto, .page-id-cic .scroll-down-btn-picto, .page-id-shopping-robot .scroll-down-btn-picto {
    fill: #fff; }

@keyframes scroll-down-btn-picto-loop {
  0% {
    transform: translateY(0); }
  8% {
    transform: translateY(10px); }
  16% {
    transform: translateY(0); }
  22% {
    transform: translateY(10px); }
  28%,
  100% {
    transform: translateY(0); } }

.scroll-down-btn-label {
  padding-top: 18px;
  color: #4a4a4a;
  line-height: 14px;
  font-family: "Lora", "Georgia", serif;
  font-style: italic;
  font-size: 14px; }
  .page-id-not-found .scroll-down-btn-label, .page-id-home .scroll-down-btn-label, .page-id-about .scroll-down-btn-label, .page-id-contact .scroll-down-btn-label, .page-id-renault-integrity .scroll-down-btn-label, .page-id-engie-digital-design .scroll-down-btn-label, .page-id-cic .scroll-down-btn-label, .page-id-shopping-robot .scroll-down-btn-label {
    color: #fff; }

.scroll-down-btn-label-word {
  display: inline-block; }

#page-container {
  position: relative;
  min-height: 100vh; }

.js .page {
  opacity: 0; }

#page-transition {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  visibility: hidden;
  transform-origin: left;
  background-color: #2a2a2a; }

#page-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 200;
  visibility: hidden; }
  .page-disabled #page-overlay {
    visibility: visible; }

.page-header {
  position: relative;
  min-height: 100vh;
  padding: 100px 25px;
  overflow: hidden; }
  @media screen and (min-width: 1024px) {
    .page-header {
      padding: 100px 40px 0;
      height: 100vh; } }
  @media screen and (min-width: 1280px) {
    .page-header {
      padding-right: 100px;
      padding-left: 100px; } }

.page-header-cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center; }
  .js .page-header-cover {
    opacity: 0; }
  .page-header-cover.loaded {
    transition: opacity 1s;
    opacity: 1; }

.page-header-img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity .8s .1s; }
  .page-header-img.lazyloaded {
    opacity: 1; }

.page-header-title {
  position: relative;
  font-size: 46px;
  font-size: 10vmin;
  line-height: 46px;
  line-height: 15vmin;
  overflow: hidden; }
  @media screen and (min-width: 480px) {
    .page-header-title {
      font-size: 56px;
      line-height: 74px; } }
  @media screen and (min-width: 1000px) {
    .page-header-title {
      font-size: 72px;
      line-height: 88px; } }
  @media screen and (min-width: 1024px) {
    .page-header-title {
      font-size: 90px;
      line-height: 110px; } }
  .page-header-light-color .page-header-title {
    color: #4a4a4a; }

.page-header-title-line {
  position: relative;
  display: block;
  float: left;
  clear: left; }
  .js .page-header-title-line {
    opacity: 0; }

.page-header-title-line-1 {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em; }

.page-header-title-line-2 {
  font-family: "Lora", "Georgia", serif;
  font-style: italic;
  font-weight: 400; }

.page-header-title-line-overlay {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  display: block;
  background-color: #fff;
  opacity: 0;
  transform-origin: left top; }
  .page-header-light-color .page-header-title-line-overlay {
    background-color: #4a4a4a; }
  .page-header-title-line-1 .page-header-title-line-overlay {
    bottom: 8px; }
  .page-header-title-line-2 .page-header-title-line-overlay {
    bottom: 9px; }

.page-header-title-line-txt {
  display: inline-block; }
  .page-header-title-line-txt::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    background-color: #fff; }
    .page-header-light-color .page-header-title-line-txt::after {
      background-color: #4a4a4a; }
  .page-header-title-line-1 .page-header-title-line-txt::after {
    bottom: 0;
    height: 6px; }
    @media screen and (min-width: 1000px) {
      .page-header-title-line-1 .page-header-title-line-txt::after {
        height: 8px; } }
    @media screen and (min-width: 1024px) {
      .page-header-title-line-1 .page-header-title-line-txt::after {
        height: 10px; } }
  .page-header-title-line-2 .page-header-title-line-txt::after {
    bottom: 9px;
    height: 2px; }
    @media screen and (min-width: 1000px) {
      .page-header-title-line-2 .page-header-title-line-txt::after {
        height: 3px; } }
    @media screen and (min-width: 1024px) {
      .page-header-title-line-2 .page-header-title-line-txt::after {
        height: 5px; } }

.page-header-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

.page-header .scroll-down-btn {
  display: none; }
  @media screen and (min-width: 1024px) {
    .page-header .scroll-down-btn {
      position: absolute;
      bottom: 50px;
      left: 50%;
      display: block;
      transform: translateX(-50%); } }

.section-title {
  padding-bottom: 20px;
  text-transform: uppercase;
  color: #b09e82;
  font-size: 14px;
  line-height: 14px;
  font-weight: 500;
  letter-spacing: .1em; }
  .in-view-active .in-view-trigger .section-title {
    opacity: 0;
    transform: translateY(80px);
    transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view-trigger.in-view .section-title {
    opacity: 1;
    transform: translateY(0); }

.section-subtitle {
  padding-bottom: 35px;
  color: #4a4a4a;
  font-family: "Lora", "Georgia", serif;
  font-size: 32px;
  line-height: 40px;
  font-style: italic; }
  @media screen and (min-width: 1024px) {
    .section-subtitle {
      font-size: 36px;
      line-height: 46px; } }
  .in-view-active .in-view-trigger .section-subtitle {
    opacity: 0;
    transform: translateY(80px);
    transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0.1s; }
  .in-view-trigger.in-view .section-subtitle {
    opacity: 1;
    transform: translateY(0); }

.in-view-active .in-view-trigger .section-body > * {
  opacity: 0;
  transform: translateY(80px);
  transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0.3s; }

.in-view-trigger .section-body > *:nth-child(2) {
  transition-delay: 0.5s; }

.in-view-trigger .section-body > *:nth-child(3) {
  transition-delay: 0.6s; }

.in-view-trigger .section-body > *:nth-child(4) {
  transition-delay: 0.7s; }

.in-view-trigger.in-view .section-body > * {
  opacity: 1;
  transform: translateY(0); }

.section-body ul {
  padding: 30px 0; }

.section-body li {
  position: relative;
  padding-left: 30px; }
  .section-body li::after {
    content: "";
    position: absolute;
    top: 15px;
    left: 0;
    display: block;
    height: 1px;
    width: 20px;
    background-color: #b09e82; }

.in-view-active .section-figure.in-view-trigger {
  opacity: 0;
  transition: opacity .8s; }

.section-figure.in-view-trigger.in-view {
  opacity: 1; }

.page-id-not-found #nav {
  opacity: 1;
  visibility: visible; }

.page-id-not-found #nav-logo {
  margin-left: -25px; }

.page-id-not-found #nav-logo-img {
  visibility: hidden; }

.page-id-not-found #contact-btn {
  opacity: 1; }

#not-found-page {
  opacity: 1; }

#not-found-page-header {
  background-color: #2a2a2a; }

#not-found-page-header .page-header-cover {
  opacity: 1;
  background-image: url("../img/home-header.png"); }

#not-found-page-header .page-header-title {
  color: #fff; }

#not-found-page-header .page-header-title-line {
  opacity: 1; }

#not-found-back {
  display: inline-block;
  position: relative;
  margin-top: 50px;
  padding-left: 30px;
  z-index: 2;
  font-size: 16px;
  line-height: 30px;
  color: #fff; }
  #not-found-back::before {
    content: "";
    position: absolute;
    top: 14px;
    left: 0;
    display: block;
    height: 1px;
    width: 20px;
    background-color: #fff; }

.page-id-not-found #page-transition {
  display: none; }

.page-id-home #nav-bar::before {
  background-color: #2a2a2a; }

.page-id-home #nav-logo-name {
  transform: translateX(-25px); }

.page-id-home #nav-logo-img {
  transition: opacity 0s;
  opacity: 0; }

.page-id-home #page-transition-overlay-1 {
  background-color: #b09e82; }

#home-page-header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #fff;
  text-align: center;
  background-color: #2a2a2a; }
  @media screen and (min-width: 1000px) {
    #home-page-header {
      display: block; } }

#home-page-header .page-header-cover {
  background-image: url("../img/home-header-mobile@2x.png"); }
  @media screen and (min-width: 1000px) {
    #home-page-header .page-header-cover {
      background-image: url("../img/home-header.png"); } }

#home-page-header-video {
  display: none; }
  .desktop #home-page-header-video {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%; }

@media (min-aspect-ratio: 16 / 9) {
  #home-page-header-video {
    height: 300%;
    top: -100%; } }

@media (max-aspect-ratio: 16 / 9) {
  #home-page-header-video {
    width: 300%;
    left: -100%; } }

@supports (object-fit: cover) {
  #home-page-header-video {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover; } }

#home-page-body {
  padding-bottom: 100px; }

@media screen and (min-width: 1000px) {
  #home-page-header-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-top: -20px; } }

#home-page-header-title-wrapper {
  display: inline-block; }
  @media screen and (min-width: 1280px) {
    #home-page-header-title-wrapper {
      display: block; } }

.home-page-header-title-line {
  position: relative;
  display: block;
  white-space: nowrap; }

#home-page-header-title-line-1 {
  padding-bottom: 12px;
  font-size: 50px;
  font-size: 18vmin;
  line-height: 50px;
  line-height: 18vmin;
  font-weight: 700;
  letter-spacing: 1vmin;
  text-transform: uppercase; }
  @media screen and (min-width: 480px) {
    #home-page-header-title-line-1 {
      font-size: 70px;
      line-height: 70px; } }
  @media screen and (min-width: 1000px) {
    #home-page-header-title-line-1 {
      font-size: 90px;
      line-height: 90px;
      letter-spacing: .1em; } }

#home-page-header-title-line-2 {
  padding-bottom: 22px;
  font-size: 50px;
  font-size: 13vmin;
  line-height: 50px;
  line-height: 13vmin;
  font-family: "Lora", "Georgia", serif;
  font-style: italic;
  font-weight: 400; }
  @media screen and (min-width: 480px) {
    #home-page-header-title-line-2 {
      font-size: 50px;
      line-height: 50px; } }
  @media screen and (min-width: 1000px) {
    #home-page-header-title-line-2 {
      font-size: 65px;
      line-height: 65px; } }

#home-page-header-title-line-1 .page-header-title-line-overlay {
  bottom: 8px; }

#home-page-header-title-line-2 .page-header-title-line-overlay {
  bottom: 9px; }

#home-page-header .page-header-title-line-txt::after {
  height: 4px; }

#home-page-header-title-line-1 .page-header-title-line-txt::after {
  bottom: 5px; }

#home-page-header-title-line-2 .page-header-title-line-txt::after {
  bottom: 10px; }

#home-title-skills {
  display: inline-block;
  width: 100%;
  font-size: 0; }

.home-title-skill {
  position: relative;
  display: inline-block;
  width: 20%;
  font-size: 9px;
  font-size: 2.5vmin;
  line-height: 9px;
  line-height: 3vmin;
  text-transform: uppercase;
  color: #848484; }
  @media screen and (min-width: 480px) {
    .home-title-skill {
      font-size: 10px;
      line-height: 10px; } }
  @media screen and (min-width: 1000px) {
    .home-title-skill {
      font-size: 12px;
      line-height: 12px; } }
  .home-title-skill::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 1px;
    height: 100%;
    transform: translateY(-50%);
    background-color: #b09e82; }
  .home-title-skill:first-child::after {
    content: none; }

#home-page-header-subtitle {
  position: relative;
  display: inline-block;
  padding-top: 35px;
  font-size: 14px;
  line-height: 30px;
  color: #8b8a8a;
  max-width: 440px; }
  #home-page-header-subtitle strong {
    font-weight: normal;
    font-family: "Lora", "Georgia", serif;
    font-style: italic;
    color: #bbb; }

#home-what {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  padding: 35px 25px 100px;
  overflow: hidden;
  background-color: #f3f3f3; }
  @media screen and (min-width: 1024px) {
    #home-what {
      display: block;
      padding: 115px 120px 90px; } }
  @media screen and (min-width: 1280px) {
    #home-what {
      padding-right: 180px;
      padding-left: 180px; } }

@media screen and (min-width: 1024px) {
  #home-what-figure-wrapper {
    display: inline-block;
    width: 65%;
    margin-top: 90px;
    padding-right: 80px; } }

@media screen and (min-width: 1400px) {
  #home-what-figure-wrapper {
    margin-top: 110px;
    padding-right: 120px; } }

#home-what-figure {
  position: relative; }

#home-what-img {
  width: 100%;
  height: auto; }

#home-what-captions {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-size: 14px;
  line-height: 16px;
  font-style: italic; }

.home-what-caption {
  position: absolute;
  min-width: 12.7%;
  max-width: 15%;
  text-align: center;
  transform: translateX(-50%); }

#home-what-caption-mobile {
  top: 65%;
  left: 5%; }

#home-what-caption-wearable {
  bottom: 103%;
  left: 19%; }

#home-what-caption-robot {
  bottom: 103%;
  left: 48%; }

#home-what-caption-object {
  bottom: 103%;
  left: 70%; }

#home-what-caption-environment {
  top: 88%;
  left: 74%; }

#home-what-text {
  padding-bottom: 70px; }
  @media screen and (min-width: 1024px) {
    #home-what-text {
      float: right;
      width: 35%;
      padding-bottom: 0; } }

#home-what-link {
  position: absolute;
  bottom: 20px;
  right: 25px;
  display: block;
  width: 50px;
  height: 50px;
  margin-top: 30px;
  border-radius: 100%;
  background-color: #fff;
  transition: background-color .3s; }
  @media screen and (min-width: 1024px) {
    #home-what-link {
      position: relative;
      bottom: auto;
      right: auto; } }
  #home-what-link:hover {
    transition: background-color 0s;
    background-color: #4a4a4a; }
  .in-view-active #home-what-link {
    opacity: 0;
    transform: translateY(80px);
    transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0.5s, transform 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0.5s; }
  .in-view #home-what-link {
    opacity: 1;
    transform: translateY(0); }

#home-what-link-label {
  display: none; }

#home-what-link-arrow {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  width: 14px;
  height: 11px;
  margin-left: -7px;
  margin-top: -5px;
  backface-visibility: hidden;
  fill: #b09e82; }
  #home-what-link:hover #home-what-link-arrow {
    fill: #fff;
    animation: home-what-link-arrow-roll-over 0.5s cubic-bezier(0.19, 1, 0.22, 1); }

@keyframes home-what-link-arrow-roll-over {
  from {
    transform: translateX(-50px); }
  to {
    transform: translateX(0); } }

#home-latest {
  padding: 35px 25px 0;
  overflow: hidden; }
  @media screen and (min-width: 1024px) {
    #home-latest {
      padding: 100px 100px 120px; } }

#home-latest-heading {
  padding-bottom: 35px;
  text-align: left; }
  @media screen and (min-width: 1024px) {
    #home-latest-heading {
      padding-bottom: 50px;
      text-align: center; } }

@media screen and (max-width: 1023px) {
  #home-latest-heading .section-title {
    padding-bottom: 0; } }

.in-view-active #home-latest-heading .section-title {
  opacity: 0;
  transform: translateY(80px);
  transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); }

#home-latest-heading.in-view .section-title {
  opacity: 1;
  transform: translateY(0); }

#home-latest-heading .section-subtitle {
  display: none; }
  @media screen and (min-width: 1024px) {
    #home-latest-heading .section-subtitle {
      display: block; } }
  .in-view-active #home-latest-heading .section-subtitle {
    opacity: 0;
    transform: translateY(80px);
    transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0.1s; }

#home-latest-heading.in-view .section-subtitle {
  opacity: 1;
  transform: translateY(0); }

.home-latest-item {
  position: relative;
  margin-bottom: 130px;
  perspective: 800px; }
  @media screen and (min-width: 1024px) {
    .home-latest-item {
      margin-bottom: 100px; } }

.home-latest-item-btn {
  display: block; }
  .in-view-active .home-latest-item-btn {
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.3s;
    opacity: 0;
    transform: rotateX(45deg) translateZ(0); }
  .in-view .home-latest-item-btn {
    opacity: 1;
    transform: rotateX(0) translateZ(0); }

.home-latest-item-title {
  position: absolute;
  bottom: -70px;
  left: 22px;
  color: #4a4a4a;
  z-index: 3; }
  @media screen and (min-width: 1000px) {
    .home-latest-item-title {
      bottom: -35px; } }
  @media screen and (min-width: 1024px) {
    .home-latest-item-title {
      left: 75px; }
      .home-latest-item:hover .home-latest-item-title,
      .home-latest-item.clicked .home-latest-item-title {
        color: #fff; } }

.home-latest-item-title-line {
  position: relative;
  display: block;
  float: left;
  clear: left;
  z-index: 2;
  font-size: 46px;
  font-size: 9vmin;
  line-height: 46px;
  line-height: 13vmin; }
  @media screen and (min-width: 1024px) {
    .home-latest-item-title-line {
      font-size: 64px;
      line-height: 78px; } }
  @media screen and (min-width: 1280px) {
    .home-latest-item-title-line {
      font-size: 72px;
      line-height: 88px; } }
    .page-header-light-color .home-latest-item-title-line::after {
      background-color: #4a4a4a; }
    @media screen and (min-width: 1024px) {
      .home-latest-item:hover .home-latest-item-title-line::after {
        background-color: #fff; } }

.home-latest-item-title-line-1 {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em; }

.home-latest-item-title-line-2 {
  font-family: "Lora", "Georgia", serif;
  font-style: italic;
  font-weight: 400; }
  .home-latest-item-title-line-2::after {
    bottom: 8px;
    height: 2px; }
    @media screen and (min-width: 1000px) {
      .home-latest-item-title-line-2::after {
        height: 3px; } }
    @media screen and (min-width: 1024px) {
      .home-latest-item-title-line-2::after {
        height: 4px; } }

.home-latest-item-desc {
  display: none; }
  @media screen and (min-width: 1000px) {
    .home-latest-item-desc {
      position: absolute;
      bottom: 0;
      left: 75px;
      display: block;
      width: 55%;
      max-width: 550px;
      z-index: 3;
      font-family: "Lora", "Georgia", serif;
      font-style: italic;
      color: #fff;
      font-size: 20px;
      line-height: 26px;
      opacity: 0; } }
  @media screen and (min-width: 1280px) {
    .home-latest-item-desc {
      font-size: 30px;
      line-height: 36px; } }

.home-latest-item-cta {
  position: absolute;
  bottom: 0;
  left: 75px;
  width: 40px;
  height: 40px;
  z-index: 3;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  opacity: 0; }
  @media screen and (min-width: 1280px) {
    .home-latest-item-cta {
      width: 50px;
      height: 50px; } }

.home-latest-item-cta-arrow {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  width: 13px;
  height: 9px;
  margin-left: -6px;
  margin-top: -5px;
  fill: #4a4a4a;
  backface-visibility: hidden; }

.home-latest-item-thumb-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden; }
  .home-latest-item-thumb-wrapper::before {
    display: block;
    content: "";
    width: 100%;
    padding-top: 100%; }
    @media screen and (min-width: 1000px) {
      .home-latest-item-thumb-wrapper::before {
        padding-top: 45.8333333333%; } }

.home-latest-item-thumb {
  position: absolute;
  top: 0;
  left: 50%;
  width: auto;
  height: 100%;
  transform: translateX(-50%);
  transition: opacity .6s; }
  @media screen and (min-width: 1000px) {
    .home-latest-item-thumb {
      top: 50%;
      left: 0;
      width: 100%;
      height: auto;
      transform: translateY(-50%); }
      .home-latest-item:hover .home-latest-item-thumb,
      .home-latest-item.clicked .home-latest-item-thumb {
        transition: opacity .3s;
        opacity: 0; } }

#home-latest-item-transition {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  visibility: hidden;
  z-index: 10; }

#home-latest-item-transition .home-latest-item-title-line,
#home-latest-item-transition .page-header-title-line {
  position: absolute;
  top: 0;
  left: 0;
  color: #fff;
  transform-origin: left top;
  z-index: 2;
  backface-visibility: hidden; }
  #home-latest-item-transition .home-latest-item-title-line::after,
  #home-latest-item-transition .page-header-title-line::after {
    background-color: #fff; }

#home-latest-item-transition .page-header-title-line {
  font-size: 72px;
  line-height: 88px;
  overflow: hidden;
  opacity: 0; }
  @media screen and (min-width: 1024px) {
    #home-latest-item-transition .page-header-title-line {
      font-size: 90px;
      line-height: 110px; } }
  #home-latest-item-transition .page-header-title-line::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    background-color: #fff; }

#home-latest-item-transition .page-header-title-line-1::after {
  bottom: 0;
  height: 8px; }
  @media screen and (min-width: 1024px) {
    #home-latest-item-transition .page-header-title-line-1::after {
      height: 10px; } }

#home-latest-item-transition .page-header-title-line-2::after {
  bottom: 9px;
  height: 5px; }

#home-latest-item-transition-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  transform-origin: left top; }

.page-id-about #nav-bar::before {
  background-color: #333; }

#about-page-header {
  background-color: #333; }

#about-page-header .page-header-cover {
  background-image: url("../img/about-header-mobile@2x.jpg"); }
  @media screen and (min-width: 1000px) {
    #about-page-header .page-header-cover {
      background-image: url("../img/about-header.jpg"); } }
  @media only screen and (min-width: 1000px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min--moz-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-width: 1000px) and (min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min-resolution: 192dpi), only screen and (min-width: 1000px) and (min-resolution: 2dppx) {
    #about-page-header .page-header-cover {
      background-image: url("../img/about-header@2x.jpg"); } }
  @media screen and (min-width: 1400px) {
    #about-page-header .page-header-cover {
      background-image: url("../img/about-header@2x.jpg"); } }

#about-page-header .page-header-title {
  color: #fff; }

#about-mission-text {
  padding: 35px 25px 30px; }
  @media screen and (min-width: 1024px) {
    #about-mission-text {
      width: 90%;
      padding: 100px 120px 0; } }
  @media screen and (min-width: 1280px) {
    #about-mission-text {
      padding-right: 180px;
      padding-left: 180px; } }
  @media screen and (min-width: 1400px) {
    #about-mission-text {
      width: 74%; } }

@media screen and (min-width: 1024px) {
  #about-mission-body {
    font-size: 0; } }

@media screen and (min-width: 1024px) {
  #about-mission-subtitle {
    width: 80%; } }

@media screen and (min-width: 1024px) {
  #about-mission-body p {
    display: inline-block;
    width: 50%;
    padding-right: 100px;
    vertical-align: top;
    font-size: 14px; } }

#about-mission-figure {
  display: none; }
  @media screen and (min-width: 1024px) {
    #about-mission-figure {
      display: block;
      position: relative;
      padding: 200px 0; } }

#about-mission-figure-bg {
  width: 100%;
  height: 260px;
  font-size: 0;
  line-height: 0;
  border-top: 1px solid #d4d4d4;
  border-bottom: 1px solid #d4d4d4; }
  .in-view-active #about-mission-figure-bg {
    opacity: 0;
    transition: opacity 1s; }
  .in-view #about-mission-figure-bg {
    opacity: 1; }

.about-mission-figure-bg-col {
  display: inline-block;
  width: 12%;
  height: 100%;
  border-right: 1px dashed #d4d4d4; }

#about-mission-figure-lines {
  position: absolute;
  top: 50%;
  height: 60px;
  width: 100%;
  margin-top: -30px; }

#about-mission-figure-lines svg {
  width: 100%;
  height: 100%; }

#about-mission-figure-line-1,
#about-mission-figure-line-2 {
  position: absolute;
  top: 0;
  right: 21%;
  bottom: 0;
  left: 0; }
  .in-view-active #about-mission-figure-line-1, .in-view-active
  #about-mission-figure-line-2 {
    overflow: hidden;
    transition: transform 2.6s cubic-bezier(0.39, 0.575, 0.565, 1);
    transform: translateX(-100%); }
  .in-view #about-mission-figure-line-1, .in-view
  #about-mission-figure-line-2 {
    transform: translateX(0); }
  .in-view-active #about-mission-figure-line-1 svg, .in-view-active
  #about-mission-figure-line-2 svg {
    transition: transform 2.6s cubic-bezier(0.39, 0.575, 0.565, 1);
    transform: translateX(100%); }
  .in-view #about-mission-figure-line-1 svg, .in-view
  #about-mission-figure-line-2 svg {
    transform: translateX(0); }

.js #about-mission-figure-line-2 {
  transition-delay: .4s; }

.js #about-mission-figure-line-2 svg {
  transition-delay: .4s; }

#about-mission-figure-lines-label {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 79%;
  text-align: center;
  font-weight: 700;
  color: #2a2a2a;
  text-transform: uppercase; }
  .in-view-active #about-mission-figure-lines-label {
    transition: opacity .5s 2.4s;
    opacity: 0; }
  .in-view #about-mission-figure-lines-label {
    opacity: 1; }
  #about-mission-figure-lines-label span {
    display: inline-block;
    text-align: left; }

.about-mission-caption {
  position: absolute;
  font-size: 20px;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  color: #606060; }
  .in-view-active .about-mission-caption {
    transition: opacity 1s;
    opacity: 0; }
  .about-mission-caption:nth-child(1) {
    transition-delay: 0.6s; }
  .about-mission-caption:nth-child(2) {
    transition-delay: 0.9s; }
  .about-mission-caption:nth-child(3) {
    transition-delay: 1.2s; }
  .about-mission-caption:nth-child(4) {
    transition-delay: 1.5s; }
  .about-mission-caption:nth-child(5) {
    transition-delay: 1.8s; }
  .about-mission-caption:nth-child(6) {
    transition-delay: 2.1s; }
  .about-mission-caption:nth-child(7) {
    transition-delay: 2.4s; }
  .in-view .about-mission-caption {
    opacity: 1; }
  .about-mission-caption:nth-child(1) {
    top: 150px;
    left: 6%;
    padding-left: 75px; }
    .about-mission-caption:nth-child(1) .about-mision-caption-arrow {
      width: 70px;
      height: 90px;
      transform: scaleX(-1) rotate(-65deg); }
  .about-mission-caption:nth-child(2) {
    left: 16%;
    bottom: 110px;
    padding-left: 75px; }
    .about-mission-caption:nth-child(2) .about-mision-caption-arrow {
      top: -70px;
      width: 75px;
      height: 90px;
      transform: rotate(-240deg); }
  .about-mission-caption:nth-child(3) {
    top: 100px;
    left: 29%;
    padding-left: 50px; }
    .about-mission-caption:nth-child(3) .about-mision-caption-arrow {
      top: 30px;
      height: 113px;
      width: 54px;
      transform: rotate(35deg); }
  .about-mission-caption:nth-child(4) {
    left: 41%;
    bottom: 90px;
    padding-left: 60px; }
    .about-mission-caption:nth-child(4) .about-mision-caption-arrow {
      top: -100px;
      width: 54px;
      height: 113px;
      transform: scaleX(-1) rotate(220deg); }
  .about-mission-caption:nth-child(5) {
    top: 100px;
    left: 52%;
    padding-left: 70px; }
    .about-mission-caption:nth-child(5) .about-mision-caption-arrow {
      top: 20px;
      width: 80px;
      height: 136px;
      transform: rotate(-125deg); }
  .about-mission-caption:nth-child(6) {
    left: 64%;
    bottom: 120px;
    padding-left: 50px; }
    .about-mission-caption:nth-child(6) .about-mision-caption-arrow {
      top: -140px;
      width: 78px;
      height: 149px;
      transform: scaleX(-1) rotate(40deg); }
  .about-mission-caption:nth-child(7) {
    top: 130px;
    left: 74%;
    padding-left: 10px; }
    .about-mission-caption:nth-child(7) .about-mision-caption-arrow {
      top: 20px;
      width: 50px;
      height: 115px;
      transform: rotate(45deg); }

.about-mision-caption-arrow {
  position: absolute;
  top: 0;
  left: 0; }

.about-mision-caption-arrow {
  fill: #656565; }

#about-work {
  position: relative;
  padding: 35px 25px;
  overflow: hidden;
  min-height: 500px;
  background-color: #4a4a4a; }
  @media screen and (min-width: 1024px) {
    #about-work {
      padding: 100px 120px; } }
  @media screen and (min-width: 1280px) {
    #about-work {
      padding-right: 180px;
      padding-left: 180px; } }

#about-work-figure-wrapper {
  text-align: center; }
  @media screen and (min-width: 1024px) {
    #about-work-figure-wrapper {
      position: absolute;
      top: 0;
      right: 40%;
      bottom: 0;
      left: 20px;
      max-width: 720px; } }

#about-work-figure {
  position: relative; }
  @media screen and (min-width: 1024px) {
    #about-work-figure {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100%;
      height: auto;
      transform: translate(-50%, -50%); } }

#about-work-figure img {
  max-width: 100%;
  height: auto; }
  @media screen and (min-width: 1024px) {
    #about-work-figure img {
      width: 100%; } }

#about-work-figure-captions {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%); }

.about-work-figure-caption {
  position: absolute;
  top: 50%;
  left: 50%;
  text-align: center;
  line-height: 19px;
  font-size: 10px;
  line-height: 12px; }
  @media screen and (min-width: 1024px) {
    .about-work-figure-caption {
      line-height: 19px;
      font-size: 14px; } }
  .about-work-figure-caption:nth-child(1) {
    margin-top: -26%;
    margin-left: 20%; }
  .about-work-figure-caption:nth-child(2) {
    margin-top: 2%;
    margin-left: 26%; }
  .about-work-figure-caption:nth-child(3) {
    margin-top: 24%;
    margin-left: 5%; }
  .about-work-figure-caption:nth-child(4) {
    margin-top: 12%;
    margin-left: -30%;
    transform: translateX(-50%); }
  .about-work-figure-caption:nth-child(5) {
    margin-top: -22%;
    margin-left: -28%;
    transform: translateX(-50%); }

.about-work-figure-caption-label {
  text-transform: uppercase;
  color: #b09e82;
  font-weight: 500; }
  .in-view-active .about-work-figure-caption-label {
    transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s;
    transform: translateY(30px);
    opacity: 0; }
  .in-view .about-work-figure-caption-label {
    transform: translateY(0);
    opacity: 1; }
  .about-work-figure-caption:nth-child(1) .about-work-figure-caption-label {
    transition-delay: 0.7s; }
  .about-work-figure-caption:nth-child(2) .about-work-figure-caption-label {
    transition-delay: 1s; }
  .about-work-figure-caption:nth-child(3) .about-work-figure-caption-label {
    transition-delay: 1.3s; }
  .about-work-figure-caption:nth-child(4) .about-work-figure-caption-label {
    transition-delay: 1.6s; }
  .about-work-figure-caption:nth-child(5) .about-work-figure-caption-label {
    transition-delay: 1.9s; }
  .about-work-figure-caption:nth-child(6) .about-work-figure-caption-label {
    transition-delay: 2.2s; }
  .about-work-figure-caption:nth-child(7) .about-work-figure-caption-label {
    transition-delay: 2.5s; }

.about-work-figure-caption-sublabel {
  font-style: italic; }
  .in-view-active .about-work-figure-caption-sublabel {
    transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s;
    transform: translateY(30px);
    opacity: 0; }
  .in-view .about-work-figure-caption-sublabel {
    transform: translateY(0);
    opacity: 1; }
  .about-work-figure-caption:nth-child(1) .about-work-figure-caption-sublabel {
    transition-delay: 0.75s; }
  .about-work-figure-caption:nth-child(2) .about-work-figure-caption-sublabel {
    transition-delay: 1.1s; }
  .about-work-figure-caption:nth-child(3) .about-work-figure-caption-sublabel {
    transition-delay: 1.45s; }
  .about-work-figure-caption:nth-child(4) .about-work-figure-caption-sublabel {
    transition-delay: 1.8s; }
  .about-work-figure-caption:nth-child(5) .about-work-figure-caption-sublabel {
    transition-delay: 2.15s; }
  .about-work-figure-caption:nth-child(6) .about-work-figure-caption-sublabel {
    transition-delay: 2.5s; }
  .about-work-figure-caption:nth-child(7) .about-work-figure-caption-sublabel {
    transition-delay: 2.85s; }

#about-work .section-subtitle {
  color: #fff; }

#about-work-text {
  padding-top: 35px; }
  @media screen and (min-width: 1024px) {
    #about-work-text {
      float: right;
      width: 35%;
      padding-top: 0; } }

#about-work-text-body {
  color: #a6a6a6; }

#about-philosophy {
  padding: 35px 25px;
  overflow: hidden; }
  @media screen and (min-width: 1024px) {
    #about-philosophy {
      padding: 100px 120px;
      font-size: 0; } }
  @media screen and (min-width: 1280px) {
    #about-philosophy {
      padding-right: 180px;
      padding-left: 180px; } }

#about-philosophy-text {
  padding-bottom: 30px; }
  @media screen and (min-width: 1024px) {
    #about-philosophy-text {
      display: inline-block;
      width: 35%;
      padding-bottom: 0;
      vertical-align: top; } }

#about-philosophy-body {
  font-size: 14px; }

#about-philosophy-figure-wrapper {
  vertical-align: top;
  font-size: 11px;
  line-height: 11px;
  text-align: center; }
  @media screen and (min-width: 1024px) {
    #about-philosophy-figure-wrapper {
      display: inline-block;
      width: 65%;
      padding-left: 80px;
      font-size: 14px;
      line-height: 14px; } }

#about-philosophy-figure {
  display: inline-block;
  position: relative; }

#about-philosophy-figure-img {
  max-width: 100%;
  height: auto; }

#about-philosophy-central-disc-caption {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: 5%;
  transform: translate(-50%, -50%);
  text-transform: uppercase;
  color: #fff;
  font-weight: 500; }
  .in-view-active #about-philosophy-central-disc-caption {
    opacity: 0;
    transition: opacity .5s .7s; }
  .in-view #about-philosophy-central-disc-caption {
    opacity: 1; }

#about-philosophy-external-discs-captions {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-transform: uppercase;
  font-weight: 500;
  color: #b09e82; }

.about-philosophy-external-discs-caption {
  position: absolute;
  transform: translate(-50%, -50%); }
  .in-view-active .about-philosophy-external-discs-caption {
    opacity: 0;
    transition: opacity .5s .9s; }
  .in-view .about-philosophy-external-discs-caption {
    opacity: 1; }
  .about-philosophy-external-discs-caption:nth-child(1) {
    top: 22%;
    left: 50%; }
  .about-philosophy-external-discs-caption:nth-child(2) {
    bottom: 20%;
    left: 77%; }
    .in-view .about-philosophy-external-discs-caption:nth-child(2) {
      transition-delay: 1.1s; }
  .about-philosophy-external-discs-caption:nth-child(3) {
    bottom: 20%;
    left: 23%; }
    .in-view .about-philosophy-external-discs-caption:nth-child(3) {
      transition-delay: 1.3s; }

#about-philosophy-intersec-captions {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.about-philosophy-intersec-caption {
  white-space: nowrap;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  font-size: 16px;
  line-height: 16px; }
  @media screen and (min-width: 1024px) {
    .about-philosophy-intersec-caption {
      font-size: 20px;
      line-height: 20px; } }
  .in-view-active .about-philosophy-intersec-caption {
    opacity: 0;
    transition: opacity 1s 1.4s; }
  .in-view .about-philosophy-intersec-caption {
    opacity: 1; }
  .in-view .about-philosophy-intersec-caption:nth-child(2) {
    transition-delay: 1.6s; }
  .in-view .about-philosophy-intersec-caption:nth-child(3) {
    transition-delay: 1.8s; }

.about-philosophy-intersec-caption-label {
  position: absolute;
  transform: translateX(-50%); }
  #about-philosophy-intersec-captions li:nth-child(1) .about-philosophy-intersec-caption-label {
    top: 36%;
    left: 16%; }
  #about-philosophy-intersec-captions li:nth-child(2) .about-philosophy-intersec-caption-label {
    top: 40%;
    left: 86%; }
  #about-philosophy-intersec-captions li:nth-child(3) .about-philosophy-intersec-caption-label {
    top: 95%;
    left: 45%; }

.about-philosophy-intersec-caption-arrow {
  position: absolute;
  fill: #656565; }
  #about-philosophy-intersec-captions li:nth-child(1) .about-philosophy-intersec-caption-arrow {
    top: 28%;
    left: 10%;
    width: 50%;
    height: 17%;
    transform: scaleX(-1) rotate(110deg); }
  #about-philosophy-intersec-captions li:nth-child(2) .about-philosophy-intersec-caption-arrow {
    top: 42%;
    left: 66%;
    width: 21%;
    height: 23%;
    transform: rotate(30deg); }
  #about-philosophy-intersec-captions li:nth-child(3) .about-philosophy-intersec-caption-arrow {
    top: 70%;
    left: 30%;
    width: 21%;
    height: 23%;
    transform: rotate(150deg); }

#about-playground {
  display: flex;
  flex-direction: column-reverse;
  padding: 35px 25px;
  background-color: #4a4a4a; }
  @media screen and (min-width: 1024px) {
    #about-playground {
      display: block;
      padding: 100px 120px 70px;
      font-size: 0; } }
  @media screen and (min-width: 1280px) {
    #about-playground {
      padding-right: 180px;
      padding-left: 180px; } }

#about-playground-figure-wrapper {
  padding-bottom: 40px;
  text-align: center; }
  @media screen and (min-width: 1024px) {
    #about-playground-figure-wrapper {
      display: inline-block;
      width: 65%;
      padding-right: 100px;
      padding-bottom: 0; } }

#about-playground-main-figure {
  position: relative;
  display: inline-block;
  max-width: 600px;
  width: 100%;
  border: 1px dashed #b09e82;
  border-radius: 50%; }
  #about-playground-main-figure::before {
    content: "";
    display: block;
    padding-bottom: 100%; }

#about-playground-sub-figure {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80%;
  transform: translate(-50%, -50%);
  z-index: 2; }
  #about-playground-sub-figure::after {
    content: "";
    display: block;
    width: 100%;
    padding-top: 79.4979079498%; }

#about-playground-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto; }

#about-playground-sub-captions {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-size: 10px;
  line-height: 10px;
  font-style: italic;
  color: #848484; }
  @media screen and (min-width: 1000px) {
    #about-playground-sub-captions {
      font-size: 12px;
      line-height: 12px; } }

.about-playground-caption {
  position: absolute;
  min-width: 20%;
  max-width: 15%;
  text-align: center;
  transform: translateX(-50%); }

#about-playground-caption-mobile {
  top: 48%;
  left: 8%; }

#about-playground-caption-wearable {
  bottom: 103%;
  left: 27%; }

#about-playground-caption-robot {
  bottom: 103%;
  left: 48%; }

#about-playground-caption-object {
  bottom: 103%;
  left: 70%; }

#about-playground-caption-environment {
  top: 97%;
  left: 73%; }

#about-playground-main-captions {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-size: 14px;
  line-height: 16px; }

#about-playground-main-caption {
  position: absolute;
  bottom: -10px;
  left: 50%;
  padding: 20px 30px 0;
  transform: translate(-50%, 25%);
  text-align: center;
  background-color: #4a4a4a; }
  @media screen and (min-width: 1000px) {
    #about-playground-main-caption {
      bottom: 0;
      padding-top: 0; } }

#about-playground-main-caption-1 {
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  color: #fff;
  font-size: 16px;
  line-height: 16px; }

#about-playground-main-caption-2 {
  text-transform: uppercase;
  white-space: nowrap;
  font-size: 12px;
  color: #b09e82;
  letter-spacing: .1em; }

#about-playground-text {
  padding-bottom: 40px; }
  @media screen and (min-width: 1024px) {
    #about-playground-text {
      display: inline-block;
      width: 35%;
      padding-bottom: 0;
      font-size: 14px;
      vertical-align: top; } }

#about-playground-text .section-subtitle {
  color: #fff; }

.page-id-contact #nav-bar::before {
  background-color: #3c3c3c; }

#contact-page-header {
  background-color: #3c3c3c; }

#contact-page-header .page-header-cover {
  background-image: url("../img/contact-header-mobile@2x.jpg"); }
  @media screen and (min-width: 1000px) {
    #contact-page-header .page-header-cover {
      background-image: url("../img/contact-header.jpg"); } }
  @media only screen and (min-width: 1000px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min--moz-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-width: 1000px) and (min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min-resolution: 192dpi), only screen and (min-width: 1000px) and (min-resolution: 2dppx) {
    #contact-page-header .page-header-cover {
      background-image: url("../img/contact-header@2x.jpg"); } }
  @media screen and (min-width: 1400px) {
    #contact-page-header .page-header-cover {
      background-image: url("../img/contact-header@2x.jpg"); } }

#contact-page-header .page-header-title {
  color: #fff; }

#contact-who {
  padding: 35px 25px; }
  @media screen and (min-width: 1024px) {
    #contact-who {
      padding: 100px 120px; } }
  @media screen and (min-width: 1280px) {
    #contact-who {
      padding-right: 180px;
      padding-left: 180px; } }

@media screen and (min-width: 1024px) {
  #contact-who-text {
    width: 90%; } }

@media screen and (min-width: 1400px) {
  #contact-who-text {
    width: 74%; } }

@media screen and (min-width: 1024px) {
  #contact-who-subtitle {
    width: 80%; } }

@media screen and (min-width: 1024px) {
  #contact-who-body {
    font-size: 0; } }

@media screen and (min-width: 1024px) {
  #contact-who-body > * {
    display: inline-block;
    width: 50%;
    vertical-align: top;
    font-size: 14px;
    padding-right: 100px; } }

#contact-offices {
  width: 100%; }
  @media screen and (min-width: 1024px) {
    #contact-offices {
      height: 700px;
      font-size: 0; } }
  .in-view-active #contact-offices {
    perspective: 800; }

.contact-office {
  position: relative;
  height: 410px;
  text-align: center; }
  @media screen and (min-width: 1024px) {
    .contact-office {
      display: inline-block;
      width: 100%;
      height: 100%;
      font-size: 14px; } }
  .in-view-active .contact-office {
    opacity: 0;
    transform: rotateX(45deg);
    transition: opacity 0.3s, transform 0.8s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view .contact-office {
    opacity: 1;
    transform: rotateX(0); }
  .contact-office::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #232323;
    z-index: -1; }
  .contact-office::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    transition: opacity .2s;
    z-index: -1; }
    .mobile .contact-office::after {
      transition: none; }
  .contact-office:hover::after {
    filter: grayscale(100%);
    opacity: .1; }

#contact-office-lyon::after {
  background-image: url("../img/contact-lyon.jpg"); }
  @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
    #contact-office-lyon::after {
      background-image: url("../img/contact-lyon@2x.jpg"); } }

.in-view-active #contact-office-london {
  transition-delay: .2s; }

#contact-office-london::after {
  background-image: url("../img/contact-london.jpg"); }
  @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
    #contact-office-london::after {
      background-image: url("../img/contact-london@2x.jpg"); } }

.contact-office-city {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -60px;
  display: inline-block;
  font-size: 72px;
  line-height: 72px;
  color: #fff;
  font-family: "Lora", "Georgia", serif;
  font-style: italic;
  transform: translate(-50%, 0);
  transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .contact-office:hover .contact-office-city {
    transform: translate(-50%, -36px);
    color: #b09e82; }
  .contact-office-city::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    height: 2px;
    width: 100%;
    background-color: #fff; }
    .contact-office:hover .contact-office-city::after {
      background-color: #b09e82; }

.contact-office-infos {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  margin-top: 60px;
  color: #fff;
  line-height: 24px;
  transform: translate(-50%, -50%);
  visibility: hidden; }
  .contact-office:hover .contact-office-infos {
    visibility: visible; }

.contact-office-name {
  padding-bottom: 10px;
  text-transform: uppercase;
  font-size: 18px;
  transform: translateY(30px);
  opacity: 0; }
  .contact-office:hover .contact-office-name {
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0.1s, opacity 0s 0.11s;
    transform: translateY(0);
    opacity: 1; }

.contact-office-address {
  color: #b5b5b5;
  transform: translateY(30px);
  opacity: 0; }
  .contact-office:hover .contact-office-address {
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0.2s, opacity 0s 0.21s;
    transform: translateY(0);
    opacity: 1; }

.contact-office-tel,
.contact-office-email {
  display: block; }

.contact-office-tel {
  color: #b5b5b5;
  transform: translateY(30px);
  opacity: 0; }
  .contact-office:hover .contact-office-tel {
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0.3s, opacity 0s 0.31s;
    transform: translateY(0);
    opacity: 1; }

.contact-office-email {
  color: #b09e82;
  text-decoration: underline;
  transform: translateY(30px);
  opacity: 0; }
  .contact-office:hover .contact-office-email {
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0.4s, opacity 0s 0.41s;
    transform: translateY(0);
    opacity: 1; }

#contact-team {
  padding: 35px 0; }
  @media screen and (min-width: 1024px) {
    #contact-team {
      padding: 80px 0; } }

#contact-team-title {
  padding-bottom: 20px;
  font-size: 32px;
  line-height: 32px;
  font-family: "Lora", "Georgia", serif;
  font-style: italic;
  text-align: center; }
  @media screen and (min-width: 1024px) {
    #contact-team-title {
      padding-bottom: 60px;
      font-size: 36px;
      line-height: 36px; } }
  .in-view-active #contact-team-title {
    opacity: 0;
    transform: translateY(40px);
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s; }
  #contact-team-title.in-view {
    opacity: 1;
    transform: translateY(0); }

#contact-team-members {
  display: flex;
  flex-wrap: wrap;
  font-size: 0; }

.contact-team-member {
  position: relative;
  display: inline-block;
  width: 50%;
  padding: 30px 25px;
  vertical-align: top;
  font-size: 14px;
  text-align: center;
  border-top: 1px solid #ededed; }
  @media screen and (min-width: 1024px) {
    .contact-team-member {
      width: 25%;
      padding: 60px 50px; } }
  .in-view-active .contact-team-member > * {
    opacity: 0;
    transform: translateY(60px);
    transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .contact-team-member.in-view > * {
    opacity: 1;
    transform: translateY(0); }
  .contact-team-member::after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    width: 1px;
    height: 100%;
    background-color: #ededed; }
  .contact-team-member:nth-child(-n+2) {
    border-top: none; }
    .contact-team-member:nth-child(-n+2)::after {
      background-image: linear-gradient(#fff, #ededed); }
  @media screen and (min-width: 1024px) {
    .contact-team-member:nth-child(-n+4) {
      border-top: none; }
      .contact-team-member:nth-child(-n+4)::after {
        background-image: linear-gradient(#fff, #ededed); } }
  .contact-team-member:nth-child(2n)::after {
    content: none; }
  @media screen and (min-width: 1024px) {
    .contact-team-member:nth-child(2n)::after {
      content: ""; }
    .contact-team-member:nth-child(4n)::after {
      content: none; } }
  .contact-team-member:nth-last-child(-n+2)::after {
    background-image: linear-gradient(#ededed, #fff); }
  @media screen and (min-width: 1024px) {
    .contact-team-member:nth-last-child(-n+4)::after {
      background-image: linear-gradient(#ededed, #fff); } }

.contact-team-member-img {
  width: 60%;
  max-width: 135px;
  height: auto;
  margin-bottom: 20px; }
  @media screen and (min-width: 1024px) {
    .contact-team-member-img {
      width: auto;
      margin-bottom: 30px; } }
  .in-view-active .contact-team-member:nth-child(4n+1) .contact-team-member-img {
    transition-delay: 0.1s; }
  .in-view-active .contact-team-member:nth-child(4n+2) .contact-team-member-img {
    transition-delay: 0.2s; }
  .in-view-active .contact-team-member:nth-child(4n+3) .contact-team-member-img {
    transition-delay: 0.3s; }
  .in-view-active .contact-team-member:nth-child(4n+4) .contact-team-member-img {
    transition-delay: 0.4s; }

#contact-member-hiring .contact-team-member-img {
  display: inline-block;
  background-color: #000;
  border-radius: 50%; }
  @media screen and (min-width: 1024px) {
    #contact-member-hiring .contact-team-member-img {
      width: 135px; } }
  #contact-member-hiring .contact-team-member-img::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    padding-bottom: 100%; }

.contact-team-member-name {
  padding-bottom: 10px;
  text-transform: uppercase;
  font-size: 12px;
  line-height: 12px;
  font-weight: 700;
  color: #b09e82;
  letter-spacing: .1em; }
  @media screen and (min-width: 1024px) {
    .contact-team-member-name {
      padding-bottom: 4px;
      font-size: 18px;
      line-height: 18px; } }
  .in-view-active .contact-team-member:nth-child(4n+1) .contact-team-member-name {
    transition-delay: 0.2s; }
  .in-view-active .contact-team-member:nth-child(4n+2) .contact-team-member-name {
    transition-delay: 0.3s; }
  .in-view-active .contact-team-member:nth-child(4n+3) .contact-team-member-name {
    transition-delay: 0.4s; }
  .in-view-active .contact-team-member:nth-child(4n+4) .contact-team-member-name {
    transition-delay: 0.5s; }

.contact-team-member-role {
  font-size: 10px;
  line-height: 12px;
  color: #a6a6a6; }
  @media screen and (min-width: 1024px) {
    .contact-team-member-role {
      padding-bottom: 25px;
      font-size: 12px;
      line-height: 14px; } }
  .in-view-active .contact-team-member:nth-child(4n+1) .contact-team-member-role {
    transition-delay: 0.3s; }
  .in-view-active .contact-team-member:nth-child(4n+2) .contact-team-member-role {
    transition-delay: 0.4s; }
  .in-view-active .contact-team-member:nth-child(4n+3) .contact-team-member-role {
    transition-delay: 0.5s; }
  .in-view-active .contact-team-member:nth-child(4n+4) .contact-team-member-role {
    transition-delay: 0.6s; }

.contact-team-member-body {
  display: none; }
  @media screen and (min-width: 1024px) {
    .contact-team-member-body {
      display: block; } }
  .in-view-active .contact-team-member:nth-child(4n+1) .contact-team-member-body {
    transition-delay: 0.4s; }
  .in-view-active .contact-team-member:nth-child(4n+2) .contact-team-member-body {
    transition-delay: 0.5s; }
  .in-view-active .contact-team-member:nth-child(4n+3) .contact-team-member-body {
    transition-delay: 0.6s; }
  .in-view-active .contact-team-member:nth-child(4n+4) .contact-team-member-body {
    transition-delay: 0.7s; }

.case-desc {
  padding: 80px 25px;
  text-align: center;
  font-family: "Lora", "Georgia", serif;
  font-style: italic;
  font-size: 14px;
  line-height: 24px; }
  @media screen and (min-width: 1024px) {
    .case-desc {
      padding: 100px 120px;
      font-size: 28px;
      line-height: 46px; } }
  @media screen and (min-width: 1280px) {
    .case-desc {
      padding-right: 180px;
      padding-left: 180px; } }

.case-desc p {
  display: inline-block;
  max-width: 830px; }

.case-testimonial {
  display: none; }
  @media screen and (min-width: 1024px) {
    .case-testimonial {
      display: block;
      padding: 100px 120px 130px;
      text-align: center; } }
  @media screen and (min-width: 1280px) {
    .case-testimonial {
      padding-right: 180px;
      padding-left: 180px; } }

.case-testimonial-text {
  display: inline-block;
  width: 71%;
  text-align: center; }

.in-view-active .case-testimonial-title {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }

.in-view .case-testimonial-title {
  opacity: 1;
  transform: translateY(0); }

.case-testimonial-body {
  font-size: 30px;
  line-height: 48px;
  font-family: "Lora", "Georgia", serif;
  font-style: italic;
  color: #535353; }
  .in-view-active .case-testimonial-body {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transition-delay: .2s; }
  .in-view .case-testimonial-body {
    opacity: 1;
    transform: translateY(0); }

.in-view-active .case-testimonial-client {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
  transition-delay: .4s; }

.in-view .in-view .case-testimonial-client {
  opacity: 1;
  transform: translateY(0); }

.case-team {
  display: none; }
  @media screen and (min-width: 1024px) {
    .case-team {
      display: block;
      display: flex;
      font-size: 0;
      background-color: #e9e5dd; } }

.case-team-text {
  display: inline-block;
  width: 41%;
  padding: 100px 80px 120px 120px;
  vertical-align: top;
  font-size: 14px; }
  @media screen and (min-width: 1280px) {
    .case-team-text {
      padding-right: 140px;
      padding-left: 180px; } }

.case-team-members {
  display: inline-block;
  display: flex;
  width: 59%;
  vertical-align: top;
  overflow-x: auto;
  background-color: #202020;
  font-size: 0; }
  .case-team-members.slideshow-active {
    position: relative;
    overflow: hidden; }

.case-team-member {
  display: inline-block;
  width: 50%;
  padding: 60px 80px;
  font-size: 14px;
  text-align: center;
  border-right: 1px solid #484746;
  flex-grow: 1;
  flex-basis: 50%;
  flex-shrink: 0; }
  .case-team-member:first-child {
    border-left: none; }
  .slideshow-active .case-team-member {
    position: absolute;
    top: 0;
    left: 0; }

.case-team-member-img {
  margin-bottom: 20px; }
  .in-view-active .case-team-member-img {
    opacity: 0;
    transform: translateY(60px);
    transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transition-delay: .4s; }
  .in-view-active .case-team-member:nth-child(2) .case-team-member-img {
    transition-delay: 1s; }
  .in-view .case-team-member-img {
    opacity: 1;
    transform: translateY(0); }

.case-team-member-name {
  text-transform: uppercase;
  font-size: 18px;
  line-height: 18px;
  font-weight: 700;
  letter-spacing: .1em; }
  .in-view-active .case-team-member-name {
    opacity: 0;
    transform: translateY(60px);
    transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transition-delay: .6s; }
  .in-view-active .case-team-member:nth-child(2) .case-team-member-name {
    transition-delay: 1.2s; }
  .in-view .case-team-member-name {
    opacity: 1;
    transform: translateY(0); }

.case-team-member-role {
  font-size: 12px;
  padding-bottom: 20px; }
  .in-view-active .case-team-member-role {
    opacity: 0;
    transform: translateY(60px);
    transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transition-delay: .8s; }
  .in-view-active .case-team-member:nth-child(2) .case-team-member-role {
    transition-delay: 1.4s; }
  .in-view .case-team-member-role {
    opacity: 1;
    transform: translateY(0); }

.in-view-active .case-team-member-body {
  opacity: 0;
  transform: translateY(60px);
  transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
  transition-delay: 1s; }

.in-view-active .case-team-member:nth-child(2) .case-team-member-body {
  transition-delay: 1.6s; }

.in-view .case-team-member-body {
  opacity: 1;
  transform: translateY(0); }

.case-next-btn {
  position: relative;
  display: block;
  padding: 30px 25px;
  border-bottom: 1px solid #d4d4d4; }
  @media screen and (min-width: 1024px) {
    .case-next-btn {
      padding: 60px 120px; } }
  .case-next-btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #3a3a3a;
    z-index: -1;
    transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.1s 0.1s;
    opacity: 0;
    transform: scaleY(0); }
  .case-next-btn:hover::before {
    transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    opacity: 1;
    transform: scaleY(1); }

.case-next-btn-label {
  color: #3a3a3a;
  font-size: 10px;
  line-height: 30px;
  text-transform: uppercase;
  letter-spacing: .1em; }
  @media screen and (min-width: 1024px) {
    .case-next-btn-label {
      font-size: 12px;
      line-height: 35px; } }
  .case-next-btn:hover .case-next-btn-label {
    color: #fff; }
  .in-view-active .case-next-btn-label {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view .case-next-btn-label {
    opacity: 1;
    transform: translateY(0); }

.case-next-btn-project-title {
  position: relative;
  display: inline-block;
  max-width: calc(100% - 70px);
  font-size: 25px;
  line-height: 25px;
  color: #3a3a3a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }
  @media screen and (min-width: 1024px) {
    .case-next-btn-project-title {
      overflow: initial;
      font-size: 48px;
      line-height: 48px; } }
  .case-next-btn:hover .case-next-btn-project-title {
    color: #fff; }
  .in-view-active .case-next-btn-project-title {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.3s 0.1s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0.1s; }
  .in-view .case-next-btn-project-title {
    opacity: 1;
    transform: translateY(0); }
  .case-next-btn-project-title::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    background-color: #3a3a3a; }
    .case-next-btn:hover .case-next-btn-project-title::after {
      background-color: #fff; }

.case-next-btn-project-title-1 {
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: .1em; }

.case-next-btn-project-title-2 {
  font-family: "Lora", "Georgia", serif;
  font-style: italic; }

.case-next-btn-arrow {
  position: absolute;
  top: 50%;
  right: 25px;
  width: 56px;
  height: 27px;
  margin-top: 5px;
  transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s 0.3s;
  backface-visibility: hidden; }
  @media screen and (min-width: 1024px) {
    .case-next-btn-arrow {
      right: 120px; }
      .case-next-btn:hover .case-next-btn-arrow {
        opacity: 1;
        transform: translateX(40px); } }
  .in-view-active .case-next-btn-arrow {
    opacity: 0; }
  .in-view .case-next-btn-arrow {
    opacity: 1; }
  @media screen and (min-width: 1024px) {
    .in-view .case-next-btn-arrow {
      animation: case-next-btn-arrow 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0.3s; } }
  .case-next-btn-arrow::before, .case-next-btn-arrow::after {
    content: "";
    position: absolute;
    display: block; }
  .case-next-btn-arrow::before {
    top: 50%;
    left: 0;
    width: 56px;
    height: 1px;
    margin-top: -1px;
    background-color: #3a3a3a;
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1);
    transform-origin: right;
    transform: scaleX(1);
    backface-visibility: hidden; }
    .case-next-btn:hover .case-next-btn-arrow::before {
      background-color: #fff; }
    @media screen and (min-width: 1024px) {
      .case-next-btn:hover .case-next-btn-arrow::before {
        transform: scaleX(1.35); }
      .in-view .case-next-btn-arrow::before {
        animation: case-next-btn-arrow-line 0.7s cubic-bezier(0.19, 1, 0.22, 1) 0.3s; } }
  .case-next-btn-arrow::after {
    top: 50%;
    right: 1px;
    width: 13px;
    height: 13px;
    margin-top: -7px;
    border-right: 1px solid #3a3a3a;
    border-bottom: 1px solid #3a3a3a;
    transform: rotate(-45deg); }
    .case-next-btn:hover .case-next-btn-arrow::after {
      border-color: #fff; }

@keyframes case-next-btn-arrow {
  from {
    transform: translateX(-50px); }
  to {
    opacity: 1;
    transform: translateX(0); } }

@keyframes case-next-btn-arrow-line {
  from {
    transform: scaleX(4); }
  to {
    transform: scaleX(1); } }

.page-id-renault-integrity #nav-bar::before {
  background-color: #ffd200; }

#nav-latest-work-renault-integrity .nav-latest-work-btn::before {
  background-color: #ffd200; }

#home-latest-item-renault-integrity .home-latest-item-btn {
  background-color: #ffd200; }

#home-latest-item-renault-integrity .home-latest-item-desc {
  color: #cca800; }

#home-latest-item-renault-integrity .home-latest-item-cta-arrow {
  fill: #cca800; }

@media screen and (min-width: 1024px) {
  .page-id-renault-integrity .nav-pages-btn-label {
    opacity: .6; } }

@media screen and (min-width: 1024px) {
  .page-id-renault-integrity #nav-lang-current {
    color: #fff; } }

@media screen and (min-width: 1024px) {
  .page-id-renault-integrity #nav-lang-switch {
    color: #fcb419; } }

.page-id-renault-integrity #nav-lang-switch-txt::after {
  background-color: #fff; }

.case-next-btn-renault-integrity::before {
  background-color: #ffd200; }

#renault-integrity-page-header {
  background-color: #ffd200; }

#renault-integrity-page-header .page-header-cover {
  background-image: url("../img/cases/renault-integrity/header-mobile@2x.png"); }
  @media screen and (min-width: 1000px) {
    #renault-integrity-page-header .page-header-cover {
      background-image: url("../img/cases/renault-integrity/header.png"); } }
  @media only screen and (min-width: 1000px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min--moz-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-width: 1000px) and (min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min-resolution: 192dpi), only screen and (min-width: 1000px) and (min-resolution: 2dppx) {
    #renault-integrity-page-header .page-header-cover {
      background-image: url("../img/cases/renault-integrity/header@2x.png"); } }
  @media screen and (min-width: 1400px) {
    #renault-integrity-page-header .page-header-cover {
      background-image: url("../img/cases/renault-integrity/header@2x.png"); } }

#renault-integrity-page-header .page-header-title {
  color: #fff; }

#renault-integrity-page-header .scroll-down-btn {
  opacity: 1; }

#renault-integrity-page .section-title {
  color: #de9b0a; }

#renault-integrity-page .case-desc {
  color: #979797; }

#renault-integrity-page .case-desc a {
  color: #ffae00; }

#renault-integrity-project {
  display: flex;
  flex-direction: column-reverse;
  position: relative;
  background-color: #e9e5dd;
  overflow: hidden; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-project {
      display: block; } }
  @media screen and (min-width: 1600px) {
    #renault-integrity-project {
      min-height: 800px; } }

@media screen and (min-width: 1024px) {
  #renault-integrity-project-figure-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 55%;
    height: 100%; } }

#renault-integrity-project-figure {
  position: relative;
  width: 100%; }
  #renault-integrity-project-figure::after {
    content: "";
    display: block;
    width: 100%;
    padding-top: 91.1458333333%; }

#renault-integrity-project-figure-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto; }

.renault-integrity-project-figure-caption {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  font-size: 15px;
  line-height: 18px;
  text-align: center;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  color: #4a4a4a; }
  .in-view-active .renault-integrity-project-figure-caption {
    opacity: 0; }
  .in-view .renault-integrity-project-figure-caption {
    opacity: 1;
    transition: opacity .8s 1s; }
  @media screen and (min-width: 1024px) {
    .renault-integrity-project-figure-caption {
      font-size: 20px;
      line-height: 22px; } }

#renault-integrity-project-figure-caption-mission {
  top: 50%;
  left: 20.8%; }

#renault-integrity-project-figure-caption-objective {
  top: 45.4%;
  left: 75.6%; }
  .in-view #renault-integrity-project-figure-caption-objective {
    transition-delay: 1.4s; }

.renault-integrity-project-figure-caption-label {
  position: absolute;
  white-space: pre; }
  #renault-integrity-project-figure-caption-mission .renault-integrity-project-figure-caption-label {
    top: 80px;
    left: 0;
    transform: translateX(-50%);
    margin-left: 25px; }
  #renault-integrity-project-figure-caption-objective .renault-integrity-project-figure-caption-label {
    top: -115px; }

.renault-integrity-project-figure-caption-arrow {
  position: absolute;
  top: 0;
  left: 0; }
  #renault-integrity-project-figure-caption-mission .renault-integrity-project-figure-caption-arrow {
    transform: scaleY(-1) rotate(45deg); }
  #renault-integrity-project-figure-caption-objective .renault-integrity-project-figure-caption-arrow {
    top: -85px; }

#renault-integrity-project-text {
  padding: 35px 25px 30px; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-project-text {
      float: right;
      width: 45%;
      padding: 100px 120px 220px 4.6%; } }
  @media screen and (min-width: 1280px) {
    #renault-integrity-project-text {
      padding-right: 180px;
      padding-left: 130px; } }

#renault-integrity-ui-mission {
  display: none; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-ui-mission {
      display: block;
      position: relative; } }

#renault-integrity-ui-mission-img {
  position: absolute;
  top: 0;
  right: 120px;
  transform: translateY(-50%); }
  @media screen and (min-width: 1280px) {
    #renault-integrity-ui-mission-img {
      right: 180px; } }
  .in-view-active #renault-integrity-ui-mission-img {
    opacity: 0;
    transform: translateY(-50%) scale(0, 0); }
  .in-view #renault-integrity-ui-mission-img {
    opacity: 1;
    transform: translateY(-50%) scale(1, 1);
    transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.5s; }

#renault-integrity-role {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  overflow: hidden; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-role {
      display: block; } }

#renault-integrity-role-figure {
  position: relative;
  padding-bottom: 30px;
  margin-top: 80px; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-role-figure {
      float: left;
      max-width: 60%;
      margin-top: 130px; } }
  .in-view-active #renault-integrity-role-figure {
    opacity: 0;
    transform: translateY(80px); }
  #renault-integrity-role-figure.in-view {
    opacity: 1;
    transform: translateY(0);
    transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.5s; }

#renault-integrity-role-img {
  max-width: 100%;
  height: auto; }

#renault-integrity-role-captions {
  display: none; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-role-captions {
      display: block; } }

.renault-integrity-role-caption {
  position: absolute;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  font-size: 20px;
  line-height: 22px;
  color: #4a4a4a;
  z-index: 2; }
  .in-view-active .renault-integrity-role-caption {
    opacity: 0; }
  .in-view .renault-integrity-role-caption {
    opacity: 1;
    transition: opacity .5s .8s; }

#renault-integrity-role-caption-control {
  top: 12.9%;
  left: 24.2%; }

#renault-integrity-role-caption-waiting {
  top: 52.5%;
  left: 86.9%; }
  .in-view #renault-integrity-role-caption-waiting {
    transition-delay: 1.2s; }

#renault-integrity-role-caption-login {
  top: 79%;
  left: 50.9%; }
  .in-view #renault-integrity-role-caption-login {
    transition-delay: 1.6s; }

.renault-integrity-role-caption-label {
  position: absolute;
  white-space: nowrap;
  transform: translateX(-50%); }
  #renault-integrity-role-caption-control .renault-integrity-role-caption-label {
    left: -10px;
    bottom: 85px; }
  #renault-integrity-role-caption-waiting .renault-integrity-role-caption-label {
    top: 50px; }
  #renault-integrity-role-caption-login .renault-integrity-role-caption-label {
    top: 35px;
    left: 50px;
    transform: none; }

.renault-integrity-role-caption-arrow {
  position: absolute;
  fill: #666; }
  #renault-integrity-role-caption-control .renault-integrity-role-caption-arrow {
    left: -10px;
    bottom: -30px;
    width: 36px;
    transform: rotate(20deg); }
  #renault-integrity-role-caption-waiting .renault-integrity-role-caption-arrow {
    top: -25px;
    left: -150px;
    height: 66px;
    transform: rotate(140deg); }
  #renault-integrity-role-caption-login .renault-integrity-role-caption-arrow {
    top: -60px;
    left: -30px;
    width: 60px;
    transform: scaleX(-1) rotate(90deg); }

#renault-integrity-role-text {
  padding: 35px 25px 0; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-role-text {
      float: right;
      width: 40%;
      padding: 225px 120px 100px 60px; } }
  @media screen and (min-width: 1280px) {
    #renault-integrity-role-text {
      padding-right: 180px; } }

#renault-integrity-ui {
  padding: 50px 25px; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-ui {
      display: flex;
      align-items: center;
      padding: 100px 120px 0;
      font-size: 0;
      background: #ffd200 url("../img/cases/renault-integrity/ui-bg.jpg") no-repeat right top;
      background-size: auto 100%; } }
  @media screen and (min-width: 1280px) {
    #renault-integrity-ui {
      padding-right: 180px;
      padding-left: 180px; } }

@media screen and (min-width: 1024px) {
  #renault-integrity-ui-text {
    display: inline-block;
    width: 34%;
    padding-bottom: 125px;
    font-size: 14px;
    vertical-align: top; } }

#renault-integrity-ui-icons {
  display: none; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-ui-icons {
      display: inline-block;
      width: 66%;
      max-width: 700px;
      padding-left: 100px;
      padding-bottom: 50px;
      vertical-align: top; } }

.renault-integrity-ui-icon {
  position: relative;
  display: inline-block;
  width: 18.8%;
  margin: 0 0 8% 8%;
  line-height: 100px;
  text-align: center;
  border-radius: 100%;
  background-color: #3b3a3a;
  font-size: 0; }
  @media screen and (min-width: 1400px) {
    .renault-integrity-ui-icon {
      width: 100px;
      height: 100px;
      margin: 0 0 50px 50px;
      line-height: 110px; } }
  .renault-integrity-ui-icon:nth-child(4n+1) {
    margin-left: 0; }
  .in-view-active .renault-integrity-ui-icon {
    opacity: 0;
    transform: translateY(50px); }
  .in-view .renault-integrity-ui-icon {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.5s, transform 0.8s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view .renault-integrity-ui-icon:nth-child(1) {
    transition-delay: 0.65s; }
  .in-view .renault-integrity-ui-icon:nth-child(2) {
    transition-delay: 0.7s; }
  .in-view .renault-integrity-ui-icon:nth-child(3) {
    transition-delay: 0.75s; }
  .in-view .renault-integrity-ui-icon:nth-child(4) {
    transition-delay: 0.8s; }
  .in-view .renault-integrity-ui-icon:nth-child(5) {
    transition-delay: 0.85s; }
  .in-view .renault-integrity-ui-icon:nth-child(6) {
    transition-delay: 0.9s; }
  .in-view .renault-integrity-ui-icon:nth-child(7) {
    transition-delay: 0.95s; }
  .in-view .renault-integrity-ui-icon:nth-child(8) {
    transition-delay: 1s; }
  .renault-integrity-ui-icon::after {
    content: "";
    display: block;
    width: 100%;
    padding-bottom: 100%; }

.renault-integrity-ui-icon svg {
  position: absolute;
  top: 50%;
  left: 50%;
  height: auto;
  transform: translate(-50%, -50%);
  fill: #ffd200; }

#renault-integrity-ui-icon-battery svg {
  width: 21.8%; }

#renault-integrity-ui-icon-parking svg {
  width: 49%; }

#renault-integrity-ui-icon-flag svg {
  width: 30%; }

#renault-integrity-ui-icon-radar svg {
  width: 49%; }

#renault-integrity-ui-icon-car svg {
  width: 57%; }

#renault-integrity-ui-icon-hand svg {
  width: 28%; }

#renault-integrity-ui-icon-map svg {
  width: 49%; }

#renault-integrity-ui-icon-cross svg {
  width: 32%; }

#renault-integrity-partnership {
  display: flex;
  flex-direction: column-reverse;
  padding: 35px 25px 0;
  overflow: hidden;
  background-color: #e9e5dd; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-partnership {
      display: block;
      padding: 100px 120px 0;
      background-color: transparent; } }
  @media screen and (min-width: 1280px) {
    #renault-integrity-partnership {
      padding: 100px 180px 0; } }

#renault-integrity-partnership-figure-wrapper {
  padding-bottom: 50px;
  text-align: center; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-partnership-figure-wrapper {
      float: left;
      width: 66%;
      padding-right: 11%;
      padding-bottom: 70px; } }
  @media screen and (min-width: 1280px) {
    #renault-integrity-partnership-figure-wrapper {
      padding-right: 150px; } }

#renault-integrity-partnership-figure {
  display: inline-block;
  max-width: 100%;
  position: relative; }

#renault-integrity-partnership-figure-img {
  max-width: 100%; }

.renault-integrity-partnership-caption-txt {
  position: absolute;
  text-transform: uppercase; }

#renault-integrity-partnership-caption-exo,
#renault-integrity-partnership-caption-renault {
  font-size: 9px;
  line-height: 12px; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-partnership-caption-exo,
    #renault-integrity-partnership-caption-renault {
      font-size: 14px;
      line-height: 18px; } }

#renault-integrity-partnership-caption-exo {
  top: 57%;
  left: 2%;
  color: #69a8b8; }

#renault-integrity-partnership-caption-renault {
  top: 57%;
  right: 14.5%;
  color: #e7be00; }

#renault-integrity-partnership-caption-declare,
#renault-integrity-partnership-caption-drive,
#renault-integrity-partnership-caption-live {
  font-size: 9px;
  line-height: 11px;
  color: #000; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-partnership-caption-declare,
    #renault-integrity-partnership-caption-drive,
    #renault-integrity-partnership-caption-live {
      font-size: 10px;
      line-height: 12px; } }

#renault-integrity-partnership-caption-declare {
  bottom: 23.9%;
  left: 0; }

#renault-integrity-partnership-caption-drive {
  bottom: 23.9%;
  right: 10%;
  text-align: right; }

#renault-integrity-partnership-caption-live {
  bottom: 7.8%;
  left: 0; }

#renault-integrity-partnership-app-img {
  position: absolute;
  bottom: 60%;
  left: 0;
  width: 19.7%;
  height: auto; }

#renault-integrity-partnership-server-img {
  position: absolute;
  bottom: 60%;
  left: 42.6%;
  width: 13.1%;
  height: auto; }

#renault-integrity-partnership-car-img {
  position: absolute;
  bottom: 60%;
  right: 0;
  width: 27%;
  height: auto; }

.renault-integrity-partnership-subcaption {
  position: absolute;
  top: 0;
  text-align: center; }

#renault-integrity-partnership-app-caption {
  left: 0;
  width: 30.1%; }

#renault-integrity-partnership-server-caption {
  left: 30.1%;
  width: 37%; }

#renault-integrity-partnership-car-caption {
  right: 0;
  width: 32%; }

.renault-integrity-partnership-subcaption-title {
  padding-bottom: 10px;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  font-size: 16px;
  line-height: 22px;
  color: #4a4a4a; }
  @media screen and (min-width: 1024px) {
    .renault-integrity-partnership-subcaption-title {
      padding-bottom: 25px;
      font-size: 20px;
      line-height: 26px; } }
  .in-view-active .renault-integrity-partnership-subcaption-title {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view .renault-integrity-partnership-subcaption-title {
    opacity: 1;
    transform: translateY(0); }
  #renault-integrity-partnership-app .renault-integrity-partnership-subcaption-title {
    transition-delay: .8s; }
  #renault-integrity-partnership-server .renault-integrity-partnership-subcaption-title {
    transition-delay: 1.6s; }
  #renault-integrity-partnership-car .renault-integrity-partnership-subcaption-title {
    transition-delay: 2.2s; }

.renault-integrity-partnership-subcaption-subtitle {
  font-weight: 700;
  font-size: 9px;
  line-height: 13px;
  color: #8e8e8e; }
  @media screen and (min-width: 1024px) {
    .renault-integrity-partnership-subcaption-subtitle {
      font-size: 12px;
      line-height: 16px; } }
  .in-view-active .renault-integrity-partnership-subcaption-subtitle {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view .renault-integrity-partnership-subcaption-subtitle {
    opacity: 1;
    transform: translateY(0); }
  #renault-integrity-partnership-app .renault-integrity-partnership-subcaption-subtitle {
    transition-delay: 1s; }
  #renault-integrity-partnership-server .renault-integrity-partnership-subcaption-subtitle {
    transition-delay: 1.8s; }
  #renault-integrity-partnership-car .renault-integrity-partnership-subcaption-subtitle {
    transition-delay: 2.4s; }

.in-view-active .renault-integrity-partnership-img {
  opacity: 0;
  transform: scale(0, 0);
  transition: opacity 0.3s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }

.in-view .renault-integrity-partnership-img {
  opacity: 1;
  transform: scale(1, 1); }

#renault-integrity-partnership-app .renault-integrity-partnership-img {
  transition-delay: 1.2s; }

#renault-integrity-partnership-server .renault-integrity-partnership-img {
  transition-delay: 2s; }

#renault-integrity-partnership-car .renault-integrity-partnership-img {
  transition-delay: 2.6s; }

#renault-integrity-partnership-text {
  padding-bottom: 60px; }
  @media screen and (min-width: 1024px) {
    #renault-integrity-partnership-text {
      float: right;
      width: 34%;
      padding-bottom: 100px; } }

#renault-integrity-testimonial {
  text-align: left;
  background: #ffd200 url("../img/cases/renault-integrity/testimonial-bg.jpg") no-repeat right top;
  background-size: auto 100%; }

#renault-integrity-page .case-team-member-name {
  color: #de9b0a; }

#renault-integrity-page .case-team-member-role {
  color: #a6a6a6; }

#renault-integrity-page .case-team-member-body {
  color: #6b6b6b; }

.page-id-engie-digital-design #nav-bar::before {
  background-color: #38b3e4; }

#nav-latest-work-engie-digital-design .nav-latest-work-btn::before {
  background-color: #38b3e4; }

#home-latest-item-engie-digital-design .home-latest-item-btn {
  background-color: #38b3e4; }

#home-latest-item-engie-digital-design .home-latest-item-desc {
  color: #1679a0; }

#home-latest-item-engie-digital-design .home-latest-item-cta-arrow {
  fill: #1c9bcd; }

@media screen and (min-width: 1024px) {
  .page-id-engie-digital-design .nav-pages-btn-label {
    opacity: .6; } }

@media screen and (min-width: 1024px) {
  .page-id-engie-digital-design #nav-lang-current {
    color: #fff; } }

@media screen and (min-width: 1024px) {
  .page-id-engie-digital-design #nav-lang-switch {
    color: #135e7c; } }

.page-id-engie-digital-design #nav-lang-switch-txt::after {
  background-color: #fff; }

.case-next-btn-engie-digital-design::before {
  background-color: #38b3e4; }

#engie-digital-design-page-header {
  background-color: #38b3e4; }

#engie-digital-design-page-header .page-header-cover {
  background-image: url("../img/cases/engie-digital-design/header-mobile@2x.png"); }
  @media screen and (min-width: 1000px) {
    #engie-digital-design-page-header .page-header-cover {
      background-image: url("../img/cases/engie-digital-design/header.png"); } }
  @media only screen and (min-width: 1000px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min--moz-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-width: 1000px) and (min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min-resolution: 192dpi), only screen and (min-width: 1000px) and (min-resolution: 2dppx) {
    #engie-digital-design-page-header .page-header-cover {
      background-image: url("../img/cases/engie-digital-design/header@2x.png"); } }
  @media screen and (min-width: 1400px) {
    #engie-digital-design-page-header .page-header-cover {
      background-image: url("../img/cases/engie-digital-design/header@2x.png"); } }

#engie-digital-design-page .page-header-title {
  color: #fff; }

#engie-digital-design-page-header .scroll-down-btn {
  opacity: 1; }

#engie-digital-design-page .section-title {
  color: #33b2e4; }

#engie-digital-design-page .section-subtitle {
  color: #1b4678; }

#engie-digital-design-page .case-desc {
  color: #979797; }

#engie-digital-design-page .case-desc a {
  color: #365a86; }

#engie-digital-design-subject {
  display: flex;
  flex-direction: column-reverse;
  padding: 35px 25px 90px;
  overflow: hidden;
  background-color: #ebf5f9; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-subject {
      display: block;
      padding: 100px 120px 150px; } }
  @media screen and (min-width: 1280px) {
    #engie-digital-design-subject {
      padding-right: 180px;
      padding-left: 180px; } }

#engie-digital-design-subject-figure-wrapper {
  display: inline-block;
  text-align: center; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-subject-figure-wrapper {
      display: block;
      float: left;
      width: 66%;
      padding-right: 120px; } }

#engie-digital-design-subject-figure {
  display: inline-block;
  position: relative; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-subject-figure {
      display: block; } }

#engie-digital-design-subject-img {
  max-width: 100%;
  height: auto; }
  .in-view-active #engie-digital-design-subject-img {
    transform: scale(0.5, 0.5);
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view #engie-digital-design-subject-img {
    transform: scale(1, 1); }

.engie-digital-design-subject-figcaption {
  position: absolute;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  font-size: 20px;
  color: #4a4a4a; }
  .in-view-active .engie-digital-design-subject-figcaption {
    opacity: 0;
    transition: opacity 1s .5s; }
  .in-view .engie-digital-design-subject-figcaption {
    opacity: 1; }

#engie-digital-design-subject-figcaption-content {
  top: 34.9%;
  right: 65.8%; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-subject-figcaption-content {
      top: 23.3%;
      left: 40.8%; } }

#engie-digital-design-subject-figcaption-uses {
  top: 34.9%;
  left: 64%; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-subject-figcaption-uses {
      top: 25%;
      right: 40.5%; } }
  .in-view-active #engie-digital-design-subject-figcaption-uses {
    transition-delay: .7s; }

#engie-digital-design-subject-figcaption-id {
  top: 68%;
  left: 50.2%; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-subject-figcaption-id {
      top: 76%;
      left: 50.2%; } }
  .in-view-active #engie-digital-design-subject-figcaption-id {
    transition-delay: .9s; }

.engie-digital-design-subject-figcaption-txt {
  position: absolute;
  display: inline-block; }
  #engie-digital-design-subject-figcaption-content .engie-digital-design-subject-figcaption-txt {
    right: 0; }
    @media screen and (min-width: 1024px) {
      #engie-digital-design-subject-figcaption-content .engie-digital-design-subject-figcaption-txt {
        right: 125px;
        bottom: 75px; } }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-subject-figcaption-uses .engie-digital-design-subject-figcaption-txt {
      left: 135px;
      bottom: 85px; } }
  #engie-digital-design-subject-figcaption-id .engie-digital-design-subject-figcaption-txt {
    transform: translateX(-50%); }
    @media screen and (min-width: 1024px) {
      #engie-digital-design-subject-figcaption-id .engie-digital-design-subject-figcaption-txt {
        top: 95px;
        margin-left: -15px; } }

.engie-digital-design-subject-figcaption-arrow {
  display: none; }
  @media screen and (min-width: 1024px) {
    .engie-digital-design-subject-figcaption-arrow {
      position: absolute;
      display: block;
      fill: #474747; } }
  #engie-digital-design-subject-figcaption-content .engie-digital-design-subject-figcaption-arrow {
    bottom: -20px;
    right: 10px;
    width: 90px;
    height: 130px;
    transform: scaleX(-1) rotate(-90deg); }
  #engie-digital-design-subject-figcaption-uses .engie-digital-design-subject-figcaption-arrow {
    bottom: -20px;
    left: 10px;
    width: 100px;
    height: 140px;
    transform: rotate(-90deg); }
  #engie-digital-design-subject-figcaption-id .engie-digital-design-subject-figcaption-arrow {
    left: -30px;
    width: 45px;
    height: 90px;
    transform: rotate(170deg); }

#engie-digital-design-subject-text {
  padding-bottom: 100px; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-subject-text {
      float: right;
      width: 34%;
      padding-bottom: 0; } }

#engie-digital-design-project {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  overflow: hidden;
  background-color: #193f6d; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-project {
      display: block;
      padding: 100px 120px 150px; } }
  @media screen and (min-width: 1280px) {
    #engie-digital-design-project {
      min-height: 600px;
      padding-left: 180px;
      padding-right: 180px; } }

#engie-digital-design-project .section-subtitle {
  color: #fff !important; }

#engie-digital-design-project-text {
  padding: 35px 25px 60px; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-project-text {
      width: 34%;
      padding: 0; } }

#engie-digital-design-project-figure {
  height: auto;
  line-height: 0;
  text-align: right; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-project-figure {
      position: absolute;
      right: 0;
      bottom: 0;
      width: 81.4%;
      max-width: 1100px; } }

#engie-digital-design-project-img {
  max-width: 100%;
  height: auto; }
  .in-view-active #engie-digital-design-project-img {
    transform: translateY(100%);
    transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view #engie-digital-design-project-img.lazyloaded {
    transform: translateY(0); }

#engie-digital-design-print {
  padding-top: 50px;
  background-color: #ebf5f9; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-print {
      position: relative;
      padding-top: 90px;
      font-size: 0; } }

#engie-digital-design-print-figure-wrapper {
  display: none; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-print-figure-wrapper {
      position: relative;
      display: inline-block;
      width: 66%;
      padding-right: 100px;
      vertical-align: bottom; } }

#engie-digital-design-print-figure {
  line-height: 0; }

#engie-digital-design-print-img {
  max-width: 100%;
  height: auto; }
  .in-view-active #engie-digital-design-print-img {
    transform: translateX(-100%);
    transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view #engie-digital-design-print-img.lazyloaded {
    transform: translateY(0); }

#engie-digital-design-print-text {
  display: inline-block;
  padding: 50px 25px;
  font-size: 14px; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-print-text {
      width: 34%;
      padding: 50px 120px 150px 0; } }
  @media screen and (min-width: 1280px) {
    #engie-digital-design-print-text {
      padding-right: 180px; } }

#engie-digital-design-digital {
  padding-top: 35px;
  padding-bottom: 50px;
  overflow: hidden;
  background-color: #2fb0e0; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-digital {
      padding-top: 100px;
      font-size: 0; } }

#engie-digital-design-digital .section-title {
  color: #fff; }

#engie-digital-design-digital-text {
  padding: 0 25px;
  color: #fff; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-digital-text {
      display: inline-block;
      width: 34%;
      padding-left: 120px;
      padding-right: 0;
      vertical-align: top;
      font-size: 14px; } }
  @media screen and (min-width: 1280px) {
    #engie-digital-design-digital-text {
      padding-left: 180px; } }

#engie-digital-design-digital-devices-figure {
  display: none; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-digital-devices-figure {
      display: inline-block;
      width: 66%;
      padding-right: 100px;
      padding-left: 50px;
      vertical-align: top; } }

#engie-digital-design-digital-devices-img {
  max-width: 100%;
  height: auto; }
  .in-view-active #engie-digital-design-digital-devices-img {
    opacity: 0;
    transform: translateX(100%);
    transition: opacity 0.3s, transform 1s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view #engie-digital-design-digital-devices-img.lazyloaded {
    opacity: 1;
    transform: translateX(0); }

#engie-digital-design-digital-screens-figure {
  margin-top: 90px; }

#engie-digital-design-digital-screens-img {
  width: 100%;
  height: auto; }
  .in-view-active #engie-digital-design-digital-screens-img {
    opacity: 0;
    transform: translateY(100%);
    transition: opacity 0.3s, transform 1s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view #engie-digital-design-digital-screens-img.lazyloaded {
    opacity: 1;
    transform: translateY(0); }

#engie-digital-design-digital2 {
  display: none; }
  @media screen and (min-width: 1024px) {
    #engie-digital-design-digital2 {
      display: block;
      padding: 100px 120px 150px;
      overflow: hidden;
      font-size: 0;
      background-color: #ebf5f9; } }
  @media screen and (min-width: 1280px) {
    #engie-digital-design-digital2 {
      padding-right: 180px;
      padding-left: 180px; } }

#engie-digital-design-digital2-figure {
  display: inline-block;
  width: 66%;
  padding-right: 140px;
  vertical-align: top;
  text-align: right; }

#engie-digital-design-digital2-img {
  max-width: 100%;
  height: auto; }
  .in-view-active #engie-digital-design-digital2-img {
    opacity: 0;
    transform: translateX(-100%);
    transition: opacity 0.3s, transform 1s cubic-bezier(0.19, 1, 0.22, 1); }
  .in-view #engie-digital-design-digital2-img.lazyloaded {
    opacity: 1;
    transform: translateX(0); }

#engie-digital-design-digital2-text {
  display: inline-block;
  width: 34%;
  font-size: 14px;
  vertical-align: top; }

#engie-digital-design-testimonial {
  background: #0e3a66 url("../img/cases/engie-digital-design/testimonial.jpg") no-repeat right top;
  background-size: auto 100%; }

#engie-digital-design-testimonial .case-testimonial-body {
  color: #fff; }

#engie-digital-design-testimonial .case-testimonial-client {
  color: #a9a9a9; }

#engie-digital-design-team .case-team-text {
  background-color: #dbeef6; }

#engie-digital-design-team .case-team-subtitle {
  color: #4a4a4a; }

#engie-digital-design-team .case-team-member {
  border-color: #57bce3;
  background-color: #33b2e4; }

#engie-digital-design-team .case-team-member-name {
  color: #fff; }

#engie-digital-design-team .case-team-member-role {
  color: #0e3a66; }

#engie-digital-design-team .case-team-member-body {
  color: #cce3ed; }

/**
 * NAV
 */
.page-id-cic #nav-bar::before {
  background-color: #de3013; }

#nav-latest-work-cic .nav-latest-work-btn::before {
  background-color: #de3013; }

#home-latest-item-cic .home-latest-item-btn {
  background-color: #de3013; }

#home-latest-item-cic .home-latest-item-desc {
  color: #801c0b; }

#home-latest-item-cic .home-latest-item-cta-arrow {
  fill: #af260f; }

@media screen and (min-width: 1024px) {
  .page-id-cic .nav-pages-btn-label {
    opacity: .6; } }

@media screen and (min-width: 1024px) {
  .page-id-cic #nav-lang-current {
    color: #fff; } }

@media screen and (min-width: 1024px) {
  .page-id-cic #nav-lang-switch {
    color: #7e4d5b; } }

.page-id-cic #nav-lang-switch-txt::after {
  background-color: #fff; }

/**
 * NEXT PROJECT BUTTON
 */
.case-next-btn-cic::before {
  background-color: #de3013; }

/**
 * HEADER
 */
#cic-page-header {
  background-color: #de3013; }

#cic-page-header .page-header-cover {
  background-image: url("../img/cases/cic/header-mobile@2x.png"); }
  @media screen and (min-width: 1000px) {
    #cic-page-header .page-header-cover {
      background-image: url("../img/cases/cic/header.png"); } }
  @media only screen and (min-width: 1000px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min--moz-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-width: 1000px) and (min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min-resolution: 192dpi), only screen and (min-width: 1000px) and (min-resolution: 2dppx) {
    #cic-page-header .page-header-cover {
      background-image: url("../img/cases/cic/header@2x.png"); } }
  @media screen and (min-width: 1400px) {
    #cic-page-header .page-header-cover {
      background-image: url("../img/cases/cic/header@2x.png"); } }

#cic-page .page-header-title {
  color: #fff; }

#cic-page-header .scroll-down-btn {
  opacity: 1; }

#cic-page .section-title {
  color: #087e84; }

#cic-page .section-subtitle {
  color: #404040; }

#cic-page .case-desc {
  color: #979797; }

#cic-page .case-desc a {
  color: #007c82; }

/**
 * CONCEPT
 */
#cic-concept {
  font-size: 0;
  line-height: 0; }

#cic-concept-row {
  display: flex;
  flex-direction: column;
  width: 100%;
  background-color: #f3f3f3; }
  @media screen and (min-width: 1000px) {
    #cic-concept-row {
      flex-direction: row; } }

#cic-concept-text {
  display: inline-block;
  padding: 50px 25px;
  vertical-align: top;
  font-size: 14px;
  line-height: 30px; }
  @media screen and (min-width: 1000px) {
    #cic-concept-text {
      width: 50%; } }
  @media screen and (min-width: 1024px) {
    #cic-concept-text {
      padding: 70px 120px; } }
  @media screen and (min-width: 1280px) {
    #cic-concept-text {
      padding: 100px 180px; } }

#cic-concept-img-wrapper {
  order: -1; }
  @media screen and (min-width: 1000px) {
    #cic-concept-img-wrapper {
      order: 0;
      position: relative;
      display: inline-block;
      width: 50%;
      vertical-align: top;
      overflow: hidden; }
      #cic-concept-img-wrapper::before {
        content: "";
        display: block;
        width: 100%;
        padding-top: 93.7142857143%; } }

#cic-concept-img {
  width: 100%;
  height: auto; }
  @media screen and (min-width: 1000px) {
    #cic-concept-img {
      position: absolute;
      top: 0;
      left: 0; } }

@supports (object-fit: cover) {
  @media screen and (min-width: 1000px) {
    #cic-concept-img {
      object-fit: cover;
      height: 100%; } } }

#cic-concept-img2 {
  width: 100%;
  height: auto; }

/**
 * APPROACH
 */
#cic-approach {
  display: flex;
  flex-direction: column;
  font-size: 0; }
  @media screen and (min-width: 1024px) {
    #cic-approach {
      flex-direction: row; } }

#cic-approach-figure {
  display: none; }
  @media screen and (min-width: 480px) {
    #cic-approach-figure {
      display: inline-block;
      padding: 70px 40px;
      vertical-align: top;
      background-color: #de3013;
      font-size: 14px; } }
  @media screen and (min-width: 1024px) {
    #cic-approach-figure {
      width: 50%;
      padding: 120px 60px; } }

#cic-approach-steps-wrapper {
  position: relative; }

#cic-approach-arrow {
  position: absolute;
  top: 130px;
  right: -26px;
  bottom: 0;
  left: 0; }
  @media screen and (min-width: 1024px) {
    #cic-approach-arrow {
      top: 140px; } }
  .in-view-active #cic-approach-arrow {
    transform: translateX(-100%);
    opacity: 0;
    transition: transform 2s ease-out, opacity .3s; }
  .in-view #cic-approach-arrow {
    transform: translateX(0);
    opacity: 1; }
  #cic-approach-arrow::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    width: calc(100% - 26px);
    height: 2px;
    background-color: #fff; }
    .in-view-active #cic-approach-arrow::before {
      transform-origin: right top;
      transform: scaleX(0);
      transition: transform 2s  ease-out; }
    .in-view #cic-approach-arrow::before {
      transform: scaleX(1); }
  #cic-approach-arrow::after {
    content: "";
    position: absolute;
    top: -14px;
    right: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 0 15px 26px;
    border-color: transparent transparent transparent #fff; }

#cic-approach-steps {
  text-align: center;
  font-size: 0; }

.cic-approach-step {
  position: relative;
  display: inline-block;
  width: 25%;
  vertical-align: top; }
  .cic-approach-step::before {
    content: "";
    position: absolute;
    top: 100px;
    left: 0;
    width: 1px;
    height: 80px;
    background-color: #e37e6d; }
  .cic-approach-step:first-child::before {
    content: none; }

.cic-approach-step-num {
  font-weight: bold;
  font-size: 60px;
  line-height: 100px;
  color: #901e0b; }
  .in-view-active .cic-approach-step-num {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.2s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .cic-approach-step:nth-child(2) .cic-approach-step-num {
    transition-delay: .5s; }
  .cic-approach-step:nth-child(3) .cic-approach-step-num {
    transition-delay: 1s; }
  .cic-approach-step:nth-child(4) .cic-approach-step-num {
    transition-delay: 1.5s; }
  .in-view .cic-approach-step-num {
    opacity: 1;
    transform: translateY(0); }

.cic-approach-step-title {
  color: #fff;
  font-size: 15px;
  line-height: 15px;
  padding-bottom: 15px;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif; }
  @media screen and (min-width: 1000px) {
    .cic-approach-step-title {
      font-size: 18px;
      line-height: 18px; } }
  @media screen and (min-width: 1280px) {
    .cic-approach-step-title {
      font-size: 24px;
      line-height: 24px; } }
  .in-view-active .cic-approach-step-title {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.2s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .cic-approach-step:nth-child(1) .cic-approach-step-title {
    transition-delay: .1s; }
  .cic-approach-step:nth-child(2) .cic-approach-step-title {
    transition-delay: .6s; }
  .cic-approach-step:nth-child(3) .cic-approach-step-title {
    transition-delay: 1.1s; }
  .cic-approach-step:nth-child(4) .cic-approach-step-title {
    transition-delay: 1.6s; }
  .in-view .cic-approach-step-title {
    opacity: 1;
    transform: translateY(0); }

.cic-approach-step-objectives {
  padding-top: 15px;
  padding-bottom: 20px;
  color: #901e0b;
  font-size: 10px;
  line-height: 15px;
  font-weight: bold; }
  @media screen and (min-width: 1000px) {
    .cic-approach-step-objectives {
      font-size: 12px;
      line-height: 18px; } }
  .in-view-active .cic-approach-step-objectives {
    opacity: 0;
    transform: translateY(-20px);
    transition: opacity 0.2s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .cic-approach-step:nth-child(1) .cic-approach-step-objectives {
    transition-delay: .2s; }
  .cic-approach-step:nth-child(2) .cic-approach-step-objectives {
    transition-delay: .7s; }
  .cic-approach-step:nth-child(3) .cic-approach-step-objectives {
    transition-delay: 1.2s; }
  .cic-approach-step:nth-child(4) .cic-approach-step-objectives {
    transition-delay: 1.7s; }
  .in-view .cic-approach-step-objectives {
    opacity: 1;
    transform: translateY(0); }

.cic-approach-step-responses {
  position: relative;
  padding-top: 40px;
  color: #901e0b;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  font-size: 14px;
  line-height: 24px; }
  @media screen and (min-width: 1000px) {
    .cic-approach-step-responses {
      font-size: 18px;
      line-height: 30px; } }
  .in-view-active .cic-approach-step-responses {
    opacity: 0;
    transform: translateY(-20px);
    transition: opacity 0.2s, transform 0.7s cubic-bezier(0.19, 1, 0.22, 1); }
  .cic-approach-step:nth-child(1) .cic-approach-step-responses {
    transition-delay: .3s; }
  .cic-approach-step:nth-child(2) .cic-approach-step-responses {
    transition-delay: .8s; }
  .cic-approach-step:nth-child(3) .cic-approach-step-responses {
    transition-delay: 1.3s; }
  .cic-approach-step:nth-child(4) .cic-approach-step-responses {
    transition-delay: 1.8s; }
  .in-view .cic-approach-step-responses {
    opacity: 1;
    transform: translateY(0); }
  .cic-approach-step-responses::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    border-style: solid;
    border-width: 0 0 4px 4px;
    border-color: transparent transparent #e86f5a #e86f5a;
    transform: rotate(-45deg); }

#cic-approach-text {
  order: -1;
  display: inline-block;
  padding: 50px 25px;
  vertical-align: top;
  font-size: 14px; }
  @media screen and (min-width: 1024px) {
    #cic-approach-text {
      order: 0;
      width: 50%;
      padding: 70px 120px; } }
  @media screen and (min-width: 1280px) {
    #cic-approach-text {
      padding: 100px 180px; } }

/**
 * USER EXPERIENCE
 */
#cic-ux {
  display: none; }
  @media screen and (min-width: 1000px) {
    #cic-ux {
      display: block;
      padding: 50px 25px;
      overflow: hidden;
      background-color: #f3f3f3; } }
  @media screen and (min-width: 1024px) {
    #cic-ux {
      padding: 70px 120px; } }
  @media screen and (min-width: 1280px) {
    #cic-ux {
      padding: 100px 180px; } }

@media screen and (min-width: 1000px) {
  #cic-ux-figure {
    display: inline-block;
    position: relative;
    padding-left: 5%; } }

.in-view-active #cic-ux-figure {
  opacity: 0;
  transition: opacity 1s; }

#cic-ux-figure.in-view {
  opacity: 1; }

#cic-ux-img {
  width: 100%;
  height: auto; }

.cic-ux-device {
  position: absolute;
  left: 0;
  width: 27%;
  max-width: 400px;
  padding: 0 2%; }

#cic-ux-bell {
  top: 19%;
  left: 17%; }

#cic-ux-tweets-wall {
  top: 19%;
  left: 47%; }

#cic-ux-paper-board {
  top: 19%;
  left: 77%; }

#cic-ux-store-front {
  top: 70%;
  left: 17%; }

#cic-ux-letters-wall {
  top: 70%;
  left: 47%; }

#cic-ux-data-connect {
  top: 70%;
  left: 77%; }

.cic-ux-device-name {
  padding-bottom: 2px;
  font-size: 18px;
  line-height: 22px;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif; }
  @media screen and (min-width: 1280px) {
    .cic-ux-device-name {
      padding-bottom: 6px;
      font-size: 24px;
      line-height: 30px; } }
  .in-view-active .cic-ux-device-name {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.3s, transform 0.6s cubic-bezier(0.19, 1, 0.22, 1); }
  .cic-ux-device.in-view .cic-ux-device-name {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .1s; }
  .cic-ux-device:nth-child(3n+2).in-view .cic-ux-device-name {
    transition-delay: .2s; }
  .cic-ux-device:nth-child(3n+3).in-view .cic-ux-device-name {
    transition-delay: .3s; }

.cic-ux-device-desc {
  font-size: 10px;
  line-height: 14px; }
  @media screen and (min-width: 1280px) {
    .cic-ux-device-desc {
      font-size: 12px;
      line-height: 18px; } }
  .in-view-active .cic-ux-device-desc {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.3s, transform 0.6s cubic-bezier(0.19, 1, 0.22, 1); }
  .cic-ux-device.in-view .cic-ux-device-desc {
    opacity: 1;
    transform: translateY(0);
    transition-delay: .2s; }
  .cic-ux-device:nth-child(3n+2).in-view .cic-ux-device-desc {
    transition-delay: .3s; }
  .cic-ux-device:nth-child(3n+3).in-view .cic-ux-device-desc {
    transition-delay: .4s; }

.cic-ux-plan-info {
  position: absolute;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  font-size: 15px;
  line-height: 18px;
  color: #9b9b9b; }
  @media screen and (min-width: 1280px) {
    .cic-ux-plan-info {
      font-size: 18px;
      line-height: 20px; } }

#cic-ux-plan-info-store-front {
  top: 65%;
  right: 81%;
  transform: translate(-50%, -50%); }

#cic-ux-plan-info-social {
  top: 43%;
  right: 58%; }

#cic-ux-plan-info-meeting {
  top: 45%;
  right: 28%;
  transform: translate(-50%, -50%); }

#cic-ux-plan-info-tangible {
  top: 43.5%;
  right: 14%;
  transform: translate(-50%, -50%); }

#cic-ux-client-1,
#cic-ux-client-2 {
  position: absolute;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  font-size: 18px;
  transform: translate(-50%, -50%); }
  @media screen and (min-width: 1280px) {
    #cic-ux-client-1,
    #cic-ux-client-2 {
      font-size: 24px; } }

#cic-ux-client-1 {
  color: #b0240d;
  top: 59.5%;
  right: 88%; }

#cic-ux-client-2 {
  color: #2768be;
  top: 48%;
  right: 81%; }

/**
 * TECHNOLOGICAL APPROACH
 */
#cic-tech-approach {
  display: flex;
  flex-direction: column;
  background-color: #fff;
  font-size: 0;
  line-height: 0; }
  @media screen and (min-width: 1000px) {
    #cic-tech-approach {
      flex-direction: row; } }

#cic-tech-approach-text {
  width: 100%;
  padding: 50px 25px;
  font-size: 14px;
  line-height: 30px; }
  @media screen and (min-width: 1000px) {
    #cic-tech-approach-text {
      display: inline-block;
      width: 50%;
      vertical-align: top; } }
  @media screen and (min-width: 1024px) {
    #cic-tech-approach-text {
      padding: 70px 120px; } }
  @media screen and (min-width: 1280px) {
    #cic-tech-approach-text {
      padding: 100px 180px; } }

#cic-tech-approach-img-wrapper {
  order: -1;
  width: 100%;
  height: auto;
  vertical-align: top; }
  @media screen and (min-width: 1000px) {
    #cic-tech-approach-img-wrapper {
      order: 0;
      position: relative;
      display: inline-block;
      width: 50%; }
      #cic-tech-approach-img-wrapper::before {
        content: "";
        display: block;
        width: 100%;
        padding-top: 85.7142857143%; } }

#cic-tech-approach-img {
  width: 100%;
  height: auto; }
  @media screen and (min-width: 1000px) {
    #cic-tech-approach-img {
      position: absolute;
      top: 0;
      left: 0; } }

@supports (object-fit: cover) {
  @media screen and (min-width: 1000px) {
    #cic-tech-approach-img {
      object-fit: cover;
      height: 100%; } } }

/**
 * PHYSICAL APPROACH
 */
#cic-physical-approach {
  display: flex;
  flex-direction: column;
  background-color: #de3013;
  font-size: 0;
  line-height: 0; }
  @media screen and (min-width: 1000px) {
    #cic-physical-approach {
      flex-direction: row; } }

#cic-physical-approach-img-wrapper {
  width: 100%;
  height: auto;
  vertical-align: top; }
  @media screen and (min-width: 1000px) {
    #cic-physical-approach-img-wrapper {
      position: relative;
      display: inline-block;
      width: 50%; }
      #cic-physical-approach-img-wrapper::before {
        content: "";
        display: block;
        width: 100%;
        padding-top: 85.7142857143%; } }

#cic-physical-approach-img {
  width: 100%;
  height: auto; }
  @media screen and (min-width: 1000px) {
    #cic-physical-approach-img {
      position: absolute;
      top: 0;
      left: 0; } }

@supports (object-fit: cover) {
  @media screen and (min-width: 1000px) {
    #cic-physical-approach-img {
      object-fit: cover;
      height: 100%; } } }

#cic-physical-approach-text {
  padding: 50px 25px;
  font-size: 14px;
  line-height: 30px; }
  @media screen and (min-width: 1000px) {
    #cic-physical-approach-text {
      display: inline-block;
      width: 50%;
      vertical-align: top; } }
  @media screen and (min-width: 1024px) {
    #cic-physical-approach-text {
      padding: 70px 120px; } }
  @media screen and (min-width: 1280px) {
    #cic-physical-approach-text {
      padding: 100px 180px; } }

#cic-physical-approach-text .section-title,
#cic-physical-approach-text .section-subtitle {
  color: #fff; }

#cic-physical-approach-text .section-body {
  color: #7d1a09; }

/**
 * TEAM
 */
#cic-page .case-team-text {
  background-color: #f3f3f3; }

#cic-page .case-team-members {
  background-color: #404040; }

#cic-page .case-team-member-name {
  color: #fff; }

#cic-page .case-team-member-role {
  color: #a4a4a4; }

#cic-page .case-team-member-body {
  color: #7e7e7e; }

.page-id-shopping-robot #nav-bar::before {
  background-color: #39b2b7; }

#nav-latest-work-shopping-robot .nav-latest-work-btn::before {
  background-color: #39b2b7; }

#home-latest-item-shopping-robot .home-latest-item-btn {
  background-color: #39b2b7; }

#home-latest-item-shopping-robot .home-latest-item-desc {
  color: #2d8c90; }

#home-latest-item-shopping-robot .home-latest-item-cta-arrow {
  fill: #2d8c90; }

@media screen and (min-width: 1024px) {
  .page-id-shopping-robot .nav-pages-btn-label {
    opacity: .6; } }

@media screen and (min-width: 1024px) {
  .page-id-shopping-robot #nav-lang-current {
    color: #fff; } }

@media screen and (min-width: 1024px) {
  .page-id-shopping-robot #nav-lang-switch {
    color: #27797d; } }

.page-id-shopping-robot #nav-lang-switch-txt::after {
  background-color: #fff; }

.case-next-btn-shopping-robot::before {
  background-color: #39b2b7; }

#shopping-robot-page-header {
  background-color: #39b2b7; }

#shopping-robot-page-header .page-header-cover {
  background-image: url("../img/cases/shopping-robot/header-mobile@2x.png"); }
  @media screen and (min-width: 1000px) {
    #shopping-robot-page-header .page-header-cover {
      background-image: url("../img/cases/shopping-robot/header.png"); } }
  @media only screen and (min-width: 1000px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min--moz-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-width: 1000px) and (min-device-pixel-ratio: 2), only screen and (min-width: 1000px) and (min-resolution: 192dpi), only screen and (min-width: 1000px) and (min-resolution: 2dppx) {
    #shopping-robot-page-header .page-header-cover {
      background-image: url("../img/cases/shopping-robot/header@2x.png"); } }
  @media screen and (min-width: 1400px) {
    #shopping-robot-page-header .page-header-cover {
      background-image: url("../img/cases/shopping-robot/header@2x.png"); } }

#shopping-robot-page-header .page-header-title {
  color: #fff; }

#shopping-robot-page-header .scroll-down-btn {
  opacity: 1; }

#shopping-robot-page .section-title {
  color: #a50d51; }

#shopping-robot-page .case-desc {
  color: #979797;
  background-color: #fbfaf8; }

#shopping-robot-page .case-desc a {
  color: #861347; }

#shopping-robot-strategy {
  padding: 50px 25px; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-strategy {
      display: flex;
      align-items: center;
      padding: 0 120px;
      font-size: 0; } }

@media screen and (min-width: 1024px) {
  #shopping-robot-strategy-text {
    display: inline-block;
    width: 34%;
    padding: 100px 0 150px;
    vertical-align: top;
    font-size: 14px; } }

#shopping-robot-strategy-figure-wrapper {
  display: none; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-strategy-figure-wrapper {
      display: inline-block;
      width: 66%;
      padding: 50px 0 50px 120px;
      vertical-align: top;
      text-align: center; } }

#shopping-robot-strategy-figure {
  position: relative;
  display: inline-block;
  max-width: 100%;
  line-height: 0; }

#shopping-robot-strategy-img {
  max-width: 100%;
  height: auto; }
  .in-view-active #shopping-robot-strategy-img {
    opacity: 0;
    transform: scale(0.8, 0.8);
    transition: transform 0.7s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.3s; }
  .in-view #shopping-robot-strategy-img {
    opacity: 1;
    transform: scale(1, 1); }

#shopping-robot-strategy-caption-service,
#shopping-robot-strategy-caption-data {
  position: absolute;
  top: 50%;
  margin-top: -10px;
  font-size: 20px;
  line-height: 20px;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif; }
  .in-view-active #shopping-robot-strategy-caption-service, .in-view-active
  #shopping-robot-strategy-caption-data {
    opacity: 0;
    transition: opacity .6s .2s; }
  .in-view #shopping-robot-strategy-caption-service, .in-view
  #shopping-robot-strategy-caption-data {
    opacity: 1; }

#shopping-robot-strategy-caption-service {
  right: 100%;
  margin-right: 10px;
  color: #27a5aa; }

#shopping-robot-strategy-caption-data {
  left: 100%;
  margin-left: 10px;
  color: #861347; }
  .in-view-active #shopping-robot-strategy-caption-data {
    transition-delay: .4s; }

.shopping-robot-strategy-caption-level {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 14px;
  line-height: 16px;
  text-align: center; }
  .in-view-active .shopping-robot-strategy-caption-level {
    opacity: 0;
    transition: opacity .6s .4s; }
  .in-view .shopping-robot-strategy-caption-level {
    opacity: 1; }

#shopping-robot-strategy-caption-level-1 {
  top: 5.5%; }

#shopping-robot-strategy-caption-level-2 {
  top: 17.5%; }
  .in-view-active #shopping-robot-strategy-caption-level-2 {
    transition-delay: .6s; }

#shopping-robot-strategy-caption-level-3 {
  top: 29.5%; }
  .in-view-active #shopping-robot-strategy-caption-level-3 {
    transition-delay: .8s; }

.shopping-robot-strategy-caption-level-title {
  color: #4a4a4a; }

.shopping-robot-strategy-caption-level-subtitle {
  font-style: italic;
  color: #b09e82; }

#shopping-robot-project {
  display: flex;
  flex-direction: column-reverse;
  font-size: 0; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-project {
      display: block;
      padding: 0 120px 0 50px;
      background-color: #861347;
      background-size: cover;
      background-repeat: no-repeat;
      background-position: left bottom;
      background-image: url("../img/cases/shopping-robot/project-bg.png"); } }
  @media only screen and (min-width: 1024px) and (-webkit-min-device-pixel-ratio: 2), only screen and (min-width: 1024px) and (min--moz-device-pixel-ratio: 2), only screen and (min-width: 1024px) and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-width: 1024px) and (min-device-pixel-ratio: 2), only screen and (min-width: 1024px) and (min-resolution: 192dpi), only screen and (min-width: 1024px) and (min-resolution: 2dppx) {
    #shopping-robot-project {
      background-image: url("../img/cases/shopping-robot/project-bg@2x.png"); } }

#shopping-robot-project-text {
  padding: 35px 25px 0;
  font-size: 14px; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-project-text {
      display: inline-block;
      width: 34%;
      padding-top: 100px;
      padding-bottom: 90px;
      padding-left: 50px;
      vertical-align: top;
      color: #fff; } }

@media screen and (min-width: 1024px) {
  #shopping-robot-project .section-title {
    color: #d15d92; } }

@media screen and (min-width: 1024px) {
  #shopping-robot-project .section-subtitle {
    color: #fff; } }

#shopping-robot-project-figure-wrapper {
  padding-top: 50px; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-project-figure-wrapper {
      display: inline-block;
      width: 66%;
      padding-right: 80px;
      vertical-align: bottom; } }

#shopping-robot-project-figure {
  position: relative;
  line-height: 0; }
  .in-view-active #shopping-robot-project-figure {
    opacity: 0;
    transform: translateX(-100px);
    transition: opacity 0.4s, transform 0.8s cubic-bezier(0.19, 1, 0.22, 1); }
  #shopping-robot-project-figure.in-view {
    transform: translateX(0);
    opacity: 1; }

#shopping-robot-project-img {
  width: 100%;
  height: auto; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-project-img {
      max-width: 100%;
      width: auto; } }

#shopping-robot-project-caption {
  position: absolute;
  top: 86%;
  left: 46%;
  font-family: "ff-market-web", "Market OT", "Lora", "Georgia", serif;
  font-size: 14px;
  color: #fff; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-project-caption {
      font-size: 20px; } }

#shopping-robot-partnership {
  padding: 35px 25px; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-partnership {
      padding: 100px 120px;
      font-size: 0; } }

#shopping-robot-partnership-text {
  padding-bottom: 55px; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-partnership-text {
      display: inline-block;
      width: 34%;
      padding-bottom: 0;
      vertical-align: top;
      font-size: 14px; } }

#shopping-robot-partnership-figure-wrapper {
  padding: 0 25px 25px;
  text-align: center; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-partnership-figure-wrapper {
      display: inline-block;
      width: 66%;
      padding: 0 0 0 150px;
      vertical-align: top; } }

#shopping-robot-partnership-figure {
  position: relative;
  display: inline-block;
  line-height: 0; }

#shopping-robot-partnership-img {
  max-width: 100%;
  height: auto; }

#shopping-robot-partnership-caption-shop,
#shopping-robot-partnership-caption-customer {
  position: absolute;
  left: 50%;
  display: inline-block;
  margin-top: -15px;
  transform: translateX(-50%);
  font-size: 14px;
  line-height: 14px;
  color: #4a4a4a;
  font-family: "Lora", "Georgia", serif;
  font-style: italic; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-partnership-caption-shop,
    #shopping-robot-partnership-caption-customer {
      margin-top: -18px;
      font-size: 15px;
      line-height: 15px; } }

#shopping-robot-partnership-caption-shop {
  top: 25.5%; }

#shopping-robot-partnership-caption-customer {
  top: 83.5%; }

#shopping-robot-partnership-captions-shop li,
#shopping-robot-partnership-captions-customer li {
  position: absolute;
  font-size: 11px;
  line-height: 11px;
  color: #4a4a4a;
  transform: translateX(-50%);
  white-space: nowrap; }
  @media screen and (min-width: 1024px) {
    #shopping-robot-partnership-captions-shop li,
    #shopping-robot-partnership-captions-customer li {
      font-size: 12px;
      line-height: 12px; } }
  #shopping-robot-partnership-captions-shop li:nth-child(1),
  #shopping-robot-partnership-captions-customer li:nth-child(1) {
    left: 4.7%; }
  #shopping-robot-partnership-captions-shop li:nth-child(2),
  #shopping-robot-partnership-captions-customer li:nth-child(2) {
    left: 35.5%; }
  #shopping-robot-partnership-captions-shop li:nth-child(3),
  #shopping-robot-partnership-captions-customer li:nth-child(3) {
    left: 64%; }
  #shopping-robot-partnership-captions-shop li:nth-child(4),
  #shopping-robot-partnership-captions-customer li:nth-child(4) {
    left: 94.1%; }

#shopping-robot-partnership-captions-shop li {
  top: 9%; }

#shopping-robot-partnership-captions-customer li {
  bottom: -5%; }

#shopping-robot-team .case-team-text {
  background-color: #f3f0eb; }

#shopping-robot-team .case-team-member {
  border-color: #9a3d65;
  background-color: #861347; }

#shopping-robot-team .case-team-member-name {
  color: #fff; }

#shopping-robot-team .case-team-member-role {
  color: #e9e5dd; }

#shopping-robot-team .case-team-member-body {
  color: #c09aab; }



.mac_categoria_title_blue {
      font-size: 73px !important;}