/* mixin & settings */
@import url("https://use.typekit.net/qpi2mfn.css");
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-text-size-adjust: none;
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
  -ms-content-zooming: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

html,
body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  overflow: hidden;
  font-family: 'myriad-pro', sans-serif;
  font-size: 16px;
  background-color: #fff; }

.container_wrapper {
  background: #fff;
  box-sizing: border-box;
  resize: horizontal;
  width: 100%;
  height: 100%;
  max-width: calc(100vh / 9 * 16);
  max-height: calc(100vw / 16 * 9);
  margin: auto;
  position: relative;
  top: 50%;
  transform: translateY(-50%); }

#container {
  width: 100%;
  height: 100%;
  overflow: hidden; }

.font-size-0 {
  color: #4c4c4c;
  line-height: 1.2;
  font-size: 55%; }

.font-size-1 {
  color: #4c4c4c;
  line-height: 1.2;
  font-size: 88%; }

.uk .font-size-1,
.sr .font-size-1,
.ru .font-size-1,
.mk .font-size-1,
.el .font-size-1,
.bg .font-size-1 {
  font-size: 79%; }

.font-size-2 {
  line-height: 1.25;
  letter-spacing: 0.04em;
  font-size: 100%;
  color: #4c4c4c; }

.uk .font-size-2,
.sr .font-size-2,
.ru .font-size-2,
.mk .font-size-2,
.el .font-size-2,
.bg .font-size-2 {
  font-size: 90%; }

.font-size-3, .disc-text span {
  line-height: 1.2;
  letter-spacing: 0.05em;
  font-size: 120%;
  color: #4c4c4c; }

.uk .font-size-3, .uk .disc-text span, .disc-text .uk span,
.sr .font-size-3,
.sr .disc-text span,
.disc-text .sr span,
.ru .font-size-3,
.ru .disc-text span,
.disc-text .ru span,
.mk .font-size-3,
.mk .disc-text span,
.disc-text .mk span,
.el .font-size-3,
.el .disc-text span,
.disc-text .el span,
.bg .font-size-3,
.bg .disc-text span,
.disc-text .bg span {
  font-size: 110%; }

.font-size-4 {
  line-height: 1.2;
  letter-spacing: 0.1em;
  font-size: 150%;
  color: #4c4c4c; }

.uk .font-size-4,
.sr .font-size-4,
.ru .font-size-4,
.mk .font-size-4,
.el .font-size-4,
.bg .font-size-4 {
  font-size: 140%; }

#scene {
  width: 100%;
  height: 100%;
  position: relative; }

.btn-select {
  display: block;
  color: #fff;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  padding-top: 0.3em;
  padding-left: 2em;
  padding-right: 2em;
  padding-bottom: 0.3em;
  width: auto;
  letter-spacing: 0.1em;
  background-color: #ed8945;
  border: 0.15em solid #fff;
  border-radius: 1000px;
  box-shadow: inset 2px 2px 4px 3px rgba(0, 0, 0, 0.2);
  z-index: 100;
  position: relative; }
  .btn-select::after {
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: block;
    position: absolute; }

.btn-select-round {
  display: block;
  width: 100%;
  height: 100%;
  background-color: #ed8945;
  border: 0.15em solid #fff;
  border-radius: 50%;
  box-shadow: inset 2px 2px 4px 3px rgba(0, 0, 0, 0.2); }

.btn-next {
  cursor: pointer;
  display: block;
  font-weight: 600;
  color: #4c4c4c;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  padding-top: 0.3em;
  padding-left: 2em;
  padding-right: 2em;
  padding-bottom: 0.3em;
  width: auto;
  letter-spacing: 0.1em;
  background-color: #fff;
  border-width: 0.15em;
  border-style: solid;
  border-radius: 1000px;
  position: relative;
  z-index: 100;
  transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out; }
  .btn-next:hover {
    color: #fff; }

.btn-arrow {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top left;
  width: 3em;
  height: 3em;
  display: block;
  margin: auto; }

.btn-number {
  color: #4c4c4c;
  text-decoration: none;
  margin-bottom: 1.2em;
  display: block;
  display: none;
  position: relative;
  counter-increment: section;
  z-index: 100;
  transition: all 0.3s ease-in-out; }
  .btn-number:before {
    border-radius: 50%;
    content: counter(section);
    display: block;
    position: absolute;
    top: -0.3em;
    left: -2.5em;
    border-width: 0.15em;
    border-style: solid;
    background-color: #fff;
    width: 1.5em;
    height: 1.5em;
    line-height: 1.5em;
    text-align: center;
    color: #4c4c4c;
    font-weight: 700; }
  .btn-number:hover::before {
    color: #fff;
    border-color: #fff; }

.rtl .btn-number:before {
  left: inherit;
  right: -2.5em; }

.btn-container {
  position: absolute;
  bottom: 5%;
  z-index: 10;
  right: 3%; }

.h-flip, .flow-emp.emp-7b.role-emp-alfonso .background-role {
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH"; }

.h-flip-reverse, .flow-wor.wor-7b.role-emp-fisher .background-role-emp {
  -moz-transform: scaleX(1);
  -o-transform: scaleX(1);
  -webkit-transform: scaleX(1);
  transform: scaleX(1); }

.disc-text {
  display: block;
  width: 15em;
  height: 15em;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  border-radius: 50%;
  position: absolute; }
  .disc-text span {
    color: #fff;
    text-transform: uppercase;
    position: absolute;
    padding-left: 1em;
    padding-right: 1em;
    width: 100%;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    border-radius: 50%;
    display: block;
    font-weight: 700;
    line-height: 1.2; }

.transition {
  display: none; }

.load-animation {
  display: none; }

.disc-next {
  display: none; }

.error {
  text-align: center; }
  .error h1 {
    font-size: 150%;
    color: #ed8945;
    font-weight: 600;
    margin-top: 6em;
    margin-bottom: 1em; }
  .error p {
    color: #4c4c4c;
    opacity: 0.5; }

/*scenes*/
.start-0#container,
.start-1#container,
.start-2#container {
  border: 0.4em solid #ed8945 !important; }
.start-0 #scene,
.start-1 #scene,
.start-2 #scene {
  background-color: rgba(237, 137, 69, 0.2); }
.start-0 .select-container,
.start-1 .select-container,
.start-2 .select-container {
  position: absolute;
  bottom: 8%;
  left: 50%;
  transform: translateX(-50%);
  width: auto; }
  .start-0 .select-container .btn-select,
  .start-1 .select-container .btn-select,
  .start-2 .select-container .btn-select {
    font-size: 120%;
    padding-left: 1em;
    padding-right: 1em; }
.start-0 .logo-container,
.start-1 .logo-container,
.start-2 .logo-container {
  position: absolute;
  top: 1em;
  left: 2em;
  height: 3em;
  width: 14em;
  direction: ltr; }
.start-0 .logo-ela,
.start-1 .logo-ela,
.start-2 .logo-ela {
  background-image: url(../images/ela_logo_color.svg);
  background-repeat: no-repeat;
  background-position: top left;
  background-size: contain;
  position: absolute;
  height: 1.75em;
  width: 50%;
  bottom: 0; }
.start-0 .logo-eu,
.start-1 .logo-eu,
.start-2 .logo-eu {
  background-image: url(../images/logo-european-commission.svg);
  background-repeat: no-repeat;
  background-position: top left;
  background-size: contain;
  position: absolute;
  left: 43%;
  height: 2.5em;
  width: 100%;
  bottom: 0.20em; }
.start-0 .hashtag,
.start-1 .hashtag,
.start-2 .hashtag {
  font-weight: 700;
  position: absolute;
  bottom: 1em;
  right: 1em;
  letter-spacing: inherit; }
.start-0 .perso-container,
.start-1 .perso-container,
.start-2 .perso-container {
  display: block;
  top: 21%;
  width: 100%;
  position: absolute; }
.start-0 .circle-perso,
.start-1 .circle-perso,
.start-2 .circle-perso {
  display: block;
  width: 12em;
  height: 12em;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: cover; }
.start-0 .perso-hanna,
.start-1 .perso-hanna,
.start-2 .perso-hanna {
  background-color: #82b0de;
  transform: translateX(-175%);
  background-image: url(../images/hanna-positive.svg);
  background-position-x: 2em;
  background-position-y: 1em;
  background-size: 78%; }
.start-0 .perso-alfonso,
.start-1 .perso-alfonso,
.start-2 .perso-alfonso {
  background-color: #82b0de;
  transform: translateX(-91%);
  background-image: url(../images/alfonso-positive-flip.svg);
  background-position-x: -1em;
  background-position-y: 0.5em;
  background-size: 114%; }
.start-0 .perso-peter,
.start-1 .perso-peter,
.start-2 .perso-peter {
  background-color: #ed8945;
  transform: translateX(-9%);
  background-image: url(../images/peter.svg);
  background-position-x: 2em;
  background-position-y: 1em;
  background-size: 64%; }
.start-0 .perso-ada,
.start-1 .perso-ada,
.start-2 .perso-ada {
  background-color: #ed8945;
  transform: translateX(75%);
  background-image: url(../images/ada.svg);
  background-position-x: -1.5em;
  background-position-y: 0.5em;
  background-size: 128%; }

.start-0 .title {
  text-align: center;
  text-transform: uppercase;
  font-weight: 700;
  position: absolute;
  bottom: 21%;
  letter-spacing: 0.06em;
  width: 80%;
  left: 10%; }

.start-1 .perso-container {
  top: 7%; }
.start-1 .circle-perso {
  width: 8em;
  height: 8em; }
.start-1 .title {
  text-align: center;
  font-weight: 700;
  position: absolute;
  top: 40%;
  letter-spacing: 0.06em;
  width: 90%;
  left: 5%; }
.start-1.de .title {
  font-size: 140%; }
.start-1 .text-1 {
  text-align: center;
  font-weight: 700;
  position: absolute;
  top: 56%;
  letter-spacing: 0.06em;
  line-height: 1.1em;
  width: 90%;
  left: 5%; }
.start-1 .disclaimer {
  position: absolute;
  bottom: 2em;
  letter-spacing: 0.06em;
  width: 90%;
  left: 5em;
  color: #767781; }
.start-1 .select-container {
  width: 3.5em;
  height: 3.5em;
  bottom: 17%; }
  .start-1 .select-container .btn-select-round {
    background-image: url(../images/arrow_white.svg);
    background-position: center center;
    background-size: contain; }

.start-2 .title {
  text-align: center;
  font-weight: 700;
  position: absolute;
  top: 10%;
  letter-spacing: 0.06em;
  width: 50%;
  left: 25%; }
.start-2 .perso-container {
  top: 28%; }
.start-2 .circle-perso {
  width: 10.5em;
  height: 10.5em; }
.start-2 .select-container {
  bottom: 18%; }
  .start-2 .select-container.employer {
    left: 25%;
    transform: translateX(-50%); }
    .start-2 .select-container.employer .btn-select {
      background-color: #4c4c4c; }
  .start-2 .select-container.worker {
    left: 75%;
    transform: translateX(-50%); }
  .start-2 .select-container .btn-select {
    font-size: 100%;
    letter-spacing: 1;
    letter-spacing: 0.02em; }
.start-2 .perso-hanna {
  transform: translateX(-210%); }
.start-2 .perso-alfonso {
  transform: translateX(-130%); }
.start-2 .perso-peter {
  transform: translateX(30%); }
.start-2 .perso-ada {
  transform: translateX(110%); }

.end-1#container {
  border: 0.4em solid #ed8945 !important; }
.end-1 #scene {
  background-color: rgba(237, 137, 69, 0.2); }
.end-1 .select-container-1 {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translateX(-50%);
  width: auto; }
.end-1 .select-container-2 {
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translateX(-50%);
  width: auto; }
  .end-1 .select-container-2 .btn-select {
    display: inline-block; }
    .end-1 .select-container-2 .btn-select.restart {
      background-color: #4c4c4c; }
.end-1 .select-container-3 {
  position: absolute;
  top: 80%;
  left: 50%;
  transform: translateX(-50%);
  width: auto; }
.end-1 .perso-container {
  display: block;
  top: 7%;
  width: 100%;
  position: absolute; }
.end-1 .circle-perso {
  display: block;
  width: 8em;
  height: 8em;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: cover; }
.end-1 .perso-hanna {
  background-color: #82b0de;
  transform: translateX(-175%);
  background-image: url(../images/hanna-positive.svg);
  background-position-x: 2em;
  background-position-y: 1em;
  background-size: 78%; }
.end-1 .perso-alfonso {
  background-color: #82b0de;
  transform: translateX(-91%);
  background-image: url(../images/alfonso-positive-flip.svg);
  background-position-x: -1em;
  background-position-y: 0.5em;
  background-size: 114%; }
.end-1 .perso-peter {
  background-color: #ed8945;
  transform: translateX(-9%);
  background-image: url(../images/peter.svg);
  background-position-x: 2em;
  background-position-y: 1em;
  background-size: 64%; }
.end-1 .perso-ada {
  background-color: #ed8945;
  transform: translateX(75%);
  background-image: url(../images/ada.svg);
  background-position-x: -1.5em;
  background-position-y: 0.5em;
  background-size: 128%; }
.end-1 .text-1 {
  text-align: center;
  font-weight: 700;
  position: absolute;
  top: 46%;
  letter-spacing: 0.06em;
  line-height: 1.1em;
  width: 80%;
  left: 10%; }

/*employer*/
.flow-emp.emp-0#container {
  border: 0.4em solid #ed8945 !important; }
.flow-emp.emp-0 .title {
  top: 4%;
  width: 100%;
  text-align: center;
  color: #545561;
  text-transform: uppercase;
  font-weight: 600;
  position: absolute; }
.flow-emp.emp-0 .text-1 {
  background-color: rgba(237, 137, 69, 0.5);
  position: absolute;
  width: 26%;
  top: 15%;
  height: 85%;
  left: 22%;
  text-align: center;
  padding: 2% 2% 2% 4%; }
.flow-emp.emp-0 .text-2 {
  background-color: rgba(130, 176, 222, 0.5);
  width: 26%;
  position: absolute;
  top: 15%;
  height: 85%;
  right: 22%;
  text-align: center;
  padding: 2% 4% 2% 2%; }
  .flow-emp.emp-0 .text-2 .btn-select {
    background-color: #4c4c4c; }
.flow-emp.emp-0 .name {
  margin-top: 10%;
  margin-bottom: 10%;
  text-transform: uppercase;
  font-weight: 600; }
.flow-emp.emp-0 .hanna {
  height: 70%;
  position: absolute;
  bottom: -10px;
  width: 20%;
  left: 11%;
  background: url("../images/hanna-positive.svg") top left no-repeat;
  background-size: contain; }
.flow-emp.emp-0 .alfonso {
  height: 70%;
  position: absolute;
  bottom: -10px;
  width: 24%;
  right: 3%;
  background: url("../images/alfonso-positive.svg") top left no-repeat;
  background-size: contain; }
.flow-emp.emp-0.el .alfonso, .flow-emp.emp-0.es .alfonso, .flow-emp.emp-0.fr .alfonso, .flow-emp.emp-0.it .alfonso, .flow-emp.emp-0.pt .alfonso, .flow-emp.emp-0.sl .alfonso, .flow-emp.emp-0.bg .alfonso, .flow-emp.emp-0.sq .alfonso, .flow-emp.emp-0.sr .alfonso, .flow-emp.emp-0.uk .alfonso {
  right: 2%; }
.flow-emp.emp-0 .select-container {
  position: absolute;
  bottom: 10%;
  left: 50%;
  transform: translateX(-50%);
  display: none; }
.flow-emp.emp-0b#container {
  border: 0.4em solid #ed8945 !important; }
.flow-emp.emp-0b .text-1 {
  position: absolute;
  width: 31%;
  top: 0%;
  height: 100%;
  left: 45%;
  text-align: center;
  padding: 10% 4% 1% 4%; }
.flow-emp.emp-0b .role-emp {
  height: 98%;
  position: absolute;
  top: 16%;
  width: 26%;
  left: 29%;
  background-size: cover; }
.flow-emp.emp-0b .background-role {
  height: 83%;
  bottom: -4px;
  width: 76%;
  left: 5%; }
.flow-emp.emp-0b.role-emp-alfonso .role-emp {
  height: 121%;
  top: 12%;
  width: 41%;
  left: 13%; }
.flow-emp.emp-0b.role-emp-alfonso .background-role {
  height: 84%;
  bottom: 0px;
  width: 120%;
  left: -6.5%; }
.flow-emp.emp-1 .text-1, .flow-emp.emp-2 .text-1, .flow-emp.emp-3 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid; }
.flow-emp.emp-1 .bubble, .flow-emp.emp-2 .bubble, .flow-emp.emp-3 .bubble {
  background-position: top left;
  background-repeat: no-repeat;
  background-size: contain;
  width: 30%;
  height: 53%;
  position: absolute;
  left: 36%;
  top: 12%;
  padding: 2em 3em 3em 1.5em;
  text-align: center;
  color: #4c4c4c;
  z-index: 10; }
.flow-emp.emp-1 .david, .flow-emp.emp-2 .david, .flow-emp.emp-3 .david {
  height: 98%;
  position: absolute;
  top: 25%;
  width: 30%;
  right: 11%;
  background: url(../images/david-positive.svg) top left no-repeat;
  background-size: cover; }
.flow-emp.emp-1 .marius, .flow-emp.emp-2 .marius, .flow-emp.emp-3 .marius {
  height: 100%;
  position: absolute;
  top: 11%;
  width: 30%;
  right: 11%;
  background: url(../images/marius-positive.svg) top left no-repeat;
  background-size: cover; }
.flow-emp.emp-1 .maria, .flow-emp.emp-2 .maria, .flow-emp.emp-3 .maria {
  height: 100%;
  position: absolute;
  top: 11%;
  width: 30%;
  right: 11%;
  background: url(../images/maria-positive.svg) top left no-repeat;
  background-size: cover; }
.flow-emp.emp-1 .background-role, .flow-emp.emp-2 .background-role, .flow-emp.emp-3 .background-role {
  height: 85%;
  top: 32%;
  width: 100%;
  left: 12%; }
.flow-emp.emp-1 .bubble {
  background-position: top left;
  background-repeat: no-repeat;
  background-size: contain;
  width: 30%;
  height: 53%;
  position: absolute;
  left: 36%;
  top: 12%;
  padding: 2em 3em 3em 1.5em;
  text-align: center;
  color: #4c4c4c;
  z-index: 10; }
.flow-emp.emp-2 .bubble {
  background-position: top left;
  background-repeat: no-repeat;
  background-size: contain;
  width: 35%;
  height: 60%;
  position: absolute;
  left: 31%;
  top: 12%;
  padding: 3em 3em 3em 1.5em;
  text-align: center;
  color: #4c4c4c;
  z-index: 10; }
.flow-emp.emp-2.el .bubble {
  padding-top: 2em; }
.flow-emp.emp-3 .bubble {
  background-position: top left;
  background-repeat: no-repeat;
  background-size: contain;
  width: 35%;
  height: 60%;
  position: absolute;
  left: 33%;
  top: 12%;
  padding: 3em 3em 3em 1.5em;
  text-align: center;
  color: #4c4c4c;
  z-index: 10; }
.flow-emp.emp-1b .text-1, .flow-emp.emp-2b .text-1, .flow-emp.emp-3b .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-emp.emp-1b .bubble, .flow-emp.emp-2b .bubble, .flow-emp.emp-3b .bubble {
  width: 52%;
  height: 80%;
  left: 25%;
  top: 12%;
  padding: 5em 6.5em 3em 2.3em;
  color: #4c4c4c;
  z-index: 10; }
.flow-emp.emp-1b.el .bubble, .flow-emp.emp-2b.el .bubble, .flow-emp.emp-3b.el .bubble {
  padding-top: 3em; }
.flow-emp.emp-1b.ar .bubble, .flow-emp.emp-2b.ar .bubble, .flow-emp.emp-3b.ar .bubble {
  padding-right: 6.9em; }
.flow-emp.emp-1b .role-emp, .flow-emp.emp-2b .role-emp, .flow-emp.emp-3b .role-emp {
  height: 144%;
  position: absolute;
  top: 17%;
  width: 26%;
  right: 3%;
  background-size: cover; }
.flow-emp.emp-1b .background-role, .flow-emp.emp-2b .background-role, .flow-emp.emp-3b .background-role {
  height: 84%;
  bottom: 0;
  width: 77%;
  left: -3%; }
.flow-emp.emp-1b.role-emp-alfonso .role-emp, .flow-emp.emp-2b.role-emp-alfonso .role-emp, .flow-emp.emp-3b.role-emp-alfonso .role-emp {
  height: 144%;
  top: 12%;
  width: 48%;
  right: -1%; }
.flow-emp.emp-1b.role-emp-alfonso .background-role, .flow-emp.emp-2b.role-emp-alfonso .background-role, .flow-emp.emp-3b.role-emp-alfonso .background-role {
  height: 122%;
  top: 13%;
  width: 139%;
  left: -34%; }
.flow-emp.emp-2b .bubble {
  padding: 4.5em 4em 3em 2.5em;
  width: 55%;
  height: 94%;
  left: 21%;
  z-index: 54;
  top: 7%; }
.flow-emp.emp-2b.de .bubble, .flow-emp.emp-2b.el .bubble, .flow-emp.emp-2b.fr .bubble {
  font-size: 95%;
  padding-top: 3em; }
.flow-emp.emp-2b.bg .bubble, .flow-emp.emp-2b.cs .bubble, .flow-emp.emp-2b.ga .bubble, .flow-emp.emp-2b.it .bubble, .flow-emp.emp-2b.lt .bubble, .flow-emp.emp-2b.lv .bubble, .flow-emp.emp-2b.es .bubble {
  padding-top: 3em; }
.flow-emp.emp-2b.ar .bubble {
  padding-right: 4.9em; }
.flow-emp.emp-3b .disc-text {
  width: 15em;
  height: 15em; }
.flow-emp.emp-3b .bubble {
  padding-top: 3em; }
.flow-emp.emp-4 .text-1, .flow-emp.emp-6 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid;
  z-index: 2; }
.flow-emp.emp-4 .role-wor, .flow-emp.emp-6 .role-wor {
  height: 105%;
  position: absolute;
  top: 16%;
  width: 33%;
  left: 32%;
  background-size: contain;
  z-index: 2; }
.flow-emp.emp-4 .role-emp, .flow-emp.emp-6 .role-emp {
  height: 144%;
  position: absolute;
  top: 15%;
  width: 21%;
  right: 6%;
  background-size: contain;
  z-index: 2; }
.flow-emp.emp-4.role-emp-alfonso .role-emp, .flow-emp.emp-6.role-emp-alfonso .role-emp {
  width: 29%;
  right: 4%; }
.flow-emp.emp-4 .inspector, .flow-emp.emp-6 .inspector {
  height: 113%;
  position: absolute;
  top: 17%;
  width: 39%;
  right: 6%;
  background: url(../images/inspector.svg) top left no-repeat;
  background-size: cover;
  z-index: 2; }
.flow-emp.emp-4 .background-role, .flow-emp.emp-6 .background-role {
  height: 104%;
  top: 10%;
  width: 100%;
  right: 18%;
  z-index: 1; }
.flow-emp.emp-6 .bubble {
  background: url(../images/bulle_1_green-l.svg) top left no-repeat;
  background-size: contain;
  width: 39%;
  height: 73%;
  position: absolute;
  left: 31%;
  top: 6%;
  z-index: 10;
  padding: 2.5em 3.5em 3em 1.8em;
  color: #4c4c4c; }
.flow-emp.emp-4b .text-1, .flow-emp.emp-6b .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-emp.emp-4b .bubble, .flow-emp.emp-6b .bubble {
  width: 50%;
  height: 85%;
  left: 25%;
  top: 12%;
  padding: 4em 4.5em 3em 2.5em;
  color: #4c4c4c; }
.flow-emp.emp-4b.bg .bubble, .flow-emp.emp-4b.de .bubble, .flow-emp.emp-4b.ga .bubble, .flow-emp.emp-4b.pl .bubble, .flow-emp.emp-4b.fr .bubble, .flow-emp.emp-6b.bg .bubble, .flow-emp.emp-6b.de .bubble, .flow-emp.emp-6b.ga .bubble, .flow-emp.emp-6b.pl .bubble, .flow-emp.emp-6b.fr .bubble {
  padding-top: 3em; }
.flow-emp.emp-4b.fr .bubble, .flow-emp.emp-6b.fr .bubble {
  font-size: 95%; }
.flow-emp.emp-4b.ar .bubble, .flow-emp.emp-6b.ar .bubble {
  padding-right: 4.9em; }
.flow-emp.emp-4b .role-emp, .flow-emp.emp-6b .role-emp {
  height: 144%;
  position: absolute;
  top: 17%;
  width: 26%;
  right: 3%;
  background-size: cover; }
.flow-emp.emp-4b .background-role, .flow-emp.emp-6b .background-role {
  height: 84%;
  bottom: 0;
  width: 77%;
  left: -3%; }
.flow-emp.emp-4b.role-emp-alfonso .role-emp, .flow-emp.emp-6b.role-emp-alfonso .role-emp {
  height: 144%;
  top: 12%;
  width: 48%;
  right: -1%; }
.flow-emp.emp-4b.role-emp-alfonso .background-role, .flow-emp.emp-6b.role-emp-alfonso .background-role {
  height: 122%;
  top: 13%;
  width: 139%;
  left: -34%; }
.flow-emp.emp-6b .bubble {
  width: 42%;
  height: 70%;
  left: 25%;
  top: 17%;
  z-index: 10;
  padding: 3em 4.5em 3em 2.5em; }
.flow-emp.emp-6b .role-emp {
  right: 11%; }
.flow-emp.emp-5 .text-1, .flow-emp.emp-10 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 33%;
  top: 16%;
  left: 31%;
  padding: 1em;
  color: #fff;
  border: 0.1em solid;
  border-width: 0.1em;
  border-style: solid;
  z-index: 2; }
.flow-emp.emp-5 .role-emp, .flow-emp.emp-10 .role-emp {
  height: 148%;
  position: absolute;
  top: 5%;
  width: 33%;
  right: 12%;
  background-size: cover;
  z-index: 3; }
.flow-emp.emp-5.role-emp-alfonso .role-emp, .flow-emp.emp-10.role-emp-alfonso .role-emp {
  top: 5%;
  width: 40%;
  right: 1%;
  height: 117%; }
.flow-emp.emp-10 .role-emp {
  right: 15%; }
.flow-emp.emp-10.role-emp-alfonso .role-emp {
  right: 6%; }
.flow-emp.emp-5b .bubble {
  background: url(../images/bulle_1_orange.svg) top left no-repeat;
  background-size: contain;
  width: 35%;
  height: 80%;
  position: absolute;
  right: 7%;
  top: 20%;
  padding: 3em 3.5em 3em 1.8em;
  color: #fff;
  z-index: 2; }
.flow-emp.emp-5b .background-role {
  width: 81%;
  height: 96%;
  left: 7%;
  top: 15%; }
.flow-emp.emp-5b .text-phone {
  text-align: center;
  width: 16%;
  position: absolute;
  left: 34%;
  bottom: 72%;
  color: #2ECD2E; }
.flow-emp.emp-5b.de .text-phone, .flow-emp.emp-5b.fi .text-phone {
  font-size: 83%; }
.flow-emp.emp-5b.role-emp-alfonso .background-role {
  left: 3%; }
.flow-emp.emp-5b.role-emp-alfonso .text-phone {
  left: 41.5%;
  bottom: 74%; }
.flow-emp.emp-5c .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-emp.emp-5c .bubble {
  width: 70%;
  height: 83%;
  left: 5%;
  top: 8%;
  padding: 2.5em 6.7em 3em 1.8em;
  color: #4c4c4c; }
.flow-emp.emp-5c.de .bubble, .flow-emp.emp-5c.bg .bubble, .flow-emp.emp-5c.de .bubble, .flow-emp.emp-5c.fr .bubble, .flow-emp.emp-5c.ga .bubble, .flow-emp.emp-5c.lv .bubble, .flow-emp.emp-5c.nl .bubble, .flow-emp.emp-5c.pl .bubble, .flow-emp.emp-5c.pt .bubble, .flow-emp.emp-5c.mt .bubble {
  font-size: 90%; }
.flow-emp.emp-5c.el .bubble {
  font-size: 85%; }
.flow-emp.emp-5c .role-emp {
  height: 144%;
  position: absolute;
  top: 17%;
  width: 26%;
  right: 3%;
  background-size: cover; }
.flow-emp.emp-5c.role-emp-alfonso .role-emp {
  height: 144%;
  top: 12%;
  width: 48%;
  right: -1%; }
.flow-emp.emp-7 .text-1, .flow-emp.emp-7b .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid;
  border-bottom-width: 0.1em;
  border-bottom-style: solid;
  z-index: 2; }
.flow-emp.emp-7 .role-wor, .flow-emp.emp-7b .role-wor {
  height: 100%;
  position: absolute;
  top: 4%;
  width: 35%;
  right: -5%;
  background-size: cover; }
.flow-emp.emp-7 .background-role, .flow-emp.emp-7b .background-role {
  height: 75%;
  bottom: 0px;
  width: 83%;
  right: -3%; }
.flow-emp.emp-7.role-emp-alfonso .background-role, .flow-emp.emp-7b.role-emp-alfonso .background-role {
  height: 82%;
  bottom: -12px;
  width: 81%;
  right: 3%; }
.flow-emp.emp-7b .bubble {
  background-position: top left;
  background-repeat: no-repeat;
  background-size: contain;
  width: 34%;
  height: 54%;
  position: absolute;
  left: 37%;
  top: 8%;
  padding: 3em 4em 3em 1.5em;
  text-align: center;
  color: #4c4c4c;
  z-index: 10; }
.flow-emp.emp-7b.ga .bubble, .flow-emp.emp-7b.bg .bubble, .flow-emp.emp-7b.el .bubble {
  padding-top: 2em;
  font-size: 95%; }
.flow-emp.emp-7b .role-wor {
  height: 100%;
  position: absolute;
  top: 4%;
  width: 35%;
  right: -5%;
  background-size: cover; }
.flow-emp.emp-7b .background-role {
  height: 81%;
  top: 20%;
  width: 90%;
  left: 16%; }
.flow-emp.emp-7b.role-emp-alfonso .background-role {
  height: 62%;
  top: 41%;
  width: 67%;
  left: -3%; }
.flow-emp.emp-7c .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-emp.emp-7c .bubble {
  width: 53%;
  height: 90%;
  left: 19%;
  top: 7%;
  padding: 3em 5em 3em 2.5em;
  color: #4c4c4c;
  z-index: 10; }
.flow-emp.emp-7c.bg .bubble, .flow-emp.emp-7c.el .bubble {
  font-size: 90%; }
.flow-emp.emp-7c .role-emp {
  height: 144%;
  position: absolute;
  top: 17%;
  width: 26%;
  right: 3%;
  background-size: cover; }
.flow-emp.emp-7c .background-role {
  height: 84%;
  bottom: 0;
  width: 77%;
  left: -3%; }
.flow-emp.emp-7c.role-emp-alfonso .role-emp {
  height: 144%;
  top: 12%;
  width: 48%;
  right: -1%; }
.flow-emp.emp-7c.role-emp-alfonso .background-role {
  height: 122%;
  top: 13%;
  width: 139%;
  left: -34%; }
.flow-emp.emp-8 .text-1, .flow-emp.emp-9 .text-1, .flow-emp.emp-9b .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid;
  z-index: 2; }
.flow-emp.emp-8 .text-2, .flow-emp.emp-9 .text-2, .flow-emp.emp-9b .text-2 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  left: 29%;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-emp.emp-8 .bubble, .flow-emp.emp-9 .bubble, .flow-emp.emp-9b .bubble {
  width: 41%;
  height: 80%;
  right: 3%;
  top: 12%;
  padding: 2em 1em 3em 1.8em;
  color: #4c4c4c; }
.flow-emp.emp-8 .background-role, .flow-emp.emp-9 .background-role, .flow-emp.emp-9b .background-role {
  width: 58%;
  height: 81%;
  left: 18%;
  bottom: -14%; }
.flow-emp.emp-8 .text-phone, .flow-emp.emp-9 .text-phone, .flow-emp.emp-9b .text-phone {
  text-align: center;
  width: 16%;
  position: absolute;
  left: 33.5%;
  bottom: 74%;
  color: #2ECD2E;
  font-size: 60%; }
.flow-emp.emp-8.de .text-phone, .flow-emp.emp-8.fi .text-phone, .flow-emp.emp-8.nl .text-phone, .flow-emp.emp-9.de .text-phone, .flow-emp.emp-9.fi .text-phone, .flow-emp.emp-9.nl .text-phone, .flow-emp.emp-9b.de .text-phone, .flow-emp.emp-9b.fi .text-phone, .flow-emp.emp-9b.nl .text-phone {
  font-size: 50%; }
.flow-emp.emp-8.role-emp-alfonso .background-role, .flow-emp.emp-9.role-emp-alfonso .background-role, .flow-emp.emp-9b.role-emp-alfonso .background-role {
  width: 55%;
  height: 76%;
  left: 14%;
  bottom: -14%; }
.flow-emp.emp-8.role-emp-alfonso .text-phone, .flow-emp.emp-9.role-emp-alfonso .text-phone, .flow-emp.emp-9b.role-emp-alfonso .text-phone {
  left: 41.5%;
  bottom: 80%; }
.flow-emp.emp-8 .bubble {
  padding-right: 2em; }
.flow-emp.emp-8.bg .bubble, .flow-emp.emp-8.de .bubble, .flow-emp.emp-8.el .bubble {
  font-size: 94%; }
.flow-emp.emp-8.ar .bubble {
  padding-right: 3em;
  padding-left: 1em; }
.flow-emp.emp-9 .bubble {
  width: 42%;
  text-align: center;
  padding: 0;
  background: url(../images/bulle_1_orange.svg) top left no-repeat; }
  .flow-emp.emp-9 .bubble div {
    padding: 3em 2em 3em 4em; }
.flow-emp.emp-9b .bubble {
  background: url(../images/bulle_4_green.svg) top left no-repeat;
  width: 42%;
  background-size: contain;
  padding: 3em 3em 3em 1.8em; }
.flow-emp.emp-9b.bg .bubble, .flow-emp.emp-9b.el .bubble {
  font-size: 94%; }
.flow-emp.emp-9b .disc-text {
  width: 18em;
  height: 18em;
  padding: 1em;
  left: 75%; }
.flow-emp.emp-11 .text-1, .flow-emp.emp-12 .text-1, .flow-emp.emp-13 .text-1, .flow-emp.emp-14 .text-1, .flow-emp.emp-15 .text-1 {
  background-color: #ed8945;
  position: absolute;
  width: 30%;
  top: 14%;
  left: 15%;
  padding: 1.5em 1em;
  color: #fff;
  border: 0.3em solid #9ba5c7;
  z-index: 2;
  transform: rotate(-7deg); }
  .flow-emp.emp-11 .text-1:before, .flow-emp.emp-12 .text-1:before, .flow-emp.emp-13 .text-1:before, .flow-emp.emp-14 .text-1:before, .flow-emp.emp-15 .text-1:before {
    content: "";
    display: block;
    position: absolute;
    top: -2.3em;
    left: -2.3em;
    width: 2.5em;
    height: 2.5em;
    background: url(../images/highlight.svg) top left no-repeat;
    background-size: contain; }
.flow-emp.emp-11 .text-2, .flow-emp.emp-12 .text-2, .flow-emp.emp-13 .text-2, .flow-emp.emp-14 .text-2, .flow-emp.emp-15 .text-2 {
  color: #ff0000;
  position: absolute;
  bottom: 66%;
  left: 50.5%;
  font-weight: 700;
  z-index: 2;
  transform: rotate(-2.9deg);
  max-width: 26%; }
.flow-emp.emp-11.ar .text-2, .flow-emp.emp-12.ar .text-2, .flow-emp.emp-13.ar .text-2, .flow-emp.emp-14.ar .text-2, .flow-emp.emp-15.ar .text-2 {
  left: inherit;
  right: 25.5%; }
.flow-emp.emp-11 .select-container, .flow-emp.emp-12 .select-container, .flow-emp.emp-13 .select-container, .flow-emp.emp-14 .select-container, .flow-emp.emp-15 .select-container {
  position: absolute;
  bottom: 4%;
  right: 5%;
  text-align: center;
  z-index: 10;
  display: none; }
.flow-emp.emp-11 .text-1, .flow-emp.emp-15 .text-1 {
  border-style: solid;
  border-width: 0.3em; }
.flow-emp.emp-11 .role-emp, .flow-emp.emp-15 .role-emp {
  height: 144%;
  position: absolute;
  top: 3%;
  width: 30%;
  right: 13%;
  background-size: contain;
  z-index: 2; }
.flow-emp.emp-11 .background-role, .flow-emp.emp-15 .background-role {
  width: 86%;
  top: 15%;
  left: 22%;
  height: 89%; }
.flow-emp.emp-11.role-emp-alfonso .background-role, .flow-emp.emp-15.role-emp-alfonso .background-role {
  width: 77%;
  top: 21%;
  left: 20%;
  height: 83%; }
.flow-emp.emp-11.role-emp-alfonso .role-emp, .flow-emp.emp-15.role-emp-alfonso .role-emp {
  height: 145%;
  top: 3%;
  width: 49%;
  right: 2%; }
.flow-emp.emp-12 .background-role, .flow-emp.emp-13 .background-role, .flow-emp.emp-14 .background-role {
  width: 79%;
  top: 12%;
  left: 27%;
  height: 100%; }
.flow-emp .role-emp,
.flow-emp .role-wor {
  background-repeat: no-repeat;
  background-position: top left; }
.flow-emp .background-role {
  background-repeat: no-repeat;
  background-position: top left;
  background-size: cover;
  position: absolute; }
.flow-emp .bubble {
  background-repeat: no-repeat;
  background-position: top left;
  position: absolute;
  background-size: contain; }
.flow-emp.role-emp-hanna#container {
  border: 0.4em solid #ed8945; }
.flow-emp.role-emp-hanna .role-emp-type-positive {
  background-image: url(../images/hanna-positive.svg); }
.flow-emp.role-emp-hanna .role-emp-type-hope {
  background-image: url(../images/hanna-hope.svg); }
.flow-emp.role-emp-hanna .role-emp-type-questioning {
  background-image: url(../images/hanna-questioning.svg); }
.flow-emp.role-emp-hanna .background-role-type-1 {
  background-image: url(../images/bg-plant.svg); }
.flow-emp.role-emp-hanna .background-role-type-2 {
  background-image: url(../images/bg-fruits.svg); }
.flow-emp.role-emp-hanna .background-role-phone {
  background-image: url(../images/bg-phone-women.svg); }
.flow-emp.role-emp-hanna .background-role-end-negative {
  background-image: url(../images/bg-negative-end-women.svg); }
.flow-emp.role-emp-hanna.ar .background-role-end-negative {
  background-image: url(../images/bg-negative-end-women-rtl.svg); }
.flow-emp.role-emp-hanna .background-role-end-positive {
  background-image: url(../images/bg-farm.svg); }
.flow-emp.role-emp-hanna .background-role-house {
  background-image: url(../images/bg-house.svg); }
.flow-emp.role-emp-hanna .background-role-neutral-1 {
  background-image: url(../images/background-1-green.svg); }
.flow-emp.role-emp-hanna .background-role-neutral-2 {
  background-image: url(../images/background-2-green.svg); }
.flow-emp.role-emp-hanna .bubble-role-wor-1 {
  background-image: url(../images/bulle_1_blue-wor.svg); }
.flow-emp.role-emp-hanna .bubble-role-emp-1 {
  background-image: url(../images/bulle_1_green.svg); }
.flow-emp.role-emp-hanna .bubble-role-emp-2 {
  background-image: url(../images/bulle_2_green.svg); }
.flow-emp.role-emp-hanna .bubble-role-emp-3 {
  background-image: url(../images/bulle_3_green.svg); }
.flow-emp.role-emp-hanna .bubble-role-emp-4 {
  background-image: url(../images/bulle_4_green.svg); }
.flow-emp.role-emp-hanna .bg-role-color-50 {
  background-color: rgba(237, 137, 69, 0.5); }
.flow-emp.role-emp-hanna .bg-role-color {
  background-color: #ed8945; }
.flow-emp.role-emp-hanna .bg-role-border-color {
  border-color: #9ba5c7; }
.flow-emp.role-emp-hanna .bg-role-color-inv {
  background-color: #8e9b64; }
.flow-emp.role-emp-hanna .bg-role-border-color-inv {
  border-color: #ed8945; }
.flow-emp.role-emp-hanna .bg-role-text-border-color {
  border-color: #ed8945; }
.flow-emp.role-emp-hanna .btn-number:before {
  border-color: #ed8945; }
.flow-emp.role-emp-hanna .btn-number:hover {
  color: #fff; }
  .flow-emp.role-emp-hanna .btn-number:hover::before {
    background-color: #ed8945; }
.flow-emp.role-emp-hanna .btn-arrow {
  background-image: url(../images/arrow_orange.svg); }
.flow-emp.role-emp-hanna .btn-next {
  border-color: #ed8945; }
  .flow-emp.role-emp-hanna .btn-next:hover {
    background-color: #ed8945; }
.flow-emp.role-emp-hanna .disc-text {
  background-color: #ed8945; }
.flow-emp.role-emp-alfonso#container {
  border: 0.4em solid #3f68a9; }
.flow-emp.role-emp-alfonso .role-emp-type-positive {
  background-image: url(../images/alfonso-positive.svg); }
.flow-emp.role-emp-alfonso .role-emp-type-hope {
  background-image: url(../images/alfonso-hope.svg); }
.flow-emp.role-emp-alfonso .role-emp-type-questioning {
  background-image: url(../images/alfonso-questioning.svg); }
.flow-emp.role-emp-alfonso .background-role-type-1 {
  background-image: url(../images/bg-hotel.svg); }
.flow-emp.role-emp-alfonso .background-role-type-2 {
  background-image: url(../images/bg-boxes.svg); }
.flow-emp.role-emp-alfonso .background-role-phone {
  background-image: url(../images/bg-phone-men.svg); }
.flow-emp.role-emp-alfonso .background-role-end-negative {
  background-image: url(../images/bg-negative-end-men.svg); }
.flow-emp.role-emp-alfonso.ar .background-role-end-negative {
  background-image: url(../images/bg-negative-end-men-rtl.svg); }
.flow-emp.role-emp-alfonso .background-role-end-positive {
  background-image: url(../images/bg-office.svg); }
.flow-emp.role-emp-alfonso .background-role-house {
  background-image: url(../images/bg-house.svg); }
.flow-emp.role-emp-alfonso .background-role-neutral-1 {
  background-image: url(../images/background-1-blue.svg); }
.flow-emp.role-emp-alfonso .background-role-neutral-2 {
  background-image: url(../images/background-2-blue.svg); }
.flow-emp.role-emp-alfonso .bubble-role-wor-1 {
  background-image: url(../images/bulle_1_orange-50.svg); }
.flow-emp.role-emp-alfonso .bubble-role-emp-1 {
  background-image: url(../images/bulle_1_blue.svg); }
.flow-emp.role-emp-alfonso .bubble-role-emp-2 {
  background-image: url(../images/bulle_2_blue.svg); }
.flow-emp.role-emp-alfonso .bubble-role-emp-3 {
  background-image: url(../images/bulle_3_blue.svg); }
.flow-emp.role-emp-alfonso .bubble-role-emp-4 {
  background-image: url(../images/bulle_4_blue.svg); }
.flow-emp.role-emp-alfonso .bg-role-color-50 {
  background-color: rgba(130, 176, 222, 0.5); }
.flow-emp.role-emp-alfonso .bg-role-color {
  background-color: #82b0de; }
.flow-emp.role-emp-alfonso .bg-role-border-color {
  border-color: #ed8945; }
.flow-emp.role-emp-alfonso .bg-role-color-inv {
  background-color: #ed8945; }
.flow-emp.role-emp-alfonso .bg-role-border-color-inv {
  border-color: #9ba5c7; }
.flow-emp.role-emp-alfonso .bg-role-text-border-color {
  border-color: #3f68a9; }
.flow-emp.role-emp-alfonso .btn-number:before {
  border-color: #3f68a9; }
.flow-emp.role-emp-alfonso .btn-number:hover {
  color: #fff; }
  .flow-emp.role-emp-alfonso .btn-number:hover::before {
    background-color: #3f68a9; }
.flow-emp.role-emp-alfonso .btn-arrow {
  background-image: url(../images/arrow_blue.svg); }
.flow-emp.role-emp-alfonso .btn-next {
  border-color: #3f68a9; }
  .flow-emp.role-emp-alfonso .btn-next:hover {
    background-color: #3f68a9; }
.flow-emp.role-emp-alfonso .disc-text {
  background-color: #82b0de; }
.flow-emp.role-wor-david .role-wor-type-positive {
  background-image: url(../images/david-positive.svg); }
.flow-emp.role-wor-david .role-wor-type-nobackpack {
  background-image: url(../images/david-nobackpack.svg); }
.flow-emp.role-wor-david .role-wor-type-sad {
  background-image: url(../images/david-sad.svg); }
.flow-emp.role-wor-marius .role-wor-type-positive {
  background-image: url(../images/marius-positive.svg); }
.flow-emp.role-wor-marius .role-wor-type-nobackpack {
  background-image: url(../images/marius-nobackpack.svg); }
.flow-emp.role-wor-marius .role-wor-type-sad {
  background-image: url(../images/marius-sad.svg); }
.flow-emp.role-wor-maria .role-wor-type-positive {
  background-image: url(../images/maria-positive.svg); }
.flow-emp.role-wor-maria .role-wor-type-nobackpack {
  background-image: url(../images/maria-nobackpack.svg); }
.flow-emp.role-wor-maria .role-wor-type-sad {
  background-image: url(../images/maria-sad.svg); }

/*worker*/
.flow-wor.wor-0#container {
  border: 0.4em solid #ed8945 !important; }
.flow-wor.wor-0 .title {
  top: 4%;
  width: 100%;
  text-align: center;
  color: #545561;
  text-transform: uppercase;
  font-weight: 600;
  position: absolute; }
.flow-wor.wor-0 .text-1 {
  background-color: rgba(237, 137, 69, 0.5);
  position: absolute;
  width: 26%;
  top: 15%;
  height: 85%;
  left: 22%;
  text-align: center;
  padding: 2% 2% 2% 4%; }
.flow-wor.wor-0 .text-2 {
  background-color: rgba(142, 155, 100, 0.5);
  width: 26%;
  position: absolute;
  top: 15%;
  height: 85%;
  right: 22%;
  text-align: center;
  padding: 2% 4% 2% 2%; }
  .flow-wor.wor-0 .text-2 .btn-select {
    background-color: #4c4c4c; }
.flow-wor.wor-0.fr .text-2, .flow-wor.wor-0.de .text-2, .flow-wor.wor-0.da .text-2, .flow-wor.wor-0.bg .text-2, .flow-wor.wor-0.es .text-2 {
  font-size: 83%; }
.flow-wor.wor-0.el .text-2, .flow-wor.wor-0.bg .text-2 {
  font-size: 77%; }
.flow-wor.wor-0 .name {
  margin-top: 10%;
  margin-bottom: 10%;
  text-transform: uppercase;
  font-weight: 600; }
.flow-wor.wor-0 .peter {
  height: 70%;
  position: absolute;
  bottom: -10px;
  width: 20%;
  left: 11%;
  background: url("../images/peter.svg") top left no-repeat;
  background-size: contain; }
.flow-wor.wor-0 .ada {
  height: 70%;
  position: absolute;
  bottom: -10px;
  width: 24%;
  right: 3%;
  background: url("../images/ada.svg") top left no-repeat;
  background-size: contain; }
.flow-wor.wor-0 .select-container {
  position: absolute;
  bottom: 8%;
  left: 50%;
  transform: translateX(-50%);
  display: none; }
.flow-wor.wor-0b .text-1 {
  position: absolute;
  width: 31%;
  top: 0%;
  height: 100%;
  left: 45%;
  text-align: center;
  padding: 10% 4% 1% 4%; }
.flow-wor.wor-0b .role-wor {
  height: 98%;
  position: absolute;
  top: 4%;
  width: 30%;
  left: 22%;
  background-size: cover; }
.flow-wor.wor-0b .background-role {
  height: 76%;
  bottom: -38px;
  width: 126%;
  left: -6%;
  background-size: contain; }
.flow-wor.wor-0b.role-wor-ada .role-wor {
  height: 98%;
  position: absolute;
  top: 4%;
  width: 43%;
  left: 10%;
  background-size: cover; }
.flow-wor.wor-0b.role-wor-ada .background-role {
  height: 76%;
  bottom: -38px;
  width: 89%;
  left: -6%;
  background-size: contain; }
.flow-wor .role-emp,
.flow-wor .role-wor {
  background-repeat: no-repeat;
  background-position: top left;
  position: absolute; }
.flow-wor .background-role {
  background-repeat: no-repeat;
  background-position: top left;
  background-size: cover;
  position: absolute; }
.flow-wor .bubble {
  background-repeat: no-repeat;
  background-position: top left;
  position: absolute;
  background-size: contain; }
.flow-wor.role-wor-peter#container {
  border: 0.4em solid #ed8945; }
.flow-wor.role-wor-peter .role-wor-type-positive {
  background-image: url(../images/peter-positive.svg); }
.flow-wor.role-wor-peter .role-wor-type-sad {
  background-image: url(../images/peter-sad.svg); }
.flow-wor.role-wor-peter .role-wor-type-normal {
  background-image: url(../images/peter.svg); }
.flow-wor.role-wor-peter .background-role-type-1 {
  background-image: url(../images/bg-house-2.svg); }
.flow-wor.role-wor-peter .background-role-phone {
  background-image: url(../images/bg-phone-men.svg); }
.flow-wor.role-wor-peter .bg-role-text-border-color {
  border-color: #ed8945; }
.flow-wor.role-wor-peter .bg-role-color-50 {
  background-color: rgba(237, 137, 69, 0.5); }
.flow-wor.role-wor-peter .bubble-role-wor-1 {
  background-image: url(../images/bulle_1_orange-50.svg); }
.flow-wor.role-wor-peter .bubble-role-wor-2 {
  background-image: url(../images/bulle_1_orange-50-flip.svg); }
.flow-wor.role-wor-peter .btn-number:before {
  border-color: #ed8945; }
.flow-wor.role-wor-peter .btn-number:hover {
  color: #fff; }
  .flow-wor.role-wor-peter .btn-number:hover::before {
    background-color: #ed8945; }
.flow-wor.role-wor-peter .btn-next {
  border-color: #ed8945; }
  .flow-wor.role-wor-peter .btn-next:hover {
    background-color: #ed8945; }
.flow-wor.role-wor-peter .disc-text {
  background-color: #ed8945; }
.flow-wor.role-wor-ada#container {
  border: 0.4em solid #8e9b64; }
.flow-wor.role-wor-ada .role-wor-type-positive {
  background-image: url(../images/ada-positive.svg); }
.flow-wor.role-wor-ada .role-wor-type-sad {
  background-image: url(../images/ada-sad.svg); }
.flow-wor.role-wor-ada .role-wor-type-normal {
  background-image: url(../images/ada.svg); }
.flow-wor.role-wor-ada .background-role-type-1 {
  background-image: url(../images/bg-house.svg); }
.flow-wor.role-wor-ada .background-role-phone {
  background-image: url(../images/bg-phone-women.svg); }
.flow-wor.role-wor-ada .bg-role-text-border-color {
  border-color: #8e9b64; }
.flow-wor.role-wor-ada .bg-role-color-50 {
  background-color: rgba(142, 155, 100, 0.5); }
.flow-wor.role-wor-ada .bubble-role-wor-1 {
  background-image: url(../images/bulle_1_green-50.svg); }
.flow-wor.role-wor-ada .bubble-role-wor-2 {
  background-image: url(../images/bulle_1_green-50-flip.svg); }
.flow-wor.role-wor-ada .btn-number:before {
  border-color: #8e9b64; }
.flow-wor.role-wor-ada .btn-number:hover {
  color: #fff; }
  .flow-wor.role-wor-ada .btn-number:hover::before {
    background-color: #8e9b64; }
.flow-wor.role-wor-ada .btn-next {
  border-color: #8e9b64; }
  .flow-wor.role-wor-ada .btn-next:hover {
    background-color: #8e9b64; }
.flow-wor.role-wor-ada .disc-text {
  background-color: #ed8945; }
.flow-wor.role-emp-hanna .role-emp-type-positive {
  background-image: url(../images/hanna-positive.svg); }
.flow-wor.role-emp-hanna .role-emp-type-hope {
  background-image: url(../images/hanna-hope.svg); }
.flow-wor.role-emp-hanna .role-emp-type-questioning {
  background-image: url(../images/hanna-questioning.svg); }
.flow-wor.role-emp-hanna .background-role-emp {
  background-image: url(../images/bg-farm.svg); }
.flow-wor.role-emp-alfonso .role-emp-type-positive {
  background-image: url(../images/alfonso-positive.svg); }
.flow-wor.role-emp-alfonso .role-emp-type-hope {
  background-image: url(../images/alfonso-hope.svg); }
.flow-wor.role-emp-alfonso .role-emp-type-questioning {
  background-image: url(../images/alfonso-questioning.svg); }
.flow-wor.role-emp-alfonso .background-role-emp {
  background-image: url(../images/bg-hotel-flip.svg); }
.flow-wor.role-emp-fisher .role-emp-type-positive {
  background-image: url(../images/fish-manager-positive.svg); }
.flow-wor.role-emp-fisher .role-emp-type-hope {
  background-image: url(../images/fish-manager-hope.svg); }
.flow-wor.role-emp-fisher .role-emp-type-questioning {
  background-image: url(../images/fish-manager-questioning.svg); }
.flow-wor.role-emp-fisher .background-role-emp {
  background-image: url(../images/bg-fish-inside.svg); }
.flow-wor.wor-1 .background-farm, .flow-wor.wor-1b .background-farm, .flow-wor.wor-1c .background-farm {
  width: 82%;
  top: 15%;
  left: 37%;
  height: 89%;
  background-image: url(../images/bg-farm.svg); }
.flow-wor.wor-1 .role-wor, .flow-wor.wor-1b .role-wor, .flow-wor.wor-1c .role-wor {
  height: 108%;
  position: absolute;
  top: 9%;
  width: 29%;
  right: 6%;
  background-size: cover; }
.flow-wor.wor-1.role-wor-ada .role-wor, .flow-wor.wor-1b.role-wor-ada .role-wor, .flow-wor.wor-1c.role-wor-ada .role-wor {
  height: 99%; }
.flow-wor.wor-1 .hanna, .flow-wor.wor-1b .hanna, .flow-wor.wor-1c .hanna {
  height: 144%;
  position: absolute;
  top: 15%;
  width: 22%;
  left: 9%;
  background-size: contain;
  z-index: 2;
  background-repeat: no-repeat;
  background-position: top left;
  background-image: url(../images/hanna-hope.svg); }
.flow-wor.wor-1 .bubble, .flow-wor.wor-1b .bubble, .flow-wor.wor-1c .bubble {
  position: absolute; }
.flow-wor.wor-1 .bubble-role-emp, .flow-wor.wor-1b .bubble-role-emp, .flow-wor.wor-1c .bubble-role-emp {
  width: 36%;
  height: 65%;
  left: 24%;
  top: 4%;
  padding: 3em 1.5em 3em 3.5em;
  text-align: center;
  background-image: url(../images/bulle_1_blue-wor-flip.svg); }
.flow-wor.wor-1 .bubble-role-wor-1, .flow-wor.wor-1b .bubble-role-wor-1, .flow-wor.wor-1c .bubble-role-wor-1 {
  width: 41%;
  height: 70%;
  left: 26%;
  top: 7%;
  padding: 3em 4em 3em 2em; }
.flow-wor.wor-1.bg .bubble-role-wor-1, .flow-wor.wor-1.el .bubble-role-wor-1, .flow-wor.wor-1b.bg .bubble-role-wor-1, .flow-wor.wor-1b.el .bubble-role-wor-1, .flow-wor.wor-1c.bg .bubble-role-wor-1, .flow-wor.wor-1c.el .bubble-role-wor-1 {
  font-size: 90%; }
.flow-wor.wor-1 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid; }
.flow-wor.wor-1c .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-wor.wor-1c .hanna {
  left: 7%; }
.flow-wor.wor-2 .background-fish, .flow-wor.wor-2b .background-fish, .flow-wor.wor-2c .background-fish {
  width: 62%;
  bottom: 0;
  left: 35%;
  height: 65%;
  background-image: url(../images/bg-fish.svg); }
.flow-wor.wor-2 .role-wor, .flow-wor.wor-2b .role-wor, .flow-wor.wor-2c .role-wor {
  height: 108%;
  position: absolute;
  top: 19%;
  width: 33%;
  right: 2%;
  background-size: cover; }
.flow-wor.wor-2 .paper, .flow-wor.wor-2b .paper, .flow-wor.wor-2c .paper {
  height: 48%;
  position: absolute;
  bottom: -14%;
  width: 22%;
  right: 14%;
  background-size: contain;
  z-index: 2;
  background-repeat: no-repeat;
  background-position: top left;
  background-image: url(../images/paper.svg); }
.flow-wor.wor-2 .fisher, .flow-wor.wor-2b .fisher, .flow-wor.wor-2c .fisher {
  height: 157%;
  position: absolute;
  top: 13%;
  width: 44%;
  left: -1%;
  background-size: contain;
  z-index: 2;
  background-repeat: no-repeat;
  background-position: top left;
  background-image: url(../images/fish-manager-hope.svg); }
.flow-wor.wor-2 .bubble, .flow-wor.wor-2b .bubble, .flow-wor.wor-2c .bubble {
  position: absolute; }
.flow-wor.wor-2 .bubble-role-emp, .flow-wor.wor-2b .bubble-role-emp, .flow-wor.wor-2c .bubble-role-emp {
  width: 33%;
  height: 60%;
  left: 26%;
  top: 9%;
  padding: 3em 1.5em 3em 3.5em;
  text-align: center;
  text-align: center;
  background-image: url(../images/bulle_1_blue-wor-flip.svg); }
.flow-wor.wor-2 .bubble-role-wor-1, .flow-wor.wor-2b .bubble-role-wor-1, .flow-wor.wor-2c .bubble-role-wor-1 {
  width: 41%;
  height: 70%;
  left: 26%;
  top: 7%;
  padding: 3em 4em 3em 2em; }
.flow-wor.wor-2 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid; }
.flow-wor.wor-2b .role-wor {
  top: 13%;
  width: 27%; }
.flow-wor.wor-2b.role-wor-ada .role-wor {
  width: 35%;
  right: -5%; }
.flow-wor.wor-2c .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-wor.wor-2c .bubble-role-wor-1 {
  padding: 3em 4em 3em 2.5em; }
.flow-wor.wor-3 .background-email, .flow-wor.wor-3b .background-email, .flow-wor.wor-3c .background-email {
  width: 69%;
  top: 20%;
  left: 31%;
  height: 82%;
  background-image: url(../images/bg-email.svg); }
.flow-wor.wor-3 .bubble, .flow-wor.wor-3b .bubble, .flow-wor.wor-3c .bubble {
  position: absolute; }
.flow-wor.wor-3 .bubble-role-emp, .flow-wor.wor-3b .bubble-role-emp, .flow-wor.wor-3c .bubble-role-emp {
  width: 30%;
  height: 53%;
  left: 24%;
  top: 4%;
  padding: 2em 1em 3em 3em;
  text-align: center;
  background-image: url(../images/bulle_1_blue-wor-flip.svg); }
.flow-wor.wor-3 .background-house, .flow-wor.wor-3b .background-house, .flow-wor.wor-3c .background-house {
  height: 66%;
  top: 48%;
  width: 90%;
  right: 45%;
  background-size: contain; }
.flow-wor.wor-3.role-wor-ada .background-house, .flow-wor.wor-3b.role-wor-ada .background-house, .flow-wor.wor-3c.role-wor-ada .background-house {
  width: 59%;
  left: -19%; }
.flow-wor.wor-3 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid; }
.flow-wor.wor-3 .text-mail {
  color: #767781;
  line-height: 1.2;
  font-size: 45%;
  position: absolute;
  top: 56.3%;
  left: 64%;
  z-index: 10; }
  .flow-wor.wor-3 .text-mail.subject {
    top: 56.3%; }
  .flow-wor.wor-3 .text-mail.to {
    top: 53.5%; }
.flow-wor.wor-3.ar .text-mail {
  left: inherit;
  right: 11%; }
.flow-wor.wor-3b .background-role-phone {
  width: 72%;
  height: 77%;
  left: 36%;
  top: 23%; }
.flow-wor.wor-3b .role-wor {
  height: 108%;
  position: absolute;
  top: 9%;
  width: 29%;
  right: 6%;
  background-size: cover; }
.flow-wor.wor-3b .text-phone {
  text-align: center;
  width: 11%;
  position: absolute;
  left: 49.5%;
  transform: translateX(-50%);
  bottom: 70%;
  font-size: 72%;
  color: #2ECD2E; }
.flow-wor.wor-3b.de .text-phone, .flow-wor.wor-3b.sv .text-phone, .flow-wor.wor-3b.fi .text-phone, .flow-wor.wor-3b.nl .text-phone {
  font-size: 60%; }
.flow-wor.wor-3b .bubble-role-emp {
  width: 33%;
  height: 56%;
  left: 34%;
  top: 14%;
  padding: 3em 3em 3em 1em;
  text-align: center;
  background-image: url(../images/bulle_1_blue-wor.svg); }
.flow-wor.wor-3b.role-wor-ada .background-role-phone {
  left: 43%; }
.flow-wor.wor-3b.role-wor-ada .text-phone {
  left: 41%; }
.flow-wor.wor-3c .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-wor.wor-3c .role-wor {
  height: 108%;
  position: absolute;
  top: 11%;
  width: 37%;
  right: 10%;
  background-size: cover; }
.flow-wor.wor-3c .bubble-role-wor-1 {
  width: 35%;
  height: 70%;
  left: 26%;
  top: 11%;
  padding: 3em 4em 3em 2em; }
.flow-wor.wor-4 .role-wor, .flow-wor.wor-4b .role-wor, .flow-wor.wor-4c .role-wor {
  height: 100%;
  position: absolute;
  top: 4%;
  width: 35%;
  right: -5%;
  background-size: cover; }
.flow-wor.wor-4 .background-boxes, .flow-wor.wor-4b .background-boxes, .flow-wor.wor-4c .background-boxes {
  height: 78%;
  bottom: 0;
  width: 79%;
  left: 33%;
  background-image: url(../images/bg-boxes.svg); }
.flow-wor.wor-4 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid;
  z-index: 2; }
.flow-wor.wor-4b .bubble {
  position: absolute; }
.flow-wor.wor-4b .bubble-role-emp {
  width: 36%;
  height: 61%;
  left: 24%;
  top: 4%;
  padding: 3em 1.5em 3em 3.5em;
  text-align: center;
  background-image: url(../images/bulle_1_blue-wor-flip.svg); }
.flow-wor.wor-4b.ga .bubble-role-emp, .flow-wor.wor-4b.de .bubble-role-emp {
  padding-top: 2.5em; }
.flow-wor.wor-4b.role-emp-alfonso .bubble-role-emp {
  left: 29%; }
.flow-wor.wor-4b.role-emp-fisher .bubble-role-emp {
  left: 28%; }
.flow-wor.wor-4b .role-emp {
  height: 144%;
  top: 6%;
  width: 35%;
  left: 2%; }
.flow-wor.wor-4c .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-wor.wor-4c .role-wor {
  height: 108%;
  position: absolute;
  top: 20%;
  width: 34%;
  right: 2%;
  background-size: cover; }
.flow-wor.wor-4c .bubble-role-wor-1 {
  width: 47%;
  height: 78%;
  left: 26%;
  top: 11%;
  padding: 3em 5.5em 3em 2.5em; }
.flow-wor.wor-4c .background-boxes {
  left: inherit;
  right: 65%; }
.flow-wor.wor-5 .background-hospital, .flow-wor.wor-5b .background-hospital, .flow-wor.wor-5c .background-hospital {
  width: 72%;
  bottom: -4%;
  left: 36%;
  height: 78%;
  background-image: url(../images/bg-hospital.svg); }
.flow-wor.wor-5 .role-wor, .flow-wor.wor-5b .role-wor, .flow-wor.wor-5c .role-wor {
  height: 108%;
  position: absolute;
  top: 12%;
  width: 29%;
  right: 6%;
  background-size: cover; }
.flow-wor.wor-5 .role-nurse, .flow-wor.wor-5b .role-nurse, .flow-wor.wor-5c .role-nurse {
  height: 152%;
  position: absolute;
  top: 15%;
  width: 36%;
  left: 11%;
  background-size: contain;
  z-index: 2;
  background-repeat: no-repeat;
  background-position: top left;
  background-image: url(../images/nurse.svg); }
.flow-wor.wor-5 .bubble, .flow-wor.wor-5b .bubble, .flow-wor.wor-5c .bubble {
  position: absolute; }
.flow-wor.wor-5 .bubble-role-wor-1, .flow-wor.wor-5b .bubble-role-wor-1, .flow-wor.wor-5c .bubble-role-wor-1 {
  width: 41%;
  height: 70%;
  left: 26%;
  top: 4%;
  padding: 3em 4em 3em 2em; }
.flow-wor.wor-5 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid; }
.flow-wor.wor-5b .bubble-role-nurse {
  width: 25%;
  height: 55%;
  left: 39%;
  top: 18%;
  padding: 2em 1em 3em 2.5em;
  text-align: center;
  background-image: url(../images/bulle_1_blue-wor-flip.svg);
  z-index: 10; }
.flow-wor.wor-5c .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-wor.wor-5c .role-wor {
  width: 35%; }
.flow-wor.wor-5c .bubble {
  width: 46%;
  height: 77%;
  left: 15%;
  top: 4%;
  padding: 3em 5em 3em 2em; }
.flow-wor.wor-6 .role-wor, .flow-wor.wor-6b .role-wor {
  height: 108%;
  position: absolute;
  top: 12%;
  width: 29%;
  right: 6%;
  background-size: cover; }
.flow-wor.wor-6 .bubble, .flow-wor.wor-6b .bubble {
  position: absolute; }
.flow-wor.wor-6 .background-role-emp, .flow-wor.wor-6b .background-role-emp {
  width: 105%;
  bottom: -4%;
  height: 81%;
  right: -25%; }
.flow-wor.wor-6.role-emp-hanna .background-role-emp, .flow-wor.wor-6b.role-emp-hanna .background-role-emp {
  width: 77%;
  right: -14%; }
.flow-wor.wor-6.role-emp-fisher .background-role-emp, .flow-wor.wor-6b.role-emp-fisher .background-role-emp {
  bottom: 0%;
  height: 73%;
  right: -1%;
  width: 69%; }
.flow-wor.wor-6 .bubble-role-emp {
  width: 44%;
  height: 75%;
  left: 32%;
  top: 9%;
  padding: 3em 4em 2em 2em;
  text-align: center;
  background-image: url(../images/bulle_1_blue-wor.svg); }
.flow-wor.wor-6 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid; }
.flow-wor.wor-6 .role-emp {
  width: 45%;
  top: 13%;
  height: 144%;
  right: -3%; }
.flow-wor.wor-6.role-emp-hanna .role-emp {
  right: 1%; }
.flow-wor.wor-6b .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-wor.wor-6b .role-wor {
  width: 23%;
  top: 16%;
  height: 98%;
  left: 10%;
  right: inherit; }
.flow-wor.wor-6b.role-wor-ada .role-wor {
  width: 29%;
  left: 5%; }
.flow-wor.wor-6b.role-emp-fisher .background-role-emp {
  bottom: 0%;
  height: 63%;
  right: -4%;
  width: 58%; }
.flow-wor.wor-6b .bubble {
  width: 47%;
  height: 80%;
  left: 30%;
  top: 11%;
  padding: 3em 2.5em 2em 4.9em;
  z-index: 5; }
.flow-wor.wor-7 .background-street, .flow-wor.wor-7b .background-street, .flow-wor.wor-7c .background-street {
  width: 72%;
  bottom: 0%;
  left: 33%;
  height: 72%;
  background-image: url(../images/bg-street.svg); }
.flow-wor.wor-7 .role-wor, .flow-wor.wor-7b .role-wor, .flow-wor.wor-7c .role-wor {
  height: 96%;
  position: absolute;
  top: 11%;
  width: 23%;
  right: 11%;
  background-size: cover; }
.flow-wor.wor-7 .bubble, .flow-wor.wor-7b .bubble, .flow-wor.wor-7c .bubble {
  position: absolute; }
.flow-wor.wor-7 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid; }
.flow-wor.wor-7b .role-emp {
  height: 144%;
  top: 14%;
  width: 48%;
  left: 2%; }
.flow-wor.wor-7b.role-emp-hanna .role-emp {
  height: 127%;
  left: 5%; }
.flow-wor.wor-7b .bubble-role-emp {
  z-index: 10;
  width: 35%;
  height: 70%;
  left: 31%;
  top: 9%;
  padding: 3em 1.5em 2em 3.5em;
  text-align: center;
  background-image: url(../images/bulle_1_blue-wor-flip.svg); }
.flow-wor.wor-7b .background-role-emp {
  width: 105%;
  bottom: -4%;
  height: 81%;
  right: 20%; }
.flow-wor.wor-7b.role-emp-hanna .background-role-emp {
  width: 77%;
  right: 35%; }
.flow-wor.wor-7b.role-emp-fisher .background-role-emp {
  bottom: 0%;
  height: 76%;
  right: 55%;
  width: 70%; }
.flow-wor.wor-7b .role-wor {
  height: 96%;
  position: absolute;
  top: 14%;
  width: 33%;
  right: 2%;
  background-size: cover; }
.flow-wor.wor-7c .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-wor.wor-7c .role-wor {
  width: 35%; }
.flow-wor.wor-7c.role-wor-ada .role-wor {
  right: 2%; }
.flow-wor.wor-7c .background-role-emp {
  width: 105%;
  bottom: -4%;
  height: 81%;
  right: 20%; }
.flow-wor.wor-7c .bubble-role-wor-1 {
  width: 62%;
  height: 105%;
  left: 2%;
  top: -6%;
  font-size: 95%;
  padding: 4em 5.7em 3em 2.5em; }
.flow-wor.wor-7c.uk .bubble-role-wor-1, .flow-wor.wor-7c.sr .bubble-role-wor-1, .flow-wor.wor-7c.ru .bubble-role-wor-1, .flow-wor.wor-7c.mk .bubble-role-wor-1, .flow-wor.wor-7c.el .bubble-role-wor-1, .flow-wor.wor-7c.bg .bubble-role-wor-1 {
  font-size: 90%; }
.flow-wor.wor-7c .disc-text {
  left: 34%;
  width: 20em;
  height: 20em; }
.flow-wor.wor-8 .role-wor, .flow-wor.wor-8b .role-wor {
  height: 108%;
  position: absolute;
  top: 12%;
  width: 29%;
  right: 6%;
  background-size: cover; }
.flow-wor.wor-8 .bubble, .flow-wor.wor-8b .bubble {
  position: absolute; }
.flow-wor.wor-8 .background-house, .flow-wor.wor-8b .background-house {
  height: 73%;
  bottom: 0;
  width: 124%;
  right: -14%;
  background-size: contain; }
.flow-wor.wor-8.role-wor-ada .background-house, .flow-wor.wor-8b.role-wor-ada .background-house {
  bottom: -3%;
  right: 7%; }
.flow-wor.wor-8 .bubble-role-emp {
  width: 38%;
  height: 66%;
  left: 52%;
  top: 4%;
  padding: 2em 2em 3em 4em;
  text-align: center;
  background-image: url(../images/bulle_1_blue-wor-flip.svg);
  z-index: 5; }
.flow-wor.wor-8 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 29%;
  top: 0%;
  height: 100%;
  left: 0%;
  padding: 1em;
  color: #fff;
  border-right-width: 0.1em;
  border-right-style: solid; }
.flow-wor.wor-8 .role-assist {
  height: 152%;
  position: absolute;
  top: 11%;
  width: 30%;
  left: 27%;
  background-size: contain;
  z-index: 2;
  background-repeat: no-repeat;
  background-position: top left;
  background-image: url(../images/home-assitant.svg); }
.flow-wor.wor-8b .text-1 {
  position: absolute;
  width: 100%;
  top: 0%;
  height: 100%;
  right: 0;
  text-align: right;
  padding: 1em;
  color: #4c4c4c;
  text-transform: uppercase;
  font-weight: 700; }
.flow-wor.wor-8b .role-wor {
  width: 23%;
  top: 14%;
  height: 98%;
  right: 9%; }
.flow-wor.wor-8b .bubble {
  width: 45%;
  height: 74%;
  left: 25%;
  top: 6%;
  padding: 3em 5em 2em 2.2em;
  z-index: 5; }
.flow-wor.wor-8b .background-house {
  bottom: -15%;
  right: -11%; }
.flow-wor.wor-8b.role-wor-ada .background-house {
  right: 48%;
  height: 57%; }
.flow-wor.wor-9 .background-house, .flow-wor.wor-10 .background-house, .flow-wor.wor-11 .background-house, .flow-wor.wor-12 .background-house, .flow-wor.wor-13 .background-house {
  height: 73%;
  width: 124%;
  bottom: -15%;
  right: -11%;
  background-size: contain; }
.flow-wor.wor-9.role-wor-ada .background-house, .flow-wor.wor-10.role-wor-ada .background-house, .flow-wor.wor-11.role-wor-ada .background-house, .flow-wor.wor-12.role-wor-ada .background-house, .flow-wor.wor-13.role-wor-ada .background-house {
  bottom: -3%;
  right: 39%; }
.flow-wor.wor-9 .text-1, .flow-wor.wor-10 .text-1, .flow-wor.wor-11 .text-1, .flow-wor.wor-12 .text-1, .flow-wor.wor-13 .text-1 {
  background-color: #9ba5c7;
  position: absolute;
  width: 30%;
  top: 14%;
  left: 15%;
  padding: 1.5em 1em;
  color: #fff;
  border: 0.3em solid #ed8945;
  z-index: 2;
  transform: rotate(-7deg); }
  .flow-wor.wor-9 .text-1:before, .flow-wor.wor-10 .text-1:before, .flow-wor.wor-11 .text-1:before, .flow-wor.wor-12 .text-1:before, .flow-wor.wor-13 .text-1:before {
    content: "";
    display: block;
    position: absolute;
    top: -2.3em;
    left: -2.3em;
    width: 2.5em;
    height: 2.5em;
    background: url(../images/highlight.svg) top left no-repeat;
    background-size: contain; }
.flow-wor.wor-9.el .text-1, .flow-wor.wor-10.el .text-1, .flow-wor.wor-11.el .text-1, .flow-wor.wor-12.el .text-1, .flow-wor.wor-13.el .text-1 {
  width: 34%; }
.flow-wor.wor-9 .select-container, .flow-wor.wor-10 .select-container, .flow-wor.wor-11 .select-container, .flow-wor.wor-12 .select-container, .flow-wor.wor-13 .select-container {
  position: absolute;
  bottom: 4%;
  right: 5%;
  text-align: center;
  z-index: 10;
  display: none; }
.flow-wor.wor-9 .role-wor, .flow-wor.wor-10 .role-wor, .flow-wor.wor-13 .role-wor {
  height: 108%;
  position: absolute;
  top: 18%;
  width: 26%;
  right: 16%;
  background-size: cover; }
.flow-wor.wor-9.role-wor-ada .role-wor, .flow-wor.wor-10.role-wor-ada .role-wor, .flow-wor.wor-13.role-wor-ada .role-wor {
  width: 35%;
  right: 5%; }
.flow-wor.wor-11 .text-1, .flow-wor.wor-12 .text-1 {
  width: 37%; }
.flow-wor.wor-11.el .text-1, .flow-wor.wor-11.ga .text-1, .flow-wor.wor-11.de .text-1, .flow-wor.wor-12.el .text-1, .flow-wor.wor-12.ga .text-1, .flow-wor.wor-12.de .text-1 {
  width: 40%; }
.flow-wor.wor-11 .text-1, .flow-wor.wor-12 .text-1 {
  background-color: #ed8945;
  border: 0.3em solid #3f68a9; }
  .flow-wor.wor-11 .text-1:before, .flow-wor.wor-12 .text-1:before {
    background-image: url(../images/highlight-blue.svg); }
.flow-wor.wor-11.role-wor-ada .text-1, .flow-wor.wor-12.role-wor-ada .text-1 {
  border: 0.3em solid #8e9b64; }
  .flow-wor.wor-11.role-wor-ada .text-1:before, .flow-wor.wor-12.role-wor-ada .text-1:before {
    background-image: url(../images/highlight-green.svg); }
.flow-wor.wor-11 .role-wor, .flow-wor.wor-12 .role-wor {
  height: 108%;
  position: absolute;
  top: 18%;
  width: 33%;
  right: 16%;
  background-size: cover;
  z-index: 3; }
.flow-wor.wor-11.role-wor-ada .role-wor, .flow-wor.wor-12.role-wor-ada .role-wor {
  width: 35%;
  right: 5%; }

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