html {
    font-size: 62.5%;
    --color-search-background: #bddff0;
    --color-disabled-input: #EEF9F8;
    --color-pill-background: #0187c7;
    --color-button: #5ac40b;

    --color-button-default: #36a2ce;
    --color-background-blue: #35a1cd;
    --color-text-blue: #36a2ce;
    --color-background-turquoise: #47cacc;
    --color-dark-blue: #1A3F5A;
    --color-sucess: #029816;

    --color-light-green: #6ED365;
    --color-button-text: #fff;
    --color-white: #fff;
    --color-text-dark: #002d4b;
    --color-btn-light: #DEE8F1;
    --color-background: #DEEFF7;
    --color--text-grey: #8b8b8b;
    --color-wizi-background: #F4FCFF;
    --color-text-expire: #cb5b15;
    --color-warn: #47cacc;
    --color--danger: #BF0707;
    --color-font: #1D2731;
    --color-text-black: #000;
    --color-border: #b9b9b9;
    --font-xxl: 3rem;
    --font-xl: 2.4rem;
    --font-ll: 2.2rem;
    --font-l: 2rem;
    --font-m: 1.5rem;
    --border-radius: 5px;
    --border-radius-xl: 10px;
    --max-width: 1280px;
    --radius-panels: 10px;
    --radius-textbox: 9px;
    --radius-subheader-icons: 8px;
    --radius-buttons: 5px;
    --radius-tabs: 5px;
    --fullheight: 45vh;
}





.animate.animate--fade-in {
  opacity: 0;
  animation-name: fadeIn;
  animation-duration: 0.4s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(20) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 1s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(19) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.95s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(18) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.9s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(17) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.85s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(16) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.8s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(15) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.75s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(14) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.7s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(13) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.65s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(12) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.6s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(11) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.55s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(10) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.5s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(9) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.45s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(8) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.4s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(7) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.35s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(6) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.3s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(5) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.25s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(4) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.2s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(3) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.15s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(2) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.1s 1 pop-in;
  animation-fill-mode: forwards;
}
.animate.animate-pop *:nth-child(1) {
  transform-origin: center;
  opacity: 0;
  animation: 0.4s ease-out 0.05s 1 pop-in;
  animation-fill-mode: forwards;
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes pop-in {
  0% {
    transform: scale(1.2, 1);
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  100% {
    transform: translateX(0) scale(1);
    opacity: 1;
  }
}
@font-face {
  font-family: CircularStd-Black;
  src: url('/fonts/CircularStd-Black.woff') format('woff'), url('/fonts/CircularStd-Black.woff2') format('woff2'), url('/fonts/CircularStd-Black.svg') format('svg'), url('/fonts/CircularStd-Black.ttd') format('ttf');
}
@font-face {
  font-family: CircularStd-Book;
  src: url('/fonts/CircularStd-Book.woff') format('woff'), url('/fonts/CircularStd-Book.woff2') format('woff2'), url('/fonts/CircularStd-Book.svg') format('svg'), url('/fonts/CircularStd-Book.ttd') format('ttf');
}
@font-face {
  font-family: CircularStd-Medium;
  src: url('/fonts/CircularStd-Medium.woff') format('woff'), url('/fonts/CircularStd-Medium.woff2') format('woff2'), url('/fonts/CircularStd-Medium.svg') format('svg'), url('/fonts/CircularStd-Medium.ttd') format('ttf');
}
.t-r {
  text-align: right;
}
.t-c {
  text-align: center;
}
.i-b {
  display: inline-block;
}
.d-n {
  display: none !important;
}
.m-t {
  margin-top: 15px;
}
.m-b-0 {
  margin-bottom: 0 !important;
}
.m-b-40 {
  margin-bottom: 40px;
}
.v-a-bs {
  vertical-align: baseline !important;
}
.iphone-col {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  text-align: center;
}
.iphone-col h2 {
  text-align: left;
}
.iphone-col .iphone-holder {
  display: inline-block;
  width: 416px;
  height: 854px;
  overflow: hidden;
  position: relative;
  pointer-events: none;
}
.iphone-col img {
  position: relative;
  z-index: 3;
}
.iphone-col .iphone-preview {
  position: absolute;
  top: 0;
  z-index: 2;
  background: var(--color-white);
  top: 20px;
  bottom: 20px;
  left: 20px;
  right: 20px;
  overflow-y: scroll;
  pointer-events: all;
}
.iphone-col .iphone-preview::-webkit-scrollbar {
  display: none;
}
.iphone-col .iphone-preview .preview-header {
  background: transparent linear-gradient(105deg, #003A88 0%, #0187C7 100%) 0% 0% no-repeat padding-box;
  padding: 50px 10px 15px 10px;
  text-align: center;
  color: var(--color-white);
  font-size: 2.0rem;
  font-family: CircularStd-Book;
  font-weight: normal;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  box-shadow: 0px 3px 5px 2px #00000039;
  position: -webkit-sticky;
  position: sticky;
  z-index: 3;
  top: 0;
}
.iphone-col .iphone-preview .preview-header .preview-icons {
  position: absolute;
  right: 21px;
  top: 13px;
}
.iphone-col .iphone-preview .preview-header .preview-icons .r-t {
  transform: rotate(90deg) scale(1.4);
}
.iphone-col .iphone-preview .preview-header .preview-icons span {
  padding: 0 1px;
  font-size: 16px;
}
.iphone-col .iphone-preview .preview-header .menu-icon {
  position: absolute;
  right: 21px;
  bottom: 13px;
}
.iphone-col .iphone-preview .preview-body {
  position: relative;
  z-index: 1;
  margin-top: -10px;
}
.iphone-col .iphone-preview .preview-body .body-logo {
  padding-top: 20px;
  margin: 0 auto 0 auto;
  width: 100px;
  height: 100px;
  overflow: hidden;
}
.iphone-col .iphone-preview .preview-body .body-logo img {
  position: relative;
  object-fit: contain;
  width: 100%;
  height: 100%;
}
.iphone-col .iphone-preview .preview-body .body-header {
  position: relative;
  z-index: 2;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  box-shadow: 0px 3px 5px 2px #00000039;
  background-color: var(--color-white);
}
.iphone-col .iphone-preview .preview-body .body-header div {
  margin: 0 auto 5px auto;
  font-size: 1.4rem;
  font-family: CircularStd-Medium;
  max-width: 60%;
  display: flex;
  justify-content: space-between;
}
.iphone-col .iphone-preview .preview-body .body-header div span {
  font-family: CircularStd-Book;
  font-size: 1.4rem;
}
.iphone-col .iphone-preview .preview-body .body-header div.body-title {
  font-family: CircularStd-Medium;
  font-size: 1.6rem;
  justify-content: center;
  margin-top: 10px;
}
.iphone-col .iphone-preview .preview-body .body-header div.body-location {
  justify-content: center;
  font-family: CircularStd-Book;
  margin-bottom: 10px;
}
.iphone-col .iphone-preview .preview-body .body-map {
  position: relative;
  z-index: 1;
  margin-top: -20px;
}
.iphone-col .iphone-preview .preview-body .body-description {
  text-align: initial;
  padding: 10px 20px;
  font-family: CircularStd-Book;
  font-weight: normal;
}
.subheader {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-bottom: 7px;
  border-bottom: solid 1px #163C57;
  margin-bottom: 30px;
  position: relative;
}
    .subheader .subheader-icon {
        width: 34px;
        height: 34px;
        border-radius: var(--radius-subheader-icons);
        background: var(--color-button-default);
        color: var(--color-white);
        display: flex;
        align-items: center;
        justify-content: center;
    }
.subheader .subheader-title {
  color: #143853;
  padding-left: 15px;
  font-size: 2.7rem;
}
.subheader .help-guide {
  position: absolute;
  right: 0;
  bottom: 26px;
  margin-bottom: 0;
}
.row {
  display: block;
  letter-spacing: -0.31em;
  box-sizing: border-box;
  margin: 0 -10px;
  text-align: left;
}
.row.row--narrow .col-1,
.row.row--narrow .col-2,
.row.row--narrow .col-3,
.row.row--narrow .col-4,
.row.row--narrow .col-5,
.row.row--narrow .col-6,
.row.row--narrow .col-7,
.row.row--narrow .col-8,
.row.row--narrow .col-9,
.row.row--narrow .col-10,
.row.row--narrow .col-12,
.row.row--narrow .col-12 {
  margin-bottom: 0;
}
.col {
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-1 {
  width: 8.33333333%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-1.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-2 {
    width: 16.66666667%;
    display: inline-block;
    letter-spacing: normal;
    padding: 0 10px;
    margin-bottom: 20px;
    vertical-align: top;
}
.col-2.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-3 {
  width: 25%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-3.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-4 {
  width: 33.33333333%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-4.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-5 {
  width: 41.66666667%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-5.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-6 {
  width: 50%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-6.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-7 {
  width: 58.33333333%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-7.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-8 {
  width: 66.66666667%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-8.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-9 {
  width: 75%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-9.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-10 {
  width: 83.33333333%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-10.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-11 {
  width: 91.66666667%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-11.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.col-12 {
  width: 100%;
  display: inline-block;
  letter-spacing: normal;
  padding: 0 10px;
  margin-bottom: 20px;
  vertical-align: top;
}
.col-12.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.nls .row {
  letter-spacing: 0;
}
.genius-modal-body-inner .row {
  margin: 0;
}
option,
select {
  font-family: circularStd-Medium, sans-serif;
}
.form-group {
  display: block;
  margin-bottom: 20px;
}
.form-group.form-group--disabled {
  pointer-events: none;
  opacity: 0.9;
}
.form-group label {
  font-size: 2.2rem;
  color: var(--color-label);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: CircularStd-book;
  padding-bottom: 10px;
  font-weight: normal;
}
    .form-group label .info-icon span {
        color: var( --color-background-turquoise);
    }
.form-group select,
.form-group input {
  font-family: CircularStd-Medium;
  height: 45px;
  color: var(--color-label);
  border-radius: var(--radius-textbox);
  border: solid 1px var(--color-border);
  font-size: 1.6rem;
  padding: 5px 10px;
  display: block;
  width: 100%;
}
.form-group select:disabled,
.form-group input:disabled {
  background: var(--color-disabled-input);
}
.form-group option {
  font-family: CircularStd-Medium;
}
.form-group .form-image {
  border-radius: var(--radius-textbox);
  border: solid 1px var(--color-border);
  width: 100%;
  background: var(--color-wizi-background);
  position: relative;
}
.form-group .form-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.form-group .form-map {
  border-radius: var(--radius-textbox);
  border: solid 1px var(--color-border);
  width: 100%;
  background: var(--color-wizi-background);
  position: relative;
  padding: 0;
}
.form-group .form-map img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.field-validation-error {
  font-family: CircularStd-Book;
  color: var(--color--danger);
}
.field-validation-error span {
  font-size: 1.4rem;
}
.btn {
  border-radius: var(--radius-buttons);
  padding: 0 20px;
  color: var(--color-white);
  font-family: CircularStd-Black;
  font-size: 1.9rem;
  text-align: center;
  font-weight: normal;
  text-decoration: none;
  position: relative;
  border: none;
  display: inline-flex;
  height: 40px;
  align-items: center;
  justify-content: center;
}
.btn.btn--wide {
  padding: 15px 40px;
}
.btn span {
  display: inline-block;
  vertical-align: middle;
}
.btn span:last-child {
  font-size: 1.6rem;
  padding-left: 5px;
}
    .btn.btn-light-primary {
        background: var(--color-button-default);
    }
    .btn.btn-primary {
        background: var(--color-button-default);
    }
        .btn.btn-primary:hover {
            background: var(--color-background-turquoise);
            transition: background-color 300ms ease;
        }
    .btn.btn-light-primary:hover {
        background: var(--color-background-turquoise);
        transition: background-color 300ms ease;
    }
    .btn.btn-default {
        background: var( --color-background-turquoise);
    }
    .btn.btn-default:hover {
        background: var(--color-background-turquoise);
        transition: background-color 300ms ease;
    }
.btn.btn-danger {
  background: var(--color--danger);
}
.btn.btn-warn {
  background: var(--color-warn);
}
.btn.btn-dark {
  background: var(--color-text-dark);
}
.navbar-container {
    background: var(--color-white);
    height: 60px;
    position: relative;
    z-index: 3;
}
.navbar-container:hover {
  z-index: 3;
}
.navbar-inner {
    display: flex;
    height: 60px;
    margin: 0 auto;
    max-width: var(--max-width);
    justify-content: space-between;
    align-items: center;
    color: var(--color-text-blue);
    padding: 0 20px;
    box-sizing: content-box;
}
.navmenu {
  position: relative;
}
    .navmenu .navmenu-button {
        cursor: pointer;
        color: var(--color-text-blue);
    }
.navmenu span {
  display: inline-block;
  vertical-align: middle;
}
.navmenu ul,
.navmenu li {
  list-style: none;
  padding: 0;
  margin: 0;
}
.navmenu-list {
  position: absolute;
  background: var(--color-white);
  border-radius: var(--border-radius);
  right: -16px;
  top: 30px;
  max-height: 0;
  overflow: hidden;
  cursor: pointer;
  transition: max-height 0.1s linear;
  box-shadow: 0px 3px 6px #00000029;
}
.navmenu-list.navmenu-list--active {
  max-height: 510px;
}
.navmenu-list:after {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 8px 8px 8px;
  border-color: transparent transparent #ffffff transparent;
  position: absolute;
  top: -8px;
  content: '';
  right: 20px;
  z-index: 3;
}
.navmenu-list:before {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 9px 9px 9px;
  border-color: transparent transparent var(--color-border) transparent;
  position: absolute;
  top: -9px;
  content: '';
  right: 20px;
  z-index: 2;
}
li.navmenu-item {
  border-bottom: solid 1px var(--color-border);
  padding: 7px 5px;
  display: block;
  position: relative;
}
li.navmenu-item a {
  display: block;
  white-space: nowrap;
  padding: 8px 40px 8px 20px;
  font-size: 1.4rem;
  color: var(--color-text-black);
  text-decoration: none;
  font-family: CircularStd-Black;
  border-radius: var(--border-radius);
}
li.navmenu-item a:hover {
  background: #0187c71A;
}
li.navmenu-item input {
  display: none;
}
li.navmenu-item button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  border: none;
  background: transparent;
  padding: 8px 20px 8px 20px;
}
li.navmenu-item button span {
  color: var(--color-text-black);
  position: relative;
  right: initial;
  top: initial;
  font-size: 2.2rem;
}
li.navmenu-item button span:first-child {
  font-family: CircularStd-Black;
  font-size: 1.4rem;
}
li.navmenu-item:last-child {
  border-bottom: none;
}
li.navmenu-item span {
  position: absolute;
  right: 10px;
  top: 15px;
  font-size: 15px;
}
footer {
    padding-top: 100px;
    background: #f5f7f9;
}
.nav-link--hover {
  position: relative;
}
.nav-link--hover:after {
  content: '';
  position: absolute;
  left: -50px;
  top: -50px;
  bottom: -100px;
  right: -50px;
}

.body-account footer {
  padding-top: 0;
}
.div-block-5 {
  pointer-events: none;
  display: none;
}
.navbar-4 {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  background: #fff;
  width: initial;
  z-index: 1;
}
.navbar-4:hover {
  z-index: 4;
}
.signup--hidden {
  opacity: 0;
  pointer-events: none;
}
.list-item {
  padding: 20px 30px;
  margin-bottom: 20px;
  background: var(--color-white);
  box-shadow: 0px 3px 25px #00000029;
  border-radius: var(--radius-panels);
  display: grid;
  grid-template-columns: 350px 1fr 1fr 1fr auto;
  min-height: 120px;
}
.list-item.list-item--3 {
  grid-template-columns: 250px 1fr auto;
}
.list-item.list-item--3 .list-title {
  border-right: solid 2px #e2e2e2;
}
.list-item.list-item--3 .list-info--single {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px 0 40px;
}
.list-item.list-item--3 .list-info--single .info-block {
  flex: 1;
}
.list-item.list-item--slim {
  min-height: 50px;
}
.list-item .list-item-row {
  grid-row: 2;
  padding-top: 20px;
  grid-column: 0.16666667;
}
.list-item .list-title {
  grid-column: 1;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
}
.list-item .list-title h3 {
  font-weight: normal;
  margin: 0;
  font-size: 2.0rem;
}
.list-item .list-title .list-status .circle {
  width: 10px;
  height: 10px;
  background: var(--color-sucess);
  display: inline-block;
  vertical-align: middle;
  border-radius: 50%;
  margin-right: 5px;
}
.list-item .list-title .list-status span {
  font-weight: normal;
  font-size: 1.3rem;
  display: inline-block;
  vertical-align: middle;
  color: var(--color-sucess);
}


.list-item .list-title .list-status.Approval-Rejected .circle,
.list-item .list-title .list-status.Closed .circle {
  background: var(--color--danger);
}
.list-item .list-title .list-status.Approval-Rejected span,
.list-item .list-title .list-status.Closed span {
  color: var(--color--danger);
}
.list-item .list-info {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.list-item .list-info--2 {
  grid-column: 2;
}
.list-item .list-info--3 {
  grid-column: 3;
}
.list-item .list-info--4 {
  grid-column: 4;
}
    .list-item .list-info--5 {
        grid-column: 5;
        display: flex;
        flex-direction: row;
        position: relative;
        justify-content: space-between;
        margin: 0 auto;
    }
.list-item .list-info--5.list-info {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.list-item .list-info--5 .btn {
  align-self: center;
  padding: 10px;
  font-size: 1.5rem;
  margin: 0 3px;
  min-width: 80px;
}
.info-block .title {
  font-size: 1.3rem;
  font-family: CircularStd-Black;
}
.info-block .info {
  font-size: 1.3rem;
  font-family: CircularStd-Medium;
}
.pills {
  display: inline-block;
  padding: 0;
  margin: 0;
  list-style-type: none;
}
.pills li {
  list-style-type: none;
  padding: 8px 20px;
  background: var(--color-pill-background);
  border-radius: var(--border-radius);
  font-family: CircularStd-Black;
  display: inline-block;
  font-size: 1.6rem;
  color: var(--color-white);
  margin-right: 3px;
}
.flex-row {
  display: flex;
  flex-direction: row;
}
.flex-row.flex-row--sp {
  justify-content: space-between;
  align-items: center;
}
.flex-row .flex-row__even {
  flex: 1;
}
.flex-row .flex-row__half {
  flex: 0.5;
}
.accordian-body {
  overflow: hidden;
  max-height: 0;
}
.genius-modal {
  display: none;
  background-color: transparent;
}
.genius-modal.genius-modal--active {
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 50;
  align-items: center;
  justify-content: center;
  background-color: #00000033;
  animation-name: backgroundColour;
  animation-duration: 0.2s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  perspective: 500px;
}
.genius-modal.genius-modal--active .genius-modal-body {
  animation-name: modalEnter;
  animation-timing-function: ease-in-out;
  animation-duration: 0.3s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  max-width: 1280px;
  left: -16px;
  padding: 0;
  margin: 40px;
  width: 100%;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--small {
  max-width: 500px;
  padding: 30px;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--small .form-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--small .form-group button {
  margin-top: 30px;
  padding: 8px 30px 8px 20px;
  font-family: CircularStd-Medium;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple {
  animation-name: modalEnterSimple;
  animation-timing-function: ease-in-out;
  animation-duration: 0.3s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple .list-item {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple .list-item button {
  opacity: 0;
  pointer-events: none;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple .genius-modal-body-inner {
  position: relative;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple .genius-modal-body-inner::-webkit-scrollbar {
  width: 0;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple .application-details {
  padding: 30px;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple .application-details h1,
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple .application-details h2 {
  font-size: 2.0rem;
  color: var(--color-text-dark);
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple .application-details dt {
  font-size: 2.0rem;
  color: var(--color-text-dark);
  font-family: CircularStd-Book;
  margin: 3px 0;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple .application-details dd {
  font-family: CircularStd-Book;
  margin: 3px 0;
  font-size: 2.0rem;
}
.genius-modal.genius-modal--active .genius-modal-body.genius-modal-body--simple .application-details dd a {
  font-size: inherit;
  margin: inherit;
  font-family: inherit;
  color: inherit;
}
.genius-modal.genius-modal--active .genius-modal-body hr {
  border-top: 1px solid var(--color-pill-background);
}
.genius-modal.genius-modal--active .genius-modal-body dd {
  color: var(--color-pill-background);
}
.genius-modal-body {
  background: var(--color-white);
  box-shadow: 0px 3px 25px #00000029;
  border-radius: var(--border-radius);
  grid-template-columns: 350px 1fr 1fr 1fr 180px;
  padding: 20px 40px;
  position: relative;
  opacity: 0;
  z-index: 2;
}
.genius-modal-body.genius-modal-body--simple.application {
  background: var(--color-white);
  padding: 0;
}
.genius-modal-body.genius-modal-body--simple.application .genius-modal-body-inner {
  padding-right: 0;
}
.genius-modal-body .form-group textarea {
  display: block;
  margin-bottom: 10px;
  font-family: CircularStd-Medium;
  height: 45px;
  color: var(--color-label);
  border-radius: var(--border-radius);
  border: solid 1px var(--color-border);
  font-size: 1.6rem;
  width: 100%;
  min-width: 300px;
  height: 108px;
  resize: none;
}
.genius-modal-body .genius-modal-body-inner {
  max-height: 80vh;
  overflow-y: auto;
  padding-right: 25px;
  /* Track */
  /* Handle */
  /* Handle on hover */
}
.genius-modal-body .genius-modal-body-inner::-webkit-scrollbar {
  width: 10px;
}
.genius-modal-body .genius-modal-body-inner::-webkit-scrollbar-track {
  background: #88888833;
  border-radius: 10px;
}
.genius-modal-body .genius-modal-body-inner::-webkit-scrollbar-thumb {
  background: #88888899;
  border-radius: 10px;
}
.genius-modal-close {
  z-index: -1;
  position: absolute;
  background: transparent;
  width: 30px;
  height: 30px;
  border: none;
  right: -20px;
  top: -20px;
  background: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: rotate-in-hor 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  animation-delay: 0.2s;
  opacity: 0;
}
.genius-modal-close span {
  color: var(--color-text-blue);
}
.info-popup {
  width: 280px;
  padding: 3rem 1.5rem 1.5rem 1.5rem;
  color: var(--color-white);
  background: var(--color-light-green);
  border-radius: 9px;
  font-family: CircularStd-Book;
  font-size: 1.4rem;
  font-weight: 100;
  line-height: 21px;
  opacity: 0;
  animation-name: modalEnterSimple;
  animation-timing-function: ease-in-out;
  animation-duration: 0.3s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
.info-popup .material-icons {
  position: absolute;
  right: 5px;
  top: 5px;
  cursor: pointer;
}
@keyframes backgroundColour {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #00000066;
  }
}
@keyframes modalEnter {
  0% {
    opacity: 0;
    transform: rotateX(-30deg) translateY(50%);
  }
  100% {
    opacity: 1;
    transform: rotateX(0) translateY(0);
  }
}
@keyframes modalEnterSimple {
  0% {
    opacity: 0;
    transform: rotateX(-1deg) translateY(10%);
  }
  100% {
    opacity: 1;
    transform: rotateX(0) translateY(0);
  }
}
/* ----------------------------------------------
 * Generated by Animista on 2020-9-11 15:1:51
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */
/**
 * ----------------------------------------
 * animation rotate-in-hor
 * ----------------------------------------
 */
@keyframes rotate-in-hor {
  0% {
    transform: rotateZ(90deg);
    transform-origin: bottom left;
    opacity: 0;
  }
  100% {
    transform: rotateX(0deg);
    transform-origin: bottom left;
    opacity: 1;
  }
}

.container-inner {
  margin: 0 auto;
  max-width: var(--max-width);
  min-height: var(--fullheight);
  position: relative;
  padding: 60px 20px 20px 20px;
  box-sizing: content-box;
}
.flex-container {
  display: flex;
}
.flex-container.flex-container--fullHeight {
  min-height: inherit;
}
.flex-container.flex-container--vc {
  align-items: center;
}
.flex-container.flex-container-jc {
  justify-content: center;
}
.flex-container .flex-panel {
  width: 100%;
  max-width: 600px;
}
.flex-container .flex-panel .btn {
  width: 100%;
  margin: 0 auto;
  display: block;
  width: calc(100% - 40px);
}
.flex-container .flex-panel .vacancy-management-banner-container {
  position: absolute;
  right: -95%;
  top: 50%;
  transform: translateY(-50%);
}
.flex-column {
  display: flex;
  justify-content: space-between;
  padding: 0 40px;
}
.flex-column li {
  flex: 1;
  padding: 0 10px;
}
.flex-column li a {
  width: 100%;
}
.tox .tox-edit-area__iframe {
  background: var(--color-wizi-background);
}
#tinymce * {
  background-color: transparent !important;
}
.home-body {
  height: 100%;
  position: relative;
  min-height: inherit;
  display: grid;
  grid-template-columns: 50% 50%;
  padding: 0 20px;
}
.home-left {
  display: flex;
  height: inherit;
  justify-content: center;
  align-items: flex-start;
  grid-column: 1;
  flex-direction: column;
}
.home-left.congratulations-left h1 {
  font-size: 6.0rem;
}
.home-left.congratulations-left h2 {
  font-size: 3.0rem;
  font-weight: normal;
}
.home-left.congratulations-left h3 {
  font-size: 3.0rem;
  font-weight: normal;
  color: var(--color-text-blue);
}
.home-left h1 {
  font-size: 4.0rem;
  font-weight: normal;
  font-family: CircularStd-Black;
  margin: 0;
  color: var(--color-font);
  opacity: 0;
  animation-name: fadeInUp;
  animation-duration: 0.4s;
  animation-delay: 0.2s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  animation-timing-function: ease-in;
}
.home-left h2 {
  margin: 0;
  font-weight: normal;
  margin-top: 15px;
  font-size: 2.0rem;
  color: var(--color-font);
  opacity: 0;
  animation-name: fadeInUp;
  animation-duration: 0.4s;
  animation-delay: 0.2s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  animation-timing-function: ease-in;
}
.home-left .btn-container {
  display: flex;
  width: 100%;
  justify-content: space-between;
  margin-top: 50px;
  opacity: 0;
  animation-name: fadeIn;
  animation-duration: 0.5s;
  animation-delay: 0.5s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  animation-timing-function: ease-in;
}
.home-left .btn-container .btn {
  width: 49%;
}
.home-right {
  display: flex;
  height: inherit;
  justify-content: center;
  align-items: center;
  grid-column: 2;
}
.home-right.congratulations-right {
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-around;
}
@media screen and (max-width: 960px) {
  .home-body {
    display: block;
  }
  .home-right {
    margin-top: 4rem;
  }
}
.account-layout {
  height: 68vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
.account-layout a,
.account-layout p {
  color: #fff;
  text-align: center;
  font-family: CircularStd-Book;
  font-size: 1.6rem;
  text-decoration: none;
}
.account-layout main {
  display: block;
  width: 100%;
  max-width: 600px;
  box-sizing: content-box;
  padding: 0 20px;
}
    .account-layout main section {
        max-width: 450px;
        margin: 0 auto;
    }


.account-layout h2 a {
  font-size: inherit;
  font-family: inherit;
  color: currentColor;
}
.account-layout h3 {
  text-align: center;
  color: var(--color-search-background);
  font-size: 1.6rem;
  font-family: CircularStd-Medium;
  font-weight: 100;
  margin: 25px 0;
}
.account-layout .account-control {
  display: block;
  height: 54px;
  position: relative;
  z-index: 2;
  transition: transform 0.3s linear;
  transition-delay: 0.3s;
}
.account-layout .account-control input {
  box-shadow: 0px 3px 26px #0000004D;
  width: 100%;
  height: 100%;
  border-top-left-radius: 9px;
  border-top-right-radius: 9px;
  border: none;
  text-indent: 10px;
  transition: border-radius 0.3s linear;
  transition-delay: 0.3s;
}
.account-layout .account-control.account-control--single {
  margin: 25px 0;
}
.account-layout .account-control.account-control--single input {
  border-radius: 9px;
}
.account-layout .account-control + .account-control:not(.account-control--single) {
  z-index: 1;
}
.account-layout .account-control + .account-control:not(.account-control--single) input {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: 9px;
  border-bottom-right-radius: 9px;
}
.account-layout .account-control + .account-control:not(.account-control--single) .account-button {
  opacity: 0;
}

.account-layout .account-control .account-button span {
  color: var(--color-white);
}
.account-layout .remember-me {
  display: block;
  margin-top: 15px;
  color: var(--color-white);
  text-align: center;
}
.account-layout .remember-me input {
  width: 21px;
  height: 21px;
  display: inline-block;
  vertical-align: middle;
}
    .account-layout .remember-me span {
        display: inline-block;
        vertical-align: middle;
        color: var(--color-text-blue);
    }
.account-layout .forgot-password {
  text-align: center;
  display: block;
  margin-top: 10px;
  text-decoration: none;
  color: var(--color-background-turquoise);
}
.account-layout .text-danger {
  color: var(--color--danger);
}
.account-layout .text-danger span {
  color: inherit;
}
.account-form.account-form--pristine .account-control:nth-child(1) input {
  border-bottom-left-radius: 9px;
  border-bottom-right-radius: 9px;
}
.account-form.account-form--pristine .account-control:nth-child(2) {
  transform: translateY(-100%) scaleY(0);
}
.account-form.account-form--password .account-control:nth-child(1) .account-button {
  opacity: 0;
}
.account-form.account-form--password .account-control:nth-child(1) input {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.account-form.account-form--password .account-control:nth-child(2) {
  transform: translateY(0) scaleY(1);
}
.account-form.account-form--password .account-control:nth-child(2) .account-button {
  transition-delay: 0.8s;
  opacity: 1;
}
.account-form .validation-summary-errors ul,
.account-form .validation-summary-errors li {
  padding: 0;
  margin: 0;
  list-style-type: none;
  color: var(--color-text-expire);
  text-align: center;
}
.account-form .validation-summary-errors ul {
  margin-top: 5px;
}
ul.nav {
  margin: 0;
  position: relative;
}
ul.nav li {
  display: inline-block;
}
    ul.nav li a {
        display: inline-block;
        padding: 1rem;
        border-radius: var(--radius-tabs) var(--radius-tabs) 0 0;
        background-color: var(--color-button-default);
        color: var(--color-white);
        text-decoration: none;
        font-size: 2.1rem;
        text-align: center;
        font-family: CircularStd-Book;
    }
        ul.nav li a.active {
            background-color: #fff;
            color: var(--color-label);
            box-shadow: 0px -4px 10px -2px #00000029;
        }
.account-container {
  background-color: var(--color-white);
  border-radius: var(--radius-panels);
  box-shadow: 0px 0px 10px 0px #00000029;
  padding: 0 5em;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 450px;
}
.account-container form {
  flex: 1;
  max-width: 400px;
  position: relative;
}
.account-container h1 {
  font-size: 3rem;
  color: var(--color-label);
}
.advertise-now-container h1 {
  font-size: 3.4rem;
  color: var(--color-font);
  margin-top: 0;
}
.advertise-now-container h2 {
  font-size: 2.0rem;
  font-family: CircularStd-Book;
  max-width: 340px;
  margin: 30px 0;
}
.advertise-now-container .vacancy-management-banner-container {
  margin-top: 200px;
}
.form-group.iphone-uploader {
  border: solid 1px var(--color-text-dark);
  padding: 20px 20px 0 20px;
  border-radius: 9px;
  font-family: CircularStd-Book;
  display: grid;
  grid-template-columns: auto 416px;
  transition: border 0.3s linear;
}
.form-group.iphone-uploader.highlight {
  border: dashed 1px var(--color-text-dark);
}
.form-group.iphone-uploader .iphone-holder {
  transform: scale(0.95);
  transform-origin: bottom;
}
.form-group.iphone-uploader .drag-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.form-group.iphone-uploader h1,
.form-group.iphone-uploader h2 {
  font-family: inherit;
  text-align: left;
  padding: 0 !important;
}
.form-group.iphone-uploader h1 {
  text-transform: uppercase;
  font-size: 1.8rem;
}
.form-group.iphone-uploader h2 {
  font-size: 1.4rem !important;
  border: none !important;
}
label.uploader {
  padding: 0 40px 0 0;
  cursor: pointer;
}
label.uploader input {
  width: 0;
  height: 0;
  position: absolute;
  overflow: hidden;
  border: none;
  left: -1000px;
}
label.uploader .btn {
  padding: 10px 20px;
  font-family: CircularStd-Medium;
  font-size: 1.6rem;
}
.sticky-top {
  position: -webkit-sticky;
  position: sticky;
  top: 120px;
}
.row.company-info-container {
  display: grid;
  grid-template-columns: auto 1fr;
  padding: 60px 20px;
  box-sizing: border-box;
  margin: 0 auto;
}
.row.company-info-container .col-4 {
  width: initial;
  grid-column: 1;
  padding: 0 20px;
}
.row.company-info-container .col-6 {
  width: initial;
  grid-column: 2;
  padding: 0 20px;
}
.row.company-info-container .advertise-now-container {
  position: -webkit-sticky;
  position: sticky;
  top: 270px;
}
@media screen and (max-width: 1120px) {
  .row.company-info-container .form-group.iphone-uploader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
}
@media screen and (max-width: 959px) {
  .row.company-info-container {
    display: flex;
    flex-direction: column-reverse;
  }
  .row.company-info-container .advertise-now-container {
    margin-bottom: 60px;
  }
  .row.company-info-container .advertise-now-container h1 {
    text-align: center;
  }
  .row.company-info-container .advertise-now-container h2 {
    margin: 0 auto;
    text-align: center;
  }
  .row.company-info-container .advertise-now-container a {
    margin: 100px auto 60px auto;
  }
}
@media screen and (max-width: 960px) {
  .vacancy-create-container .col-6 {
    width: 100%;
    padding-right: 80px;
  }
  .vacancy-create-container .col-6.iphone-col {
    position: fixed;
    right: 0;
    top: 70px;
    z-index: 1000;
    width: 416px;
    transform: translateX(98%);
    transition: transform 0.3s linear;
  }
  .vacancy-create-container .col-6.iphone-col.iphone-col--preview {
    transform: translateX(-20px);
  }
  .vacancy-create-container .col-6.iphone-col .subheader {
    display: none;
  }
  .vacancy-create-container .col-6.iphone-col:after {
    position: absolute;
    content: 'Preview';
    transform: rotateZ(-90deg);
    left: -105px;
    top: 50%;
    width: 190px;
    text-align: center;
    height: 45px;
    font-size: 2.1rem;
    color: #fff;
    line-height: 45px;
    background: var(--color-button);
    border-top-left-radius: 9px;
    border-top-right-radius: 9px;
  }
}
.legless {
  margin-bottom: -140px;
}
.vacancy-terms {
  margin-bottom: 20px;
}
.vacancy-terms * {
  display: inline-block;
  vertical-align: middle;
}
.vacancy-terms input {
  width: 30px;
  height: 30px;
}
@media screen and (max-width: 1100px) {
  .genius-modal-body-inner .list-item,
  .vacancy-results-container .list-item {
    display: flex;
    flex-wrap: wrap;
  }
  .genius-modal-body-inner .list-item .list-title,
  .vacancy-results-container .list-item .list-title {
    width: 100%;
    margin-bottom: 20px;
  }
  .genius-modal-body-inner .list-item .list-info--3,
  .vacancy-results-container .list-item .list-info--3,
  .genius-modal-body-inner .list-item .list-info--2,
  .vacancy-results-container .list-item .list-info--2 {
    flex: 1;
  }
}
@media screen and (max-width: 650px) {
  .genius-modal-body-inner .list-item .list-info--5,
  .vacancy-results-container .list-item .list-info--5 {
    width: 100%;
    margin-top: 20px;
    justify-content: center;
  }
}
.vacancy-card {
  grid-template-columns: 350px 1fr auto;
  align-items: center;
}
.application {
  background: var(--color-background);
}
.application-inner {
  min-width: 75vw;
  overflow-x: hidden;
}
.application-inner h4 {
  font-size: 2.2rem;
  color: var(--color-label);
  display: block;
  font-family: CircularStd-book;
  padding-bottom: 10px;
  font-weight: normal;
  margin: 20px 0;
}
.page-help {
  margin-bottom: 5rem;
}
.page-help h1 {
  text-align: center;
  font-size: 3.8rem;
  margin-bottom: 1.5em;
}
.page-help h2 {
  font-size: 2.7rem;
}
.page-help::after {
  content: url('/images/svgs/people.svg');
  height: 700px;
  width: 667px;
  display: block;
  position: absolute;
  bottom: 5rem;
  right: 0px;
}
.help-header {
  background-color: var(--color-white);
  padding: 10px 41px;
  box-shadow: 0px 3px 25px #00000029;
  border-radius: 8px;
  margin-bottom: 3em;
}
.help-header::after {
  content: url('/images/svgs/phone.svg');
  height: 640px;
  width: 385px;
  display: block;
  position: absolute;
  top: 75px;
  right: 115px;
}
.help-header h2,
.help-header p {
  width: 553px;
}
.helpguide-col1 {
  margin-left: 41px;
  width: 553px;
  color: var(--color-font);
}
.helpguide-col1 h3 {
  color: var(--color-label);
  font-size: 1.9rem !important;
}
.helpguide-col1 h3.help-warning-sign {
  padding-left: 30px;
  position: relative;
}
.helpguide-col1 h3.help-warning-sign::before {
  content: url('/images/svgs/warning.svg');
  height: 24px;
  width: 26px;
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
}
@media only screen and (max-width: 1280px) {
  .page-help::after {
    height: 700px;
    width: 667px;
    transform: scale(0.5);
  }
}
@media only screen and (max-width: 1150px) {
  .page-help::after {
    content: none;
  }
  .help-header h2,
  .help-header p {
    width: auto;
  }
  .help-header::after {
    content: none;
  }
  .helpguide-col1 {
    width: auto;
    margin: 0 41px;
  }
}
body {
    padding: 0;
    margin: 0;
    font-family: "circularStd-Medium", sans-serif;
    font-size: 62.5%;
    background: #f5f7f9;
}
body * {
  box-sizing: border-box;
  font-size: 1.6rem;
  font-weight: normal;
}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: 'liga';
}
header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 10;
}
/*Bootstrap fixes - Mark */
.row .col-sm-2,
.row .col-sm-10 {
  letter-spacing: normal;
  width: 40%;
  display: inline-block;
}
.row .col-6 h2 {
  border-bottom: 1px solid #163C57;
  font-size: 2.3rem;
  padding-left: 50px;
}
.container h1,
.container h2 {
  line-height: initial;
}
button {
  cursor: pointer;
}
.item-open {
  color: var(--color-sucess);
}
.list-item form {
  display: contents;
}
.form-map .form-group {
  margin: 0;
}
.form-map .form-group label {
  color: #fff;
}
.form-map .col-6 {
  width: 49%;
  padding-top: 1em;
}
.form-map .pin-message-container {
  position: absolute;
  left: 50%;
  z-index: 410;
  top: 0;
}
.form-map .pin-message-container .pin-message {
  background-color: #002d4b;
  color: #fff;
  border-radius: 0 0 .5em .5em;
  padding: .5em 1em;
  left: -50%;
  position: relative;
}
.vacancy-management-banner-container {
  border-radius: var(--radius-buttons);
  width: 370px;
  background-color: var(--color-dark-green);
  color: var(--color-white);
  display: block;
  text-decoration: none;
  margin-bottom: 1em;
  position: relative;
}
.vacancy-management-banner-container .vacancy-management-banner {
    margin-right: 1em;
    font-size: 2.1rem;
    padding: 1em 1em 1em 100px;
    border-radius: .5em;
    background-color: var(--color-background-turquoise);
    display: inline-block;
    width: 325px;
}
.vacancy-management-banner-container .vacancy-management-banner strong {
  font-size: 2.1rem;
  font-family: CircularStd-Black;
}
.vacancy-management-banner-container::before {
  content: url('/images/svgs/banner-person.svg');
  height: 46px;
  width: 46px;
  display: block;
  position: absolute;
  top: -90px;
  left: 5px;
}
    .vacancy-management-banner-container::after {
        content: " ";
        top: 50%;
        transform: translateY(-50%);
        position: absolute;
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-left: 10px solid #47cacc;
    }
.help-guide {
    display: inline-block;
    background-color: var(--color-background-turquoise);
    color: var(--color-white);
    text-decoration: none;
    border-radius: .5em;
    padding: 1.2em 1em 1.2em 75px;
    display: flex;
    margin-bottom: 0;
    align-items: center;
    justify-content: center;
}
.help-guide::before {
  content: url('/images/svgs/help.svg');
  height: 10px;
  width: 100px;
  display: block;
  margin-left: -100px;
  position: relative;
  top: -61px;
  right: 21px;
}
.create-new-nexjob {
    display: inline-block;
    background-color: var(--color-background-blue);
    color: var(--color-white);
    text-decoration: none;
    border-radius: var(--radius-buttons);
    padding: .6em 75px 0 1em;
    height: 38px;
    position: relative;
}
.create-new-nexjob::after {
  content: url('/images/svgs/plus-2.svg');
  height: 46px;
  width: 46px;
  display: block;
  position: absolute;
  top: -12px;
  right: 12px;
}
.download-report {
  /*display: block;*/
  position: relative;
  color: #000;
  text-decoration: none;
}
.download-report span {
  display: inline-block;
  vertical-align: middle;
}

@media screen and (max-width: 1075px) {
    .list-item {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

        .list-item .list-title {
            width: 100%;
        }
        .list-item .list-info--5 .btn {
            margin: 0 5px 0 0;
        }

        .list-item .list-info {
            display: flex;
            flex-direction: inherit;
            margin: 15px 0;
        }
        .info-block {
            margin-right: 30px;
        }
}

@media screen and (max-width: 785px) {
    /* remove grid from page */
    .remove-grid {
        display: block !important;
    }

    .row {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }
    .col-3 {
        width: auto;
        display: flex;
        align-items: center;
    }
    .form-group select, .form-group input {
        width: 100%;
    }
    .col-2 {
        width: 100%;
    }
    .btn-padding {
        padding-top: 14px;
    }
}

@media screen and (max-width: 650px) {
    .home-left h1 {
        font-size: 3.5rem;
    }

    .home-body {
        padding: 0 10px;
    }
}


@media screen and (max-width: 533px) {
    .btn-padding {
        padding-top: 34px;
    }
}

@media screen and (max-width: 518px) {
    .form-group.iphone-uploader .iphone-holder {
        display: none;
    }
}

@media screen and (max-width: 500px) {
    .account-container {
        padding: 0 2.5em;
    }
    .row.company-info-container .advertise-now-container a {
        display: none;
    }
    .row.company-info-container .advertise-now-container {
        margin-bottom: 0px;
    }
    .col-4 {
        margin: 20px 0;
    }
    .row.company-info-container {
        padding: 60px 20px 0px 20px;
    }
    .row {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .col-3 {
        width: auto;
        display: flex;
        align-items: center;
    }
    .list-item .list-info--5 {
        grid-column: 5;
        display: grid;
        flex-direction: row;
        position: relative;
        grid-row-gap: 10px;
        grid-template-columns: 1fr 1fr;
    }
    .home-left h1 {
        font-size: 2.5rem;
    }
    .btn-padding {
        padding-top: 0px;
    }
}

@media screen and (max-width: 445px) {
    .flex-column {
        padding: 0 5px;
    }
    .flex-column li {
        padding: 0 7px;
    }
    ul.nav li a {
        font-size: 1.8rem !important;
    }
    .list-item .list-info {
        display: flex;
        flex-direction: column;
        justify-content: end;
    }
    .info-block {
        margin-bottom: 8px;
    }
}

@media screen and (max-width: 432px) {
    .vacancy-management-banner-container .vacancy-management-banner {
        font-size: 1.6rem;
        width: 289px;
    }
    .list-item .list-info--5 .btn {
        font-size: 1.3rem;
    }
}

@media only screen and (max-width: 319px) {
    .v-a-bs {
        margin-top: 28px;
    }
}

@media screen and (max-width: 422px) {
    .btn {
        font-size: 1.5rem;
    }
    .list-item .list-title h3 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 372px) {
    .home-left h1 {
        font-size: 2.2rem;
    }
    .create-new-nexjob {
        font-size: 1.4rem;
        padding: .6em 60px 0 1em !important;
    }
    .flex-column {
        padding: 0 0px;
    }
    .account-container {
        padding: 0 2em;
    }
    .home-left h1 {
        font-size: 2.2rem;
    }
}

@media screen and (max-width: 335px) {
    .create-new-nexjob {
        font-size: 1.3rem;
        padding: .6em 55px 0 1em !important;
    }
}


/* Updated Styles*/ 

.container {
    /*    background: var(--color-background);*/
    background: #f5f7f9;
    opacity: 1;
}

.subheader .subheader-icon {
    width: 34px;
    height: 34px;
    border-radius: var(--radius-subheader-icons);
    background: var(--color-button-default);
    color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
}

.list-item .list-title .list-status.Pending span,
.list-item .list-title .list-status.Draft span {
    color: var(--color-warn);
}

.list-item .list-title .list-status.Pending .circle,
.list-item .list-title .list-status.Draft .circle {
    background: var(--color-warn);
}

.form-group label .info-icon span {
    color: var( --color-background-turquoise);
}

.btn.btn-light-primary {
    background: var(--color-button-default);
}

.btn.btn-primary {
    background: var(--color-button-default);
}

    .btn.btn-primary:hover {
        background: var(--color-background-turquoise);
        transition: background-color 300ms ease;
    }

.btn.btn-light-primary:hover {
    background: var(--color-background-turquoise);
    transition: background-color 300ms ease;
}

.btn.btn-default {
    background: var( --color-background-turquoise);
}

    .btn.btn-default:hover {
        background: var(--color-background-turquoise);
        transition: background-color 300ms ease;
    }

.navmenu .navmenu-button {
    cursor: pointer;
    color: var(--color-text-blue);
}

.btn.btn-warn {
    background: var(--color-warn);
}

.account-layout h1 {
    font-size: 4.6rem;
    color: var(--color-dark-blue);
    text-align: center;
    margin: 0;
}

.account-layout h2 {
    text-align: center;
    color: var(--color-text-blue);
    font-size: 2.6rem;
    font-family: CircularStd-Medium;
    font-weight: 100;
    margin: 25px 0;
}

.account-layout .forgot-password {
    text-align: center;
    display: block;
    margin-top: 10px;
    text-decoration: none;
    color: var(--color-background-turquoise);
}

.account-layout .account-control .account-button {
    position: absolute;
    right: 12px;
    height: 35px;
    width: 35px;
    text-align: center;
    padding: 0;
    top: 10px;
    border: none;
    border-radius: 9px;
    background: var(--color-button-default);
    transition: opacity 0.3s linear;
    display: flex;
    align-items: center;
    justify-content: center;
}

.account-layout .remember-me span {
    display: inline-block;
    vertical-align: middle;
    color: var(--color-text-blue);
}

.vacancy-management-banner-container .vacancy-management-banner {
    margin-right: 1em;
    font-size: 2.1rem;
    padding: 1em 1em 1em 100px;
    border-radius: .5em;
    background-color: var(--color-background-turquoise);
    display: inline-block;
    width: 325px;
}

.create-new-nexjob {
    display: inline-block;
    background-color: var(--color-background-blue);
    color: var(--color-white);
    text-decoration: none;
    border-radius: var(--radius-buttons);
    padding: .6em 75px 0 1em;
    height: 38px;
    position: relative;
}

.help-guide {
    display: inline-block;
    background-color: var(--color-background-turquoise);
    color: var(--color-white);
    text-decoration: none;
    border-radius: .5em;
    padding: 1.2em 1em 1.2em 75px;
    display: flex;
    margin-bottom: 0;
    align-items: center;
    justify-content: center;
}

ul.nav li a {
    display: inline-block;
    padding: 1rem;
    border-radius: var(--radius-tabs) var(--radius-tabs) 0 0;
    background-color: var(--color-button-default);
    color: var(--color-white);
    text-decoration: none;
    font-size: 2.1rem;
    text-align: center;
    font-family: CircularStd-Book;
}

    ul.nav li a.active {
        background-color: #fff;
        color: var(--color-label);
        box-shadow: 0px -4px 10px -2px #00000029;
    }

@media only screen and (max-width: 1190px) {
    .flex-container .flex-panel .vacancy-management-banner-container {
        display: none;
    }
}

@media only screen and (max-width: 1150px) {
    .vacancy-management-banner-container::after {
        content: " ";
        top: 50%;
        transform: translateY(-50%);
        position: absolute;
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-left: 10px solid #47cacc;
    }
}