/* FONTS */
@font-face {
  font-family: 'Bebas Neue';
  src: url("../fonts/subset-BebasNeue-Regular.eot");
  src: url("../fonts/subset-BebasNeue-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/subset-BebasNeue-Regular.woff2") format("woff2"), url("../fonts/subset-BebasNeue-Regular.woff") format("woff"), url("../fonts/subset-BebasNeue-Regular.svg#BebasNeue-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/subset-OpenSans-Regular.eot");
  src: url("../fonts/subset-OpenSans-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/subset-OpenSans-Regular.woff2") format("woff2"), url("../fonts/subset-OpenSans-Regular.woff") format("woff"), url("../fonts/subset-OpenSans-Regular.svg#OpenSans-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Open Sans';
  src: url("../fonts/subset-OpenSans-Medium.eot");
  src: url("../fonts/subset-OpenSans-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/subset-OpenSans-Medium.woff2") format("woff2"), url("../fonts/subset-OpenSans-Medium.woff") format("woff"), url("../fonts/subset-OpenSans-Medium.svg#OpenSans-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Roboto';
  src: url("../fonts/subset-Roboto-Light.eot");
  src: url("../fonts/subset-Roboto-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/subset-Roboto-Light.woff2") format("woff2"), url("../fonts/subset-Roboto-Light.woff") format("woff"), url("../fonts/subset-Roboto-Light.svg#Roboto-Light") format("svg");
  font-weight: 300;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Roboto';
  src: url("../fonts/subset-Roboto-Medium.eot");
  src: url("../fonts/subset-Roboto-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/subset-Roboto-Medium.woff2") format("woff2"), url("../fonts/subset-Roboto-Medium.woff") format("woff"), url("../fonts/subset-Roboto-Medium.svg#Roboto-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Roboto';
  src: url("../fonts/subset-Roboto-ExtraBold.eot");
  src: url("../fonts/subset-Roboto-ExtraBold.eot?#iefix") format("embedded-opentype"), url("../fonts/subset-Roboto-ExtraBold.woff2") format("woff2"), url("../fonts/subset-Roboto-ExtraBold.woff") format("woff"), url("../fonts/subset-Roboto-ExtraBold.svg#Roboto-ExtraBold") format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Roboto';
  src: url("../fonts/subset-Roboto-Regular.eot");
  src: url("../fonts/subset-Roboto-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/subset-Roboto-Regular.woff2") format("woff2"), url("../fonts/subset-Roboto-Regular.woff") format("woff"), url("../fonts/subset-Roboto-Regular.svg#Roboto-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Roboto';
  src: url("../fonts/subset-Roboto-SemiBold.eot");
  src: url("../fonts/subset-Roboto-SemiBold.eot?#iefix") format("embedded-opentype"), url("../fonts/subset-Roboto-SemiBold.woff2") format("woff2"), url("../fonts/subset-Roboto-SemiBold.woff") format("woff"), url("../fonts/subset-Roboto-SemiBold.svg#Roboto-SemiBold") format("svg");
  font-weight: 600;
  font-style: normal;
  font-display: swap; }
@keyframes big {
  from {
    stroke-dashoffset: 326.56; }
  to {
    stroke-dashoffset: 60; } }
/* 0. CSS Reset */
body {
  font-family: 'Open Sans', arial, sans-serif;
  font-size: 16px;
  line-height: 160%;
  color: #000000;
  background: #F4F4F4;
  overflow-x: hidden; }
  @media (max-width: 991px) {
    body {
      background: #1c994f; } }
  body.sidebar_active {
    overflow: hidden; }
    @media (max-width: 600px) {
      body.sidebar_active {
        overflow: visible; } }

.loader_container {
  text-align: center;
  display: none; }
  .loader_container .custom-loader {
    font-weight: bold;
    color: #5B5858;
    position: relative;
    padding-left: 25px;
    display: inline-block; }
    .loader_container .custom-loader:before {
      content: "";
      position: absolute;
      left: 0;
      top: 50%;
      width: 15px;
      height: 15px;
      margin-top: -7.5px;
      border: 2px solid #5B5858;
      border-top: 2px solid transparent;
      border-radius: 50%;
      animation: spin 1s linear infinite; }

@keyframes spin {
  to {
    transform: rotate(360deg); } }
.form-group {
  margin-bottom: 16px;
  position: relative; }

.show_pass {
  position: absolute;
  z-index: 1;
  right: 8px;
  top: 22px;
  cursor: pointer; }
  .show_pass svg {
    display: block; }
    .show_pass svg path {
      transition: .3s;
      fill: #000; }
  .show_pass.active svg path, .show_pass:hover svg path {
    fill: #24C667; }

input:hover, input:focus, input:active {
  outline: none; }

.field_error {
  color: #FF0000;
  font-size: 14px;
  line-height: 20px;
  padding: 0;
  text-align: left;
  margin-top: 5px;
  display: block; }

.form-control {
  box-shadow: none; }

.mCustomScrollBox > .mCSB_container {
  min-height: 100%; }

.mCS-greenovation.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  background-color: #24C667;
  border-radius: 5px;
  width: 8px; }

.mCS-greenovation.mCSB_scrollTools .mCSB_draggerRail {
  background-color: white; }

.app_screen input[type="text"],
.app_screen input[type="password"],
.app_screen textarea, .login_wrapper input[type="text"],
.login_wrapper input[type="password"],
.login_wrapper textarea {
  background: #F6F6F6;
  border: 1px solid #F6F6F6;
  border-radius: 18px;
  line-height: 58px;
  font-size: 16px;
  font-family: 'Open Sans', arial, sans-serif;
  font-weight: normal;
  color: #000;
  width: 100%;
  padding: 0 25px;
  transition: .3s;
  width: 100%;
  display: block;
  outline: 0 !important; }
  .app_screen input[type="text"]:focus,
  .app_screen input[type="password"]:focus,
  .app_screen textarea:focus, .login_wrapper input[type="text"]:focus,
  .login_wrapper input[type="password"]:focus,
  .login_wrapper textarea:focus {
    background: #fff;
    border: 1px solid #24C667; }
  .app_screen input[type="text"].input_error,
  .app_screen input[type="password"].input_error,
  .app_screen textarea.input_error, .login_wrapper input[type="text"].input_error,
  .login_wrapper input[type="password"].input_error,
  .login_wrapper textarea.input_error {
    border: 1px solid #FF0000; }
.app_screen textarea, .login_wrapper textarea {
  min-height: 120px;
  line-height: 22px;
  padding: 20px 25px; }
.app_screen label, .login_wrapper label {
  color: #000;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 5px; }

.app_screen {
  display: none; }
  .app_screen.unlocked {
    display: block; }
  .app_screen input[type="text"],
  .app_screen input[type="password"],
  .app_screen textarea {
    background: #F0F0F0; }
    .app_screen input[type="text"]:focus,
    .app_screen input[type="password"]:focus,
    .app_screen textarea:focus {
      background: #fff; }
  .app_screen .form_container {
    max-width: 700px;
    margin: auto;
    padding: 50px 0; }
  .app_screen .form_submit {
    background: #A22DFF;
    border: none;
    display: block;
    border-radius: 11px;
    width: 100%;
    color: #fff;
    font-size: 0;
    line-height: 40px;
    font-weight: 400;
    padding: 0;
    text-align: center;
    margin-top: 24px;
    transition: .3s; }
    .app_screen .form_submit .btn_text, .app_screen .form_submit svg {
      display: inline-block;
      vertical-align: middle; }
    .app_screen .form_submit .btn_text {
      font-size: 18px; }
    .app_screen .form_submit svg {
      width: 12px;
      height: auto;
      margin-left: 10px; }
      .app_screen .form_submit svg path {
        transition: .3s;
        fill: #fff; }
    .app_screen .form_submit:hover, .app_screen .form_submit:active, .app_screen .form_submit:focus {
      color: #111111;
      background: #00FED0; }
      .app_screen .form_submit:hover svg path, .app_screen .form_submit:active svg path, .app_screen .form_submit:focus svg path {
        fill: #111111; }

::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: #333333;
  opacity: .3; }

:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #333333;
  opacity: .3; }

::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #333333;
  opacity: .3; }

:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #333333;
  opacity: .3; }

.radio_tabs-wrapper {
  clear: both;
  display: block;
  width: 100%;
  position: relative;
  background: #F6F6F7;
  border-radius: 8px;
  margin-bottom: 15px; }
  .radio_tabs-wrapper:after {
    content: '';
    display: block;
    clear: both; }

input.radio-tab {
  position: absolute;
  left: -99999em;
  top: -99999em; }
  input.radio-tab + label {
    cursor: pointer;
    float: left;
    margin: 0 !important;
    position: relative;
    width: 33.333333% !important;
    transition: .3s;
    padding: 4px 10px 6px;
    text-align: center;
    border-radius: 8px; }
    input.radio-tab + label span {
      color: #121315 !important;
      display: inline-block;
      vertical-align: middle;
      margin: 0 !important;
      font-size: 13px !important;
      line-height: 100% !important; }
    input.radio-tab + label svg {
      display: inline-block;
      vertical-align: middle; }
    input.radio-tab + label:hover {
      background-color: #eee; }
  input.radio-tab:checked + label {
    z-index: 1;
    border-radius: 8px;
    background: #fff;
    -webkit-box-shadow: 0px 0px 8px 0px rgba(50, 51, 94, 0.1);
    -moz-box-shadow: 0px 0px 8px 0px rgba(50, 51, 94, 0.1);
    box-shadow: 0px 0px 8px 0px rgba(50, 51, 94, 0.1); }

.select2-container {
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
  height: 60px !important; }
  .select2-container:focus, .select2-container:hover, .select2-container:active {
    outline: 0; }
  .select2-container .selection {
    width: 100%;
    display: block !important;
    margin: 0 !important; }
    .select2-container .selection .select2-selection {
      width: 100% !important;
      background: #F6F6F6 !important;
      border: 1px solid #F6F6F6 !important;
      border-radius: 18px !important;
      line-height: 60px !important;
      font-size: 16px !important;
      font-family: "Open Sans", arial, sans-serif !important;
      font-weight: normal !important;
      color: #121315 !important;
      width: 100% !important;
      padding: 0 25px !important;
      transition: 0.3s !important;
      width: 100% !important;
      display: block !important;
      margin: 0 !important;
      height: 60px !important; }
      .select2-container .selection .select2-selection .select2-selection__rendered {
        font-size: 16px !important;
        line-height: 60px !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #000000 !important; }
        .select2-container .selection .select2-selection .select2-selection__rendered .select2-selection__placeholder {
          color: #C2C2C2; }

.select2-container--default .select2-selection--single .select2-selection__arrow {
  right: 14px;
  top: 16px; }

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #000000 transparent transparent transparent;
  border-width: 7px 6px 0 6px; }

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent #000000 transparent;
  border-width: 0 6px 7px 6px; }

.select2-dropdown {
  -webkit-box-shadow: 0px 20px 40px 0px rgba(50, 51, 94, 0.1);
  -moz-box-shadow: 0px 20px 40px 0px rgba(50, 51, 94, 0.1);
  box-shadow: 0px 20px 40px 0px rgba(50, 51, 94, 0.1);
  border: none;
  border-radius: 18px;
  padding: 8px; }

.select2-container--default .select2-results__option--selected {
  background: #F6F6F6;
  color: #000; }

.select2-results__option {
  border-radius: 14px;
  padding: 8px;
  margin-bottom: 4px;
  color: #000;
  transition: .3s;
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
  font-family: "Open Sans", arial, sans-serif !important; }

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background: #24C667;
  color: #fff; }

.form_btn {
  width: 100%;
  display: block; }

.app_btn.btn_type1 {
  background: #24C667;
  border: 1px solid #24C667;
  display: inline-block;
  vertical-align: middle;
  border-radius: 18px;
  color: #fff;
  font-size: 20px;
  line-height: 58px;
  font-weight: 500;
  padding: 0 50px;
  text-align: center;
  transition: .3s;
  cursor: pointer; }
  .app_btn.btn_type1:hover, .app_btn.btn_type1:focus, .app_btn.btn_type1:active {
    color: #fff;
    background: #1c994f;
    border: 1px solid #1c994f;
    text-decoration: none; }
  .app_btn.btn_type1.disabled {
    cursor: not-allowed;
    background: #d9d9d9;
    border: 1px solid #d9d9d9; }
.app_btn.btn_type2 {
  background: #fff;
  border: 1px solid rgba(52, 106, 77, 0.5);
  display: inline-block;
  vertical-align: middle;
  border-radius: 18px;
  color: #346A4D;
  font-size: 20px;
  line-height: 58px;
  font-weight: 500;
  padding: 0 50px;
  text-align: center;
  transition: .3s;
  cursor: pointer; }
  .app_btn.btn_type2:hover, .app_btn.btn_type2:focus, .app_btn.btn_type2:active {
    color: #fff;
    background: #346A4D;
    border: 1px solid #346A4D;
    text-decoration: none; }
  .app_btn.btn_type2.disabled {
    cursor: not-allowed;
    background: #d9d9d9;
    border-color: #d9d9d9;
    color: #fff; }

.highlight-item {
  animation: highlightItem 1s ease-out forwards; }

@keyframes highlightItem {
  0% {
    backgrond: #fff;
    -webkit-box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0);
    -moz-box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0);
    box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0); }
  25% {
    backgrond: #fff;
    -webkit-box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.1); }
  75% {
    backgrond: #fff;
    -webkit-box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.1); }
  100% {
    backgrond: #fff;
    -webkit-box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0);
    -moz-box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0);
    box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0); } }
/* 1. Login Template */
.login_wrapper {
  min-height: 100vh; }
  .login_wrapper .login_left-section {
    background-image: url("../img/login-bg.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    overflow: hidden;
    height: 100vh;
    position: relative; }
    @media (max-width: 991px) {
      .login_wrapper .login_left-section {
        height: auto;
        padding: 30px 0; } }
    .login_wrapper .login_left-section .login_heading {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100%;
      transform: translateX(-50%) translateY(-50%);
      padding: 0 15px;
      text-align: center;
      font-weight: bold;
      color: #fff;
      font-size: 70px;
      text-align: center; }
      @media (max-width: 991px) {
        .login_wrapper .login_left-section .login_heading {
          position: static;
          transform: none;
          margin: 0 auto;
          padding: 70px 15px;
          font-size: 40px; } }
      .login_wrapper .login_left-section .login_heading .login_logo {
        width: 95%;
        max-width: 310px;
        display: inline-block; }
  .login_wrapper .login_right-section {
    min-height: 100vh;
    position: relative;
    background: #fff; }
    @media (max-width: 991px) {
      .login_wrapper .login_right-section {
        height: auto;
        padding: 50px 15px; } }
    .login_wrapper .login_right-section .form_container {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100%;
      max-width: 460px;
      transform: translateX(-50%) translateY(-50%); }
      @media (max-width: 991px) {
        .login_wrapper .login_right-section .form_container {
          position: static;
          transform: none;
          margin: 0 auto; } }
      .login_wrapper .login_right-section .form_container #login_form .form_title, .login_wrapper .login_right-section .form_container #register_form .form_title {
        font-size: 32px;
        line-height: 28px;
        color: #000000;
        margin: 0;
        margin-bottom: 40px;
        font-family: 'Bebas Neue', arial, sans-serif; }
        @media (max-width: 991px) {
          .login_wrapper .login_right-section .form_container #login_form .form_title, .login_wrapper .login_right-section .form_container #register_form .form_title {
            text-align: center; } }
      .login_wrapper .login_right-section .form_container #login_form .form_subtitle, .login_wrapper .login_right-section .form_container #register_form .form_subtitle {
        font-size: 24px;
        line-height: 28px;
        color: #000000;
        margin: 0;
        margin-top: 20px;
        margin-bottom: 10px;
        text-transform: uppercase;
        font-family: 'Bebas Neue', arial, sans-serif; }
      .login_wrapper .login_right-section .form_container #login_form label, .login_wrapper .login_right-section .form_container #register_form label {
        font-size: 10px;
        color: #121315;
        opacity: .64;
        display: block;
        margin-bottom: 8px;
        line-height: 1; }
      .login_wrapper .login_right-section .form_container #login_form .input_wrapper, .login_wrapper .login_right-section .form_container #register_form .input_wrapper {
        position: relative; }
        .login_wrapper .login_right-section .form_container #login_form .input_wrapper svg, .login_wrapper .login_right-section .form_container #register_form .input_wrapper svg {
          position: absolute;
          right: 25px;
          top: 50%;
          transform: translateY(-50%);
          width: 16px; }
          .login_wrapper .login_right-section .form_container #login_form .input_wrapper svg path, .login_wrapper .login_right-section .form_container #register_form .input_wrapper svg path {
            fill: #C2C2C2; }
        .login_wrapper .login_right-section .form_container #login_form .input_wrapper.email_wrapper svg, .login_wrapper .login_right-section .form_container #register_form .input_wrapper.email_wrapper svg {
          width: 21px;
          right: 22px; }
        .login_wrapper .login_right-section .form_container #login_form .input_wrapper input, .login_wrapper .login_right-section .form_container #register_form .input_wrapper input {
          padding-right: 60px; }
      .login_wrapper .login_right-section .form_container #login_form .checkbox-group, .login_wrapper .login_right-section .form_container #register_form .checkbox-group {
        margin: 0;
        margin-bottom: 20px; }
        .login_wrapper .login_right-section .form_container #login_form .checkbox-group label, .login_wrapper .login_right-section .form_container #register_form .checkbox-group label {
          position: relative;
          cursor: pointer;
          font-size: 16px;
          line-height: 160%;
          color: #000;
          opacity: 1;
          font-weight: normal;
          padding-left: 40px;
          font-family: 'Open Sans', arial, sans-serif; }
          .login_wrapper .login_right-section .form_container #login_form .checkbox-group label a, .login_wrapper .login_right-section .form_container #register_form .checkbox-group label a {
            color: #000;
            transition: .3s; }
            .login_wrapper .login_right-section .form_container #login_form .checkbox-group label a:hover, .login_wrapper .login_right-section .form_container #login_form .checkbox-group label a:active, .login_wrapper .login_right-section .form_container #login_form .checkbox-group label a:hover, .login_wrapper .login_right-section .form_container #register_form .checkbox-group label a:hover, .login_wrapper .login_right-section .form_container #register_form .checkbox-group label a:active, .login_wrapper .login_right-section .form_container #register_form .checkbox-group label a:hover {
              color: #24C667;
              text-decoration: none; }
          .login_wrapper .login_right-section .form_container #login_form .checkbox-group label:before, .login_wrapper .login_right-section .form_container #register_form .checkbox-group label:before {
            content: '';
            -webkit-appearance: none;
            background-color: #F6F6F6;
            width: 28px;
            height: 28px;
            display: inline-block;
            position: absolute;
            vertical-align: middle;
            cursor: pointer;
            border-radius: 10px;
            top: 0;
            left: 0;
            transition: .3s; }
          .login_wrapper .login_right-section .form_container #login_form .checkbox-group label:after, .login_wrapper .login_right-section .form_container #register_form .checkbox-group label:after {
            content: "";
            display: inline-block;
            width: 17px;
            height: 10px;
            background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="17" height="10" viewBox="0 0 17 10" fill="none"><path d="M15.8658 1.98754L8.89686 8.70502L8.89833 8.70355C8.18658 9.4153 7.25278 9.77117 6.31163 9.77117C5.37048 9.77117 4.42638 9.41236 3.70875 8.69473L0.376486 5.60069C0.0794344 5.32423 0.063259 4.85806 0.339723 4.56101C0.616186 4.26396 1.08235 4.24778 1.3794 4.52277L4.72932 7.63593C5.60724 8.51385 7.0072 8.51385 7.86747 7.65505L14.8467 0.928747C15.1394 0.646401 15.604 0.658166 15.8864 0.947864C16.1673 1.2405 16.1584 1.70667 15.8658 1.98754Z" fill="white"/></svg>') no-repeat center;
            background-size: contain;
            opacity: 0;
            visibility: hidden;
            transition: .3s;
            top: 9px;
            left: 6px;
            position: absolute; }
        .login_wrapper .login_right-section .form_container #login_form .checkbox-group .checkbox_input, .login_wrapper .login_right-section .form_container #register_form .checkbox-group .checkbox_input {
          padding: 0;
          height: initial;
          width: initial;
          margin-bottom: 0;
          display: none;
          cursor: pointer; }
          .login_wrapper .login_right-section .form_container #login_form .checkbox-group .checkbox_input:checked + label:before, .login_wrapper .login_right-section .form_container #register_form .checkbox-group .checkbox_input:checked + label:before {
            background: #24C667; }
          .login_wrapper .login_right-section .form_container #login_form .checkbox-group .checkbox_input:checked + label:after, .login_wrapper .login_right-section .form_container #register_form .checkbox-group .checkbox_input:checked + label:after {
            opacity: 1;
            visibility: visible; }
      .login_wrapper .login_right-section .form_container #login_form .main_btn, .login_wrapper .login_right-section .form_container #register_form .main_btn {
        background: #24C667;
        border: none;
        display: block;
        border-radius: 18px;
        width: 100%;
        color: #fff;
        font-size: 18px;
        line-height: 60px;
        font-weight: 500;
        padding: 0;
        text-align: center;
        margin-top: 24px;
        transition: .3s; }
        .login_wrapper .login_right-section .form_container #login_form .main_btn:hover, .login_wrapper .login_right-section .form_container #login_form .main_btn:focus, .login_wrapper .login_right-section .form_container #login_form .main_btn:active, .login_wrapper .login_right-section .form_container #register_form .main_btn:hover, .login_wrapper .login_right-section .form_container #register_form .main_btn:focus, .login_wrapper .login_right-section .form_container #register_form .main_btn:active {
          color: #fff;
          background: #1c994f;
          text-decoration: none; }
      .login_wrapper .login_right-section .form_container #login_form .info_bar:after, .login_wrapper .login_right-section .form_container #register_form .info_bar:after {
        content: '';
        display: block;
        clear: both; }
      .login_wrapper .login_right-section .form_container #login_form .info_bar .errors_container, .login_wrapper .login_right-section .form_container #register_form .info_bar .errors_container {
        float: left;
        color: #FF0000;
        font-size: 14px;
        line-height: 20px;
        padding: 0;
        text-align: left; }
        .login_wrapper .login_right-section .form_container #login_form .info_bar .errors_container span, .login_wrapper .login_right-section .form_container #register_form .info_bar .errors_container span {
          display: block; }
      .login_wrapper .login_right-section .form_container #login_form #forgot_btn, .login_wrapper .login_right-section .form_container #register_form #forgot_btn {
        background: transparent;
        border: none;
        float: right;
        color: #000;
        font-size: 14px;
        line-height: 20px;
        padding: 0;
        text-align: right;
        transition: .3s; }
        .login_wrapper .login_right-section .form_container #login_form #forgot_btn:hover, .login_wrapper .login_right-section .form_container #login_form #forgot_btn:focus, .login_wrapper .login_right-section .form_container #login_form #forgot_btn:active, .login_wrapper .login_right-section .form_container #register_form #forgot_btn:hover, .login_wrapper .login_right-section .form_container #register_form #forgot_btn:focus, .login_wrapper .login_right-section .form_container #register_form #forgot_btn:active {
          text-decoration: none;
          color: #24C667; }
      .login_wrapper .login_right-section .form_container #login_form .sec_btn, .login_wrapper .login_right-section .form_container #register_form .sec_btn {
        background: transparent;
        border: none;
        display: inline-block;
        border-radius: 8px;
        width: 100%;
        color: #000000;
        font-size: 18px;
        line-height: 34px;
        padding: 0;
        text-align: center;
        margin-top: 16px;
        transition: .3s; }
        .login_wrapper .login_right-section .form_container #login_form .sec_btn:hover, .login_wrapper .login_right-section .form_container #login_form .sec_btn:focus, .login_wrapper .login_right-section .form_container #login_form .sec_btn:active, .login_wrapper .login_right-section .form_container #register_form .sec_btn:hover, .login_wrapper .login_right-section .form_container #register_form .sec_btn:focus, .login_wrapper .login_right-section .form_container #register_form .sec_btn:active {
          text-decoration: none;
          color: #24C667; }
      .login_wrapper .login_right-section .form_container #login_form .success_message, .login_wrapper .login_right-section .form_container #register_form .success_message {
        font-size: 20px;
        line-height: 24px;
        color: #1A1A1A;
        font-weight: 600;
        text-align: center;
        margin-top: 24px; }
      .login_wrapper .login_right-section .form_container #login_form .error_message, .login_wrapper .login_right-section .form_container #register_form .error_message {
        color: #FF8282; }
        .login_wrapper .login_right-section .form_container #login_form .error_message span, .login_wrapper .login_right-section .form_container #register_form .error_message span {
          display: block; }
  .login_wrapper.register_wrapper {
    display: flex;
    flex-wrap: wrap; }
    @media (max-width: 991px) {
      .login_wrapper.register_wrapper {
        display: block; } }
    .login_wrapper.register_wrapper:after {
      content: '';
      display: block;
      clear: both; }
    .login_wrapper.register_wrapper .login_left-section {
      height: auto;
      min-height: 100vh; }
      @media (max-width: 991px) {
        .login_wrapper.register_wrapper .login_left-section {
          min-height: 0; } }
    .login_wrapper.register_wrapper .login_right-section {
      height: 100%; }
      .login_wrapper.register_wrapper .login_right-section .back_btn {
        position: absolute;
        top: 40px;
        left: 20px;
        border-radius: 50%;
        width: 44px;
        height: 44px;
        background: #24C667;
        transition: .3s; }
        .login_wrapper.register_wrapper .login_right-section .back_btn svg {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translateX(-50%) translateY(-50%); }
        .login_wrapper.register_wrapper .login_right-section .back_btn:hover {
          background: #1c994f; }
      .login_wrapper.register_wrapper .login_right-section .form_container {
        position: static;
        transform: none;
        display: block;
        margin: 0 auto;
        padding: 50px 0; }
        @media (max-width: 1300px) {
          .login_wrapper.register_wrapper .login_right-section .form_container {
            max-width: 350px; } }
        @media (max-width: 991px) {
          .login_wrapper.register_wrapper .login_right-section .form_container {
            padding: 0; } }
        .login_wrapper.register_wrapper .login_right-section .form_container #register_form .form_title {
          margin-bottom: 20px; }

/* 2. App Templates */
.app_container {
  position: relative;
  min-height: 100vh; }
  .app_container .copyright {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
    opacity: .7;
    font-size: 12px;
    display: none; }
    @media (max-width: 991px) {
      .app_container .copyright {
        display: block; } }
  .app_container.onboarding_active {
    background-image: url("../img/bg_app-min.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover; }
    @media (max-width: 1199px) {
      .app_container.onboarding_active {
        padding-top: 100px;
        padding-bottom: 50px; } }
    @media (max-width: 767px) {
      .app_container.onboarding_active {
        padding-top: 90px; } }
    @media (max-width: 767px) {
      .app_container.onboarding_active .next_screen {
        padding: 0 30px; } }
    @media (max-width: 390px) {
      .app_container.onboarding_active .next_screen {
        padding: 0 15px;
        font-size: 18px; } }
    .app_container.onboarding_active .app_nav-mobile {
      display: none !important; }
  .app_container .app_popup.register_popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: .3s; }
    .app_container .app_popup.register_popup.active {
      opacity: 1;
      visibility: visible; }
    .app_container .app_popup.register_popup .popup_body {
      padding: 60px 70px 60px;
      position: absolute;
      z-index: 1;
      left: 50%;
      top: 50%;
      transform: translateX(-50%) translateY(-50%);
      width: 730px;
      overflow: hidden;
      border: 1px solid rgba(0, 0, 0, 0.15);
      border-radius: 18px;
      background: #fff;
      text-align: center; }
      @media (max-width: 991px) {
        .app_container .app_popup.register_popup .popup_body {
          width: 100%;
          max-width: 90%;
          padding: 50px 40px 50px; } }
      @media (max-width: 767px) {
        .app_container .app_popup.register_popup .popup_body {
          padding: 40px 20px 40px; } }
      .app_container .app_popup.register_popup .popup_body .popup_icon {
        display: inline-block;
        margin-bottom: 30px; }
      .app_container .app_popup.register_popup .popup_body .popup_title {
        display: block;
        padding: 0;
        margin: 0;
        margin-top: 7px;
        font-size: 32px;
        line-height: 36px;
        font-family: 'Bebas Neue', arial, sans-serif;
        font-weight: normal;
        color: #000;
        text-transform: uppercase; }
      .app_container .app_popup.register_popup .popup_body .popup_text {
        display: block;
        margin: 0;
        margin-top: 15px;
        font-size: 16px;
        line-height: 22px;
        font-family: 'Open Sans', arial, sans-serif;
        font-weight: normal;
        color: #363636; }
      .app_container .app_popup.register_popup .popup_body .app_btn {
        margin-top: 30px; }
  .app_container .app_popup.profile_update-popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: .3s; }
    .app_container .app_popup.profile_update-popup.active {
      opacity: 1;
      visibility: visible; }
    .app_container .app_popup.profile_update-popup .popup_body {
      padding: 60px 70px 60px;
      position: absolute;
      z-index: 1;
      left: 50%;
      top: 50%;
      transform: translateX(-50%) translateY(-50%);
      width: 730px;
      overflow: hidden;
      border: 1px solid rgba(0, 0, 0, 0.15);
      border-radius: 18px;
      background: #fff;
      text-align: center; }
      @media (max-width: 991px) {
        .app_container .app_popup.profile_update-popup .popup_body {
          width: 100%;
          max-width: 90%;
          padding: 50px 40px 50px; } }
      @media (max-width: 767px) {
        .app_container .app_popup.profile_update-popup .popup_body {
          padding: 40px 20px 40px; } }
      .app_container .app_popup.profile_update-popup .popup_body .popup_icon {
        display: inline-block;
        margin-bottom: 30px; }
      .app_container .app_popup.profile_update-popup .popup_body .popup_title {
        display: block;
        padding: 0;
        margin: 0;
        margin-top: 7px;
        font-size: 32px;
        line-height: 36px;
        font-family: 'Bebas Neue', arial, sans-serif;
        font-weight: normal;
        color: #000;
        text-transform: uppercase; }
      .app_container .app_popup.profile_update-popup .popup_body .popup_text {
        display: block;
        margin: 0;
        margin-top: 15px;
        font-size: 16px;
        line-height: 22px;
        font-family: 'Open Sans', arial, sans-serif;
        font-weight: normal;
        color: #363636; }
      .app_container .app_popup.profile_update-popup .popup_body .app_btn {
        margin-top: 30px;
        cursor: pointer; }
  .app_container .app_popup.questions_update-popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: .3s; }
    .app_container .app_popup.questions_update-popup.active {
      opacity: 1;
      visibility: visible; }
    .app_container .app_popup.questions_update-popup .popup_body {
      padding: 60px 70px 60px;
      position: absolute;
      z-index: 1;
      left: 50%;
      top: 50%;
      transform: translateX(-50%) translateY(-50%);
      width: 730px;
      overflow: hidden;
      border: 1px solid rgba(0, 0, 0, 0.15);
      border-radius: 18px;
      background: #fff;
      text-align: center; }
      @media (max-width: 991px) {
        .app_container .app_popup.questions_update-popup .popup_body {
          width: 100%;
          max-width: 90%;
          padding: 50px 40px 50px; } }
      @media (max-width: 767px) {
        .app_container .app_popup.questions_update-popup .popup_body {
          padding: 40px 20px 40px; } }
      .app_container .app_popup.questions_update-popup .popup_body .popup_icon {
        display: inline-block;
        margin-bottom: 30px; }
      .app_container .app_popup.questions_update-popup .popup_body .popup_title {
        display: block;
        padding: 0;
        margin: 0;
        margin-top: 7px;
        font-size: 32px;
        line-height: 36px;
        font-family: 'Bebas Neue', arial, sans-serif;
        font-weight: normal;
        color: #000;
        text-transform: uppercase; }
      .app_container .app_popup.questions_update-popup .popup_body .popup_text {
        display: block;
        margin: 0;
        margin-top: 15px;
        font-size: 16px;
        line-height: 22px;
        font-family: 'Open Sans', arial, sans-serif;
        font-weight: normal;
        color: #363636; }
      .app_container .app_popup.questions_update-popup .popup_body .app_btn {
        margin-top: 30px;
        cursor: pointer; }
  .app_container .app_popup.report_update-popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: .3s; }
    .app_container .app_popup.report_update-popup.active {
      opacity: 1;
      visibility: visible; }
    .app_container .app_popup.report_update-popup .popup_body {
      padding: 60px 70px 60px;
      position: absolute;
      z-index: 1;
      left: 50%;
      top: 50%;
      transform: translateX(-50%) translateY(-50%);
      width: 730px;
      overflow: hidden;
      border: 1px solid rgba(0, 0, 0, 0.15);
      border-radius: 18px;
      background: #fff;
      text-align: center; }
      @media (max-width: 991px) {
        .app_container .app_popup.report_update-popup .popup_body {
          width: 100%;
          max-width: 90%;
          padding: 50px 40px 50px; } }
      @media (max-width: 767px) {
        .app_container .app_popup.report_update-popup .popup_body {
          padding: 40px 20px 40px; } }
      .app_container .app_popup.report_update-popup .popup_body .popup_icon {
        display: inline-block;
        margin-bottom: 30px; }
      .app_container .app_popup.report_update-popup .popup_body .popup_title {
        display: block;
        padding: 0;
        margin: 0;
        margin-top: 7px;
        font-size: 32px;
        line-height: 36px;
        font-family: 'Bebas Neue', arial, sans-serif;
        font-weight: normal;
        color: #000;
        text-transform: uppercase; }
      .app_container .app_popup.report_update-popup .popup_body .popup_text {
        display: block;
        margin: 0;
        margin-top: 15px;
        font-size: 16px;
        line-height: 22px;
        font-family: 'Open Sans', arial, sans-serif;
        font-weight: normal;
        color: #363636; }
      .app_container .app_popup.report_update-popup .popup_body .app_btn {
        margin-top: 30px;
        cursor: pointer; }
  .app_container .app_logo {
    width: 265px;
    position: absolute;
    z-index: 9999;
    left: 30px;
    top: 30px; }
    @media (max-width: 1500px) {
      .app_container .app_logo {
        width: 230px; } }
    @media (max-width: 1400px) {
      .app_container .app_logo {
        top: 20px;
        left: 20px;
        width: 200px; } }
    @media (max-width: 767px) {
      .app_container .app_logo {
        width: 190px; } }
    .app_container .app_logo .logo {
      width: 100%; }
  .app_container .onboarding_content .copyright {
    position: absolute;
    bottom: 2px;
    left: 50%;
    transform: translateX(-50%);
    color: #000;
    opacity: .4;
    font-size: 12px;
    display: block; }
  .app_container .onboarding_popup {
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 48%;
    transform: translateX(-50%) translateY(-50%);
    width: 730px;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 18px;
    background: #fff; }
    @media (max-width: 1199px) {
      .app_container .onboarding_popup {
        width: 570px;
        margin: 0 auto;
        position: static;
        transform: none; } }
    @media (max-width: 767px) {
      .app_container .onboarding_popup {
        width: 95%; } }
    .app_container .onboarding_popup .onboarding_screen {
      width: 100%;
      display: none; }
      .app_container .onboarding_popup .onboarding_screen.active {
        display: block; }
      .app_container .onboarding_popup .onboarding_screen .screen_header {
        background-image: url("../img/card_bg-min.jpg");
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        height: 190px;
        position: relative; }
        @media (max-width: 1400px) {
          .app_container .onboarding_popup .onboarding_screen .screen_header {
            height: 130px; } }
        .app_container .onboarding_popup .onboarding_screen .screen_header img, .app_container .onboarding_popup .onboarding_screen .screen_header svg {
          width: auto;
          height: 150px;
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translateX(-50%) translateY(-50%); }
          @media (max-width: 1400px) {
            .app_container .onboarding_popup .onboarding_screen .screen_header img, .app_container .onboarding_popup .onboarding_screen .screen_header svg {
              height: 100px; } }
      .app_container .onboarding_popup .onboarding_screen .screen_body {
        padding: 30px; }
        @media (max-width: 1400px) {
          .app_container .onboarding_popup .onboarding_screen .screen_body {
            padding: 20px 30px 20px; } }
        @media (max-width: 390px) {
          .app_container .onboarding_popup .onboarding_screen .screen_body {
            padding: 30px 15px 30px; } }
        .app_container .onboarding_popup .onboarding_screen .screen_body .screen_pretitle {
          background: #346A4D;
          display: inline-block;
          border-radius: 100px;
          padding: 0 10px;
          font-size: 16px;
          line-height: 24px;
          font-family: 'Open Sans', arial, sans-serif;
          font-weight: 500;
          color: #fff; }
        .app_container .onboarding_popup .onboarding_screen .screen_body .screen_title {
          display: block;
          padding: 0;
          margin: 0;
          margin-top: 7px;
          font-size: 32px;
          line-height: 36px;
          font-family: 'Bebas Neue', arial, sans-serif;
          font-weight: normal;
          color: #000;
          text-transform: uppercase; }
        .app_container .onboarding_popup .onboarding_screen .screen_body .screen_text {
          display: block;
          margin: 0;
          margin-top: 10px;
          font-size: 14px;
          line-height: 18px;
          font-family: 'Open Sans', arial, sans-serif;
          font-weight: normal;
          color: #363636; }
          .app_container .onboarding_popup .onboarding_screen .screen_body .screen_text strong {
            font-weight: 600; }
          .app_container .onboarding_popup .onboarding_screen .screen_body .screen_text a {
            color: #363636;
            transition: .3s; }
            .app_container .onboarding_popup .onboarding_screen .screen_body .screen_text a:hover, .app_container .onboarding_popup .onboarding_screen .screen_body .screen_text a:focus, .app_container .onboarding_popup .onboarding_screen .screen_body .screen_text a:active {
              text-decoration: none;
              color: #24C667; }
          .app_container .onboarding_popup .onboarding_screen .screen_body .screen_text ol, .app_container .onboarding_popup .onboarding_screen .screen_body .screen_text ul {
            padding: 0;
            margin: 0;
            list-style: inside; }
      .app_container .onboarding_popup .onboarding_screen .screen_options {
        padding: 0 30px;
        font-size: 0; }
        @media (max-width: 390px) {
          .app_container .onboarding_popup .onboarding_screen .screen_options {
            padding: 0 15px; } }
        .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option {
          display: inline-block;
          vertical-align: middle;
          border: 1px solid rgba(0, 0, 0, 0.15);
          border-radius: 18px;
          width: 49%;
          padding-top: 170px;
          position: relative;
          cursor: pointer; }
          @media (max-width: 1500px) {
            .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option {
              padding-top: 150px; } }
          @media (max-width: 550px) {
            .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option {
              width: 100%; } }
          .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option:last-child {
            margin-left: 2%;
            opacity: 0.5;
            cursor: not-allowed; }
            .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option:last-child:hover .option_icon {
              transform: translateX(-50%) translateY(-50%) scale(1); }
            @media (max-width: 550px) {
              .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option:last-child {
                margin-left: 0;
                margin-top: 15px; } }
          .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option .option_icon {
            position: absolute;
            top: 43%;
            left: 50%;
            transform: translateX(-50%) translateY(-50%);
            transition: .3s; }
          .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option .bottom_texts {
            width: 100%;
            position: relative;
            padding: 0 20px;
            margin-bottom: 20px;
            color: #fff;
            font-size: 22px;
            line-height: 28px; }
            .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option .bottom_texts .arrow_right {
              position: absolute;
              right: 20px;
              top: 50%;
              transform: translateY(-50%); }
          .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option.screen_option1 {
            background-image: url("../img/card_bg2-min.jpg ");
            background-repeat: no-repeat;
            background-position: center center;
            background-size: cover;
            border: none; }
          .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option.screen_option2 .bottom_texts {
            color: #000000; }
            .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option.screen_option2 .bottom_texts .arrow_right path {
              fill: #24C667; }
          .app_container .onboarding_popup .onboarding_screen .screen_options .screen_option:hover .option_icon {
            transform: translateX(-50%) translateY(-50%) scale(1.1); }
      .app_container .onboarding_popup .onboarding_screen .screen_helper {
        padding: 30px 30px 30px 30px;
        font-weight: 600;
        font-size: 18px; }
        @media (max-width: 390px) {
          .app_container .onboarding_popup .onboarding_screen .screen_helper {
            padding: 30px 15px 30px 15px; } }
        .app_container .onboarding_popup .onboarding_screen .screen_helper a {
          color: #24C667;
          transition: .3s; }
          .app_container .onboarding_popup .onboarding_screen .screen_helper a:hover, .app_container .onboarding_popup .onboarding_screen .screen_helper a:active, .app_container .onboarding_popup .onboarding_screen .screen_helper a:focus {
            color: #1c994f;
            text-decoration: none; }
      .app_container .onboarding_popup .onboarding_screen.request_code-screen, .app_container .onboarding_popup .onboarding_screen.send_code-screen {
        text-align: center; }
        .app_container .onboarding_popup .onboarding_screen.request_code-screen .screen_body, .app_container .onboarding_popup .onboarding_screen.send_code-screen .screen_body {
          padding: 60px 70px 60px; }
          @media (max-width: 550px) {
            .app_container .onboarding_popup .onboarding_screen.request_code-screen .screen_body, .app_container .onboarding_popup .onboarding_screen.send_code-screen .screen_body {
              padding: 30px 40px 30px; } }
          @media (max-width: 476px) {
            .app_container .onboarding_popup .onboarding_screen.request_code-screen .screen_body, .app_container .onboarding_popup .onboarding_screen.send_code-screen .screen_body {
              padding: 30px 20px 30px; } }
          @media (max-width: 390px) {
            .app_container .onboarding_popup .onboarding_screen.request_code-screen .screen_body, .app_container .onboarding_popup .onboarding_screen.send_code-screen .screen_body {
              padding: 30px 15px 30px; } }
        .app_container .onboarding_popup .onboarding_screen.request_code-screen .last_screen-icon, .app_container .onboarding_popup .onboarding_screen.send_code-screen .last_screen-icon {
          display: inline-block;
          margin-bottom: 30px; }
        .app_container .onboarding_popup .onboarding_screen.request_code-screen .form-group, .app_container .onboarding_popup .onboarding_screen.send_code-screen .form-group {
          margin-bottom: 0; }
        .app_container .onboarding_popup .onboarding_screen.request_code-screen input[type="text"], .app_container .onboarding_popup .onboarding_screen.send_code-screen input[type="text"] {
          background: #F6F6F6;
          border: 1px solid #F6F6F6;
          border-radius: 18px;
          line-height: 58px;
          font-size: 16px;
          font-family: 'Open Sans', arial, sans-serif;
          font-weight: normal;
          color: #000;
          width: 100%;
          padding: 0 25px;
          transition: .3s;
          width: 100%;
          display: inline-block;
          margin-top: 30px;
          width: 400px; }
          @media (max-width: 550px) {
            .app_container .onboarding_popup .onboarding_screen.request_code-screen input[type="text"], .app_container .onboarding_popup .onboarding_screen.send_code-screen input[type="text"] {
              width: 100%; } }
          .app_container .onboarding_popup .onboarding_screen.request_code-screen input[type="text"]:focus, .app_container .onboarding_popup .onboarding_screen.send_code-screen input[type="text"]:focus {
            background: #fff;
            border: 1px solid #24C667; }
          .app_container .onboarding_popup .onboarding_screen.request_code-screen input[type="text"].input_error, .app_container .onboarding_popup .onboarding_screen.send_code-screen input[type="text"].input_error {
            border: 1px solid #FF0000; }
        .app_container .onboarding_popup .onboarding_screen.request_code-screen .app_btn, .app_container .onboarding_popup .onboarding_screen.send_code-screen .app_btn {
          margin-top: 30px;
          width: 400px; }
          @media (max-width: 550px) {
            .app_container .onboarding_popup .onboarding_screen.request_code-screen .app_btn, .app_container .onboarding_popup .onboarding_screen.send_code-screen .app_btn {
              width: 100%; } }
    .app_container .onboarding_popup .screens_nav {
      padding: 0 30px 30px 30px;
      font-size: 0; }
      @media (max-width: 1400px) {
        .app_container .onboarding_popup .screens_nav {
          padding: 0 30px 20px; } }
      @media (max-width: 390px) {
        .app_container .onboarding_popup .screens_nav {
          padding: 0 15px 30px; } }
      .app_container .onboarding_popup .screens_nav .screens_dots {
        display: inline-block;
        vertical-align: middle;
        width: 35%; }
        @media (max-width: 1199px) {
          .app_container .onboarding_popup .screens_nav .screens_dots {
            width: 100%;
            text-align: center; } }
        .app_container .onboarding_popup .screens_nav .screens_dots .screen_dot {
          display: inline-block;
          vertical-align: middle;
          background: #D9D9D9;
          width: 15px;
          height: 15px;
          border-radius: 50%;
          transition: .3s;
          margin-right: 15px;
          cursor: pointer; }
          .app_container .onboarding_popup .screens_nav .screens_dots .screen_dot:last-child {
            margin-right: 0; }
          .app_container .onboarding_popup .screens_nav .screens_dots .screen_dot.active {
            background: #24C667; }
      .app_container .onboarding_popup .screens_nav .screens_btns {
        display: inline-block;
        vertical-align: middle;
        text-align: right;
        width: 65%; }
        @media (max-width: 1199px) {
          .app_container .onboarding_popup .screens_nav .screens_btns {
            width: 100%;
            text-align: center;
            margin-top: 20px; } }
        .app_container .onboarding_popup .screens_nav .screens_btns .prev_screen {
          display: inline-block;
          vertical-align: middle;
          height: 60px;
          border: 1px solid rgba(0, 0, 0, 0.25);
          border-radius: 18px;
          width: 62px;
          position: relative;
          margin-right: 10px;
          cursor: pointer;
          transition: .3s;
          display: none; }
          .app_container .onboarding_popup .screens_nav .screens_btns .prev_screen:hover {
            background: #f0f0f0; }
          .app_container .onboarding_popup .screens_nav .screens_btns .prev_screen.active {
            display: inline-block; }
          .app_container .onboarding_popup .screens_nav .screens_btns .prev_screen svg {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translateX(-50%) translateY(-50%); }

.app {
  min-height: 100vh; }
  .app .app_container .app_nav {
    height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    width: 390px;
    padding: 15px;
    display: none; }
    @media (max-width: 1500px) {
      .app .app_container .app_nav {
        width: 350px; } }
    @media (max-width: 991px) {
      .app .app_container .app_nav {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        z-index: 9999;
        background: #000 !important;
        padding: 0;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: .3s; }
        .app .app_container .app_nav.active {
          opacity: 1;
          visibility: visible;
          pointer-events: auto; } }
    .app .app_container .app_nav.unlocked {
      display: block; }
    .app .app_container .app_nav .nav_container {
      border-radius: 25px;
      padding: 20px;
      background-image: url("../img/nav-bg.jpg");
      background-repeat: no-repeat;
      background-position: center center;
      background-size: cover;
      position: relative;
      height: 100%; }
      @media (max-width: 991px) {
        .app .app_container .app_nav .nav_container {
          background-image: url("../img/nav-bg-mobile.jpg");
          border-radius: 0;
          padding: 15px 15px; } }
      .app .app_container .app_nav .nav_container .mCSB_container {
        padding-bottom: 300px; }
        .app .app_container .app_nav .nav_container .mCSB_container .copyright {
          position: absolute;
          bottom: 0;
          left: 50%;
          transform: translateX(-50%);
          color: #fff;
          opacity: .4;
          font-size: 12px;
          display: block; }
          @media (max-width: 991px) {
            .app .app_container .app_nav .nav_container .mCSB_container .copyright {
              display: none; } }
      .app .app_container .app_nav .nav_container .close_btn {
        display: none;
        position: absolute;
        z-index: 1;
        top: 12px;
        right: 8px;
        cursor: pointer; }
        @media (max-width: 991px) {
          .app .app_container .app_nav .nav_container .close_btn {
            display: block; } }
        .app .app_container .app_nav .nav_container .close_btn svg {
          display: block; }
    .app .app_container .app_nav .title {
      font-size: 42px;
      color: #fff;
      font-weight: 700;
      margin: 0;
      margin-bottom: 25px; }
    .app .app_container .app_nav .nav_logo {
      margin-bottom: 25px; }
    .app .app_container .app_nav .nav_title {
      font-size: 18px;
      line-height: 26px;
      font-weight: 500;
      color: #fff;
      margin: 0;
      margin-bottom: 10px; }
    .app .app_container .app_nav .nav_menu {
      list-style: none;
      margin: 0;
      padding: 0; }
      .app .app_container .app_nav .nav_menu .menu_item {
        margin-bottom: 5px; }
        .app .app_container .app_nav .nav_menu .menu_item a {
          border-radius: 25px;
          background: transparent;
          color: #fff;
          display: block;
          position: relative;
          padding: 12px 20px 12px 60px;
          font-size: 18px;
          transition: .3s;
          opacity: 1; }
          .app .app_container .app_nav .nav_menu .menu_item a svg {
            position: absolute;
            left: 15px;
            top: 50%;
            transform: translateY(-50%);
            width: 32px; }
            .app .app_container .app_nav .nav_menu .menu_item a svg path {
              fill: #fff;
              transition: .3s; }
          .app .app_container .app_nav .nav_menu .menu_item a:hover, .app .app_container .app_nav .nav_menu .menu_item a:active, .app .app_container .app_nav .nav_menu .menu_item a:focus {
            background: transparent;
            opacity: .8;
            text-decoration: none;
            color: #fff; }
            .app .app_container .app_nav .nav_menu .menu_item a:hover svg path, .app .app_container .app_nav .nav_menu .menu_item a:active svg path, .app .app_container .app_nav .nav_menu .menu_item a:focus svg path {
              fill: #fff; }
          .app .app_container .app_nav .nav_menu .menu_item a .n_counter {
            display: block;
            position: absolute;
            right: 15px;
            top: 50%;
            transform: translateY(-50%);
            font-size: 18px;
            line-height: 30px;
            border-radius: 9px;
            color: #fff;
            padding: 0 10px; }
            .app .app_container .app_nav .nav_menu .menu_item a .n_counter.notifications_counter {
              background: #FF692D; }
            .app .app_container .app_nav .nav_menu .menu_item a .n_counter.approvals_counter {
              background: #A22DFF; }
        .app .app_container .app_nav .nav_menu .menu_item.active a {
          background: #346A4D;
          background: linear-gradient(160deg, #346a4d 0%, #24c667 195%);
          text-decoration: none;
          color: #fff;
          opacity: 1;
          font-weight: 500; }
          .app .app_container .app_nav .nav_menu .menu_item.active a svg path {
            fill: #fff; }
        .app .app_container .app_nav .nav_menu .menu_item.locked {
          opacity: 0.7 !important;
          cursor: default; }
    .app .app_container .app_nav .profile_section {
      position: absolute;
      bottom: 20px;
      left: 0;
      right: 0; }
      .app .app_container .app_nav .profile_section .user_details {
        margin-top: 10px;
        position: relative;
        padding: 0 0 0 0; }
        .app .app_container .app_nav .profile_section .user_details .user_edit {
          display: block;
          position: relative;
          padding: 15px 0px 15px 60px; }
          .app .app_container .app_nav .profile_section .user_details .user_edit .user_avatar {
            width: 45px;
            height: 45px;
            border-radius: 50%;
            background-size: cover !important;
            position: absolute;
            left: 7px;
            top: 50%;
            transform: translateY(-50%); }
          .app .app_container .app_nav .profile_section .user_details .user_edit .item_text .user_name {
            font-size: 15px;
            display: block;
            color: #fff;
            line-height: 22px;
            transition: .3s; }
          .app .app_container .app_nav .profile_section .user_details .user_edit .item_text .user_type {
            font-size: 15px;
            color: rgba(255, 255, 255, 0.58);
            display: block;
            line-height: 22px;
            transition: .3s; }
          .app .app_container .app_nav .profile_section .user_details .user_edit:hover, .app .app_container .app_nav .profile_section .user_details .user_edit:active, .app .app_container .app_nav .profile_section .user_details .user_edit:focus {
            text-decoration: none; }
            .app .app_container .app_nav .profile_section .user_details .user_edit:hover .item_text .user_name, .app .app_container .app_nav .profile_section .user_details .user_edit:active .item_text .user_name, .app .app_container .app_nav .profile_section .user_details .user_edit:focus .item_text .user_name {
              color: rgba(255, 255, 255, 0.8); }
            .app .app_container .app_nav .profile_section .user_details .user_edit:hover .item_text .user_type, .app .app_container .app_nav .profile_section .user_details .user_edit:active .item_text .user_type, .app .app_container .app_nav .profile_section .user_details .user_edit:focus .item_text .user_type {
              color: rgba(255, 255, 255, 0.4); }
      .app .app_container .app_nav .profile_section .user_logout-section {
        padding: 15px 0; }
        .app .app_container .app_nav .profile_section .user_logout-section .bottom_menu {
          margin: 0;
          padding: 0;
          list-style: none; }
          .app .app_container .app_nav .profile_section .user_logout-section .bottom_menu li {
            margin-bottom: 10px; }
            .app .app_container .app_nav .profile_section .user_logout-section .bottom_menu li:last-child {
              margin: 0; }
        .app .app_container .app_nav .profile_section .user_logout-section .user_logout, .app .app_container .app_nav .profile_section .user_logout-section .user_utils {
          position: relative;
          padding-left: 60px;
          display: block;
          color: rgba(255, 255, 255, 0.58);
          transition: .3s;
          font-size: 14px; }
          .app .app_container .app_nav .profile_section .user_logout-section .user_logout svg, .app .app_container .app_nav .profile_section .user_logout-section .user_utils svg {
            position: absolute;
            top: 50%;
            left: 18px;
            transform: translateY(-50%);
            display: block;
            width: 25px; }
            .app .app_container .app_nav .profile_section .user_logout-section .user_logout svg path, .app .app_container .app_nav .profile_section .user_logout-section .user_utils svg path {
              fill: #fff;
              transition: .3s; }
          .app .app_container .app_nav .profile_section .user_logout-section .user_logout:hover, .app .app_container .app_nav .profile_section .user_logout-section .user_logout:active, .app .app_container .app_nav .profile_section .user_logout-section .user_logout:focus, .app .app_container .app_nav .profile_section .user_logout-section .user_utils:hover, .app .app_container .app_nav .profile_section .user_logout-section .user_utils:active, .app .app_container .app_nav .profile_section .user_logout-section .user_utils:focus {
            text-decoration: none;
            color: white; }
        .app .app_container .app_nav .profile_section .user_logout-section .user_logout svg {
          width: 22px;
          left: 22px; }
  .app .app_container .app_nav-mobile {
    display: none;
    padding: 15px 15px;
    position: relative; }
    @media (max-width: 991px) {
      .app .app_container .app_nav-mobile {
        display: block; } }
    .app .app_container .app_nav-mobile .mobile_trigger {
      display: block;
      position: absolute;
      z-index: 1;
      top: 24px;
      right: 15px;
      cursor: pointer; }
      .app .app_container .app_nav-mobile .mobile_trigger svg {
        display: block; }
  .app .app_container .app_screen {
    margin-left: 390px;
    padding: 15px 15px 15px 0px;
    height: 100vh; }
    @media (max-width: 1500px) {
      .app .app_container .app_screen {
        margin-left: 350px; } }
    @media (max-width: 991px) {
      .app .app_container .app_screen {
        margin-left: 0;
        padding: 0 15px 50px;
        height: auto;
        position: relative; } }
    .app .app_container .app_screen:after {
      content: '';
      display: block;
      clear: both; }
    .app .app_container .app_screen.regular_page {
      margin-left: 0;
      padding: 15px;
      height: auto; }
    .app .app_container .app_screen .screen_container {
      background: #fff;
      border-radius: 25px;
      position: relative;
      height: 100%;
      padding: 30px; }
      @media (max-width: 991px) {
        .app .app_container .app_screen .screen_container {
          padding: 15px; } }
      .app .app_container .app_screen .screen_container .back_btn {
        position: absolute;
        top: 0;
        left: 0;
        background: #24C667;
        width: 44px;
        height: 44px;
        border-radius: 50%;
        transition: .3s; }
        @media (max-width: 991px) {
          .app .app_container .app_screen .screen_container .back_btn {
            left: 15px;
            top: 15px; } }
        .app .app_container .app_screen .screen_container .back_btn svg {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translateX(-50%) translateY(-50%); }
        .app .app_container .app_screen .screen_container .back_btn:hover {
          background: #1c994f; }
      .app .app_container .app_screen .screen_container .quiz_container {
        padding: 12px 120px 40px; }
        @media (max-width: 1199px) {
          .app .app_container .app_screen .screen_container .quiz_container {
            padding: 70px 50px 40px 50px; } }
        @media (max-width: 991px) {
          .app .app_container .app_screen .screen_container .quiz_container {
            padding: 70px 40px 40px 40px; } }
        .app .app_container .app_screen .screen_container .quiz_container .quiz_header {
          margin-bottom: 40px; }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_header .quiz_progress-status:after {
            content: '';
            display: block;
            clear: both; }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_header .quiz_progress-status .quiz_part {
            font-family: 'Open Sans', arial, sans-serif;
            font-weight: 500;
            margin: 0;
            float: left;
            font-size: 18px; }
            @media (max-width: 767px) {
              .app .app_container .app_screen .screen_container .quiz_container .quiz_header .quiz_progress-status .quiz_part {
                float: none;
                width: 100%;
                display: block; } }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_header .quiz_progress-status .quiz_progress-percentage {
            font-family: 'Open Sans', arial, sans-serif;
            font-weight: 500;
            margin: 0;
            float: right;
            font-size: 18px; }
            @media (max-width: 767px) {
              .app .app_container .app_screen .screen_container .quiz_container .quiz_header .quiz_progress-status .quiz_progress-percentage {
                float: none;
                width: 100%;
                margin-top: 2px;
                display: block; } }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_header .progress {
            height: 5px;
            width: 100%;
            background: #D9D9D9;
            border-radius: 25px;
            margin-top: 20px;
            overflow: hidden; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_header .progress .bar {
              height: 100%;
              background: #24C667;
              border-radius: 25px; }
        .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text {
          margin: 0;
          font-size: 0; }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text .text_elem {
            display: inline;
            font-family: 'Bebas Neue', arial, sans-serif;
            font-size: 42px;
            line-height: 40px;
            font-weight: 400; }
            @media (max-width: 767px) {
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text .text_elem {
                font-size: 30px;
                line-height: 28px; } }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text .info_btn {
            display: inline-block;
            position: relative;
            top: 2px;
            margin-left: 10px;
            width: 34px;
            height: 34px;
            background: #DEDEDE;
            border-radius: 50%;
            cursor: pointer;
            transition: .3s; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text .info_btn svg {
              position: absolute;
              top: 50%;
              left: 50%;
              transform: translateX(-50%) translateY(-50%); }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text .info_btn svg path {
                transition: .3s;
                fill: #346A4D; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text .info_btn:hover, .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text .info_btn.info_active {
              background: #24C667; }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text .info_btn:hover svg path, .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text .info_btn.info_active svg path {
                fill: #fff; }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text.info_active .option_wrapper {
            background: rgba(164, 164, 164, 0.1); }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_text.info_active .option_wrapper .option_info {
              border-top: 1px solid rgba(0, 0, 0, 0.24); }
        .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_info {
          border: 1px solid rgba(0, 0, 0, 0.1);
          border-radius: 10px;
          padding: 10px 15px;
          margin: 5px 0 10px;
          display: none; }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_info .info_title {
            position: relative;
            color: #346A4D;
            font-weight: 500;
            font-size: 14px;
            font-family: 'Open Sans', arial, sans-serif;
            display: block;
            padding-left: 25px; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_info .info_title svg {
              position: absolute;
              left: 0;
              top: 50%;
              transform: translateY(-50%); }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_info .info_text {
            margin-top: 10px;
            display: block;
            font-family: 'Open Sans', arial, sans-serif;
            font-size: 14px;
            line-height: 20px; }
        .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_instruction {
          font-family: 'Open Sans', arial, sans-serif;
          font-size: 18px;
          displayt: block; }
          @media (max-width: 767px) {
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_question .question_instruction {
              font-size: 16px; } }
        .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options {
          margin-top: 30px; }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .category_label {
            font-family: 'Open Sans', arial, sans-serif;
            font-weight: 700;
            display: block;
            margin-bottom: 10px;
            margin-top: 20px; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .category_label:first-child {
              margin-top: 0; }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container {
            position: relative;
            margin-bottom: 8px; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper {
              border: 1px solid rgba(0, 0, 0, 0.1);
              border-radius: 10px;
              padding: 12px;
              padding-left: 50px;
              position: relative;
              background: white;
              transition: .3s; }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .option_text {
                font-family: 'Open Sans', arial, sans-serif;
                font-size: 18px; }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .option_info {
                display: none;
                border-top: 1px solid rgba(0, 0, 0, 0);
                margin-top: 15px;
                padding-top: 15px; }
                .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .option_info .info_title {
                  position: relative;
                  color: #346A4D;
                  font-weight: 500;
                  font-size: 14px;
                  font-family: 'Open Sans', arial, sans-serif;
                  display: block;
                  padding-left: 25px; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .option_info .info_title svg {
                    position: absolute;
                    left: 0;
                    top: 50%;
                    transform: translateY(-50%); }
                .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .option_info .info_text {
                  font-family: 'Open Sans', arial, sans-serif;
                  display: block;
                  font-size: 14px;
                  font-weight: 400; }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group {
                margin: 0; }
                .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group label {
                  cursor: pointer;
                  font-size: 16px;
                  line-height: 160%;
                  color: #000;
                  opacity: 1;
                  font-weight: normal;
                  font-family: 'Open Sans', arial, sans-serif;
                  margin: 0; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group label a {
                    color: #000;
                    transition: .3s; }
                    .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group label a:hover, .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group label a:active, .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group label a:hover {
                      color: #24C667;
                      text-decoration: none; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group label:before {
                    content: '';
                    -webkit-appearance: none;
                    background-color: transparent;
                    border: 1px solid rgba(0, 0, 0, 0.25);
                    width: 28px;
                    height: 28px;
                    display: inline-block;
                    position: absolute;
                    vertical-align: middle;
                    cursor: pointer;
                    border-radius: 5px;
                    left: 12px;
                    top: 11px;
                    transition: .3s; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group label:after {
                    content: "";
                    display: inline-block;
                    width: 17px;
                    height: 10px;
                    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="17" height="10" viewBox="0 0 17 10" fill="none"><path d="M15.8658 1.98754L8.89686 8.70502L8.89833 8.70355C8.18658 9.4153 7.25278 9.77117 6.31163 9.77117C5.37048 9.77117 4.42638 9.41236 3.70875 8.69473L0.376486 5.60069C0.0794344 5.32423 0.063259 4.85806 0.339723 4.56101C0.616186 4.26396 1.08235 4.24778 1.3794 4.52277L4.72932 7.63593C5.60724 8.51385 7.0072 8.51385 7.86747 7.65505L14.8467 0.928747C15.1394 0.646401 15.604 0.658166 15.8864 0.947864C16.1673 1.2405 16.1584 1.70667 15.8658 1.98754Z" fill="white"/></svg>') no-repeat center;
                    background-size: contain;
                    opacity: 0;
                    visibility: hidden;
                    transition: .3s;
                    top: 20px;
                    left: 18px;
                    position: absolute; }
                .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group .radio_input {
                  padding: 0;
                  height: initial;
                  width: initial;
                  margin-bottom: 0;
                  display: none;
                  cursor: pointer; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group .radio_input:checked + label:before {
                    background: #24C667;
                    border: 1px solid #24C667; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .radio-group .radio_input:checked + label:after {
                    opacity: 1;
                    visibility: visible; }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group {
                margin: 0; }
                .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group label {
                  cursor: pointer;
                  font-size: 16px;
                  line-height: 160%;
                  color: #000;
                  opacity: 1;
                  font-weight: normal;
                  font-family: 'Open Sans', arial, sans-serif;
                  margin: 0; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group label a {
                    color: #000;
                    transition: .3s; }
                    .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group label a:hover, .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group label a:active, .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group label a:hover {
                      color: #24C667;
                      text-decoration: none; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group label:before {
                    content: '';
                    -webkit-appearance: none;
                    background-color: transparent;
                    border: 1px solid rgba(0, 0, 0, 0.25);
                    width: 28px;
                    height: 28px;
                    display: inline-block;
                    position: absolute;
                    vertical-align: middle;
                    cursor: pointer;
                    border-radius: 5px;
                    left: 12px;
                    top: 11px;
                    transition: .3s; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group label:after {
                    content: "";
                    display: inline-block;
                    width: 17px;
                    height: 10px;
                    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="17" height="10" viewBox="0 0 17 10" fill="none"><path d="M15.8658 1.98754L8.89686 8.70502L8.89833 8.70355C8.18658 9.4153 7.25278 9.77117 6.31163 9.77117C5.37048 9.77117 4.42638 9.41236 3.70875 8.69473L0.376486 5.60069C0.0794344 5.32423 0.063259 4.85806 0.339723 4.56101C0.616186 4.26396 1.08235 4.24778 1.3794 4.52277L4.72932 7.63593C5.60724 8.51385 7.0072 8.51385 7.86747 7.65505L14.8467 0.928747C15.1394 0.646401 15.604 0.658166 15.8864 0.947864C16.1673 1.2405 16.1584 1.70667 15.8658 1.98754Z" fill="white"/></svg>') no-repeat center;
                    background-size: contain;
                    opacity: 0;
                    visibility: hidden;
                    transition: .3s;
                    top: 20px;
                    left: 18px;
                    position: absolute; }
                .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group .checkbox_input {
                  padding: 0;
                  height: initial;
                  width: initial;
                  margin-bottom: 0;
                  display: none;
                  cursor: pointer; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group .checkbox_input:checked + label:before {
                    background: #24C667;
                    border: 1px solid #24C667; }
                  .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .option_wrapper .checkbox-group .checkbox_input:checked + label:after {
                    opacity: 1;
                    visibility: visible; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .info_btn {
              position: absolute;
              right: -40px;
              top: 12px;
              width: 28px;
              height: 28px;
              background: #DEDEDE;
              border-radius: 50%;
              cursor: pointer;
              transition: .3s; }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .info_btn svg {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translateX(-50%) translateY(-50%); }
                .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .info_btn svg path {
                  transition: .3s;
                  fill: #346A4D; }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .info_btn:hover, .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .info_btn.info_active {
                background: #24C667; }
                .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .info_btn:hover svg path, .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .info_btn.info_active svg path {
                  fill: #fff; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container.info_active .option_wrapper {
              background: rgba(164, 164, 164, 0.1); }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container.info_active .option_wrapper .option_info {
                border-top: 1px solid rgba(0, 0, 0, 0.24); }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container.multiple_choice_scored_option .option_wrapper {
              padding-left: 64px; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .option_container .other_textarea {
              margin-top: 10px;
              width: 100% !important; }
          .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .quiz_nav {
            margin-top: 30px;
            text-align: center; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .quiz_nav .next_btn {
              width: 100%;
              display: block; }
              @media (max-width: 767px) {
                .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .quiz_nav .next_btn {
                  padding: 16px 15px;
                  line-height: 26px; } }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .quiz_nav .next_btn.disabled {
                cursor: not-allowed;
                background: #d9d9d9; }
            .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .quiz_nav .prev_btn {
              display: inline-block;
              margin-top: 20px;
              border: none;
              padding: 0;
              background: transparent;
              transition: .3s;
              color: #000; }
              @media (max-width: 767px) {
                .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .quiz_nav .prev_btn {
                  padding: 0 15px;
                  line-height: 18px; } }
              .app .app_container .app_screen .screen_container .quiz_container .quiz_step .quiz_options .quiz_nav .prev_btn:hover {
                color: #1c994f; }
      .app .app_container .app_screen .screen_container .summary_container {
        padding: 12px 120px 40px; }
        @media (max-width: 1500px) {
          .app .app_container .app_screen .screen_container .summary_container {
            padding: 70px 0 40px; } }
        .app .app_container .app_screen .screen_container .summary_container .user_details {
          position: relative;
          padding: 15px 0px 15px 90px;
          position: relative; }
          .app .app_container .app_screen .screen_container .summary_container .user_details .user_avatar {
            width: 76px;
            height: 76px;
            border-radius: 50%;
            background-size: cover !important;
            position: absolute;
            left: 0px;
            top: 50%;
            transform: translateY(-50%);
            border: 1px solid rgba(0, 0, 0, 0.25); }
          .app .app_container .app_screen .screen_container .summary_container .user_details .item_text .user_name {
            font-size: 42px;
            display: block;
            color: #000;
            line-height: 40px;
            font-family: 'Bebas Neue', arial, sans-serif;
            transition: .3s; }
            @media (max-width: 767px) {
              .app .app_container .app_screen .screen_container .summary_container .user_details .item_text .user_name {
                font-size: 30px;
                line-height: 28px; } }
        .app .app_container .app_screen .screen_container .summary_container .detail_name {
          font-family: 'Open Sans', arial, sans-serif;
          color: #000;
          font-weight: 500;
          font-size: 18px;
          display: block; }
        .app .app_container .app_screen .screen_container .summary_container .detail_text {
          font-family: 'Open Sans', arial, sans-serif;
          color: #000;
          font-weight: 400;
          font-size: 18px;
          display: block;
          margin-top: 7px; }
        .app .app_container .app_screen .screen_container .summary_container .summary_details {
          border-top: 1px solid #D9D9D9;
          border-bottom: 1px solid #D9D9D9;
          padding: 17px 0;
          margin-top: 40px;
          font-size: 0; }
          @media (max-width: 1500px) {
            .app .app_container .app_screen .screen_container .summary_container .summary_details {
              padding: 0; } }
          .app .app_container .app_screen .screen_container .summary_container .summary_details:after {
            content: '';
            display: block;
            clear: both; }
          .app .app_container .app_screen .screen_container .summary_container .summary_details > div {
            border-right: 1px solid #D9D9D9;
            padding-top: 10px;
            padding-bottom: 10px; }
            @media (max-width: 1500px) {
              .app .app_container .app_screen .screen_container .summary_container .summary_details > div {
                border-right: none;
                border-bottom: 1px solid #D9D9D9; } }
            .app .app_container .app_screen .screen_container .summary_container .summary_details > div:last-child {
              border-right: none;
              border-bottom: none; }
          .app .app_container .app_screen .screen_container .summary_container .summary_details .first_box-details, .app .app_container .app_screen .screen_container .summary_container .summary_details .fourth_box-details {
            width: 27%;
            display: inline-block;
            vertical-align: middle; }
            @media (max-width: 1500px) {
              .app .app_container .app_screen .screen_container .summary_container .summary_details .first_box-details, .app .app_container .app_screen .screen_container .summary_container .summary_details .fourth_box-details {
                width: 100%;
                padding-left: 0;
                padding-right: 0; } }
          .app .app_container .app_screen .screen_container .summary_container .summary_details .sec_box-details, .app .app_container .app_screen .screen_container .summary_container .summary_details .third_box-details {
            width: 23%;
            display: inline-block;
            vertical-align: middle;
            padding-left: 30px;
            padding-right: 30px; }
            @media (max-width: 1500px) {
              .app .app_container .app_screen .screen_container .summary_container .summary_details .sec_box-details, .app .app_container .app_screen .screen_container .summary_container .summary_details .third_box-details {
                width: 100%;
                padding-left: 0;
                padding-right: 0; } }
          .app .app_container .app_screen .screen_container .summary_container .summary_details .first_box-details {
            padding-right: 30px; }
          .app .app_container .app_screen .screen_container .summary_container .summary_details .fourth_box-details {
            padding-left: 30px;
            padding-right: 50px;
            position: relative; }
            @media (max-width: 1500px) {
              .app .app_container .app_screen .screen_container .summary_container .summary_details .fourth_box-details {
                padding-left: 0; } }
          .app .app_container .app_screen .screen_container .summary_container .summary_details .quiz_statuses {
            padding: 0;
            margin: 0;
            list-style: none;
            margin-top: 8px; }
            .app .app_container .app_screen .screen_container .summary_container .summary_details .quiz_statuses .status_item {
              background: #898A8E;
              display: inline-block;
              border-radius: 100px;
              color: #fff;
              padding: 0 10px;
              font-family: 'Open Sans', arial, sans-serif;
              font-weight: 500;
              line-height: 24px;
              font-size: 14px;
              cursor: default;
              margin-right: 7px;
              margin-bottom: 7px;
              white-space: nowrap; }
              .app .app_container .app_screen .screen_container .summary_container .summary_details .quiz_statuses .status_item.started {
                background: #FFC800;
                color: #346A4D; }
              .app .app_container .app_screen .screen_container .summary_container .summary_details .quiz_statuses .status_item.waiting_report {
                background: #1EA757; }
              .app .app_container .app_screen .screen_container .summary_container .summary_details .quiz_statuses .status_item.finished_report {
                background: #346A4D; }
              .app .app_container .app_screen .screen_container .summary_container .summary_details .quiz_statuses .status_item:last-child {
                margin-right: 0; }
          .app .app_container .app_screen .screen_container .summary_container .summary_details .quiz_date {
            font-size: 18px;
            font-family: 'Open Sans', arial, sans-serif;
            font-weight: 400;
            color: #000;
            display: block;
            margin-top: 8px;
            margin-bottom: 7px;
            line-height: 28px; }
          .app .app_container .app_screen .screen_container .summary_container .summary_details .user_profile {
            font-size: 18px;
            font-family: 'Open Sans', arial, sans-serif;
            font-weight: 400;
            color: #000;
            display: inline-block;
            margin-top: 8px;
            line-height: 28px;
            transition: .3s;
            margin-bottom: 7px; }
            .app .app_container .app_screen .screen_container .summary_container .summary_details .user_profile:hover {
              text-decoration: none;
              color: #1EA757; }
          .app .app_container .app_screen .screen_container .summary_container .summary_details .user_profile-btn {
            position: absolute;
            top: 50%;
            right: 0;
            transform: translateY(-50%);
            background: #24C667;
            width: 44px;
            height: 44px;
            border-radius: 50%;
            transition: .3s; }
            .app .app_container .app_screen .screen_container .summary_container .summary_details .user_profile-btn svg {
              position: absolute;
              top: 50%;
              left: 50%;
              transform: translateX(-50%) translateY(-50%); }
            .app .app_container .app_screen .screen_container .summary_container .summary_details .user_profile-btn:hover {
              background: #1c994f; }
          .app .app_container .app_screen .screen_container .summary_container .summary_details.user_summary-details .first_box-details, .app .app_container .app_screen .screen_container .summary_container .summary_details.user_summary-details .sec_box-details, .app .app_container .app_screen .screen_container .summary_container .summary_details.user_summary-details .third_box-details {
            width: 33.33333%; }
            @media (max-width: 1500px) {
              .app .app_container .app_screen .screen_container .summary_container .summary_details.user_summary-details .first_box-details, .app .app_container .app_screen .screen_container .summary_container .summary_details.user_summary-details .sec_box-details, .app .app_container .app_screen .screen_container .summary_container .summary_details.user_summary-details .third_box-details {
                width: 100%;
                padding-left: 0;
                padding-right: 0; } }
        .app .app_container .app_screen .screen_container .summary_container .summary_actions {
          padding-top: 40px; }
          .app .app_container .app_screen .screen_container .summary_container .summary_actions .btns_container {
            margin-top: 30px;
            font-size: 0; }
            .app .app_container .app_screen .screen_container .summary_container .summary_actions .btns_container .app_btn {
              margin-right: 15px; }
              @media (max-width: 1500px) {
                .app .app_container .app_screen .screen_container .summary_container .summary_actions .btns_container .app_btn {
                  width: 100%;
                  display: block;
                  margin: 0; } }
              @media (max-width: 476px) {
                .app .app_container .app_screen .screen_container .summary_container .summary_actions .btns_container .app_btn {
                  padding: 0 15px; } }
              .app .app_container .app_screen .screen_container .summary_container .summary_actions .btns_container .app_btn:last-child {
                margin-right: 0; }
                @media (max-width: 1500px) {
                  .app .app_container .app_screen .screen_container .summary_container .summary_actions .btns_container .app_btn:last-child {
                    margin-top: 10px; } }
        .app .app_container .app_screen .screen_container .summary_container .general_profile-summary {
          padding: 60px 0 40px; }
          @media (max-width: 1500px) {
            .app .app_container .app_screen .screen_container .summary_container .general_profile-summary {
              padding: 60px 20px 40px; } }
          .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header {
            padding-bottom: 15px; }
            .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .header_col {
              width: 20%;
              float: left;
              text-align: center; }
              .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .header_col.selected_level .general_level, .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .header_col.selected_level .general_name {
                color: #27C769; }
              .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .header_col.selected_level .arrow_down {
                display: none; }
            .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header:after {
              content: '';
              display: block;
              clear: both; }
            .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .general_level {
              font-size: 26px;
              display: block;
              color: #000;
              line-height: 24px;
              font-family: 'Bebas Neue', arial, sans-serif; }
              @media (max-width: 1199px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .general_level {
                  font-size: 20px;
                  line-height: 18px; } }
              @media (max-width: 767px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .general_level {
                  font-size: 14px;
                  line-height: 12px; } }
              @media (max-width: 390px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .general_level {
                  font-size: 12px;
                  line-height: 10px; } }
            .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .general_name {
              font-size: 32px;
              display: block;
              color: #000;
              line-height: 30px;
              font-family: 'Bebas Neue', arial, sans-serif;
              margin-top: 15px; }
              @media (max-width: 1199px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .general_name {
                  font-size: 24px;
                  line-height: 22px; } }
              @media (max-width: 767px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .general_name {
                  font-size: 16px;
                  line-height: 14px;
                  margin-top: 5px; } }
              @media (max-width: 390px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .general_name {
                  font-size: 14px;
                  line-height: 12px; } }
              @media (max-width: 370px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .general_name {
                  font-size: 12px;
                  line-height: 12px; } }
            .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .arrow_down {
              margin-top: 10px;
              display: inline-block;
              width: 26px; }
              @media (max-width: 767px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_header .arrow_down {
                  width: 16px;
                  margin-top: 5px; } }
          .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar {
            position: relative; }
            .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_bar-bg {
              width: 100%;
              display: block; }
            .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_legend {
              color: #707070;
              font-size: 18px;
              position: absolute;
              top: 100%; }
              @media (max-width: 767px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_legend {
                  font-size: 10px; } }
              .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_legend.legend_start {
                left: 0; }
              .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_legend.legend_end {
                right: 0; }
            .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no {
              font-size: 32px;
              display: block;
              color: #000;
              line-height: 30px;
              font-family: 'Bebas Neue', arial, sans-serif;
              position: absolute;
              top: 50%;
              transform: translateY(-50%);
              z-index: 1; }
              @media (max-width: 1199px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no {
                  font-size: 24px;
                  line-height: 22px; } }
              @media (max-width: 767px) {
                .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no {
                  font-size: 16px;
                  line-height: 14px; } }
              .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no.graph_no-start {
                left: -20px; }
              .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no.graph_no-end {
                right: -20px; }
              .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no.graph_indicator .arrow_down-green {
                position: absolute;
                left: 50%;
                top: -56px;
                transform: translateX(-50%);
                width: 26px; }
                @media (max-width: 1500px) {
                  .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no.graph_indicator .arrow_down-green {
                    top: -40px; } }
                @media (max-width: 767px) {
                  .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no.graph_indicator .arrow_down-green {
                    width: 16px;
                    top: -30px; } }
              .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no.graph_indicator .arrow_up-green {
                position: absolute;
                left: 50%;
                bottom: -56px;
                transform: translateX(-50%);
                width: 26px; }
                @media (max-width: 1500px) {
                  .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no.graph_indicator .arrow_up-green {
                    bottom: -40px; } }
                @media (max-width: 767px) {
                  .app .app_container .app_screen .screen_container .summary_container .general_profile-summary .graph_bar .graph_no.graph_indicator .arrow_up-green {
                    width: 16px;
                    bottom: -30px; } }
        .app .app_container .app_screen .screen_container .summary_container .summary_statistics {
          padding-top: 40px; }
          .app .app_container .app_screen .screen_container .summary_container .summary_statistics .statistics_graphs {
            margin-top: 20px; }
            .app .app_container .app_screen .screen_container .summary_container .summary_statistics .statistics_graphs:after {
              content: '';
              display: block;
              clear: both; }
            .app .app_container .app_screen .screen_container .summary_container .summary_statistics .statistics_graphs .graph_col {
              width: 22%;
              float: left; }
              @media (max-width: 1199px) {
                .app .app_container .app_screen .screen_container .summary_container .summary_statistics .statistics_graphs .graph_col {
                  width: 46%;
                  padding: 30px; } }
              @media (max-width: 500px) {
                .app .app_container .app_screen .screen_container .summary_container .summary_statistics .statistics_graphs .graph_col {
                  width: 100%;
                  padding: 15px; } }
              .app .app_container .app_screen .screen_container .summary_container .summary_statistics .statistics_graphs .graph_col .rounded-progress-bar {
                width: 100%;
                display: block;
                position: relative;
                text-align: center;
                vertical-align: top; }
                .app .app_container .app_screen .screen_container .summary_container .summary_statistics .statistics_graphs .graph_col .rounded-progress-bar .graph_stats {
                  position: absolute;
                  top: 50%;
                  left: 0;
                  right: 0;
                  transform: translateY(-50%);
                  width: 100%;
                  padding: 0 25px;
                  text-align: center;
                  font-family: 'Open Sans', arial, sans-serif;
                  font-size: 22px;
                  font-weight: 500; }
              .app .app_container .app_screen .screen_container .summary_container .summary_statistics .statistics_graphs .graph_col .graph_title {
                text-align: center;
                display: block;
                font-family: 'Open Sans', arial, sans-serif;
                color: #000;
                font-weight: 500;
                font-size: 18px;
                display: block;
                margin-top: 10px; }
            .app .app_container .app_screen .screen_container .summary_container .summary_statistics .statistics_graphs .graph_spacer {
              width: 4%;
              float: left;
              height: 1px; }
              @media (max-width: 1199px) {
                .app .app_container .app_screen .screen_container .summary_container .summary_statistics .statistics_graphs .graph_spacer {
                  display: none; } }
        .app .app_container .app_screen .screen_container .summary_container.analysis_summary-container .user_details {
          padding-left: 0; }
      @media (max-width: 1500px) {
        .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container {
          padding: 0;
          padding-bottom: 40px; } }
      .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .quiz_step .quiz_question .question_text .text_elem {
        font-size: 32px; }
      .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback textarea {
        border-radius: 18px;
        font-size: 16px;
        line-height: 22px;
        transition: .3s;
        border: none;
        outline: 0;
        background: #fff;
        padding: 10px;
        margin-top: 5px;
        min-height: 100px; }
      .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .option_interpretation {
        background: #F5F5F5;
        border-radius: 18px;
        padding: 15px; }
        .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .option_interpretation textarea:disabled {
          background: #F5F5F5; }
      .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .option_recommendation {
        background: #F8F7F2;
        border-radius: 18px;
        padding: 15px;
        margin-top: 10px; }
        .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .option_recommendation textarea:disabled {
          background: #F8F7F2; }
      .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .editable-header {
        margin-bottom: 7px; }
      .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .info_title {
        position: relative;
        display: inline-block;
        vertical-align: middle;
        border-radius: 15px;
        padding-right: 10px;
        padding-left: 30px;
        color: #346A4D;
        font-family: "Open Sans", arial, sans-serif;
        font-weight: 500;
        line-height: 27px; }
        .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .info_title svg {
          position: absolute;
          left: 5px;
          top: 50%;
          transform: translateY(-50%); }
      .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .edit-toggle {
        width: 27px;
        height: 27px;
        border-radius: 50%;
        background: #24C667;
        border: none;
        position: relative;
        margin-left: 5px;
        display: inline-block;
        vertical-align: middle;
        overflow: hidden;
        padding: 0;
        transition: .3s; }
        .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .edit-toggle svg {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translateX(-50%) translateY(-50%);
          width: 12px; }
          .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .edit-toggle svg path {
            transition: .3s; }
        .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .edit-toggle.active {
          background: #1c994f; }
      .app .app_container .app_screen .screen_container.quiz_summary-container .quiz_container .option_feedback .info_text {
        margin-top: 10px;
        display: block;
        font-family: "Open Sans", arial, sans-serif;
        font-size: 16px;
        line-height: 22px; }
      .app .app_container .app_screen .screen_container.quiz_summary-container .btns_container {
        padding: 0 120px 40px; }
        @media (max-width: 1500px) {
          .app .app_container .app_screen .screen_container.quiz_summary-container .btns_container {
            padding: 0 0 40px; } }
        .app .app_container .app_screen .screen_container.quiz_summary-container .btns_container .app_btn:last-child {
          margin-top: 10px; }
      .app .app_container .app_screen .screen_container .profile_container {
        padding: 12px 120px 40px; }
        @media (max-width: 1500px) {
          .app .app_container .app_screen .screen_container .profile_container {
            padding: 20px 0 40px; } }
        @media (max-width: 1500px) {
          .app .app_container .app_screen .screen_container .profile_container .form_container {
            max-width: 100%; } }
        @media (max-width: 991px) {
          .app .app_container .app_screen .screen_container .profile_container .form_container {
            padding-bottom: 0; } }
        .app .app_container .app_screen .screen_container .profile_container .user_details {
          position: relative;
          padding: 30px 0px 30px 100px;
          position: relative;
          margin-bottom: 40px; }
          .app .app_container .app_screen .screen_container .profile_container .user_details .user_avatar {
            width: 76px;
            height: 76px;
            border-radius: 50%;
            background-size: cover !important;
            position: absolute;
            left: 0px;
            top: 50%;
            transform: translateY(-50%);
            border: 1px solid rgba(0, 0, 0, 0.25); }
          .app .app_container .app_screen .screen_container .profile_container .user_details .item_text .user_name {
            font-size: 42px;
            display: block;
            color: #000;
            line-height: 40px;
            font-family: 'Bebas Neue', arial, sans-serif;
            transition: .3s; }
            @media (max-width: 767px) {
              .app .app_container .app_screen .screen_container .profile_container .user_details .item_text .user_name {
                font-size: 30px;
                line-height: 28px; } }
        .app .app_container .app_screen .screen_container .profile_container .detail_name {
          font-family: 'Open Sans', arial, sans-serif;
          color: #000;
          font-weight: 500;
          font-size: 18px;
          display: block;
          margin-bottom: 15px; }
        .app .app_container .app_screen .screen_container .profile_container .edit_profile-pic {
          width: 80px;
          height: 80px;
          border-radius: 50%;
          background-size: cover !important;
          position: absolute;
          left: 0px;
          top: 50%;
          transform: translateY(-50%);
          margin: 0;
          cursor: pointer;
          z-index: 1; }
          @media (max-width: 991px) {
            .app .app_container .app_screen .screen_container .profile_container .edit_profile-pic {
              max-width: 128px; } }
          .app .app_container .app_screen .screen_container .profile_container .edit_profile-pic #input_avatar {
            position: absolute;
            width: 0;
            height: 0;
            opacity: 0;
            visibility: hidden; }
          .app .app_container .app_screen .screen_container .profile_container .edit_profile-pic .profile_pic {
            width: 100%;
            padding-top: 100%;
            border-radius: 50%;
            display: block;
            background-size: cover !important;
            border: 1px solid rgba(0, 0, 0, 0.25); }
          .app .app_container .app_screen .screen_container .profile_container .edit_profile-pic .edit_container {
            border-radius: 18px;
            background: #24C667;
            color: #fff;
            font-family: 'Open Sans', arial, sans-serif;
            font-weight: 500;
            font-size: 12px;
            position: absolute;
            bottom: -20px;
            left: 50%;
            transform: translateX(-50%);
            padding: 0 10px;
            transition: .3s; }
          .app .app_container .app_screen .screen_container .profile_container .edit_profile-pic.class_pic {
            max-width: 200px; }
            .app .app_container .app_screen .screen_container .profile_container .edit_profile-pic.class_pic .profile_pic {
              border-radius: 10px; }
          .app .app_container .app_screen .screen_container .profile_container .edit_profile-pic:hover .edit_container {
            background: #1c994f; }
        .app .app_container .app_screen .screen_container .profile_container .checkbox-group {
          margin: 0;
          margin-bottom: 20px; }
          .app .app_container .app_screen .screen_container .profile_container .checkbox-group label {
            position: relative;
            cursor: pointer;
            font-size: 16px;
            line-height: 160%;
            color: #000;
            opacity: 1;
            font-weight: normal;
            padding-left: 40px;
            font-family: 'Open Sans', arial, sans-serif; }
            .app .app_container .app_screen .screen_container .profile_container .checkbox-group label a {
              color: #000;
              transition: .3s; }
              .app .app_container .app_screen .screen_container .profile_container .checkbox-group label a:hover, .app .app_container .app_screen .screen_container .profile_container .checkbox-group label a:active, .app .app_container .app_screen .screen_container .profile_container .checkbox-group label a:hover {
                color: #24C667;
                text-decoration: none; }
            .app .app_container .app_screen .screen_container .profile_container .checkbox-group label:before {
              content: '';
              -webkit-appearance: none;
              background-color: #F6F6F6;
              width: 28px;
              height: 28px;
              display: inline-block;
              position: absolute;
              vertical-align: middle;
              cursor: pointer;
              border-radius: 10px;
              top: 0;
              left: 0;
              transition: .3s; }
            .app .app_container .app_screen .screen_container .profile_container .checkbox-group label:after {
              content: "";
              display: inline-block;
              width: 17px;
              height: 10px;
              background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="17" height="10" viewBox="0 0 17 10" fill="none"><path d="M15.8658 1.98754L8.89686 8.70502L8.89833 8.70355C8.18658 9.4153 7.25278 9.77117 6.31163 9.77117C5.37048 9.77117 4.42638 9.41236 3.70875 8.69473L0.376486 5.60069C0.0794344 5.32423 0.063259 4.85806 0.339723 4.56101C0.616186 4.26396 1.08235 4.24778 1.3794 4.52277L4.72932 7.63593C5.60724 8.51385 7.0072 8.51385 7.86747 7.65505L14.8467 0.928747C15.1394 0.646401 15.604 0.658166 15.8864 0.947864C16.1673 1.2405 16.1584 1.70667 15.8658 1.98754Z" fill="white"/></svg>') no-repeat center;
              background-size: contain;
              opacity: 0;
              visibility: hidden;
              transition: .3s;
              top: 9px;
              left: 6px;
              position: absolute; }
          .app .app_container .app_screen .screen_container .profile_container .checkbox-group .checkbox_input {
            padding: 0;
            height: initial;
            width: initial;
            margin-bottom: 0;
            display: none;
            cursor: pointer; }
            .app .app_container .app_screen .screen_container .profile_container .checkbox-group .checkbox_input:checked + label:before {
              background: #24C667; }
            .app .app_container .app_screen .screen_container .profile_container .checkbox-group .checkbox_input:checked + label:after {
              opacity: 1;
              visibility: visible; }
        .app .app_container .app_screen .screen_container .profile_container .app_btn {
          width: 100%;
          display: block; }
          @media (max-width: 476px) {
            .app .app_container .app_screen .screen_container .profile_container .app_btn {
              padding: 0 15px; } }
        .app .app_container .app_screen .screen_container .profile_container .summary_details {
          padding: 17px 0;
          margin-top: 10px;
          font-size: 0; }
          .app .app_container .app_screen .screen_container .profile_container .summary_details:after {
            content: '';
            display: block;
            clear: both; }
          .app .app_container .app_screen .screen_container .profile_container .summary_details > div {
            border-right: 1px solid #D9D9D9;
            padding-top: 10px;
            padding-bottom: 10px; }
            @media (max-width: 1199px) {
              .app .app_container .app_screen .screen_container .profile_container .summary_details > div {
                border-right: none;
                border-bottom: 1px solid #D9D9D9; } }
            .app .app_container .app_screen .screen_container .profile_container .summary_details > div:last-child {
              border-right: none;
              border-bottom: none; }
          .app .app_container .app_screen .screen_container .profile_container .summary_details .first_box-details {
            width: 46%;
            display: inline-block;
            vertical-align: middle; }
            @media (max-width: 1199px) {
              .app .app_container .app_screen .screen_container .profile_container .summary_details .first_box-details {
                width: 100%;
                padding-left: 0;
                padding-right: 0; } }
          .app .app_container .app_screen .screen_container .profile_container .summary_details .sec_box-details, .app .app_container .app_screen .screen_container .profile_container .summary_details .third_box-details {
            width: 27%;
            display: inline-block;
            vertical-align: middle;
            padding-left: 20px;
            padding-right: 20px; }
            @media (max-width: 1199px) {
              .app .app_container .app_screen .screen_container .profile_container .summary_details .sec_box-details, .app .app_container .app_screen .screen_container .profile_container .summary_details .third_box-details {
                width: 100%;
                padding-left: 0;
                padding-right: 0; } }
          .app .app_container .app_screen .screen_container .profile_container .summary_details .first_box-details {
            padding-right: 20px; }
          .app .app_container .app_screen .screen_container .profile_container .summary_details .quiz_statuses {
            padding: 0;
            margin: 0;
            list-style: none;
            margin-top: 8px; }
            .app .app_container .app_screen .screen_container .profile_container .summary_details .quiz_statuses .status_item {
              background: #898A8E;
              display: inline-block;
              border-radius: 100px;
              color: #fff;
              padding: 0 10px;
              font-family: 'Open Sans', arial, sans-serif;
              font-weight: 500;
              line-height: 24px;
              font-size: 14px;
              cursor: default;
              margin-right: 7px;
              margin-bottom: 7px;
              white-space: nowrap; }
              .app .app_container .app_screen .screen_container .profile_container .summary_details .quiz_statuses .status_item.started {
                background: #FFC800;
                color: #346A4D; }
              .app .app_container .app_screen .screen_container .profile_container .summary_details .quiz_statuses .status_item.waiting_report {
                background: #1EA757; }
              .app .app_container .app_screen .screen_container .profile_container .summary_details .quiz_statuses .status_item.finished_report {
                background: #346A4D; }
              .app .app_container .app_screen .screen_container .profile_container .summary_details .quiz_statuses .status_item:last-child {
                margin-right: 0; }
          .app .app_container .app_screen .screen_container .profile_container .summary_details .quiz_date {
            font-size: 18px;
            font-family: 'Open Sans', arial, sans-serif;
            font-weight: 400;
            color: #000;
            display: block;
            margin-top: 8px;
            margin-bottom: 7px;
            line-height: 28px; }
            @media (max-width: 1199px) {
              .app .app_container .app_screen .screen_container .profile_container .summary_details .quiz_date {
                margin-bottom: 0; } }
        .app .app_container .app_screen .screen_container .profile_container.user_details-container .user_details {
          margin-bottom: 0; }
        .app .app_container .app_screen .screen_container .profile_container.user_details-container .btns_container .app_btn:last-child {
          margin-top: 10px; }
    .app .app_container .app_screen .app_popup {
      position: absolute;
      z-index: 1;
      left: 50%;
      top: 50%;
      transform: translateX(-50%) translateY(-50%);
      width: 730px;
      overflow: hidden;
      border: 1px solid rgba(0, 0, 0, 0.15);
      border-radius: 18px;
      background: #fff;
      text-align: center; }
      @media (max-width: 1199px) {
        .app .app_container .app_screen .app_popup {
          width: 100%;
          position: static;
          margin-top: 50px;
          margin-bottom: 50px;
          transform: none; } }
      @media (max-width: 991px) {
        .app .app_container .app_screen .app_popup {
          margin: 0; } }
      .app .app_container .app_screen .app_popup .popup_body {
        padding: 40px 50px 40px; }
        @media (max-width: 767px) {
          .app .app_container .app_screen .app_popup .popup_body {
            padding: 15px; } }
        .app .app_container .app_screen .app_popup .popup_body .popup_icon {
          display: inline-block;
          margin-bottom: 30px; }
        .app .app_container .app_screen .app_popup .popup_body .popup_title {
          display: block;
          padding: 0;
          margin: 0;
          margin-top: 7px;
          font-size: 32px;
          line-height: 36px;
          font-family: 'Bebas Neue', arial, sans-serif;
          font-weight: normal;
          color: #000;
          text-transform: uppercase; }
        .app .app_container .app_screen .app_popup .popup_body .popup_text {
          display: block;
          margin: 0;
          margin-top: 15px;
          font-size: 16px;
          line-height: 22px;
          font-family: 'Open Sans', arial, sans-serif;
          font-weight: normal;
          color: #363636; }
        .app .app_container .app_screen .app_popup .popup_body .app_btn {
          margin-top: 30px; }
          @media (max-width: 476px) {
            .app .app_container .app_screen .app_popup .popup_body .app_btn {
              padding: 0 15px; } }
          @media (max-width: 390px) {
            .app .app_container .app_screen .app_popup .popup_body .app_btn {
              font-size: 16px; } }
      .app .app_container .app_screen .app_popup.quiz_success-popup {
        background: #FDFDFD; }
    .app .app_container .app_screen .app_notice {
      background: #FFC800;
      border-radius: 15px;
      padding: 15px;
      padding-left: 50px;
      position: relative; }
      .app .app_container .app_screen .app_notice .notice_icon {
        position: absolute;
        top: 50%;
        left: 15px;
        transform: translateY(-50%); }
      .app .app_container .app_screen .app_notice .notice_text {
        display: block;
        font-weight: 500;
        color: #000;
        font-size: 16px; }
    .app .app_container .app_screen .quiz_title {
      margin-top: 40px;
      position: relative; }
      .app .app_container .app_screen .quiz_title.has_back-btn {
        padding-left: 60px; }
        .app .app_container .app_screen .quiz_title.has_back-btn .back_btn {
          top: 50%;
          left: 0;
          transform: translateY(-50%); }
      .app .app_container .app_screen .quiz_title h2 {
        margin: 0;
        font-size: 26px; }
        @media (max-width: 476px) {
          .app .app_container .app_screen .quiz_title h2 {
            font-size: 22px; } }
      .app .app_container .app_screen .quiz_title .btns_container {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%); }
        @media (max-width: 1500px) {
          .app .app_container .app_screen .quiz_title .btns_container {
            position: static;
            transform: none;
            margin-top: 15px; } }
        .app .app_container .app_screen .quiz_title .btns_container .app_btn {
          margin-right: 5px;
          padding: 0 20px; }
          @media (max-width: 767px) {
            .app .app_container .app_screen .quiz_title .btns_container .app_btn {
              display: block;
              width: 100%;
              padding: 0 15px; } }
          .app .app_container .app_screen .quiz_title .btns_container .app_btn:last-child {
            margin-right: 0; }
            @media (max-width: 767px) {
              .app .app_container .app_screen .quiz_title .btns_container .app_btn:last-child {
                margin-top: 10px; } }
        .app .app_container .app_screen .quiz_title .btns_container .btn_type1, .app .app_container .app_screen .quiz_title .btns_container .btn_type2 {
          line-height: 46px; }
    .app .app_container .app_screen .quiz_listing {
      margin-top: 30px; }
      .app .app_container .app_screen .quiz_listing:after {
        content: '';
        display: block;
        clear: both; }
      .app .app_container .app_screen .quiz_listing .quiz_box {
        padding: 0 10px;
        float: left;
        width: 25%;
        margin-bottom: 30px; }
        @media (max-width: 1500px) {
          .app .app_container .app_screen .quiz_listing .quiz_box {
            width: 33.333333%; } }
        @media (max-width: 1199px) {
          .app .app_container .app_screen .quiz_listing .quiz_box {
            width: 50%; } }
        @media (max-width: 991px) {
          .app .app_container .app_screen .quiz_listing .quiz_box {
            width: 33.333333%; } }
        @media (max-width: 767px) {
          .app .app_container .app_screen .quiz_listing .quiz_box {
            width: 50%; } }
        @media (max-width: 476px) {
          .app .app_container .app_screen .quiz_listing .quiz_box {
            width: 100%; } }
        .app .app_container .app_screen .quiz_listing .quiz_box .quiz_thumbnail {
          background: #346A4D;
          position: relative;
          border-radius: 15px;
          height: 210px;
          transition: .3s; }
          .app .app_container .app_screen .quiz_listing .quiz_box .quiz_thumbnail .quiz_icon {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translateX(-50%) translateY(-50%) scale(1);
            transition: .3s; }
          .app .app_container .app_screen .quiz_listing .quiz_box .quiz_thumbnail .quiz_progress {
            background: #24C667;
            border-radius: 25px;
            color: #fff;
            font-size: 18px;
            font-weight: 500;
            position: absolute;
            right: 10px;
            top: 10px;
            padding: 0 10px;
            min-width: 60px;
            text-align: center;
            transition: .3s; }
        .app .app_container .app_screen .quiz_listing .quiz_box .quiz_title {
          font-size: 18px;
          font-weight: 500;
          margin-top: 10px; }
        .app .app_container .app_screen .quiz_listing .quiz_box a {
          color: #000;
          transition: .3s; }
          .app .app_container .app_screen .quiz_listing .quiz_box a:hover, .app .app_container .app_screen .quiz_listing .quiz_box a:focus, .app .app_container .app_screen .quiz_listing .quiz_box a:active {
            color: #24C667;
            text-decoration: none; }
            .app .app_container .app_screen .quiz_listing .quiz_box a:hover .quiz_thumbnail, .app .app_container .app_screen .quiz_listing .quiz_box a:focus .quiz_thumbnail, .app .app_container .app_screen .quiz_listing .quiz_box a:active .quiz_thumbnail {
              background: #24C667; }
              .app .app_container .app_screen .quiz_listing .quiz_box a:hover .quiz_thumbnail .quiz_icon, .app .app_container .app_screen .quiz_listing .quiz_box a:focus .quiz_thumbnail .quiz_icon, .app .app_container .app_screen .quiz_listing .quiz_box a:active .quiz_thumbnail .quiz_icon {
                transform: translateX(-50%) translateY(-50%) scale(1.1); }
              .app .app_container .app_screen .quiz_listing .quiz_box a:hover .quiz_thumbnail .quiz_progress, .app .app_container .app_screen .quiz_listing .quiz_box a:focus .quiz_thumbnail .quiz_progress, .app .app_container .app_screen .quiz_listing .quiz_box a:active .quiz_thumbnail .quiz_progress {
                background: #346A4D; }
        .app .app_container .app_screen .quiz_listing .quiz_box.quiz_locked .quiz_thumbnail {
          background: #E8E8E8; }
          .app .app_container .app_screen .quiz_listing .quiz_box.quiz_locked .quiz_thumbnail .quiz_progress {
            background: #616161; }
    .app .app_container .app_screen .screen_header {
      margin-bottom: 30px;
      position: relative; }
      .app .app_container .app_screen .screen_header.header_with-back {
        padding-left: 60px; }
        .app .app_container .app_screen .screen_header.header_with-back .back_btn {
          background: #fff;
          width: 36px;
          height: 36px;
          border-radius: 50%;
          position: absolute;
          left: 0;
          top: 50%;
          transform: translateY(-50%);
          transition: .3s; }
          .app .app_container .app_screen .screen_header.header_with-back .back_btn svg {
            width: 17px;
            position: absolute;
            left: 48%;
            top: 50%;
            transform: translateX(-50%) translateY(-50%); }
            .app .app_container .app_screen .screen_header.header_with-back .back_btn svg path {
              fill: #000;
              transition: .3s; }
          .app .app_container .app_screen .screen_header.header_with-back .back_btn:hover {
            background: #A22DFF; }
            .app .app_container .app_screen .screen_header.header_with-back .back_btn:hover svg path {
              fill: #fff; }
      .app .app_container .app_screen .screen_header:after {
        content: '';
        display: block;
        clear: both; }
      .app .app_container .app_screen .screen_header .screen_title {
        margin: 0;
        font-size: 42px;
        line-height: 50px;
        font-weight: normal;
        color: #000;
        float: left; }
      .app .app_container .app_screen .screen_header .add_btn {
        float: right;
        width: 50px;
        height: 50px;
        background: #A22DFF;
        border-radius: 50%;
        position: relative;
        transition: .3s; }
        .app .app_container .app_screen .screen_header .add_btn svg {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translateX(-50%) translateY(-50%);
          width: 20px;
          height: auto; }
          .app .app_container .app_screen .screen_header .add_btn svg path {
            fill: #fff;
            transition: .3s; }
        .app .app_container .app_screen .screen_header .add_btn:hover {
          background: #00FED0; }
          .app .app_container .app_screen .screen_header .add_btn:hover svg path {
            fill: #111; }
    .app .app_container .app_screen .c6 {
      width: 50%;
      float: left;
      padding: 0 6px 12px; }
    .app .app_container .app_screen .c12 {
      width: 100%;
      float: left; }
    .app .app_container .app_screen .no_padd-left {
      padding-left: 0; }
    .app .app_container .app_screen .no_padd-right {
      padding-right: 0; }
    .app .app_container .app_screen .no_padd-top {
      padding-top: 0; }
    .app .app_container .app_screen .no_padd-bottom {
      padding-bottom: 0; }
    .app .app_container .app_screen .pagination_space {
      padding-bottom: 30px; }
      .app .app_container .app_screen .pagination_space .dt-paging {
        bottom: -30px; }
    .app .app_container .app_screen .app_section {
      background: #fff;
      border-radius: 23px;
      padding: 30px;
      margin-bottom: 12px; }
      .app .app_container .app_screen .app_section:last-child {
        margin-bottom: 0; }
      .app .app_container .app_screen .app_section .section_header {
        margin-bottom: 25px; }
        .app .app_container .app_screen .app_section .section_header .section_title {
          font-size: 24px;
          line-height: 34px;
          color: #000;
          margin: 0;
          font-weight: normal;
          float: left; }
        .app .app_container .app_screen .app_section .section_header .search-container {
          float: right;
          width: 200px; }
          .app .app_container .app_screen .app_section .section_header .search-container .table_search {
            width: 100%;
            border-radius: 9px;
            background: #F5F5F5;
            line-height: 34px;
            border: none;
            color: #000000;
            padding: 0 10px;
            font-size: 16px; }
        .app .app_container .app_screen .app_section .section_header:after {
          content: '';
          display: block;
          clear: both; }
      .app .app_container .app_screen .app_section .info_no_container {
        font-weight: 500;
        color: #242331;
        font-size: 42px; }
      .app .app_container .app_screen .app_section.stats_section {
        background-image: url("../img/stats-bg.jpg");
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover; }
        .app .app_container .app_screen .app_section.stats_section .section_header .section_title {
          color: #fff; }
        .app .app_container .app_screen .app_section.stats_section .stats_container:after {
          content: '';
          display: block;
          clear: both; }
        .app .app_container .app_screen .app_section.stats_section .stats_container .stats_graph {
          float: left;
          width: 50%; }
          .app .app_container .app_screen .app_section.stats_section .stats_container .stats_graph .graph_container {
            border-radius: 10px;
            height: 200px;
            position: relative;
            overflow: hidden;
            background-repeat: no-repeat;
            background-position: center center;
            background-size: cover; }
            .app .app_container .app_screen .app_section.stats_section .stats_container .stats_graph .graph_container .box_filler {
              position: absolute;
              bottom: 0;
              left: 0;
              right: 0; }
              .app .app_container .app_screen .app_section.stats_section .stats_container .stats_graph .graph_container .box_filler .stats_percentage {
                color: #fff;
                font-size: 24px;
                font-weight: 500;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translateX(-50%) translateY(-50%); }
          .app .app_container .app_screen .app_section.stats_section .stats_container .stats_graph.stats_graph1 {
            padding-right: 6px; }
            .app .app_container .app_screen .app_section.stats_section .stats_container .stats_graph.stats_graph1 .graph_container {
              background-image: url("../img/spatii-ocupate-bg.png"); }
              .app .app_container .app_screen .app_section.stats_section .stats_container .stats_graph.stats_graph1 .graph_container .box_filler {
                background: #A22DFF; }
          .app .app_container .app_screen .app_section.stats_section .stats_container .stats_graph.stats_graph2 {
            padding-left: 6px; }
            .app .app_container .app_screen .app_section.stats_section .stats_container .stats_graph.stats_graph2 .graph_container {
              background-image: url("../img/campanii-aprobate-bg.png"); }
              .app .app_container .app_screen .app_section.stats_section .stats_container .stats_graph.stats_graph2 .graph_container .box_filler {
                background: #D9D9D9; }
        .app .app_container .app_screen .app_section.stats_section .graphs_legend {
          margin-top: 50px; }
          .app .app_container .app_screen .app_section.stats_section .graphs_legend .legend_list {
            margin: 0;
            padding: 0;
            list-style: none;
            font-size: 0; }
            .app .app_container .app_screen .app_section.stats_section .graphs_legend .legend_list .legend_item {
              display: inline-block;
              vertical-align: middle;
              color: #fff;
              font-size: 16px;
              margin-left: 30px;
              padding-left: 40px;
              position: relative; }
              .app .app_container .app_screen .app_section.stats_section .graphs_legend .legend_list .legend_item:first-child {
                margin-left: 0; }
              .app .app_container .app_screen .app_section.stats_section .graphs_legend .legend_list .legend_item .legend_color {
                width: 27px;
                height: 11px;
                position: absolute;
                background: #A52EFF;
                border-radius: 14px;
                top: 50%;
                left: 0;
                transform: translateY(-50%); }
              .app .app_container .app_screen .app_section.stats_section .graphs_legend .legend_list .legend_item:nth-child(2) .legend_color {
                background: #D9D9D9; }

.multiple_choice_scored_option .select2-container {
  position: absolute;
  left: 12px;
  top: 12px;
  width: 43px !important;
  height: 27px !important; }

.multiple_choice_scored_option .select2-container .selection {
  width: 43px; }

.multiple_choice_scored_option .select2-container .selection .select2-selection {
  background: transparent !important;
  border: 1px solid rgba(0, 0, 0, 0.25) !important;
  line-height: 27px !important;
  height: 27px !important;
  width: 43px !important;
  padding: 0 14px 0 8px !important;
  text-align: center;
  border-radius: 5px !important; }

.multiple_choice_scored_option .select2-container .selection .select2-selection .select2-selection__rendered {
  line-height: 24px !important;
  font-size: 18px !important;
  font-family: 'Open Sans', arial, sans-serif;
  padding-bottom: 3px !important; }

.multiple_choice_scored_option .select2-container--default .select2-selection--single .select2-selection__arrow {
  right: 0px;
  top: 1px; }

.multiple_choice_scored_option .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-width: 4px 3px 0 3px; }

.multiple_choice_scored_option .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-width: 0 3px 4px 3px; }

.multiple_choice_scored_option .select2-container--open .select2-dropdown {
  width: 80px !important;
  text-align: center;
  border-radius: 5px; }

.multiple_choice_scored_option .select2-results__option {
  padding: 0 8px;
  border-radius: 5px; }

#notifications_table_wrapper {
  height: 450px; }

#campaigns_table_wrapper {
  height: 700px; }

table.dataTable thead th {
  font-weight: normal;
  font-size: 18px;
  color: #A4A4A6; }
  @media (max-width: 1500px) {
    table.dataTable thead th {
      font-size: 14px; } }
table.dataTable thead .dt-column-order:before, table.dataTable thead .dt-column-order:after {
  opacity: 0.3 !important;
  color: #24C667; }
table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:before, table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:before {
  color: #24C667;
  opacity: 1 !important; }
table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:after, table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:after {
  color: #24C667;
  opacity: 1 !important; }
table.dataTable > thead > tr > th, table.dataTable > thead > tr > td {
  border-bottom: 1px solid rgba(0, 0, 0, 0.09); }
  table.dataTable > thead > tr > th:hover, table.dataTable > thead > tr > td:hover {
    outline: none !important; }
table.dataTable > tbody > tr > th, table.dataTable > tbody > tr > td {
  border-top: 1px solid rgba(0, 0, 0, 0.09);
  font-size: 16px;
  color: #000;
  font-weight: 300; }
  table.dataTable > tbody > tr > th:first-child, table.dataTable > tbody > tr > td:first-child {
    font-weight: 400; }
  table.dataTable > tbody > tr > th .n_status-border, table.dataTable > tbody > tr > th .c_status-border, table.dataTable > tbody > tr > td .n_status-border, table.dataTable > tbody > tr > td .c_status-border {
    background: transparent;
    display: inline-block;
    vertical-align: middle;
    width: auto;
    border-radius: 9px;
    color: #fff;
    font-weight: 400;
    padding: 0 10px;
    line-height: 28px; }
    table.dataTable > tbody > tr > th .n_status-border.status_owner-approved, table.dataTable > tbody > tr > th .c_status-border.status_owner-approved, table.dataTable > tbody > tr > td .n_status-border.status_owner-approved, table.dataTable > tbody > tr > td .c_status-border.status_owner-approved {
      background: #18BA3D; }
    table.dataTable > tbody > tr > th .n_status-border.status_user-request, table.dataTable > tbody > tr > th .c_status-border.status_user-request, table.dataTable > tbody > tr > td .n_status-border.status_user-request, table.dataTable > tbody > tr > td .c_status-border.status_user-request {
      background: #6488FF; }
    table.dataTable > tbody > tr > th .n_status-border.status_feedback, table.dataTable > tbody > tr > th .c_status-border.status_feedback, table.dataTable > tbody > tr > td .n_status-border.status_feedback, table.dataTable > tbody > tr > td .c_status-border.status_feedback {
      background: #1E90FF; }
    table.dataTable > tbody > tr > th .n_status-border.status_rejected, table.dataTable > tbody > tr > th .c_status-border.status_rejected, table.dataTable > tbody > tr > td .n_status-border.status_rejected, table.dataTable > tbody > tr > td .c_status-border.status_rejected {
      background: #F62C22; }
    table.dataTable > tbody > tr > th .n_status-border.status_pending-reseller, table.dataTable > tbody > tr > th .c_status-border.status_pending-reseller, table.dataTable > tbody > tr > td .n_status-border.status_pending-reseller, table.dataTable > tbody > tr > td .c_status-border.status_pending-reseller {
      background: #A22DFF; }
    table.dataTable > tbody > tr > th .n_status-border.status_pending-owner, table.dataTable > tbody > tr > th .c_status-border.status_pending-owner, table.dataTable > tbody > tr > td .n_status-border.status_pending-owner, table.dataTable > tbody > tr > td .c_status-border.status_pending-owner {
      background: #A22DFF; }
    table.dataTable > tbody > tr > th .n_status-border.status_running, table.dataTable > tbody > tr > th .c_status-border.status_running, table.dataTable > tbody > tr > td .n_status-border.status_running, table.dataTable > tbody > tr > td .c_status-border.status_running {
      background: #18BA3D; }
    table.dataTable > tbody > tr > th .n_status-border.status_ending-soon, table.dataTable > tbody > tr > th .c_status-border.status_ending-soon, table.dataTable > tbody > tr > td .n_status-border.status_ending-soon, table.dataTable > tbody > tr > td .c_status-border.status_ending-soon {
      background: #01D5D9; }
    table.dataTable > tbody > tr > th .n_status-border.status_starting-soon, table.dataTable > tbody > tr > th .c_status-border.status_starting-soon, table.dataTable > tbody > tr > td .n_status-border.status_starting-soon, table.dataTable > tbody > tr > td .c_status-border.status_starting-soon {
      background: #FF733C; }
  table.dataTable > tbody > tr > th > .right_arrow, table.dataTable > tbody > tr > td > .right_arrow {
    display: block;
    border: none;
    width: 33px;
    height: 33px;
    border-radius: 50%;
    background: #F5F5F5;
    transition: .3s;
    position: relative;
    padding: 0; }
    table.dataTable > tbody > tr > th > .right_arrow svg, table.dataTable > tbody > tr > td > .right_arrow svg {
      width: 9px;
      position: absolute;
      top: 50%;
      left: 52%;
      transform: translateX(-50%) translateY(-50%); }
      table.dataTable > tbody > tr > th > .right_arrow svg path, table.dataTable > tbody > tr > td > .right_arrow svg path {
        transition: .3s;
        fill: #A22DFF; }
    table.dataTable > tbody > tr > th > .right_arrow:hover, table.dataTable > tbody > tr > td > .right_arrow:hover {
      background: #A22DFF; }
      table.dataTable > tbody > tr > th > .right_arrow:hover svg path, table.dataTable > tbody > tr > td > .right_arrow:hover svg path {
        fill: #F5F5F5; }
  table.dataTable > tbody > tr > th .form_checkbox, table.dataTable > tbody > tr > td .form_checkbox {
    margin: 0; }
    table.dataTable > tbody > tr > th .form_checkbox label, table.dataTable > tbody > tr > td .form_checkbox label {
      position: relative;
      cursor: pointer;
      font-size: 13px;
      line-height: 160%;
      color: #121315;
      opacity: 1;
      font-weight: normal; }
      table.dataTable > tbody > tr > th .form_checkbox label:before, table.dataTable > tbody > tr > td .form_checkbox label:before {
        content: '';
        -webkit-appearance: none;
        background-color: transparent;
        border: 1px solid rgba(0, 0, 0, 0.4);
        width: 15px;
        height: 15px;
        display: inline-block;
        position: relative;
        vertical-align: middle;
        cursor: pointer;
        border-radius: 3px;
        top: -1px; }
    table.dataTable > tbody > tr > th .form_checkbox .checkbox_input, table.dataTable > tbody > tr > td .form_checkbox .checkbox_input {
      padding: 0;
      height: initial;
      width: initial;
      margin-bottom: 0;
      display: none;
      cursor: pointer; }
      table.dataTable > tbody > tr > th .form_checkbox .checkbox_input:checked + label:before, table.dataTable > tbody > tr > td .form_checkbox .checkbox_input:checked + label:before {
        border: 1px solid #A22DFF;
        background: #A22DFF; }
      table.dataTable > tbody > tr > th .form_checkbox .checkbox_input:checked + label:after, table.dataTable > tbody > tr > td .form_checkbox .checkbox_input:checked + label:after {
        content: '';
        display: block;
        position: absolute;
        top: 6px;
        left: 5px;
        width: 5px;
        height: 8px;
        border: solid #fff;
        border-width: 0 2px 2px 0;
        transform: rotate(45deg); }
  table.dataTable > tbody > tr > th .item_type, table.dataTable > tbody > tr > td .item_type {
    background: #130945;
    border-radius: 8px;
    width: 39px;
    height: 39px;
    position: relative;
    font-size: 0;
    /*&:after {
    	content:'';
    	width: 7px;
    	height: 7px;
    	border-radius: 50%;
    	background:#FF0004;
    	display: block;
    	position: absolute;
    	bottom: 4px;
    	right: 4px;
    }
    &.available {
    	&:after {
    		background:#03D100;
    	}
    }
    &.unavailable {
    	&:after {
    		background:#FF0004;
    	}
    }*/ }
    table.dataTable > tbody > tr > th .item_type svg, table.dataTable > tbody > tr > td .item_type svg {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translateX(-50%) translateY(-50%);
      width: 13px;
      height: auto; }
      table.dataTable > tbody > tr > th .item_type svg path, table.dataTable > tbody > tr > td .item_type svg path {
        fill: #fff; }
table.dataTable > tbody > tr:last-child > * {
  border-bottom: none !important; }
table#inventory_table > tbody > tr > th:first-child, table#inventory_table > tbody > tr > td:first-child {
  font-weight: 300; }
table#inventory_table > tbody > tr > th:nth-child(3), table#inventory_table > tbody > tr > td:nth-child(3) {
  font-weight: 400; }

.table_container {
  margin-top: 30px; }

.dt-column-title {
  font-family: 'Open Sans', arial, sans-serif;
  font-weight: 500;
  color: #000;
  font-size: 16px; }

table.dataTable {
  border-collapse: separate;
  border-spacing: 0 8px;
  display: none; }

@media (max-width: 991px) {
  table.dataTable {
    overflow-x: scroll;
    padding-bottom: 30px; } }
table.dataTable > thead > tr > th, table.dataTable > thead > tr > td {
  border-bottom: none;
  padding: 5px 17px; }

table.dataTable > tbody > tr > th, table.dataTable > tbody > tr > td {
  border-top: none;
  background: #F9F9F9;
  font-family: 'Open Sans', arial, sans-serif;
  font-weight: normal;
  color: #000;
  font-size: 16px;
  padding: 17px 17px;
  transition: .3s;
  cursor: pointer; }
  @media (max-width: 1500px) {
    table.dataTable > tbody > tr > th, table.dataTable > tbody > tr > td {
      font-size: 14px; } }

table.dataTable > tbody > tr:hover > td {
  background: #f5f2f2; }

table.dataTable > tbody > tr > th:first-child, table.dataTable > tbody > tr > td:first-child {
  border-top-left-radius: 15px;
  border-bottom-left-radius: 15px; }

table.dataTable > tbody > tr > th:last-child, table.dataTable > tbody > tr > td:last-child {
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px; }

table.dataTable > thead > tr > th:last-child, table.dataTable > tbody > tr > td:last-child {
  width: 1%;
  white-space: nowrap; }

#quizes_table .view_btn {
  background: #1EA757;
  border-radius: 18px;
  font-family: 'Open Sans', arial, sans-serif;
  font-weight: 500;
  color: #fff;
  padding: 10px 30px;
  transition: .3s; }

#quizes_table .view_btn:hover,
#quizes_table .view_btn:focus,
#quizes_table .view_btn:active {
  text-decoration: none;
  background: #1c994f; }

#utilizatori_table .status_label {
  background: #898A8E;
  display: inline-block;
  border-radius: 100px;
  color: #fff;
  padding: 0 10px;
  font-family: 'Open Sans', arial, sans-serif;
  font-weight: 500;
  line-height: 28px;
  font-size: 16px;
  white-space: nowrap; }
  @media (max-width: 1500px) {
    #utilizatori_table .status_label {
      font-size: 14px;
      line-height: 24px; } }
  #utilizatori_table .status_label.started {
    background: #FFC800;
    color: #346A4D; }
  #utilizatori_table .status_label.waiting_report {
    background: #1EA757; }
  #utilizatori_table .status_label.finished_report {
    background: #346A4D; }

table.dataTable#questions_table > thead > tr > th:first-child,
table.dataTable#questions_table > tbody > tr > td:first-child {
  width: 1%;
  white-space: nowrap; }

.row_no-container {
  background: #24C667;
  height: 34px;
  width: 34px;
  border-radius: 50%;
  position: relative;
  display: block;
  transition: .3s;
  font-family: 'Open Sans', arial, sans-serif;
  font-weight: 500;
  color: #fff;
  font-size: 14px; }
  .row_no-container .row_no {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%); }
  .row_no-container:hover, .row_no-container:focus, .row_no-container:active {
    background: #1c994f; }

.action_btns .icon_btn {
  background: #24C667;
  height: 34px;
  width: 34px;
  border-radius: 50%;
  position: relative;
  display: block;
  transition: .3s; }
  .action_btns .icon_btn svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%); }
  .action_btns .icon_btn:hover, .action_btns .icon_btn:focus, .action_btns .icon_btn:active {
    background: #1c994f; }

.dt-paging {
  text-align: center;
  position: static;
  margin-top: 30px; }
  @media (max-width: 767px) {
    .dt-paging {
      margin-bottom: 30px; } }

@media (max-width: 1500px) {
  div.dt-container#utilizatori_table_wrapper {
    overflow-x: scroll; } }
@media (max-width: 767px) {
  div.dt-container {
    overflow-x: scroll; } }
div.dt-container .dt-paging .dt-paging-button {
  font-size: 18px;
  line-height: 30px;
  border-radius: 9px;
  color: #000 !important;
  padding: 0 10px;
  margin: 0 2px;
  border: none !important;
  background: transparent !important;
  transition: .3s; }
  div.dt-container .dt-paging .dt-paging-button:hover {
    color: #fff !important;
    background: #24C667 !important; }
  div.dt-container .dt-paging .dt-paging-button.current {
    color: #fff !important;
    background: #24C667 !important;
    cursor: default; }
    div.dt-container .dt-paging .dt-paging-button.current:hover {
      border: none;
      color: #fff !important; }
  div.dt-container .dt-paging .dt-paging-button.disabled {
    background: transparent !important; }
    div.dt-container .dt-paging .dt-paging-button.disabled:hover, div.dt-container .dt-paging .dt-paging-button.disabled:active {
      background: transparent !important; }

.chestionare_template .select2-dropdown {
  min-width: 63px !important; }
  .chestionare_template .select2-dropdown .select2-results__option {
    text-align: center;
    line-height: 20px;
    padding: 6px 8px;
    border-radius: 8px; }

.quill_editor .ql-editor {
  min-height: 200px; }

.ql-toolbar.ql-snow,
.ql-container.ql-snow {
  background: #F0F0F0; }

.ql-toolbar.ql-snow {
  border-top-left-radius: 18px;
  border-top-right-radius: 18px; }

.ql-container.ql-snow {
  border-bottom-left-radius: 18px;
  border-bottom-right-radius: 18px; }

.statistics_container {
  padding: 40px; }
  @media (max-width: 1500px) {
    .statistics_container {
      padding: 40px 0px; } }
  .statistics_container .statistics_row {
    padding-bottom: 50px; }
    .statistics_container .statistics_row:last-child {
      padding-bottom: 0; }
  .statistics_container .total_no {
    font-family: 'Open Sans', arial, sans-serif;
    font-weight: 500; }
  .statistics_container .kpi-list {
    list-style: none;
    padding: 0;
    margin: 0; }
    .statistics_container .kpi-list li {
      border-bottom: 1px solid #B9B9B9;
      padding: 25px 100px 25px 0;
      position: relative; }
      .statistics_container .kpi-list li .kpi_text {
        display: block;
        font-size: 18px; }
      .statistics_container .kpi-list li .pill {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        background: #24C667;
        padding: 10px;
        border-radius: 18px;
        color: #fff;
        text-align: center;
        min-width: 70px;
        font-weight: 600; }
  .statistics_container .detail_name {
    font-family: 'Open Sans', arial, sans-serif;
    color: #000;
    font-weight: 500;
    font-size: 18px;
    display: block; }
  .statistics_container .summary_statistics .statistics_graphs {
    margin-top: 20px; }
    .statistics_container .summary_statistics .statistics_graphs:after {
      content: '';
      display: block;
      clear: both; }
    .statistics_container .summary_statistics .statistics_graphs .graph_col {
      width: 22%;
      float: left; }
      @media (max-width: 1199px) {
        .statistics_container .summary_statistics .statistics_graphs .graph_col {
          width: 46%;
          padding: 30px; } }
      @media (max-width: 500px) {
        .statistics_container .summary_statistics .statistics_graphs .graph_col {
          width: 100%;
          padding: 15px; } }
      .statistics_container .summary_statistics .statistics_graphs .graph_col .rounded-progress-bar {
        width: 100%;
        display: block;
        position: relative;
        text-align: center;
        vertical-align: top; }
        .statistics_container .summary_statistics .statistics_graphs .graph_col .rounded-progress-bar .graph_stats {
          position: absolute;
          top: 50%;
          left: 0;
          right: 0;
          transform: translateY(-50%);
          width: 100%;
          padding: 0 25px;
          text-align: center;
          font-family: 'Open Sans', arial, sans-serif;
          font-size: 22px;
          font-weight: 500; }
      .statistics_container .summary_statistics .statistics_graphs .graph_col .graph_title {
        text-align: center;
        display: block;
        font-family: 'Open Sans', arial, sans-serif;
        color: #000;
        font-weight: 500;
        font-size: 18px;
        display: block;
        margin-top: 10px; }
    .statistics_container .summary_statistics .statistics_graphs .graph_spacer {
      width: 4%;
      float: left;
      height: 1px; }

.regular_page-wrapper {
  background: #F4F4F4; }

.regular_page-header {
  padding: 15px 15px 0; }
  .regular_page-header .header_container {
    background-image: url("../img/bg-header-regular-page.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    text-align: center;
    padding: 15px;
    border-radius: 25px; }
    .regular_page-header .header_container .logo {
      display: inline-block;
      max-width: 200px;
      width: 100%; }

.regular_content {
  padding: 40px 0; }
  .regular_content a {
    color: #000;
    transition: .3s; }
    .regular_content a:hover, .regular_content a:focus, .regular_content a:active {
      text-decoration: none;
      color: #24C667; }

.regular_page_copy {
  color: #000;
  opacity: .7;
  font-size: 12px;
  text-align: center;
  padding: 0 0 10px; }

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