html {
  box-sizing: border-box
}

/*! sanitize.css | CC0 Public Domain | github.com/jonathantneal/sanitize.css */

pre, textarea {
  overflow: auto
}

[hidden], audio:not([controls]), template {
  display: none
}

details, main, summary {
  display: block
}

input[type=number] {
  width: auto
}

input[type="*"], input[type=email], input[type=search], input[type=text] {
  -webkit-appearance: none
}

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none
}

progress {
  display: inline-block
}

small {
  font-size: 100%
}

textarea {
  resize: vertical
}

[unselectable] {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none
}

*, :after, :before {
  box-sizing: inherit;
  border-style: solid;
  border-width: 0
}

* {
  font-size: inherit;
  line-height: inherit;
  margin: 0;
  padding: 0
}

:after, :before {
  text-decoration: inherit;
  vertical-align: inherit
}

:root {
  -ms-overflow-style: -ms-autohiding-scrollbar;
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  box-sizing: border-box;
  cursor: default;
  font: 16px/1.5 sans-serif;
  text-rendering: optimizeLegibility
}

a {
  text-decoration: none
}

a:focus, a:hover {
  text-decoration: none;
  color: inherit;
}

audio, canvas, iframe, img, svg, video {
  vertical-align: middle
}

button, input, select, textarea {
  background-color: transparent;
  color: inherit;
  font-family: inherit;
  font-style: inherit;
  font-weight: inherit;
  min-height: 1.5em
}

code, kbd, pre, samp {
  font-family: monospace, monospace
}

nav ol, nav ul, ul li {
  list-style: none
}

select {
  -moz-appearance: none;
  -webkit-appearance: none
}

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

select::-ms-value {
  color: currentColor
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

::-moz-selection {
  background-color: #b3d4fc;
  text-shadow: none
}

::selection {
  background-color: #b3d4fc;
  text-shadow: none
}

@media screen {
  [hidden~=screen] {
    display: inherit
  }
  [hidden~=screen]:not(:active):not(:focus):not(:target) {
    clip: rect(0 0 0 0)!important;
    position: absolute!important
  }
}

.h-float--left {
  float: left
}

.h-float--right {
  float: right
}

.h-clear {
  clear: both
}

.h-align--left {
  text-align: left
}

.h-align--right {
  text-align: right
}

@media (max-width:600px) {
  .h-align--right {
    text-align: left
  }
}

.h-align--center {
  margin: 0 auto;
  text-align: center
}

.no-scroll {
  overflow: hidden
}

@media (max-width:768px) {
  .h-hide-mobile {
    display: none
  }
}

.h-absolute-container {
  position: relative
}

body, html {
  -webkit-overflow-scrolling: touch;
  font-family: Muli, Helvetica, Arial, sans-serif;
  -webkit-tap-highwhite-color: transparent;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility
}

@media only screen and (-webkit-min-device-pixel-ratio:1.25), only screen and (-webkit-min-device-pixel-ratio:2.0833333333333335), only screen and (min-device-pixel-ratio:1.25), only screen and (min-resolution:1.25dppx), only screen and (min-resolution:200dpi) {
  body, html {
    -moz-osx-font-smoothing: auto
  }
}

a, h1, h2, h3, h4, h5, h6, li, p {
  display: block;
  font-family: Muli, Helvetica, Arial, sans-serif
}

.heading-1 {
  font-family: Montserrat, Helvetica, Arial, sans-serif;
  font-size: 72px;
  font-weight: 500;
  line-height: 72px;
  color: #435062;
  letter-spacing: .15px
}

@media (max-width:600px) {
  .heading-1 {
    font-size: 56px;
    line-height: 56px
  }
}

@media (max-width:320px) {
  .heading-1 {
    font-size: 48px;
    line-height: 48px
  }
}

.heading-1--white {
  color: #fff
}

.heading-1--bold {
  font-weight: 700
}

.heading-1+.heading-3 {
  margin-top: 20px
}

.heading-2 {
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 60px;
  font-weight: 500;
  line-height: 60px;
  color: #435062;
  letter-spacing: 0
}

@media (max-width:600px) {
  .heading-2 {
    font-size: 48px;
    line-height: 48px
  }
}

@media (max-width:320px) {
  .heading-2 {
    font-size: 42px;
    line-height: 42px
  }
}

.heading-2--white {
  color: #fff
}

.heading-2--green {
  color: #27c79a
}

.heading-2--bold {
  font-weight: 700
}

.heading-1__highlight, .heading-2__highlight {
  position: relative
}

.heading-3 {
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 32px;
  color: #435062;
  letter-spacing: .15px
}

.heading-3--regular {
  font-weight: 400
}

.heading-3--white {
  color: #fff
}

.heading-3--light {
  color: #a1a7b0
}

.heading-4 {
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: #435062;
  letter-spacing: .2px
}

.heading-4--regular {
  font-weight: 400
}

.heading-4--white, .chat__message--sent .heading-4 {
  color: #fff
}

.heading-4--light {
  color: #a1a7b0
}

.heading-4--green {
  color: #27c79a
}

.uppercase {
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 22px;
  color: #435062;
  letter-spacing: 1px;
  text-transform: uppercase
}

.uppercase--small {
  font-size: 14px !important;
  line-height: 16px !important;
  letter-spacing: .8px !important;
}

.uppercase--medium {
  font-weight: 500;
  letter-spacing: .8px
}

.uppercase--white {
  color: #fff
}

.uppercase--red {
  color: #ff6b59
}

.uppercase--light {
  color: #a1a7b0
}

.uppercase--x-light {
  color: #e3e9ec
}

.uppercase--green {
  color: #27c79a
}

.uppercase--tag {
  padding: 5px 10px;
  padding-top: 10px;
  border: 2px solid #27c79a;
  border-radius: 5px
}

@media (max-width:670px) {
  .uppercase--tag {
    padding: 2px 6px;
    padding-top: 6px;
    font-size: 10px;
    line-height: 16px;
    border-width: 1px
  }
}

.text {
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  color: #a1a7b0;
  letter-spacing: .15px
}

.text--dark {
  color: #435062
}

.text--white {
  color: #fff
}

.text--small {
  font-size: 16px;
  line-height: 24px
}

.text--highlight-green {
  color: #27c79a
}

.text--big {
  font-size: 24px;
  line-height: 32px
}

@media (max-width:1260px) {
  .text--big {
    font-size: 16px;
    line-height: 28px
  }
}

.green {
  color: #27c79a
}

.red {
  color: #ff6b59
}

@-webkit-keyframes feedback {
  0% {
    opacity: 0;
    -webkit-transform: translate(0) scale(0);
    transform: translate(0) scale(0)
  }
  10% {
    opacity: 1;
    -webkit-transform: translate(-80px) scale(1);
    transform: translate(-80px) scale(1)
  }
  90% {
    opacity: 1;
    -webkit-transform: translate(-80px) scale(1);
    transform: translate(-80px) scale(1)
  }
  to {
    opacity: 0;
    -webkit-transform: translate(-80px) scale(0);
    transform: translate(-80px) scale(0)
  }
}

@keyframes feedback {
  0% {
    opacity: 0;
    -webkit-transform: translate(0) scale(0);
    transform: translate(0) scale(0)
  }
  10% {
    opacity: 1;
    -webkit-transform: translate(-80px) scale(1);
    transform: translate(-80px) scale(1)
  }
  90% {
    opacity: 1;
    -webkit-transform: translate(-80px) scale(1);
    transform: translate(-80px) scale(1)
  }
  to {
    opacity: 0;
    -webkit-transform: translate(-80px) scale(0);
    transform: translate(-80px) scale(0)
  }
}

@-webkit-keyframes feedbackHead {
  0% {
    opacity: 0;
    -webkit-transform: translate(0) scale(0);
    transform: translate(0) scale(0)
  }
  10% {
    opacity: 1;
    -webkit-transform: translate(80px) scale(1);
    transform: translate(80px) scale(1)
  }
  90% {
    opacity: 1;
    -webkit-transform: translate(80px) scale(1);
    transform: translate(80px) scale(1)
  }
  to {
    opacity: 0;
    -webkit-transform: translate(80px) scale(0);
    transform: translate(80px) scale(0)
  }
}

@keyframes feedbackHead {
  0% {
    opacity: 0;
    -webkit-transform: translate(0) scale(0);
    transform: translate(0) scale(0)
  }
  10% {
    opacity: 1;
    -webkit-transform: translate(80px) scale(1);
    transform: translate(80px) scale(1)
  }
  90% {
    opacity: 1;
    -webkit-transform: translate(80px) scale(1);
    transform: translate(80px) scale(1)
  }
  to {
    opacity: 0;
    -webkit-transform: translate(80px) scale(0);
    transform: translate(80px) scale(0)
  }
}

@-webkit-keyframes feedbackHeadMobile {
  0% {
    opacity: 0;
    -webkit-transform: translate(0) scale(0);
    transform: translate(0) scale(0)
  }
  10% {
    opacity: 1;
    -webkit-transform: translateY(-40px) scale(1);
    transform: translateY(-40px) scale(1)
  }
  90% {
    opacity: 1;
    -webkit-transform: translateY(-40px) scale(1);
    transform: translateY(-40px) scale(1)
  }
  to {
    opacity: 0;
    -webkit-transform: translateY(-40px) scale(0);
    transform: translateY(-40px) scale(0)
  }
}

@keyframes feedbackHeadMobile {
  0% {
    opacity: 0;
    -webkit-transform: translate(0) scale(0);
    transform: translate(0) scale(0)
  }
  10% {
    opacity: 1;
    -webkit-transform: translateY(-40px) scale(1);
    transform: translateY(-40px) scale(1)
  }
  90% {
    opacity: 1;
    -webkit-transform: translateY(-40px) scale(1);
    transform: translateY(-40px) scale(1)
  }
  to {
    opacity: 0;
    -webkit-transform: translateY(-40px) scale(0);
    transform: translateY(-40px) scale(0)
  }
}

.button {
  display: inline-block;
  width: auto;
  padding: 20px 30px;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
  color: #fff;
  border-radius: 8px;
  background: #27c79a;
  cursor: pointer;
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase
}

@media (max-width:475px) {
  .button {
    padding: 15px 20px;
    border-radius: 6px;
  }
}

.buttons--container .button {
  text-transform: inherit;
}

.button:hover {
  background: #24bd91
}

.button--white-dark {
  color: #435062;
  background: #fff
}

.button--white-dark:hover {
  background: #f7f9fa
}

.button--white-green {
  color: #27c79a;
  background: #fff
}

.button--white-green:hover {
  background: #f7f9fa
}

.button--dark {
  color: #fff;
  background: #435062
}

.button--dark:hover {
  background: #3f4b5d
}

.button--blue {
  color: #fff;
  background: #4284ff
}

.button--blue:hover {
  background: #3e7cf0
}

.button--choosen,.button--violet {
  color: #fff;
  background: #5b19aa;
}

.button--light {
  background: #C0C0C0;
}

.button--disable {
  color: #e3e9ec;
  background-color: #f7f9fa;
  pointer-events: none
}

.button--small {
  padding: 9px 18px 9px
  /* padding: 15px 18px 9px */
}

.card {
  z-index: 10;
  overflow: hidden;
  border-radius: 5px
}

.bubble, .card {
  background: #fff;
  box-shadow: 0 10px 30px 0 rgba(67, 80, 98, .08), 0 2px 4px 0 rgba(67, 80, 98, .08)
}

.bubble {
  display: inline-block;
  padding: 20px 30px;
  padding-bottom: 13.33333px;
  border-radius: 37px
}

.chat__message--sent .bubble {
   background-color: #27c79a; /* green */
  /* background-color:#1bcedf; // blue */
  /* background-color:#fd0202; // red */
  /*background-color:#5b19aa; // ultra-violet*/
}

.grades {
  position: relative;
  display: inline;
  width: 100%;
  max-width: 940px;
  opacity: 0;
  text-align: center;
  z-index: 101
}

.grades--signup {
  margin-left: 0;
  text-align: center;
  display: inline-block;
  opacity: 1
}

.list_text {
  text-align:right;
  font-size: 15px;
  margin: 0;
}

@media (max-width:768px) {
  .grades {
    margin: 0 auto
  }
}

@media (max-width:450px) {
  .grades {
    width: 100vw;
    max-width: 100vw;
    margin-left: -20px;
    text-align: left
  }
}

.besoins__done, .services__done {
  position: fixed;
  z-index: 1001;
  bottom: 80px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  transition: all .2s ease
}

.besoins__done.button--disable, .services__done.button--disable {
  bottom: 40px;
  opacity: 0
}

.grades__card {
  position: relative;
  display: inline-block;
  float: left;
  width: 220px;
  height: 220px; /* 260px */
  margin: 10px;
  padding: 20px;
  text-align: left;
  cursor: pointer;
}

.grades__card:hover .grades__outer {
  left: -100%
}

.grades--signup .grades__card {
  float: none
}

@media (max-width:768px) {
  .grades__card {
    width: calc(50% - 20px);
    max-width: 230px
  }
}

@media (max-width:450px) {
  .grades__card {
    width: calc(50% - 7.5px);
    margin: 5px;
    margin-top: 0;
    padding: 10px;
    height: 180px
  }
  .grades__card:nth-child(odd) {
    margin-left: 2.5px
  }
  .grades__card:nth-child(2n) {
    margin-right: 2.5px
  }
}

.grades__name {
  position: absolute;
  bottom: 0;
  left: 0;
  text-align: center;
  width: 100%;
  margin: 0;
  padding: 20px;
}

@media (max-width:450px) {
  .grades__name {
    padding: 10px
  }
}

.grades__actioner {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 122px; /*120px*/
}

.grades__outer {
  position: absolute;
  left: 0;
  display: block;
  width: 300%;
  height: 100%;
  transition: all .2s ease
}

.touchevents .grades__outer {
  left: -100%
}

.grades__inner {
  position: relative;
  display: block;
  float: left;
  width: 33.33333%;
  line-height: 19px;
  height: 100%
}

.grades__illustration {
  position: relative;
  overflow: hidden;
  width: 120px;
  height: 120px;
  margin: 0 auto
}

.grades__icon {
  width: 100%;
  height: auto
}

.grades__grade {
  position: relative;
  display: block;
  float: left;
  width: 33.33333%;
  height: 50%
}

.grades__radio {
  display: none
}

.grades__radio:checked~.grades__outer {
  left: -200%
}

.grades__letter {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding-top: 18px;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 32px;
  font-weight: 500;
  line-height: 100%;
  color: #435062;
  border-radius: 5px;
  cursor: pointer;
  text-align: center
}

.grades__letter--star {
  position: absolute;
  top: 9px;
  right: 5px;
  font-size: 18px
}

.grades__letter:hover {
  background-color: #f7f9fa
}

.grades__final {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 100%;
  height: 100%;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 100px;
  font-weight: 400;
  color: #435062;
  text-align: center;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%)
}

.grades__final--star {
  position: absolute;
  top: 10px;
  right: 50%;
  margin-right: -60px;
  font-size: 40px
}

.dropdown {
  z-index: 10;
  display: block;
  width: auto;
  height: auto;
  padding: 10px;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 10px 30px 0 rgba(67, 80, 98, .08), 0 2px 4px 0 rgba(67, 80, 98, .08)
}

.dropdown__item {
  width: 100%;
  height: auto;
  padding: 10px;
  padding-bottom: 6.66667px;
  border-radius: 3px;
  cursor: pointer
}

.dropdown__item:hover {
  background-color: #f7f9fa
}

.tooltip {
  /*position: absolute;
  z-index: 30;
  top: -50px;
  left: 50%;
  display: block;
  width: 110px;
  height: auto;
  margin-left: -55px;
  padding: 10px;
  opacity: 0;*/
  border-radius: 5px;
  background: #435062;
  box-shadow: 0 10px 30px 0 rgba(67, 80, 98, .08), 0 2px 4px 0 rgba(67, 80, 98, .08);
  /*pointer-events: none;
  transition: all .2s ease*/
}

.tooltip-arrow {
  display:none;
}

.tooltip-inner {
  background: #435062;
  color:#fff;
}

@media (max-width:768px) {
  .tooltip {
    display: none
  }
}

.tooltip:after, .tooltip:before {
  position: absolute;
  bottom: -6px;
  left: 50%;
  width: 15px;
  height: 15px;
  margin-left: -8px;
  border-radius: 2px;
  background: #435062;
  content: "";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg)
}

.tooltip.is-open {
  opacity: 1
}

.tooltip--medium {
  width: 190px
}

.tooltip--bottom-right {
  top: 100%;
  left: 0;
  margin-top: 15px;
  margin-left: 0;
  padding: 20px 20px 15px
}

.tooltip--bottom-right:after, .tooltip--bottom-right:before {
  top: -6px;
  bottom: inherit;
  left: 20px
}

.tooltip--bottom-right:before {
  top: -8px
}

.tooltip--bottom-left {
  top: 100%;
  right: 0;
  left: auto;
  margin-top: 15px;
  margin-left: 0;
  padding: 20px 20px 15px
}

.tooltip--bottom-left:after, .tooltip--bottom-left:before {
  top: -6px;
  bottom: inherit;
  left: calc(100% - 20px)
}

.tooltip--bottom-left:before {
  top: -8px
}

.tooltip--white {
  border: 1px solid #f6f6f6;
  background: #fff;
  box-shadow: 0 10px 30px 0 rgba(67, 79, 97, .08), 0 2px 4px 0 rgba(67, 79, 97, .08)
}

.tooltip--white:before {
  background: #f6f6f6
}

.tooltip--white:after {
  background: #fff
}

.tooltip__nav {
  position: relative;
  z-index: 1
}

.tooltip__nav-item {
  font-size: 16px;
  font-weight: 400;
  line-height: 36px;
  color: #a1a7b0;
  cursor: pointer;
  letter-spacing: .15px
}

.tooltip__nav-item:hover {
  color: #435062
}

.tooltip__hide-arrow {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 5px;
  width: 30px;
  height: 30px;
  background-color: #fff
}

.tooltip__social-icon {
  position: relative;
  float: left;
  width: 30px;
  height: 30px;
  border-radius: 5px;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 100%
}

.tooltip__social-icon--facebook {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='30px' height='30px' viewBox='0 0 30 30' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__facebook%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__facebook'%3E %3Crect id='Rectangle-12' fill-opacity='0.01' fill='%23435062' x='0' y='0' width='30' height='30' rx='4'%3E%3C/rect%3E %3Cpath d='M14.0302593,9.86046175 C14.0302593,9.86046175 13.794037,10.6567491 13.8264664,12.6181772 L11.4899998,12.6266614 L11.4899998,15.1925533 L13.8264664,15.1840686 L13.8264664,22.8571 L16.8047285,22.8571 L16.8047285,15.1925526 L19.1668301,15.1925533 L19.1668301,12.6181774 L16.8047285,12.6181775 L16.8047285,11.2199277 C16.8047285,10.3133479 17.2062894,9.44636003 18.3809153,9.44636003 L19.4899998,9.44636003 L19.4899998,7.033662 L17.2271125,7.033662 C17.2271125,7.033662 14.6826017,6.82519713 14.0302593,9.86046175 Z' id='Shape' fill='%23FFFFFF'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.tooltip__social-icon--twitter {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='30px' height='30px' viewBox='0 0 30 30' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__twitter%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__twitter'%3E %3Crect id='Rectangle-12' fill-opacity='0.01' fill='%23435062' x='0' y='0' width='30' height='30' rx='4'%3E%3C/rect%3E %3Cpath d='M21.1800378,10.3638827 C21.1800378,10.3638827 22.5046128,10.2576514 23.0361676,9.85500711 C23.0361676,9.85500711 22.9087669,10.3185255 21.3148865,11.7850739 C21.3148865,11.7850739 21.8515373,19.6983081 13.6743742,21.6363323 C13.6743742,21.6363323 9.5273843,22.5355182 6.52229644,20.2417983 C6.52229644,20.2417983 9.66811304,20.8099565 11.4380024,18.8229943 C11.4380024,18.8229943 9.15498233,18.8464686 8.43291452,16.4823258 C8.43291452,16.4823258 9.29492707,16.671314 9.80727379,16.4349793 C9.80727379,16.4349793 7.22123613,15.8906933 7.26788438,13.0296109 C7.26788438,13.0296109 7.96682406,13.5500247 8.59559538,13.4553317 C8.59559538,13.4553317 6.26631909,11.4448952 7.71045471,8.93911064 C7.71045471,8.93911064 10.8315752,12.6850556 14.6998516,12.4626463 C14.6324273,12.194482 14.595971,11.9135859 14.595971,11.6231409 C14.595971,9.76071195 16.0844029,8.25 17.9201486,8.25 C18.8476255,8.25 19.6865099,8.63593379 20.2898011,9.25780442 C20.7319794,9.26536394 21.6414242,9.1853921 22.549693,8.52532596 C22.549693,8.52572383 22.6018293,9.24706193 21.1800378,10.3638827 L21.1800378,10.3638827 L21.1800378,10.3638827 Z' id='Shape' fill='%23FFFFFF'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.tooltip__social-icon--linkedin {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='30px' height='30px' viewBox='0 0 30 30' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__linkedin%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__linkedin'%3E %3Crect id='Rectangle-12' fill-opacity='0.01' fill='%23435062' x='0' y='0' width='30' height='30' rx='4'%3E%3C/rect%3E %3Cpath d='M20.247184,16.928006 C20.247184,15.5064628 19.1420188,14.3767905 17.9114234,14.3767905 C16.9711446,14.3767905 16.1398592,14.3767905 15.5875927,15.5667319 C15.485634,15.7864171 15.3676083,16.4261074 15.3676083,16.7424911 L15.3676083,22.8860957 L12.38028,22.8860955 L12.3802798,15.0826249 L12.3802798,11.233621 L15.4823728,11.233621 L15.6353916,12.7515921 L15.7023574,12.7515921 C16.1502405,12.0303009 17.1681381,11.233621 19.0045771,11.233621 C21.2432049,11.233621 23.25,13.0055562 23.25,16.2535504 L23.25,22.8860957 L20.247184,22.8860957 L20.247184,16.928006 L20.247184,16.928006 Z M8.35802074,9.84880012 C7.38067362,9.84880012 6.75,9.15724376 6.75,8.30273652 C6.75,7.42745753 7.40108724,6.75559853 8.39813173,6.75559853 C9.39517621,6.75559853 10.0061525,7.42709939 10.0265661,8.30273652 C10.0269242,9.15724376 9.39553435,9.84880012 8.35802074,9.84880012 L8.35802074,9.84880012 L8.35802074,9.84880012 Z M7.10986452,22.8860957 L7.10986443,11.2336212 L9.73290027,11.2336213 L9.73290035,22.8860958 L7.10986452,22.8860957 L7.10986452,22.8860957 Z' id='Shape' fill='%23FFFFFF'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.tooltip__social-icon:hover {
  background-color: hsla(0, 0%, 100%, .1)
}

.tooltip__text {
  position: relative;
  z-index: 2;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: #435062;
  text-align: left;
  letter-spacing: .2px
}

.tooltip__text--alt {
  font-weight: 400;
  color: #a1a7b0
}

/*.modal {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100vh;
  opacity: 0;
  background-color: hsla(0, 0%, 100%, .96);
  pointer-events: none;
  transition: all .2s ease
}*/

.modal.is-open {
  opacity: 1;
  pointer-events: auto
}

.modal__card {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: calc(100% - 40px);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%)
}

@media (max-width:600px) {
  .modal__card {
    width: calc(100% - 20px)
  }
}

.modal__header {
  width: 100%;
  height: 62px;
  padding: 10px;
  border-bottom: 1px solid #e3e9ec
}

.modal__title {
  display: inline-block;
  padding-top: 12px;
  padding-left: 10px
}

@media (max-width:600px) {
  .modal__title {
    padding-left: 0
  }
}

.modal__toggle {
  float: right
}

.modal__toggle:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cross--grey%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='profile_cvtext' transform='translate(-922.000000, -284.000000)'%3E %3Cg id='cv-modal' transform='translate(435.000000, 263.000000)'%3E %3Cg id='modal__confirm' transform='translate(477.000000, 10.000000)'%3E %3Cg id='icon__cross--grey' transform='translate(10.000000, 11.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23A1A7B0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' transform='translate(10.001959, 10.000000) scale(-1, 1) translate(-10.001959, -10.000000) '%3E%3C/path%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23A1A7B0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.modal__content {
  padding: 40px 20px
}

@media (max-width:600px) {
  .modal__content {
    padding: 20px 10px
  }
}

.icon-link {
  font-family: Muli, Helvetica, Arial, sans-serif;
  position: relative;
  display: inline-block;
  height: 42px;
  line-height: 46px;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: .8px;
  color: #a1a7b0;
  width: auto;
  padding: 0 10px;
  padding-left: 35px;
  border-radius: 5px;
  cursor: pointer;
  background-color: hsla(0, 0%, 100%, .8)
}

@media (max-width:374px) {
  .icon-link {
    font-size: 12px
  }
}

.icon-link:before {
  position: absolute;
  content: "";
  display: block;
  height: 20px;
  width: 20px;
  top: 11px;
  left: 10px;
  background-position: 50%;
  background-size: 20px 20px;
  background-repeat: no-repeat
}

.icon-link:hover {
  background: #f7f9fa
}

@media (max-width:768px) {
  .icon-link:hover {
    background: #fff
  }
}

.icon-link--send {
  color: #27c79a
}

.icon-link--send:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__checkmark--green%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Styleguide' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='Multiple-elements' transform='translate(-60.000000, -924.000000)'%3E %3Cg id='sg__icons' transform='translate(60.000000, 878.000000)'%3E %3Cg id='icon__checkmark--green' transform='translate(0.000000, 46.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpolyline id='Path-2' stroke='%2327C79A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' points='17 3 7 15 0.999079575 9'%3E%3C/polyline%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.icon-link--close {
  color: #435062;
  font-weight: 700
}

.icon-link--close:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='14px' height='14px' viewBox='0 0 14 14' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cross--dark%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='profile-mail' transform='translate(-700.000000, -555.000000)'%3E %3Cg id='mail-modal' transform='translate(535.000000, 241.000000)'%3E %3Cg id='tag-mail' transform='translate(20.000000, 305.000000)'%3E %3Cg id='icon__cross--dark' transform='translate(145.000000, 9.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='14' height='14'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='14' height='14' rx='7'%3E%3C/rect%3E %3Cpath d='M3,3 L11,11' id='Line' stroke='%23435062' stroke-linecap='round' stroke-linejoin='round' transform='translate(7.000000, 7.000000) scale(-1, 1) translate(-7.000000, -7.000000) '%3E%3C/path%3E %3Cpath d='M3,3 L11,11' id='Line' stroke='%23435062' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.input {
  position: relative;
  display: block;
  width: 100%;
  border: 1px solid #e3e9ec;
  border-radius: 5px;
  padding: 8px 20px;
  padding-top: 12px;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #435062
}

.input::-webkit-input-placeholder {
  color: #a1a7b0
}

.input:-moz-placeholder, .input::-moz-placeholder {
  color: #a1a7b0
}

.input:-ms-input-placeholder {
  color: #a1a7b0
}

.input:focus {
  outline: none;
  border-color: #a1a7b0
}

.input--textarea {
  min-height: 118px;
  resize: none
}

.input--margin {
  margin-top: 20px
}

.input.has-error {
  width: 100%;
  position: relative;
  border-color: #ff6b59;
  color: #ff6b59;
  background-position: calc(100% - 10px) 50%;
  background-size: 20px 20px;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cross--red%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Styleguide' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='Multiple-elements' transform='translate(-100.000000, -924.000000)'%3E %3Cg id='sg__icons' transform='translate(60.000000, 878.000000)'%3E %3Cg id='icon__cross--red' transform='translate(40.000000, 46.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23FF6B59' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' transform='translate(10.001959, 10.000000) scale(-1, 1) translate(-10.001959, -10.000000) '%3E%3C/path%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23FF6B59' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.input.has-error:focus {
  border-color: #e3e9ec;
  color: #435062;
  background-image: none
}

.input__copy {
  position: absolute;
  display: block;
  right: 5px;
  top: 5px;
  box-shadow: 0 10px 30px 0 rgba(67, 80, 98, .08), 0 2px 4px 0 rgba(67, 80, 98, .08)
}

.input__copy:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='16px' height='18px' viewBox='0 0 16 18' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__copy%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E %3Cpath d='M14,15.4804099 L14,16.9934588 C14,18.1016409 13.0980496,19 11.9914698,19 L4.0085302,19 C2.8992496,19 2,18.1029399 2,16.9941413 L2,7.00585866 L2,7.00585866 C2,5.89805351 2.89861419,5 4.00950517,5 L5.56109323,5' id='path-1'%3E%3C/path%3E %3Cmask id='mask-2' maskContentUnits='userSpaceOnUse' maskUnits='objectBoundingBox' x='0' y='0' width='12' height='14' fill='white'%3E %3Cuse xlink:href='%23path-1'%3E%3C/use%3E %3C/mask%3E %3Crect id='path-3' x='5' y='1' width='13' height='15' rx='2'%3E%3C/rect%3E %3Cmask id='mask-4' maskContentUnits='userSpaceOnUse' maskUnits='objectBoundingBox' x='0' y='0' width='13' height='15' fill='white'%3E %3Cuse xlink:href='%23path-3'%3E%3C/use%3E %3C/mask%3E %3C/defs%3E %3Cg id='Styleguide' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__copy' transform='translate(-2.000000, -1.000000)'%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cuse id='Rectangle-2' stroke='%23A1A7B0' mask='url(%23mask-2)' stroke-width='2' xlink:href='%23path-1'%3E%3C/use%3E %3Cuse id='Rectangle-2' stroke='%23A1A7B0' mask='url(%23mask-4)' stroke-width='2' xlink:href='%23path-3'%3E%3C/use%3E %3Cpath d='M8.5,5.5 L14.5,5.5' id='Line' stroke='%23A1A7B0' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3Cpath d='M8.5,8.5 L14.5,8.5' id='Line' stroke='%23A1A7B0' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3Cpath d='M8.5,11.5 L14.5,11.5' id='Line' stroke='%23A1A7B0' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.tags {
  display: block;
  width: 100%;
  height: auto
}

.tags, .tags__tag {
  position: relative
}

.tags__tag {
  display: inline-block;
  font-size: 15px;
  line-height: 20px;
  padding: 6px 10px;
  padding-right: 35px;
  padding-bottom: 2px;
  margin-right: 5px;
  margin-top: 5px;
  border: 1px solid #a1a7b0;
  background: #f7f9fa;
  color: #a1a7b0;
  border-radius: 5px
}

.tags__tag:first-child {
  margin-top: 20px
}

.tags__delete {
  position: absolute;
  display: block;
  right: 10px;
  top: 7px;
  height: 14px;
  width: 14px;
  background-position: 50%;
  background-size: 14px 14px;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='14px' height='14px' viewBox='0 0 14 14' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cross--dark%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='profile-mail' transform='translate(-700.000000, -555.000000)'%3E %3Cg id='mail-modal' transform='translate(535.000000, 241.000000)'%3E %3Cg id='tag-mail' transform='translate(20.000000, 305.000000)'%3E %3Cg id='icon__cross--dark' transform='translate(145.000000, 9.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='14' height='14'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='14' height='14' rx='7'%3E%3C/rect%3E %3Cpath d='M3,3 L11,11' id='Line' stroke='%23435062' stroke-linecap='round' stroke-linejoin='round' transform='translate(7.000000, 7.000000) scale(-1, 1) translate(-7.000000, -7.000000) '%3E%3C/path%3E %3Cpath d='M3,3 L11,11' id='Line' stroke='%23435062' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E");
  cursor: pointer;
  opacity: .5
}

.tags__delete:hover {
  opacity: 1
}

.chart {
  position: absolute;
  bottom: 40px;
  left: 0
}

.chart svg {
  position: relative;
  z-index: 1;
  overflow: visible
}

.chart__line {
  position: relative;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round
}

.chart__line:before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 10px;
  height: 10px;
  border: 1px solid #27c79a;
  border-radius: 100%;
  content: ""
}

.chart__line--average {
  stroke: #e3e9ec;
  stroke-dasharray: 5, 7
}

.results-card .chart__line--average {
  stroke: #a1a7b0
}

.chart__line--score {
  -webkit-transform: translateY(-30px);
  transform: translateY(-30px);
  stroke: #27c79a
}

.chart__circle {
  fill: #fff;
  stroke-width: 2
}

.chart__circle--score {
  -webkit-transform: translateY(-30px);
  transform: translateY(-30px);
  stroke: #27c79a
}

.results-card .chart__circle--score {
  fill: #f7f9fa
}

.chart__circle--average {
  stroke: #e3e9ec
}

.results-card .chart__circle--average {
  stroke: #a1a7b0;
  fill: #f7f9fa
}

.chart:after {
  position: absolute;
  bottom: -40px;
  left: 0;
  display: block;
  width: 100%;
  height: 40px;
  border-bottom-right-radius: 5px;
  background-color: #25ba90;
  content: ""
}

.individuals .chart:after {
  border-bottom-left-radius: 5px
}

@media (max-width:600px) {
  .chart:after {
    border-bottom-left-radius: 5px
  }
}

.chart__pointer {
  position: absolute;
  display: inline-block;
  overflow: visible;
  width: auto;
  padding: 10px;
  padding-top: 8px;
  padding-bottom: 4px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  transition: all .2s ease
}

.chart__pointer:after {
  position: absolute;
  bottom: -2px;
  left: 50%;
  display: block;
  width: 10px;
  height: 10px;
  margin-left: -5px;
  border-radius: 2px;
  background: #fff;
  content: "";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg)
}

.chart__pointer--score {
  -webkit-transform: translate(-50%, -230%);
  transform: translate(-50%, -230%)
}

.chart__pointer--average {
  -webkit-transform: translate(-50%, -125%);
  transform: translate(-50%, -125%)
}

.chart__label {
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  opacity: .5;
  fill: #435062;
  text-anchor: middle
}

.loader {
  position: fixed;
  z-index: 101;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100vh;
  background: hsla(0, 0%, 100%, .96)
}

.loader__spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 50px;
  height: 50px;
  margin-top: -25px;
  margin-left: -25px;
  border: 4px solid #27c79a;
  border-radius: 100%;
  border-top-right-radius: 50%;
  -webkit-animation: rotating 1s linear infinite;
  animation: rotating 1s linear infinite
}

.loader__spinner:after {
  position: absolute;
  z-index: 100;
  top: -4px;
  left: 25px;
  width: 22px;
  height: 25px;
  background: #fff;
  content: ""
}

.loader__text {
  position: absolute;
  top: calc(50% + 50px);
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

@-webkit-keyframes rotating {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
  to {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn)
  }
}

@keyframes rotating {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
  }
  to {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn)
  }
}

.cta {
  max-width: 650px;
  margin: 45px auto;
  padding: 0 10px
}

@media (max-width:768px) {
  .cta {
    margin: 20px auto 0
  }
}

.cta--error {
  margin: -20px auto 80px;
  max-width: 400px;
  text-align: left
}

@media (max-width:768px) {
  .cta--error {
    margin: -20px auto 60px
  }
}

.cta__inner {
  border: 1px solid #e3e9ec;
  border-radius: 5px;
  background: #fff
}

.cta__header {
  padding: 17px 20px 11px;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: #435062;
  border-bottom: 1px solid #e3e9ec;
  letter-spacing: .15px
}

@media (max-width:768px) {
  .cta__header {
    font-size: 16px
  }
}

.cta--error .cta__header {
  color: #ff6b59
}

.cta__close {
  float: right;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #a1a7b0;
  cursor: pointer;
  letter-spacing: 1px;
  text-transform: uppercase
}

.cta__close:before {
  position: relative;
  top: -2px;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 3px;
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cross--grey%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='profile_cvtext' transform='translate(-922.000000, -284.000000)'%3E %3Cg id='cv-modal' transform='translate(435.000000, 263.000000)'%3E %3Cg id='modal__confirm' transform='translate(477.000000, 10.000000)'%3E %3Cg id='icon__cross--grey' transform='translate(10.000000, 11.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23A1A7B0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' transform='translate(10.001959, 10.000000) scale(-1, 1) translate(-10.001959, -10.000000) '%3E%3C/path%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23A1A7B0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 20px 20px;
  content: "";
  vertical-align: middle
}

@media (max-width:768px) {
  .cta__close:before {
    top: -1px;
    width: 14px;
    height: 14px;
    margin-right: 0;
    background-size: 14px 14px
  }
}

.cta__body {
  position: relative;
  padding: 12px 20px 12px 14px
}

.cta__image {
  width: 67px;
  height: 60px
}

.cta__description, .cta__image {
  display: inline-block;
  vertical-align: middle
}

.cta__description {
  max-width: 400px;
  margin-top: 6px;
  margin-left: 15px;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 24px;
  color: #a1a7b0;
  letter-spacing: .13px
}

@media (max-width:768px) {
  .cta__description {
    max-width: calc(100% - 85px);
    font-size: 14px;
    line-height: 22px
  }
}

.cta--error .cta__description {
  margin-left: 5px;
  text-transform: capitalize
}

.cta__button {
  position: absolute;
  top: 50%;
  right: 20px;
  padding: 15px 18px 9px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%)
}

@media (max-width:768px) {
  .cta__button {
    position: relative;
    top: inherit;
    right: inherit;
    margin-top: 9px;
    margin-left: 82px;
    -webkit-transform: translateY(0);
    transform: translateY(0)
  }
}

body, html {
  box-sizing: border-box
}

#app {
  overflow-x: hidden;
  width: 100%;
  max-width: 100vw
}

.about {
  background: #f7f9fa
}

input:-webkit-autofill {
  color: #fff!important;
  box-shadow: inset 0 0 0 1000px #27c79a;
  -webkit-text-fill-color: #fff
}

.emoji {
  display: inline;
  width: 16px;
  height: 16px;
  font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol, Android Emoji, EmojiSymbols
}

.styleguide {
  width: 100%;
  max-width: 1200px;
  margin: 80px auto
}

.styleguide__title {
  margin: 80px 0
}

.styleguide__modifiers {
  display: block;
  width: 100%;
  max-width: 1000px;
  min-height: 200px;
  margin: 40px auto;
  padding: 40px;
  border-radius: 5px;
  background-color: #f7f9fa
}

.styleguide__item {
  width: 100%;
  padding: 40px 0;
  border-bottom: 1px solid #e3e9ec
}

.styleguide__item:first-child {
  border-top: 1px solid #e3e9ec
}

.styleguide__col {
  float: left;
  width: 50%;
  padding: 40px 0
}

.styleguide__code {
  padding: 20px;
  font-family: monospace;
  color: #435062;
  border-radius: 5px;
  background-color: #f7f9fa
}

.styleguide__modifiers .styleguide__code {
  background-color: #e3e9ec
}

.bar {
  position: relative;
  z-index: 100;
  width: 100%;
  height: auto
}

.bar--fixed {
  position: fixed;
  top: 0;
  left: 0
}

.bar--green {
  background: #24bd91
}

.bar--dark {
  background: #3f4b5d
}

.bar__inner {
  position: relative;
  display: block;
  width: 100%;
  max-width: 1200px;
  height: auto;
  margin: 0 auto;
  padding: 20px
}

@media (max-width:600px) {
  .bar__inner {
    padding: 10px 20px
  }
}

.bar__inner--footer {
  padding: 40px 20px;
  border-bottom: 1px solid rgba(67, 80, 98, .2)
}

.bar__inner--footer-dark {
  border-bottom: 1px solid hsla(0, 0%, 100%, .2)
}

.bar__logo {
  padding-top: 16px
}

@media (max-width:600px) {
  .bar__logo {
    padding-left: 40px
  }
  .bar__logo--signup {
    padding-left: 0
  }
}

.bar__logo--footer {
  padding-top: 7px;
  padding-left: 0
}

.bar__logo-image--top {
  width: 50px;
  height: auto
}

.bar__logo-image {
  width: 130px;
  height: auto
}

.bar__outer {
  padding: 20px;
  opacity: .7;
  text-align: center
}

.bar__outer-image {
  width: auto;
  height: 40px;
  margin-left: 40px
}

.nav {
  position: relative;
  display: table;
  width: auto;
  height: 52px
}

.nav--right {
  float: right
}

.nav--left {
  float: left
}

@media (max-width:600px) {
  .nav--footer {
    float: none
  }
  .nav--footer:nth-child(2) {
    padding-top: 20px
  }
}

.nav__item, .nav__list {
  display: table-cell;
  vertical-align: middle
}

.nav__item {
  padding-left: 30px
}

.nav__item:first-child {
  padding: 0
}

@media (max-width:600px) {
  .nav__item:first-child {
    padding-right: 20px
  }
}

.nav__item--user {
  position: relative;
  padding-left: 60px
}

@media (max-width:768px) {
  .nav__item--user {
    padding-left: 40px!important
  }
}

.nav__item--user:before {
  position: absolute;
  top: 0;
  left: 30px;
  width: 1px;
  height: 100%;
  background-color: #e3e9ec;
  content: ""
}

@media (max-width:768px) {
  .nav__item--user:before {
    left: 20px
  }
}

.nav__item--user .tooltip {
  display: block;
  pointer-events: auto
}

.nav__item--user .tooltip:after, .nav__item--user .tooltip:before {
  left: calc(100% - 15px)
}

@media (max-width:600px) {
  .nav__item--footer {
    display: block;
    padding-top: 20px;
    padding-left: 0
  }
}

@media (max-width:768px) {
  .nav__item--topbar {
    display: table-cell;
    padding-left: 20px
  }
}

@media (max-width:600px) {
  .nav__item--topbar {
    display: none
  }
}

.nav__item--signup:first-child {
  padding: 0
}

@media (max-width:768px) {
  .nav__item--menu {
    display: block;
    padding-top: 20px;
    padding-left: 0
  }
  .nav__item--menu:last-child {
    padding-top: 40px
  }
}

@media (max-width:768px) {
  .nav__item--user-last {
    padding-top: 20px!important
  }
}

@media (max-width:768px) {
  .nav__item--mobile-user {
    padding-left: 25px!important
  }
}

@media (max-width:768px) {
  .nav__item--separator {
    position: relative;
    padding-top: 40px
  }
  .nav__item--separator:before {
    position: absolute;
    top: 20px;
    left: 0;
    display: block;
    width: 200px;
    height: 1px;
    background-color: #e3e9ec;
    content: ""
  }
}

.nav__separator {
  margin-top: 45px;
  color: #a1a7b0
}

.nav__separator:first-child {
  margin-top: 0
}

.nav__link {
  display: inline-block;
  width: auto;
  padding-top: 5px;
  cursor: pointer
}

.nav__link:hover {
  box-shadow: inset 0 -2px 0 #27c79a
}

.nav__item--user .nav__link:hover {
  box-shadow: none
}

.nav__item--user .nav__link {
  padding-top: 1px
}

.nav__link.is-active {
  box-shadow: inset 0 -2px 0 #27c79a
}

.nav__link--white {
  padding-top: 5px
}

.nav__link--white.is-active, .nav__link--white:hover {
  box-shadow: inset 0 -2px 0 #fff
}

.nav__avatar {
  width: 30px;
  height: 30px;
  margin-top: -3px;
  margin-left: 10px
}

.nav #navToggleMenu {
  display: none
}

.nav__toggle-menu {
  position: absolute;
  z-index: 20;
  top: 17px;
  display: block;
  width: 20px;
  height: 16px;
  border-top: 2px solid #435062;
  border-bottom: 2px solid #435062;
  cursor: pointer
}

@media (min-width:600px) {
  .nav__toggle-menu {
    display: none
  }
}

.nav__toggle-menu:after {
  position: absolute;
  top: calc(50% - 1px);
  display: block;
  width: 100%;
  height: 2px;
  background: #435062;
  content: ""
}

.nav__menu {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100vh;
  padding: 20px;
  padding-top: 92px;
  opacity: 0;
  background: hsla(0, 0%, 100%, .98);
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
  pointer-events: none;
  transition: all .2s ease
}

@media (min-width:600px) {
  .nav__menu {
    display: none
  }
}

#navToggleMenu:checked~.nav__menu {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
  pointer-events: auto
}

.hero {
  display: block;
  width: 100%;
  height: auto
}

.hero--about {
  background: #f7f9fa
}

.hero__inner {
  height: auto;
  padding: 80px 20px;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto
}

.hero__inner:after {
  clear: both;
  content: "";
  display: block
}

@media (max-width:600px) and (min-width:321px) {
  .hero__inner {
    padding: 120px 20px
  }
}

@media (max-width:400px) {
  .hero__inner {
    padding: 60px 20px
  }
}

.hero__inner--about {
  padding: 120px 20px
}

@media (max-width:1024px) {
  .hero__inner--about {
    padding: 120px 20px
  }
}

@media (max-width:768px) {
  .hero__inner--about {
    padding: 120px 20px;
    padding: 60px 20px;
    padding-bottom: 80px
  }
}

.hero--employers .hero__inner {
  padding: 145px 0 155px;
  border-bottom: 1px solid #e3e9ec
}

@media (max-width:768px) {
  .hero--employers .hero__inner {
    padding: 100px 20px 80px
  }
}

.hero__content {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  text-align: center
}

.hero__content--about {
  max-width: none;
  text-align: left;
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 65.88078%;
  margin-left: 8.5298%
}

.hero__content--about:last-child {
  margin-right: 0
}

@media (max-width:1024px) {
  .hero__content--about {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 82.94039%;
    margin-left: 8.5298%
  }
  .hero__content--about:last-child {
    margin-right: 0
  }
}

@media (max-width:768px) {
  .hero__content--about {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 100%;
    margin-left: 0
  }
  .hero__content--about:last-child {
    margin-right: 0
  }
}

.hero--employers .hero__content {
  max-width: none;
  text-align: left;
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 65.88078%;
  margin-left: 8.5298%
}

.hero--employers .hero__content:last-child {
  margin-right: 0
}

@media (max-width:768px) {
  .hero--employers .hero__content {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 100%;
    margin-left: 0
  }
  .hero--employers .hero__content:last-child {
    margin-right: 0
  }
}

.hero__subtitle, .hero__title {
  max-width: 500px;
  margin: 0 auto
}

.hero__subtitle {
  margin-top: 30px
}

.hero__uppercase {
  padding-bottom: 20px
}

.hero__about-title {
  color: #27c79a
}

.hero__about-text {
  display: inline-block;
  margin-top: 20px;
  line-height: 38px
}

.hero__employers-text {
  display: inline-block;
  margin-top: 30px;
  line-height: 38px
}

.hero__about-link {
  display: inline;
  color: #27c79a
}

.hero__about-link:hover {
  text-decoration: underline
}

.hero__image {
  position: relative;
  height: auto;
  margin-top: -20px;
  margin-left: 8.5298%;
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 82.94039%
}

.hero__image:last-child {
  margin-right: 0
}

@media (max-width:600px) {
  .hero__image {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 100%;
    margin-left: 0
  }
  .hero__image:last-child {
    margin-right: 0
  }
}

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

@media (max-width:600px) {
  .hero__main-image {
    width: 100%
  }
}

.hero__copy-image-holder {
  position: relative;
  width: 100%;
  height: 175px;
  margin-top: -70px
}

@media (max-width:1024px) {
  .hero__copy-image-holder {
    margin-top: -20px
  }
}

@media (max-width:600px) {
  .hero__copy-image-holder {
    height: 110px
  }
}

.hero__copy-image {
  position: absolute;
  top: 0;
  display: block;
  float: left;
  width: auto;
  height: 175px
}

@media (max-width:600px) {
  .hero__copy-image {
    height: 110px
  }
}

.hero__copy-image--first {
  left: 100px
}

@media (max-width:1024px) {
  .hero__copy-image--first {
    left: 0
  }
}

@media (max-width:320px) {
  .hero__copy-image--first {
    left: -10px
  }
}

.hero__copy-image--second {
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

@media (max-width:320px) {
  .hero__copy-image--second {
    margin-left: 15px
  }
}

.hero__copy-image--third {
  right: 100px
}

@media (max-width:1024px) {
  .hero__copy-image--third {
    right: 0
  }
}

@media (max-width:320px) {
  .hero__copy-image--third {
    right: -10px
  }
}

.hero__about-title {
  margin-top: 10px;
  line-height: 68px
}

.features-entry {
  display: block;
  width: 100%;
  height: auto;
  padding: 120px 80px 160px;
  background: #27c79a
}

@media (max-width:600px) {
  .features-entry {
    padding: 80px 20px 160px
  }
}

.features-entry__inner {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto
}

.features-entry__inner:after {
  clear: both;
  content: "";
  display: block
}

.features-entry__content {
  float: left;
  display: block;
  margin-right: 2.35765%;
  min-height: 250px;
  width: 65.88078%
}

.features-entry__side {
  float: left;
  display: block;
  width: 30%;
  text-align: center;
  padding-top: 15px;
  overflow: hidden;
}

.features-entry__content:last-child {
  margin-right: 0
}

@media (max-width:768px) {
  .features-entry__content {
    float: left;
    display: block;
    margin-right: 2.35765%;
    min-height: 0px;
    width: 100%
  }
  .features-entry__side {
    display: none;
  }
  .features-entry__content:last-child {
    margin-right: 0
  }
}

.features {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  background-color: #f7f9fa
}

.features--employers {
  margin-bottom: -322px;
  background-color: transparent
}

.features__list {
  position: relative;
  display: block;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto
}

.features__list:after {
  clear: both;
  content: "";
  display: block
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features__list {
    width: 892.5px
  }
}

@media (max-width:956.5px) and (min-width:625px) {
  .features__list {
    width: 585px
  }
}

@media (max-width:624px) {
  .features__list {
    width: calc(100% - 40px);
    margin: 0 auto
  }
}

@media (max-width:460px) {
  .features__list {
    width: calc(100% - 20px)
  }
}

.features__list--1 {
  top: -80px;
  height: 892.5px
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features__list--1 {
    height: 1200px
  }
}

@media (max-width:956.5px) and (min-width:625px) {
  .features__list--1 {
    height: 1815px
  }
}

@media (max-width:624px) {
  .features__list--1 {
    position: relative;
    height: auto
  }
}

.features__list--2 {
  height: 585px
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features__list--2 {
    height: 892.5px
  }
}

@media (max-width:956.5px) and (min-width:625px) {
  .features__list--2 {
    height: 1200px
  }
}

@media (max-width:624px) {
  .features__list--2 {
    position: relative;
    height: auto
  }
}

.features-1 {
  position: absolute;
  top: 0;
  left: 0;
  width: 277.5px;
  height: 277.5px
}

@media (max-width:624px) {
  .features-1 {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 20px 0;
    padding: 40px;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}

@media (max-width:460px) {
  .features-1 {
    padding: 40px
  }
}

.features-1__content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 30px;
  text-align: center
}

@media (max-width:624px) {
  .features-1__content {
    position: relative;
    display: block;
    width: calc(100% - 200px);
    min-width: 172px;
    margin: 0 auto;
    padding: 0;
    text-align: center
  }
}

.features-1__title {
  padding-bottom: 10px
}

.features-1__image {
  display: block;
  width: 60%;
  height: auto;
  margin: 0 auto;
  margin-top: 30px
}

@media (max-width:624px) {
  .features-1__image {
    position: relative;
    display: block;
    width: 200px;
    margin: 0 auto;
    padding: 0;
    padding-right: 0;
    text-align: center
  }
}

@media (max-width:670px) {
  .features-1__image {
    width: 150px;
    margin-bottom: 20px
  }
}

.features-2 {
  position: absolute;
  top: 0;
  left: 50%;
  width: 585px;
  height: 277.5px;
  padding: 40px;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-image: url(/images/homepage/feature__fair-results.png)
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .features-2 {
    background-image: url(/images/homepage/feature__fair-results@2x.png)
  }
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features-2 {
    right: 0;
    left: auto;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}

@media (max-width:956.5px) and (min-width:625px) {
  .features-2 {
    top: 615px;
    right: auto;
    left: 0;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}

@media (max-width:624px) {
  .features-2 {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 20px 0;
    padding: 40px;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}

@media (max-width:460px) {
  .features-2 {
    min-height: 440px;
    padding: 10px;
    background-position: 100% 100%;
    background-size: 140% auto
  }
}

.features-2__content {
  position: relative;
  width: 260px;
  text-align: left
}

@media (max-width:624px) {
  .features-2__content {
    width: 100%;
    min-width: 175px;
    max-width: 260px
  }
}

@media (max-width:460px) {
  .features-2__content {
    width: 100%;
    height: 100%;
    padding: 20px
  }
}

.features-2__title {
  padding-bottom: 20px
}

@media (max-width:460px) {
  .features-2__title {
    padding-bottom: 10px
  }
}

.features-3 {
  position: absolute;
  top: 0;
  right: 0;
  width: 277.5px;
  height: 585px;
  padding: 40px 30px;
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: 100% auto;
  background-image: url(/images/homepage/feature__uk.png)
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .features-3 {
    background-image: url(/images/homepage/feature__uk@2x.png)
  }
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features-3 {
    top: 307.5px
  }
}

@media (max-width:624px) {
  .features-3 {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 20px 0;
    padding: 40px;
    background-repeat: no-repeat;
    background-position: calc(100% - 40px) bottom;
    background-size: auto 150%;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}

@media (max-width:460px) {
  .features-3 {
    min-height: 480px;
    padding: 30px;
    padding-top: 40px;
    background-position: bottom;
    background-size: auto 88%
  }
}

.features-3__content {
  position: relative;
  width: 100%;
  text-align: left
}

@media (max-width:624px) {
  .features-3__content {
    width: 50%
  }
}

@media (max-width:460px) {
  .features-3__content {
    width: 100%;
    max-width: 230px
  }
}

.features-3__title {
  padding-top: 20px;
  padding-bottom: 10px
}

.features-4 {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 585px;
  height: 585px;
  padding: 60px;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
  background-image: url(/images/homepage/feature__seamless-signup.png)
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .features-4 {
    background-image: url(/images/homepage/feature__seamless-signup@2x.png)
  }
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features-4 {
    top: 307.5px;
    bottom: auto
  }
}

@media (max-width:956.5px) and (min-width:625px) {
  .features-4 {
    top: auto;
    bottom: 307.5px
  }
}

@media (max-width:624px) {
  .features-4 {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 20px 0;
    padding: 40px;
    background-position: bottom;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}

@media (max-width:624px) and (max-width:460px) {
  .features-4 {
    min-height: 340px;
    background-position: 50% calc(100% - 10px);
    background-size: 100% auto
  }
}

@media (max-width:624px) {
  .features-4:after {
    position: relative;
    display: block;
    padding-bottom: 100%;
    content: ""
  }
}

@media (max-width:624px) and (max-width:460px) {
  .features-4:after {
    display: none
  }
}

.features-4__content {
  width: 320px;
  margin: 0 auto;
  text-align: center
}

@media (max-width:624px) {
  .features-4__content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 40px
  }
}

@media (max-width:460px) {
  .features-4__content {
    padding: 40px 20px;
    text-align: center
  }
}

.features-4__title {
  padding-bottom: 10px
}

@media (max-width:460px) {
  .features-4__title {
    padding-bottom: 10px;
    font-size: 16px;
    line-height: 24px
  }
}

.features-4__text {
  max-width: 280px;
  margin: 0 auto
}

@media (max-width:624px) {
  .features-4__text {
    max-width: 320px;
    margin: 0 auto
  }
}

@media (max-width:460px) {
  .features-4__text {
    margin: 0
  }
}

.features-5 {
  position: absolute;
  top: 307.5px;
  left: calc(50% + 15px);
  width: 277.5px;
  height: 277.5px
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features-5 {
    top: auto;
    bottom: 0;
    left: 0
  }
}

@media (max-width:956.5px) and (min-width:625px) {
  .features-5 {
    left: 0
  }
}

@media (max-width:624px) {
  .features-5 {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 20px 0;
    padding: 40px;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
  .features-5:after {
    display: block;
    clear: both;
    content: ""
  }
}

@media (max-width:460px) {
  .features-5 {
    padding: 20px
  }
}

.features-5__content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 250px;
  padding: 20px;
  text-align: left
}

@media (max-width:624px) {
  .features-5__content {
    position: relative;
    bottom: auto;
    left: auto;
    float: right
  }
}

@media (max-width:460px) {
  .features-5__content {
    float: none;
    margin: 0 auto;
    padding: 0;
    padding-top: 20px;
    padding-left: 0;
    text-align: center
  }
}

.features-5__title {
  padding-bottom: 10px
}

.features-5__image {
  display: block;
  width: 40%;
  height: auto;
  margin: 0
}

@media (max-width:624px) {
  .features-5__image {
    float: left;
    width: calc(100% - 250px);
    margin: 0
  }
}

@media (max-width:460px) {
  .features-5__image {
    float: none;
    width: 150px;
    margin: 0 auto
  }
}

.features-6 {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 585px;
  height: 277.5px;
  padding: 40px;
  background: #ffe07a
}

@media (max-width:956.5px) and (min-width:625px) {
  .features-6 {
    left: 0
  }
}

@media (max-width:624px) {
  .features-6 {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 20px 0;
    padding: 40px;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}

@media (max-width:460px) {
  .features-6 {
    padding: 40px 0
  }
}

.features-6__content {
  position: relative;
  width: 50%;
  height: 100%
}

@media (max-width:460px) {
  .features-6__content {
    width: 100%;
    padding-top: 190px;
    text-align: center
  }
}

.features-6__title {
  position: absolute;
  top: 0;
  left: 0;
  width: 160px
}

@media (max-width:624px) {
  .features-6__title {
    position: relative
  }
}

@media (max-width:460px) {
  .features-6__title {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto
  }
}

.features-6__text {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 260px;
  color: rgba(67, 80, 98, .75)
}

@media (max-width:624px) {
  .features-6__text {
    position: relative;
    width: 170px;
    padding-top: 10px
  }
}

@media (max-width:460px) {
  .features-6__text {
    width: 100%;
    max-width: 210px;
    margin: 0 auto
  }
}

.features-6__image {
  position: absolute;
  top: 40px;
  right: 40px;
  width: auto;
  height: calc(100% - 80px);
  border-radius: 50%;
  box-shadow: 0 10px 30px 0 rgba(67, 80, 98, .08), 0 2px 4px 0 rgba(67, 80, 98, .08)
}

@media (max-width:624px) {
  .features-6__image {
    top: 30px;
    right: 30px;
    height: calc(100% - 60px)
  }
}

@media (max-width:460px) {
  .features-6__image {
    position: absolute;
    top: 40px;
    left: 50%;
    width: 160px;
    height: 160px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
  }
}

.features-7 {
  position: relative;
  display: block;
  height: 585px;
  margin: 30px auto;
  margin-top: -50px;
  padding: 80px;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  background-image: url(/images/homepage/feature__befound.png)
}

.features-7:after {
  clear: both;
  content: "";
  display: block
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .features-7 {
    background-image: url(/images/homepage/feature__befound@2x.png)
  }
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features-7 {
    width: 893px
  }
}

@media (max-width:956.5px) and (min-width:671px) {
  .features-7 {
    padding: 60px;
    border-radius: 0
  }
}

@media (max-width:600px) {
  .features-7 {
    height: auto;
    margin: 10px auto;
    margin-top: -80px;
    padding: 0;
    border-radius: 0;
    background-position: 50%;
    background-image: url(/images/homepage/feature__befound--mobile.png)
  }
}

@media only screen and (max-width:600px) and (-webkit-min-device-pixel-ratio:2), only screen and (max-width:600px) and (min--moz-device-pixel-ratio:2), only screen and (max-width:600px) and (min-device-pixel-ratio:2), only screen and (max-width:600px) and (min-resolution:2dppx), only screen and (max-width:600px) and (min-resolution:192dpi) {
  .features-7 {
    background-image: url(/images/homepage/feature__befound--mobile@2x.png)
  }
}

.features-7__content {
  width: 370px;
  height: auto
}

@media (max-width:600px) {
  .features-7__content {
    width: 100%;
    padding: 40px 20px;
    background: rgba(67, 80, 98, .7)
  }
}

.features-7__title {
  margin-top: 40px;
  margin-bottom: 20px
}

@media (max-width:670px) {
  .features-7__title {
    max-width: 300px
  }
}

.features-7__text {
  margin-bottom: 40px
}

@media (max-width:670px) {
  .features-7__text {
    max-width: 300px
  }
}

.features-8 {
  position: absolute;
  top: 0;
  left: 0;
  width: 585px;
  height: 585px;
  padding: 60px;
  background-repeat: no-repeat;
  background-position: center 160px;
  background-size: 100%;
  background-image: url(/images/homepage/feature__profiles.png)
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .features-8 {
    background-image: url(/images/homepage/feature__profiles@2x.png)
  }
}

@media (max-width:956.5px) and (min-width:625px) {
  .features-8 {
    top: auto;
    bottom: 0
  }
}

@media (max-width:624px) {
  .features-8 {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 20px 0;
    padding: 40px;
    background-position: center 120px;
    background-size: 100% auto;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
  .features-8:after {
    position: relative;
    display: block;
    padding-bottom: 100%;
    content: ""
  }
}

@media (max-width:624px) and (max-width:460px) {
  .features-8:after {
    display: none
  }
}

@media (max-width:624px) and (min-width:460px) {
  .features-8 {
    background-position: center 150px
  }
}

@media (max-width:460px) {
  .features-8 {
    min-height: 400px;
    background-position: center 150px
  }
}

.features-8__content {
  width: 320px;
  margin: 0 auto;
  text-align: center
}

@media (max-width:624px) {
  .features-8__content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 40px
  }
}

@media (max-width:460px) {
  .features-8__content {
    padding: 40px 10px;
    text-align: center
  }
}

.features-8__title {
  padding-bottom: 10px
}

@media (max-width:460px) {
  .features-8__title {
    padding-bottom: 10px;
    font-size: 16px;
    line-height: 24px
  }
}

.features-8__text {
  width: 220px;
  margin: 0 auto
}

@media (max-width:624px) {
  .features-8__text {
    max-width: 320px;
    margin: 0 auto
  }
}

@media (max-width:460px) {
  .features-8__text {
    margin: 0
  }
}

.features-9 {
  position: absolute;
  top: 0;
  left: calc(50% + 15px);
  width: 277.5px;
  height: 277.5px
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features-9 {
    right: 0;
    left: auto
  }
}

@media (max-width:956.5px) and (min-width:625px) {
  .features-9 {
    right: auto;
    left: 0
  }
}

@media (max-width:624px) {
  .features-9 {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 20px 0;
    padding: 40px;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}

@media (max-width:460px) {
  .features-9 {
    padding: 40px
  }
}

.features-9__content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 30px;
  text-align: center
}

@media (max-width:624px) {
  .features-9__content {
    position: relative;
    display: block;
    width: calc(100% - 200px);
    min-width: 220px;
    margin: 0 auto;
    padding: 0;
    text-align: center
  }
}

.features-9__title {
  padding-bottom: 5px
}

.features-9__image {
  display: block;
  width: 45%;
  height: auto;
  margin: 0 auto;
  margin-top: 20px
}

@media (max-width:624px) {
  .features-9__image {
    position: relative;
    display: block;
    width: 200px;
    margin: 0 auto;
    padding: 0;
    padding-right: 0;
    text-align: center
  }
}

@media (max-width:460px) {
  .features-9__image {
    width: 150px;
    margin-bottom: 20px
  }
}

.features-10 {
  position: absolute;
  top: 0;
  right: 0;
  width: 275.5px;
  height: 585px;
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: 100% auto;
  background-image: url(/images/homepage/feature__individual-scores.png)
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .features-10 {
    background-image: url(/images/homepage/feature__individual-scores@2x.png)
  }
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features-10 {
    top: 307.5px
  }
}

@media (max-width:624px) {
  .features-10 {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 20px 0;
    padding: 40px;
    background-repeat: no-repeat;
    background-position: 100% 100%;
    background-size: 100% auto;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    background-image: url(/images/homepage/feature__fair-results.png)
  }
}

@media only screen and (max-width:624px) and (-webkit-min-device-pixel-ratio:2), only screen and (max-width:624px) and (min--moz-device-pixel-ratio:2), only screen and (max-width:624px) and (min-device-pixel-ratio:2), only screen and (max-width:624px) and (min-resolution:2dppx), only screen and (max-width:624px) and (min-resolution:192dpi) {
  .features-10 {
    background-image: url(/images/homepage/feature__fair-results@2x.png)
  }
}

@media (max-width:460px) {
  .features-10 {
    min-height: 440px;
    padding: 30px;
    background-position: 100% 100%;
    background-size: auto 62%
  }
}

.features-10__content {
  padding: 30px
}

@media (max-width:624px) {
  .features-10__content {
    width: 50%;
    padding: 0
  }
}

@media (max-width:460px) {
  .features-10__content {
    width: 100%;
    max-width: 230px
  }
}

.features-10__title {
  padding-bottom: 10px
}

.features-11 {
  position: absolute;
  bottom: 0;
  left: calc(50% + 15px);
  width: 277.5px;
  height: 277.5px
}

@media (max-width:1260px) and (min-width:956.5px) {
  .features-11 {
    left: 311px
  }
}

@media (max-width:956.5px) and (min-width:625px) {
  .features-11 {
    top: 307.5px;
    left: 0
  }
}

@media (max-width:624px) {
  .features-11 {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 20px 0;
    padding: 40px;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}

@media (max-width:460px) {
  .features-11 {
    padding: 20px;
    padding-top: 40px
  }
}

.features-11__content {
  position: absolute;
  top: 0;
  left: 0;
  width: 250px;
  padding: 20px;
  text-align: left
}

@media (max-width:624px) {
  .features-11__content {
    position: relative;
    margin-bottom: 80px;
    padding: 0
  }
}

.features-11__title {
  padding-bottom: 10px
}

.features-11__image {
  position: absolute;
  z-index: 10;
  bottom: 18px;
  left: -30px;
  width: 337.5px;
  height: auto
}

@media (max-width:1024px) {
  .features-11__image {
    display: none
  }
}

@media (max-width:956.5px) and (min-width:625px) {
  .features-11__image {
    display: block
  }
}

.testimonials {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  margin-top: -80px;
  padding: 20px;
  padding-top: 240px;
  padding-bottom: 80px;
  background-color: #fff;
  transition: all .2s ease
}

@media (max-width:1024px) and (min-width:600px) {
  .testimonials {
    padding: 20px;
    padding-top: 180px;
    padding-bottom: 80px
  }
}

@media (max-width:600px) {
  .testimonials {
    padding: 20px;
    padding-top: 120px;
    padding-bottom: 60px
  }
}

@media (max-width:400px) {
  .testimonials {
    padding-top: 80px;
    padding-bottom: 60px
  }
}

@media (max-width:600px) {
  .testimonials__title {
    width: 80%;
    margin: 0 auto;
    text-align: center
  }
}

.testimonials__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  max-width: 1170px;
  margin: 0 auto;
  margin-top: 80px;
  padding: 0;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap
}

.testimonials__list:first-child {
  margin-top: 30px
}

@media only screen and (max-width:1024px) {
  .testimonials__list {
    width: 100%
  }
}

@media (max-width:460px) {
  .testimonials__list {
    margin-top: 40px
  }
}

.testimonials__item {
  position: relative;
  width: calc(33.33333% - 30px);
  margin: 15px;
  margin-top: 0;
  margin-bottom: 30px;
  padding: 30px;
  box-shadow: 0 10px 30px 0 rgba(67, 80, 98, .02), 0 2px 4px 0 rgba(67, 80, 98, .08);
  vertical-align: top;
  -ms-flex-item-align: start;
  align-self: flex-start;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden
}

@media only screen and (max-width:1024px) {
  .testimonials__item {
    margin: 0 0 20px
  }
}

@media only screen and (max-width:768px) {
  .testimonials__item {
    width: 100%;
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%
  }
}

@media only screen and (max-width:500px) {
  .testimonials__item {
    padding-left: 20px
  }
}

.testimonials__header {
  position: relative
}

.testimonials__header:after {
  display: block;
  clear: both;
  content: ""
}

.testimonials__photo {
  position: relative;
  display: inline-block;
  float: left;
  overflow: hidden;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #f7f9fa
}

.testimonials__user-photo {
  width: auto;
  height: 100%
}

.testimonials__name {
  position: relative;
  display: inline-block;
  float: left;
  width: auto;
  height: 50px;
  padding-top: 7px;
  padding-left: 20px
}

@media only screen and (max-width:768px) {
  .testimonials__name {
    padding-left: 10px
  }
}

.testimonials__text {
  line-height: 20px
}

.testimonials__content {
  padding-top: 30px
}

.testimonials__fader {
  position: absolute;
  z-index: 100;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 200px;
  background-image: linear-gradient(-180deg, hsla(0, 0%, 100%, 0), #fff)
}

.testimonials__open {
  position: absolute;
  left: 50%;
  margin-top: 150px;
  font-weight: 700;
  color: #435062;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

.testimonials__open:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__down-arrow%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Landing-Page' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='landing-page' transform='translate(-710.000000, -4218.000000)'%3E %3Cg id='testimonials' transform='translate(0.000000, 3547.000000)'%3E %3Cg id='show-more' transform='translate(648.000000, 644.000000)'%3E %3Cg id='icon__down-arrow' transform='translate(62.000000, 27.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpolyline id='Path-4' stroke='%2320C799' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' points='5 8 10 13 15 8'%3E%3C/polyline%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E");
  transition: all .2s ease
}

.prefooter {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  padding: 120px 20px;
  background: #27c79a
}

@media (max-width:450px) {
  .prefooter {
    padding: 80px 20px
  }
}

@media (max-width:320px) {
  .prefooter {
    padding: 80px 10px
  }
}

.prefooter--profile {
  margin-top: -80px;
  padding: 200px 20px;
  padding-bottom: 120px;
  background: #435062
}

@media (max-width:450px) {
  .prefooter--profile {
    padding: 160px 20px;
    padding-bottom: 120px
  }
}

@media (max-width:320px) {
  .prefooter--profile {
    padding: 160px 10px;
    padding-bottom: 120px
  }
}

.prefooter__inner {
  width: 100%;
  max-width: 380px;
  margin: 0 auto;
  text-align: center
}

.prefooter__inner--profile {
  max-width: 770px;
  text-align: left
}

@media (min-width:1260px) {
  .prefooter__inner--profile {
    text-align: center
  }
}

.prefooter__text {
  padding-top: 10px;
  padding-bottom: 30px;
  font-size: 16px;
  line-height: 26px
}

.prefooter__button--profile:last-child {
  width: 109px;
  margin-left: 20px
}

.target {
  position: relative;
  display: inline-block;
  width: 100%;
  height: auto;
  padding: 160px 80px;
  background: #fff;
  text-align: center
}

@media (max-width:600px) {
  .target {
    padding: 80px 20px
  }
}

.target__row {
  display: inline-block;
  text-align: left;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto
}

.target__row:after {
  clear: both;
  content: "";
  display: block
}

.target__row--second {
  margin-top: 120px
}

@media (max-width:600px) {
  .target__row--second {
    margin-top: 80px
  }
}

.target__image {
  display: inline-block;
  float: none;
  height: auto;
  vertical-align: middle;
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 23.23176%;
  margin-left: 8.5298%
}

.target__image:last-child {
  margin-right: 0
}

.target__image--second {
  margin-left: 68.23843%
}

@media (max-width:1024px) {
  .target__image {
    padding-bottom: 40px;
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 31.76157%;
    margin-left: 0
  }
  .target__image:last-child {
    margin-right: 0
  }
  .target__image--second {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 31.76157%;
    margin-left: 59.70863%
  }
  .target__image--second:last-child {
    margin-right: 0
  }
}

@media (max-width:800px) {
  .target__image {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 31.76157%;
    margin-left: 8.5298%
  }
  .target__image:last-child {
    margin-right: 0
  }
}

@media (max-width:600px) {
  .target__image {
    width: 200px;
    margin-left: -30px;
    margin-left: 0
  }
}

.target__content {
  display: inline-block;
  float: none;
  height: auto;
  vertical-align: middle;
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 44.55627%;
  margin-left: 8.5298%
}

.target__content:last-child {
  margin-right: 0
}

.target__content--second {
  margin-left: -85.29804%
}

@media (max-width:1024px) {
  .target__content {
    margin-left: 8.5298%
  }
  .target__content--second {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 48.82117%;
    margin-left: -93.82785%
  }
  .target__content--second:last-child {
    margin-right: 0
  }
}

@media (max-width:800px) {
  .target__content {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 82.94039%;
    margin-left: 8.5298%
  }
  .target__content:last-child {
    margin-right: 0
  }
}

@media (max-width:600px) {
  .target__content {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 100%;
    margin-left: 0
  }
  .target__content:last-child {
    margin-right: 0
  }
}

.target__title {
  padding-bottom: 20px
}

.sponsor {
  position: relative;
  padding: 0 40px;
  background: #fff
}

@media (max-width:750px) {
  .sponsor {
    padding: 10px
  }
}

.sponsor:after {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 50%;
  background: #27c79a;
  content: ""
}

.sponsor__card {
  position: relative;
  display: block;
  width: 100%;
  max-width: 970px;
  margin: 0 auto;
  padding: 80px 100px
}

@media (max-width:1024px) {
  .sponsor__card {
    padding: 80px
  }
}

@media (max-width:900px) {
  .sponsor__card {
    padding: 80px 60px;
    padding: 60px
  }
}

@media (max-width:600px) {
  .sponsor__card {
    padding: 40px 20px
  }
}

.sponsor__id {
  float: left;
  width: 20%
}

@media (max-width:750px) {
  .sponsor__id {
    float: none;
    width: 100%
  }
}

.sponsor__label {
  white-space: nowrap
}

.sponsor__image {
  width: auto;
  height: 50px;
  margin-top: 50px
}

.sponsor__content {
  float: left;
  width: 65%;
  margin-left: 15%
}

@media (max-width:900px) {
  .sponsor__content {
    width: 60%;
    margin-left: 20%
  }
}

@media (max-width:750px) {
  .sponsor__content {
    float: none;
    width: 100%;
    margin-left: 0;
    padding-top: 50px
  }
}

.sponsor__text {
  padding-bottom: 40px
}

.sponsor__quoter {
  padding-bottom: 10px
}

.chat {
  display: block;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
  padding: 0;
  padding-bottom: calc(50vh - 55px)
}

.chat--404 {
  padding-bottom: 120px
}

.chat__message-holder {
  position: relative;
  display: block;
  height: auto;
  padding: 0 20px
}

.chat__message-holder:after {
  display: block;
  clear: both;
  content: ""
}

.chat__message-holder--school {
  z-index: 1
}

.chat__edit-message {
  position: absolute;
  z-index: 1000;
  right: 30px;
  bottom: -48px;
  width: 100%;
  height: 38px;
  font-size: 12px;
  color: #27c79a;
  cursor: pointer;
  text-align: right
}

.chat__edit-message:hover {
  text-decoration: underline
}

.chat__error-message {
  position: absolute;
  bottom: -30px;
  left: 0;
  display: none;
  width: 100%;
  font-size: 12px;
  color: #ff6b59;
  text-align: right
}

.chat__message-holder--invalid .chat__error-message {
  display: block
}

.chat__error-message:before {
  position: relative;
  display: inline-block;
  float: right;
  width: 20px;
  height: 20px;
  margin-left: 10px;
  padding: 1px 8px;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #ff6b59;
  border: 1px solid #ff6b59;
  border-radius: 100%;
  content: "!"
}

.chat__message {
  position: relative;
  opacity: 0;
  -webkit-transform: translateY(25px);
  transform: translateY(25px)
}
.chat__message__min {
  max-width: 260px;
}

@media (min-width:475px) {
  .chat__message__min {
    max-width: 340px;
  }
}

.chat__message:after {
  clear: both
}

.chat__message--received {
  margin-bottom: 20px
}

.chat__message--received .chat__message:after {
  position: absolute;
  bottom: 0;
  left: -50px;
  display: block;
  width: 95px;
  height: 50px;
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  background-image: url(images/bubble-tail--white.png)
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .chat__message--received .chat__message:after {
    background-image: url(images/bubble-tail--white@2x.png)
  }
}
.chat__message--sent .chat__message {
  z-index: 1;
  float: right;
  margin-bottom: 20px
}

.chat__message--sent .chat__message:after {
  position: absolute;
  right: -50px;
  bottom: 0;
  display: block;
  width: 95px;
  height: 50px;
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  /* background-image: url(images/bubble-tail--violet.png) */
  background-image: url(images/bubble-tail--green.png)
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .chat__message--sent .chat__message:after {
    /* background-image: url(images/bubble-tail--violet@2x.png) */
    background-image: url(images/bubble-tail--green@2x.png)
  }
}

.chat__message--typing {
  position: absolute;
  z-index: 100;
  top: 0;
  right: 20px;
  padding: 20px
}

.chat__message--loading {
  position: relative;
  top: auto;
  right: auto;
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0)
}

.chat__message--404 {
  opacity: 1
}

.chat__message--404-home {
  width: 181px
}

.chat__message--404-profile {
  width: 198px
}

.buttons--container {
  position: relative;
  opacity: 0;
  z-index: 1;
  float: right;
  margin-bottom: 20px;
  -webkit-transform: translateY(25px);
  transform: translateY(25px);
}

.chat__message-dots {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: 0 4px;
  border-radius: 100%;
  background-color: hsla(0, 0%, 100%, 0);
  -webkit-animation: typing_dots 1.5s linear infinite;
  animation: typing_dots 1.5s linear infinite;
  direction: rtl
}

.chat__message-dots:nth-child(2) {
  -webkit-animation-delay: .3s;
  animation-delay: .3s
}

.chat__message-dots:first-child {
  -webkit-animation-delay: .5s;
  animation-delay: .5s
}

.chat__message-dots--dark {
  background-color: transparent;
  -webkit-animation: loading_dots 1.5s linear infinite;
  animation: loading_dots 1.5s linear infinite
}

@-webkit-keyframes typing_dots {
  0% {
    background: hsla(0, 0%, 100%, 0)
  }
  50% {
    background: hsla(0, 0%, 100%, .4)
  }
  to {
    background: hsla(0, 0%, 100%, 0)
  }
}

@keyframes typing_dots {
  0% {
    background: hsla(0, 0%, 100%, 0)
  }
  50% {
    background: hsla(0, 0%, 100%, .4)
  }
  to {
    background: hsla(0, 0%, 100%, 0)
  }
}

@-webkit-keyframes loading_dots {
  0% {
    background: transparent
  }
  50% {
    background: rgba(0, 0, 0, .2)
  }
  to {
    background: transparent
  }
}

@keyframes loading_dots {
  0% {
    background: transparent
  }
  50% {
    background: rgba(0, 0, 0, .2)
  }
  to {
    background: transparent
  }
}

.chat__message-action {
  position: absolute;
  z-index: 100;
  top: 10px;
  right: 10px;
  display: block;
  float: left;
  width: 24px;
  height: 24px;
  border-radius: 3px;
  cursor: pointer;
  transition: all .2s ease
}

.chat__message-action--delete {
  opacity: .4;
  background: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='14px' height='14px' viewBox='0 0 14 14' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cross--dark-small%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Styleguide' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__cross--dark-small'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='14' height='14'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='14' height='14' rx='7'%3E%3C/rect%3E %3Cpath d='M3.00391789,3 L11,11' id='Line' stroke='%23435062' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' transform='translate(7.001959, 7.000000) scale(-1, 1) translate(-7.001959, -7.000000) '%3E%3C/path%3E %3Cpath d='M3.00391789,3 L11,11' id='Line' stroke='%23435062' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 14px 14px;
  cursor: pointer
}

.chat__message-action--delete:hover {
  opacity: 1;
  background-color: #f7f9fa
}

.chat__textaera {
  width: 100%;
  min-height: 118px;
  margin-bottom: 7px;
  padding: 0;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  color: #fff;
  border-bottom: 1.5px solid #fff;
  border-radius: 0;
  resize: none;
  letter-spacing: .2px
}

.chat__input {
  width: 100%;
  height: 30px;
  min-height: 0;
  margin-bottom: 7px;
  padding: 0;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #fff;
  border-bottom: 1.5px solid #fff;
  border-radius: 0;
  resize: none;
  letter-spacing: .2px
}

.chat__input::-webkit-input-placeholder, .chat__textaera::-webkit-input-placeholder {
  color: hsla(0, 0%, 100%, .5)
}

.chat__input:-moz-placeholder, .chat__input::-moz-placeholder, .chat__textaera:-moz-placeholder, .chat__textaera::-moz-placeholder  {
  color: hsla(0, 0%, 100%, .5)
}

.chat__input:-ms-input-placeholder, .chat__textaera:-ms-input-placeholder {
  color: hsla(0, 0%, 100%, .5)
}

.chat__input:focus, .chat__textaera:focus {
  outline: none
}

.chat__input--textarea {
  margin-bottom: 3px;
  padding-top: 3px;
  line-height: 30px
}

.chat__select {
  width: 160px;
  background-repeat: no-repeat;
  background-position: 100% 12px;
  background-size: 12px 6px;
  cursor: pointer;
  background-image: url(images/arrow__down--white.png)
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .chat__select {
    background-image: url(images/arrow__down--white@2x.png)
  }
}

.chat__select:invalid {
  color: hsla(0, 0%, 100%, .5)
}

.chat__select--desktop {
  display: inline-block;
  line-height: 30px
}

.chat__link {
  position: relative;
  display: inline-block
}

.chat__link:after {
  position: absolute;
  top: 3px;
  right: -30px;
  display: block;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 20px 20px;
  content: "";
  background-image: url(/images/arrow__down--green.png);
  transition: all .2s ease
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .chat__link:after {
    background-image: url(/images/arrow__down--green@2x.png)
  }
}

.chat__link:hover:after {
  right: -40px
}

.chat__school-list {
  width: 100%;
  max-height: 160px
}

.chat__dropdown-list, .chat__school-list {
  position: absolute;
  left: 10px;
  overflow: hidden;
  overflow-y: auto
}

.chat__dropdown-list {
  display: none;
  width: auto;
  min-width: 120px;
  height: auto;
  max-height: 120px
}

.chat__dropdown-list--open {
  display: block
}

.chat__alevel {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis
}

.chat-progress {
  position: fixed;
  z-index: 1000;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 80px;
  background-image: linear-gradient(-180deg, hsla(0, 0%, 100%, 0), #fff)
}

@media (max-width:768px) {
  .touchevents .chat-progress {
    background: none
  }
}

.chat-progress__bar {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 3px;
  background: #e3e9ec
}

.chat-progress__bar:after {
  position: relative;
  display: block;
  width: 16.7%;
  height: 3px;
  /* background: #5b19aa;*/ /* ultra-violet */
  background: #27c79a; /* green */
  box-shadow: 0 -10px 30px 0 rgba(38, 199, 154, .1), 0 -2px 4px 0 rgba(38, 199, 154, .2);
  content: "";
  transition: all .2s ease
}

.chat-progress__bar--step-1:after {
  width: 16.7%
}

.chat-progress__bar--step-2:after {
  width: 33.4%
}

.chat-progress__bar--step-3:after {
  width: 50%
}

.chat-progress__bar--step-4:after {
  width: 66.7%
}

.chat-progress__bar--step-5:after {
  width: 83.4%
}

.chat-progress__bar--step-6:after {
  width: 100%
}

.chat-progress__steps {
  z-index: 30;
  width: 100%
}

.chat-progress__step, .chat-progress__steps {
  position: absolute;
  bottom: 0;
  left: 0;
  height: auto
}

.chat-progress__step {
  width: auto
}

.chat-progress__step, .chat-progress__step:after {
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

.chat-progress__step:after {
  position: relative;
  bottom: 0;
  left: 50%;
  display: block;
  width: 3px;
  height: 3px;
  background: rgba(67, 80, 98, .5);
  content: ""
}

.chat-progress__step--1 {
  left: 16.7%
}

.chat-progress__step--2 {
  left: 33.3%
}

.chat-progress__step--3 {
  left: 50%
}

.chat-progress__step--4 {
  left: 66.7%
}

.chat-progress__step--5 {
  left: 83.3%
}

.chat-progress__step-text {
  color: #e3e9ec
}

@media (max-width:475px) {
  .chat-progress__step-text {
    display: none
  }
}

.chat-progress__step-text.is-active {
  color: #435062
}

@media (max-width:475px) {
  .chat-progress__step-text.is-active {
    display: block
  }
}

.profile-head {
  position: relative;
  display: block;
  padding-top: 40px;
  padding-bottom: 200px
}

@media (max-width:600px) {
  .profile-head {
    padding-bottom: 160px
  }
}

.profile-head__inner {
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
  padding: 0 20px
}

.profile-head__badge {
  display: block;
  width: 280px;
  height: 280px;
  margin: 0 auto;
  border-radius: 100%;
  background-color: #f7f9fa;
  box-shadow: 0 10px 30px 0 rgba(67, 80, 98, .08), 0 2px 4px 0 rgba(67, 80, 98, .08)
}

@media (max-width:600px) {
  .profile-head__badge {
    width: 180px;
    height: 180px
  }
}

.profile-head__name {
  width: 100%;
  height: auto;
  margin-top: 40px
}

.profile-options {
  position: absolute;
  bottom: -35px;
  left: 50%;
  display: block;
  overflow: visible;
  width: calc(100% - 20px);
  max-width: 770px;
  padding: 10px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

@media (min-width:1260px) {
  .profile-options {
    width: 100%;
    max-width: 1000px
  }
}

@media (max-width:768px) {
  .profile-options {
    bottom: -65px
  }
}

@media (max-width:525px) {
  .profile-options {
    bottom: -92px
  }
}

.profile-options__url {
  position: relative;
  float: left;
  width: 100%;
  max-width: 350px;
  height: 50px;
  border: 1px solid #e3e9ec;
  border-radius: 5px;
  cursor: pointer
}

.profile-options__url:hover .profile-options__copy {
  background: #f7f9fa
}

@media (max-width:768px) {
  .profile-options__url {
    max-width: 100%
  }
}

.profile-options__text {
  overflow: hidden;
  padding-left: 0;
  line-height: 52px;
  text-overflow: ellipsis
}

@media (max-width:500px) {
  .profile-options__text:first-child {
    font-size: 16px
  }
}

.profile-options__text--url {
  background-color: #f7f9fa;
  border-right: 1px solid #e3e9ec;
  padding: 18px 10px 12px 12px;
  margin-right: 12px;
  border-radius: 5px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  color: #a1a7b0
}

@media (max-width:768px) {
  .profile-options__text:first-child {
    padding-left: 0
  }
}

.profile-options__copy {
  position: absolute;
  top: 3px;
  right: 3px;
  pointer-events: none
}

.profile-options__copy:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='16px' height='18px' viewBox='0 0 16 18' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__copy%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E %3Cpath d='M14,15.4804099 L14,16.9934588 C14,18.1016409 13.0980496,19 11.9914698,19 L4.0085302,19 C2.8992496,19 2,18.1029399 2,16.9941413 L2,7.00585866 L2,7.00585866 C2,5.89805351 2.89861419,5 4.00950517,5 L5.56109323,5' id='path-1'%3E%3C/path%3E %3Cmask id='mask-2' maskContentUnits='userSpaceOnUse' maskUnits='objectBoundingBox' x='0' y='0' width='12' height='14' fill='white'%3E %3Cuse xlink:href='%23path-1'%3E%3C/use%3E %3C/mask%3E %3Crect id='path-3' x='5' y='1' width='13' height='15' rx='2'%3E%3C/rect%3E %3Cmask id='mask-4' maskContentUnits='userSpaceOnUse' maskUnits='objectBoundingBox' x='0' y='0' width='13' height='15' fill='white'%3E %3Cuse xlink:href='%23path-3'%3E%3C/use%3E %3C/mask%3E %3C/defs%3E %3Cg id='Styleguide' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__copy' transform='translate(-2.000000, -1.000000)'%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cuse id='Rectangle-2' stroke='%23A1A7B0' mask='url(%23mask-2)' stroke-width='2' xlink:href='%23path-1'%3E%3C/use%3E %3Cuse id='Rectangle-2' stroke='%23A1A7B0' mask='url(%23mask-4)' stroke-width='2' xlink:href='%23path-3'%3E%3C/use%3E %3Cpath d='M8.5,5.5 L14.5,5.5' id='Line' stroke='%23A1A7B0' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3Cpath d='M8.5,8.5 L14.5,8.5' id='Line' stroke='%23A1A7B0' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3Cpath d='M8.5,11.5 L14.5,11.5' id='Line' stroke='%23A1A7B0' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.profile-options__feedback {
  position: absolute;
  top: 0;
  right: 16px;
  color: #27c79a;
  -webkit-animation-name: feedbackHead;
  animation-name: feedbackHead;
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-animation-duration: .7s;
  animation-duration: .7s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1
}

@media (max-width:768px) {
  .profile-options__feedback {
    -webkit-animation-name: feedbackHeadMobile;
    animation-name: feedbackHeadMobile
  }
}

.profile-options__list {
  display: inline-block;
  float: right;
  width: auto
}

@media (max-width:768px) {
  .profile-options__list {
    float: left;
    width: 100%;
    margin-top: 10px
  }
}

.profile-options__item {
  position: relative;
  display: inline-block
}

@media (max-width:768px) {
  .profile-options__item:first-child {
    margin-left: -10px
  }
}

.profile-options__item--share {
  float: right
}

@media (max-width:768px) {
  .profile-options__item--share {
    float: right;
    overflow: visible;
    width: auto;
    height: auto;
    padding-right: 0
  }
  .profile-options__item--share:hover {
    background: #fff
  }
}

@media (max-width:525px) {
  .profile-options__item--share {
    width: 100%;
    padding-top: 10px;
    border-top: 1px solid #e3e9ec;
    border-radius: 0
  }
}

.profile-options__link {
  float: left;
  margin-top: 5px
}

@media (max-width:525px) {
  .profile-options__link {
    margin-top: 0
  }
}

.profile-options__link--cv:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='14px' height='16px' viewBox='0 0 14 16' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cv%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E %3Crect id='path-1' x='3' y='2' width='14' height='16' rx='2'%3E%3C/rect%3E %3Cmask id='mask-2' maskContentUnits='userSpaceOnUse' maskUnits='objectBoundingBox' x='0' y='0' width='14' height='16' fill='white'%3E %3Cuse xlink:href='%23path-1'%3E%3C/use%3E %3C/mask%3E %3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__cv' transform='translate(-3.000000, -2.000000)'%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cuse id='Rectangle-2' stroke='%23A1A7B0' mask='url(%23mask-2)' stroke-width='2' xlink:href='%23path-1'%3E%3C/use%3E %3Cpath d='M6.5,6.5 L10.5,6.5' id='Line' stroke='%23A1A7B0' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3Cpath d='M6.5,9.5 L13.5,9.5' id='Line' stroke='%23A1A7B0' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3Cpath d='M6.5,12.5 L11.5,12.5' id='Line' stroke='%23A1A7B0' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.profile-options__link--badge:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='14px' height='17px' viewBox='0 0 14 17' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__badge%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E %3Cpath d='M3,4.00748397 C3,3.45106594 3.43788135,2.87489104 3.95864271,2.72610208 L10,1 L16.0413573,2.72610208 C16.570801,2.87737173 17,3.44892021 17,4.00748397 L17,11.0050312 C17,14.8682458 13.8581267,18 10,18 L10,18 C6.13400675,18 3,14.8737671 3,11.0050312 L3,4.00748397 Z' id='path-1'%3E%3C/path%3E %3Cmask id='mask-2' maskContentUnits='userSpaceOnUse' maskUnits='objectBoundingBox' x='0' y='0' width='14' height='17' fill='white'%3E %3Cuse xlink:href='%23path-1'%3E%3C/use%3E %3C/mask%3E %3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__badge' transform='translate(-3.000000, -1.000000)'%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cuse id='Rectangle-2' stroke='%23A1A7B0' mask='url(%23mask-2)' stroke-width='2' xlink:href='%23path-1'%3E%3C/use%3E %3Cpolygon id='â˜…' stroke='%23A1A7B0' stroke-linecap='round' stroke-linejoin='round' points='10 4.82472426 8.91370352 8.07285828 5.61179245 8.07285828 8.25762347 10.1163863 7.18208241 13.3752757 10 11.3102369 12.828673 13.3752757 11.7423765 10.1163863 14.3882075 8.07285828 11.0755411 8.07285828'%3E%3C/polygon%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.profile-options__link--share {
  padding-left: 10px;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  background: #27c79a;
  margin-left: 4px
}

.profile-options__link--share:hover {
  background: #24bd91
}

@media (max-width:525px) {
  .profile-options__link--share {
    margin-left: 0;
    background: initial;
    color: #435062
  }
  .profile-options__link--share:hover {
    background: initial
  }
}

.profile-options__social-icon {
  position: relative;
  top: 10px;
  display: none;
  float: left;
  width: 30px;
  height: 30px;
  margin: 0 2px;
  border-radius: 5px;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 100%
}

@media (max-width:768px) {
  .profile-options__social-icon {
    display: inline-block
  }
  .profile-options__social-icon:hover {
    background-color: #f7f9fa
  }
}

@media (max-width:525px) {
  .profile-options__social-icon {
    top: 6px
  }
}

.profile-options__social-icon:last-child {
  margin-right: 0
}

.profile-options__social-icon--facebook {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='30px' height='30px' viewBox='0 0 30 30' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__facebook--grey%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__facebook--grey'%3E %3Crect id='Rectangle-12' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='30' height='30' rx='4'%3E%3C/rect%3E %3Cpath d='M14.0302593,9.86046175 C14.0302593,9.86046175 13.794037,10.6567491 13.8264664,12.6181772 L11.4899998,12.6266614 L11.4899998,15.1925533 L13.8264664,15.1840686 L13.8264664,22.8571 L16.8047285,22.8571 L16.8047285,15.1925526 L19.1668301,15.1925533 L19.1668301,12.6181774 L16.8047285,12.6181775 L16.8047285,11.2199277 C16.8047285,10.3133479 17.2062894,9.44636003 18.3809153,9.44636003 L19.4899998,9.44636003 L19.4899998,7.033662 L17.2271125,7.033662 C17.2271125,7.033662 14.6826017,6.82519713 14.0302593,9.86046175 Z' id='Shape' fill='%23A1A7B0'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.profile-options__social-icon--twitter {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='30px' height='30px' viewBox='0 0 30 30' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__twitter--grey%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__twitter--grey'%3E %3Crect id='Rectangle-12' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='30' height='30' rx='4'%3E%3C/rect%3E %3Cpath d='M21.1800378,10.3638827 C21.1800378,10.3638827 22.5046128,10.2576514 23.0361676,9.85500711 C23.0361676,9.85500711 22.9087669,10.3185255 21.3148865,11.7850739 C21.3148865,11.7850739 21.8515373,19.6983081 13.6743742,21.6363323 C13.6743742,21.6363323 9.5273843,22.5355182 6.52229644,20.2417983 C6.52229644,20.2417983 9.66811304,20.8099565 11.4380024,18.8229943 C11.4380024,18.8229943 9.15498233,18.8464686 8.43291452,16.4823258 C8.43291452,16.4823258 9.29492707,16.671314 9.80727379,16.4349793 C9.80727379,16.4349793 7.22123613,15.8906933 7.26788438,13.0296109 C7.26788438,13.0296109 7.96682406,13.5500247 8.59559538,13.4553317 C8.59559538,13.4553317 6.26631909,11.4448952 7.71045471,8.93911064 C7.71045471,8.93911064 10.8315752,12.6850556 14.6998516,12.4626463 C14.6324273,12.194482 14.595971,11.9135859 14.595971,11.6231409 C14.595971,9.76071195 16.0844029,8.25 17.9201486,8.25 C18.8476255,8.25 19.6865099,8.63593379 20.2898011,9.25780442 C20.7319794,9.26536394 21.6414242,9.1853921 22.549693,8.52532596 C22.549693,8.52572383 22.6018293,9.24706193 21.1800378,10.3638827 L21.1800378,10.3638827 L21.1800378,10.3638827 Z' id='Shape' fill='%23A1A7B0'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.profile-options__social-icon--linkedin {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='30px' height='30px' viewBox='0 0 30 30' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__linkedin--grey%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='icon__linkedin--grey'%3E %3Crect id='Rectangle-12' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='30' height='30' rx='4'%3E%3C/rect%3E %3Cpath d='M20.247184,16.928006 C20.247184,15.5064628 19.1420188,14.3767905 17.9114234,14.3767905 C16.9711446,14.3767905 16.1398592,14.3767905 15.5875927,15.5667319 C15.485634,15.7864171 15.3676083,16.4261074 15.3676083,16.7424911 L15.3676083,22.8860957 L12.38028,22.8860955 L12.3802798,15.0826249 L12.3802798,11.233621 L15.4823728,11.233621 L15.6353916,12.7515921 L15.7023574,12.7515921 C16.1502405,12.0303009 17.1681381,11.233621 19.0045771,11.233621 C21.2432049,11.233621 23.25,13.0055562 23.25,16.2535504 L23.25,22.8860957 L20.247184,22.8860957 L20.247184,16.928006 L20.247184,16.928006 Z M8.35802074,9.84880012 C7.38067362,9.84880012 6.75,9.15724376 6.75,8.30273652 C6.75,7.42745753 7.40108724,6.75559853 8.39813173,6.75559853 C9.39517621,6.75559853 10.0061525,7.42709939 10.0265661,8.30273652 C10.0269242,9.15724376 9.39553435,9.84880012 8.35802074,9.84880012 L8.35802074,9.84880012 L8.35802074,9.84880012 Z M7.10986452,22.8860957 L7.10986443,11.2336212 L9.73290027,11.2336213 L9.73290035,22.8860958 L7.10986452,22.8860957 L7.10986452,22.8860957 Z' id='Shape' fill='%23A1A7B0'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

#toggle-share {
  display: none
}

#toggle-share:checked+.tooltip {
  top: -70px;
  opacity: 1;
  pointer-events: auto
}

.results {
  width: 100%;
  padding: 120px 0;
  padding-bottom: 0;
  background: #f7f9fa
}

.results--warning {
  padding-bottom: 55px
}

.results-card {
  overflow: visible
}

.results-card--big {
  position: relative;
  width: 770px;
  margin: 0 auto;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px
}

@media (min-width:1260px) {
  .results-card--big {
    width: 100%;
    max-width: 1000px
  }
}

.results-card--big:after {
  display: block;
  padding-bottom: 50%;
  content: ""
}

@media (max-width:600px) {
  .results-card--big:after {
    padding-bottom: 200%
  }
}

@media (max-width:768px) {
  .results-card--big {
    width: calc(100% - 20px);
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px
  }
}

.results-card__inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

.results-card__col {
  position: relative;
  float: left;
  width: 50%;
  height: 100%;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px
}

@media (max-width:600px) {
  .results-card__col {
    float: none;
    width: 100%;
    height: 50%;
    border-top-right-radius: 0
  }
}

@media (max-width:768px) {
  .results-card__col {
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px
  }
}

.results-card__col--content {
  padding: 40px
}

@media (max-width:768px) and (min-width:601px) {
  .results-card__col--content {
    padding: 30px
  }
}

@media (max-width:670px) and (min-width:601px) {
  .results-card__col--content {
    padding: 20px
  }
}

@media (max-width:420px) {
  .results-card__col--content {
    padding: 20px
  }
}

.results-card__col--graphic {
  background: #f7f9fa
}

.results-card__score {
  position: relative;
  display: block;
  font-size: 120px;
  font-weight: 300;
  line-height: 120px;
  color: #435062
}

.results-card__score--warning {
  display: block;
  width: 155px;
  height: 155px;
  margin-bottom: 75px;
  padding-top: 25px;
  padding-left: 2px;
  font-size: 150px;
  font-weight: 200;
  line-height: 150px;
  color: #ff6b59;
  border: 2px solid #ff6b59;
  border-radius: 50%;
  text-align: center
}

@media (max-width:1260px) {
  .results-card__score--warning {
    width: 125px;
    height: 125px;
    margin-bottom: 50px;
    padding-top: 21px;
    font-size: 115px;
    line-height: 115px
  }
}

@media (max-width:670px) {
  .results-card__score--warning {
    width: 100px;
    height: 100px;
    padding-top: 18px;
    font-size: 90px;
    line-height: 90px
  }
}

@media (min-width:1260px) {
  .results-card__score {
    font-size: 150px;
    line-height: 150px
  }
}

@media (max-width:670px) and (min-width:601px) {
  .results-card__score {
    font-size: 100px;
    line-height: 100px
  }
}

@media (max-width:420px) {
  .results-card__score {
    font-size: 100px;
    line-height: 100px
  }
}

@media (min-width:1260px) {
  .results-card__quote {
    font-size: 24px;
    line-height: 34px
  }
}

@media (max-width:670px) and (min-width:601px) {
  .results-card__quote {
    font-size: 16px;
    line-height: 26px
  }
}

@media (max-width:420px) {
  .results-card__quote {
    font-size: 16px;
    line-height: 26px
  }
}

.results-card__rank {
  position: absolute;
  bottom: 40px;
  left: 40px
}

@media (max-width:768px) and (min-width:601px) {
  .results-card__rank {
    bottom: 30px;
    left: 30px
  }
}

@media (max-width:670px) and (min-width:601px) {
  .results-card__rank {
    bottom: 20px;
    left: 20px
  }
}

@media (max-width:420px) {
  .results-card__rank {
    bottom: 20px;
    left: 20px
  }
}

.individuals {
  padding-top: 120px;
  text-align: center
}

.individuals__intro {
  display: block;
  width: calc(100% - 20px);
  max-width: 260px;
  margin: 0 auto
}

.individuals__list {
  display: inline-block;
  width: calc(100% - 20px);
  max-width: 800px;
  margin: 0 auto;
  margin-top: 80px;
  text-align: center
}

@media (min-width:1260px) {
  .individuals__list {
    max-width: 1200px
  }
}

@media (max-width:550px) {
  .individuals__list {
    width: calc(100% - 10px)
  }
}

@media (max-width:400px) {
  .individuals__list {
    width: calc(100% - 5px);
    margin-top: 40px
  }
}

.individuals__list:after {
  display: block;
  clear: both;
  content: ""
}

.individuals__item {
  display: inline-block;
  width: 33.33333%;
  margin-bottom: 30px;
  text-align: left;
  vertical-align: top
}

@media (min-width:1260px) {
  .individuals__item {
    width: 25%
  }
}

@media (max-width:768px) {
  .individuals__item {
    width: 50%;
    margin-bottom: 20px
  }
}

@media (max-width:550px) {
  .individuals__item {
    margin-bottom: 5px
  }
}

@media (max-width:500px) {
  .individuals__item {
    width: 100%;
    margin-bottom: 20px
  }
}

.individuals__inner {
  position: relative;
  display: block;
  overflow: visible;
  overflow-y: hidden;
  width: calc(100% - 30px);
  min-height: 300px;
  margin: 0 auto
}

@media (max-width:768px) {
  .individuals__inner {
    width: calc(100% - 20px)
  }
}

@media (max-width:550px) {
  .individuals__inner {
    width: calc(100% - 5px);
    min-height: 220px
  }
}

@media (max-width:350px) {
  .individuals__inner {
    width: calc(100% - 20px)
  }
}

.individuals__content {
  padding: 20px
}

@media (max-width:550px) {
  .individuals__content {
    width: 100%;
    padding: 20px
  }
}

.individuals__score {
  height: 55px;
  margin-bottom: 20px;
  font-size: 80px;
  font-weight: 300;
  line-height: 80px;
  color: #435062
}

.individuals__score--light {
  color: #e3e9ec
}

.individuals__score--warning {
  display: block;
  width: 55px;
  padding-left: 2px;
  font-size: 40px;
  font-weight: 400;
  line-height: 65px;
  color: #ff6b59;
  border: 2px solid #ff6b59;
  border-radius: 50%;
  text-align: center
}

.individuals__class {
  display: block;
  overflow: hidden;
  width: 100%;
  height: 40px;
  line-height: 20px
}

@media (max-width:450px) and (min-width:321px) {
  .individuals__class {
    height: 32px
  }
}

.individuals__graphic {
  position: relative;
  width: 100%
}

.individuals__graphic:after {
  position: relative;
  display: block;
  padding-bottom: 70%;
  content: ""
}

.individuals__card-inner {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%
}

.individuals__card-inner--empty {
  padding: 20px
}

#cv-text {
  display: none
}

#cv-text:checked+.cv-modal {
  opacity: 1;
  pointer-events: auto
}

.cv-modal__card {
  max-width: 570px
}

.cv-modal__input {
  overflow-y: auto;
  padding: 20px;
  cursor: pointer
}

@media (max-width:600px) {
  .cv-modal__input {
    padding: 10px
  }
}

.cv-modal__input:hover .icon-link {
  background: #f7f9fa
}

.cv-modal__text {
  padding-top: 20px
}

.cv-modal__text:first-of-type {
  padding-top: 0
}

.cv-modal__clipboard {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0
}

.cv-modal__feedback {
  position: absolute;
  top: 16px;
  right: 16px;
  color: #27c79a;
  -webkit-animation-name: feedback;
  animation-name: feedback;
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-animation-duration: .7s;
  animation-duration: .7s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1
}

#mail {
  display: none
}

#mail:checked+.mail-modal {
  opacity: 1;
  pointer-events: auto
}

.mail-modal__card {
  max-width: 450px
}

.mail-modal__input {
  cursor: pointer;
  max-height: 250px;
  padding: 20px;
  overflow-y: auto
}

@media (max-width:600px) {
  .mail-modal__input {
    padding: 10px
  }
}

.mail-modal__input:hover .icon-link {
  background: #f7f9fa
}

.mail-modal__text {
  padding-top: 20px
}

.mail-modal__text:first-of-type {
  padding-top: 0
}

.cards {
  height: 100%
}

.cards, .cards__outer {
  position: relative;
  display: block;
  width: 100%
}

.cards__outer {
  top: 0;
  left: 0;
  overflow: hidden;
  height: 100vh;
  padding-bottom: 120px
}

@media (max-width:500px) {
  .cards__outer {
    padding-bottom: 40px
  }
}

.cards__inner {
  position: relative;
  display: block;
  width: 400%;
  height: 100%
}

.step {
  position: relative;
  display: inline-block;
  float: left;
  overflow-y: scroll;
  width: 25%;
  height: calc(100vh - 72px);
  padding: 150px 10px 80px;
  opacity: 0;
  text-align: center
}

@media (max-width:450px) {
  .step {
    padding: 80px 10px 40px
  }
}

.step--first {
  opacity: 1
}

.step--last {
  height: 100vh
}

.step__intro {
  display: block;
  max-width: 300px;
  margin: 0 auto;
  margin-bottom: 80px
}

@media (max-width:450px) {
  .step__intro {
    margin-bottom: 40px
  }
}

.step__title {
  padding-bottom: 10px
}

.year {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 940px;
  text-align: center
}

@media (max-width:768px) {
  .year {
    margin: 0 auto
  }
}

@media (max-width:450px) {
  .year {
    max-width: 100vw
  }
}

.year__card {
  position: relative;
  display: inline-block;
  width: 220px;
  height: auto;
  margin: 10px;
  padding: 40px 0;
  padding-top: 58px;
  cursor: pointer;
  text-align: center;
  transition: all .2s ease
}

.year__card--selected, .year__card:hover {
  box-shadow: 0 0 0 0 rgba(67, 80, 98, .08), 0 2px 4px 0 rgba(67, 80, 98, .08)
}

.year__card--selected .year__value, .year__card:hover .year__value {
  color: #435062
}

@media (max-width:768px) {
  .year__card {
    width: calc(50% - 20px);
    max-width: 230px
  }
}

@media (max-width:450px) {
  .year__card {
    width: calc(50% - 7.5px);
    margin: 5px;
    margin-top: 0
  }
  .year__card:nth-child(odd) {
    margin-left: 2.5px
  }
  .year__card:nth-child(2n) {
    margin-right: 2.5px
  }
}

.year__value {
  font-size: 40px;
  line-height: 50px;
  color: rgba(67, 80, 98, .5)
}

.year__value--small {
  position: absolute;
  bottom: 25px;
  left: 0;
  width: 100%
}

.year__noALevels {
  display: block;
  margin-top: 40px;
  cursor: pointer
}

.year__noALevels:hover {
  text-decoration: underline
}

.school {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 600px;
  text-align: center
}

@media (max-width:768px) {
  .school {
    margin: 0 auto
  }
}

@media (max-width:450px) {
  .school {
    max-width: 100vw
  }
}

.school__dropdown {
  overflow: hidden;
  overflow-y: auto;
  max-height: 200px
}

@media (max-width:450px) {
  .school__dropdown {
    max-height: 160px
  }
}

.school__dropdown-item {
  text-align: left
}

.register {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 970px;
  text-align: center
}

@media (max-width:768px) {
  .register {
    margin: 0 auto
  }
}

@media (max-width:450px) {
  .register {
    max-width: 100vw
  }
}

.register__buttons {
  display: block;
  width: 100%;
  max-width: 370px;
  margin: 0 auto
}

.register__login-button {
  display: inline-block;
  width: calc(33.33333% - 13.33333px);
  margin: 0 auto;
  padding-right: 0;
  padding-left: 0;
  text-align: center
}

@media (max-width:450px) {
  .register__login-button {
    width: calc(33.33333% - 6.666666px)
  }
}

.register__login-button--first {
  margin-right: 20px
}

@media (max-width:450px) {
  .register__login-button--first {
    margin-right: 10px
  }
}

.register__login-button--third {
  margin-left: 20px
}

@media (max-width:450px) {
  .register__login-button--third {
    margin-left: 10px
  }
}

.register__login-button--facebook {
  background: #4080ff
}

.register__login-button--facebook:hover {
  background: #3a74e8
}

.register__login-button--twitter {
  background: #26a0ef
}

.register__login-button--twitter:hover {
  background: #2495e0
}

.register__login-button--linkedin {
  background: #0077b5
}

.register__login-button--linkedin:hover {
  background: #0068a1
}

.register__separator {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 370px;
  margin-top: 40px;
  text-align: center
}

.register__separator:after {
  right: 0
}

.register__separator:after, .register__separator:before {
  position: absolute;
  top: 8px;
  display: block;
  width: calc(50% - 20px);
  height: 1px;
  background: #e3e9ec;
  content: ""
}

.register__separator:before {
  left: 0
}

.register__form {
  display: block;
  width: 100%;
  max-width: 370px;
  min-height: 200px;
  margin: 0 auto;
  margin-top: 40px
}

.register__input {
  margin-top: 20px
}

.register__helper {
  position: relative;
  display: block;
  margin-top: 10px;
  font-size: 14px;
  color: #a1a7b0;
  text-align: left
}

.register__helper--error {
  display: none;
  color: #ff6b59
}

.has-error+.register__helper--error {
  display: block
}

.register__helper--dark {
  padding-left: 5px;
  color: #435062
}

.register__button {
  margin-top: 40px
}

.cards-bar {
  position: fixed;
  z-index: 100;
  bottom: 0;
  left: 0;
  display: block;
  width: 100vw;
  height: 72px;
  padding: 10px;
  background: hsla(0, 0%, 100%, .96);
  box-shadow: 0 -10px 30px 0 rgba(67, 80, 98, .08), 0 -2px 4px 0 rgba(67, 80, 98, .08)
}

@media (max-width:500px) {
  .cards-bar {
    height: 62px;
    padding: 5px
  }
}

.cards-bar__inner {
  position: relative;
  display: block;
  width: 100%;
  max-width: 770px;
  height: 52px;
  margin: 0 auto
}

.cards-bar__back {
  float: left;
  margin-top: 5px;
  font-weight: 700;
  color: #435062;
  transition: all .2s ease
}

@media (max-width:500px) {
  .cards-bar__back-text {
    display: none
  }
}

.cards-bar__back:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__arrow--left%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='A---Sign-up-' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='signup__school' transform='translate(-135.000000, -847.000000)'%3E %3Cg id='bottom-bar' transform='translate(0.000000, 775.000000)'%3E %3Cg id='back' transform='translate(135.000000, 70.000000)'%3E %3Cg id='icon__arrow--left' transform='translate(0.000000, 2.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpolyline id='Path-3' stroke='%23435062' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' transform='translate(9.549949, 10.061619) scale(-1, 1) translate(-9.549949, -10.061619) ' points='7.09989805 5 12.099898 9.99824116 7 15.1232379'%3E%3C/polyline%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.cards-bar__back--disable {
  opacity: .5
}

.cards-bar__back--next {
  display: none
}

@media (max-width:500px) {
  .cards-bar__back--next {
    display: block
  }
  .cards-bar__back--next:before {
    background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__arrow--right%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='A---Sign-up-' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='signup__school' transform='translate(-135.000000, -847.000000)'%3E %3Cg id='bottom-bar' transform='translate(0.000000, 775.000000)'%3E %3Cg id='back' transform='translate(135.000000, 70.000000)'%3E %3Cg id='icon__arrow--right' transform='translate(10.000000, 12.000000) scale(-1, 1) translate(-10.000000, -12.000000) translate(0.000000, 2.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpolyline id='Path-3' stroke='%2327C79A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' transform='translate(9.549949, 10.061619) scale(-1, 1) translate(-9.549949, -10.061619) ' points='7.09989805 5 12.099898 9.99824116 7 15.1232379'%3E%3C/polyline%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
  }
}

.cards-bar__progress {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: calc(100% - 240px);
  height: 1px;
  background: #e3e9ec;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%)
}

@media (max-width:500px) {
  .cards-bar__progress {
    width: calc(100% - 120px)
  }
}

.cards-bar__progress:before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 0;
  height: 1px;
  background: #27c79a;
  content: "";
  transition: all .2s ease
}

.cards-bar__progress--step-2:before {
  width: 50%
}

.cards-bar__progress--step-3:before, .cards-bar__progress--step-4:before {
  width: 100%
}

.cards-bar__circle {
  position: absolute;
  top: -4px;
  width: 10px;
  height: 10px;
  border: 1px solid #e3e9ec;
  border-radius: 50%;
  background: #fff
}

.cards-bar__circle.is-active {
  border-color: #27c79a
}

.cards-bar__circle.is-done {
  border-color: #27c79a;
  background: #27c79a
}

.cards-bar__circle.is-done .cards-bar__tooltip {
  top: -70px;
  -webkit-animation: tooltip 5s ease-in-out;
  animation: tooltip 5s ease-in-out;
  pointer-events: auto
}

@-webkit-keyframes tooltip {
  0% {
    opacity: 1
  }
  50% {
    opacity: 1
  }
  94% {
    opacity: 1
  }
  to {
    opacity: 0
  }
}

@keyframes tooltip {
  0% {
    opacity: 1
  }
  50% {
    opacity: 1
  }
  94% {
    opacity: 1
  }
  to {
    opacity: 0
  }
}

.cards-bar__circle--first {
  left: -5px
}

.cards-bar__circle--second {
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

.cards-bar__circle--third {
  right: -5px
}

.cards-bar__next {
  float: right
}

.cards-bar__button {
  margin-top: 5px;
  padding: 7px 18px;
  padding-top: 13px
}

@media (max-width:500px) {
  .cards-bar__button {
    display: none
  }
}

.cards-bar__tooltip {
  top: -50px;
  display: block;
  width: auto;
  margin: 0;
  padding: 10px 15px;
  padding-top: 15px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

@media (max-width:500px) {
  .cards-bar__tooltip {
    display: block
  }
}

.company-intention {
  overflow: hidden;
  overflow-y: scroll
}

.company-intention__wrapper {
  display: table;
  width: 100%;
  height: 100%;
  background-color: #435062
}

.company-intention__inner {
  display: table-cell;
  padding: 20px;
  vertical-align: middle
}

.company-intention__card {
  position: relative;
  max-width: 1080px;
  margin: 0 auto;
  padding: 80px 100px 100px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 30px 0 rgba(67, 79, 97, .08), 0 2px 4px 0 rgba(67, 79, 97, .08);
  transition: all .2s ease
}

@media (max-width:768px) {
  .company-intention__card {
    padding: 0
  }
}

.company-intention__header {
  width: 100%
}

@media (max-width:768px) {
  .company-intention__header {
    position: relative;
    height: 60px;
    padding: 0 20px;
    line-height: 64px;
    border-bottom: 1px solid #e3e9ec
  }
}

.company-intention__header--empty {
  border-bottom: 0
}

.company-intention__close {
  position: absolute;
  top: 15px;
  right: 20px;
  cursor: pointer
}

@media (max-width:768px) {
  .company-intention__close {
    top: 3px
  }
}

.company-intention__close:before {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cross--grey%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='profile_cvtext' transform='translate(-922.000000, -284.000000)'%3E %3Cg id='cv-modal' transform='translate(435.000000, 263.000000)'%3E %3Cg id='modal__confirm' transform='translate(477.000000, 10.000000)'%3E %3Cg id='icon__cross--grey' transform='translate(10.000000, 11.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23A1A7B0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' transform='translate(10.001959, 10.000000) scale(-1, 1) translate(-10.001959, -10.000000) '%3E%3C/path%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23A1A7B0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 20px 20px;
  content: ""
}

.company-intention__close:hover:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='14px' height='14px' viewBox='0 0 14 14' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cross--dark%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='profile-mail' transform='translate(-700.000000, -555.000000)'%3E %3Cg id='mail-modal' transform='translate(535.000000, 241.000000)'%3E %3Cg id='tag-mail' transform='translate(20.000000, 305.000000)'%3E %3Cg id='icon__cross--dark' transform='translate(145.000000, 9.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='14' height='14'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='14' height='14' rx='7'%3E%3C/rect%3E %3Cpath d='M3,3 L11,11' id='Line' stroke='%23435062' stroke-linecap='round' stroke-linejoin='round' transform='translate(7.000000, 7.000000) scale(-1, 1) translate(-7.000000, -7.000000) '%3E%3C/path%3E %3Cpath d='M3,3 L11,11' id='Line' stroke='%23435062' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.company-intention__sub-heading {
  margin-bottom: 10px
}

@media (max-width:768px) {
  .company-intention__sub-heading {
    display: none
  }
}

.company-intention__heading {
  margin-bottom: 15px
}

@media (max-width:768px) {
  .company-intention__heading {
    margin-bottom: 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    line-height: inherit;
    text-align: left;
    letter-spacing: .15px
  }
}

.company-intention__paragraph {
  max-width: 300px;
  margin-bottom: 80px
}

@media (max-width:768px) {
  .company-intention__paragraph {
    display: none
  }
}

.company-intention__paragraph--empty {
  margin-bottom: -20px
}

@media (max-width:768px) {
  .company-intention__list {
    padding: 20px
  }
}

.company-intention__list:after {
  display: block;
  visibility: hidden;
  clear: both;
  height: 0;
  line-height: 0;
  content: ""
}

.company-intention__item {
  position: relative;
  overflow: hidden;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 10px 30px 0 rgba(67, 79, 97, .08), 0 2px 4px 0 rgba(67, 79, 97, .08);
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 31.76157%
}

.company-intention__item:last-child {
  margin-right: 0
}

@media (max-width:1024px) {
  .company-intention__item {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 48.82117%
  }
  .company-intention__item:last-child {
    margin-right: 0
  }
}

@media (max-width:768px) {
  .company-intention__item {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 100%
  }
  .company-intention__item:last-child {
    margin-right: 0
  }
}

@media (max-width:1024px) {
  .company-intention__item--second {
    margin-right: 0
  }
}

@media (max-width:768px) {
  .company-intention__item--second {
    display: none
  }
}

@media (max-width:1024px) {
  .company-intention__item--last {
    display: none
  }
}

.has-two .company-intention__item:first-of-type {
  margin-left: 17.05961%
}

@media (max-width:1024px) {
  .has-two .company-intention__item:first-of-type {
    margin-left: 0
  }
}

.has-one .company-intention__item {
  margin-right: 0;
  margin-left: 34.1%
}

@media (max-width:1024px) {
  .has-one .company-intention__item {
    margin-left: 25.7%
  }
}

@media (max-width:768px) {
  .has-one .company-intention__item {
    margin-left: 0
  }
}

.company-intention__item-header {
  position: relative;
  height: 160px
}

.company-intention__item-body {
  padding: 20px
}

.company-intention__item-actions {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 160px;
  line-height: 160px;
  opacity: 0;
  background-color: rgba(67, 80, 98, .9);
  text-align: center;
  pointer-events: none;
  transition: all .2s ease
}

@media (max-width:768px) {
  .company-intention__item-actions {
    position: relative;
    height: auto;
    line-height: inherit;
    opacity: 1;
    background-color: #fff;
    pointer-events: auto
  }
}

.company-intention__item:hover .company-intention__item-actions {
  opacity: 1;
  pointer-events: auto
}

.company-intention__item-action {
  position: relative;
  top: 2px;
  display: inline-block;
  height: 40px;
  margin: 0 8px;
  padding: 0 10px;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 46px;
  color: #fff;
  border-radius: 5px;
  cursor: pointer;
  vertical-align: middle;
  letter-spacing: 1px;
  text-transform: uppercase
}

@media (max-width:768px) {
  .company-intention__item-action {
    top: 0;
    width: 50%;
    height: 46px;
    margin: 0;
    padding: 0;
    line-height: 52px;
    border-radius: 0
  }
}

.company-intention__item-action:before {
  position: relative;
  top: -2px;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 20px 20px;
  content: "";
  vertical-align: middle
}

.company-intention__item-action--no {
  background-color: #ff6b59
}

.company-intention__item-action--no:hover {
  background: #ff5440
}

.company-intention__item-action--no:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cross--grey%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='profile_cvtext' transform='translate(-922.000000, -284.000000)'%3E %3Cg id='cv-modal' transform='translate(435.000000, 263.000000)'%3E %3Cg id='modal__confirm' transform='translate(477.000000, 10.000000)'%3E %3Cg id='icon__cross--grey' transform='translate(10.000000, 11.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23FFFFFF' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' transform='translate(10.001959, 10.000000) scale(-1, 1) translate(-10.001959, -10.000000) '%3E%3C/path%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23FFFFFF' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.company-intention__item-action--yes {
  background: #27c79a
}

.company-intention__item-action--yes:hover {
  background: #24bd91
}

.company-intention__item-action--yes:before {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__checkmark--green%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Styleguide' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='Multiple-elements' transform='translate(-60.000000, -924.000000)'%3E %3Cg id='sg__icons' transform='translate(60.000000, 878.000000)'%3E %3Cg id='icon__checkmark--green' transform='translate(0.000000, 46.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpolyline id='Path-2' stroke='%23FFFFFF' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' points='17 3 7 15 0.999079575 9'%3E%3C/polyline%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E")
}

.company-intention__item-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  max-width: 210px;
  height: auto;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%)
}

.company-intention__item-name {
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  color: #435062;
  letter-spacing: .22px
}

.company-intention__item-url {
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  color: #a1a7b0;
  letter-spacing: .2px
}

.company-intention__item-url:hover {
  color: #858d99
}

.company-intention__empty {
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  color: #435062;
  text-align: center
}

@media (max-width:768px) {
  .company-intention__empty {
    padding: 24px 0 20px
  }
}

.company {
  height: 100vh
}

.company__inner {
  position: absolute;
  top: 0;
  left: 0;
  display: table;
  width: 100%;
  height: 100%
}

.company__alignment {
  display: table-cell;
  padding: 135px 0 100px;
  vertical-align: middle
}

@media (max-width:768px) {
  .company__alignment {
    padding: 0
  }
}

.company__content {
  padding: 0 20px;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto
}

.company__content:after {
  clear: both;
  content: "";
  display: block
}

@media (max-width:768px) {
  .company__content {
    margin-top: 135px;
    margin-bottom: 70px
  }
}

.company__col {
  display: inline-block;
  width: 40.29137%;
  margin-right: 2.35765%;
  margin-left: -100%;
  vertical-align: middle
}

@media (max-width:1024px) {
  .company__col {
    margin-left: 8.5298%
  }
}

@media (max-width:768px) {
  .company__col {
    width: 100%;
    margin: 0
  }
}

.company__col--last {
  width: 48.82117%;
  margin-right: 0;
  margin-left: 51.17883%
}

@media (max-width:768px) {
  .company__col--last {
    width: 100%;
    margin: 0
  }
}

.company__logo {
  margin-bottom: 40px
}

.company__image {
  float: right;
  width: 100%;
  height: auto;
  border: 1px solid #f6f6f6;
  box-shadow: 0 0 30px 0 rgba(67, 79, 97, .08), 0 0 4px 0 rgba(67, 79, 97, .08)
}

@media (max-width:1024px) {
  .company__image {
    display: none
  }
}

@media (max-width:768px) {
  .company__image {
    float: left;
    max-width: 475px
  }
}

.company__title {
  margin-bottom: 20px;
  font-size: 36px;
  font-weight: 500;
  line-height: 46px;
  color: #435062;
  letter-spacing: .4px
}

@media (max-width:1024px) {
  .company__title {
    max-width: 375px;
    font-size: 27px;
    line-height: 35px
  }
}

.company__description {
  max-width: 375px;
  margin-bottom: 53px;
  font-size: 16px;
  font-weight: 400;
  line-height: 34px;
  color: #a1a7b0;
  letter-spacing: .2px
}

@media (max-width:1024px) {
  .company__description {
    font-size: 16px;
    line-height: 30px
  }
}

@media (max-width:768px) {
  .company__description {
    margin-bottom: 40px
  }
}

.company__link {
  display: inline-block
}

.company__link--find {
  margin-left: 40px;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  color: #a1a7b0;
  letter-spacing: 1px;
  text-transform: uppercase;
  transition: all .2s ease
}

@media (max-width:1024px) {
  .company__link--find {
    display: block;
    margin-top: 40px;
    margin-left: 0
  }
}

.company__link--find:after {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-top: -3px;
  margin-left: 5px;
  background-size: 20px 20px;
  content: "";
  vertical-align: middle;
  background-image: url(/images/arrow__down--green.png);
  transition: all .2s ease
}

@media only screen and (-webkit-min-device-pixel-ratio:2), only screen and (min--moz-device-pixel-ratio:2), only screen and (min-device-pixel-ratio:2), only screen and (min-resolution:2dppx), only screen and (min-resolution:192dpi) {
  .company__link--find:after {
    background-image: url(/images/arrow__down--green@2x.png)
  }
}

.company__link--find:hover {
  color: #435062
}

.company__link--find:hover:after {
  margin-left: 15px
}

.employers-why {
  overflow: hidden;
  background-image: linear-gradient(-180deg, #fff, #f7f9fa 99%)
}

@media (max-width:768px) {
  .employers-why {
    padding: 0 20px
  }
}

.employers-why__content {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto
}

.employers-why__content:after {
  clear: both;
  content: "";
  display: block
}

.employers-why__logos {
  margin: 60px -22.3px 0
}

.employers-why__logo {
  margin: 0 22.3px
}

.employers-why__intro {
  margin-top: 170px;
  padding-right: 35px;
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 40.29137%;
  margin-left: 8.5298%
}

.employers-why__intro:last-child {
  margin-right: 0
}

@media (max-width:768px) {
  .employers-why__intro {
    margin-top: 90px;
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 82.94039%;
    margin-left: 8.5298%
  }
  .employers-why__intro:last-child {
    margin-right: 0
  }
}

.employers-why__intro-title {
  max-width: 430px;
  font-size: 36px;
  font-weight: 500;
  line-height: 46px;
  color: #435062;
  letter-spacing: .4px
}

@media (max-width:768px) {
  .employers-why__intro-title {
    font-size: 28px;
    line-height: 36px
  }
}

.employers-why__intro-paragraph {
  max-width: 430px;
  margin-top: 15px;
  margin-bottom: 80px;
  font-size: 22px;
  line-height: 34px;
  color: #a1a7b0;
  letter-spacing: .21px
}

@media (max-width:768px) {
  .employers-why__intro-paragraph {
    font-size: 16px;
    line-height: 31px
  }
}

.employers-why__item {
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 23.23176%
}

.employers-why__item:last-child {
  margin-right: 0
}

@media (max-width:768px) {
  .employers-why__item {
    margin-top: 40px;
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 82.94039%;
    margin-left: 8.5298%
  }
  .employers-why__item:last-child {
    margin-right: 0
  }
}

.employers-why__item--first {
  margin-left: 8.5298%
}

@media (max-width:768px) {
  .employers-why__item--first {
    margin-top: 0
  }
}

.employers-why__item-logo {
  width: 54px;
  height: auto;
  margin-bottom: 30px
}

.employers-why__item--first .employers-why__item-logo {
  width: 64px;
  margin-top: -5px
}

.employers-why__item-title {
  margin-bottom: 13px;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  color: #435062;
  letter-spacing: .22px
}

.employers-why__item-description {
  max-width: 230px;
  font-size: 16px;
  line-height: 26px;
  color: #a1a7b0;
  letter-spacing: .15px
}

.employers-why__image-container {
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 82.94039%;
  margin-left: 8.5298%
}

.employers-why__image-container:last-child {
  margin-right: 0
}

.employers-why__image {
  display: block;
  width: 100%;
  max-width: 967px;
  height: auto;
  margin-top: 80px;
  border: 1px solid #f6f6f6;
  box-shadow: 0 0 30px 0 rgba(67, 79, 97, .08), 0 0 4px 0 rgba(67, 79, 97, .08)
}

.employers-database {
  position: relative;
  padding: 120px 65px;
  text-align: center
}

.employers-database__text {
  position: relative;
  display: block;
  max-width: 350px;
  margin: 0 auto
}

.employers-database__subtitle {
  margin-bottom: 10px
}

.employers-database__title {
  margin-bottom: 20px
}

.employers-database__description {
  margin-bottom: 30px
}

.employers-database__users {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0
}

.employers-database__user {
  position: absolute;
  top: 120px;
  left: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #e3e9ec;
  cursor: pointer;
  -webkit-animation-name: floating;
  animation-name: floating;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite
}

@media (max-width:425px) {
  .employers-database__user {
    display: none
  }
}

.employers-database__user:hover {
  z-index: 1
}

.employers-database__user:hover .tooltip {
  opacity: 1
}

.employers-database__user--medium {
  width: 60px;
  height: 60px
}

.employers-database__user--medium .tooltip--bottom-right {
  left: 10px
}

.employers-database__user--medium .tooltip--bottom-left {
  right: 10px
}

.employers-database__user--large {
  width: 80px;
  height: 80px
}

.employers-database__user--large .tooltip--bottom-right {
  left: 20px
}

.employers-database__user--large .tooltip--bottom-left {
  right: 20px
}

.employers-database__user--1 {
  top: 210px;
  left: 3.5%
}

.employers-database__user--2 {
  top: 143px;
  left: 8%
}

.employers-database__user--3 {
  top: 195px;
  left: 14.5%
}

@media (max-width:768px) {
  .employers-database__user--3 {
    display: none
  }
}

.employers-database__user--4 {
  top: 169px;
  left: 22.8%
}

@media (max-width:768px) {
  .employers-database__user--4 {
    display: none
  }
}

.employers-database__user--5 {
  top: 211px;
  left: 27.2%
}

@media (max-width:1024px) {
  .employers-database__user--5 {
    display: none
  }
}

.employers-database__user--6 {
  top: 138px;
  left: 31.5%
}

@media (max-width:1024px) {
  .employers-database__user--6 {
    display: none
  }
}

.employers-database__user--7 {
  top: 143px;
  left: 64.5%
}

@media (max-width:1024px) {
  .employers-database__user--7 {
    display: none
  }
}

.employers-database__user--8 {
  top: 197px;
  left: 68.3%
}

@media (max-width:1024px) {
  .employers-database__user--8 {
    display: none
  }
}

.employers-database__user--9 {
  top: 143px;
  left: 75.5%
}

@media (max-width:768px) {
  .employers-database__user--9 {
    display: none
  }
}

.employers-database__user--10 {
  top: 225px;
  left: 81.5%
}

@media (max-width:768px) {
  .employers-database__user--10 {
    display: none
  }
}

.employers-database__user--11 {
  top: 143px;
  left: 85%
}

.employers-database__user--12 {
  top: 183px;
  left: 91%
}

@-webkit-keyframes floating {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0)
  }
  50% {
    -webkit-transform: translateY(8%);
    transform: translateY(8%)
  }
  to {
    -webkit-transform: translateY(0);
    transform: translateY(0)
  }
}

@keyframes floating {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0)
  }
  50% {
    -webkit-transform: translateY(8%);
    transform: translateY(8%)
  }
  to {
    -webkit-transform: translateY(0);
    transform: translateY(0)
  }
}

.employers-simple {
  padding: 55px 0 200px;
  text-align: center
}

@media (max-width:768px) {
  .employers-simple {
    padding: 55px 0 150px
  }
}

.employers-simple__circle {
  display: block;
  width: 40px;
  height: 40px;
  margin: 0 auto 20px;
  border: 13px solid #27c79a;
  border-radius: 40px
}

.employers-simple__title {
  font-size: 36px;
  font-weight: 500;
  line-height: 46px;
  color: #435062;
  letter-spacing: .4px
}

.employers-simple__description {
  margin-bottom: 55px;
  font-size: 22px;
  font-weight: 400;
  line-height: 34px;
  color: #a1a7b0;
  letter-spacing: .21px
}

.employers-simple__item {
  position: relative;
  display: inline-block;
  max-width: 180px;
  margin: 0 50px;
  padding-top: 35px
}

@media (max-width:768px) {
  .employers-simple__item {
    display: block;
    max-width: 180px;
    margin: 0 auto 50px;
    padding-top: 0;
    text-align: left
  }
}

.employers-simple__item:before {
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: 11px;
  height: 11px;
  border: 1px solid #27c79a;
  border-radius: 50%;
  content: "";
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

@media (max-width:768px) {
  .employers-simple__item:before {
    top: -1px;
    left: -25px
  }
}

.employers-simple__item--first:after {
  position: absolute;
  top: 5px;
  left: 50%;
  display: block;
  width: 269px;
  height: 1px;
  margin-left: 5px;
  background-image: linear-gradient(-90deg, #e3e9ec, #27c79a);
  content: ""
}

@media (max-width:768px) {
  .employers-simple__item--first:after {
    top: 10px;
    left: -31px;
    width: 1px;
    height: 136px;
    background-image: linear-gradient(-1turn, #e3e9ec, #27c79a)
  }
}

.employers-simple__item--last:before {
  border-color: #e3e9ec
}

.employers-simple__item-subtitle {
  display: block;
  margin-bottom: 5px;
  font-size: 14px;
  font-weight: 500;
  line-height: 15px;
  color: #27c79a;
  letter-spacing: 1px;
  text-transform: uppercase
}

.employers-simple__item--last .employers-simple__item-subtitle {
  color: #e3e9ec
}

.employers-simple__item-title {
  margin-bottom: 5px;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: #435062;
  letter-spacing: .2px
}

.employers-simple__item--last .employers-simple__item-title {
  color: #a1a7b0
}

.employers-simple__item-description {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #a1a7b0;
  letter-spacing: .2px
}

.employers-simple__item--last .employers-simple__item-description {
  opacity: .6
}

.employers-cta {
  padding: 120px 0;
  text-align: center
}

@media (max-width:768px) {
  .employers-cta {
    padding: 90px 20px 60px
  }
}

.employers-cta__title {
  margin-bottom: 15px;
  font-size: 36px;
  font-weight: 500;
  line-height: 46px;
  color: #435062;
  letter-spacing: .4px
}

.employers-cta__description {
  display: block;
  max-width: 380px;
  margin: 0 auto 45px;
  font-size: 22px;
  font-weight: 400;
  line-height: 34px;
  color: #a1a7b0;
  letter-spacing: .21px
}

.employers-cta__input-container {
  display: inline-block;
  max-width: 325px;
  margin-right: 10px
}

.employers-cta__input {
  width: 100%;
  padding: 15px 20px 11px
}

@media (max-width:768px) {
  .employers-cta__input {
    display: block;
    margin: 0 auto 20px
  }
}

.employers-cta__error {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 15px
}

.employers-cta__button {
  border-radius: 5px
}

.employers-cta__success {
  max-width: 360px;
  height: 52px;
  margin: 0 auto;
  font-family: Muli, Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 48px;
  color: #27c79a;
  border: 1px solid #e3e9ec;
  border-radius: 5px;
  background: #fff;
  letter-spacing: .15px
}

@media (max-width:768px) {
  .employers-cta__success {
    font-size: 16px
  }
}

.case-studies {
  padding-top: 420px;
  background-image: linear-gradient(-1deg, #fff 8%, #f7f9fa 97%)
}

@media (max-width:768px) {
  .case-studies {
    padding: 420px 20px 0
  }
}

.case-studies__title {
  font-size: 36px;
  font-weight: 500;
  line-height: 46px;
  color: #435062;
  letter-spacing: .4px
}

.case-studies__description {
  margin-bottom: 60px;
  font-size: 22px;
  line-height: 34px;
  color: #a1a7b0;
  letter-spacing: .21px
}

.case-studies__list {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto
}

.case-studies__list:after {
  clear: both;
  content: "";
  display: block
}

.case-studies__item {
  overflow: hidden;
  margin-bottom: 2.35765%;
  padding-top: 40px;
  border: 1px solid #e3e9ec;
  border-radius: 5px;
  background: #fff;
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 31.76157%
}

.case-studies__item:last-child {
  margin-right: 0
}

@media (max-width:768px) {
  .case-studies__item {
    float: inherit;
    width: 100%;
    max-width: 475px;
    margin: 0 auto 20px;
    margin-bottom: 20px
  }
}

.case-studies__item--third {
  margin-right: 0
}

@media (max-width:768px) {
  .case-studies__item--third {
    margin-right: auto!important
  }
}

.case-studies__image {
  width: 48px;
  height: 48px;
  margin-right: 10px;
  margin-left: 40px;
  border-radius: 50%;
  background-color: #e3e9ec
}

.case-studies__image, .case-studies__name {
  display: inline-block;
  vertical-align: middle
}

.case-studies__name {
  margin-top: 3px;
  margin-right: 40px;
  font-size: 16px;
  line-height: 22px;
  color: #435062;
  letter-spacing: .2px
}

.case-studies__pos {
  display: block;
  color: #a1a7b0
}

.case-studies__grade {
  margin-top: 40px;
  margin-bottom: 20px;
  font-size: 36px;
  font-weight: 300;
  line-height: 34px;
  color: #435062;
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 48.82117%
}

.case-studies__grade:last-child {
  margin-right: 0
}

.case-studies__grade--last {
  margin-right: 0;
  border-left: 1px solid #e8edf0
}

.case-studies__grade-label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  line-height: 15px;
  opacity: .6;
  color: #a1a7b0;
  letter-spacing: .85px
}

.case-studies__school-grade, .case-studies__school-grade-label {
  font-size: 12px;
  font-weight: 500;
  line-height: 15px;
  color: #c7cad0;
  letter-spacing: .85px;
  text-transform: uppercase
}

.case-studies__school-grade-label {
  line-height: 2;
  padding: 16px 12px;
  border-top: 1px solid #e3e9ec;
  background-color: #fbfcfc;
  text-align: center
}

.case-studies__school-grade {
  color: #435062
}

.login {
  width: 100%;
  padding-top: 65px;
  text-align: center
}

@media (max-width:768px) {
  .login {
    margin: 0 auto
  }
}

@media (max-width:450px) {
  .login {
    max-width: 100vw
  }
}

.login__intro {
  display: block;
  max-width: 300px;
  margin: 0 auto;
  margin-bottom: 80px
}

.login__title {
  padding-bottom: 10px
}

.login__buttons {
  display: block;
  width: 100%;
  max-width: 370px;
  margin: 0 auto
}

.login__login-button {
  display: inline-block;
  width: calc(33.33333% - 13.33333px);
  margin: 0 auto;
  padding-right: 0;
  padding-left: 0;
  text-align: center
}

@media (max-width:450px) {
  .login__login-button {
    width: calc(33.33333% - 6.666666px)
  }
}

.login__login-button--first {
  margin-right: 20px
}

@media (max-width:450px) {
  .login__login-button--first {
    margin-right: 10px
  }
}

.login__login-button--third {
  margin-left: 20px
}

@media (max-width:450px) {
  .login__login-button--third {
    margin-left: 10px
  }
}

.login__login-button--facebook {
  background: #4080ff
}

.login__login-button--facebook:hover {
  background: #3a74e8
}

.login__login-button--twitter {
  background: #26a0ef
}

.login__login-button--twitter:hover {
  background: #2495e0
}

.login__login-button--linkedin {
  background: #0077b5
}

.login__login-button--linkedin:hover {
  background: #0068a1
}

.login__separator {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 370px;
  margin-top: 40px;
  text-align: center
}

.login__separator:after {
  right: 0
}

.login__separator:after, .login__separator:before {
  position: absolute;
  top: 8px;
  display: block;
  width: calc(50% - 20px);
  height: 1px;
  background: #e3e9ec;
  content: ""
}

.login__separator:before {
  left: 0
}

.login__form {
  display: block;
  width: 100%;
  max-width: 370px;
  min-height: 200px;
  margin: 0 auto;
  margin-top: 40px
}

.login__input {
  margin-top: 20px
}

.login__helper {
  position: relative;
  display: block;
  margin-top: 10px;
  font-size: 14px;
  color: #a1a7b0;
  text-align: left
}

.login__helper--error {
  display: none;
  color: #ff6b59
}

.has-error+.login__helper--error {
  display: block
}

.login__helper--dark {
  padding-left: 5px;
  color: #435062
}

.login__button {
  margin-top: 40px
}

.login__errors {
  max-width: 370px;
  height: 55px;
  margin: 0 auto 50px;
  padding: 0 20px;
  font-size: 16px;
  font-weight: 400;
  line-height: 58px;
  color: #435062;
  border: 1px solid #ff6b59;
  border-radius: 5px;
  background: #fff;
  text-align: left;
  letter-spacing: .15px;
  text-transform: capitalize;
  position: relative
}

.login__errors-close {
  position: absolute;
  top: 5px;
  right: 20px;
  cursor: pointer
}

@media (max-width:768px) {
  .login__errors-close {
    top: 3px
  }
}

.login__errors-close:before {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E %3Csvg width='20px' height='20px' viewBox='0 0 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E %3C!-- Generator: Sketch 40 (33762) - http://www.bohemiancoding.com/sketch --%3E %3Ctitle%3Eicon__cross--grey%3C/title%3E %3Cdesc%3ECreated with Sketch.%3C/desc%3E %3Cdefs%3E%3C/defs%3E %3Cg id='Profile' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E %3Cg id='profile_cvtext' transform='translate(-922.000000, -284.000000)'%3E %3Cg id='cv-modal' transform='translate(435.000000, 263.000000)'%3E %3Cg id='modal__confirm' transform='translate(477.000000, 10.000000)'%3E %3Cg id='icon__cross--grey' transform='translate(10.000000, 11.000000)'%3E %3Crect id='Rectangle-4' fill-opacity='0.01' fill='%23FFFFFF' x='0' y='0' width='20' height='20'%3E%3C/rect%3E %3Crect id='Rectangle-4' x='0' y='0' width='20' height='20' rx='10'%3E%3C/rect%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23A1A7B0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' transform='translate(10.001959, 10.000000) scale(-1, 1) translate(-10.001959, -10.000000) '%3E%3C/path%3E %3Cpath d='M4.00391789,4 L16,16' id='Line' stroke='%23A1A7B0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/g%3E %3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 20px 20px;
  content: ""
}

.thanks {
  width: 100%;
  height: 100vh;
  padding: 0 20px;
  position: absolute;
  top: 0;
  left: 0
}

.thanks__inner {
  padding: 60px 20px;
  width: calc(100% - 40px);
  max-width: 420px;
  text-align: center;
  overflow: visible;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%)
}

.thanks__title {
  padding-bottom: 20px
}

.thanks__text {
  padding-bottom: 40px;
  max-width: 260px;
  margin: 0 auto
}

.thanks__link {
  display: inline-block;
  position: relative
}

.thanks__link:hover:after {
  position: absolute;
  bottom: 0;
  width: 100%;
  left: 0;
  border-bottom: 2px solid #27c79a;
  content: ""
}

/* Bootsrap fixes */

.dropdown {
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow:none;
}

ul.bullet-gray {
  margin: 0 0 10px 15px;
}

ul.bullet-dark li {
  color: #3c3c3c;
}
.features-entry__content {
  border-bottom: 1px solid rgba(67, 80, 98, .2);
  padding-bottom: 45px;
  margin-bottom: 25px;
  position:relative;
}
.features-entry__content h4 {
    margin: -10px 0 15px;
}

@media (min-width: 841px) {
  .features-entry__content p, .features-entry__content h4, .features-entry__content ul {
      padding-left: 42px;
  }
}

.features-entry__content.last {
  border-bottom: none;
  padding-bottom: 0px;
  margin-bottom: 0px;
}

ul.bullet-gray li {
    padding: 7px 0;
}
ul.bullet-gray li::before {
  color: #006b6e;
  /* color of bullet or square */
  content: "\2022";
  /* Unicode of character to precede the list item */
  font-size: 1em;
  /* em or %*/
  padding-right: 1.1225em;
  /* use em*/
  position: relative;
  top: 0em;
  /* use em or % */
}

.backdrop {
  content: "";
  background: url(images/bg-site-odd.jpg) top center;
  opacity: 0.85;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;
}
.outerimg {
    margin-top: 20px;
    height: auto;
    width: 200px;
    max-width:100%;
}

.features-entry__content p a, .features-entry__content ul a {
  display: inline!important;
  background-position: 0 1.0625em;
  /*background-position: 0 1.075em;*/
  background-image: linear-gradient(180deg,#f3df93,#f3df93);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  padding: .125em 0;
  transition: background-position .15s;
  cursor: pointer;
  font-weight: 700;
  color: #414141;
}

.features-entry__content p a:hover, .features-entry__content ul a:hover {
  background-position: 0 0;
  color: #414141;
}
.link-unstyled {
    background: none;
    padding: 0;
    font-weight: inherit;
    text-transform: inherit;
    color: inherit;
}

.mini .image {
    width: 80px;
    height: 80px;
    padding: 8px;
    border-radius: 50%;
    display: block;
    font-size: inherit;
}
.mini .image, .mini .player {
    margin: 0 auto .5em;
}
@media (min-width: 841px) {
  .mini .image, .mini .player {
      float: left;
  }
}
.mini .image img {
    box-sizing: border-box;
    height: 100%;
    border: 6px solid #fff;
    border-radius: 50%;
}
.responsive, .responsive-vertical {
    font-family: "object-fit: cover;";
    -o-object-fit: cover;
    object-fit: cover;
}
.responsive {
    width: 100%;
    height: auto;
}

.mini {
    display: none;
    text-align: left;
    opacity: 0;
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    transition: opacity .6s,-webkit-transform .6s;
    transition: opacity .6s,transform .6s;
    transition: opacity .6s,transform .6s,-webkit-transform .6s;
    font-size: .875em!important;
    color: #3f4b5d;
}

.mini.show {
    opacity: 1;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
}
.mini .title {
    font-weight: 700;
    text-transform: uppercase;
    color:#fff;
}
.mini .subtitle {
    font-weight: 600;
    color:#e9e9e9;
}
@media (min-width: 841px) {
  .mini .caption, .mini .subtitle, .mini .title, .mini figcaption {
      width: calc(100% - 96px - 1em);
      margin-left: 0;
      float: right;
  }
  .mini .title {
      margin-top: 30px;
  }
}
@media (min-width: 481px) {
  .mini {
      display: block;
  }
}

.heading-4--white a {
  color: #fff;
  display: inline!important;
  text-decoration: underline;
}
.popover-title {
    color:#333;
}
.popover-content {
    color:#333;
}
.simple-tooltip:after{
}
.simple-tooltip span, .simple-popover span, .simple-modal span {
  margin-left:3px;
}
.modal-body a{
    display: inline!important;
}


.fade-right {
    animation: faderight .5s;
    opacity: 1 !important;
}

.popup-banner {
    position: fixed;
    width: 250px;
    z-index: 1050;
    display: none;
}

.popup-banner.popup-bottom-right {
    bottom: 25px;
    right: 25px;
}

.fa {
    display: inline-block;
    font: normal normal normal 14px/1 fontawesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0);
    padding-left: 1px;
    text-transform: none;
}

.popup-banner .popup-close {
    margin-top: 2px;
    position: absolute;
    width: 22px;
    right: 0;
    padding-right: 1px;
    height: 22px;
    color: #3E3E3E;
    text-align: center;
    font-size: 11px;
    line-height: 20px;
    border-radius: 50%;
    cursor: pointer;
}

.bs-panel {
    overflow: hidden;
    position: relative;
    background-color: #FFF;
}

.popup-banner .bs-panel {
    box-shadow: 0px 2px 9px rgba(0, 0, 0, 0.1);
}

.panel-heading {
    font-size: 14px;
}

.panel-body {
    font-size: 12px;
    font-weight: 500;
    color: #909090;
}

.panel-body span {
    position: absolute;
    top: 17px;
    display: block;
    background: #9E232C;
    padding: 0 40px;
    font-weight: 900;
    right: -42px;
    transform: rotate(49deg);
    color: #fff;
}

.dropdown-menu > li > a {
    padding: 7px 20px;
}
