@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome-animation/0.1.0/font-awesome-animation.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css);
/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/*
-------------------------------------------------------------------------
    Ngager Framework
-------------------------------------------------------------------------
*/
@font-face {
  font-family: 'ngager';
  src: url(/d2af7769128cecc9aa0c733a95353b01.eot);
  src: url(/d2af7769128cecc9aa0c733a95353b01.eot#iefix) format('embedded-opentype'), url(/b8567e7bdae5d17d5dc4c458aef14ad5.woff) format('woff'), url(/a93347b6eedd6f1858c4dd4c1242d815.ttf) format('truetype'), url(/450e7b8816d579c1156c470c1153f133.svg#ngager) format('svg');
  font-weight: normal;
  font-style: normal;
}
.ngager-font {
  font-family: 'ngager';
  font-style: normal;
  font-weight: normal;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.ngager-font.ngager-user-cog:before {
  content: "\e91d";
}
.ngager-font.ngager-report:before {
  content: "\e91c";
}
.ngager-font.ngager-sms:before {
  content: "\e91b";
}
.ngager-font.ngager-tv-retro:before {
  content: "\e91a";
}
.ngager-font.ngager-stream:before {
  content: "\e919";
}
.ngager-font.ngager-photo-video:before {
  content: "\e918";
}
.ngager-font.ngager-trash:before {
  content: "\e917";
}
.ngager-font.ngager-users:before {
  content: "\e916";
}
.ngager-font.ngager-edit:before {
  content: "\e915";
}
.ngager-font.ngager-clone:before {
  content: "\e914";
}
.ngager-font.ngager-sitemap:before {
  content: "\e913";
}
.ngager-font.ngager-logo:before {
  content: '\e911';
}
.ngager-font.ngager-expand-alt:before {
  content: '\e910';
}
.ngager-font.ngager-compress:before {
  content: '\e90f';
}
.ngager-font.ngager-expand:before {
  content: '\e90e';
}
.ngager-font.ngager-expand-wide:before {
  content: '\e90d';
}
.ngager-font.ngager-compress-wide:before {
  content: '\e90c';
}
.ngager-font.ngager-file:before {
  content: '\e90b';
}
.ngager-font.ngager-file-audio:before {
  content: '\e90a';
}
.ngager-font.ngager-file-pdf:before {
  content: '\e909';
}
.ngager-font.ngager-file-video:before {
  content: '\e908';
}
.ngager-font.ngager-share:before {
  content: '\e907';
}
.ngager-font.ngager-marker:before {
  content: '\e906';
}
.ngager-font.ngager-comment-edit:before {
  content: '\e905';
}
.ngager-font.ngager-statistics-refresh:before {
  content: '\e904';
}
.ngager-font.ngager-performance-me {
  color: #8fb1f2;
  font-size: 160px;
}
.ngager-font.ngager-performance-me::before {
  content: '\e902';
}
.ngager-font.ngager-performance-team {
  color: #8fb1f2;
  font-size: 160px;
}
.ngager-font.ngager-performance-team::before {
  content: '\e903';
}
.ngager-font.ngager-performance-add {
  color: #8fb1f2;
  font-size: 160px;
}
.ngager-font.ngager-performance-add::before {
  content: '\e912';
}
.ngager-font.behavioral-statistics-analytics::before {
  content: '\e800';
}
.ngager-font.content-distribution-action-learning::before {
  content: '\e804';
}
.ngager-font.ngager-leaderboard-outline::before {
  content: '\e817';
}
.ngager-font.leaderboard-outline::before {
  content: '\e808';
}
.ngager-font.functionalities-outline::before {
  content: '\e80c';
}
.ngager-font.badges-outline::before {
  content: '\e810';
}
.ngager-font.ticket-task-management::before {
  content: '\e801';
}
.ngager-font.pulse-polls-reflections::before {
  content: '\e805';
}
.ngager-font.leaderboard-fill::before {
  content: '\e809';
}
.ngager-font.functionalities-fill::before {
  content: '\e80d';
}
.ngager-font.badges-fill::before {
  content: '\e811';
}
.ngager-font.information-focus::before {
  content: '\e802';
}
.ngager-font.quiz-quests::before {
  content: '\e806';
}
.ngager-font.users-outline::before {
  content: '\e80a';
}
.ngager-font.assets-outline::before {
  content: '\e80e';
}
.ngager-font.social-collaboration-interaction::before {
  content: '\e803';
}
.ngager-font.feedback::before {
  content: '\e807';
}
.ngager-font.users-fill::before {
  content: '\e80b';
}
.ngager-font.ngager-functionalities-outline::before {
  content: '\e80c';
}
.ngager-font.assets-fill::before {
  content: '\e80f';
}
.ngager-font.files-outline::before {
  content: '\e812';
}
.ngager-font.files-fill::before {
  content: '\e813';
}
.ngager-font.challenges::before {
  content: '\e814';
}
.ngager-font.chat::before {
  content: '\e815';
}
.ngager-font.feed::before {
  content: '\e816';
}
.ngager-font.leaderboard::before {
  content: '\e817';
}
.ngager-font.training::before {
  content: '\e818';
}
.ngager-font.onboard-fill::before {
  content: "\e819";
}
.ngager-font.story-outline::before {
  content: '\e81a';
}
.ngager-font.ngager-story-outline::before {
  content: '\e81a';
}
.ngager-font.story-fill::before {
  content: '\e81b';
}
.ngager-font.onboard-outline::before {
  content: "\e81c";
}
.ngager-font.pulse-fill::before {
  content: '\e820';
}
.ngager-font.pulse-outline::before {
  content: '\e821';
}
.ngager-font.segments-outline::before {
  content: "\e83a";
}
.ngager-font.segments-fill::before {
  content: "\e83b";
}
.ngager-font.xp::before {
  content: '\e83c';
}
.ngager-font.icon-todo {
  color: #8fb1f2;
  font-size: 123px;
}
.ngager-font.icon-todo::before {
  content: '\e900';
}
.ngager-font.icon-flag {
  color: #c0fac5;
  font-size: 123px;
}
.ngager-font.icon-flag::before {
  content: '\e901';
}
.ngager-input label {
  color: #5a74a9 !important;
  font-size: 14px !important;
}
.ngager-input.disabled > div > div > div:nth-child(2) {
  color: #b5c4e2 !important;
  font-size: 14px !important;
}
.ngager-input.disabled hr {
  border-bottom: dashed 1px #d1ddf5 !important;
}
.ngager-input.cta > button {
  background-color: #9acf61 !important;
}
.ngager-input.cta > button span {
  text-transform: capitalize !important;
}
.ngager-icon-button {
  border: 1px solid #ddd;
  border-radius: 5px;
  cursor: pointer;
}
.ngager-icon-button:hover {
  box-shadow: 0px 0px 10px #bbb;
}
.ngager-icon-button.disabled {
  cursor: not-allowed;
  opacity: 0.7;
}
.ngager-tabs > div:first-child button {
  font-weight: 100 !important;
  text-transform: none !important;
  font-size: 18px !important;
}
.ngager-tabs > div:nth-child(2) > div {
  background-color: #9acf61 !important;
  margin-top: 0 !important;
}
.ngager-tabs > div:last-child {
  padding: 20px;
}
.ngager-tabs .tab::before {
  height: 20px;
  display: block;
  position: absolute;
  width: 100%;
}
.no-results p {
  color: #36425A;
  margin-top: 20px;
  font-weight: 100;
  text-align: center;
  font-size: 16px;
}
.resource-picker {
  width: 100%;
}
/* flex containers and 2 columns structure */
.ngager-flexbox-container {
  display: flex;
}
.ngager-flexbox-container .ngager-half {
  display: flex;
  width: 100%;
}
.ngager-flexbox-container .ngager-half:first-child {
  margin-right: 30px;
}
.ngager-flexbox-container .ngager-half:last-child {
  margin-right: 0;
}
.ngager-flexbox-container .ngager-form-element p {
  margin-bottom: 5px;
}
.ngager-flexbox-container .ngager-form-element input {
  width: 100%;
  box-sizing: border-box;
  height: 40px;
  border: 1px solid #bed2f9;
  background: none;
  border-radius: 2px;
  padding-left: 10px;
}
.ngager-flexbox-container .ngager-form-element input:focus {
  outline: none;
}
.ngager-flexbox-container .center-container {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* table */
.ngager-table-row {
  transition-property: all;
  transition-duration: 0.2s;
}
.ngager-table-row .ngager-table-controls-container {
  display: none;
}
.ngager-table-row .ngager-table-controls-container i {
  width: 32px;
  height: 32px;
  border-radius: 50px;
  text-align: center;
  color: #5186ed;
  font-size: 18px;
  line-height: 32px;
  cursor: pointer;
  color: #36425A;
  transition-property: all;
  transition-duration: 0.2s;
}
.ngager-table-row .ngager-table-controls-container i:hover {
  color: #f0f4fc;
  background-color: #36425A;
}
.ngager-table-row:hover {
  background-color: #e3eaf7;
}
.ngager-table-row:hover .ngager-table-controls-container {
  display: inline-block;
}
/* cards view */
.cards-container {
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;
}
.cards-container > div {
  display: inline-block;
}
.cards-container .card-container-header {
  display: flex;
  align-self: flex-start;
  align-items: center;
  width: 100%;
  border-bottom: 1px solid #e2eafa;
  height: 30px;
  padding-top: 15px;
}
.cards-container .card-container-header .header-right {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  width: 100%;
  position: relative;
  margin-right: 15px;
}
.cards-container .card-container-header .header-right > i,
.cards-container .card-container-header .header-right a {
  font-size: 20px;
  color: #3e4b64;
  cursor: pointer;
}
.cards-container .card-container-header .header-right > i:not(:nth-child(1)),
.cards-container .card-container-header .header-right a:not(:nth-child(1)) {
  margin-left: 15px;
}
.cards-container .card-container-header .header-right > a {
  margin-left: 15px;
}
.cards-container .card-container-header .header-right .search-text {
  position: absolute !important;
  top: -20px;
  right: 30px;
}
.cards-container .card {
  background-color: white;
  border-radius: 8px;
  transition-property: all;
  transition-duration: 0.15s;
  width: 210px;
  height: 310px;
  display: inline-block;
  text-align: center;
  overflow: hidden;
  cursor: pointer;
  margin: 20px;
  position: relative;
}
.cards-container .card.chapter {
  height: 228px;
  width: 185px;
}
.cards-container .card.chapter .active-chapter {
  position: absolute;
  top: 5px;
  right: 5px;
  font-size: 20px;
  color: lightblue;
}
.cards-container .card.create {
  color: #a2b4db;
  background-color: #f0f4fc;
  border: 12px solid #a2b4db;
  box-sizing: border-box;
}
.cards-container .card.create i {
  font-size: 110px;
  margin-top: 50px;
}
.cards-container .card.create p {
  font-size: 18px;
  font-weight: 300;
}
.cards-container .card:hover {
  transform: scale(1.02);
  animation: pulsingCardShadow 1s infinite alternate;
}
.cards-container .card:active {
  transform: none;
}
.cards-container .card .card-content {
  padding: 0 20px;
}
.cards-container .card .card-content .title {
  font-size: 16px;
  font-weight: bold;
  margin-top: 15px;
  color: #fff;
}
.cards-container .card .card-content .subTitle {
  margin-top: 10px;
  font-size: 12px;
  color: #fff;
}
.cards-container .card .card-content .icon {
  width: 50px;
  height: 50px;
  vertical-align: middle;
  font-size: 24px;
  border-radius: 100px;
  color: white;
  margin: -23px auto auto auto;
  position: relative;
}
.cards-container .card .card-content .icon .avatar {
  width: 50px;
  height: 50px;
  border-radius: 100px;
  background-color: #ffffff;
  color: #778091;
}
.cards-container .card .card-content .icon .avatar .fa-user {
  font-size: 1.2em;
  line-height: 50px;
}
.cards-container .card.with-bottom-icon .card-bottom-command {
  position: absolute;
  width: 100%;
  font-size: 18px;
  bottom: -35px;
  left: 0;
  transition-duration: 0.2s;
  transition-property: bottom;
}
.cards-container .card.with-bottom-icon:hover .card-bottom-command {
  bottom: 25px;
}
.cards-container .card.with-bottom-icon:hover .card-bottom-command span {
  display: inline-block;
  width: 32px;
  height: 32px;
  padding-top: 6px;
  box-sizing: border-box;
  border-radius: 100px;
  transition-duration: 0.2s;
  transition-property: background-color;
}
.cards-container .card.with-bottom-icon:hover .card-bottom-command span:hover {
  background-color: #36425A;
  color: #f0f4fc;
}
.cards-container .card > header {
  height: 112px;
  overflow: hidden;
  position: relative;
}
.cards-container .card > header > img {
  width: 100%;
  min-height: 100%;
}
.cards-container .card .primary-header {
  color: #6c81af;
  font-size: 16px;
  font-weight: 600;
  margin-top: 12px;
  margin-bottom: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}
.cards-container .card .secondary-header {
  font-weight: 400;
  font-size: 12px;
  color: #a0accc;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 5px;
  width: 100%;
}
.cards-container .card .third-header {
  color: #aba9a9;
  margin-top: 5px;
}
.cards-container .card .description {
  margin-bottom: 5px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.cards-container .card .metadata {
  color: #aba9a9;
  position: absolute;
  bottom: 15px;
}
.cards-container .header {
  display: flex;
  width: 100%;
}
.application .cards-container .card {
  background-color: #36425A;
}
.ngager-wizard {
  flex-grow: 1;
  flex-direction: column;
}
.ngager-wizard > .content {
  flex-grow: 1;
}
.ngager-wizard > .content > div {
  flex-basis: 50%;
  overflow: auto;
}
.ngager-wizard > .content.chapter-list-container {
  flex-basis: 100%;
}
.ngager-wizard > .content.chapter-list-container .chapter-list {
  flex-basis: 65% !important;
}
.ngager-wizard > .content.chapter-list-container .chapter-preview {
  flex-basis: 35% !important;
  padding-top: 20px;
  background-color: #e6edfc;
  overflow-y: auto;
}
.ngager-wizard > .content.chapter-list-container .chapter-preview .live-background {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.ngager-wizard > .content.chapter-list-container .chapter-preview .live-background .title {
  font-size: 20px;
  font-weight: bold;
  color: #dbe6fa;
  text-align: center;
  text-transform: uppercase;
}
.ngager-wizard > .content.chapter-list-container .chapter-preview .live-background .mouse-pointer {
  color: #dbe6fa;
  font-size: 40px;
  position: absolute;
  left: 50%;
  margin-top: 35px;
}
.ngager-wizard > .content.chapter-list-container .chapter-preview .live-simulation.active {
  border: 1px solid #36425A;
}
.ngager-wizard > .content.chapter-list-container .chapter-preview .live-simulation.active .title {
  color: #36425A;
  z-index: 9999;
}
.ngager-wizard > .content.chapter-list-container .chapter-preview .live-simulation.active .mouse-pointer {
  color: #36425A;
  z-index: 9999;
}
.ngager-wizard > .content .form {
  box-sizing: border-box;
  padding-top: 12px;
  padding-bottom: 12px;
  position: relative;
}
.ngager-wizard > .content .preview {
  background-color: #e6edfc;
}
.ngager-wizard > .content .preview .live-simulation-container {
  width: 320px;
  height: 644px;
  margin: auto;
  position: relative;
}
.ngager-wizard > .content .preview .live-simulation-container > img {
  position: absolute;
}
.ngager-wizard > .content .preview .live-simulation-container .live-simulation {
  position: absolute;
  bottom: 71px;
  top: 72px;
  left: 17px;
  right: 18px;
  overflow: auto;
  padding-bottom: 60px;
}
.ngager-wizard > .content .preview .live-simulation-container .live-simulation::-webkit-scrollbar {
  width: 8px;
}
.ngager-wizard > .content .preview .live-simulation-container .live-simulation:hover::-webkit-scrollbar {
  background: #d2def5;
}
.ngager-wizard > .content .preview .live-simulation-container .live-simulation:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.ngager-wizard > .wizard-breadcrumbs {
  height: 100px;
}
.ngager-wizard > .wizard-breadcrumbs > hr {
  height: 1px;
  border: none;
  background-color: #d9e4f9;
}
.ngager-wizard > .wizard-breadcrumbs .navigation-button-container {
  display: flex;
  align-items: center;
  width: 50px;
}
.ngager-wizard > .wizard-breadcrumbs .navigation-button {
  padding: 0;
  display: flex;
  align-items: center;
  font-size: 20px;
  cursor: pointer;
  color: #36425A;
  background: transparent;
  width: 50px;
}
.ngager-wizard > .wizard-breadcrumbs .steps {
  margin-top: 30px;
  flex-grow: 1;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step {
  background-color: #dbe6fa;
  color: #799adc;
  height: 40px;
  line-height: 40px;
  margin-right: 3px;
  position: relative;
  box-sizing: border-box;
  padding-left: 30px;
  width: 140px;
  cursor: auto;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step:hover,
.ngager-wizard > .wizard-breadcrumbs .steps .step:focus {
  outline: none;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step.current,
.ngager-wizard > .wizard-breadcrumbs .steps .step.completed {
  background-color: #36425A;
  color: #f0f4fc;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step.current::after,
.ngager-wizard > .wizard-breadcrumbs .steps .step.completed::after {
  border-left-color: #36425A;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step::after {
  content: '';
  display: block;
  position: absolute;
  right: -20px;
  z-index: 1;
  top: 0;
  border-top: 20px solid transparent;
  border-left: 20px solid #dbe6fa;
  border-bottom: 20px solid transparent;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step::before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  z-index: 1;
  top: 0;
  border-top: 20px solid transparent;
  border-left: 20px solid #f0f4fc;
  border-bottom: 20px solid transparent;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step:nth-child(1) {
  z-index: 50;
  padding-left: 20px;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step:nth-child(1)::before {
  display: none;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step:nth-child(2) {
  z-index: 40;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step:nth-child(3) {
  z-index: 30;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step:nth-child(4) {
  z-index: 20;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step:nth-child(5) {
  z-index: 10;
}
.ngager-wizard > .wizard-breadcrumbs .steps .step i {
  font-size: 22px;
  margin-top: 7px;
  float: right;
  margin-right: 6px;
}
.ngager-wizard > .wizard-breadcrumbs nav {
  margin-top: 20px;
}
.ngager-wizard > .wizard-breadcrumbs nav > div:first-child {
  text-align: right;
  font-size: 16px;
  font-weight: 100;
  color: #abb8d1;
}
.ngager-wizard > .wizard-breadcrumbs nav > div:last-child a {
  cursor: pointer;
  color: #36425A;
  text-transform: uppercase;
  font-weight: 600;
}
.ngager-wizard > .wizard-breadcrumbs nav > div:last-child a:last-child {
  margin-left: 50px;
}
.ngager-wizard > .wizard-breadcrumbs nav > div:last-child a:focus,
.ngager-wizard > .wizard-breadcrumbs nav > div:last-child a:hover {
  outline: none;
}
.resource-picker .avatar > div {
  background-color: #cbd8f3 !important;
}
.resource-picker hr {
  border: none;
  height: 1px;
  background-color: #bcd2f9;
  margin-left: 60px;
}
.ngager-filter {
  position: relative;
  height: 50px;
}
.ngager-filter i {
  position: absolute;
  top: 18px;
  font-size: 16px;
  color: #d4d9ea;
}
.ngager-filter i.fa-times-circle {
  right: 0;
  top: 30px;
  cursor: pointer;
  color: #9fb3d9;
  opacity: 0;
  pointer-events: none;
  transition-property: all;
  transition-duration: 0.3s;
}
.ngager-filter i.fa-times-circle.visible {
  opacity: 1;
  top: 20px;
  pointer-events: all;
}
.ngager-filter i.fa-times-circle:focus {
  outline: none;
}
.ngager-filter > div input {
  padding-left: 20px !important;
  padding-right: 20px !important;
  font-size: 14px !important;
}
.ngager-filter > div > div:first-child {
  margin-left: 20px;
  font-size: 14px;
  font-style: italic;
  letter-spacing: 0.3px;
  bottom: 10px !important;
}
.spinner {
  width: 100%;
  text-align: center;
}
header .logo-icon {
  position: relative;
}
header .logo-icon .logo-tooltip {
  opacity: 0;
  position: absolute;
  background: #e8edf7;
  padding: 10px;
  left: -1000px;
  border-radius: 5px;
  top: 60px;
  width: 300px;
  transition: opacity 0.5s;
}
header .logo-icon:hover .logo-tooltip {
  opacity: 1;
  left: 20px;
}
/*
-------------------------------------------------------------------------
    Ngager Resets
-------------------------------------------------------------------------
*/
* {
  margin: 0px;
  padding: 0px;
  outline: none;
}
*::-webkit-scrollbar {
  height: 8px;
  width: 10px;
}
*::-webkit-scrollbar:hover {
  background-color: #c9d6f3;
}
*::-webkit-scrollbar {
  background: #d2def5;
}
*::-webkit-scrollbar-thumb {
  background: #96AAD6;
}
*::-webkit-scrollbar-thumb:hover {
  background-color: #8399c5;
}
q:before,
q:after {
  content: '';
}
a:link,
a:visited,
a:hover,
a:active {
  color: #778091;
}
/* remove borders around imagese insied lins in IE10*/
a img {
  border: none;
}
button {
  border: none;
  font-family: "Helvetica Neue", Helvetica, "open sans", verdana;
  padding: 10px;
}
html {
  height: 100% !important;
}
/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus input:-webkit-autofill,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: 1px solid #fff;
  -webkit-text-fill-color: #fff;
  -webkit-box-shadow: 0 0 0px 1000px transparent inset;
  -webkit-transition: background-color 5000s ease-in-out 0s;
  transition: background-color 5000s ease-in-out 0s;
}
body {
  /* Global Styles ------------------------------------------------------------------------- */
  font-family: "Helvetica Neue", Helvetica, "open sans", verdana;
  font-size: 14px;
  background-color: #f0f4fc;
  color: #778091;
}
body a:link {
  text-decoration: none;
}
body h1,
body h2,
body h3,
body h4,
body h5,
body h6 {
  color: #36425A;
}
input,
textarea {
  font-family: "Helvetica Neue", Helvetica, "open sans", verdana;
  font-size: 14px;
}
h2 {
  font-size: 16px;
  font-weight: 600;
}
.display-inline {
  display: inline;
}
.clickable {
  cursor: pointer;
}
.animated {
  transition-duration: 0.3s !important;
}
/*
-------------------------------------------------------------------------
    Key Frames
-------------------------------------------------------------------------
*/
@keyframes pulsingCardShadow {
  from {
    box-shadow: none;
  }
  to {
    box-shadow: 0 0 30px 1px rgba(0, 0, 50, 0.2);
  }
}
@keyframes blinkingLoading {
  from {
    box-shadow: none;
  }
  to {
    background-position: 200% center;
  }
}
.playground {
  flex-grow: 1;
  height: 100%;
  overflow: none;
  overflow-y: overlay;
  background-color: #e8ecf5;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
  position: relative;
}
.playground > div {
  width: 100%;
}
.playground .closeActiveGame {
  position: absolute;
  right: 10px;
  top: 10px;
  outline: none;
  color: white;
  cursor: pointer;
  z-index: 9;
  opacity: 0.8;
}
.playground .gameHeaderContainer {
  height: 90px;
}
.playground .gameHeaderContainer > div > div {
  background-color: transparent !important;
}
.playground .gameHeaderContainer > div > div img {
  display: none;
}
.playground .game-name {
  display: none;
}
.playground .buttonsContainer {
  text-align: center;
  margin-top: 100px;
  margin-bottom: 50px;
}
.playground .buttonsContainer > button {
  margin-left: 10px;
  margin-right: 10px;
}
.playground .game-icon-wrapper {
  position: relative;
}
.playground .game-icon-wrapper .game-background {
  width: 100%;
  height: 90;
  background-color: #36425A;
  opacity: 0.8;
}
.playground .game-icon-wrapper .gameIconContainer {
  width: 80px;
  height: 80px;
  border-radius: 100px;
  position: absolute;
  z-index: 99;
  background-color: #ffffff;
  left: calc(50% - 40px);
  top: 40px;
  text-align: center;
  border: 2px solid #ffffff;
}
.playground .game-icon-wrapper .gameIconContainer i {
  line-height: 80px;
  color: #ffffff;
  font-size: 32px;
}
.playground .game-icon-wrapper .gameIconContainer.noBackgroundColor i {
  color: #222;
}
.playground .gridContainer {
  margin: auto;
  width: auto;
  margin-top: 60px;
  position: relative;
  font-size: 1.2em;
}
.playground .gridContainer > div > div:nth-child(2) {
  left: 0;
  font-size: 18px;
  font-weight: 100;
  color: #737373;
  position: absolute;
  width: 100%;
}
.playground .gridContainer > div > div:last-child {
  top: 60px;
}
.playground .textAndButtonContainer {
  text-align: center;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 90px;
}
.cards-container {
  flex-grow: 1;
  text-align: center;
}
.cards-container > div {
  outline: none;
  display: inline-block;
}
.cards-container .card.disabled {
  cursor: no-drop;
}
.cards-container .card header .file-icon-container {
  display: flex;
  height: 100%;
  background-color: #222;
  opacity: 0.9;
}
.cards-container .card header .file-icon-container .fa {
  margin: auto;
  color: #fff;
  font-size: 40;
}
.cards-container .card .card-indicator {
  width: 0;
  height: 0;
  border-left: 40px solid transparent;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}
.cards-container .card .card-indicator i {
  position: absolute;
  top: -37px;
  left: -20px;
  font-size: 16px;
  color: #f0f4fc;
}
.cards-container .card .card-indicator.active {
  border-top: 40px solid #9acf61;
  z-index: 9999;
}
.cards-container .card .card-indicator.active i {
  color: #f0f4fc;
}
.cards-container .card .card-indicator.inactive {
  border-top: 40px solid #f55e53;
}
.cards-container .card .card-indicator.inactive i {
  left: -17px;
  color: #f0f4fc;
}
.cards-container .card .card-indicator.not-started {
  border-top: 30px solid #dadada;
}
.cards-container .card .card-indicator.in-progress {
  border-top: 30px solid #ffa500;
}
.cards-container .card .card-indicator.completed {
  border-top: 30px solid #9acf61;
}
.cards-container .card .card-indicator.new {
  border-top: 30px solid #9acf61;
}
.cards-container .card .card-indicator.disabled {
  border-top: 40px solid;
}
.cards-container .card .card-indicator.disabled i {
  left: -17px;
  color: #f0f4fc;
}
.cards-container .card .card-content .icon {
  width: 50px;
  height: 50px;
  vertical-align: middle;
  font-size: 24px;
  border-radius: 100px;
  color: white;
  margin: -23px auto auto auto;
  position: relative;
}
.cards-container .card .card-content i {
  line-height: 50px;
}
.cards-container .card .card-content .title {
  color: #667daf;
}
.error-message {
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  font-size: 1rem;
}
.error-message > i {
  color: brown;
  margin: auto;
}
.error-message > i::before {
  padding-right: 5px;
}
i.consumed {
  border: 4px solid #f5f5f5;
  background-color: #dadada;
  height: 22px;
  border-radius: 100px;
  color: white;
  width: 22px;
  line-height: 22px;
  font-size: 10px;
  margin: auto;
  background-color: #9acf61;
  border: 4px solid #e2f9ca;
  text-align: center;
}
.leftColumnContainer {
  margin-right: 30px;
  width: 300px;
  background-color: #e9ecf6;
}
.leftColumnContainer .itemList {
  overflow: auto;
  height: 100% !important;
}
.leftColumnContainer .itemList::-webkit-scrollbar {
  width: 8px;
}
.leftColumnContainer .itemList:hover::-webkit-scrollbar {
  background: #d2def5;
}
.leftColumnContainer .itemList:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.leftColumnContainer .itemList .item {
  position: relative;
  color: white;
  height: 120px;
  overflow: hidden;
  background-color: #36425A;
  margin-bottom: 1px;
  min-width: 290px;
  cursor: pointer;
  outline: none;
}
.leftColumnContainer .itemList .item.locked {
  cursor: not-allowed;
}
.leftColumnContainer .itemList .item > div:first-child {
  position: absolute;
  text-align: center;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  display: flex;
}
.leftColumnContainer .itemList .item > div:first-child div {
  padding-left: 20px;
  padding-right: 20px;
  margin: auto;
}
.leftColumnContainer .itemList .item > div:first-child .icon i {
  font-size: 26px;
  position: relative;
  z-index: 1;
}
.leftColumnContainer .itemList .item > div:first-child p {
  position: relative;
  z-index: 1;
  font-size: 16px;
  text-transform: capitalize;
}
.leftColumnContainer .itemList .item:not(:last-child) {
  margin-bottom: 1px;
}
.leftColumnContainer .itemList .item img {
  width: 100%;
}
.leftColumnContainer .itemList .item .selected {
  position: absolute;
  top: 6px;
  right: 5px;
  text-align: center;
  z-index: 10;
}
.leftColumnContainer .itemList .item .selected i {
  background-color: #dadada;
  height: 22px;
  border-radius: 100px;
  color: white;
  width: 22px;
  line-height: 22px;
  font-size: 10px;
  margin: auto;
  background-color: #9acf61;
  border: 2px solid #e2f9ca;
}
.leftColumnContainer .itemList .item .lock-icon {
  position: absolute;
  top: 6px;
  right: 5px;
  text-align: center;
  z-index: 10;
}
.leftColumnContainer .itemList .item .lock-icon i {
  background-color: #dadada;
  height: 22px;
  color: #f55e53;
  width: 22px;
  line-height: 22px;
  font-size: 30px;
  margin: auto;
  background-color: transparent;
}
.leftColumnContainer .itemList .item .view-intro-icon {
  position: absolute;
  top: 4px;
  left: 5px;
  text-align: center;
  z-index: 10;
  cursor: pointer;
}
.leftColumnContainer .itemList .item .view-intro-icon i {
  font-size: 25px;
  margin: auto;
  background-color: transparent;
}
.leftColumnContainer .itemList .item .itemOverlay {
  position: absolute;
  text-align: center;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  background-color: #fff;
  opacity: 0.6;
}
.leftColumnContainer .itemList .item .itemDimmer {
  position: absolute;
  text-align: center;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  background-color: #222;
  opacity: 0.5;
}
.leftColumnContainer .itemList .item .itemContent {
  position: absolute;
  text-align: center;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  display: flex;
  cursor: pointer;
  z-index: 1;
}
.leftColumnContainer .itemList .item .itemContent .title {
  margin: auto;
  font-size: 20px;
}
.block-ui-container {
  text-align: center;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 99;
  width: 100%;
  height: 100%;
  height: -webkit-fill-available;
  display: flex;
  background-color: #f0f4fc99;
  cursor: progress;
}
.block-ui-container > div {
  margin: auto;
}
@keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
.live-stream-icon {
  display: flex;
  cursor: pointer;
  justify-content: center;
  align-items: center;
}
.live-stream-icon > span {
  font-size: 14px;
  font-weight: bold;
  color: #888;
  padding-left: 5px;
}
.live-stream-icon > span.running {
  color: #222;
  animation: blink-animation 2s steps(3, start) infinite;
  -webkit-animation: blink-animation 2s steps(3, start) infinite;
}
.ngager-dialog .header {
  background-color: #36425a;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-height: 30;
  padding-top: 10;
  padding-bottom: 50;
}
.ngager-dialog .header .icon-container {
  width: 80;
  height: 80;
  border-radius: 80px;
  background-color: #ffffff;
  align-self: center;
  position: absolute;
  bottom: -40;
  display: flex;
}
.ngager-dialog .header .icon-container .fa,
.ngager-dialog .header .icon-container .ngager-font {
  font-size: 35;
  margin: auto;
  color: #36425a;
}
.ngager-dialog .header.title .fa {
  font-size: 40;
  margin: auto;
  color: #36425a;
}
.ngager-dialog .header.title .fa-times {
  position: absolute;
  right: 5;
  top: 5;
  color: #ffffff;
  font-size: 25;
  -webkit-text-stroke-width: 3px;
  -webkit-text-stroke-color: #36425a;
  cursor: pointer;
}
.ngager-dialog .header.title span {
  color: #fff;
  font-size: 1.5em;
  width: 90%;
  text-align: center;
}
.ngager-dialog .dialog-title {
  background-color: #36425a;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 80;
  padding-top: 0 !important;
}
.ngager-dialog .dialog-title > span {
  color: #fff;
}
.ngager-dialog .dialog-title .icon-container {
  width: 80;
  height: 80;
  border-radius: 80px;
  background-color: #ffffff;
  align-self: center;
  position: absolute;
  bottom: -40;
  display: flex;
}
.ngager-dialog .dialog-title .icon-container .fa,
.ngager-dialog .dialog-title .icon-container .ngager-font {
  font-size: 30;
  margin: auto;
  color: #36425a;
}
.ngager-dialog .dialog-title.title .fa {
  font-size: 40;
  margin: auto;
  color: #36425a;
}
.ngager-dialog .dialog-title.title span {
  color: #fff;
}
.ngager-dialog .title {
  position: relative;
  display: flex;
  align-items: center;
  background-color: #36425a;
}
.ngager-dialog .title > span {
  color: #fff;
}
.ngager-dialog .title i.close-icon {
  font-size: 25;
  color: #fff;
  position: absolute;
  right: 5;
  top: 5;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #36425a;
  cursor: pointer;
}
.page-not-found {
  display: flex;
  flex: 1;
  height: 100%;
}
.page-not-found > div {
  margin: auto;
  text-align: center;
}
.page-not-found > div > p {
  margin-top: 20;
  font-size: 1.2em;
  font-weight: 100;
  opacity: 0.8;
  color: #6c81af;
}
.page-not-found > div > p.text {
  font-size: 1em;
  opacity: 1;
  font-weight: bold;
}
.page-not-found > div > p.description {
  font-size: 1em;
  opacity: 0.7;
  margin-top: 10;
}
.ngager-avatar {
  margin: 0;
}
.awesome-image {
  background-color: #a2a2a2;
  text-align: center;
  width: 100%;
  overflow: hidden;
  height: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 400;
  justify-content: center;
}
.awesome-image.loading img.image {
  margin: auto;
}
.awesome-image.loading div.progress {
  position: absolute;
  display: flex;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 3;
}
.awesome-image.loading div.progress > div {
  margin: auto;
}
.awesome-image img.image {
  margin: auto;
  width: auto;
  height: auto;
  opacity: 0;
  max-height: 100%;
  position: absolute;
  left: 0;
  right: 0;
}
.awesome-image img.image.display {
  opacity: 1;
  max-width: 100%;
}
.ngager-list {
  display: flex;
  flex: 1;
  flex-direction: column;
}
.ngager-list.users-list .item > div {
  min-height: 50;
}
.ngager-list.users-list .item > div .avatar-container {
  width: 60;
  min-width: 60;
}
.ngager-list.users-list .item > div .text-content {
  min-height: auto;
  padding-left: 0;
}
.ngager-list.users-list .item > div .text-content .description {
  text-overflow: ellipsis;
  overflow: hidden;
}
.ngager-list .item {
  padding: 10;
  cursor: pointer;
}
.ngager-list .item > div {
  display: flex;
  min-height: 90;
}
.ngager-list .item.active,
.ngager-list .item:hover {
  background-color: #cedbf466;
}
.ngager-list .item.disabled {
  cursor: no-drop;
  opacity: 0.5;
}
.ngager-list .item.selected {
  background-color: #36425A;
}
.ngager-list .item.selected .text-content {
  color: #d8e0f2;
}
.ngager-list .item .image-content {
  display: flex;
  flex-direction: column;
  width: 70;
  min-width: 70;
  justify-content: center;
  align-items: center;
  position: relative;
}
.ngager-list .item .image-content > span {
  text-align: center;
  margin-top: 5;
}
.ngager-list .item .image-content .image {
  background-color: #d8e0f2;
  width: 60;
  height: 60;
  border-radius: 60px;
  display: flex;
  background-size: cover;
}
.ngager-list .item .image-content .image i.user-icon {
  margin: auto;
  font-size: 40;
}
.ngager-list .item .text-content {
  color: #6c81af;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 10;
  min-height: 80;
  flex: 1;
}
.ngager-list .item .text-content .title {
  font-size: 15;
  font-weight: bold;
}
.ngager-list .item .text-content .description {
  font-size: 14;
  opacity: 0.7;
  margin-top: 5;
}
.ngager-list .item .text-content .text {
  font-size: 13;
  opacity: 0.7;
  margin-top: 5;
}
.ngager-list .item .text-content .text > span {
  margin-right: 20;
}
.ngager-list .item .indicators {
  display: flex;
  flex: 0;
  justify-content: center;
  align-items: center;
}
.ngager-list .item .actions {
  display: flex;
  flex: 0;
  justify-content: center;
  align-items: center;
}
.ngager-list .item .actions .fa {
  font-size: 25;
  cursor: pointer;
  margin: 5;
}
.ngager-list .item .actions .fa.remove {
  color: #d11a2a;
}
.ngager-list .item .actions .fa.add {
  font-size: 20;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #f0f4fc;
}
.ellipsis-text {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
}
.ngager-video-player {
  width: 100%;
  height: 100%;
  display: flex;
  background-color: #222;
  position: relative;
}
.ngager-video-player .play-button {
  width: 100;
  height: 50;
  border-radius: 10px;
  position: absolute;
  border: 2px solid #fff;
  cursor: pointer;
  left: 20;
  top: 20;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #44444480;
  z-index: 10;
}
.ngager-video-player .play-button:hover {
  background-color: #bbbbbb80;
}
.ngager-video-player .play-button .fa {
  font-size: 30px;
  color: #fff;
  z-index: 2;
}
.ngager-video-player > video {
  width: 100%;
  max-height: 100%;
  max-width: 1000;
  margin: auto;
}
.ngager-meter-container .counter span.label {
  font-size: 0.9em;
}
.ngager-multiple-selectfield span.placeholder {
  font-size: 0.9em;
  font-style: italic;
  color: #778091;
}
.ngager-selectfield {
  width: 100%;
  border: 1px solid #bfd6ff4d;
  border-radius: 6px;
  background-color: #e1e9fc4d;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 40;
}
.ngager-selectfield.disabled {
  opacity: 0.6;
  cursor: no-drop;
}
.ngager-selectfield.disabled .block-ui {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 99;
  display: flex;
}
.ngager-selectfield span.placeholder {
  text-align: left;
  width: 100%;
  padding-left: 10;
}
.ngager-selectfield .selected-value {
  width: 100%;
  padding-left: 10;
  padding-right: 30;
  z-index: 1;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.ngager-selectfield .selected-value > span:first-child {
  white-space: nowrap;
}
.ngager-selectfield .selected-value > span:last-child {
  padding-left: 5;
  font-weight: bold;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.ngager-selectfield .select-field {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 3;
}
.ngager-selectfield .right-button {
  position: absolute;
  z-index: 2;
  right: 10;
  width: 20;
  justify-content: center;
  display: flex;
}
.ngager-selectfield .right-button .fa-caret-down {
  cursor: pointer;
  font-size: 18px;
}
.ngager-selectfield > .fa {
  position: absolute;
  font-size: 18px;
  z-index: 2;
}
.ngager-selectfield > .fa.fa-calendar {
  left: 10;
}
.ngager-selectfield > .fa.fa-caret-down {
  right: 10;
  cursor: pointer;
}
.error-text {
  display: block;
  color: #ff9494;
  font-size: 0.9em;
  padding-top: 5;
}
.external-links {
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.external-links > a {
  font-size: 30;
  text-align: center;
  word-break: break-all;
  padding-left: 20;
  padding-right: 20;
}
.external-links:hover .newtab-button {
  opacity: 1;
}
.external-links .newtab-button {
  position: absolute;
  bottom: 0;
  background: rgba(255, 255, 255, 0.52);
  padding: 15px 37px;
  border-top-left-radius: 50px;
  opacity: 0;
  transition-duration: 0.3s;
  cursor: pointer;
  color: #000;
  border-top-right-radius: 50px;
  font-weight: bold;
}
.ngager-toggle {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.ngager-toggle span.label {
  margin-left: 10;
  opacity: 0.8;
}
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill,
input:-webkit-autofill:hover,
textarea:-webkit-autofill:hover,
select:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill:focus,
select:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill:active,
select:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  -webkit-text-fill-color: #778091;
}
span.float-label-text span.required {
  position: relative;
  margin-left: 3;
  display: inline-flex;
  align-items: center;
}
span.float-label-text span.required i {
  font-size: 30;
  color: red;
  position: absolute;
}
.black-background {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #222222;
  opacity: 0.3;
}
.profile-popover {
  pointer-events: auto !important;
  padding: 0;
}
.profile-popover:hover {
  visibility: visible !important;
  opacity: 1 !important;
}

.set-password {
  background-image: url(/0d4745cc50a26287e9aa291c511ab137.png);
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.set-password .set-password-body {
  display: flex;
  flex-direction: column;
}
.set-password .set-password-body .download-link-container {
  text-align: center;
}
.set-password .set-password-body .download-link-container .download-link {
  padding: 3px 0;
  color: #b2b3b7;
  font-size: 12px;
}
.set-password .set-password-body .download-link-container .download-link a {
  color: #fff;
}
.set-password .central-form {
  width: 300;
  height: 550;
  margin: auto;
  position: relative;
}
.set-password .central-form img {
  display: block;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.set-password .central-form .text-banner {
  margin-bottom: 40px;
}
.set-password .central-form .error-message {
  color: red;
}
.set-password .central-form .inputs-container {
  margin-top: 40px;
}
.set-password .central-form .inputs-container .password-rules-list {
  margin-bottom: 20px;
}
.set-password .central-form .inputs-container .password-rules-list .checked {
  color: #98eb48;
  opacity: 0.8;
}
.set-password .central-form .inputs-container input {
  color: #e6edfd;
  width: 100%;
  height: 48px;
  padding-left: 18px;
  font-size: 16px;
  font-weight: 100px;
  border: 1px solid rgba(255, 255, 255, 0.4);
  background: transparent;
}
.set-password .central-form .inputs-container input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: rgba(255, 255, 255, 0.4);
}
.set-password .central-form .inputs-container input::-moz-placeholder {
  /* Firefox 19+ */
  color: rgba(255, 255, 255, 0.4);
}
.set-password .central-form .inputs-container input:-ms-input-placeholder {
  /* IE 10+ */
  color: rgba(255, 255, 255, 0.4);
}
.set-password .central-form .inputs-container input:-moz-placeholder {
  /* Firefox 18- */
  color: rgba(255, 255, 255, 0.4);
}
.set-password .central-form .indicators {
  margin-top: 10px;
  line-height: 18px;
  font-size: 10px;
  letter-spacing: 0.3px;
  color: #a1bcf8;
}
.set-password .central-form .indicators p {
  transition-property: all;
  transition-duration: 0.2s;
}
.set-password .central-form .indicators p i {
  font-size: 10px;
  opacity: 0;
  transition-delay: 0.1s;
  margin-left: 3px;
}
.set-password .central-form .indicators p span {
  margin-left: 4px;
}
.set-password .central-form .indicators p.valid {
  color: #98eb48;
}
.set-password .central-form .indicators p.valid i {
  opacity: 1;
}
.set-password .central-form button {
  width: 100%;
  height: 50px;
  background: rgba(255, 255, 255, 0.4);
  border-radius: 5px;
  color: #f0f4fc;
  margin-top: 10px;
  n-moz-transition-property: all;
  transition-property: all;
  transition-duration: 0.2s;
}
.set-password .central-form button.enabled {
  background-color: #9acf61;
  border: none;
  text-transform: uppercase;
  cursor: pointer;
}
.set-password .central-form .success-msg,
.set-password .central-form .password-match-msg {
  n-moz-transition-property: all;
  transition-property: all;
  transition-duration: 0.2s;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.notificationTotalContainer {
  z-index: 99999999;
}
.notificationTotalContainer .additional {
  overflow: hidden;
  position: fixed;
  left: -50px;
  width: 70px;
  height: 70px;
  border-radius: 100px;
  background-color: #9acf61;
  bottom: -50px;
  margin-bottom: 40px;
  display: none;
  text-align: center;
}
.notificationTotalContainer .additional.visible {
  display: flex;
}
.notificationTotalContainer .additional img {
  width: 68%;
  margin: auto;
}
.notificationTotalContainer .notificationIconContainer {
  border: 1px dashed #fff;
  border-radius: 100px;
  width: 85%;
  height: 85%;
  margin: auto;
}
.notificationTotalContainer .notificationIcon {
  font-size: 34px;
  color: white;
  padding: 12px;
  text-shadow: 1px 1px 5px #70a932;
}

.profile-simple-view {
  display: flex;
  flex: 1;
  flex-direction: column;
  width: 400;
  height: 150;
  overflow: auto;
  padding: 10;
}
.profile-simple-view .fields {
  margin-top: auto;
  margin-bottom: auto;
}
.profile-simple-view .fields p.fullname {
  font-weight: bold;
  font-size: 1.2em;
  margin-bottom: 5;
}
.profile-simple-view .fields a {
  color: #FFFFFF;
}

.modal-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  padding: 1rem;
  z-index: 9999;
  opacity: 1;
  overflow-x: hidden;
  overflow-y: auto;
  animation: show 0.5s ease;
}
.modal-overlay .background {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background-color: #222222;
  opacity: 0.8;
  z-index: 1;
}
.modal-overlay .modal {
  max-height: 96%;
  overflow-y: overlay;
  display: flex;
  background-color: #f0f4fc;
  min-height: 60vh;
  z-index: 10;
}
.modal-overlay .modal > .modal-content {
  display: flex;
  flex: 1;
  flex-direction: column;
  height: -moz-fit-content;
  height: fit-content;
}
@media only screen and (min-device-width: 320px) and (max-device-width: 768px) {
  .modal-overlay {
    /* Styles */
  }
  .modal-overlay .modal {
    width: 90%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .modal-overlay .modal {
    width: 800px;
  }
}
@media only screen and (min-device-width: 1024px) {
  .modal-overlay .modal {
    width: 1000px;
  }
}

.modal-profile .modal {
  border-radius: 20px;
  background-color: #36425A;
  color: #fff;
  position: relative;
  max-width: 600;
  min-height: unset;
  border: 1px solid #777;
}
.modal-profile .modal .modal-content {
  position: relative;
}
.modal-profile .modal .modal-content > .icon-button {
  position: relative;
}
.modal-profile .modal .modal-content > .icon-button .fa-times {
  position: absolute;
  right: 10;
  top: 10;
  background-color: #FFFFFF22;
  padding: 5px;
  font-size: 16;
  border-radius: 40px;
  width: 16;
  height: 16;
  opacity: 0.7;
}
.modal-profile .modal .modal-content > .icon-button .fa-times:hover {
  opacity: 1;
}
.modal-profile .modal .modal-content .profile-popup {
  display: flex;
  flex: 1;
  flex-direction: column;
  width: 100%;
  min-height: 200;
  overflow: auto;
  max-height: 600;
}
.modal-profile .modal .modal-content .profile-popup .fields {
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: center;
}
.modal-profile .modal .modal-content .profile-popup .fields p.fullname {
  font-weight: bold;
  font-size: 1.2em;
  margin-bottom: 5;
}
.modal-profile .modal .modal-content .profile-popup .fields a {
  color: #FFFFFF;
}
.modal-profile .modal .modal-content .profile-popup .fields .ngager-button {
  min-width: 100px;
  min-height: 20px;
  padding: 5px;
  margin-top: 10;
}
.modal-profile .modal .modal-content .profile-popup > .common-fields {
  display: flex;
  flex-direction: row;
  padding-top: 20;
  padding-bottom: 20;
}
.modal-profile .modal .modal-content .profile-popup > .common-fields .profile-photo {
  width: 250;
  justify-content: center;
  display: flex;
  align-items: center;
}
.modal-profile .modal .modal-content .profile-popup > .common-fields .profile-photo .ngager-avatar > div {
  border: 1px solid;
}
.modal-profile .modal .modal-content .profile-popup > .extra-fields {
  display: flex;
  padding-top: 0;
  border-top: 1px solid #bbb;
  margin: 20;
  margin-top: 10;
  padding-top: 10;
}
.modal-profile .modal .modal-content .profile-popup > .extra-fields .fields {
  display: table;
  border-collapse: separate;
  border-spacing: 0 10px;
}
.modal-profile .modal .modal-content .profile-popup > .extra-fields .fields .row {
  display: table-row;
}
.modal-profile .modal .modal-content .profile-popup > .extra-fields .fields .cell {
  display: table-cell;
}
.modal-profile .modal .modal-content .profile-popup > .extra-fields .fields .field .label {
  vertical-align: middle;
  text-transform: uppercase;
  padding-right: 20;
  font-weight: bold;
  max-width: 150;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.modal-profile .modal .modal-content .profile-popup > .extra-fields .fields .field .value {
  font-style: italic;
  width: 100%;
}

.modal-profile-edit .modal {
  border-radius: 20px;
  background-color: #f0f4fc;
  position: relative;
  max-width: 700;
  min-height: unset;
}
.modal-profile-edit .modal .modal-content {
  position: relative;
}
.modal-profile-edit .modal .modal-content .profile-edit {
  display: flex;
  flex: 1;
  flex-direction: column;
  width: 100%;
  min-height: 300;
  overflow: auto;
  max-height: 700;
}
.modal-profile-edit .modal .modal-content .profile-edit .group-buttons {
  position: sticky;
  bottom: 0;
  background-color: #f0f4fc;
  padding-bottom: 20;
  padding-top: 5;
}
.modal-profile-edit .modal .modal-content .profile-edit .field-input {
  padding-left: 20;
  padding-right: 20;
  min-height: 60;
  display: flex;
  align-items: center;
}
.modal-profile-edit .modal .modal-content .profile-edit .field-input.date {
  position: relative;
}
.modal-profile-edit .modal .modal-content .profile-edit h1 {
  padding: 20;
  padding-bottom: 10;
}
.modal-profile-edit .modal .modal-content .profile-edit h2 {
  padding: 20;
  padding-bottom: 0;
}

.mui-clearable-date-picker {
  position: relative;
  width: 100%;
}
.mui-clearable-date-picker .icon-button {
  position: absolute;
  right: 5px;
  bottom: 10px;
  padding: 5px;
}
.mui-clearable-date-picker .clear-button-icon {
  font-size: 16px;
}

.asideItem {
  padding-top: 10px;
  padding-bottom: 10px;
  position: relative;
  cursor: pointer;
}
.asideItem:hover {
  background-color: #d8e0f2;
}
.asideItem img.avatar {
  width: 40;
  height: 40;
  border-radius: 100px;
}
.asideItem i.fa-user {
  width: 40px;
  height: 40px;
  display: block;
  line-height: 40px;
  text-align: center;
  font-size: 20px;
  border-radius: 100px;
  background: #d8e0f2;
  color: #94addc;
}
.asideItem .fullname {
  padding-left: 5px;
  font-size: 14px;
}
.asideItem .flip-container {
  position: absolute;
  right: 10px;
  top: 18px;
}

.user-picker {
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  width: 100%;
  min-height: 100;
}
.user-picker .search-box {
  flex-direction: column;
  width: 100%;
}
.user-picker .search-box .error {
  color: red;
  display: block;
  width: 100%;
}
.user-picker .error-message {
  color: red;
  position: absolute;
  top: -3;
}
.user-picker .user-list-popup {
  position: absolute;
  top: 40px;
  background: #fff;
  z-index: 2;
  height: 300;
  overflow: auto;
  width: 100%;
  display: flex;
  flex-direction: column;
}
.user-picker .user-list-popup::-webkit-scrollbar {
  width: 8px;
}
.user-picker .user-list-popup:hover::-webkit-scrollbar {
  background: #d2def5;
}
.user-picker .user-list-popup:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.user-picker .user-list-popup > .asideItem {
  min-height: 40;
  align-items: center;
}
.user-list-wrapper {
  display: flex;
  flex-wrap: wrap;
}
.user-list-wrapper > div {
  margin: 3px !important;
}
.user-list-wrapper span.fullname {
  max-width: 150;
  overflow: hidden;
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding: 0;
}

.feedback-users {
  display: flex;
  flex: 1;
  overflow: hidden;
}
.feedback-users .manage-users {
  display: flex;
  flex: 1;
  flex-direction: column;
}
.feedback-users .manage-users > div {
  flex: 1;
}
.feedback-users .manage-users .form {
  width: 100%;
  max-height: 150;
}
.feedback-users .manage-users .users-list {
  margin-top: 30;
  overflow: auto;
  display: flex;
}
.feedback-users .manage-users .users-list ul {
  list-style-type: none;
  width: 100%;
}
.feedback-users .manage-users .users-list ul li {
  background-color: #e2e9f8;
  margin-bottom: 6px;
  border-radius: 16px;
  height: 30px;
  line-height: 30px;
}
.feedback-users .manage-users .users-list ul div.userName {
  flex: 5;
  padding: 0 10px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.feedback-users .manage-users .users-list ul div.fullname {
  flex: 4;
  padding: 0 10px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.feedback-users .manage-users .users-list ul div.email {
  flex: 3;
  text-overflow: ellipsis;
  overflow: hidden;
  padding: 0 10px;
}
.feedback-users .manage-users .users-list ul div:last-child {
  text-align: center;
  width: 50;
  justify-content: space-between;
  align-items: center;
  margin-right: 5;
}
.feedback-users .manage-users .users-list ul .buttons {
  display: flex;
  height: 100%;
}
.feedback-users .manage-users .users-list ul .buttons > div {
  width: 20;
  height: 100%;
  display: flex;
}
.feedback-users .manage-users .users-list ul .buttons > div i {
  line-height: 20px;
  margin: auto;
  cursor: pointer;
}
.feedback-users .manage-users .users-list ul .buttons > div i.fa-times-circle {
  color: #ed839c;
}
.feedback-users .manage-users .bottom {
  max-height: 30;
  align-items: flex-end;
  display: flex;
}
.feedback-users .manage-users .bottom .back-button {
  cursor: pointer;
}
.feedback-users .manage-users .bottom .back-button i {
  margin-right: 5;
}

.componentContainer {
  margin: auto;
  position: relative;
}
.componentContainer .label-caption {
  margin-bottom: 25px;
  text-align: center;
  width: 100%;
  color: #5a74a9;
  position: relative;
  font-weight: 500;
}
.componentContainer .grContainer {
  padding: 30px;
  box-sizing: border-box;
  position: relative;
}
.componentContainer .horizontalAxis {
  position: absolute;
  height: 2px;
  top: 50%;
  z-index: 1;
}
.componentContainer .verticalAxis {
  width: 2px;
  position: relative;
  z-index: 1;
  margin: auto;
}
.componentContainer .axisPhrase {
  position: absolute;
  text-align: center;
  letter-spacing: 0.5px;
  width: 100%;
}
.componentContainer .minYPhrase {
  bottom: -20;
}
.componentContainer .maxYPhrase {
  top: -20;
}
.componentContainer .minXPhrase {
  position: absolute;
  text-align: center;
  transform: rotate(-90deg);
  bottom: 0;
  top: 0;
  left: -20;
}
.componentContainer .maxXPhrase {
  position: absolute;
  text-align: center;
  transform: rotate(90deg);
  bottom: 0;
  top: 0;
  right: -20;
}
.componentContainer .squaresContainer {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.componentContainer .clickableSquare {
  display: inline-block;
  outline: none;
  transition-property: all;
  transition-duration: 0.2s;
}
.componentContainer .circle {
  position: absolute;
  cursor: move;
  z-index: 1;
}
.componentContainer .caption {
  display: block;
  text-align: center;
  margin-bottom: 15px;
}
.componentContainer .subAxis.horizontal {
  opacity: 0.3;
  position: absolute;
  height: 1px;
  z-index: 1;
  margin-top: 30px;
}
.componentContainer .subAxis.vertical {
  opacity: 0.3;
  position: absolute;
  top: 30px;
  width: 1px;
  z-index: 1;
  margin-left: 30px;
}
.componentContainer .bgHolder {
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  opacity: 0.04;
}

.fileuploader-container {
  width: 100%;
  position: relative;
  min-height: 200px;
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.fileuploader-container .error-text {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: te;
  text-align: center;
  z-index: 9999;
  background-color: #FF9499;
  color: #fff;
  padding-bottom: 5;
}
.fileuploader-container > .fa-times {
  position: absolute;
  font-size: 15px;
  right: 10;
  top: 10;
  color: #fff;
  cursor: pointer;
  z-index: 99;
  background-color: brown;
  width: 25;
  height: 25;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 25px;
  border: 1px solid #fff;
}
.fileuploader-container .no-image-src {
  width: 100%;
  height: 300;
  background-color: #222;
  display: flex;
}
.fileuploader-container .no-image-src span.name {
  margin: auto;
}
.fileuploader-container .hidden {
  display: none;
}
.fileuploader-container:hover button.closeButton {
  color: red;
}
.fileuploader-container > div {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
}
.fileuploader-container div.uploading .video-container video {
  opacity: 0.4 !important;
}
.fileuploader-container div.has-file button.chooseFileButton {
  opacity: 0;
  transition: opacity 0.8s;
}
.fileuploader-container div.has-file .video-container video {
  opacity: 1;
  transition: opacity 0.8s;
}
.fileuploader-container div.has-file .image-upload-container img {
  opacity: 1;
  transition: opacity 0.8s;
}
.fileuploader-container div.has-file .progress-container {
  position: absolute;
  z-index: 9999;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: flex;
  vertical-align: middle;
}
.fileuploader-container div.has-file:hover button.chooseFileButton {
  display: block;
  opacity: 1;
}
.fileuploader-container div.has-file:hover .video-container video {
  opacity: 0.4;
}
.fileuploader-container div.has-file:hover .image-upload-container img {
  opacity: 0.4 !important;
}
.fileuploader-container .blurring {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #fff;
  opacity: 0.4;
  z-index: 0;
}
.fileuploader-container img.background {
  background-size: 'cover';
  background-color: rgba(0, 0, 0, 0.5);
}
.fileuploader-container .upload-button {
  position: absolute;
  margin: auto;
  width: 80;
  height: 80;
}
.fileuploader-container button.chooseFileButton {
  position: absolute;
  background: #22222280;
  cursor: pointer;
  z-index: 99;
  outline: none;
  /* background-color: #fff; */
  border-radius: 40px;
  font-size: 40px;
  /* border-color: #fff; */
  border: 1px solid;
  width: 80px;
  height: 80px;
}
.fileuploader-container button.closeButton {
  color: transparent;
  position: absolute;
  top: 30px;
  right: 0;
  z-index: 99;
  background: transparent;
  font-weight: normal;
  font-size: 30px;
  cursor: pointer;
  transition: color 1s ease-out;
}
.fileuploader-container button.closeButton:hover {
  color: red;
}
.fileuploader-container button.hide {
  display: none;
}
.fileuploader-container .is-processing {
  display: flex;
  position: absolute;
  flex-direction: column;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 9;
}
.fileuploader-container .is-processing .processing-background {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 1;
  background-color: #222;
  opacity: 0.5;
}
.fileuploader-container .is-processing .processing-content {
  margin: auto;
  z-index: 5;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.fileuploader-container .is-processing .processing-content span.processing-text {
  color: #fff;
}

.slider-container {
  position: relative;
  font-size: 1em;
}
.slider-container .caption {
  text-align: center;
  color: #778091;
  padding: 0;
}
.slider-container .min-max-text.x {
  position: relative;
  height: 20px;
  font-size: 1em;
}
.slider-container .min-max-text.x .min {
  position: absolute;
  left: 0;
}
.slider-container .min-max-text.x .max {
  text-align: right;
  position: absolute;
  top: 0;
  right: 0;
}
.slider-container .min-max-text.y {
  display: none;
}
.slider-container .errorMsg {
  position: absolute;
  bottom: 0;
  display: block;
  text-align: center;
  width: 100%;
  font-size: 12px;
  color: #f44336;
  transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
}
.slider-container > div {
  max-width: 100%;
  width: auto !important;
  display: flex;
  flex-basis: 100%;
  flex: 1;
  position: relative;
}
.slider-container > div div {
  margin: 0 auto !important;
}
.slider-container > div div div {
  display: flex;
  border: none !important;
}
.slider-container > div div div div:last-child {
  color: #fff;
  text-align: center;
  margin: auto !important;
  width: auto;
}

@charset "UTF-8";
.video-react .video-react-big-play-button:before,
.video-react .video-react-control:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.video-react .video-react-big-play-button:before,
.video-react .video-react-control:before {
  text-align: center;
}
@font-face {
  font-family: 'video-react';
  src: url(data:application/vnd.ms-fontobject;base64,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?#iefix) format('eot');
}
@font-face {
  font-family: 'video-react';
  src: url(data:application/font-woff;base64,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) format('woff'), url(data:application/x-font-ttf;base64,AAEAAAALAIAAAwAwT1MvMg7RD8oAAAC8AAAAYGNtYXAOVuSnAAABHAAAAFRnYXNwAAAAEAAAAXAAAAAIZ2x5Zsdb3FIAAAF4AAAS0GhlYWQLMledAAAUSAAAADZoaGVhB6wEJgAAFIAAAAAkaG10eIgAFM8AABSkAAAAlGxvY2FLllAoAAAVOAAAAExtYXhwACoAyQAAFYQAAAAgbmFtZVtqyukAABWkAAABtnBvc3QAAwAAAAAXXAAAACAAAwQAAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADyIAQAAAAAAAQAAAAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAOAAAAAoACAACAAIAAQAg8iD//f//AAAAAAAg8gD//f//AAH/4w4EAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAVYA1gMqAyoAAgAACQIBVgHU/iwDKv7W/tYAAgBWAFYDqgOqAAIAFgAAAS0BNzIeAhUUDgIjIi4CNTQ+AgGqAQD/AFZYnHNDQ3ObWVicc0NDc5sBQMDA6kNzm1lYnHNDQ3ObWVicc0MAAAADAFYAVgOqA6oAEwAnACoAACUyPgI1NC4CIyIOAhUUHgITMh4CFRQOAiMiLgI1ND4CExEFAgBGfV02Nl18R0Z9XTY2XXxHWJxzQ0Nzm1lYnHNDQ3ObAwEAqjZdfEdGfV02Nl18R0Z9XTYDAENzm1lYnHNDQ3ObWVicc0P9lgGAwAAAAAACAQAA1gMAAyoAAwAHAAABMxEjIREzEQJWqqr+qqoDKv2sAlT9rAAAAwBWAFYDqgOqAAMABwAbAAABESMRIxEjERMyHgIVFA4CIyIuAjU0PgICgFZUVoBYnHNDQ3ObWVicc0NDc5sBVgFU/qwBVP6sAlRDc5tZWJxzQ0Nzm1lYnHNDAAAEAFYAVgOqA6oAAwAXACsALwAAAREzEQcyPgI1NC4CIyIOAhUUHgITMh4CFRQOAiMiLgI1ND4CAxEzEQIqVoBGfV02Nl18R0Z9XTY2XXxHWJxzQ0Nzm1lYnHNDQ3ObJ1YBVgFU/qysNl18R0Z9XTY2XXxHRn1dNgMAQ3ObWVicc0NDc5tZWJxzQ/2sAVT+rAABAQABAAMAAwAAAwAAASERIQEAAgD+AAMA/gAAAgBqAQADVgMAAAIABQAACQERIQkBAeoBbP6A/pQBbAIAAQD+AAEAAQAAAAACAKoBAAOWAwAAAgAFAAAJAiERAQIqAWz+lP6AAWwDAP8A/wACAP8AAAAAAAIBAAEAAwADAAACAAYAAAkBEQEzESMBlgFq/gBWVgIAAQD+AAIA/gAAAAAAAgEAAQADAAMAAAMABgAAATMRIyERAQKqVlb+VgFqAwD+AAIA/wAAAAIAqgCAA1YD1gBFAGgAAAEOARUUBjEjNzMVIwcwNjU0MjU0FjsBMhYXHgEXHgEVFAYHDgEHDgEHDgEjIiYnLgEnLgE1MxQWMzI2PwEwNj0BLwEwJiMRMh4CFRQOAiMiLgI1MxQeAjMyPgI1NC4CIxUnNwH4AwsEHgpmSgQEBgUDCAYNAwMKAwcLAQMDBQYGBwMDEQYGDQMDCwYICiIODAMGAwoEBAoJA0Z9XTY2XXxHRn1dNlYpRV01NF5FKSlFXTXW1gG8AQUCAwNeHiYBAwMDAwMDAwMGAwcZDgYNAwMNBgYDAwMBAQMDAgMEFgwLCQEDCAkDGggKBAFuNV17R0Z9XTY2XXxHNF5FKSlFXTU0XkUprNbWAAAEAKoAgANWA9YAGwBGAE0AcAAAARQWMzI2PwEwNj0BMCY1NCYjIgYPATAGHQEwFjcUBg8BMAYjIgYjIiYnLgEnLgE9ATQ2PwEwNjMyNjMyFhceARceARceARUHIzUHNTczEzIeAhUUDgIjIi4CNTMUHgIzMj4CNTQuAiMVJzcCNA4GAwgDCAQEEgQDBgMIBgZUAQMMEAYGDgYGDgYGCAYKCAEDDg4GBg4GBg4GBgoGBgMDAwG2KCpMBi5GfV02Nl18R0Z9XTZWKUVdNTReRSkpRV011tYBeAUJAQMKCQNWCQMECgMDCAkDVgknCRMGGgwEAQMDBgMFKA8eCRMGGgwEAQMDBgMDDgkJEAlqjAweGAEeNV17R0Z9XTY2XXxHNF5FKSlFXTU0XkUprNbWAAAABACqAIADVgPWABsARgCjAMYAAAEUFjMyNj8BMDY9ATQmNTQmIyIGDwEwBh0BMBY3FAYPATAGIyIGIyImJy4BJy4BPQE0Nj8BMDYzMjYzMhYXHgEXHgEXHgEVIzI2PQEwJjU0JisBMAYjIgYdASM0NjMyNjMyFhceAR0BMAYVFAYjIgYHHgEXHgEVFAYHDgEHDgEjIgYjIiYnLgEnLgE1MxUwFhUUFjsBMDYzMjY9ATAmNTQmKwE1EzIeAhUUDgIjIi4CNTMUHgIzMj4CNTQuAiMVJzcCPBAGAwYDCAQEEAQDCAMIBARQAQMMEAYGDgYPFQoGAwMDAwMDDBAGBgwGBg4GBgoGBgMDAwHiDBIEBQMWBQMDASwWDgMOAw0ZCggIBAUDAwgDBg0DAwUBAwMGAwMNBgYOBgYLAwMNBggKJAQFAxYFAwMBBAUDGmZGfV02Nl18R0Z9XTZWKUVdNTReRSkpRV011tYBeAYIAQMKCQNWAwYDBAoDAwgJA1YJJwkTBhoMBAsFAw4JCRAJHgkTBhoMBAEDAwYDAw4JCRAJDgwIBQMDAQQFAwgPHwQHBQQYCg4JAwMFBwMDBwYGDgYGDQMDCgMDBQQBAwMCAwQbCwgFAwMBBAUDFgUDAwEeAWo1XXtHRn1dNjZdfEc0XkUpKUVdNTReRSms1tYAAAIAqgCAA1YD1gBCAGUAAAEOARUUBjEjNzMVIwcwNjU0MjU0FjsBMhYXHgEXHgEVFAYHDgEHDgEjIiYnLgEnLgE1MxQWMzI2PwEwNj0BLwEwJiMlND4CMzUXBzUiDgIVFB4CMzI+AjUzFA4CIyIuAgH0AwsEGgpmSgQEBgUDCAYNAwMKAwcLAQMDBQYIFw8GDQMDCwYICiIODAMGAwoEBAoJA/6uNl18R9bWNF5FKSlFXTU0XkUpVjZdfEdGfV02AbwBBQIDA14eJgEDAwMDAwMDAwYDBxkOBg0DAw0GCAgBAwMCAwQWDAsJAQMICQMaCAoEGkZ8XTWs1tasKUVdNTReRSkpRV01Rn1dNjZdfAAABACqAIADVgPWABsARgBNAHAAAAEUFjMyNj8BMDY9ATAmNTQmIyIGDwEwBh0BMBY3FAYPATAGIyIGIyImJy4BJy4BPQE0Nj8BMDYzMjYzMhYXHgEXHgEXHgEVByM1BzU3MwU0PgIzNRcHNSIOAhUUHgIzMj4CNTMUDgIjIi4CAjQOBgMIAwgEBBIEAwYDCAYGUAEDDBAGBg4GBg4GBggGCggBAw4OBgYOBgYOBgYKBgYDAwMBsigqTAb+2DZdfEfW1jReRSkpRV01NF5FKVY2XXxHRn1dNgF4BQkBAwoJA1YJAwQKAwMICQNWCScJEwYaDAQBAwMGAwUoDx4JEwYaDAQBAwMGAwMOCQkQCWqMDB4YNkZ8XTWs1tasKUVdNTReRSkpRV01Rn1dNjZdfAAAAAQAqgCAA1YD1gAiAD4AaQDGAAATND4CMzUXBzUiDgIVFB4CMzI+AjUzFA4CIyIuAgUUFjMyNj8BMDY9ATAmNTQmIyIGDwEwBh0BMBY3FAYPATAGIyIGIyImJy4BJy4BPQE0Nj8BMDYzMjYzMhYXHgEXHgEXHgEVIzI2PQEwJjU0JisBMAYjIgYdASM0NjMyNjMyFhceAR0BMAYVFAYjIgYHHgEXHgEVFAYHDgEHDgEjIgYjIiYnLgEnLgE1MxUwFhUUFjsBMDYzMjY9ATAmNTQmKwE1qjZdfEfW1jReRSkpRV01NF5FKVY2XXxHRn1dNgGODgYDCAMIBAQSBAMGAwgEBFQBAwwQBgYOBg8VCgYDAwMDAwMMEAYGDAYGDgYGCgYGAwMDAeIMEgQFAxYFAwMBLBYOAw4DDRkKCAgEBQMDCAMGDQMDBQEDAwYDAw0GBg4GBgsDAw0GCAokBAUDFgUDAwEEBQMaAdZGfF01rNbWrClFXTU0XkUpKUVdNUZ9XTY2XXwXBQkBAwoJA1YJAwQKAwMICQNWCScJEwYaDAQLBQMOCQkQCR4JEwYaDAQBAwMGAwMOCQkQCQ4MCAUDAwEEBQMIDx8EBwUEGAoOCQMDBQcDAwcGBg4GBg0DAwoDAwUEAQMDAgMEGwsIBQMDAQQFAxYFAwMBHgAAAAAEAIAAgAOAA4AAAgAUACYALgAAARUnJwEHJw4BBzU+ATcnEScjETMnATQuAic1HgMVFAYHJz4BJxwBByc1HgECAFrwAso2WCJOLBswFbbWqsrKAqofOU0vQG5PLRcVQAoMagJoMDoDVrRahP02NlgbKAtYBxoRtv7g1gEAyv62M1xLNg5YDkVjfEQwWydCGTkeBw0GaF4YWwAAAAABASoAqgKqA1YABQAAATM3EScjASqs1NSsAoDW/VTWAAIA1gCqAxYDVgAFAAwAABMzNxEnIyUUBgcRHgHWqtbWqgJAPDAwPAKA1v1U1oA5WxgBWBhbAAAAAwCAAIoDgAN2ABUAHAAiAAABHgMVFA4CBzU+AzU0LgInExQGBxEeASUzNxEnIwJWQG5PLS1PbUEuTjkfHzlNL2o6MDA6/cCq1taqA3YORWN8RER7Y0YOWA03S1wzM1xLNg7+4jlbGAFYGFtH1v1U1gAAAAAEANYA1gMqAyoABQALABEAFwAAATMVIzUjEzUzFSM1ATUzFSMVHQEzFSM1AlbUVICAVNT+gNSAgNQDKtSA/lSA1FQBLNRUgKyAVNQABADWANYDKgMqAAUACwARABcAAAEzFSM1MwM1MxUjFQE1MxUjNRE1MxUjNQKqgNRUVNSA/qxU1NRUAqpU1P2s1FSAAdSA1FT+rFTUgAAAAAADAIAAqgOAA1YAFwAvAD8AAAE1NCYrASIGHQEUFjsBMjY9ASMVIzUzFSM1NCYrASIGHQEUFjsBMjY9ASMVIzUzFQEyFhURFAYjISImNRE0NjMDABgSgBIaGhKAEhhAVlbqGhKAEhgYEoASGkBWVgGUIjQzI/2sJDIyJAIqLBIYGBKsEhgYEiwWgBYsEhgYEqwSGBgSLBaAFgEsMyP+ACI0MyMCACI0AAAEAIAAgAOAA4AAAwANABkAKQAAATUzFScRMzI2PQE0JiMBESMVIzUjETM1MxUBMhYVERQGIyEiJjURNDYzAmpWlqwSGBgS/wBAVkBAVgGUIjQzI/2sJDIyJAHAgIDA/wAYEqwSGP8AAQBqav8AVlYCADMj/awiNDMjAlQiNAAAAAIAZABWA5wDqgALAFkAAAEyNjU0JiMiBhUUFiUXHgEPAQ4BLwEOAQ8BDgErASImLwEuAScHBiYvASY2PwEuATU8ATcnLgE/AT4BHwE+AT8BPgE7ATIWHwEeARc3NhYfARYGDwEeARUcAQIAPVlYPj1ZWAF8WgYCBFYEDghqECQUEAELCKwHCwIQEyQRagcOBVYEAgZaAQECWgYCBFYEDghqECQUEAELCKwHCwIQEyQRagcOBVYEAgZaAQEBalg+PVlYPj1ZbEYEEAiUBwQDKgwWCHAHCwoIcAcVDioDAwiUBxAFRgoVCwoVC0YEEAiUBwQDKgwWCHAHCwoIcAcVDioDAwiUBxAFRgoVCwoVAAAAAQCAAFgDgAOqADMAAAEyFhUUBiMiJjU8ATclDgEjIiY1NDYzMhYXJS4BNTQ2MzIWFRQGIyImJwUeARUUBgcFPgEDADNJSTMzSQL+0hIsGjRMSzUZLRIBLAEDSzU0TEs1GS0S/tQBAwICATAQLAFSSTMzS0szBw8GsBASSzU0TBERrgcPCDRMSzU0TBMRsAcPCAcPCLAPEQADAFYAVgOqA6oAAwAHABsAAAE1IxUTESMREzIeAhUUDgIjIi4CNTQ+AgIqVFRUKlicc0NDc5tZWJxzQ0NzmwKAVlb+qgEA/wACgENzm1lYnHNDQ3ObWVicc0MAAAQAVgBWA6oDqgADABcAKwAvAAABNTMVAzI+AjU0LgIjIg4CFRQeAhMyHgIVFA4CIyIuAjU0PgITETMRAdZUKkZ9XTY2XXxHRn1dNjZdfEdYnHNDQ3ObWVicc0NDc5svVAKAVlb+KjZdfEdGfV02Nl18R0Z9XTYDAENzm1lYnHNDQ3ObWVicc0P9gAEA/wAAAAEA1gDWAyoDKgALAAABBxcHJwcnNyc3FzcDKu7uPO7uPO7uPO7uAu7u7jzu7jzu7jzu7gABAFUAVQOrA6sAFAAAExQeAjMyPgI1NC4CIyIOAhVVQ3ScWFicdENDdJxYWJx0QwIAWJx0Q0N0nFhYnHRDQ3ScWAAAAAIAVQBVA6sDqwAUACgAAAEiDgIVFB4CMzI+AjU0LgIjESIuAjU0PgIzMh4CFRQOAgIAWJx0Q0N0nFhYnHRDQ3ScWEd8XTU1XXxHR3xdNTVdfAOrQ3ScWFicdENDdJxYWJx0Q/0ANV18R0d8XTU1XXxHR3xdNQAAAAMAVQBVA6sDqwAUACgANAAAASIOAhUUHgIzMj4CNTQuAiMRIi4CNTQ+AjMyHgIVFA4CExQGIyImNTQ2MzIWAgBYnHRDQ3ScWFicdENDdJxYR3xdNTVdfEdHfF01NV18OUs1NUtLNTVLA6tDdJxYWJx0Q0N0nFhYnHRD/QA1XXxHR3xdNTVdfEdHfF01AVU1S0s1NUtLAAAAAQAAAAEAAPEUzolfDzz1AAsEAAAAAADUNIllAAAAANQ0iWUAAAAAA6sD1gAAAAgAAgAAAAAAAAABAAAEAAAAAAAEAAAAAAADqwABAAAAAAAAAAAAAAAAAAAAJQQAAAAAAAAAAAAAAAAAAAAEAAFWBAAAVgQAAFYEAAEABAAAVgQAAFYEAAEABAAAagQAAKoEAAEABAABAAQAAKoEAACqBAAAqgQAAKoEAACqBAAAqgQAAIAEAAEqBAAA1gQAAIAEAADWBAAA1gQAAIAEAACABAAAZAQAAIAEAABWBAAAVgQAANYEAABVBAAAVQQAAFUAAAAAAAoAFAAeACwAVACWAKoA2AEgAS4BRAFaAXABhAIQAqgDpgQuBMYFxAYSBiIGPgZ4Bp4GxgcaB1oH4gguCFwIpAi+COAJHAloAAEAAAAlAMcABAAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQALAAAAAQAAAAAAAgAHAIQAAQAAAAAAAwALAEIAAQAAAAAABAALAJkAAQAAAAAABQALACEAAQAAAAAABgALAGMAAQAAAAAACgAaALoAAwABBAkAAQAWAAsAAwABBAkAAgAOAIsAAwABBAkAAwAWAE0AAwABBAkABAAWAKQAAwABBAkABQAWACwAAwABBAkABgAWAG4AAwABBAkACgA0ANR2aWRlby1yZWFjdAB2AGkAZABlAG8ALQByAGUAYQBjAHRWZXJzaW9uIDEuMABWAGUAcgBzAGkAbwBuACAAMQAuADB2aWRlby1yZWFjdAB2AGkAZABlAG8ALQByAGUAYQBjAHR2aWRlby1yZWFjdAB2AGkAZABlAG8ALQByAGUAYQBjAHRSZWd1bGFyAFIAZQBnAHUAbABhAHJ2aWRlby1yZWFjdAB2AGkAZABlAG8ALQByAGUAYQBjAHRGb250IGdlbmVyYXRlZCBieSBJY29Nb29uLgBGAG8AbgB0ACAAZwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAC4AAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype');
  font-weight: normal;
  font-style: normal;
}
.video-react-icon,
.video-react .video-react-big-play-button,
.video-react .video-react-mouse-display,
.video-react .video-react-play-progress,
.video-react .video-react-play-control,
.video-react .video-react-mute-control,
.video-react .video-react-volume-menu-button,
.video-react .video-react-volume-level,
.video-react .video-react-bezel .video-react-bezel-icon {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'video-react' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.video-react-icon-play-arrow:before,
.video-react .video-react-big-play-button:before,
.video-react .video-react-play-control:before,
.video-react .video-react-bezel .video-react-bezel-icon-play:before {
  content: '';
}
.video-react-icon-play-circle-filled:before {
  content: '';
}
.video-react-icon-play-circle-outline:before {
  content: '';
}
.video-react-icon-pause:before,
.video-react .video-react-play-control.video-react-playing:before,
.video-react .video-react-bezel .video-react-bezel-icon-pause:before {
  content: '';
}
.video-react-icon-pause-circle-filled:before {
  content: '';
}
.video-react-icon-pause-circle-outline:before {
  content: '';
}
.video-react-icon-stop:before {
  content: '';
}
.video-react-icon-fast-rewind:before,
.video-react .video-react-bezel .video-react-bezel-icon-fast-rewind:before {
  content: '';
}
.video-react-icon-fast-forward:before,
.video-react .video-react-bezel .video-react-bezel-icon-fast-forward:before {
  content: '';
}
.video-react-icon-skip-previous:before {
  content: '';
}
.video-react-icon-skip-next:before {
  content: '';
}
.video-react-icon-replay-5:before,
.video-react .video-react-bezel .video-react-bezel-icon-replay-5:before {
  content: '';
}
.video-react-icon-replay-10:before,
.video-react .video-react-bezel .video-react-bezel-icon-replay-10:before {
  content: '';
}
.video-react-icon-replay-30:before,
.video-react .video-react-bezel .video-react-bezel-icon-replay-30:before {
  content: '';
}
.video-react-icon-forward-5:before,
.video-react .video-react-bezel .video-react-bezel-icon-forward-5:before {
  content: '';
}
.video-react-icon-forward-10:before,
.video-react .video-react-bezel .video-react-bezel-icon-forward-10:before {
  content: '';
}
.video-react-icon-forward-30:before,
.video-react .video-react-bezel .video-react-bezel-icon-forward-30:before {
  content: '';
}
.video-react-icon-volume-off:before,
.video-react .video-react-mute-control.video-react-vol-muted:before,
.video-react .video-react-volume-menu-button.video-react-vol-muted:before,
.video-react .video-react-bezel .video-react-bezel-icon-volume-off:before {
  content: '';
}
.video-react-icon-volume-mute:before,
.video-react .video-react-mute-control.video-react-vol-0:before,
.video-react .video-react-volume-menu-button.video-react-vol-0:before {
  content: '';
}
.video-react-icon-volume-down:before,
.video-react .video-react-mute-control.video-react-vol-1:before,
.video-react .video-react-volume-menu-button.video-react-vol-1:before,
.video-react .video-react-mute-control.video-react-vol-2:before,
.video-react .video-react-volume-menu-button.video-react-vol-2:before,
.video-react .video-react-bezel .video-react-bezel-icon-volume-down:before {
  content: '';
}
.video-react-icon-volume-up:before,
.video-react .video-react-mute-control:before,
.video-react .video-react-volume-menu-button:before,
.video-react .video-react-bezel .video-react-bezel-icon-volume-up:before {
  content: '';
}
.video-react-icon-fullscreen:before {
  content: '';
}
.video-react-icon-fullscreen-exit:before {
  content: '';
}
.video-react-icon-closed-caption:before {
  content: '';
}
.video-react-icon-hd:before {
  content: '';
}
.video-react-icon-settings:before {
  content: '';
}
.video-react-icon-share:before {
  content: '';
}
.video-react-icon-info:before {
  content: '';
}
.video-react-icon-info-outline:before {
  content: '';
}
.video-react-icon-close:before {
  content: '';
}
.video-react-icon-circle:before,
.video-react .video-react-mouse-display:before,
.video-react .video-react-play-progress:before,
.video-react .video-react-volume-level:before {
  content: '';
}
.video-react-icon-circle-outline:before {
  content: '';
}
.video-react-icon-circle-inner-circle:before {
  content: '';
}
.video-react {
  width: 100% !important;
  display: block;
  vertical-align: top;
  box-sizing: border-box;
  color: #fff;
  background-color: #000;
  position: relative;
  font-size: 10px;
  line-height: 1;
  font-family: serif, Times, 'Times New Roman';
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: flex;
  flex: 1;
  min-height: 350;
}
.video-react:-moz-full-screen {
  position: absolute;
}
.video-react:-webkit-full-screen {
  width: 100% !important;
  height: 100% !important;
}
.video-react *,
.video-react *:before,
.video-react *:after {
  box-sizing: inherit;
}
.video-react ul {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  list-style-position: outside;
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;
  margin-bottom: 0;
}
.video-react.video-react-fluid,
.video-react.video-react-16-9,
.video-react.video-react-4-3 {
  width: 100%;
  max-width: 100%;
  height: 100%;
  padding-top: 0 !important;
}
.video-react.video-react-16-9 {
  padding-top: 56.25%;
}
.video-react.video-react-4-3 {
  padding-top: 75%;
}
.video-react.video-react-fill {
  width: 100%;
  height: 100%;
}
.video-react .video-react-video {
  position: absolute;
  max-height: 100%;
  width: 100%;
  align-self: center;
}
.video-react.video-react-fullscreen {
  width: 100% !important;
  height: 100% !important;
  padding-top: 0 !important;
}
.video-react.video-react-fullscreen.video-react-user-inactive {
  cursor: none;
}
body.video-react-full-window {
  padding: 0;
  margin: 0;
  height: 100%;
  overflow-y: auto;
}
body.video-react-full-window .video-react-fullscreen {
  position: fixed;
  overflow: hidden;
  z-index: 1000;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
}
.video-react button {
  background: none;
  border: none;
  color: inherit;
  display: inline-block;
  cursor: pointer;
  overflow: visible;
  font-size: inherit;
  line-height: inherit;
  text-transform: none;
  text-decoration: none;
  transition: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.video-react .video-react-loading-spinner {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -25px 0 0 -25px;
  opacity: 0.85;
  text-align: left;
  border: 6px solid rgba(43, 51, 63, 0.7);
  box-sizing: border-box;
  background-clip: padding-box;
  width: 50px;
  height: 50px;
  border-radius: 25px;
}
.video-react .video-react-loading-spinner:before,
.video-react .video-react-loading-spinner:after {
  content: '';
  position: absolute;
  margin: -6px;
  box-sizing: inherit;
  width: inherit;
  height: inherit;
  border-radius: inherit;
  opacity: 1;
  border: inherit;
  border-color: transparent;
  border-top-color: white;
  animation: video-react-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite, video-react-spinner-fade 1.1s linear infinite;
}
.video-react-seeking .video-react-loading-spinner,
.video-react-waiting .video-react-loading-spinner {
  display: block;
}
.video-react-seeking .video-react-loading-spinner:before,
.video-react-waiting .video-react-loading-spinner:before {
  border-top-color: white;
}
.video-react-seeking .video-react-loading-spinner:after,
.video-react-waiting .video-react-loading-spinner:after {
  border-top-color: white;
  animation-delay: 0.44s;
}
@keyframes video-react-spinner-spin {
  100% {
    transform: rotate(360deg);
  }
}
@keyframes video-react-spinner-fade {
  0% {
    border-top-color: #73859f;
  }
  20% {
    border-top-color: #73859f;
  }
  35% {
    border-top-color: white;
  }
  60% {
    border-top-color: #73859f;
  }
  100% {
    border-top-color: #73859f;
  }
}
.video-react .video-react-big-play-button {
  font-size: 3em;
  line-height: 1.5em;
  height: 1.5em;
  width: 3em;
  display: block;
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 0;
  cursor: pointer;
  opacity: 1;
  border: 0.06666em solid #fff;
  background-color: #2b333f;
  background-color: rgba(43, 51, 63, 0.7);
  border-radius: 0.3em;
  transition: all 0.4s;
}
.video-react .video-react-big-play-button.video-react-big-play-button-center {
  top: 50%;
  left: 50%;
  margin-top: -0.75em;
  margin-left: -1.5em;
}
.video-react .video-react-big-play-button.big-play-button-hide {
  display: none;
}
.video-react:hover .video-react-big-play-button,
.video-react .video-react-big-play-button:focus {
  outline: 0;
  border-color: #fff;
  background-color: #73859f;
  background-color: rgba(115, 133, 159, 0.5);
  transition: all 0s;
}
.video-react-menu-button {
  cursor: pointer;
}
.video-react-menu-button.video-react-disabled {
  cursor: default;
}
.video-react-menu .video-react-menu-content {
  display: block;
  padding: 0;
  margin: 0;
  overflow: auto;
  font-family: serif, Times, 'Times New Roman';
}
.video-react-menu li {
  list-style: none;
  margin: 0;
  padding: 0.2em 0;
  line-height: 1.4em;
  font-size: 1.2em;
  text-align: center;
  text-transform: lowercase;
}
.video-react-menu li:focus,
.video-react-menu li:hover {
  outline: 0;
  background-color: #73859f;
  background-color: rgba(115, 133, 159, 0.5);
}
.video-react-menu li.video-react-selected,
.video-react-menu li.video-react-selected:focus,
.video-react-menu li.video-react-selected:hover {
  background-color: #fff;
  color: #2b333f;
}
.video-react-menu li.vjs-menu-title {
  text-align: center;
  text-transform: uppercase;
  font-size: 1em;
  line-height: 2em;
  padding: 0;
  margin: 0 0 0.3em 0;
  font-weight: bold;
  cursor: default;
}
.video-react-scrubbing .vjs-menu-button:hover .video-react-menu {
  display: none;
}
.video-react .video-react-menu-button-popup .video-react-menu {
  display: none;
  position: absolute;
  bottom: 0;
  width: 10em;
  left: -3em;
  height: 0em;
  margin-bottom: 1.5em;
  border-top-color: rgba(43, 51, 63, 0.7);
}
.video-react .video-react-menu-button-popup .video-react-menu .video-react-menu-content {
  background-color: #2b333f;
  background-color: rgba(43, 51, 63, 0.7);
  position: absolute;
  width: 100%;
  bottom: 1.5em;
  max-height: 15em;
}
.video-react-menu-button-popup .video-react-menu.video-react-lock-showing {
  display: block;
}
.video-react .video-react-menu-button-inline {
  transition: all 0.4s;
  overflow: hidden;
}
.video-react .video-react-menu-button-inline:before {
  width: 2.222222222em;
}
.video-react .video-react-menu-button-inline:hover,
.video-react .video-react-menu-button-inline:focus,
.video-react .video-react-menu-button-inline.video-react-slider-active {
  width: 12em;
}
.video-react .video-react-menu-button-inline:hover .video-react-menu,
.video-react .video-react-menu-button-inline:focus .video-react-menu,
.video-react .video-react-menu-button-inline.video-react-slider-active .video-react-menu {
  display: block;
  opacity: 1;
}
.video-react .video-react-menu-button-inline.video-react-slider-active {
  transition: none;
}
.video-react .video-react-menu-button-inline .video-react-menu {
  opacity: 0;
  height: 100%;
  width: auto;
  position: absolute;
  left: 4em;
  top: 0;
  padding: 0;
  margin: 0;
  transition: all 0.4s;
}
.video-react .video-react-menu-button-inline .video-react-menu-content {
  width: auto;
  height: 100%;
  margin: 0;
  overflow: hidden;
}
.video-react-no-flex .video-react-menu-button-inline .video-react-menu {
  display: block;
  opacity: 1;
  position: relative;
  width: auto;
}
.video-react-no-flex .video-react-menu-button-inline:hover,
.video-react-no-flex .video-react-menu-button-inline:focus,
.video-react-no-flex .video-react-menu-button-inline.video-react-slider-active {
  width: auto;
}
.video-react .video-react-poster {
  display: inline-block;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: contain;
  background-color: #000000;
  cursor: pointer;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100%;
}
.video-react .video-react-poster img {
  display: block;
  vertical-align: middle;
  margin: 0 auto;
  max-height: 100%;
  padding: 0;
  width: 100%;
}
.video-react .video-react-slider {
  outline: 0;
  position: relative;
  cursor: pointer;
  padding: 0;
  margin: 0 0.45em 0 0.45em;
  background-color: #73859f;
  background-color: rgba(115, 133, 159, 0.5);
}
.video-react .video-react-slider:focus {
  text-shadow: 0em 0em 1em white;
  box-shadow: 0 0 1em #fff;
}
.video-react .video-react-control {
  outline: none;
  position: relative;
  text-align: center;
  margin: 0;
  padding: 0;
  height: 100%;
  width: 4em;
  flex: none;
}
.video-react .video-react-control:before {
  font-size: 1.8em;
  line-height: 1.67;
}
.video-react .video-react-control:focus:before,
.video-react .video-react-control:hover:before,
.video-react .video-react-control:focus {
  text-shadow: 0em 0em 1em white;
}
.video-react .video-react-control-text {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.video-react-no-flex .video-react-control {
  display: table-cell;
  vertical-align: middle;
}
.video-react .video-react-control-bar {
  display: none;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3em;
  background-color: #2b333f;
  background-color: rgba(43, 51, 63, 0.7);
}
.video-react-has-started .video-react-control-bar {
  display: flex;
  visibility: visible;
  opacity: 1;
  transition: visibility 0.1s, opacity 0.1s;
}
.video-react-has-started.video-react-user-inactive.video-react-playing .video-react-control-bar.video-react-control-bar-auto-hide {
  visibility: visible;
  opacity: 0;
  transition: visibility 1s, opacity 1s;
}
.video-react-controls-disabled .video-react-control-bar,
.video-react-using-native-controls .video-react-control-bar,
.video-react-error .video-react-control-bar {
  display: none !important;
}
.video-react-audio.video-react-has-started.video-react-user-inactive.video-react-playing .video-react-control-bar {
  opacity: 1;
  visibility: visible;
}
.video-react-has-started.video-react-no-flex .video-react-control-bar {
  display: table;
}
.video-react .video-react-progress-control {
  flex: auto;
  display: flex;
  align-items: center;
  min-width: 4em;
}
.video-react-live .video-react-progress-control {
  display: none;
}
.video-react .video-react-progress-holder {
  flex: auto;
  transition: all 0.2s;
  height: 0.3em;
}
.video-react .video-react-progress-control:hover .video-react-progress-holder {
  font-size: 1.666666666666666666em;
}
/* If we let the font size grow as much as everything else, the current time tooltip ends up
 ginormous. If you'd like to enable the current time tooltip all the time, this should be disabled
 to avoid a weird hitch when you roll off the hover. */
.video-react .video-react-progress-control:hover .video-react-time-tooltip,
.video-react .video-react-progress-control:hover .video-react-mouse-display:after,
.video-react .video-react-progress-control:hover .video-react-play-progress:after {
  visibility: visible;
  font-size: 0.6em;
}
.video-react .video-react-progress-holder .video-react-play-progress,
.video-react .video-react-progress-holder .video-react-load-progress,
.video-react .video-react-progress-holder .video-react-tooltip-progress-bar,
.video-react .video-react-progress-holder .video-react-load-progress div {
  position: absolute;
  display: block;
  height: 0.3em;
  margin: 0;
  padding: 0;
  width: 0;
  left: 0;
  top: 0;
}
.video-react .video-react-mouse-display:before {
  display: none;
}
.video-react .video-react-play-progress {
  background-color: #fff;
}
.video-react .video-react-play-progress:before {
  position: absolute;
  top: -0.33333333em;
  right: -0.5em;
  font-size: 0.9em;
}
.video-react .video-react-time-tooltip,
.video-react .video-react-mouse-display:after,
.video-react .video-react-play-progress:after {
  visibility: hidden;
  pointer-events: none;
  position: absolute;
  top: -3.4em;
  right: -1.9em;
  font-size: 0.9em;
  color: #000;
  content: attr(data-current-time);
  padding: 6px 8px 8px 8px;
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 0.3em;
}
.video-react .video-react-time-tooltip,
.video-react .video-react-play-progress:before,
.video-react .video-react-play-progress:after {
  z-index: 1;
}
.video-react .video-react-progress-control .video-react-keep-tooltips-inside:after {
  display: none;
}
.video-react .video-react-load-progress {
  background: #bfc7d3;
  background: rgba(115, 133, 159, 0.5);
}
.video-react .video-react-load-progress div {
  background: white;
  background: rgba(115, 133, 159, 0.75);
}
.video-react.video-react-no-flex .video-react-progress-control {
  width: auto;
}
.video-react .video-react-time-tooltip {
  display: inline-block;
  height: 2.4em;
  position: relative;
  float: right;
  right: -1.9em;
}
.video-react .video-react-tooltip-progress-bar {
  visibility: hidden;
}
.video-react .video-react-progress-control .video-react-mouse-display {
  display: none;
  position: absolute;
  width: 1px;
  height: 100%;
  background-color: #000;
  z-index: 1;
}
.video-react-no-flex .video-react-progress-control .video-react-mouse-display {
  z-index: 0;
}
.video-react .video-react-progress-control:hover .video-react-mouse-display {
  display: block;
}
.video-react.video-react-user-inactive .video-react-progress-control .video-react-mouse-display,
.video-react.video-react-user-inactive .video-react-progress-control .video-react-mouse-display:after {
  visibility: hidden;
  opacity: 0;
  transition: visibility 1s, opacity 1s;
}
.video-react.video-react-user-inactive.video-react-no-flex .video-react-progress-control .video-react-mouse-display,
.video-react.video-react-user-inactive.video-react-no-flex .video-react-progress-control .video-react-mouse-display:after {
  display: none;
}
.video-react .video-react-mouse-display .video-react-time-tooltip,
.video-react .video-react-progress-control .video-react-mouse-display:after {
  color: #fff;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.8);
}
.video-react .video-react-play-control {
  cursor: pointer;
  flex: none;
}
.video-react .video-react-fullscreen-control {
  cursor: pointer;
  flex: none;
}
.video-react.video-react-fullscreen {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: 9999;
}
.video-react .video-react-time-control {
  flex: none;
  font-size: 1em;
  line-height: 3em;
  min-width: 2em;
  width: auto;
  padding-left: 1em;
  padding-right: 1em;
}
.video-react .video-react-time-divider {
  line-height: 3em;
  min-width: initial;
  padding: 0;
}
.video-react .video-react-mute-control,
.video-react .video-react-volume-menu-button {
  cursor: pointer;
  flex: none;
}
.video-react .video-react-volume-control {
  width: 5em;
  flex: none;
  display: flex;
  align-items: center;
}
.video-react .video-react-volume-bar {
  margin: 1.35em 0.45em;
}
.video-react .video-react-volume-bar.video-react-slider-horizontal {
  width: 5em;
  height: 0.3em;
}
.video-react .video-react-volume-bar.video-react-slider-horizontal .video-react-volume-level {
  width: 100%;
}
.video-react .video-react-volume-bar.video-react-slider-vertical {
  width: 0.3em;
  height: 5em;
  margin: 1.35em auto;
}
.video-react .video-react-volume-bar.video-react-slider-vertical .video-react-volume-level {
  height: 100%;
}
.video-react .video-react-volume-level {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #fff;
}
.video-react .video-react-volume-level:before {
  position: absolute;
  font-size: 0.9em;
}
.video-react .video-react-slider-vertical .video-react-volume-level {
  width: 0.3em;
}
.video-react .video-react-slider-vertical .video-react-volume-level:before {
  top: -0.5em;
  left: -0.3em;
}
.video-react .video-react-slider-horizontal .video-react-volume-level {
  height: 0.3em;
}
.video-react .video-react-slider-horizontal .video-react-volume-level:before {
  top: -0.3em;
  right: -0.5em;
}
.video-react .video-react-menu-button-popup.video-react-volume-menu-button .video-react-menu {
  display: block;
  width: 0;
  height: 0;
  border-top-color: transparent;
}
.video-react .video-react-menu-button-popup.video-react-volume-menu-button-vertical .video-react-menu {
  left: 0.5em;
  height: 8em;
}
.video-react .video-react-menu-button-popup.video-react-volume-menu-button-horizontal .video-react-menu {
  left: -2em;
}
.video-react .video-react-menu-button-popup.video-react-volume-menu-button .video-react-menu-content {
  height: 0;
  width: 0;
  overflow-x: hidden;
  overflow-y: hidden;
}
.video-react .video-react-volume-menu-button-vertical:hover .video-react-menu-content,
.video-react .video-react-volume-menu-button-vertical:focus .video-react-menu-content,
.video-react .video-react-volume-menu-button-vertical.video-react-slider-active .video-react-menu-content,
.video-react .video-react-volume-menu-button-vertical .video-react-lock-showing .video-react-menu-content {
  height: 8em;
  width: 2.9em;
}
.video-react .video-react-volume-menu-button-horizontal:hover .video-react-menu-content,
.video-react .video-react-volume-menu-button-horizontal:focus .video-react-menu-content,
.video-react .video-react-volume-menu-button-horizontal .video-react-slider-active .video-react-menu-content,
.video-react .video-react-volume-menu-button-horizontal .video-react-lock-showing .video-react-menu-content {
  height: 2.9em;
  width: 8em;
}
.video-react .video-react-volume-menu-button.video-react-menu-button-inline .video-react-menu-content {
  background-color: transparent !important;
}
.video-react .video-react-playback-rate .video-react-playback-rate-value {
  line-height: 3em;
  text-align: center;
}
.video-react .video-react-playback-rate .video-react-menu {
  width: 4em;
  left: 0em;
}
.video-react .video-react-bezel {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 52px;
  height: 52px;
  z-index: 17;
  margin-left: -26px;
  margin-top: -26px;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 26px;
}
.video-react .video-react-bezel.video-react-bezel-animation {
  animation: video-react-bezel-fadeout 0.5s linear 1 normal forwards;
  pointer-events: none;
}
.video-react .video-react-bezel.video-react-bezel-animation-alt {
  animation: video-react-bezel-fadeout-alt 0.5s linear 1 normal forwards;
  pointer-events: none;
}
.video-react .video-react-bezel .video-react-bezel-icon {
  width: 36px;
  height: 36px;
  margin: 8px;
  font-size: 26px;
  line-height: 36px;
  text-align: center;
}
@keyframes video-react-bezel-fadeout {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: scale(2);
  }
}
@keyframes video-react-bezel-fadeout-alt {
  0% {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: scale(2);
  }
}

.video-container {
  position: relative;
  width: 100%;
  display: flex;
  outline: none;
  background-color: #222222;
}
.video-container .hidden {
  display: none;
}
.video-container .dimmer {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #222222;
  opacity: 0.4;
  z-index: 0;
  top: 0;
}
.video-container i.fa-play-circle {
  position: absolute;
  left: 45%;
  top: 40%;
  font-size: 5rem;
  color: #fff;
  z-index: 10;
  cursor: pointer;
}
.video-container i.fa-play-circle:hover {
  color: #222;
}

.pdf-reader-container {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  z-index: 2;
  justify-content: center;
  align-items: center;
}
.pdf-reader-container .loading {
  display: flex;
  height: 80%;
  width: 100%;
}
.pdf-reader-container .loading span {
  margin: auto;
}
.pdf-reader-container .pdf-pages-container {
  overflow: overlay;
  overflow-x: hidden;
  width: 100%;
  margin: auto;
  height: 100%;
  background-color: #d1d1d1;
}
.pdf-reader-container .pdf-pages-container .pdf-loader {
  display: flex;
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  height: 100%;
  bottom: 0;
}
.pdf-reader-container .pdf-pages-container .pdf-loader .pdf-loading-bar {
  width: 70%;
  margin: auto;
  border: 1px solid #cccccc;
  padding: 1px;
  height: 10px;
  border-radius: 5px;
  text-align: center;
  background-color: #ffffff;
}
.pdf-reader-container .pdf-pages-container .pdf-loader .pdf-loading-completed {
  background-color: #2980b9;
  height: 10px;
  border-radius: 5px;
}
.pdf-reader-container .pdf-pages-container .pdf-page {
  width: 100%;
  text-align: center;
  margin-bottom: 10px;
}
.pdf-reader-container .pdf-pages-container .pdf-page .loading {
  display: flex;
  height: 100%;
  background-color: #ffffff;
  margin: auto;
}
.pdf-reader-container .pdf-pages-container .pdf-page .loading span {
  margin: auto;
}
.pdf-reader-container .pdf-pages-container .pdf-page img {
  margin: auto;
  max-width: 100%;
  height: auto;
}
.pdf-reader-container .pdf-pages-container .pdf-page canvas {
  margin: auto;
  max-width: 100%;
  height: auto;
}
.pdf-reader-container .pdf-pages-container .pdf-page span {
  margin: auto;
}
.tool-bar-container {
  position: sticky;
  width: 100%;
  bottom: 10px;
  text-align: right;
  z-index: 9999;
}
.tool-bar-container.fullscreen {
  position: fixed;
  bottom: 0;
  right: 0;
}
.tool-bar-container .tool-bar {
  background-color: #000;
  opacity: 0.7;
  color: #fff;
  text-align: center;
  display: inline-block;
  border-radius: 5px;
  margin: 20px;
  margin-bottom: 10px;
  font-size: 1rem;
}
.tool-bar-container .tool-bar > div {
  display: inline-flex;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
}
.tool-bar-container .tool-bar .controls > div,
.tool-bar-container .tool-bar .controls a {
  padding-right: 10;
  margin-right: 10;
  border-right: 1px solid #BBBBBB;
  padding-top: 5;
  padding-bottom: 5;
  color: #FFF;
  outline: none;
}
.tool-bar-container .tool-bar .controls > div:hover,
.tool-bar-container .tool-bar .controls a:hover {
  color: #BBBBBB;
}
.tool-bar-container .tool-bar .controls > div:last-child,
.tool-bar-container .tool-bar .controls a:last-child {
  border-right: none;
  margin-right: 0;
  padding-right: 0;
}
.tool-bar-container .tool-bar .controls > div i.fa,
.tool-bar-container .tool-bar .controls a i.fa {
  font-size: 20;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.resource-container {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
}
.resource-container .empty-resource {
  height: 90px;
  background-color: darkgrey;
  opacity: 0.8;
  width: 100%;
}
.resource-container video {
  width: 100%;
}
.game-learning-resources {
  display: flex;
  justify-content: center;
  flex: 1 1 0%;
  height: 100%;
}
.game-learning-resources > div.resource-viewer {
  display: flex;
  flex: 1;
}
.hidden {
  display: none;
}
.game-name {
  background-color: #efefef;
  padding: 7px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 40px;
}
.game-name span {
  opacity: 0.6;
}
.game-container {
  width: 100%;
  margin: auto;
}
.game-container .save-button-container {
  display: flex;
  justify-content: center;
  margin-top: 30;
}
.game-container.handle-ticket {
  height: 100%;
}
.game-container.handle-ticket .game-body {
  padding: 0px;
  display: flex;
  height: 100%;
  flex: 1 1 0%;
  width: auto;
  max-width: unset;
}
.game-body {
  padding: 0;
  position: relative;
  margin: auto;
  max-width: 900;
  width: 90%;
  padding-top: 20;
  padding-bottom: 20;
}
.game-body.act {
  min-height: 250;
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  padding-top: 30;
}
.game-body.act p.name {
  font-size: 1.3em;
  padding-bottom: 10;
  text-align: center;
  width: 90%;
}
.game-body.act p.description {
  opacity: 0.7;
  padding: 20;
  width: 90%;
  padding-top: 0;
  padding-bottom: 0;
}
.game-body.act .game-container {
  margin-top: 0;
}
.game-body .label-caption {
  line-height: 22px;
  transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  z-index: 1;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  color: #5a74a9;
  font-style: italic;
  letter-spacing: '0.2px';
  font-size: 1.1em;
  text-align: left;
}
.game-body .text-container {
  text-align: left;
}
.game-body .tags-container {
  text-align: left;
}
.game-body .tags-container .text-field {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.game-body .tags-container .text-field .fa-search {
  position: absolute;
  left: 0;
}
.game-body .tags-container .text-field .fa-close {
  position: absolute;
  right: 0;
  cursor: pointer;
}
.game-body .tags-container .text-field .fa-times {
  position: absolute;
  right: 0;
  cursor: pointer;
  z-index: 1;
}
.game-body .tags-container .text-field .fa-plus-circle {
  position: absolute;
  right: 0;
  cursor: pointer;
  z-index: 1;
  font-size: 25;
}
.game-body .tags-container .text-field input[type='text'] {
  padding-right: 20px;
}
.game-body > .game-slider {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.game-body > .game-slider.y-axis {
  flex-direction: row;
  min-height: 300;
  margin-bottom: 20;
}
.game-body > .game-slider.y-axis .generic-field {
  display: flex;
  width: 100%;
  justify-content: center;
}
.game-body > .game-slider.y-axis .generic-field:first-child {
  margin-right: 30;
}
.game-body > .game-slider.y-axis .generic-field:last-child {
  margin-right: 0;
}
.game-body > .game-slider.y-axis .slider-container {
  display: flex;
  flex-direction: column;
}
.game-body .error-text {
  display: block;
  color: #f44336;
  font-size: 0.9em;
  padding: 3px 0px;
}
.game-body .error-line {
  margin-top: 4px;
  background-color: #f44336;
  height: 1.5px;
}
.game-body .quiz-container .caption {
  padding: 20px 0px;
  color: #778091;
}
.game-body .quiz-container .selected {
  position: absolute;
  top: 6px;
  right: 5px;
  text-align: center;
}
.game-body .quiz-container .selected i {
  background-color: #dadada;
  height: 22px;
  border-radius: 100px;
  color: white;
  width: 22px;
  line-height: 22px;
  font-size: 0.8em;
  margin: auto;
  background-color: #9acf61;
  border: 2px solid #e2f9ca;
}
.game-body .quiz-container .quiz-options {
  position: relative;
}
.game-body .ticket-container {
  width: 100%;
  position: relative;
}
.game-body .ticket-container .ticket-list {
  display: block;
  height: 100%;
}
.game-body .ticket-container .ticket-list .ticket-item {
  display: inline-block;
  width: 49.6%;
  height: 100px;
  font-size: 0.7em;
  position: relative;
  margin: 1px;
  color: whitesmoke;
  cursor: pointer;
  overflow: hidden;
}
.game-body .ticket-container .ticket-list .ticket-item:hover .dimmer {
  display: none;
}
.game-body .ticket-container .ticket-list .ticket-item img {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.game-body .ticket-container .ticket-list .ticket-item .dimmer {
  background-color: #222;
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0.6;
}
.game-body .ticket-container .ticket-list .ticket-item .title {
  font-size: 1.4em;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 999;
  display: flex;
  text-align: center;
}
.game-body .ticket-container .ticket-list .ticket-item .title span {
  display: inline-block;
  margin: auto;
}
.game-body .ticket-container .ticket-list .ticket-item .time {
  position: absolute;
  bottom: 2px;
  left: 2px;
}
.game-body .ticket-container .ticket-list .ticket-item .status {
  position: absolute;
  top: 2px;
  left: 2px;
}
.game-body .ticket-container .ticket-detail {
  padding: 20px;
  padding-left: 40px;
}
.game-body .ticket-container .ticket-detail .row {
  display: inline-block;
  width: 100%;
  padding-bottom: 10px;
  padding-top: 10px;
}
.game-body .two-columns {
  display: flex;
  width: 100%;
  position: relative;
}
.game-body .two-columns .column1 {
  width: 50%;
  padding: 0 15px;
}
.game-body .two-columns .column2 {
  width: 50%;
  margin-top: -5px;
  position: relative;
}
.game-body .feedback-container {
  margin-top: 30px;
  margin-bottom: 20px;
}
.game-body .feedback-container .ask-feedback-form {
  padding-left: 30;
}
.game-body .feedback-container .step-1 {
  display: flex;
  width: 100%;
  position: relative;
}
.game-body .feedback-container .step-1 .column1 {
  width: 50%;
  padding-right: 30px;
}
.game-body .feedback-container .step-1 .column2 {
  width: 50%;
  position: relative;
}
.game-body .checkbox-container {
  margin: 30px 0;
}
.game-body .text-container .textarea-field {
  padding-bottom: 10px;
  min-height: 88px;
}
.game-body .text-container .textarea-field div:first-child {
  background-color: #f7f8f9 !important;
  margin-bottom: 10px;
  margin-top: 5px;
}
.game-body .text-container .textarea-field div:first-child textarea {
  padding: 8px 10px !important;
}
.game-body .text-container.disabled .textarea-field div:first-child {
  background-color: #eeeff1 !important;
}
.generic-field {
  margin: 30px 0;
}
.challenge-header .title {
  margin-top: 10px;
  text-align: center;
  font-size: 25px;
}
.challenge-header .description {
  margin: 10px 90px;
  text-align: center;
  line-height: 20px;
}
.challenge-header .gameIconContainer {
  position: relative !important;
  margin-top: -40px !important;
  top: 0 !important;
}
.dropdown-container {
  margin: 15px 0 0 0;
}
.text-container .textarea-field textarea {
  background-color: #f7f8f9 !important;
  padding: 8px 10px !important;
}
.text-container.disabled textarea {
  background-color: #eeeff1 !important;
}
.text-container span.caption {
  line-height: 22px;
  transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  z-index: 1;
  transform: scale(0.75) translate(0px, -28px);
  transform-origin: left top 0px;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  letter-spacing: 0.2px;
}
.horizontal-categories-games .category-content .card-background-image {
  width: 100%;
  height: 175;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  background-color: #edeff0;
}
.horizontal-categories-games .category-content .card-bottom {
  height: 46;
  background-color: #f4f0f0;
  color: #6c81af;
  display: flex;
  align-items: center;
  position: relative;
}
.horizontal-categories-games .category-content .card-bottom > span {
  font-size: 16px;
  padding-left: 10;
  padding-right: 50;
  -webkit-line-clamp: 2;
  overflow: hidden;
  max-height: 40;
  text-overflow: ellipsis;
  line-height: 20px;
  -webkit-box-orient: vertical;
  display: -webkit-box;
}
.horizontal-categories-games .category-content .card-bottom .card-icon {
  position: absolute;
  width: 50;
  height: 50;
  color: #fff;
  top: -25;
  right: 10;
  border-radius: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.horizontal-categories-games .category-content .card-bottom .card-icon > i {
  font-size: 30;
}
.vertical-categories-games {
  display: flex;
  flex-direction: column;
  max-width: 500;
  min-width: 300;
  overflow: auto;
  margin-top: 15px;
  margin-right: 5px;
  align-items: center;
  padding-right: 6;
  padding-left: 6;
}
.vertical-categories-games .card-content {
  width: 100%;
  margin-bottom: 15;
  cursor: pointer;
  background-color: #fff;
  border-radius: 10px;
  border: 1px solid #bfcef073;
}
.vertical-categories-games .card-content.collapsed .card-bottom {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  background-color: #edeff0;
}
.vertical-categories-games .card-content .category-content .card-background-image {
  width: 100%;
  padding-top: 45%;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  background-color: #edeff0;
  background-repeat: no-repeat;
  background-size: cover;
}
.vertical-categories-games .card-content .category-content .card-bottom {
  height: 46;
  background-color: #f4f0f0;
  color: #6c81af;
  display: flex;
  align-items: center;
  position: relative;
}
.vertical-categories-games .card-content .category-content .card-bottom > span {
  font-size: 16px;
  padding-left: 10;
  padding-right: 50;
  -webkit-line-clamp: 2;
  overflow: hidden;
  max-height: 40;
  text-overflow: ellipsis;
  line-height: 20px;
  -webkit-box-orient: vertical;
  display: -webkit-box;
}
.vertical-categories-games .card-content .category-content .card-bottom .card-icon {
  position: absolute;
  width: 36;
  height: 36;
  color: #fff;
  top: -18;
  right: 10;
  border-radius: 36px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.vertical-categories-games .card-content .category-content .card-bottom .card-icon > i {
  font-size: 22;
}
.vertical-categories-games .card-content .games {
  padding: 0;
}
.vertical-categories-games .card-content .games .game {
  cursor: pointer;
  position: relative;
}
.vertical-categories-games .card-content .games .game:hover > div {
  background-color: aliceblue;
}
.vertical-categories-games .card-content .games .game.is-processing {
  opacity: 0.7;
  cursor: no-drop;
}
.vertical-categories-games .card-content .games .game:first-child > div {
  border-top: 1px solid #bfcef073;
}
.vertical-categories-games .card-content .games .game:last-child > div {
  border-bottom: none;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.vertical-categories-games .card-content .games .game > div {
  border-bottom: 1px solid #bfcef073;
  min-height: 50;
  display: flex;
  flex: 1;
  align-items: center;
  padding-left: 5;
  padding-right: 5;
  position: relative;
  padding-left: 10;
  padding-right: 10;
}
.vertical-categories-games .card-content .games .game > div .processing {
  position: absolute;
  right: 10;
  z-index: 3;
}
.vertical-categories-games .card-content .games .game > div i.active {
  position: absolute;
  right: 10;
  width: 20;
  height: 20;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: limegreen;
  color: #fff;
  border-radius: 20px;
}
.vertical-categories-games .card-content .games .game > div .icon {
  margin-right: 10;
}
.vertical-categories-games .card-content .games .game > div .icon .fa {
  font-size: 20;
}
.vertical-categories-games .card-content .games .game > div .text {
  display: flex;
  flex-direction: column;
  padding-top: 10;
  padding-bottom: 10;
}
.vertical-categories-games .card-content .games .game > div .text .title {
  font-size: 1.1em;
}
.vertical-categories-games .card-content .games .game > div .text .description {
  font-size: 0.9em;
  color: #c4c4c4;
}

.pipeline-box {
  display: flex;
  flex-direction: row;
  padding: 0 20px;
  align-items: center;
  justify-content: space-evenly;
  font-size: 14px;
  min-width: 250px;
}
.pipeline-box:hover {
  cursor: pointer;
}
.pipeline-box:focus {
  outline: none;
}
.pipeline-box .pipeline-label {
  padding-right: 20px;
}
.pipeline-box .pipeline-icon {
  display: inline-block;
}
.pipeline-box .pipeline-icon-separator {
  height: 2px;
  width: 15px;
  background-color: #ccc;
  display: inline-block;
}
.pipeline-modal {
  min-height: 65vh;
  position: relative;
}
.pipeline-modal .pipeline-content > p.name {
  font-size: 1.3em;
  padding-bottom: 10;
  text-align: center;
  width: 90%;
  margin: auto;
  margin-top: 20;
}
.pipeline-modal .pipeline-content > p.description {
  opacity: 0.7;
  padding: 20;
  width: 90%;
  padding-top: 0;
  padding-bottom: 0;
}
.pipeline-modal .button-container {
  margin: 6% 0px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.pipeline-modal .pipeline-progress-container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0px;
  position: relative;
}
.pipeline-modal .pipeline-progress-container .pipeline-progress-text {
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.pipeline-modal .pipeline-progress-container .pipeline-progress-text span.progress-label {
  font-size: 10px;
  margin: -2px 0 2px 0;
}
.pipeline-modal .pipeline-progress-container .pipeline-progress-text span.progress-value {
  font-weight: bold;
  font-size: 20px;
}
.pipeline-modal .pipeline-list-container {
  display: flex;
}
.pipeline-modal .pipeline-list-container .pipeline-item {
  width: 34%;
  cursor: pointer;
  min-height: 32vh;
}
.pipeline-modal .pipeline-list-container .pipeline-item .pipeline-item-header {
  height: 150px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0px 15px;
  background-repeat: no-repeat;
  background-size: cover;
}
.pipeline-modal .pipeline-list-container .pipeline-item .pipeline-item-header .pipeline-item-header-background {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  opacity: 0.4;
}
.pipeline-modal .pipeline-list-container .pipeline-item .pipeline-item-header .pipeline-header-close {
  position: absolute;
  right: 12px;
  top: 12px;
  color: #fff;
  opacity: 0.5;
  font-size: 20px;
  z-index: 9999;
  cursor: pointer;
}
.pipeline-modal .pipeline-list-container .pipeline-item .pipeline-item-header .pipeline-item-title {
  font-weight: bold;
  text-align: center;
  color: #fff;
  z-index: 9999;
}
.pipeline-modal .pipeline-list-container .pipeline-item .pipeline-item-header .pipeline-item-subtitle {
  font-size: 12px;
  text-align: center;
  color: #fff;
  opacity: 0.8;
  z-index: 9999;
}
.pipeline-modal .pipeline-list-container .pipeline-item .pipeline-item-header .pipeline-header-icon-container {
  width: 50px;
  height: 50px;
  background: green;
  border-radius: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: -25px;
}
.pipeline-modal .pipeline-list-container .pipeline-item .pipeline-item-header .pipeline-header-icon-container .pipeline-header-icon {
  font-size: 23px;
  color: #fff;
}
.pipeline-modal .pipeline-list-container .pipeline-item .pipeline-item-body {
  padding: 40px 30px 30px 30px;
}
.pipeline-modal .pipeline-list-container .pipeline-item .pipeline-item-body p {
  text-align: center;
}

.ticketBody {
  width: 100%;
  min-width: 600px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 20px;
}
.ticketBody i {
  margin-right: 4px;
}
.ticketBody .ticketMeta {
  width: 100%;
  margin: auto;
  margin-top: 50px;
  margin-bottom: 30px;
  border-bottom: 1px solid #d8e0f1;
  padding-bottom: 5px;
}
.ticketBody .ticketMeta p:first-child {
  font-size: 26px;
  font-weight: 100;
}
.ticketBody .ticketMeta p:nth-child(2) {
  display: inline-block;
  opacity: 0.7;
}
.ticketBody .ticketMeta p:nth-child(2) span {
  margin-right: 20px;
}
.ticketBody .ticketDesc {
  margin-bottom: 30px;
  position: relative;
}
.ticketBody .ticketDesc > div {
  width: 70px;
  text-align: center;
  margin-right: 20px;
}
.ticketBody .ticketDesc > div > div {
  width: 70px;
  height: 70px;
  text-align: center;
  background: #dbdee8;
  border-radius: 100px;
}
.ticketBody .ticketDesc > div > div i {
  font-size: 32px;
  line-height: 70px;
}
.ticketBody .ticketDesc .created-time {
  position: absolute;
  font-size: 11px;
  width: 200px;
  bottom: -7px;
  right: 0;
  text-align: right;
}
.ticketBody .ticketDesc q {
  background-color: #dbdee8;
  font-style: italic;
  margin-bottom: 10px;
  font-size: 14px;
  border: 1px solid #dbdee8;
  display: block;
  padding: 20px;
  border-radius: 10px;
  flex-grow: 1;
  position: relative;
}
.ticketBody .ticketDesc q::before {
  content: '';
  position: absolute;
  left: -14px;
  top: 13px;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-right: 13px solid #dcdee9;
  border-bottom: 8px solid transparent;
}
.ticketBody .ticketDesc p {
  font-size: 10px;
}
.ticketBody .ticketComments {
  margin-bottom: 30px;
  margin-top: 20px;
  position: relative;
}
.ticketBody .ticketComments > div {
  width: 70px;
  text-align: center;
  margin-left: 20px;
}
.ticketBody .ticketComments > div > div {
  width: 70px;
  height: 70px;
  text-align: center;
  background: #dbdee8;
  border-radius: 100px;
}
.ticketBody .ticketComments > div > div i {
  font-size: 32px;
  line-height: 70px;
}
.ticketBody .ticketComments .created-time {
  position: absolute;
  font-size: 11px;
  width: 200px;
  bottom: -7px;
  left: 0;
  text-align: left;
}
.ticketBody .ticketComments q {
  background-color: #dbdee8;
  font-style: italic;
  margin-bottom: 10px;
  font-size: 14px;
  border: 1px solid #dbdee8;
  display: block;
  padding: 20px;
  border-radius: 10px;
  flex-grow: 1;
  position: relative;
}
.ticketBody .ticketComments q::after {
  content: '';
  position: absolute;
  top: 13px;
  width: 0;
  height: 0;
  border-bottom: 8px solid transparent;
  border-left: 13px solid #dcdee9;
  border-top: 8px solid transparent;
  right: -14px;
}
.ticketBody .ticketComments p {
  font-size: 10px;
}
.ticketBody .ticketImage {
  text-align: center;
}
.ticketBody .ticketImage img {
  width: 100%;
}

.notifications-list {
  padding: 0;
  cursor: initial;
  position: fixed;
  width: 350;
  z-index: 2;
  background-color: #fff;
  top: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  left: 0;
  width: 100%;
  background-color: #22222266;
}
.notifications-list .notif-header {
  display: flex;
  align-items: center;
  padding: 10px 15px;
  position: relative;
}
.notifications-list .notif-header .notif-delete {
  position: absolute;
  right: 15px;
  display: flex;
  cursor: pointer;
}
.notifications-list .notif-header .notif-delete .fa-trash {
  margin-right: 2px;
  font-size: 17px;
}
.notifications-list > div {
  width: 350;
  background-color: #fff;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
}
.notifications-list > div > .fa-times {
  position: absolute;
  font-size: 30px;
  left: -30;
  top: 5;
  color: #36425A;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #fff;
  cursor: pointer;
}
.notifications-list > div div.scrollable-div {
  height: calc(100% - 44px);
}
.notifications-list > div div.scrollable-div > div:nth-child(odd) {
  background-color: #f9f9f9 !important;
  transition-property: all;
  transition-duration: 0.2s;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer.removed {
  transition: opacity 3s ease-in-out;
  opacity: 0;
  cursor: no-drop !important;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer:hover {
  background-color: #dde2f1 !important;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer:hover .notificationMenuItem .removeNotification {
  opacity: 1;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer .notificationMenuItem {
  padding-top: 5px;
  padding-bottom: 5px;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer .notificationMenuItem i.notification-icon {
  line-height: 48px;
  font-size: 20px;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer .notificationMenuItem div.text-content {
  display: flex;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer .notificationMenuItem div.text-content > div {
  margin-top: auto;
  margin-bottom: auto;
  width: 100%;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer .notificationMenuItem div.text-content > div p.title {
  line-height: 1;
  font-weight: bold;
  text-overflow: ellipsis;
  overflow: hidden;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer .notificationMenuItem div.text-content > div p.message {
  line-height: 2;
  text-overflow: ellipsis;
  overflow: hidden;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer .notificationMenuItem > div:first-child {
  width: 30px;
  height: 48px;
  display: flex;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer .notificationMenuItem > div:first-child img {
  width: 100%;
  margin: auto;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer .notificationMenuItem > div:nth-child(2) {
  flex: 1;
  padding-left: 2px;
  font-size: 13px;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100px !important;
}
.notifications-list > div div.scrollable-div .notificationMenuItemContainer .notificationMenuItem .removeNotification {
  opacity: 0;
  display: block;
  position: absolute;
  right: 0px;
  top: 0px;
  width: 24px;
  height: 24px;
  font-size: 16px;
  background: #7094d4;
  color: white;
  text-align: center;
  line-height: 23px;
  border-bottom-left-radius: 12px;
  padding-left: 1px;
  padding-top: 2px;
  padding-bottom: 2px;
  transition-property: all;
  transition-duration: 0.2s;
}
.notificationDialog .notificationData {
  margin-top: 30px;
}
.notificationDialog .chatgroup-notification .title {
  margin-top: 40px;
  border-bottom: 5px solid #efeff1;
  padding-bottom: 5px;
  font-size: 1.5em;
}
.notificationDialog .chatgroup-notification .participants {
  margin-right: auto;
  margin-left: auto;
  text-align: left;
}
.notificationDialog .chatgroup-notification .participants .users-list {
  padding: 13px 20px 20px;
  background: #fbfbfb;
  display: flex;
  flex: 1;
  overflow-y: auto;
}
.notificationDialog .chatgroup-notification .participants .users-list .user-info {
  display: flex;
  flex-direction: column;
  min-width: 80;
  /* align-items: center; */
  /* justify-content: center; */
  margin: 10;
}
.notificationDialog .chatgroup-notification .participants .users-list .user-info .name {
  font-size: 1em;
  text-align: center;
  height: 40;
}

.fullscreen-message {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background-color: #4bb65d;
  color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.fullscreen-message i.icon {
  font-size: 100;
}
.fullscreen-message span.message {
  font-size: 30;
}

.public-info-activities-container {
  display: flex;
  min-height: 70vh;
  flex: 1;
  /* padding-top: 15; */
  flex-direction: column;
  overflow: hidden;
  /* justify-content: center; */
  /* align-items: center; */
  /* height: 100%; */
  width: 100%;
}
.public-info-activities-container .filters {
  display: block;
  padding: 15;
  height: 20;
}
.public-info-activities-container .filters > div {
  display: flex;
  justify-content: flex-end;
}
.public-info-activities-container .filters > div > div {
  display: flex !important;
  flex: 0;
  margin-left: 20;
}
.public-info-activities-container .filters > div > div > div > div {
  margin-right: 3px !important;
}
.public-info-activities-container .filters > div > div > div label {
  white-space: nowrap;
}
.public-info-activities-container .ngager-list .item {
  cursor: default;
}
.public-info-activities-container .ngager-list .item .fullName {
  font-size: 15;
  font-weight: bold;
}
.public-info-activities-container .ngager-list .item .buttons {
  display: flex;
  flex: 0;
  align-items: center;
}
.public-info-activities-container .ngager-list .item .buttons .ngager-button:hover {
  box-shadow: 0px 0px 10px #888;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.modal-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-height: 100%;
  flex: 1;
}
.modal-wrapper .header-content {
  background-color: #222222;
  text-align: center;
  display: flex;
  width: 100%;
  justify-content: center;
}
.modal-wrapper .body-content {
  font-size: 1rem;
  text-align: center;
  padding-bottom: 20px;
  display: block;
  width: 100%;
}
.modal-wrapper .body-content.chapter-completed h1,
.modal-wrapper .body-content.chapter-intro h1 {
  margin-top: 10px;
  display: block;
  font-weight: bold;
  font-size: 2em;
  color: #36425a;
}
.modal-wrapper .body-content.chapter-completed .message,
.modal-wrapper .body-content.chapter-intro .message {
  font-weight: bold;
  padding: 20;
}
.modal-wrapper .body-content.chapter-completed .description,
.modal-wrapper .body-content.chapter-intro .description {
  text-align: justify;
  padding: 20;
}
.modal-wrapper .actions-content {
  padding-top: 20px;
}
.modal-wrapper .insult {
  flex: 1;
  font-size: 1.4rem;
  color: red;
}
.modal-container {
  display: none;
}
.modal-container.active {
  display: block;
}
.modal-container .overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #000;
  opacity: 0.9;
  z-index: 100;
}
.modal-container .modal {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100vh;
  z-index: 1000;
  overflow: auto;
}
.modal-container .modal .modal-content {
  min-width: 300px;
  min-height: 300;
  max-height: 90%;
  opacity: 1;
  overflow-y: overlay;
  overflow-x: hidden;
  position: relative;
  display: flex;
  background-color: #f0f4fc;
  /* background-color: #FFFFFF; */
}
.modal-container .modal .modal-content > .fa-times {
  position: absolute;
  font-size: 30;
  right: 0;
  top: 0;
  color: brown;
  -webkit-text-stroke-width: 3px;
  -webkit-text-stroke-color: #fff;
  cursor: pointer;
  z-index: 9999;
}
.modal-container .modal .modal-content .cards-container .card .card-indicator {
  width: 0;
  height: 0;
  border-left: 40px solid transparent;
  position: absolute;
  top: 0;
  right: 0;
}
.modal-container .modal .modal-content .cards-container .card .card-indicator.active {
  border-top: 40px solid #9acf61;
}
.modal-container .modal .modal-content .cards-container .card .card-indicator.active i {
  position: absolute;
  top: -37px;
  left: -20px;
  color: #f0f4fc;
  font-size: 16px;
}
.modal-container .modal .modal-content .cards-container .card .card-indicator.inactive {
  border-top: 40px solid #f55e53;
}
.modal-container .modal .modal-content .cards-container .card .card-indicator.inactive i {
  position: absolute;
  top: -37px;
  left: -17px;
  color: #f0f4fc;
  font-size: 16px;
}
.modal-container .modal .modal-content .cards-container .card .card-content .icon {
  width: 50px;
  height: 50px;
  vertical-align: middle;
  font-size: 24px;
  border-radius: 100px;
  color: white;
  margin: -23px auto auto auto;
  position: relative;
}
.modal-container .modal .modal-content .cards-container .card .card-content .icon .avatar {
  width: 50px;
  height: 50px;
  border-radius: 100px;
  background-color: #ffffff;
  color: #778091;
}
.modal-container .modal .modal-content .cards-container .card .card-content .icon .avatar .fa-user {
  font-size: 1.2em;
  line-height: 50px;
}
.modal-container .modal .modal-content .cards-container .card .card-content i {
  line-height: 50px;
}
.modal-container .modal .modal-content .cards-container .card .card-content .title {
  color: #667daf;
}
.modal-container .modal .modal-content .cards-container .card .card-content .subTitle {
  color: #778091;
}

.achievements {
  margin-top: 30px;
  margin-bottom: 100px;
  margin-left: 30px;
  margin-right: 30px;
  text-align: center;
}
.achievements .animated {
  animation-delay: 1s;
}
.achievements div {
  flex-grow: 1;
}
.achievements div span {
  font-size: 42px;
  font-weight: 100;
  vertical-align: middle;
}
.achievements div i {
  font-size: 90px;
  height: 50px;
  line-height: 56px;
  margin-top: 4px;
}
.achievements div img {
  height: 50px;
  vertical-align: middle;
}

.ngager-user-picker {
  display: flex;
  flex: 1;
  flex-direction: column;
  color: #5d76aa;
  min-height: 200;
}
.ngager-user-picker > div {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ngager-user-picker .filter {
  max-height: 50;
  border-bottom: 1px solid #bcd1f9;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.ngager-user-picker .filter .ngager-selectfield {
  margin-left: 0;
  background-color: transparent;
  margin-bottom: 3px;
  border: none;
  flex: 0;
  max-width: 200;
}
.ngager-user-picker .filter .ngager-selectfield .selected-value > span:last-child {
  font-weight: normal;
}
.ngager-user-picker .filter .search-icon {
  font-size: 15;
  color: #829acf;
  max-width: 20;
}
.ngager-user-picker .filter .text {
  display: inline-flex;
  flex: 1;
  position: relative;
  margin-right: 10;
  align-items: center;
}
.ngager-user-picker .filter .text .fa-times {
  position: absolute;
  right: 0;
  font-size: 18;
  color: coral;
  cursor: pointer;
}
.ngager-user-picker .filter .text input {
  height: 30;
  background-color: transparent;
  border: none;
  margin-left: 10;
  color: #5d76aa;
  width: 100%;
}
.ngager-user-picker .filter .text input::-moz-placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #5d76aa;
  opacity: 1;
  /* Firefox */
}
.ngager-user-picker .filter .text input::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #5d76aa;
  opacity: 1;
  /* Firefox */
}
.ngager-user-picker .filter .text input:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #5d76aa;
}
.ngager-user-picker .filter .text input::-ms-input-placeholder {
  /* Microsoft Edge */
  color: #5d76aa;
}
.ngager-user-picker .users-list {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  flex-direction: row;
  overflow: auto;
  justify-content: normal;
}
.ngager-user-picker .users-list .loading {
  display: none;
  margin-bottom: 5;
  width: 100%;
  text-align: center;
}
.ngager-user-picker .users-list .user {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 70;
  height: 110;
  flex-direction: column;
  margin: 15;
  cursor: pointer;
}
.ngager-user-picker .users-list .user .avatar-container {
  padding: 6px;
}
.ngager-user-picker .users-list .user.selected .avatar-container {
  padding: 3px;
  border: 3px solid #8ec22f;
  border-radius: 60px;
  background-color: #fff;
}
.ngager-user-picker .users-list .user .name {
  min-height: 35;
  margin-top: 5;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  text-align: center;
  font-size: 0.9em;
}
.ngager-user-picker .selected-users {
  display: flex;
  flex-wrap: nowrap;
  align-content: flex-start;
  flex-direction: row;
  overflow: auto;
  max-height: 105;
  background-color: #283850;
  overflow-x: auto;
  overflow-y: hidden;
  justify-content: flex-start;
  align-items: center;
  color: #fff;
}

.horizontal-users {
  display: flex;
  flex-wrap: nowrap;
  align-content: flex-start;
  flex-direction: row;
  overflow: auto;
  max-height: 90;
  background-color: #283850;
  overflow-x: auto;
  overflow-y: hidden;
  justify-content: flex-start;
  align-items: center;
  color: #fff;
}
.horizontal-users .user {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 75;
  width: 75;
  flex-direction: column;
  margin-left: 10;
  margin-right: 10;
}
.horizontal-users .user .avatar-container {
  padding: 4px;
  border-radius: 30px;
  background-color: #ffffffbf;
  position: relative;
}
.horizontal-users .user .avatar-container .avatar {
  width: 30;
  height: 30;
  border-radius: 30px;
  display: flex;
  background-size: cover;
}
.horizontal-users .user .avatar-container .avatar i.user-icon {
  margin: auto;
  font-size: 22;
  color: #5d76aa;
}
.horizontal-users .user .avatar-container .remove-button {
  position: absolute;
  width: 18;
  height: 18;
  cursor: pointer;
  border-radius: 18px;
  background-color: #fff;
  display: flex;
  top: -5px;
  left: -5px;
}
.horizontal-users .user .avatar-container .remove-button i.icon {
  margin: auto;
  color: #6c81af;
}
.horizontal-users .user .name {
  font-size: 11px;
  margin-top: 5;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  text-align: center;
  white-space: nowrap;
}

.endorsement-form {
  width: 100%;
  max-width: 930;
  display: flex;
  flex-direction: column;
  margin: auto;
  overflow: hidden;
  height: 100%;
  margin-top: 5;
}
.endorsement-form .user-picker {
  display: flex;
  flex: 1;
  flex-direction: column;
  margin-bottom: 50;
}
.endorsement-form .motivation-text {
  display: flex;
  min-height: 80;
  background-color: #e1e9fc;
  border-color: #bfd6ff;
  margin: 0;
  margin-bottom: 20;
  padding: 10;
  color: #6c81af;
}
.endorsement-form .button {
  height: 50;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.story {
  flex-direction: column;
  flex-grow: 1;
  /*start footer*/
  /*end footer*/
}
.story > div {
  flex-direction: column;
  /*start contentConsuming*/
  /*End contentConsuming*/
}
.story > div > div {
  height: calc(100% - 10px);
}
.story > div .resourcesColumn {
  margin-right: 30px;
  width: 35%;
  max-width: 400px;
  background-color: #e9ecf6;
}
.story > div .resourcesColumn .resourcesList {
  overflow: auto;
  height: 100% !important;
}
.story > div .resourcesColumn .resourcesList::-webkit-scrollbar {
  width: 8px;
}
.story > div .resourcesColumn .resourcesList:hover::-webkit-scrollbar {
  background: #d2def5;
}
.story > div .resourcesColumn .resourcesList:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.story > div .resourcesColumn .resourcesList .chapter {
  position: relative;
  color: white;
  height: 170px;
  overflow: hidden;
}
.story > div .resourcesColumn .resourcesList .chapter:not(:last-child) {
  margin-bottom: 1px;
}
.story > div .resourcesColumn .resourcesList .chapter img {
  width: 100%;
}
.story > div .resourcesColumn .resourcesList .chapter .selected {
  position: absolute;
  top: 6px;
  right: 5px;
  text-align: center;
  z-index: 10;
}
.story > div .resourcesColumn .resourcesList .chapter .selected i {
  background-color: #dadada;
  height: 22px;
  border-radius: 100px;
  color: white;
  width: 22px;
  line-height: 22px;
  font-size: 10px;
  margin: auto;
  background-color: #9acf61;
  border: 2px solid #e2f9ca;
}
.story > div .resourcesColumn .resourcesList .chapter .locked {
  position: absolute;
  top: 6px;
  right: 5px;
  text-align: center;
  z-index: 10;
}
.story > div .resourcesColumn .resourcesList .chapter .locked i {
  background-color: #dadada;
  height: 22px;
  color: #f55e53;
  width: 22px;
  line-height: 22px;
  font-size: 30px;
  margin: auto;
  background-color: transparent;
}
.story > div .resourcesColumn .resourcesList .chapter .chapter-overlay {
  position: absolute;
  text-align: center;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  background-color: #fff;
  opacity: 0.6;
}
.story > div .resourcesColumn .resourcesList .chapter .chapter-dimmer {
  position: absolute;
  text-align: center;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  background-color: #222;
  opacity: 0.5;
}
.story > div .resourcesColumn .resourcesList .chapter .chapter-content {
  position: absolute;
  text-align: center;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  display: flex;
  cursor: pointer;
  z-index: 1;
}
.story > div .resourcesColumn .resourcesList .chapter .chapter-content .title {
  margin: auto;
  font-size: 20px;
}
.story > div .contentConsuming {
  flex-grow: 1;
  background-color: #e8ecf5;
  background-image: url(/f766990dc43ac2ab42a444ac98a4ea0f.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
  position: relative;
  width: 80%;
  overflow: auto;
  text-align: center;
}
.story > div .contentConsuming .fullscreen {
  color: #36425A;
  cursor: pointer;
  font-size: 20px;
  left: 15px;
  position: absolute;
  top: 15px;
  z-index: 5;
}
.story > div .contentConsuming .resourceHeader {
  transition-property: all;
  transition-duration: 0.3s;
  z-index: 10000;
  position: absolute;
  top: 0;
  left: -200px;
  line-height: 40px;
  color: #ff9a00;
  font-size: 18px;
  background-color: rgba(255, 255, 255, 0.52);
  border-bottom-right-radius: 90px;
  padding: 0 30px 0px 15px;
}
.story > div .contentConsuming .resourceHeader i {
  outline: none;
}
.story > div .contentConsuming .resourceHeader i.fa.fa-share-alt {
  cursor: pointer;
}
.story > div .contentConsuming .resourceHeader i.clickable {
  cursor: pointer;
}
.story > div .contentConsuming .resourceHeader .fa-share-alt {
  color: #7b7979;
  margin-right: 15px;
}
.story > div .contentConsuming .resourceHeader .fa-star,
.story > div .contentConsuming .resourceHeader .fa-star-o {
  margin-right: 2px;
  line-height: 45px;
}
.story > div .contentConsuming video {
  cursor: pointer;
}
.story > div .contentConsuming:hover .resourceHeader {
  left: 0;
}
.story > div .contentConsuming audio {
  width: 100%;
  height: 100%;
  background-image: url(/be267aaf83a4542384734b6a8479d4ba.svg);
  background-repeat: no-repeat;
  background-position: 53% 50%;
  background-size: 100px;
  cursor: pointer;
}
.story > div .contentConsuming .intro-container {
  width: 100%;
  height: 91%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #000;
}
.story > div .contentConsuming .intro-container p {
  color: #fff;
  font-weight: 400;
  font-size: 40px;
}
.story > div .contentConsuming .intro-container .resourceHeader {
  cursor: pointer;
}
.story > div .contentConsuming .intro-container .resourceHeader span {
  margin-left: 5px;
}
.story .chapter-container {
  margin-top: 20px;
}
.story .chapter-list-column {
  width: 400px;
}
.story .footer {
  position: absolute;
  bottom: 0;
  height: 40px;
}
.chapter-dialog .gameCompletionMessage {
  font-size: 50px;
  font-weight: 600;
  color: #9acf61;
  margin-top: 120px;
}
.chapter-dialog .gameIconContainer {
  position: absolute;
  width: 150px;
  height: 150px;
  color: white;
  text-align: center;
  border-radius: 150px;
  top: -50px;
  left: calc(50% - 75px);
  border: 5px solid white;
}
.chapter-dialog .gameIconContainer i {
  font-size: 64px;
  line-height: 150px;
}
.chapter-dialog .gameIconContainer + div {
  margin-top: 15px;
}
.chapter-dialog .achievements {
  margin-top: 50px;
  margin-bottom: 100px;
  margin-left: 30px;
  margin-right: 30px;
}
.chapter-dialog .achievements .animated {
  animation-delay: 1s;
}
.chapter-dialog .achievements div {
  flex-grow: 1;
}
.chapter-dialog .achievements div span {
  font-size: 42px;
  font-weight: 100;
  vertical-align: middle;
}
.chapter-dialog .achievements div i {
  font-size: 90px;
  height: 50px;
  line-height: 56px;
  margin-top: 4px;
}
.chapter-dialog .achievements div img {
  height: 50px;
  vertical-align: middle;
}
.chapter-dialog .body {
  text-align: center;
  padding: 0 !important;
  border: none !important;
}
.chapter-dialog .actions {
  text-align: center !important;
  padding-bottom: 30 !important;
}

.dialog-game-container {
  padding: 0 !important;
  font-size: 1rem;
  display: flex;
  flex: 1;
}
.dialog-game-container .game-media {
  position: relative;
  display: flex;
  background-color: #a2a2a2;
  justify-content: center;
  width: 100%;
  height: 600;
}
.dialog-game-container .game-media > div.game-resource {
  margin: auto;
  display: flex;
  justify-content: center;
  flex: 1;
  height: 100%;
  width: 100%;
}
.dialog-game-container .game-media .buttonsContainer {
  margin-top: 0 !important;
  position: absolute;
  top: -50;
  height: 80;
  width: 150;
  background-color: #d4d4d4;
  display: flex;
  border-bottom-left-radius: 40px;
  border-bottom-right-radius: 40px;
  justify-content: center;
  align-items: flex-end;
  padding-bottom: 15;
  font-size: 1em;
  color: #dd2874;
  cursor: pointer;
  z-index: 9;
}
.dialog-game-container .game-media .buttonsContainer .fa {
  font-size: 20;
  margin-left: 5;
}
.dialog-game-container .closeActiveGame {
  position: absolute;
  right: 10px;
  top: 10px;
  outline: none;
  font-size: 16px;
  color: #ffffff;
  cursor: pointer;
  z-index: 999;
  opacity: 0.8;
  background-color: #222;
  width: 24px;
  height: 20px;
  text-align: center;
  padding-top: 4px;
  border-radius: 40px;
  border: 1px solid;
}
.dialog-game-container::-webkit-scrollbar {
  width: 8px;
}
.dialog-game-container:hover::-webkit-scrollbar {
  background: #d2def5;
}
.dialog-game-container:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.dialog-game-container .save-button-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
.dialog-game-container .save-button-container.slider {
  bottom: 0;
  right: 30px;
  position: absolute;
  padding-right: 0;
}
.dialog-game-container .save-button-container.dynamicreflection {
  position: relative;
  padding-right: 0;
  padding-top: 0;
}
.dialog-game-container .save-button-container .awesome-button {
  min-width: 100px !important;
  margin-left: 30px;
  border-width: 1px;
  border-style: solid;
  border-color: #ddd;
  border-radius: 36px;
  box-shadow: none !important;
}
.dialog-game-container .save-button-container .awesome-button input {
  border-radius: 30px;
}
.dialog-game-container .waypoint-game-container {
  display: flex;
  position: relative;
  max-height: 100%;
}
.dialog-game-container .waypoint-game-container .game-media {
  position: relative;
  display: flex;
  background-color: #a2a2a2;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.dialog-game-container .waypoint-game-container .game-media > div.game-resource {
  margin: auto;
  display: flex;
  justify-content: center;
  flex: 1;
  height: 100%;
  width: 100%;
}
.dialog-game-container .waypoint-game-container .game-media .buttonsContainer {
  margin-top: 0 !important;
  position: absolute;
  top: -50;
  height: 80;
  width: 150;
  background-color: #d4d4d4;
  display: flex;
  border-bottom-left-radius: 40px;
  border-bottom-right-radius: 40px;
  justify-content: center;
  align-items: flex-end;
  padding-bottom: 15;
  font-size: 1em;
  color: #dd2874;
  cursor: pointer;
  z-index: 9;
}
.dialog-game-container .waypoint-game-container .game-media .buttonsContainer .fa {
  font-size: 20;
  margin-left: 5;
}
.dialog-game-container .waypoint-game-container .sidebar {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  width: 80px;
  height: 100%;
  z-index: 999;
  position: absolute;
  top: 0;
  bottom: 0;
}
.dialog-game-container .waypoint-game-container .sidebar .game-icon {
  background-color: #f0f4fc;
  width: 80px;
  height: 80px;
  border-radius: 100px;
  position: absolute;
  left: 51%;
  top: 110px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.dialog-game-container .waypoint-game-container .sidebar .game-icon i {
  font-size: 40px;
}
.dialog-game-container .waypoint-game-container .sidebar .exp {
  color: #fff;
  font-size: 25px;
  font-weight: bold;
  position: sticky;
  bottom: 50px;
}
.dialog-game-container .waypoint-game-container .sidebar .exp-label {
  color: #fff;
  font-size: 12px;
  position: sticky;
  bottom: 40px;
}
.dialog-game-container .waypoint-game-container .sidebar .mandatory {
  color: #fff;
  font-size: 20px;
  position: sticky;
  bottom: 15px;
}
.dialog-game-container .waypoint-game-container .body {
  position: relative;
  margin-left: 80px;
  max-height: 100%;
  overflow: auto;
  display: flex;
  flex: 1;
  flex-direction: column;
  min-height: 400;
  height: 90vh;
}
.dialog-game-container .waypoint-game-container .body .target-container {
  background-color: #e7ebf9;
  padding-left: 20;
}
.dialog-game-container .waypoint-game-container .body .header-image {
  min-height: 400;
  background-color: #a2a2a2;
  display: flex;
  flex-direction: column;
  max-height: 400;
}
.dialog-game-container .waypoint-game-container .body .game-body.act {
  padding-top: 50;
}
.dialog-game-container .waypoint-game-container .body .game-container .game-body {
  width: auto;
  padding-left: 50;
  padding-right: 50;
  margin: 0;
}
.dialog-game-container .waypoint-game-container .body .game-container.handle-ticket .game-body {
  padding-left: 0;
  padding-right: 0;
}
.dialog-game-container .waypoint-game-container .body .feedback-container {
  width: auto;
  margin: 0;
  overflow: hidden;
}
.dialog-game-container .waypoint-game-container .body .feedback-container.instant-feedback .select-users {
  width: auto;
  padding: 30;
  margin: 0;
}
.dialog-game-container .waypoint-game-container .body .feedback-container.instant-feedback .select-users .ngager-tabs {
  z-index: 2;
}
.dialog-game-container .waypoint-game-container .body .feedback-container.instant-feedback .select-users .ngager-user-picker {
  z-index: 1;
}
.dialog-game-container .waypoint-game-container .body .feedback-container.instant-feedback .navigation {
  margin-bottom: 10;
}
.dialog-game-container .waypoint-game-container .body .feedback-container.instant-feedback .finalize .survey-form {
  left: 50;
  right: 50;
  width: auto;
}
.dialog-game-container .waypoint-game-container .body .feedback-container.instant-feedback .finalize .survey-form .form-inputs .ngager-survey-questions {
  padding-left: 40;
}
.dialog-game-container .waypoint-game-container .body::-webkit-scrollbar {
  width: 8px;
}
.dialog-game-container .waypoint-game-container .body:hover::-webkit-scrollbar {
  background: #d2def5;
}
.dialog-game-container .waypoint-game-container .body:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.dialog-game-container .waypoint-game-container .body .bg-img {
  height: 300px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.dialog-game-container .waypoint-game-container .body .bg-img img {
  height: 100%;
  width: 100%;
}
.dialog-game-container .waypoint-game-container .body .body-content {
  position: relative;
  margin: 0;
  width: 100%;
  /*end body-content*/
}
.dialog-game-container .waypoint-game-container .body .body-content .progress {
  width: 100%;
  position: relative;
  margin-top: 15px;
  height: 160px;
  align-self: flex-end;
}
.dialog-game-container .waypoint-game-container .body .body-content .description {
  padding: 20;
  text-align: center;
}
.dialog-game-container .waypoint-game-container .body .body-content .cooldown {
  position: relative;
  margin: 30px 0 0 0;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #fff;
  border-radius: 10px;
}
.dialog-game-container .waypoint-game-container .body .body-content .cooldown .cooldown-icon {
  position: absolute;
  right: -3%;
  border-radius: 100px;
  border: 1px solid #fff;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.dialog-game-container .waypoint-game-container .body .body-content .cooldown .cooldown-icon i {
  transform: rotate(45deg);
}
.dialog-game-container .waypoint-game-container .body .body-content .cooldown .title {
  font-size: 20px;
  margin-bottom: 30px;
}
.dialog-game-container .waypoint-game-container .body .body-content .cooldown .cooldown-description {
  font-size: 12px;
  margin-bottom: 5px;
}
.dialog-game-container .waypoint-game-container .body .body-content .cooldown .cooldown-value {
  display: flex;
  justify-content: center;
  align-items: center;
}
.dialog-game-container .waypoint-game-container .body .body-content .cooldown .cooldown-value .value {
  font-size: 25px;
}
.dialog-game-container .waypoint-game-container .body .body-content .cooldown .cooldown-value .label {
  font-size: 12px;
  padding: 0 15px 0 5px;
}
.dialog-game-container .waypoint-game-container .body .body-content .waypointProgress {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
}
.dialog-game-container .waypoint-game-container .body .body-content .waypointProgress .counter {
  font-size: 32px !important;
  font-weight: 600;
  margin-top: -17px;
}
.dialog-game-container .waypoint-game-container .body .body-content .waypointProgress .progressInfo {
  margin-top: -70px;
  position: relative;
  font-size: 11px;
  font-weight: normal;
  line-height: 1.3;
  text-align: center;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.page {
  flex-grow: 1;
  flex-direction: column;
  padding: 11px 30px 0;
}
.page > header {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #b3ccfe;
  padding-bottom: 8px;
}
.page > header .notificationMenu {
  display: flex;
  justify-content: center;
  position: relative;
  margin-bottom: 10px;
}
.page > header .notificationMenu .notificationCounter {
  position: absolute;
  background: #f55d53;
  border-radius: 30px;
  color: white;
  font-size: 10px;
  z-index: 2;
  padding: 3px;
  left: 25px;
  top: 2px;
  min-width: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.page > header .notificationMenu [role='menu'] {
  padding: 0 !important;
  margin-right: 12px;
}
.page > header .notificationMenu button.active svg {
  fill: #ffffff !important;
}
.page > header .globalNotificationIndicator {
  position: absolute;
  background-color: #f55e53;
  color: white;
  text-align: center;
  border-radius: 100px;
  width: 20px;
  height: 20px;
  font-size: 8px;
  line-height: 20px;
  right: 20px;
  top: 24px;
}
.page > header > .header-title {
  justify-content: flex-start;
  text-transform: capitalize;
  font-size: 14px;
  font-weight: 100;
  flex-wrap: wrap;
  flex: 1;
}
.page > header > .header-title > div {
  line-height: 23px;
}
.page > header > .header-title.return-page {
  width: auto;
  flex: inherit;
  margin-right: 10px;
}
.page > header > .header-title.return-page .fa-arrow-left {
  margin-right: 5px;
  font-size: 20px;
  color: #9fb3d8;
}
.page > header > .header-title .title.link {
  cursor: pointer;
  color: #36425A;
  display: inline-flex;
  font-weight: bold;
}
.page > header > .header-title .title.link > span {
  text-overflow: ellipsis;
  overflow: hidden;
  /* max-width: 100px; */
  white-space: nowrap;
}
.page > header > .header-title .fa-angle-right {
  font-size: 16px;
  margin: 0 10px;
  color: #36425A;
}
.page > header > .header-title .fa-home {
  font-size: 20px;
  color: #9fb3d8;
}
.page > header > div {
  display: flex;
  justify-content: center;
  align-items: center;
}
.page > header > div .help {
  margin-right: 4px;
}
.page > header > div .help i {
  font-size: 18px;
  color: #36425A;
}
.page > header > div .user {
  border-radius: 100px;
  width: 40px;
  height: 40px;
  overflow: hidden;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  font-size: 16px;
  background: #36425A;
  color: #f0f4fc;
}
.page > header > div .user > div {
  background-repeat: no-repeat;
  background-size: cover;
}
.page > header .topMenuUserName {
  font-size: 14px;
}
.page .moduleHolder {
  position: absolute;
  right: 30px;
  left: 30px;
  bottom: 20;
  top: 90px;
  z-index: 1;
  min-height: 600;
  transition-duration: 0.4s;
  transition-property: all;
}
.page .moduleHolder .left-column {
  width: 25%;
  max-width: 400;
  min-width: 350;
  padding-right: 5px;
}
.page .moduleHolder > .reflection,
.page .moduleHolder > .quiz {
  flex: 1 1 0%;
  flex-grow: 1;
  height: 100%;
  display: flex;
  width: 100%;
  margin: auto;
  flex-direction: column;
}
.page .moduleHolder > .reflection > div,
.page .moduleHolder > .quiz > div {
  flex: 1;
  display: flex;
  justify-content: center;
  height: 100%;
}
.page .moduleHolder > .reflection .contentConsuming,
.page .moduleHolder > .quiz .contentConsuming {
  flex-grow: 1;
  background-color: #e8ecf5;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  margin-top: 15;
  overflow: auto;
  background-image: none;
  display: flex;
}
.page .moduleHolder > .reflection .contentConsuming .page-not-found,
.page .moduleHolder > .quiz .contentConsuming .page-not-found {
  height: unset;
}
.page .moduleHolder > .reflection .contentConsuming > div,
.page .moduleHolder > .quiz .contentConsuming > div {
  display: flex;
  flex: 1;
}
.page .moduleHolder .game-icon-wrapper {
  position: relative;
}
.page .moduleHolder .game-icon-wrapper .resource-container {
  background-color: #dde0ea;
}
.page .moduleHolder .game-icon-wrapper .game-background {
  width: 100%;
  height: 90;
  background-color: #36425A;
  opacity: 0.8;
}
.page .moduleHolder .game-icon-wrapper .gameIconContainer {
  width: 80px;
  height: 80px;
  border-radius: 100px;
  position: absolute;
  z-index: 99;
  background-color: #ffffff;
  left: calc(50% - 40px);
  top: 20px;
  text-align: center;
  border: 2px solid #ffffff;
}
.page .moduleHolder .game-icon-wrapper .gameIconContainer i {
  line-height: 80px;
  color: #ffffff;
  font-size: 40px;
}
.page .moduleHolder .game-icon-wrapper .gameIconContainer.noBackgroundColor i {
  color: #222;
}
.page .moduleHolder .game-media {
  position: relative;
  display: flex;
  justify-content: center;
  width: 100%;
  flex: 1;
}
.page .moduleHolder .game-media > div.game-resource {
  margin: 0;
  display: flex;
  justify-content: center;
  flex: 1;
  width: 100%;
}
.page .moduleHolder .game-media > div.game-resource .resource-container {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.page .moduleHolder .game-media .buttonsContainer {
  margin-top: 0 !important;
  position: absolute;
  top: -50;
  height: 80;
  width: 150;
  background-color: #d4d4d4;
  display: flex;
  border-bottom-left-radius: 40px;
  border-bottom-right-radius: 40px;
  justify-content: center;
  align-items: flex-end;
  padding-bottom: 15;
  font-size: 1em;
  color: #dd2874;
  cursor: pointer;
  z-index: 9;
}
.page .moduleHolder .game-media .buttonsContainer .fa {
  font-size: 20;
  margin-left: 5;
}
.select-instance .cards-container {
  justify-content: center;
  margin-top: 86px;
}
.select-instance .cards-container .card {
  margin: 20px;
}
.select-instance .cards-container .card header {
  display: flex;
}
.select-instance .cards-container .card header img {
  margin: auto;
  max-width: 170px;
  height: auto;
}
.select-instance .cards-container .card header img.empty-instance-image {
  width: 102%;
  max-width: none;
  margin-top: -52px;
  margin-left: -3px;
}
.select-instance .no-results {
  margin-top: 50px;
}
.ngager-icon {
  position: relative;
}
.ngager-icon.todo .notice-number {
  position: absolute;
  left: -15px;
  top: 0;
  min-width: 30;
  max-width: 100;
  height: 30;
  background-color: #ed9292;
  display: flex;
  border-radius: 30px;
}
.ngager-icon.todo .notice-number > span {
  color: #fff;
  margin: auto;
  font-size: 14px;
  padding: 5;
}
.ngager-carousel-container {
  margin: 0 auto;
  padding: 0;
  width: 100%;
  height: 100%;
  color: #333;
  overflow-y: hidden !important;
  padding-top: 15;
  max-width: 1000;
  padding-bottom: 0;
  display: flex;
  flex-direction: column;
  flex: 1;
  height: -moz-fit-content;
  height: fit-content;
}
.ngager-carousel-container .slide-item {
  margin: 0;
  position: relative;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ngager-carousel-container .slick-track {
  padding-top: 0;
  margin: auto;
  min-width: 300;
}
.ngager-carousel-container .slick-slider {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
}
.ngager-carousel-container .slick-dots {
  bottom: inherit !important;
  position: relative;
  display: flex !important;
  overflow: hidden;
  width: -moz-fit-content;
  width: fit-content;
  margin: auto;
  padding: 10;
}
.ngager-carousel-container .slick-dots > li > button::before {
  font-size: 8px;
  color: #5186ed;
}
.ngager-carousel-container .slick-dots > li.slick-active > button::before {
  color: #5186ed;
  opacity: 1;
}
.ngager-carousel-container .slick-next:before,
.ngager-carousel-container .slick-prev:before {
  color: #6c81af;
}
.ngager-carousel-container .slick-prev {
  left: 5;
}
.ngager-carousel-container .slick-next {
  right: 5;
}
.ngager-carousel-container .slick-list {
  margin-left: 40;
  margin-right: 40;
  display: flex;
  flex: 1;
  flex-direction: column;
}
.ngager-carousel-container .slick-track {
  height: 100%;
}
.ngager-carousel-container .slick-slide {
  position: relative;
  z-index: 1;
}
.ngager-carousel-container .slick-slide > div {
  height: 100%;
  display: flex;
  justify-content: center;
}
.ngager-carousel-container .slick-slide .slide-item {
  opacity: 0.3;
  min-width: 330;
  max-width: 330;
}
.ngager-carousel-container .slick-slide .slide-item > div {
  height: 100%;
}
.ngager-carousel-container .slick-current {
  z-index: 2;
}
.ngager-carousel-container .slick-current .slide-item {
  opacity: 1;
  transition: all 0.3s ease-in-out;
}
.ngager-carousel-container .items-list {
  overflow: auto;
  margin-top: 20px;
  height: auto;
  flex: 1;
}
.ngager-carousel-container .items-list::-webkit-scrollbar {
  width: 8px;
}
.ngager-carousel-container .items-list:hover::-webkit-scrollbar {
  background: #d2def5;
}
.ngager-carousel-container .items-list:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.scrollable-div {
  overflow: auto;
  height: 100%;
  position: relative;
}
.scrollable-div div.loading {
  display: none;
  width: 100%;
  text-align: center;
  position: sticky;
  bottom: 10;
  margin-top: 20;
}
.quarter-circle-top-left {
  width: 100px;
  height: 100px;
  background: red;
  border-radius: 0 0 100px 0;
  -moz-border-radius: 0 0 100px 0;
  -webkit-border-radius: 0 0 100px 0;
}
.quarter-circle-top-right {
  width: 100px;
  height: 100px;
  background: blue;
  border-radius: 0 0 0 100px;
  -moz-border-radius: 0 0 0 100px;
  -webkit-border-radius: 0 0 0 100px;
}
.quarter-circle-bottom-left {
  width: 100px;
  height: 100px;
  background: green;
  border-radius: 0 100px 0 0;
  -moz-border-radius: 0 100px 0 0;
  -webkit-border-radius: 0 100px 0 0;
}
.quarter-circle-bottom-right {
  width: 100px;
  height: 100px;
  background: orange;
  border-radius: 100px 0 0 0;
  -moz-border-radius: 100px 0 0 0;
  -webkit-border-radius: 100px 0 0 0;
}
.search-box {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-basis: 100%;
  max-height: 50;
}
.search-box .fa-search {
  position: absolute;
  left: 0;
  font-size: 20;
  -webkit-text-stroke-color: #f0f4fc;
  -webkit-text-stroke-width: 1px;
}
.search-box .fa-close {
  position: absolute;
  right: 0;
  cursor: pointer;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #f0f4fc;
  font-size: 20;
}
.search-box .fa-times {
  position: absolute;
  right: 0;
  cursor: pointer;
  z-index: 1;
}
.search-box > div div:first-child {
  padding-left: 25px !important;
}
.search-box input[type='text'] {
  padding-left: 25px !important;
  padding-right: 25px;
}
.date-field-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 250;
}
.date-field-container .date-field {
  position: relative;
  border-radius: 6px;
  border: 1px solid #bfd6ff4d;
  background-color: #e1e9fc4d;
  display: flex;
  align-items: center;
  height: 35;
  cursor: pointer;
}
.date-field-container .date-field span.error-text {
  margin-top: 5;
  color: #FF9494;
}
.date-field-container .date-field span.value {
  line-height: 30px;
  padding-left: 35;
}
.date-field-container .date-field > div {
  padding-left: 35;
}
.date-field-container .date-field .fa {
  position: absolute;
  font-size: 18px;
}
.date-field-container .date-field .fa.fa-calendar {
  left: 10;
}
.date-field-container .date-field .fa.fa-caret-down {
  right: 10;
  cursor: pointer;
}
.date-field-container .date-field .fa.fa-times {
  right: 10;
  cursor: pointer;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #f0f4fc;
}
.date-field-container .error {
  margin-top: 5;
  font-size: 0.9em;
  color: red;
}
.date-field-container.error .date-field {
  border-color: #ff9494;
}
.select-all {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-left: 20;
  cursor: pointer;
  min-width: 80;
}
.select-all.checked .fa {
  color: #6fa0ff;
}
.select-all.disabled {
  opacity: 0.5;
  cursor: no-drop;
}
.select-all .fa {
  font-size: 20;
  margin-left: 5;
}
.select-all > span {
  line-height: 12px;
  white-space: nowrap;
}
.video-recording-dialog .body {
  position: relative;
}
.video-recording-dialog .body .loading {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: flex;
}
.video-recording-dialog .body .button-container {
  position: absolute;
  bottom: 0;
  z-index: 9;
  display: flex;
  justify-content: center;
  width: 100%;
  height: 70;
}
.video-recording-dialog .body .button-container .background {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #222;
  opacity: 0.75;
}
.video-recording-dialog .body .button-container .time {
  z-index: 1;
  right: 10;
  bottom: 10;
  position: absolute;
  color: chartreuse;
}
.video-recording-dialog .body .button-container .button {
  z-index: 1;
  height: 50;
  width: 50;
  margin: auto;
  border-radius: 50px;
  cursor: pointer;
}
.video-recording-dialog .body .button-container .button .fa {
  font-size: 20;
  color: red;
}
.selection-dialog .body {
  display: flex;
  flex-direction: column;
  padding: 0;
  padding-top: 60px;
  width: 100%;
}
.selection-dialog .body > button > div {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.selection-dialog .body h4.title {
  margin-bottom: 5px;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  height: 60;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #36425a;
  color: #fff;
  text-transform: uppercase;
}
.tree-container {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: flex-start;
  padding-top: 10;
  min-height: 300;
}
.tree-container input.checkbox {
  font-size: 40;
}
.tree-container span.title {
  font-size: 1.1em;
  font-weight: bold;
  padding-bottom: 10;
}
.tree-container .tree {
  display: flex;
  flex-direction: column;
}
.tree-container .tree .sub-tree {
  display: flex;
  padding-left: 32px;
  margin-top: 5;
  flex-direction: column;
}
.tree-container .tree .sub-tree > div {
  margin-top: 5;
}
.awesome-bar-chart {
  display: flex;
  flex: 1;
}
.awesome-bar-chart .chart-wrapper {
  width: 100%;
}
.awesome-bar-chart .chart-wrapper.horizontal {
  min-height: 90;
}
.resource-top-button {
  margin-top: 0;
  position: absolute;
  top: -50;
  height: 80;
  width: 150;
  background-color: #dd287499;
  display: flex;
  border-bottom-left-radius: 60px;
  border-bottom-right-radius: 60px;
  justify-content: center;
  align-items: flex-end;
  padding-bottom: 15;
  font-size: 1em;
  color: #FFFFFF;
  cursor: pointer;
  z-index: 9;
}
.resource-top-button:hover {
  background-color: #dd2874;
}
.resource-top-button .fa {
  font-size: 20;
  margin-left: 5;
}
.back-icon-button {
  position: absolute;
  bottom: 10;
  left: 10;
  /* padding: 10; */
  width: 40;
  height: 40;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  padding-right: 3px;
  padding-top: 2;
  padding-bottom: 1px;
  background-color: #fff;
  box-shadow: 0px 0px 10px #bbb;
  cursor: pointer;
}
.back-icon-button .fa {
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #fff;
  font-size: 22px;
}
.back-icon-button:hover {
  box-shadow: 0px 0px 20px #bbb;
}
.__react_component_tooltip.type-info.place-top.ngager-tooltip {
  background-color: #000000 !important;
  opacity: 0.75 !important;
}
.__react_component_tooltip.type-info.place-top.ngager-tooltip::after {
  border-top-color: #000000;
}
.filter-side {
  color: #6c81af;
  max-width: 390;
  min-width: 390;
  display: block;
  position: relative;
}
.filter-side .filter-box {
  position: sticky;
  top: 10;
  background-color: #fff;
  padding: 20;
  border-radius: 10px;
}
.filter-side .filter-box .header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  max-height: 40;
}
.filter-side .filter-box span.title {
  font-size: 1.4em;
  font-weight: bold;
}
.filter-side .filter-box .view-options {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.filter-side .filter-box .row {
  margin-top: 10;
  margin-bottom: 10;
}
.filter-side .filter-box .row:first-child {
  margin-top: 20;
}
.filter-side .filter-box .row span.survey-name {
  padding: 10;
  border-radius: 10px;
  background-color: #e1e9fc4d;
  width: 100%;
  border: 1px solid #bfd6ff4d;
}
.filter-side .filter-box .row.radio-group {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.filter-side .filter-box .row.radio-group .radios {
  display: flex;
  margin-left: 10px;
}
.filter-side .filter-box .row.radio-group .radios > div label {
  margin-right: 3;
  font-size: 1em;
  color: #6c81af !important;
}
.build-number {
  position: absolute;
  bottom: 5;
  width: 100%;
  text-align: center;
}
.text-container > div hr,
.dropdown-container > div hr,
.date-container > div hr,
.slider-container > div hr {
  height: 1;
}
.main-functionlity {
  max-width: 900;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}
.main-functionlity .ngager-flexbox-container {
  flex: 1;
}
.main-functionlity .ngager-flexbox-container .ngager-half {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}
.main-functionlity .ngager-flexbox-container .ngager-half .title {
  font-size: 20;
  font-weight: bold;
  margin-top: 10;
  margin-bottom: 5;
}
.main-functionlity .ngager-flexbox-container .ngager-half .description {
  font-size: 1.1em;
  opacity: 0.64;
  text-align: center;
}

.ngagerPagination {
  text-align: center;
  display: block;
  width: 100%;
}
.ngagerPagination .numbersContainer {
  display: inline-block;
  border-bottom: 2px solid #e2e8f7;
}
.ngagerPagination .paginationStatisticsContainer {
  display: inline-block;
}
.ngagerPagination .paginationStatisticsContainer .paginationStatistics {
  font-size: 1em;
  color: #778091;
}
.ngagerPagination .disabledPaginationLink {
  color: #ced1da;
  pointer-events: none;
}
.ngagerPagination .paginationStatistics {
  color: #c3cadc;
  font-size: 9px;
  margin-top: 4px;
}
.ngagerPagination .number,
.ngagerPagination i {
  cursor: pointer;
  background: none;
  position: relative;
  color: #778091;
  outline: none;
  width: 30px;
  height: 30px;
  line-height: 30px;
  padding: 0;
  display: inline-block;
}
.ngagerPagination i {
  font-size: 14px;
}
.ngagerPagination .number.active::before,
.ngagerPagination .number:hover::before {
  width: 30px;
  height: 4px;
  content: "";
  background-color: #5186ed;
  position: absolute;
  bottom: -3px;
  left: 0;
}
.ngagerPagination .fa-caret-left {
  margin-right: 10px;
}
.ngagerPagination .fa-caret-right {
  margin-left: 10px;
}

.picker-title {
  position: relative;
  line-height: 0 !important;
}
.picker-title i.fa-times {
  position: absolute;
  top: -10px;
  right: 0;
  color: #36425a;
  cursor: pointer;
}
.picker-container {
  display: flex;
}
.picker-container .header {
  position: absolute;
  z-index: 99;
  left: 0;
  width: 94%;
  background-color: #eef2fc;
  padding-left: 20px;
}
.picker-container .header .filter-field {
  position: relative;
}
.picker-container .header .filter-field .fa-search {
  position: absolute;
  top: 15px;
}
.picker-container .header .filter-field .fa-times {
  position: absolute;
  right: 0;
  top: 15px;
  cursor: pointer;
  z-index: 99;
}
.picker-container .cards-container .card {
  width: 180;
  height: 250;
}
.picker-container .cards-container .card .primary-header {
  font-size: 14;
}
.picker-container .cards-container .locked {
  position: relative;
}
.picker-container .cards-container .locked .locker {
  position: absolute;
  width: 180px;
  height: 250px;
  left: 20px;
  top: 20px;
  z-index: 9;
  cursor: no-drop;
  display: flex;
}
.picker-container .cards-container .locked .locker div {
  background-color: #222;
  opacity: 0.4;
  border-radius: 10px;
  width: 100%;
  height: 100%;
  position: absolute;
}
.picker-container .cards-container .locked .locker .fa {
  margin: auto;
  font-size: 50;
  color: red;
}

.ngager-xp {
  display: flex;
  align-items: center;
  padding-right: 8px;
}
.ngager-xp .ngager-xp-outer-circle {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  width: 34px;
  border-radius: 50%;
  border: 1px solid #eac23e;
  background-color: #fff;
}
.ngager-xp .ngager-xp-inner-circle {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  width: 30px;
  border-radius: 50%;
  background-color: #eac23e;
  color: #fff;
}
.ngager-xp .ngager-xp-label {
  position: absolute;
  right: 0;
  top: -2px;
  right: -8px;
  width: 20px;
  text-align: center;
  border: 1px solid #fff;
  border-radius: 10px;
  background-color: #eac23e;
  text-transform: uppercase;
  font-size: 9px;
  color: #fff;
}

.ngager-block-ui {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  z-index: 9;
  color: #FFFFFF;
}
.ngager-block-ui .background {
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: #222;
  opacity: 0.7;
  position: absolute;
  z-index: 1;
  cursor: no-drop;
}
.ngager-block-ui > div {
  z-index: 2;
  font-size: 16;
  margin: auto;
}

.upsert-target-container {
  padding: 20px 30px 30px 30px;
}
.upsert-target-container .title {
  color: #fff;
  padding: 10px 15px;
  position: relative;
  background: #6ea0ff;
  margin: -0.5px;
}
.upsert-target-container .title span {
  text-transform: uppercase;
  font-size: 14px;
}
.upsert-target-container .title i {
  color: #5186ed;
  font-size: 22px;
  position: absolute;
  right: 0px;
  top: 10px;
  cursor: pointer;
}
.upsert-target-container .target-form .buttons-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
.upsert-target-container .target-form .select-container {
  position: relative;
}
.upsert-target-container .target-form .select-container i.animated {
  position: absolute;
  top: 38px;
  right: 34px;
  font-size: 18px;
  color: #5186ed;
}
.upsert-target-container .target-form .select-container .warning-text {
  color: orange;
  font-size: 12;
  line-height: 12px;
  transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
}
.upsert-target-container .target-form .select-container .process-picker {
  position: relative;
  border-bottom: 1px solid #bcd2f9;
  padding-bottom: 5;
  margin-bottom: 10;
  cursor: pointer;
  margin-top: 30;
}
.upsert-target-container .target-form .select-container .process-picker.disabled {
  cursor: no-drop;
  border-bottom: 1px dashed;
}
.upsert-target-container .target-form .select-container .process-picker.disabled .float-label {
  color: #778091;
}
.upsert-target-container .target-form .select-container .process-picker.disabled > span {
  color: #778091;
}
.upsert-target-container .target-form .select-container .process-picker.error {
  border-color: red;
  border-width: 2px;
}
.upsert-target-container .target-form .select-container .process-picker span {
  line-height: 22px;
  transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  transform: scale(1) translate(0px, 0px);
  transform-origin: left top;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  color: #5a74a9;
  font-size: 14;
}
.upsert-target-container .target-form .select-container .process-picker span.float-label {
  position: absolute;
  top: 0;
  transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  z-index: 1;
  transform: scale(0.75) translate(0px, -28px);
  transform-origin: left top;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  color: #5a74a9;
}
.upsert-target-container .target-form .select-container .process-picker .fa-search {
  display: inline-block;
  color: #778091;
  fill: inherit;
  height: 24px;
  width: 24px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  position: absolute;
  right: 10;
  bottom: 5;
  font-size: 20;
}
.upsert-target-container.left {
  margin-left: 5px;
  margin-right: 15px;
}
.upsert-target-container.right {
  margin-left: 15px;
  margin-right: 0;
}

.activity-form {
  padding: 20px 30px 30px;
}
.activity-form .button-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
.activity-form .button-container .add-button {
  background: #6fa0ff;
  border: none;
  color: #fff;
  padding: 10px 25px;
  outline: none;
  cursor: pointer;
  border-radius: 25px;
}
.activity-form .button-container .add-button span {
  margin-left: 5px;
}

.activities .no-data-container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  border-top: 1px dashed #ddd;
  margin-top: 25px;
  padding-top: 10px;
}
.activities .no-data-container .no-activity-text {
  text-align: center;
  margin: 15px;
  font-size: 14px;
}
.activities .activity-item {
  padding: 15px;
  color: #778091;
  position: relative;
  font-size: 14px;
  border-top: 1px dashed #ddd;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 95px;
}
.activities .activity-item:hover .action {
  opacity: 1;
}
.activities .activity-item .check-list-item-box {
  background: #fff;
  border-radius: 3px;
  border: 1px solid #d6dadc;
  box-sizing: border-box;
  position: absolute;
  left: 0;
  line-height: 20px;
  overflow: hidden;
  text-align: center;
  text-indent: 100%;
  top: 9px;
  height: 17px;
  width: 17px;
  white-space: nowrap;
  cursor: pointer;
}
.activities .activity-item .check {
  font-size: 20px;
  color: #9acf61;
  position: absolute;
  right: 15px;
  cursor: pointer;
}
.activities .activity-item .square {
  font-size: 20px;
  color: #a0a0a0;
  position: absolute;
  right: 15px;
  cursor: pointer;
}
.activities .activity-item .name {
  padding-bottom: 5px;
  font-weight: bold;
}
.activities .activity-item .description {
  margin-bottom: 10px;
}
.activities .activity-item .more {
  color: #6ea0ff;
  cursor: pointer;
}
.activities .activity-item .updated-info {
  padding-top: 5px;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.activities .activity-item .date-container {
  display: flex;
  align-items: center;
}
.activities .activity-item .date-container .start-date {
  margin: 0 30px 0 0px;
}
.activities .activity-item .date-container .end-date {
  margin: 0 0 0 30px;
}
.activities .activity-item .date-title {
  font-size: 12px;
}
.activities .activity-item .date-value {
  font-size: 12px;
  margin-left: 6px;
}
.activities .activity-item .animated {
  position: absolute;
  top: 11px;
  right: 0;
  color: #5086ed;
}
.activities .activity-item .action {
  position: absolute;
  cursor: pointer;
  color: #fff;
  width: 19px;
  height: 20px;
  border-radius: 26px;
  display: flex;
  font-size: 11px;
  justify-content: center;
  align-items: center;
  transition-duration: 0.4s;
  padding-left: 1px;
  opacity: 0;
}
.activities .activity-item .action.edit {
  top: 8px;
  right: 43px;
}
.activities .activity-item .action.delete {
  top: 8px;
  right: 13px;
}
.activities .button-container {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}
.activities .button-container .add-button {
  background: transparent;
  border: none;
  padding: 10px 0;
  outline: none;
  cursor: pointer;
}
.activities .button-container .add-button span {
  margin-right: 5px;
  font-size: 13px;
}
.activities .button-container .add-button i {
  font-size: 13px;
}
.activities .new-activity {
  position: relative;
  padding-bottom: 20px;
}
.activities .new-activity .action {
  position: absolute;
  cursor: pointer;
  background: #5086ed;
  color: #fff;
  width: 19px;
  height: 20px;
  border-radius: 26px;
  display: flex;
  font-size: 11px;
  justify-content: center;
  align-items: center;
  transition-duration: 0.4s;
  padding-left: 1px;
}
.activities .new-activity .action.delete {
  right: 0px;
  top: 15px;
  opacity: 0;
}
.activities .new-activity:hover .delete {
  opacity: 1;
}
.activity-list-view .fa-check-square {
  cursor: pointer;
}
.activity-list-view .fa-square {
  cursor: pointer;
}
.activities-table-list thead tr:first-child th:first-child {
  width: 0 !important;
}
.activities-table-list tbody td.column {
  padding-left: 6 !important;
  padding-right: 6 !important;
}
.activity-detail {
  padding: 20px;
}
.activity-detail .activity-info {
  position: relative;
  padding: 0px 10px;
}
.activity-detail .activity-info p {
  font-size: 14px;
  color: #778091;
  width: 100%;
  line-height: 30px;
}
.activity-detail .activity-info p .title {
  font-weight: 600;
}
.activity-detail .save-button-container {
  text-align: right;
}
.activity-detail .save-button-container > button {
  margin-left: 20px;
}
.activity-detail .activity-body {
  padding: 0px 10px;
}
.activity-detail .buttons-container {
  justify-content: center;
  align-items: center;
  display: flex;
  margin-bottom: 10px;
}

.target-details-view {
  display: flex;
  flex: 1;
  margin-top: 20;
}
.target-details-view .carousel-button {
  width: 60px;
  height: 60px;
  background-color: #283850;
  border-radius: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.target-details-view .carousel-button i {
  font-size: 40px;
  color: #fff;
}
.target-details-view .carousel-button.button-left {
  position: absolute;
  left: 4%;
  top: 45%;
}
.target-details-view .carousel-button.button-right {
  position: absolute;
  right: 4%;
  top: 45%;
}
.target-details-view .target-details-body {
  padding: 0 15%;
  margin: 0 auto;
  overflow-y: auto;
  width: 100%;
}
.target-details-view .target-details-body .target-info-container {
  display: flex;
  align-items: center;
  flex-direction: column;
}
.target-details-view .target-details-body .target-info-container .avatar-container {
  width: 110px;
  height: 110px;
  position: relative;
}
.target-details-view .target-details-body .target-info-container .avatar-container .avatar {
  width: 110px;
  height: 110px;
  border-radius: 110px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
}
.target-details-view .target-details-body .target-info-container .avatar-container .avatar img {
  width: 110px;
}
.target-details-view .target-details-body .target-info-container .avatar-container .target-status {
  position: absolute;
  width: 40px;
  height: 40px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 40px;
  bottom: -10px;
  right: 0px;
}
.target-details-view .target-details-body .target-info-container .avatar-container .target-status i {
  font-size: 20px;
}
.target-details-view .target-details-body .target-info-container .target-name {
  margin: 20px 0 5px 0;
  font-weight: bold;
  font-size: 21px;
}
.target-details-view .target-details-body .target-info-container .target-description {
  opacity: 0.7;
  font-size: 17px;
}
.target-details-view .target-details-body .target-info-container .target-sides-info {
  margin: 10px 0;
  font-size: 17px;
}
.target-details-view .target-details-body .target-info-container .target-sides-info .value {
  font-weight: bold;
}
.target-details-view .target-details-body .target-info-container .target-dates {
  font-size: 17px;
}
.target-details-view .target-details-body .target-info-container .target-dates .fa {
  margin: 0 5px;
}
.target-details-view .target-details-body .target-info-container .target-dates .fa.fa-arrow-right {
  margin: 0 20px;
}

.target-list-view {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  display: flex;
}
.target-list-view .targets-list-container {
  display: flex;
  flex: 1;
  overflow: hidden;
  flex-direction: column;
}
.target-list-view .targets-list-container .list-view-body {
  background-color: #e7ebf9;
  position: relative;
  display: flex;
  flex: 1;
  overflow: hidden;
}
.target-list-view .targets-list-container .list-view-body > div {
  overflow: hidden !important;
  display: flex;
  flex-direction: column;
}
.target-list-view .targets-list-container .list-view-body .user-column,
.target-list-view .targets-list-container .list-view-body .target-column {
  display: flex;
  align-items: center;
}
.target-list-view .targets-list-container .list-view-body .user-column .ngager-avatar,
.target-list-view .targets-list-container .list-view-body .target-column .ngager-avatar {
  margin: 0;
}
.target-list-view .targets-list-container .list-view-body .user-column > span,
.target-list-view .targets-list-container .list-view-body .target-column > span {
  margin-left: 10;
  text-overflow: ellipsis;
  overflow: hidden;
}
.target-list-view .list-view-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.target-list-view .list-view-header .left {
  display: flex;
}
.target-list-view .list-view-header .filter-item {
  margin: 0 10px;
  position: relative;
}
.target-list-view .list-view-header .filter-item .fa-times {
  position: absolute;
  top: 42px;
  right: 0px;
  font-size: 14px;
  cursor: pointer;
}
.target-list-view .list-view-header .right {
  position: relative;
}
.target-list-view .list-view-header .right .fa-search {
  position: absolute;
  top: 38px;
  font-size: 14px;
  color: #6ea0ff;
}
.target-list-view .list-view-header .right input[type='text'] {
  padding-left: 20px !important;
  font-size: 14px;
}
.target-list-view .list-view-header .add-button {
  display: flex;
  position: absolute;
  justify-content: center;
  align-items: center;
  padding: 0px 0px 5px 0px;
  color: #6f9ff8;
  cursor: pointer;
  left: -130px;
  border-bottom: 1px solid #bdd3ff;
  top: 38px;
}
.target-list-view .list-view-header .add-button i {
  font-size: 12px;
  margin-top: 3px;
}
.target-list-view .list-view-header .add-button span {
  margin-left: 5px;
}
.target-list-view .upsert-target-container {
  padding: 40px 0;
  height: calc(100% - 40px) !important;
}
.target-list-view .back {
  display: inline-block;
  color: #6da0ff;
  text-transform: capitalize;
  cursor: pointer;
  margin-top: 10px;
  position: absolute;
}
.target-list-view .back span {
  margin-left: 5px;
}

.target-container .target-modal > div {
  max-height: inherit !important;
}
.target-container .target-table-list thead tr:first-child th:first-child {
  width: 0 !important;
}
.target-container .target-table-list tbody td.column {
  padding-left: 6 !important;
  padding-right: 6 !important;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.performance {
  height: 100%;
}
.performance .content-container .filters {
  position: relative;
  display: flex;
  border-bottom: 1px solid #ddd;
  padding-left: 10;
}
.performance .content-container .filters .ngager-selectfield {
  margin-left: 0;
  background-color: transparent;
  margin-bottom: 3px;
  border: none;
  flex: 0;
  max-width: 200;
}
.performance .content-container .processes-tab {
  display: flex;
  flex: 1;
  overflow: hidden;
}
.performance .content-container .processes-tab .processes-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, 250px);
  justify-content: space-between;
}
.performance .content-container .processes-tab .processes-list .card {
  border-radius: 0;
}
.performance .content-container .processes-tab .processes-list .card .process-indicator {
  border-left: 30px solid transparent;
  position: absolute;
  right: 0;
}
.performance .content-container .processes-tab .processes-list .card .process-indicator.not-started {
  border-top: 30px solid #dadada;
}
.performance .content-container .processes-tab .processes-list .card .process-indicator.in-progress {
  border-top: 30px solid #ffa500;
}
.performance .content-container .processes-tab .processes-list .card .process-indicator.completed {
  border-top: 30px solid #9acf61;
}
.performance .content-container .processes-tab .processes-list .card .xp-container {
  position: absolute;
  bottom: 10px;
  right: 5px;
}
.performance .content-container .processes-tab > div {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  flex: 1;
}
.performance > div {
  height: 100%;
}
.performance > div > div {
  height: 100%;
}
.performance > div > div > div:first-child {
  border-bottom: 1px solid #d6def5;
}
.performance > div > div > div:first-child button {
  width: 165px !important;
}
.performance > div > div > div:first-child + div div {
  width: 160px !important;
  background-color: #283850 !important;
  height: 3px !important;
  margin-top: -4px !important;
}
.performance > div > div > div:first-child + div div::after {
  content: '';
  position: absolute;
  left: 50%;
  margin-left: -15px;
  width: 0;
  height: 0;
}
.performance > div div.performance-employees-tabs {
  display: flex;
  flex-direction: column;
}
.performance > div div.performance-employees-tabs .content-container {
  display: flex;
  overflow: auto;
  flex: 1;
}
.performance > div div.performance-employees-tabs > div:first-child + div {
  width: 600px !important;
}
.performance > div div.performance-manager-tabs {
  display: flex;
  flex-direction: column;
}
.performance > div div.performance-manager-tabs .content-container {
  display: flex;
  overflow: auto;
  flex: 1;
}
.performance > div div.performance-manager-tabs > div:first-child + div {
  width: 1000px !important;
}
.targets {
  position: absolute;
  left: 0;
  right: 0;
  top: 10;
  bottom: 0;
}
.targets .targetsBar {
  min-width: 350px;
  max-width: 350px;
  width: 30%;
  margin-right: 30px;
  height: 100%;
  overflow-y: auto;
  font-size: 14px;
}
.targets .targetsBar .targetContainer {
  position: relative;
  margin-bottom: 10px;
  cursor: pointer;
}
.targets .targetsBar .targetContainer .period-locked {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #d3d3d3;
  z-index: 9;
  opacity: 0.7;
  cursor: no-drop;
  border-radius: 10px;
}
.targets .targetsBar .targetContainer .period-locked .fa-lock {
  margin: auto;
  font-size: 30px;
  color: orangered;
  position: absolute;
  right: 15px;
  top: 5px;
}
.targets .targetsBar .targetContainer .targetHeader-checklist {
  text-align: center;
  min-height: 120px;
  background: #dce1f5;
  color: #6c81af;
  font-size: 16px;
  position: relative;
  cursor: pointer;
  background-size: 100%;
  border-radius: 10px;
  z-index: 1;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .waypoint-name {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .waypoint-name p.waypoint-description {
  color: #6c81af;
  opacity: 0.5;
  font-size: 13px;
  padding-left: 10;
  padding-right: 10;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .waypoint-name p.waypoint-description-left {
  color: #6c81af;
  opacity: 0.5;
  font-size: 13px;
  padding-left: 10;
  padding-right: 10;
  text-align: left;
  margin-left: auto;
  margin-top: 10;
  font-weight: bold;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .checklist-task-name {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  color: black;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .checklist-task-name .inside {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .checklist-task-name .inside p.title {
  padding-top: 5;
  font-size: 14;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .checklist-task-name .inside p.checklist-task-description {
  color: black;
  opacity: 0.5;
  font-size: 13px;
  padding-left: 10;
  padding-right: 10;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .checklist-task-name .inside p.checklist-task-description-left {
  color: black;
  opacity: 0.5;
  font-size: 13px;
  padding-left: 10;
  padding-right: 10;
  text-align: left;
  margin-left: auto;
  margin-top: 10;
  font-weight: bold;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .toggleTargetActions {
  position: absolute;
  right: 20px;
  bottom: 15px;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .target-indicator-container {
  position: absolute;
  background: transparent;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  border-radius: 10px;
  overflow: hidden;
  z-index: 9999;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .target-indicator-container .target-status-indicator {
  border-top: 35px solid #d3d3d3;
  border-left: 35px solid transparent;
  position: absolute;
  right: 0;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .target-indicator-container .target-status-indicator--in-progress {
  border-top: 35px solid #ffa500;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .target-indicator-container .target-status-indicator--completed {
  border-top: 35px solid #9acf61;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .target-indicator-container .target-status-indicator--deadline-reached {
  border-top: 35px solid #fc3700;
}
.targets .targetsBar .targetContainer .targetHeader-checklist .xp-container {
  display: flex;
  justify-content: center;
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.targets .targetsBar .targetContainer .targetHeader {
  text-align: center;
  min-height: 120px;
  background: #dce1f5;
  color: #6c81af;
  font-size: 16px;
  position: relative;
  cursor: pointer;
  background-size: 100%;
  background-position: 0 -109px;
  border-radius: 10px;
  z-index: 1;
}
.targets .targetsBar .targetContainer .targetHeader .waypoint-name {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.targets .targetsBar .targetContainer .targetHeader .waypoint-name p.waypoint-description {
  color: #6c81af;
  opacity: 0.5;
  font-size: 13px;
  padding-left: 10;
  padding-right: 10;
}
.targets .targetsBar .targetContainer .targetHeader .waypoint-name p.waypoint-description-left {
  color: #6c81af;
  opacity: 0.5;
  font-size: 13px;
  padding-left: 10;
  padding-right: 10;
  text-align: left;
  margin-left: auto;
  margin-top: 10;
  font-weight: bold;
}
.targets .targetsBar .targetContainer .targetHeader .toggleTargetActions {
  position: absolute;
  right: 20px;
  bottom: 15px;
}
.targets .targetsBar .targetContainer .targetHeader .target-indicator-container {
  position: absolute;
  background: transparent;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  border-radius: 10px;
  overflow: hidden;
  z-index: 9999;
}
.targets .targetsBar .targetContainer .targetHeader .target-indicator-container .target-status-indicator {
  border-top: 35px solid #d3d3d3;
  border-left: 35px solid transparent;
  position: absolute;
  right: 0;
}
.targets .targetsBar .targetContainer .targetHeader .target-indicator-container .target-status-indicator--in-progress {
  border-top: 35px solid #ffa500;
}
.targets .targetsBar .targetContainer .targetHeader .target-indicator-container .target-status-indicator--completed {
  border-top: 35px solid #9acf61;
}
.targets .targetsBar .targetContainer .targetHeader .target-indicator-container .target-status-indicator--deadline-reached {
  border-top: 35px solid #fc3700;
}
.targets .targetsBar .targetContainer .targetHeader .xp-container {
  display: flex;
  justify-content: center;
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.targets .targetsBar .targetContainer .target-header--completed {
  border-color: #9acf61;
}
.targets .targetsBar .targetContainer .target-header--in-progress {
  border-color: #ffa500;
}
.targets .targetsBar .targetContainer .targetActions {
  overflow: hidden;
  background-color: #ffffff;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box {
  width: 32px;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  padding-right: 10;
  margin: auto;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node {
  background-color: #fff;
  width: 81%;
  height: 81%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  cursor: pointer;
  position: relative;
  outline-color: transparent;
  box-shadow: 0px 0px 3px #444;
  border-width: 4px;
  border-style: solid;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node i {
  color: #fff;
  font-size: 16px;
  outline-color: transparent;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node i.remove-chapter-game {
  color: #36425A;
  position: absolute;
  top: -11px;
  right: -5px;
  display: none;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node i.completed {
  background-color: #9acf61;
  border: 5px solid #e2f9ca;
  border-radius: 100px;
  font-size: 18px;
  padding: 3px;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node:hover i.remove-chapter-game {
  display: block;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .meter,
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .mandatory {
  position: absolute;
  border-radius: 56px;
  bottom: -8px;
  right: -7px;
  width: 17px;
  height: 17px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #778090;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .meter span,
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .mandatory span,
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .meter i,
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .mandatory i {
  color: #fff;
  font-size: 8px;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .waypoint-progress {
  position: absolute;
  border-radius: 56px;
  bottom: -13px;
  right: -10px;
  color: #fff;
  font-size: 8px;
  justify-content: center;
  align-items: center;
  background-color: #778090;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .waypoint-progress .circle {
  width: 23px;
  height: 23px;
  position: relative;
  display: block;
  visibility: hidden;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .waypoint-progress .text {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .waypoint-progress .text span {
  margin: auto;
}
.targets .targetsBar .targetContainer .targetActions .game-node-box .game-node .mandatory {
  left: -7px;
  z-index: 1;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box {
  width: 20px;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  padding-right: 10;
  margin: auto;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node {
  background-color: #fff;
  width: 81%;
  height: 81%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  cursor: pointer;
  position: relative;
  outline-color: transparent;
  box-shadow: 0px 0px 3px #444;
  border-width: 4px;
  border-style: solid;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node i {
  color: #fff;
  font-size: 16px;
  outline-color: transparent;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node i.remove-chapter-game {
  color: #36425A;
  position: absolute;
  top: -11px;
  right: -5px;
  display: none;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node i.completed {
  background-color: #9acf61;
  border: 5px solid #e2f9ca;
  border-radius: 100px;
  font-size: 18px;
  padding: 3px;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node:hover i.remove-chapter-game {
  display: block;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .meter,
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .mandatory {
  position: absolute;
  border-radius: 56px;
  bottom: -8px;
  right: -7px;
  width: 17px;
  height: 17px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #778090;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .meter span,
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .mandatory span,
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .meter i,
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .mandatory i {
  color: #fff;
  font-size: 8px;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .waypoint-progress {
  position: absolute;
  border-radius: 56px;
  bottom: -13px;
  right: -10px;
  color: #fff;
  font-size: 8px;
  justify-content: center;
  align-items: center;
  background-color: #778090;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .waypoint-progress .circle {
  width: 23px;
  height: 23px;
  position: relative;
  display: block;
  visibility: hidden;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .waypoint-progress .text {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .waypoint-progress .text span {
  margin: auto;
}
.targets .targetsBar .targetContainer .targetActions .checklist-node-box .checklist-node .mandatory {
  left: -7px;
  z-index: 1;
}
.targets .targetsBar .targetContainer .targetActions .act-resources-menu .act-resources-menu__header {
  position: relative;
}
.targets .targetsBar .targetContainer .targetActions .act-resources-menu .act-resources-menu__header .act-resources-menu__title {
  margin-right: 60px;
  white-space: normal;
  padding-top: 10px;
  padding-bottom: 10px;
}
.targets .targetsBar .targetContainer .targetActions .act-resources-menu .act-resources-menu__header .act-resources-menu__title.has-act-game {
  margin-right: 0;
}
.targets .targetsBar .targetContainer .targetActions .act-resources-menu .act-resources-menu__header .act-resources-menu__button-act {
  margin-right: 10px;
}
.targets .targetsBar .targetContainer .targetActions .act-resources-menu .act-resources-menu__header .completion-indicator {
  width: 50px;
}
.targets .targetsBar .targetContainer .targetActions .action {
  background-color: transparent;
}
.targets .targetsBar .targetContainer .targetActions .action.active > .game-item-container {
  background-color: #f6f9ff;
}
.targets .targetsBar .targetContainer .targetActions .action.active.open {
  background-color: transparent;
}
.targets .targetsBar .targetContainer .targetActions .action.active.open > .game-item-container {
  background-color: #f6f9ff;
}
.targets .targetsBar .targetContainer .targetActions .action.active .children .game-item-container.active {
  background-color: #f6f9ff;
}
.targets .targetsBar .targetContainer .targetActions .action .children {
  font-size: 13px;
}
.targets .targetsBar .targetContainer .targetActions .action .children .game-item-container {
  padding-left: 15px;
}
.targets .targetsBar .targetContainer .targetActions .action .children .game-item-container i {
  font-size: 18px;
  width: 60px;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container {
  min-height: 68px;
  width: 100%;
  cursor: pointer;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 0 10px;
  transition-property: all;
  transition-duration: 0.2s;
  position: relative;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container.disabled {
  cursor: default;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container:hover {
  background-color: #f6f9ff;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container i {
  vertical-align: middle;
  width: 70px;
  height: auto;
  text-align: center;
  line-height: inherit;
  display: inline-block;
  margin: auto;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container .completion-indicator {
  width: 35px;
  height: 100%;
  display: flex;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container .completion-indicator i {
  font-size: 18px;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container .completion-indicator .completion-indicator-icon {
  border: 4px solid #f5f5f5;
  background-color: #dadada;
  height: 20px;
  border-radius: 100px;
  color: white;
  width: 20px;
  line-height: 20px;
  font-size: 10px;
  margin: auto;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container .completion-indicator .completion-indicator-icon--in-progress {
  background-color: #ffa500;
  border: 4px solid #ffe4b2;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container .completion-indicator .completion-indicator-icon--completed {
  background-color: #9acf61;
  border: 4px solid #e2f9ca;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container .completion-indicator .completion-indicator-icon--cancel {
  color: chocolate;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container .completion-indicator .completion-indicator-icon--cancelled {
  background-color: #ff0000;
  border: 4px solid #e2c5c5;
  color: white;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container .xp-container {
  margin-left: 5px;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container span {
  width: 80%;
  margin-right: 60px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container div.description {
  width: 80%;
  margin-right: 60px;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}
.targets .targetsBar .targetContainer .targetActions .action .game-item-container div.description span {
  margin: auto;
  width: 100%;
  padding: 0;
}
.targets .targetsBar .targetContainer .targetActions .action .waypoint-game .waypoint-game-info {
  width: 80%;
  margin-right: 60px;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.targets .targetsBar .targetContainer .targetActions .action .waypoint-game .waypoint-game-info .waypoint-game-description {
  font-size: 12;
}
.targets .targetsBar .targetContainer .targetActions .action .completionIndicator {
  width: 67px;
  line-height: 56px;
  display: flex;
}
.targets .targetsBar .targetContainer .targetActions .action .completionIndicator i {
  border: 4px solid #f5f5f5;
  background-color: #dadada;
  border-radius: 100px;
  color: white;
  margin: auto;
  height: 18px;
  width: 18px;
  line-height: 18px;
  font-size: 8px;
}
.targets .targetsBar .targetContainer .targetActions .action .completed {
  cursor: auto;
  pointer-events: none;
}
.targets .targetsBar .targetContainer .targetActions .action .completed .completionIndicator i {
  background-color: #9acf61;
  border: 4px solid #e2f9ca;
}
.targets .targetsBar .targetContainer .targetActions .act-resources-menu .act-resources-menu-item {
  padding-left: 20px;
}
.targets .targetsBar .targetContainer .targetActions .act-resources-menu .act-resources-menu-item__resource-meta {
  padding-left: 15px;
}
.targets .targetsBar .targetContainer .targetActions .act-resources-menu .act-resources-menu__header .act-resources-menu__header-icon {
  flex-grow: 0;
  flex-basis: 40px;
  margin-left: 10px;
  margin-right: 8px;
}
.targets .targetsBar .targetContainer .targetActions .act-resources-menu .completion-indicator {
  width: 67px;
}
.targets .targetsBar .targetContainer .targetActions .act-resources-menu .act-resources-menu-item__icon-consumed {
  width: 50px;
}
.targets .performancePlayground {
  background-color: #e8ecf5;
  flex: 1;
  flex-grow: 1;
  height: 100%;
  overflow: none;
  overflow-y: auto;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
  position: relative;
}
.targets .performancePlayground .ngager-button {
  font-size: 14px;
}
.targets .performancePlayground .error-messages {
  padding: 20px;
  text-align: center;
  color: crimson;
}
.targets .performancePlayground .performance-game-container {
  height: 100%;
  overflow: auto;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.targets .performancePlayground .performance-game-container .report-game {
  margin-top: 0;
}
.targets .performancePlayground .performance-game-container .manually-trigger {
  margin-bottom: 50px;
}
.targets .performancePlayground .performance-game-container .manually-trigger .performance-header .game-icon-wrapper .background-img {
  max-height: 300;
}
.targets .performancePlayground .performance-game-container .manually-trigger .body .select-peers {
  padding: 15px 30px 0px;
}
.targets .performancePlayground .performance-game-container .manually-trigger .body .select-peers > .message {
  text-align: center;
  color: red;
}
.targets .performancePlayground .performance-game-container .manually-trigger .body.peers {
  min-height: 350;
}
.targets .performancePlayground .performance-game-container .myfeedback-summary {
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.targets .performancePlayground .performance-game-container .myfeedback-summary > .filter {
  padding: 10;
}
.targets .performancePlayground .performance-game-container .myfeedback-summary > .content {
  overflow: auto;
}
.targets .performancePlayground .performance-game-container .endorsement-form {
  margin-top: 0;
  height: calc(100% - 40px);
}
.targets .performancePlayground .performance-game-container .game-icon-wrapper {
  position: relative;
  background-color: #ddd;
}
.targets .performancePlayground .performance-game-container .game-body .slider-container .label-caption {
  text-align: left;
}
.targets .performancePlayground .challenge-header {
  font-size: 14px;
}
.targets .performancePlayground .challenge-header .title {
  font-size: 20px;
}
.targets .performancePlayground .performance-header {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.targets .performancePlayground .performance-header .game-icon-wrapper .background-img {
  display: flex;
  background-color: #dde0ea;
  min-height: 300;
  max-height: 450;
}
.targets .performancePlayground .performance-header .title {
  text-align: center;
  margin-top: 50px;
}
.targets .performancePlayground .disabled-ui {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 999;
}
.targets .performancePlayground .disabled-ui .background {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0.7;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.targets .performancePlayground .disabled-ui .message {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 10;
  display: flex;
}
.targets .performancePlayground .disabled-ui .message span {
  margin: auto;
  font-size: 16;
}
.targets .performancePlayground .closeActiveGame {
  position: absolute;
  right: 10px;
  top: 10px;
  outline: none;
  color: white;
  cursor: pointer;
  z-index: 9;
  opacity: 0.8;
}
.targets .performancePlayground .gameHeaderContainer {
  height: 90px;
}
.targets .performancePlayground .gameHeaderContainer > div > div {
  background-color: transparent !important;
}
.targets .performancePlayground .gameHeaderContainer > div > div img {
  display: none;
}
.targets .performancePlayground .header-image.image-container {
  margin-bottom: 0;
}
.targets .performancePlayground .game-name {
  display: none;
}
.targets .performancePlayground .buttonsContainer {
  text-align: center;
  margin-top: 100px;
  margin-bottom: 50px;
}
.targets .performancePlayground .buttonsContainer > button {
  margin-left: 10px;
  margin-right: 10px;
}
.targets .performancePlayground .game-icon-wrapper {
  position: relative;
}
.targets .performancePlayground .game-icon-wrapper .header-image .no-image-src {
  height: 85;
}
.targets .performancePlayground .game-icon-wrapper .image-upload-container img {
  max-height: 300;
}
.targets .performancePlayground .game-icon-wrapper .game-background {
  width: 100%;
  height: 85;
  background-color: #5186ed;
  opacity: 0.8;
}
.targets .performancePlayground .game-icon-wrapper .gameIconContainer {
  width: 80px;
  height: 80px;
  border-radius: 100px;
  position: absolute;
  z-index: 99;
  background-color: #ffffff;
  left: calc(50% - 40px);
  top: auto;
  bottom: -50px;
  text-align: center;
  border: 2px solid #ffffff;
}
.targets .performancePlayground .game-icon-wrapper .gameIconContainer i {
  line-height: 80px;
  color: #ffffff;
  font-size: 32px;
}
.targets .performancePlayground .game-icon-wrapper .gameIconContainer.noBackgroundColor i {
  color: #222;
}
.targets .performancePlayground .gridContainer {
  margin: auto;
  width: auto;
  margin-top: 60px;
  position: relative;
  font-size: 1.2em;
}
.targets .performancePlayground .gridContainer > div > div:nth-child(2) {
  left: 0;
  font-size: 18px;
  font-weight: 100;
  color: #737373;
  position: absolute;
  width: 100%;
}
.targets .performancePlayground .gridContainer > div > div:last-child {
  top: 60px;
}
.targets .performancePlayground .textAndButtonContainer {
  text-align: center;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 90px;
}
.targets .performancePlayground .cards-container {
  padding: 70px 0;
  flex-grow: 1;
  text-align: center;
}
.targets .performancePlayground .cards-container > div {
  outline: none;
  display: inline-block;
}
.targets .performancePlayground .save-button-container {
  text-align: center;
  margin-top: 20px;
}
.targets .performancePlayground .save-button-container > button {
  margin: 0 5px;
}
.periods.cards-container .card {
  border-radius: 0;
}
.periods.cards-container .card .card-content .time-info {
  margin: 74px auto;
}
.periods.cards-container .card .card-content .time-info > p {
  margin: auto;
  color: #aba9a9;
  display: flex;
  align-items: center;
}
.periods.cards-container .card .card-content .time-info > p i {
  line-height: 17px;
  margin-right: 1px;
  font-size: 11px;
}
.periods.cards-container .card .card-content .time-info > p > span {
  display: block;
  font-size: 13px;
}
.periods.cards-container .card .card-content .time-info > p > span.time-label {
  display: block;
  text-align: left;
  margin: 2px;
  font-size: 13px;
  min-width: 75px;
}
.periods.cards-container .card .card-content .time-info > p > span.time-value {
  font-weight: bold;
}
.periods.cards-container .card .xp-container {
  position: absolute;
  bottom: 10px;
  right: 5px;
}
.periods.cards-container .card .period-indicator {
  border-left: 30px solid transparent;
  position: absolute;
  right: 0;
}
.periods.cards-container .card .period-indicator.not-started {
  border-top: 30px solid #dadada;
}
.periods.cards-container .card .period-indicator.in-progress {
  border-top: 30px solid #ffa500;
}
.periods.cards-container .card .period-indicator.completed {
  border-top: 30px solid #9acf61;
}
.periods.cards-container .card.with-bottom-icon .locked {
  position: relative;
}
.periods.cards-container .card.with-bottom-icon .locked .locker {
  position: absolute;
  width: 210px;
  height: 310px;
  left: 0;
  top: 0;
  z-index: 2;
  cursor: no-drop;
  display: flex;
}
.periods.cards-container .card.with-bottom-icon .locked .locker div {
  background-color: #222;
  opacity: 0.4;
  border-radius: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}
.periods.cards-container .card.with-bottom-icon .locked .locker .fa {
  margin: auto;
  font-size: 50;
  color: red;
}
.periods.cards-container .card.with-bottom-icon .card-bottom-command {
  bottom: -20px;
  display: flex;
  justify-content: center;
  z-index: 10;
}
.periods.cards-container .card.with-bottom-icon:hover .card-bottom-command {
  bottom: 0;
}
.periods.cards-container .card.with-bottom-icon:hover .card-bottom-command > span {
  margin: 10;
  margin-top: 20;
  margin-bottom: 20;
}
.performance-target {
  overflow: auto;
}
.performance-target .upsert-target-container {
  padding: 50px 20px 0px 20px !important;
  height: calc(100% - 70px) !important;
}
.performance-target .target-list-view .header {
  padding: 0 20px;
}
.performance-target .target-list-view .header .add-button {
  left: 33px;
}
.performance-target .target-list-view .back {
  margin-left: 11px !important;
  margin-top: 14px;
}
.process-registration {
  display: flex;
}
.process-registration .left-column {
  display: inline-flex;
  flex-basis: 100%;
}
.process-registration .right-column {
  display: inline-flex;
  flex-basis: 100%;
}
.process-registration .header {
  position: absolute;
  z-index: 99;
  left: 0;
  width: 94%;
  background-color: #eef2fc;
  padding-left: 20px;
}
.process-registration .header .filter-field {
  position: relative;
}
.process-registration .header .filter-field .fa-search {
  position: absolute;
  top: 15px;
}
.process-registration .header .filter-field .fa-times {
  position: absolute;
  right: 0;
  top: 15px;
  color: brown;
  cursor: pointer;
  z-index: 99;
}
.process-registration .cards-container {
  padding-top: 40px;
}
.process-registration .cards-container .locked {
  position: relative;
}
.process-registration .cards-container .locked .locker {
  position: absolute;
  width: 210px;
  height: 310px;
  left: 20px;
  top: 20px;
  z-index: 9;
  cursor: no-drop;
  display: flex;
}
.process-registration .cards-container .locked .locker div {
  background-color: #222;
  opacity: 0.4;
  border-radius: 10px;
  width: 100%;
  height: 100%;
  position: absolute;
}
.process-registration .cards-container .locked .locker .fa {
  margin: auto;
  font-size: 50;
  color: red;
}
.performance-team-start .process-card-indicator {
  border-left: 40px solid transparent;
  border-top: 40px solid #9acf61;
  position: absolute;
  top: 0;
  right: 0;
}
.performance-team-start .process-card-indicator .process-card-indicator-icon {
  position: absolute;
  top: -37px;
  left: -20px;
  color: #f0f4fc;
  font-size: 16px;
}
.process-team-registration {
  background-color: #f2f4fb;
  min-height: 500px;
}
.process-team-registration .close-button {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 20px;
  cursor: pointer;
  padding: 5px;
}
.process-team-registration .header {
  display: flex;
  flex-direction: column;
  position: relative;
  min-height: 100px;
  width: 100%;
  background-color: #36425A;
  color: #fff;
  align-items: center;
  padding: 30px 0;
}
.process-team-registration .header-icon-wrap {
  width: 70px;
  height: 70px;
  background-color: #fff;
  border-radius: 5000%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: -30px;
}
.process-team-registration .header-icon {
  font-size: 40px;
  color: #36425A;
}
.process-team-registration .process-title {
  font-size: 22px;
}
.process-team-registration .process-description {
  font-size: 14px;
  text-align: center;
  width: 80%;
}
.process-team-registration .picker-container {
  padding: 0 15px;
}
.process-team-registration .user-picker-container {
  display: flex;
  padding: 0 15px;
  height: 400px;
}
.process-team-registration .stepper-container {
  height: 70px;
  justify-content: center;
  align-items: center;
  display: flex;
  background-color: #fff;
}
.process-team-registration .awesome-stepper {
  justify-content: center;
  align-items: center;
  display: flex;
  background-color: #fff;
}
.process-team-registration .submit-button-container {
  display: flex;
  justify-content: center;
  padding: 20px;
  text-align: right;
  margin-top: 0px;
  background-color: #f2f4fb;
}
.process-team-registration .process-users {
  flex: 1;
  padding: 20px;
}
.process-team-registration .process-users .process-users-header {
  margin-bottom: 30px;
  display: flex;
  justify-content: flex-end;
}
.process-team-registration .process-users .process-users-content {
  max-height: 500px;
  overflow: auto;
  margin-bottom: 20px;
}
.process-team-registration .process-users .process-users-name {
  font-weight: bold;
}
.process-team-registration .process-users .process-users-date-started {
  font-size: 12px;
}
.process-team-registration .process-users .process-users-row {
  display: flex;
  margin-bottom: 20px;
}
.process-team-registration .process-users .process-users-column-users {
  display: flex;
  flex: 3;
  align-items: center;
  color: #36425A;
}
.process-team-registration .process-users .process-users-avatar {
  margin-right: 10px;
}
.process-team-registration .process-users .process-users-default-avatar {
  margin-right: 10px;
  background-color: #d8e0f2;
  width: 50;
  height: 50;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 30;
}
.process-team-registration .process-users .process-users-column-xp {
  display: flex;
  flex: 1;
}
.process-team-registration .process-users .process-users-column-progress {
  display: flex;
  flex: 4;
  align-items: center;
}
.process-team-registration .process-users .period-progress-item {
  margin-right: 10px;
  font-size: 24px;
}
.process-team-registration .process-users .progress-legend {
  display: flex;
  align-items: center;
}
.process-team-registration .process-users .progress-legend-item {
  display: flex;
  align-items: center;
  margin-right: 20px;
}
.process-team-registration .process-users .progress-legend-item-icon {
  font-size: 24px;
  margin-right: 5px;
}
.rounded-image-view {
  width: 250px;
  /* Adjust the width as needed */
  height: 150px;
  /* Make sure the height matches the width for a square */
  border-radius: 10px;
  /* Adjust the border-radius to control the roundness of corners */
  overflow: hidden;
  /* Ensure content within the div is clipped to the rounded shape */
}
.rounded-image-view img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  /* Ensure the image covers the entire container */
}
.container {
  display: flex;
  justify-content: space-between;
  /* Align paragraphs to different ends */
}
.checklist-playground {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
}
.checklist-playground .title {
  text-align: center;
  font-size: 14;
  margin: 15;
}

.employees-tab {
  display: flex;
  flex: 1;
  overflow: hidden;
  flex-direction: column;
}
.employees-tab .filters {
  osition: relative;
  /* margin: 20; */
  /* margin-top: 5; */
  /* margin-bottom: 5; */
  display: flex;
  border-bottom: 1px solid #ddd;
  padding-left: 10;
}
.employees-tab .filters .ngager-selectfield {
  margin-left: 0;
  background-color: transparent;
  margin-bottom: 3px;
  border: none;
  flex: 0;
}
.employees-tab .employeesList {
  overflow: auto;
}
.employees-tab .employeesList .card {
  border-radius: 0;
}
.employees-tab .employeesList .card .user-image {
  width: 100px;
  height: 100px;
  margin: 40px auto 0 auto;
  border-radius: 100px;
  background-color: #3e4b64;
  overflow: hidden;
  display: flex;
  color: #f2f6fc;
}
.employees-tab .employeesList .card .user-image img {
  width: 100%;
  height: 100%;
}
.employees-tab .employeesList .card .user-image i.fa-user {
  margin: auto;
  font-size: 50;
}

.card-picker .card-picker-search {
  background-color: #eef2fc;
  margin: 20px;
}
.card-picker .card-picker-content {
  max-height: 500px;
  overflow-y: auto;
  width: 100%;
}
.card-picker .cards-container {
  display: flex;
  min-height: 500px;
  align-items: center;
}
.card-picker .cards-container .card {
  width: 180px;
  height: 250px;
}

.awesome-stepper {
  position: sticky;
  bottom: 0;
  width: 100%;
  background-color: #eef2fc;
  height: 48px;
  z-index: 100;
}
.awesome-stepper.ngager-wizard .wizard-breadcrumbs {
  position: absolute;
  bottom: 0;
  height: auto;
  display: flex;
  flex-direction: row;
}
.awesome-stepper.ngager-wizard .wizard-breadcrumbs .navigation-button.disabled {
  color: #ccc;
  cursor: not-allowed;
}
.awesome-stepper.ngager-wizard .wizard-breadcrumbs .steps {
  margin: 0 40px 0 30px;
}
.awesome-stepper.ngager-wizard .wizard-breadcrumbs .steps .step {
  cursor: pointer;
  width: auto;
  display: flex;
  min-width: 150;
  padding-right: 40px;
}
.awesome-stepper.ngager-wizard .wizard-breadcrumbs .steps .step > span {
  white-space: nowrap;
  margin: auto;
}
.awesome-stepper.ngager-wizard .wizard-breadcrumbs .steps .step i {
  font-size: 19;
  margin-top: 10;
  margin-left: 10px;
  position: absolute;
  right: 0;
}
.awesome-stepper.ngager-wizard .wizard-breadcrumbs .steps .step.disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.avatar {
  overflow: hidden;
  border-radius: 50%;
}
.avatar-square {
  border-radius: 0;
}
.avatar-img {
  height: 100%;
  width: 100%;
  text-align: center;
}

.completion-indicator {
  width: 62px;
  text-align: center;
}
.completion-indicator__icon {
  border: 4px solid #f5f5f5;
  background-color: #dadada;
  color: #ffffff;
  height: 22px;
  width: 22px;
  border-radius: 50%;
  line-height: 22px !important;
  font-size: 10px !important;
  text-align: center;
}
.completion-indicator__icon--in-progress {
  background-color: #ffa500;
  border: 4px solid #ffe4b2;
}
.completion-indicator__icon--completed {
  background-color: #9acf61;
  border: 4px solid #e2f9ca;
}

.act-resources-menu__header {
  display: flex;
  align-items: center;
  min-height: 68px;
  cursor: pointer;
}
.act-resources-menu__header:hover {
  background-color: #f1f5fd;
}
.act-resources-menu__header-icon {
  flex-grow: 1;
  flex-basis: 0;
  font-size: 26px !important;
  text-align: center;
}
.act-resources-menu__title {
  flex-grow: 1;
  flex-basis: 55%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.act-resources-menu__toggle-icon {
  flex-grow: 1;
  font-size: 18px !important;
  text-align: center;
}
.act-resources-menu__button-act {
  padding: 4px 10px;
  border-radius: 10px;
  color: #ffffff;
  outline: none;
  text-align: center;
  flex-grow: 1;
  flex-basis: 0;
}
.act-resources-menu-item {
  background-color: #fbfbfb;
  display: flex;
  align-items: center;
  min-height: 67px;
  cursor: pointer;
  transition-property: all;
  transition-duration: 0.3s;
}
.act-resources-menu-item:hover {
  background-color: #f1f5fd;
}
.act-resources-menu-item--active {
  background-color: #d2def5;
}
.act-resources-menu-item__resource-icon {
  flex-grow: 1;
  font-size: 15px !important;
  text-align: center;
}
.act-resources-menu-item__resource-meta {
  flex-grow: 1;
  flex-basis: 55%;
  font-size: 12px;
}
.act-resources-menu-item__resource-meta-date {
  color: #bfbfbf;
  font-size: 10px;
}
.act-resources-menu-item__icon-consumed {
  flex-grow: 1;
  text-align: center;
  font-size: 20px !important;
}

.upload-progress-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background-color: #36425A;
  color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.upload-progress-modal .container {
  display: flex;
  flex: 1;
  width: 800;
  flex-direction: column;
  margin: auto;
  align-items: center;
  justify-content: space-around;
  flex: 0;
  /* padding-top: 50; */
  /* padding-bottom: 50; */
  min-height: 150;
}
.upload-progress-modal .container span.message {
  font-size: 1.4em;
}

.moduleHolder > .ticket-home,
.moduleHolder > .publicinfo-home {
  flex: 1 1 0%;
  flex-grow: 1;
  height: 100%;
  display: flex;
  width: 100%;
  margin: auto;
  flex-direction: column;
}
.moduleHolder > .ticket-home .ngager-list .item,
.moduleHolder > .publicinfo-home .ngager-list .item {
  min-height: 100;
}
.moduleHolder > .ticket-home .ngager-list .item .image-content,
.moduleHolder > .publicinfo-home .ngager-list .item .image-content {
  min-width: 80px;
  max-width: 80;
}
.moduleHolder > .ticket-home .tabs,
.moduleHolder > .publicinfo-home .tabs {
  height: 48;
  border-bottom: 1px solid #DBE0EB;
}
.moduleHolder > .ticket-home .tabs > div,
.moduleHolder > .publicinfo-home .tabs > div {
  max-width: 400;
  min-width: 400;
}
.moduleHolder > .ticket-home .content,
.moduleHolder > .publicinfo-home .content {
  display: flex;
  flex: 1;
  margin-top: 5;
  height: 100%;
  overflow: hidden;
}
.moduleHolder > .ticket-home .content .left-column,
.moduleHolder > .publicinfo-home .content .left-column {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.moduleHolder > .ticket-home .content .left-column .search-box,
.moduleHolder > .publicinfo-home .content .left-column .search-box {
  border-bottom: 1px solid #BCD1F9;
}
.moduleHolder > .ticket-home .content .left-column .ticket-list,
.moduleHolder > .publicinfo-home .content .left-column .ticket-list,
.moduleHolder > .ticket-home .content .left-column .publicinfo-list,
.moduleHolder > .publicinfo-home .content .left-column .publicinfo-list {
  width: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.moduleHolder > .ticket-home .content .left-column .ticket-list .fullname,
.moduleHolder > .publicinfo-home .content .left-column .ticket-list .fullname,
.moduleHolder > .ticket-home .content .left-column .publicinfo-list .fullname,
.moduleHolder > .publicinfo-home .content .left-column .publicinfo-list .fullname {
  font-size: 0.9em;
}
.moduleHolder > .ticket-home .content .left-column .add-button,
.moduleHolder > .publicinfo-home .content .left-column .add-button {
  width: 100%;
  height: 96;
  background-color: #E1E9F9;
  font-size: 1.2em;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.moduleHolder > .ticket-home .content .left-column .add-button i.fa,
.moduleHolder > .publicinfo-home .content .left-column .add-button i.fa {
  color: #6C81AF;
  font-size: 35px;
  margin-right: 10;
  opacity: 0.7;
  -webkit-text-stroke-width: 4px;
  -webkit-text-stroke-color: #E1E9F9;
}
.moduleHolder > .ticket-home .content .left-column .add-button span,
.moduleHolder > .publicinfo-home .content .left-column .add-button span {
  opacity: 0.7;
}
.moduleHolder > .ticket-home .content .left-column .add-button:hover i.fa,
.moduleHolder > .publicinfo-home .content .left-column .add-button:hover i.fa,
.moduleHolder > .ticket-home .content .left-column .add-button:hover span,
.moduleHolder > .publicinfo-home .content .left-column .add-button:hover span {
  opacity: 1;
}
.moduleHolder > .ticket-home .content .right-column,
.moduleHolder > .publicinfo-home .content .right-column {
  flex: 1;
  display: flex;
  background-color: #e8ecf5;
}
.ticket-details,
.add-ticket,
.publicinfo-details,
.add-publicinfo {
  position: relative;
  display: flex;
  flex: 1;
  height: 100%;
}
.ticket-details .media-content,
.add-ticket .media-content,
.publicinfo-details .media-content,
.add-publicinfo .media-content {
  display: flex;
  flex: 1;
  overflow: hidden;
  background-color: #E1E9F9;
  z-index: 1;
}
.ticket-details .media-content > div,
.add-ticket .media-content > div,
.publicinfo-details .media-content > div,
.add-publicinfo .media-content > div {
  width: 100%;
}
.ticket-details .open-button,
.add-ticket .open-button,
.publicinfo-details .open-button,
.add-publicinfo .open-button {
  position: absolute;
  bottom: 0;
  cursor: pointer;
  z-index: 2;
  right: 0;
  width: 40;
  height: 40;
  background-color: #5186ED;
  color: #FFF;
}
.ticket-details .open-button .fa,
.add-ticket .open-button .fa,
.publicinfo-details .open-button .fa,
.add-publicinfo .open-button .fa {
  font-size: 20;
  position: absolute;
  bottom: 7;
  right: 10;
}
.ticket-details .meta-content,
.add-ticket .meta-content,
.publicinfo-details .meta-content,
.add-publicinfo .meta-content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  min-height: 150;
  display: flex;
  color: #fff;
  justify-content: center;
  align-items: center;
  z-index: 2;
}
.ticket-details .meta-content .close-button,
.add-ticket .meta-content .close-button,
.publicinfo-details .meta-content .close-button,
.add-publicinfo .meta-content .close-button {
  cursor: pointer;
  position: absolute;
  right: 5;
  top: 5;
  z-index: 5;
  font-size: 16;
}
.ticket-details .meta-content .background,
.add-ticket .meta-content .background,
.publicinfo-details .meta-content .background,
.add-publicinfo .meta-content .background {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: #5186ED;
  opacity: 0.85;
  z-index: 1;
}
.ticket-details .meta-content .fa-paper-plane-o,
.add-ticket .meta-content .fa-paper-plane-o,
.publicinfo-details .meta-content .fa-paper-plane-o,
.add-publicinfo .meta-content .fa-paper-plane-o,
.ticket-details .meta-content .fa-info-circle,
.add-ticket .meta-content .fa-info-circle,
.publicinfo-details .meta-content .fa-info-circle,
.add-publicinfo .meta-content .fa-info-circle,
.ticket-details .meta-content .fa-ticket,
.add-ticket .meta-content .fa-ticket,
.publicinfo-details .meta-content .fa-ticket,
.add-publicinfo .meta-content .fa-ticket {
  font-size: 60;
  display: flex;
  width: 70;
  height: 70;
  justify-content: center;
  align-items: center;
  z-index: 3;
  margin-left: 20;
  margin-right: 20;
}
.ticket-details .meta-content .buttons,
.add-ticket .meta-content .buttons,
.publicinfo-details .meta-content .buttons,
.add-publicinfo .meta-content .buttons {
  display: flex;
  flex: 1;
  min-width: 200;
  max-width: 200;
  flex-direction: column;
  z-index: 3;
  margin-right: 20;
  padding-top: 20;
  padding-bottom: 20;
}
.ticket-details .meta-content .content,
.add-ticket .meta-content .content,
.publicinfo-details .meta-content .content,
.add-publicinfo .meta-content .content {
  display: flex;
  flex: 1;
  z-index: 3;
  min-height: 100;
  margin: 10;
  position: relative;
  align-items: center;
  max-width: 700;
  padding: 20;
  overflow: hidden;
  padding-left: 0;
  margin-left: 0;
}
.ticket-details .meta-content .content > div,
.add-ticket .meta-content .content > div,
.publicinfo-details .meta-content .content > div,
.add-publicinfo .meta-content .content > div {
  display: flex;
  flex: 1;
  flex-direction: column;
  width: 100%;
}
.ticket-details .meta-content .content > div.comment-field,
.add-ticket .meta-content .content > div.comment-field,
.publicinfo-details .meta-content .content > div.comment-field,
.add-publicinfo .meta-content .content > div.comment-field {
  position: absolute;
  left: 10;
  right: 10;
}
.ticket-details .meta-content .content > div .info,
.add-ticket .meta-content .content > div .info,
.publicinfo-details .meta-content .content > div .info,
.add-publicinfo .meta-content .content > div .info {
  font-size: 0.9em;
  display: flex;
  justify-content: flex-start;
  margin-top: 5;
  flex-direction: row;
  flex-wrap: wrap;
  position: relative;
}
.ticket-details .meta-content .content > div .info > span,
.add-ticket .meta-content .content > div .info > span,
.publicinfo-details .meta-content .content > div .info > span,
.add-publicinfo .meta-content .content > div .info > span {
  margin-right: 30;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: 5;
  padding-left: 20;
}
.ticket-details .meta-content .content > div .info .fa,
.add-ticket .meta-content .content > div .info .fa,
.publicinfo-details .meta-content .content > div .info .fa,
.add-publicinfo .meta-content .content > div .info .fa {
  font-size: 14;
  position: absolute;
  left: 0;
}
.ticket-details .meta-content .content > div .title,
.add-ticket .meta-content .content > div .title,
.publicinfo-details .meta-content .content > div .title,
.add-publicinfo .meta-content .content > div .title {
  font-size: 1.5em;
}
.ticket-details .meta-content .content > div .description,
.add-ticket .meta-content .content > div .description,
.publicinfo-details .meta-content .content > div .description,
.add-publicinfo .meta-content .content > div .description {
  opacity: 0.9;
  margin-top: 15;
  margin-bottom: 20;
  line-height: 16px;
  white-space: pre-wrap;
  max-height: 50vh;
  overflow: auto;
}
.ticket-details .meta-content .ticket-comments,
.add-ticket .meta-content .ticket-comments,
.publicinfo-details .meta-content .ticket-comments,
.add-publicinfo .meta-content .ticket-comments {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding-right: 100;
  max-height: 150;
  overflow-y: auto;
  margin-bottom: 20;
}
.ticket-details .meta-content .ticket-comments .comment,
.add-ticket .meta-content .ticket-comments .comment,
.publicinfo-details .meta-content .ticket-comments .comment,
.add-publicinfo .meta-content .ticket-comments .comment {
  margin-bottom: 40px;
  position: relative;
}
.ticket-details .meta-content .ticket-comments .comment > div,
.add-ticket .meta-content .ticket-comments .comment > div,
.publicinfo-details .meta-content .ticket-comments .comment > div,
.add-publicinfo .meta-content .ticket-comments .comment > div {
  width: 100px;
  text-align: center;
  margin-left: 20px;
}
.ticket-details .meta-content .ticket-comments .comment > div .ngager-avatar,
.add-ticket .meta-content .ticket-comments .comment > div .ngager-avatar,
.publicinfo-details .meta-content .ticket-comments .comment > div .ngager-avatar,
.add-publicinfo .meta-content .ticket-comments .comment > div .ngager-avatar {
  margin: auto;
  margin-bottom: 5px;
}
.ticket-details .meta-content .ticket-comments .comment .created-time,
.add-ticket .meta-content .ticket-comments .comment .created-time,
.publicinfo-details .meta-content .ticket-comments .comment .created-time,
.add-publicinfo .meta-content .ticket-comments .comment .created-time {
  position: absolute;
  font-size: 11px;
  width: 200px;
  bottom: -10px;
  left: 0;
  text-align: left;
}
.ticket-details .meta-content .ticket-comments .comment .created-time i,
.add-ticket .meta-content .ticket-comments .comment .created-time i,
.publicinfo-details .meta-content .ticket-comments .comment .created-time i,
.add-publicinfo .meta-content .ticket-comments .comment .created-time i {
  font-size: 14;
  margin-right: 5;
}
.ticket-details .meta-content .ticket-comments .comment .comment-by .ngager-avatar > div .avatar,
.add-ticket .meta-content .ticket-comments .comment .comment-by .ngager-avatar > div .avatar,
.publicinfo-details .meta-content .ticket-comments .comment .comment-by .ngager-avatar > div .avatar,
.add-publicinfo .meta-content .ticket-comments .comment .comment-by .ngager-avatar > div .avatar {
  background-color: #5186ED;
}
.ticket-details .meta-content .ticket-comments .comment q,
.add-ticket .meta-content .ticket-comments .comment q,
.publicinfo-details .meta-content .ticket-comments .comment q,
.add-publicinfo .meta-content .ticket-comments .comment q {
  font-style: italic;
  margin-bottom: 10px;
  font-size: 14px;
  border: 1px solid #dbdee8;
  display: block;
  padding: 20px;
  border-radius: 10px;
  flex-grow: 1;
  position: relative;
  background-color: #5186ED;
}
.ticket-details .meta-content .ticket-comments .comment q::after,
.add-ticket .meta-content .ticket-comments .comment q::after,
.publicinfo-details .meta-content .ticket-comments .comment q::after,
.add-publicinfo .meta-content .ticket-comments .comment q::after,
.ticket-details .meta-content .ticket-comments .comment q::before,
.add-ticket .meta-content .ticket-comments .comment q::before,
.publicinfo-details .meta-content .ticket-comments .comment q::before,
.add-publicinfo .meta-content .ticket-comments .comment q::before {
  content: '';
  display: block;
  position: absolute;
  left: 100%;
  width: 0;
  height: 0;
  border-style: solid;
}
.ticket-details .meta-content .ticket-comments .comment q::after,
.add-ticket .meta-content .ticket-comments .comment q::after,
.publicinfo-details .meta-content .ticket-comments .comment q::after,
.add-publicinfo .meta-content .ticket-comments .comment q::after {
  top: 21px;
  border-color: transparent transparent transparent #5186ED;
  border-width: 9px;
}
.ticket-details .meta-content .ticket-comments .comment q::before,
.add-ticket .meta-content .ticket-comments .comment q::before,
.publicinfo-details .meta-content .ticket-comments .comment q::before,
.add-publicinfo .meta-content .ticket-comments .comment q::before {
  top: 20px;
  border-color: transparent transparent transparent #fff;
  border-width: 10px;
}
.ticket-details .meta-content .ticket-comments .comment p,
.add-ticket .meta-content .ticket-comments .comment p,
.publicinfo-details .meta-content .ticket-comments .comment p,
.add-publicinfo .meta-content .ticket-comments .comment p {
  font-size: 10px;
}
.add-ticket .open-button .fa,
.add-publicinfo .open-button .fa {
  font-size: 18px;
  position: absolute;
  bottom: 7;
  right: 5;
  transform: rotate(270deg);
}
.add-ticket .meta-content .content,
.add-publicinfo .meta-content .content {
  padding-left: 20;
  padding-right: 20;
  flex-direction: column;
}
.add-ticket .meta-content .content .fields,
.add-publicinfo .meta-content .content .fields {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  width: 100%;
  max-width: 900;
  margin: auto;
}
.add-ticket .meta-content .content .fields .left-side,
.add-publicinfo .meta-content .content .fields .left-side {
  margin-right: 20;
  flex-direction: column;
  width: 400;
  overflow: hidden;
}
.add-ticket .meta-content .content .fields .right-side,
.add-publicinfo .meta-content .content .fields .right-side {
  display: flex;
  flex-basis: 70%;
  flex-direction: column;
}
.add-ticket .meta-content .content .text-fields,
.add-publicinfo .meta-content .content .text-fields {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  width: 100%;
  max-width: 900;
  margin: auto;
}
.add-ticket .meta-content .content .text-fields .text-title,
.add-publicinfo .meta-content .content .text-fields .text-title {
  display: flex;
  flex-basis: 30%;
  margin-right: 20;
}
.add-ticket .meta-content .content .text-fields .text-description,
.add-publicinfo .meta-content .content .text-fields .text-description {
  display: flex;
  flex-basis: 70%;
}
.add-ticket .meta-content .content .button,
.add-publicinfo .meta-content .content .button {
  width: 100%;
  margin-top: 10;
  justify-content: center;
  align-items: center;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.game-meeting-container {
  width: 100%;
  position: relative;
  font-size: 1.2em;
}
.game-meeting-container .content-container {
  height: 100%;
  overflow: hidden;
  position: relative;
}
.game-meeting-container .content-container .loading {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
}
.game-meeting-container .content-container .meeting-body {
  height: 100%;
  overflow: auto;
  position: relative;
}
.game-meeting-container .content-container .close-icon {
  position: absolute;
  right: 10px;
  top: 10px;
  outline: none;
  font-size: 14px;
  color: #FFFFFF;
  cursor: pointer;
  z-index: 999;
  opacity: 0.8;
  background-color: #222;
  width: 22px;
  height: 18px;
  text-align: center;
  padding-top: 4px;
  border-radius: 40px;
  border: 1px solid;
}
.game-meeting-container .content-container .cards-container .card .card-content .subTitle {
  color: #778091;
}
.game-meeting-container .content-container .cards-container .card .card-content .icon .avatar {
  width: 50px;
  height: 50px;
  border-radius: 100px;
  background-color: #FFFFFF;
  color: #778091;
}
.game-meeting-container .content-container .cards-container .card .card-content .icon .avatar .fa-user {
  font-size: 1.2em;
  line-height: 50px;
}
.game-meeting-container .content-container .buttons-container {
  text-align: center;
  margin-top: 30px;
  margin-bottom: 50px;
  display: block;
}
.game-meeting-container .stepper {
  position: sticky;
  bottom: 0;
  background-color: #f0f4fc;
  z-index: 999;
}
.awesome-button {
  min-width: 100px !important;
  margin-left: 30px;
  border-width: 1px;
  border-style: solid;
  border-color: #ddd;
  border-radius: 36px;
  box-shadow: none !important;
}
.awesome-button input {
  border-radius: 30px;
}

.survey-form {
  display: flex;
  flex: 1;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
}
.survey-form .message {
  text-align: center;
  width: 100%;
  display: block;
  color: chocolate;
  font-size: 16px;
}
.survey-form .form-inputs {
  overflow: hidden;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  flex: 1;
  align-items: center;
}
.survey-form .form-inputs .ngager-survey-questions {
  max-width: 900;
  margin: auto;
  padding: 20;
}
.survey-form .survey-question > label {
  font-size: 1.2em;
}
.survey-form div.survey-name {
  border-bottom: 1px solid #6c81af4d;
  padding: 10;
  display: flex;
  align-items: center;
  justify-content: center;
}
.survey-form div.survey-name h3 {
  font-size: 1.4em;
  font-weight: bold;
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 900;
}
.survey-form div.survey-name h3 > i {
  font-size: 30;
  margin-right: 10;
}
.survey-form .text-container .textarea-field textarea,
.survey-form .text-container .textarea-field input {
  background-color: #fff !important;
  border: 1px solid #36425a !important;
  border-radius: 5px !important;
}
.survey-form .save-button-container {
  display: flex;
  justify-content: center;
}

.anonymous {
  display: flex !important;
  justify-content: center;
  align-items: center;
  flex-direction: row !important;
  padding: 10px 20px;
  overflow: hidden !important;
  background-color: #fff;
  border-radius: 5px;
  cursor: pointer;
  flex: none !important;
}
.anonymous:hover {
  padding: 10px 20px !important;
}
.anonymous .fa {
  margin-right: 5px;
  margin-top: 2px;
  font-size: 14px;
}

.awesome-toggle {
  height: 22px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.awesome-toggle span.left-label,
.awesome-toggle span.right-label {
  display: inline-block;
  cursor: pointer;
}
.awesome-toggle span.left-label.active,
.awesome-toggle span.right-label.active {
  font-weight: bold;
  cursor: default;
}
.awesome-toggle span.left-label {
  padding-right: 6;
}
.awesome-toggle span.right-label {
  padding-left: 6;
}

.simple-slider {
  position: relative;
  padding: 30;
}
.simple-slider .track {
  position: relative;
  width: 100%;
  height: 2px;
  background-color: #6c81af;
  display: flex;
  align-items: center;
  justify-content: center;
}
.simple-slider .track .min {
  position: absolute;
  left: 0;
  bottom: -40;
}
.simple-slider .track .max {
  position: absolute;
  right: 0;
  bottom: -40;
}
.simple-slider .track > .handle {
  width: 40;
  height: 40;
  background-color: #6c81af;
  border-radius: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  padding: 5;
}
.simple-slider .track > .handle > span {
  color: #fff;
  width: 100%;
  overflow: hidden;
  text-align: center;
}

.text-question-answers {
  margin-top: 20;
  padding-left: 15;
  padding-top: 10;
  position: relative;
}
.text-question-answers .title {
  position: relative;
  display: flex;
  align-items: center;
  background-color: #36425a;
}
.text-question-answers .title > span {
  color: #FFF;
}
.text-question-answers .title i.close-icon {
  font-size: 25;
  color: #fff;
  position: absolute;
  right: 5;
  top: 5;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #36425a;
  cursor: pointer;
}
.text-question-answers div.answers {
  margin-top: 10;
}
.text-question-answers div.answers div.answer {
  padding: 15px 0px;
  display: flex;
  border-bottom: 1px dashed #97add94D;
  margin-left: 70;
  margin-right: 70;
}
.text-question-answers div.answers div.answer:last-child {
  border-bottom: none;
}
.text-question-answers div.answers div.answer .fa {
  margin-right: 10px;
  font-size: 16px;
  vertical-align: middle;
  color: #97add9;
  opacity: 0.3;
}
.text-question-answers div.answers div.answer span {
  font-style: italic;
  color: #36425A;
}
.text-question-answers .show-more {
  text-align: center;
  margin-bottom: 20;
  color: #6fa0ff;
  cursor: pointer;
}

.summary-question-header {
  display: flex;
  margin-bottom: 0;
  padding-left: 70;
  padding-right: 70;
}
.summary-question-header .buttons {
  z-index: 100;
  display: flex;
  justify-content: flex-end;
}
.summary-question-header .buttons > div {
  margin: 5;
}
.summary-question-header .buttons i {
  font-size: 20;
  color: #5d76aa;
  cursor: pointer;
}
.summary-question-header .question-text {
  padding-left: 10;
  display: flex;
  flex: 1;
}
.summary-question-header .tags {
  display: flex;
  margin-left: 20;
  margin-right: 20;
  flex-direction: row;
  flex-wrap: nowrap;
  flex: 1;
}
.summary-question-header .tags .tag-name {
  display: flex;
  background-color: #36425a;
  padding: 5px;
  color: #fff;
  border-radius: 20px;
  padding-left: 10;
  padding-right: 10;
  white-space: nowrap;
  max-width: 150;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-right: 5;
}
.summary-question-header .tags .tag-name:last-child {
  margin-right: 0;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.share-file-dialog {
  min-height: 300;
}
.share-file-dialog .header {
  background-color: #36425a;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-height: 50;
  padding-top: 10;
  padding-bottom: 50;
}
.share-file-dialog .header .icon-container {
  width: 80;
  height: 80;
  border-radius: 80px;
  background-color: #ffffff;
  align-self: center;
  position: absolute;
  bottom: -40;
  display: flex;
}
.share-file-dialog .header .icon-container .fa,
.share-file-dialog .header .icon-container .ngager-font {
  font-size: 35;
  margin: auto;
  color: #36425a;
}
.share-file-dialog .header.title .fa {
  font-size: 40;
  margin: auto;
  color: #36425a;
}
.share-file-dialog .header.title .fa-times {
  position: absolute;
  right: 0;
  top: 0;
  color: #ffffff;
  font-size: 25;
  -webkit-text-stroke-width: 3px;
  -webkit-text-stroke-color: #36425a;
  cursor: pointer;
}
.share-file-dialog .header.title span {
  color: #fff;
  font-size: 1.5em;
  width: 90%;
  text-align: center;
}
.share-file-dialog .body {
  padding-top: 60;
  padding-left: 40;
}
.share-file-dialog .body .postFeedContainer {
  width: 100%;
}
.share-file-dialog .body .postFeedContainer.onTop {
  position: relative;
  z-index: 2;
}
.share-file-dialog .body .postFeedContainer .postFeed {
  background: white;
  padding: 20px 20px 0 20px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  position: relative;
}
.share-file-dialog .body .postFeedContainer .postFeed .adminAvatar {
  position: absolute;
  left: -50px;
  top: 25px;
  border: none;
  padding: 10;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadingMessage {
  position: absolute;
  padding: 30px;
  background: white;
  z-index: 10;
  right: 0;
  text-align: center;
}
.share-file-dialog .body .postFeedContainer .postFeed .feedText {
  flex-grow: 1;
  margin-left: 40px;
}
.share-file-dialog .body .postFeedContainer .postFeed hr {
  display: none;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadedMediaPreview {
  position: relative;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadedMediaPreview > div {
  position: absolute;
  right: 0;
  width: 70px;
  height: 70px;
  border: 1px solid #f0f4fc;
  border-radius: 6px;
  overflow: hidden;
  opacity: 0;
  margin-top: 25px;
  transition-property: all;
  transition-duration: 1s;
  display: flex;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadedMediaPreview > div a {
  cursor: pointer;
  position: absolute;
  outline: none;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadedMediaPreview > div a i {
  background: #36425A;
  width: 16px;
  height: 16px;
  text-align: center;
  line-height: 15px;
  border-radius: 20px;
  color: #f0f4fc;
  font-size: 10px;
  margin: 4px;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadedMediaPreview > div img {
  width: 100%;
  align-self: center;
  transition-property: all;
  transition-duration: 1s;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadedMediaPreview > div.video i.fa-video-camera {
  position: absolute;
  font-size: 32px;
  top: 20px;
  left: 18px;
  color: #f0f4fc;
  opacity: 0.6;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadedMediaPreview > span {
  display: flex;
  flex-direction: column;
  width: 80;
  text-align: center;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadedMediaPreview > span i.fa,
.share-file-dialog .body .postFeedContainer .postFeed .uploadedMediaPreview > span i.ngager-font {
  font-size: 50;
  align-self: center;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadedMediaPreview > span > span {
  font-size: 0.8em;
  margin-top: 5;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadButtons {
  margin-top: 10px;
  border-top: 1px solid #f0f4fc;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadButtons > div {
  flex-grow: 1;
  text-align: center;
  font-size: 14px;
  margin: auto;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadButtons > div button {
  width: 100%;
  border: none;
  background: none;
  padding: 20px;
  cursor: pointer;
  color: #778091;
  font-size: 14px;
  font-family: "Helvetica Neue", Helvetica, "open sans", verdana;
  outline: none;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadButtons > div button i {
  color: #36425A;
}
.share-file-dialog .body .postFeedContainer .postFeed .uploadButtons > span {
  height: 50px;
  width: 1px;
  background-color: #f0f4fc;
}
.share-file-dialog .body .postFeedContainer .publishPost {
  width: 100%;
  font-family: inherit;
  pointer-events: none;
  margin-bottom: 30px;
  opacity: 0;
  transition-property: all;
  transition-duration: 0.3s;
}
.share-file-dialog .body .postFeedContainer .publishPost.buttonVisible {
  opacity: 1;
  cursor: pointer;
  pointer-events: all;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.ngager-performance-slider-container {
  position: relative;
  padding-bottom: 70px;
  padding-left: 70;
  padding-right: 70;
  padding-top: 60;
}
.ngager-performance-slider-container .toggle-detail {
  position: absolute;
  bottom: 5px;
}
.ngager-performance-slider-container .line {
  width: 100%;
  background-color: red;
  position: relative;
  display: flex;
  align-items: center;
}
.ngager-performance-slider-container .line .min {
  position: absolute;
  left: 0;
  z-index: 5;
  bottom: -20px;
}
.ngager-performance-slider-container .line .max {
  position: absolute;
  right: 0;
  z-index: 5;
  bottom: -20px;
}
.ngager-performance-slider-container .line .steps {
  width: 100%;
  display: flex;
  height: 2px;
}
.ngager-performance-slider-container .line .steps .step {
  position: absolute;
  width: auto;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.ngager-performance-slider-container .line .steps .step .bar {
  width: 1px;
  background: #9aaacc;
  position: relative;
  padding-top: 5;
  padding-bottom: 5;
  height: 100%;
  display: flex;
  justify-content: center;
}
.ngager-performance-slider-container .line .steps .step .bar span {
  margin-left: -4px;
  margin-top: 50px;
  display: block;
  font-size: 1em;
}
.ngager-performance-slider-container .line .circle {
  position: absolute;
  width: 0;
  cursor: pointer;
}
.ngager-performance-slider-container .line .circle > div {
  border-radius: 100px;
  display: flex;
}
.ngager-performance-slider-container .line .circle > div > span {
  margin: auto;
}
.ngager-performance-slider-container .line .circle.peers {
  left: 0%;
  z-index: 12;
}
.ngager-performance-slider-container .line .circle.peers > div {
  width: 40px;
  height: 40px;
  margin-left: -20;
  background-color: #DBBC8E;
  border: 2px solid #DBBC8E;
}
.ngager-performance-slider-container .line .circle.peers > div:hover {
  border: 2px solid #9acf61;
}
.ngager-performance-slider-container .line .circle.myself {
  left: 0%;
  z-index: 11;
}
.ngager-performance-slider-container .line .circle.myself:hover {
  z-index: 13;
}
.ngager-performance-slider-container .line .circle.myself > div {
  width: 60px;
  height: 60px;
  margin-left: -30;
  background-color: #7C98AB;
  border: 2px solid #7C98AB;
}
.ngager-performance-slider-container .line .circle.myself > div:hover {
  border: 2px solid #9acf61;
}
.ngager-performance-slider-container .line .circle.manager {
  left: 0%;
  z-index: 10;
}
.ngager-performance-slider-container .line .circle.manager:hover {
  z-index: 13;
}
.ngager-performance-slider-container .line .circle.manager > div {
  width: 80px;
  height: 80px;
  margin-left: -40;
  background-color: #AE8A8C;
  border: 2px solid #AE8A8C;
}
.ngager-performance-slider-container .line .circle.manager > div:hover {
  border: 2px solid #9acf61;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.feedback-summary {
  width: 100%;
  overflow: auto;
  display: flex;
  flex: 1;
  flex-direction: column;
  color: #36425A;
}
.feedback-summary .page-not-found {
  height: unset;
}
.feedback-summary span.no_data {
  font-size: 1em;
  opacity: 0.6;
  margin-top: 10;
  text-align: center;
  display: block;
  margin-bottom: 20;
}
.feedback-summary span.note {
  padding-left: 70;
  padding-right: 70;
  padding-bottom: 20;
  color: #bbb;
}
.feedback-summary .legend {
  display: flex;
  justify-content: center;
  margin: 0;
  padding: 0;
}
.feedback-summary .legend > div {
  padding: 15;
  display: flex;
  align-items: center;
  color: #36425A;
}
.feedback-summary .legend > div i.fa-square {
  font-size: 20;
  margin-right: 5;
}
.feedback-summary .legend > div i.fa-square.peer {
  color: #DBBC8E;
}
.feedback-summary .legend > div i.fa-square.manager {
  color: #AE8A8C;
}
.feedback-summary .legend > div i.fa-square.self {
  color: #7C98AB;
}
.feedback-summary.exporting .buttons {
  opacity: 0;
}
.feedback-summary .summary-text-question,
.feedback-summary .summary-slider-question,
.feedback-summary .summary-option-question,
.feedback-summary .summary-number-question {
  margin-bottom: 50;
  border-radius: 10px;
  min-height: 100;
}
.feedback-summary .summary-option-question {
  min-height: 400px;
  display: flex;
  flex-direction: column;
}
.feedback-summary .summary-option-question > .barchart {
  display: flex;
  flex: 1 1 0%;
  align-items: stretch;
  padding-top: 30px;
  padding-left: 50;
  padding-right: 70;
}
.feedback-summary .simple-slider {
  padding-top: 60;
  padding-bottom: 70;
  padding-left: 70;
  padding-right: 70;
}
.feedback-summary .summary-tag {
  position: relative;
}
.feedback-summary .summary-tag > .fa {
  font-size: 25;
  position: absolute;
  right: 70;
  cursor: pointer;
}
.feedback-summary .summary-tag > .fa.hidden {
  display: none;
}
.feedback-summary .summary-tag > div:last-child {
  margin-bottom: 100;
}
.feedback-summary .summary-tag div.reflections {
  padding-left: 0;
}
.feedback-summary .summary-tag .summary-slider-question.tag .summary-question-header .question-text {
  font-weight: bold;
  font-size: 1.4em;
}
.feedback-summary .summary-tag .summary-slider-question.tag .simple-slider {
  padding-top: 80;
  padding-bottom: 100;
  padding-left: 70;
  padding-right: 70;
}
.feedback-summary .summary-tag .summary-slider-question.tag .simple-slider .track .min,
.feedback-summary .summary-tag .summary-slider-question.tag .simple-slider .track .max {
  bottom: -90px;
}
.feedback-summary .summary-tag .summary-slider-question.tag .simple-slider .track > .handle {
  width: 80;
  height: 80;
  border-radius: 80px;
}
.feedback-summary .summary-tag .summary-slider-question.tag .simple-slider .track > .handle > span {
  font-size: 2em;
}
.feedback-summary .summary-tag .summary-slider-question.tag .ngager-performance-slider-container {
  width: auto;
  padding-bottom: 100;
  padding-top: 80;
}
.feedback-summary .summary-tag .summary-slider-question.tag .ngager-performance-slider-container .line .steps .step .bar span {
  margin-top: 85;
}
.feedback-summary .summary-tag .summary-slider-question.tag .ngager-performance-slider-container .line .circle.manager > div {
  width: 140;
  height: 140;
  border-radius: 140px;
  margin-left: -70;
}
.feedback-summary .summary-tag .summary-slider-question.tag .ngager-performance-slider-container .line .circle.manager > div > span {
  font-size: 1.6em;
}
.feedback-summary .summary-tag .summary-slider-question.tag .ngager-performance-slider-container .line .circle.myself > div {
  width: 100px;
  height: 100px;
  border-radius: 100px;
  margin-left: -50;
}
.feedback-summary .summary-tag .summary-slider-question.tag .ngager-performance-slider-container .line .circle.myself > div > span {
  font-size: 1.6em;
}
.feedback-summary .summary-tag .summary-slider-question.tag .ngager-performance-slider-container .line .circle.peers > div {
  width: 60;
  height: 60;
  border-radius: 60px;
  margin-left: -30;
}
.feedback-summary .summary-tag .summary-slider-question.tag .ngager-performance-slider-container .line .circle.peers > div > span {
  font-size: 1.6em;
}
.feedback-summary .nps-question .title {
  font-weight: bold;
  font-size: 1.4em;
  display: flex;
  padding-left: 70;
  padding-right: 70;
  padding-bottom: 20;
}
.feedback-summary .nps-question div.reflections {
  padding-left: 0;
  margin-bottom: 50;
}
.feedback-summary .summary-text-question .text-question-answers {
  padding: 0;
}
.feedback-summary .summary-text-question .answers .page-not-found {
  height: unset;
}
.feedback-summary .summary-number-question .circles {
  display: flex;
  justify-content: center;
}
.feedback-summary .summary-number-question .circles .circle {
  min-width: 60;
  min-height: 60;
  border-radius: 60px;
  background-color: #36425A;
  justify-content: center;
  align-items: center;
  margin: 30;
  display: flex;
  padding: 10;
  font-size: 2em;
  color: #FFFFFF;
}
.feedback-summary .summary-number-question .circles .circle.peer {
  background-color: #DBBC8E;
}
.feedback-summary .summary-number-question .circles .circle.self {
  background-color: #7C98AB;
}
.feedback-summary .summary-number-question .circles .circle.manager {
  background-color: #AE8A8C;
}
.feedback-summary .summary-question-header .question-text {
  padding-left: 0;
  padding-top: 5;
  font-size: 1.2em;
  color: #36425A;
}
.feedback-details {
  color: #36425A;
  width: 100%;
  display: flex;
  flex: 1;
  flex-direction: column;
}
.feedback-details .details-answer {
  padding: 20px 0px;
  border-bottom: 1px dashed #bcc3e6;
  position: relative;
  display: flex;
}
.feedback-details .details-answer:last-child {
  border-bottom: none;
}
.feedback-details .details-answer > .answer {
  display: flex;
  flex: 1;
  align-items: center;
}
.feedback-details .details-answer > .answer.slider-viewonly {
  margin-top: 20;
  margin-bottom: 20;
}
.feedback-details .details-answer > .answer i.fa-quote-left {
  opacity: 0.5;
  margin-right: 10;
}
.feedback-details .details-answer > .answer > span {
  font-weight: bold;
}
.feedback-details .details-answer .user {
  float: right;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 110;
  margin-left: 20;
}
.feedback-details .details-answer .user .fa-user-o {
  font-size: 42px;
  color: #97add9;
  vertical-align: middle;
  margin: 3;
}
.feedback-details .details-answer .user > span {
  font-size: 0.9em;
  text-align: center;
}
.feedback-details .details-answer .user > span.created {
  position: absolute;
  bottom: -15px;
  /* left: 0; */
  font-size: 0.8em;
  opacity: 0.7;
  font-style: italic;
}

.feedback-performance {
  position: relative;
  width: 100%;
  min-height: 90%;
}
.feedback-performance .spinner {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 99;
  display: flex;
  left: 0;
  top: 0;
}
.feedback-performance .spinner > div {
  margin: auto;
}
.feedback-performance .flex-box-container {
  display: flex;
  flex: 1 1 0%;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
.feedback-performance .give-feedback {
  display: flex;
  padding-bottom: 0;
  margin-bottom: 0;
  margin-top: 0;
  flex: 1;
  overflow: hidden;
}
.feedback-performance .give-feedback .survey-form {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.feedback-performance .give-feedback .survey-form .message {
  text-align: center;
  width: 100%;
  display: block;
  color: chocolate;
  font-size: 16px;
}
.feedback-performance .give-feedback .survey-form .form-inputs {
  overflow: hidden;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  flex: 1;
  align-items: center;
}
.feedback-performance .give-feedback .survey-form .form-inputs .ngager-survey-questions {
  max-width: 900;
  margin: auto;
  padding: 20;
}
.feedback-performance .give-feedback .survey-form .survey-question > label {
  font-size: 16px;
}
.feedback-performance .feedback-peers .cards-container .card {
  border-radius: 0;
  cursor: default;
}
.feedback-performance .feedback-peers .cards-container .card.create {
  cursor: pointer;
}
.feedback-performance .feedback-peers .cards-container .clickable .card {
  cursor: pointer;
}
.feedback-performance .feedback-peers .peers-answers-container {
  position: relative;
  display: flex;
  padding: 20;
  flex: 1;
}
.feedback-performance .feedback-peers .peers-answers-container .message {
  margin: auto;
}
.feedback-performance .feedback-peers .peers-answers-container .cards-container .card .ignored {
  border-top: 30px solid red;
}
.feedback-performance .feedback-team .cards-container .card {
  border-radius: 0;
  cursor: pointer;
}
.feedback-performance .feedback-team .peers-answers-container {
  position: relative;
  width: 100%;
  min-height: 80%;
  display: flex;
}
.feedback-performance .feedback-team .peers-answers-container .message {
  margin: auto;
}
.feedback-performance .feedback-team .peers-answers-container .cards-container .card .ignored {
  border-top: 30px solid red;
}

.survey-template-picker {
  height: 100%;
  width: 100%;
  display: flex;
  flex-grow: 1;
  max-height: 700;
  margin: auto;
  overflow: hidden;
}
.survey-template-picker .ngager-carousel-container {
  max-width: 1200;
  height: 100%;
}
.survey-template-picker .ngager-carousel-container .slick-list {
  margin-left: 40;
  margin-right: 40;
  display: flex;
  flex: 1;
  flex-direction: column;
}
.survey-template-picker .ngager-carousel-container .slick-track {
  height: 100%;
  display: flex;
}
.survey-template-picker .ngager-carousel-container .slick-dots {
  bottom: inherit !important;
  position: relative;
  display: flex !important;
  overflow: hidden;
}
.survey-template-picker .ngager-carousel-container .slick-slide {
  margin-bottom: 0;
  transform: scale(0.9);
}
.survey-template-picker .ngager-carousel-container .slick-slide > div {
  height: 100%;
  display: flex;
  justify-content: center;
}
.survey-template-picker .ngager-carousel-container .slick-slide .survey-template {
  opacity: 0.6;
}
.survey-template-picker .ngager-carousel-container .slick-slide .survey-template .speech-bubble {
  border: 1px solid #b3ccfe80;
}
.survey-template-picker .ngager-carousel-container .slick-slide .survey-template .speech-bubble > div {
  overflow: hidden;
}
.survey-template-picker .ngager-carousel-container .slick-slide .survey-template .ngager-button {
  opacity: 0;
}
.survey-template-picker .ngager-carousel-container .slick-current {
  transform: scale(1);
  transition: all 0.5s ease-in-out;
  z-index: 9;
}
.survey-template-picker .ngager-carousel-container .slick-current .survey-template {
  opacity: 1;
  transition: opacity 0.5s ease-in-out;
}
.survey-template-picker .ngager-carousel-container .slick-current .survey-template .ngager-button {
  opacity: 1;
  transition: opacity 0.5s ease-in-out;
}
.survey-template-picker .ngager-carousel-container .slick-current .survey-template .speech-bubble > div:hover {
  padding-right: 10;
  overflow-y: scroll;
}
.survey-template-picker .ngager-carousel-container .survey-template {
  color: #6c81af;
  display: flex;
  flex-direction: column;
  position: relative;
  padding-left: 30;
  padding-right: 30;
  margin-bottom: 20;
  flex: 1;
  align-items: center;
  min-width: 330;
  max-width: 330;
}
.survey-template-picker .ngager-carousel-container .survey-template > div {
  width: 100%;
}
.survey-template-picker .ngager-carousel-container .survey-template .header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 0;
}
.survey-template-picker .ngager-carousel-container .survey-template .header div.line {
  position: absolute;
  height: 1px;
  background-color: #ccd6ed;
  left: 0;
  right: 0;
}
.survey-template-picker .ngager-carousel-container .survey-template .header > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 10;
  background: #f0f4fc;
  padding-left: 10;
  padding-right: 10;
}
.survey-template-picker .ngager-carousel-container .survey-template .header > div span.title {
  font-size: 1.2em;
  font-weight: bold;
}
.survey-template-picker .ngager-carousel-container .survey-template .header > div span.num-questions {
  font-size: 1.1em;
  opacity: 0.65;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble {
  position: relative;
  background: #e1e9fc;
  border-radius: 6px;
  margin-top: 15;
  flex-grow: 1;
  padding: 20;
  display: flex;
  flex-direction: column;
  padding-right: 0;
  overflow: hidden;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble > div {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding-right: 20;
  margin-bottom: 25px;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble.selected {
  border: 3px solid #8ec22f;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble.selected > div {
  margin-bottom: 0;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble .question {
  margin-bottom: 20;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble .question .question-content.single-choice > div {
  display: flex;
  margin-top: 10px;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble .question .question-content.single-choice > div .icon {
  margin: auto;
  padding-left: 10;
  padding-right: 10;
  font-size: 1.2em;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble .question .question-content.single-choice > div > span {
  flex-grow: 1;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble .question .question-content.input-text .input {
  width: 100%;
  height: 30;
  border: 1px solid;
  background-color: beige;
  border-radius: 5px;
  margin-top: 5;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble .question .question-content.slider {
  margin-top: 20;
  padding-bottom: 20px;
  position: relative;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble .question .question-content.slider .track {
  position: relative;
  width: 100%;
  height: 2px;
  background-color: #6c81af;
  display: flex;
  align-items: center;
  justify-content: center;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble .question .question-content.slider .track > span {
  width: 25px;
  height: 25px;
  background-color: #6c81af;
  border-radius: 25px;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble .question .question-content.slider .min {
  position: absolute;
  left: 0;
  bottom: 0;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble .question .question-content.slider .max {
  position: absolute;
  right: 0;
  bottom: 0;
}
.survey-template-picker .ngager-carousel-container .survey-template .speech-bubble:after {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-bottom-color: #e1e9fc;
  border-top: 0;
  margin-left: -10px;
  margin-top: -10px;
}
.survey-template-picker .ngager-carousel-container .survey-template .button {
  display: flex;
  justify-content: center;
  position: absolute;
  bottom: -8px;
}

.ngager-tabs {
  display: flex;
  flex: 1;
  flex-direction: row;
  flex-wrap: nowrap;
  max-height: 45;
  min-height: 45;
  overflow: hidden;
  border-bottom: 1px solid #b3ccfe;
  margin-bottom: 5;
}
.ngager-tabs .tab {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #b3ccfe;
  border-bottom: 0;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  /* margin-left: 5; */
  margin-right: -1px;
  cursor: pointer;
  flex-basis: 50%;
}
.ngager-tabs .tab:last-child {
  margin-right: 0;
  padding: 0;
}
.ngager-tabs .tab.selected {
  color: #fff;
  background-color: #273751;
  border-color: #273751;
}

.moduleHolder > .feedback-container,
.body > .feedback-container {
  display: flex;
  width: 100%;
  margin: auto;
  flex-direction: column;
  overflow: hidden;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.moduleHolder > .feedback-container > div,
.body > .feedback-container > div {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.moduleHolder > .feedback-container.request-feedback,
.body > .feedback-container.request-feedback,
.moduleHolder > .feedback-container.instant-feedback,
.body > .feedback-container.instant-feedback,
.moduleHolder > .feedback-container.myfeedback,
.body > .feedback-container.myfeedback {
  height: 100%;
  min-height: 500;
}
.moduleHolder > .feedback-container.feedback-statistics,
.body > .feedback-container.feedback-statistics {
  overflow: unset;
}
.moduleHolder > .feedback-container.company-feedback,
.body > .feedback-container.company-feedback {
  position: relative;
  overflow: unset;
  height: 100%;
  flex-direction: unset;
}
.moduleHolder > .feedback-container.home,
.body > .feedback-container.home {
  max-width: 960;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
}
.moduleHolder > .feedback-container.home > .vertical-line,
.body > .feedback-container.home > .vertical-line {
  flex: 0;
  border-right: 1px solid #b3ccfe;
  height: 400;
  align-self: center;
}
.moduleHolder > .feedback-container.home .feedback-items,
.body > .feedback-container.home .feedback-items {
  max-width: 700;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: row;
  align-content: center;
  flex: 1;
}
.moduleHolder > .feedback-container.home .feedback-items.company-feedback,
.body > .feedback-container.home .feedback-items.company-feedback {
  flex: 0;
  margin: 0;
  align-self: center;
  min-width: 350;
}
.moduleHolder > .feedback-container.home .feedback-items .feedback-item,
.body > .feedback-container.home .feedback-items .feedback-item {
  align-self: center;
  color: #6c81af;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
  min-width: 230;
  max-width: 250;
  padding: 10;
  height: 180px;
  margin: 10;
  width: 0;
}
.moduleHolder > .feedback-container.home .feedback-items .feedback-item i.icon,
.body > .feedback-container.home .feedback-items .feedback-item i.icon {
  font-size: 30;
}
.moduleHolder > .feedback-container.home .feedback-items .feedback-item .icon,
.body > .feedback-container.home .feedback-items .feedback-item .icon {
  position: relative;
}
.moduleHolder > .feedback-container.home .feedback-items .feedback-item .icon img,
.body > .feedback-container.home .feedback-items .feedback-item .icon img {
  width: 100%;
}
.moduleHolder > .feedback-container.home .feedback-items .feedback-item span.title,
.body > .feedback-container.home .feedback-items .feedback-item span.title {
  font-weight: bold;
  font-size: 20;
  margin-bottom: 10;
  text-align: center;
}
.moduleHolder > .feedback-container.home .feedback-items .feedback-item span.description,
.body > .feedback-container.home .feedback-items .feedback-item span.description {
  font-size: 0.9em;
  opacity: 0.64;
  text-align: center;
}
@media (max-width: 900px) {
  .moduleHolder > .feedback-container.home,
  .body > .feedback-container.home {
    align-items: start;
  }
  .moduleHolder > .feedback-container.home .feedback-items,
  .body > .feedback-container.home .feedback-items {
    max-width: 500;
  }
}
.moduleHolder > .feedback-container .navigation,
.body > .feedback-container .navigation {
  min-height: 60;
  flex: 0;
}
.moduleHolder > .feedback-container .navigation .awesome-stepper,
.body > .feedback-container .navigation .awesome-stepper {
  flex: 1;
  margin: auto;
  width: 100%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.moduleHolder > .feedback-container .select-users,
.body > .feedback-container .select-users {
  max-width: 900;
  width: 100%;
  margin: auto;
  height: 100%;
  padding-top: 20;
  justify-content: flex-start;
  overflow: hidden;
  max-height: 900;
}
.moduleHolder > .feedback-container .finalize,
.body > .feedback-container .finalize {
  width: 100%;
  margin: auto;
  height: 100%;
  justify-content: flex-start;
  color: #6c81af;
  overflow: auto;
  position: relative;
}
.moduleHolder > .feedback-container .finalize .survey-form .text-container .textarea-field textarea,
.body > .feedback-container .finalize .survey-form .text-container .textarea-field textarea {
  background-color: #fff !important;
  border: 1px solid #36425a !important;
  border-radius: 5px !important;
}
.moduleHolder > .feedback-container .finalize .survey-form .text-container .textarea-field input[type='text'],
.body > .feedback-container .finalize .survey-form .text-container .textarea-field input[type='text'] {
  background-color: #fff !important;
  border: 1px solid #36425a !important;
  border-radius: 5px !important;
  height: 40px !important;
  padding: 15px !important;
  margin-top: 8px !important;
}
.moduleHolder > .feedback-container .finalize .survey-form .save-button-container,
.body > .feedback-container .finalize .survey-form .save-button-container {
  display: flex;
  justify-content: center;
  margin-bottom: 30;
}
.moduleHolder > .feedback-container .give-feedback,
.body > .feedback-container .give-feedback {
  max-width: 1280;
  width: 100%;
  margin: auto;
  height: 100%;
  justify-content: flex-start;
  color: #6c81af;
  max-height: 800px;
}
.moduleHolder > .feedback-container .give-feedback .filters,
.body > .feedback-container .give-feedback .filters {
  margin: auto;
  width: 600;
  display: flex;
  flex-direction: row;
  padding-top: 10;
}
.moduleHolder > .feedback-container .give-feedback .filters .ngager-selectfield,
.body > .feedback-container .give-feedback .filters .ngager-selectfield {
  flex: 0;
  margin-left: 0;
  border-width: 0;
  border-bottom-width: 1px;
  background-color: transparent;
  margin-bottom: 3px;
  border-color: #bbbbbb !important;
  border-radius: 0;
}
.moduleHolder > .feedback-container .give-feedback .button,
.body > .feedback-container .give-feedback .button {
  max-height: 60;
  flex: 1;
  justify-content: center;
  align-items: center;
  align-content: center;
  min-height: 60;
  display: flex;
  margin-top: 10;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container,
.body > .feedback-container .give-feedback .ngager-carousel-container {
  max-width: 1200;
  padding: 0 !important;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .slick-track,
.body > .feedback-container .give-feedback .ngager-carousel-container .slick-track {
  display: flex;
  flex: 1;
  padding: 50px 0;
  overflow: hidden;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .slick-slide,
.body > .feedback-container .give-feedback .ngager-carousel-container .slick-slide {
  height: auto !important;
  display: flex;
  justify-content: center;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .slick-slide > div,
.body > .feedback-container .give-feedback .ngager-carousel-container .slick-slide > div {
  height: auto;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .slick-slide .slide-item,
.body > .feedback-container .give-feedback .ngager-carousel-container .slick-slide .slide-item {
  min-width: 330;
  max-width: 330;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .slick-slide .slide-item .message-info .message,
.body > .feedback-container .give-feedback .ngager-carousel-container .slick-slide .slide-item .message-info .message {
  overflow: hidden;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .slick-slide:only-child .slide-item,
.body > .feedback-container .give-feedback .ngager-carousel-container .slick-slide:only-child .slide-item {
  max-width: 600;
  width: 90%;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .slick-slide.slick-current,
.body > .feedback-container .give-feedback .ngager-carousel-container .slick-slide.slick-current {
  transform: scale(1.1);
  transition: all 0.5s ease-in-out;
  z-index: 9;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .slick-current .slide-item .survey-request,
.body > .feedback-container .give-feedback .ngager-carousel-container .slick-current .slide-item .survey-request {
  overflow: auto;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .slick-current .slide-item .survey-request .message-info .message,
.body > .feedback-container .give-feedback .ngager-carousel-container .slick-current .slide-item .survey-request .message-info .message {
  overflow-y: auto;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .survey-request,
.body > .feedback-container .give-feedback .ngager-carousel-container .survey-request {
  width: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  flex: 1;
  background: #e1e9fc;
  border-radius: 6px;
  border: 1px solid #b3ccfe80;
  overflow: hidden;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .survey-request .anonymous,
.body > .feedback-container .give-feedback .ngager-carousel-container .survey-request .anonymous {
  border: 1px solid #b3ccfe80;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .survey-request .user,
.body > .feedback-container .give-feedback .ngager-carousel-container .survey-request .user {
  width: 100%;
  padding-bottom: 10;
  flex-direction: column;
  justify-content: flex-end;
  margin-top: 30;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .survey-request .user .ngager-avatar,
.body > .feedback-container .give-feedback .ngager-carousel-container .survey-request .user .ngager-avatar {
  margin: auto;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .survey-request .user .name,
.body > .feedback-container .give-feedback .ngager-carousel-container .survey-request .user .name {
  width: 100%;
  display: block;
  margin-top: 5px;
  font-size: 1.1em;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .survey-request .user .request-date,
.body > .feedback-container .give-feedback .ngager-carousel-container .survey-request .user .request-date {
  font-size: 0.9em;
  font-style: italic;
  opacity: 0.6;
  margin-top: 5;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .survey-request .message-info,
.body > .feedback-container .give-feedback .ngager-carousel-container .survey-request .message-info {
  display: flex;
  flex-direction: column;
  margin-bottom: 10;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .survey-request .message-info .subject,
.body > .feedback-container .give-feedback .ngager-carousel-container .survey-request .message-info .subject {
  font-size: 1.3em;
  font-weight: bold;
  display: block;
  text-align: center;
  margin-bottom: 5;
  padding: 0 15px;
}
.moduleHolder > .feedback-container .give-feedback .ngager-carousel-container .survey-request .message-info .message,
.body > .feedback-container .give-feedback .ngager-carousel-container .survey-request .message-info .message {
  display: block;
  overflow-y: auto;
  justify-content: center;
  display: flex;
  text-align: justify;
  padding-left: 10;
  padding-right: 10;
  margin-top: 5px;
}
.moduleHolder > .feedback-container .my-feedback,
.body > .feedback-container .my-feedback {
  width: 100%;
  margin: auto;
  height: 100%;
  justify-content: flex-start;
  color: #6c81af;
  display: flex;
  flex-direction: row;
}
.moduleHolder > .feedback-container .my-feedback .left-col,
.body > .feedback-container .my-feedback .left-col {
  display: flex;
  overflow: auto;
  border-left: 0;
  border-top: 0;
  border-bottom: 0;
  padding-top: 10;
  flex-direction: column;
}
.moduleHolder > .feedback-container .my-feedback .left-col .filter-side,
.body > .feedback-container .my-feedback .left-col .filter-side {
  margin-bottom: 10;
}
.moduleHolder > .feedback-container .my-feedback .left-col .ngager-list,
.body > .feedback-container .my-feedback .left-col .ngager-list {
  overflow: auto;
  border-right: 1px solid #b3ccfe;
}
.moduleHolder > .feedback-container .my-feedback .left-col .ngager-list .item .notice-number,
.body > .feedback-container .my-feedback .left-col .ngager-list .item .notice-number {
  left: 0;
  top: auto;
  margin-top: -30;
}
.moduleHolder > .feedback-container .my-feedback .content,
.body > .feedback-container .my-feedback .content {
  display: flex;
  flex-grow: 1;
  flex-basis: 100%;
  overflow: auto;
  padding-top: 20px;
  overflow-x: hidden;
}
.moduleHolder > .feedback-container .my-feedback .content .survey-form,
.body > .feedback-container .my-feedback .content .survey-form {
  padding: 30;
  width: 100%;
  padding-top: 0;
  max-width: 700;
  margin: auto;
  margin-top: 0;
}
.moduleHolder > .feedback-container .my-feedback .content .survey-form .form-inputs,
.body > .feedback-container .my-feedback .content .survey-form .form-inputs {
  margin-bottom: 30px;
}
.moduleHolder > .feedback-container .my-feedback .content .survey-form h3.survey-name,
.body > .feedback-container .my-feedback .content .survey-form h3.survey-name {
  font-size: 1.2em;
  font-weight: bold;
  border-bottom: 1px solid #6c81af4d;
  padding-bottom: 5;
  margin-bottom: 20;
}
.moduleHolder > .feedback-container .my-feedback .content .survey-form .text-container .textarea-field textarea,
.body > .feedback-container .my-feedback .content .survey-form .text-container .textarea-field textarea {
  background-color: #fff !important;
  border: 1px solid #36425a !important;
  border-radius: 5px !important;
}
.moduleHolder > .feedback-container .my-feedback .content .survey-form .save-button-container,
.body > .feedback-container .my-feedback .content .survey-form .save-button-container {
  display: flex;
  justify-content: center;
}
.moduleHolder > .feedback-container.company,
.body > .feedback-container.company {
  height: 100%;
  min-height: 500;
  max-height: 800;
}
.moduleHolder > .feedback-container.company .survey-events-list,
.body > .feedback-container.company .survey-events-list {
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  max-width: 700;
  margin: auto;
  height: 100%;
  max-height: 600;
  justify-content: flex-start;
}
.moduleHolder > .feedback-container.company .survey-events-list > h1,
.body > .feedback-container.company .survey-events-list > h1 {
  font-size: 20;
  font-weight: bold;
}
.moduleHolder > .feedback-container.company .survey-events-list .sum,
.body > .feedback-container.company .survey-events-list .sum {
  position: relative;
  width: 100%;
  min-height: 60;
  background-color: #283850;
  color: #fff;
}
.moduleHolder > .feedback-container.company .survey-events-list .sum > span,
.body > .feedback-container.company .survey-events-list .sum > span {
  position: absolute;
  right: 10;
  bottom: 10;
}
.moduleHolder > .feedback-container.company .survey-events-list > .button,
.body > .feedback-container.company .survey-events-list > .button {
  display: flex;
  justify-content: center;
  margin-top: 20;
  margin-bottom: 20;
}
.moduleHolder > .feedback-container.company .survey-events-list ul,
.body > .feedback-container.company .survey-events-list ul {
  list-style: none;
  margin-top: 30;
  display: flex;
  flex-direction: column;
  padding-right: 10;
  overflow-y: auto;
  height: 100%;
}
.moduleHolder > .feedback-container.company .survey-events-list ul li,
.body > .feedback-container.company .survey-events-list ul li {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10;
  min-height: 30;
}
.moduleHolder > .feedback-container.company .survey-events-list ul li .controls,
.body > .feedback-container.company .survey-events-list ul li .controls {
  display: inline-flex;
  min-width: 130;
  justify-content: space-between;
}
.moduleHolder > .feedback-container.company .survey-events-list ul li .controls i,
.body > .feedback-container.company .survey-events-list ul li .controls i {
  font-size: 1.2em;
}
.moduleHolder > .feedback-container.company .survey-events-list ul li .controls i.disabled,
.body > .feedback-container.company .survey-events-list ul li .controls i.disabled {
  opacity: 0.5;
}
.moduleHolder > .feedback-container.company .survey-events-list ul li .controls i.fa-trash-o,
.body > .feedback-container.company .survey-events-list ul li .controls i.fa-trash-o {
  color: orangered;
  font-size: 20;
}
.moduleHolder > .feedback-container.company .survey-events-list ul li .controls .button,
.body > .feedback-container.company .survey-events-list ul li .controls .button {
  cursor: pointer;
}
.moduleHolder > .feedback-container.company .survey-events-info,
.body > .feedback-container.company .survey-events-info {
  max-width: 800;
  width: 100%;
  margin: auto;
  max-height: 100%;
  justify-content: flex-start;
  color: #6c81af;
  display: flex;
  flex-direction: row;
  padding-top: 20;
  overflow: hidden;
  margin-top: 0;
}
.moduleHolder > .feedback-container.company .survey-events-info > h1,
.body > .feedback-container.company .survey-events-info > h1 {
  font-size: 20;
  font-weight: bold;
}
.moduleHolder > .feedback-container.company .survey-events-info .form,
.body > .feedback-container.company .survey-events-info .form {
  display: flex;
  flex: 1;
  flex-basis: 50%;
  flex-direction: column;
}
.moduleHolder > .feedback-container.company .survey-events-info .form .block,
.body > .feedback-container.company .survey-events-info .form .block {
  margin-top: 30;
}
.moduleHolder > .feedback-container.company .survey-events-info .form .block .title,
.body > .feedback-container.company .survey-events-info .form .block .title {
  font-weight: bold;
}
.moduleHolder > .feedback-container.company .survey-events-info .form .block .field,
.body > .feedback-container.company .survey-events-info .form .block .field {
  display: flex;
  padding-left: 10;
  margin-top: 10;
}
.moduleHolder > .feedback-container.company .survey-events-info .form .block .field span.label,
.body > .feedback-container.company .survey-events-info .form .block .field span.label {
  min-width: 80;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 10;
}
.moduleHolder > .feedback-container.company .messages .survey-event-message,
.body > .feedback-container.company .messages .survey-event-message {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  color: #6c81af;
  max-width: 1280;
  width: 100%;
  margin: auto;
}
.moduleHolder > .feedback-container.company .messages .survey-event-message .ngager-half,
.body > .feedback-container.company .messages .survey-event-message .ngager-half {
  flex-direction: column;
}
.moduleHolder > .feedback-container.company .messages .survey-event-message span.title,
.body > .feedback-container.company .messages .survey-event-message span.title {
  font-size: 1.2em;
  font-weight: bold;
}
.moduleHolder > .feedback-container.company .messages .survey-event-message span.sub-title,
.body > .feedback-container.company .messages .survey-event-message span.sub-title {
  font-size: 1.1em;
  opacity: 0.61;
}
.moduleHolder > .feedback-container.company .messages .survey-event-message .form,
.body > .feedback-container.company .messages .survey-event-message .form {
  margin-bottom: 20;
}
.moduleHolder > .feedback-container.company .messages .survey-event-message .survey-active-info,
.body > .feedback-container.company .messages .survey-event-message .survey-active-info {
  display: flex;
  flex: 1;
  flex-direction: column;
}
.moduleHolder > .feedback-container.company .messages .survey-event-message .survey-active-info span.title,
.body > .feedback-container.company .messages .survey-event-message .survey-active-info span.title {
  font-weight: bold;
}
.moduleHolder > .feedback-container.company .messages .survey-event-message .survey-active-info span.time,
.body > .feedback-container.company .messages .survey-event-message .survey-active-info span.time {
  border-bottom: 1px solid #b3ccfe;
  margin-left: 20;
  margin-top: 10;
  color: #aaa;
  padding-bottom: 5px;
  height: 25;
}
.moduleHolder > .feedback-container.company .messages .button,
.body > .feedback-container.company .messages .button {
  display: flex;
  justify-content: center;
  margin-top: 50;
}
.moduleHolder > .feedback-container.company .select-segments,
.body > .feedback-container.company .select-segments {
  width: 800;
  margin: auto;
  max-height: 100%;
  padding-top: 10;
  overflow: hidden;
}
.moduleHolder > .feedback-container > .company-feedback-statistics,
.body > .feedback-container > .company-feedback-statistics {
  flex-direction: row;
  height: -moz-fit-content;
  height: fit-content;
  padding-top: 10;
  justify-content: flex-start;
}
.moduleHolder > .feedback-container > .company-feedback-statistics.exporting .content-side .chart-body > h1,
.body > .feedback-container > .company-feedback-statistics.exporting .content-side .chart-body > h1 {
  text-align: center;
}
.moduleHolder > .feedback-container > .company-feedback-statistics.exporting .content-side .chart-body > .progress,
.body > .feedback-container > .company-feedback-statistics.exporting .content-side .chart-body > .progress {
  display: block;
  text-align: center;
  margin-top: 10;
  margin-bottom: 20;
  font-size: 1.2em;
}
.moduleHolder > .feedback-container > .company-feedback-statistics.exporting .content-side .chart-body > .progress > span,
.body > .feedback-container > .company-feedback-statistics.exporting .content-side .chart-body > .progress > span {
  margin-right: 20;
}
.moduleHolder > .feedback-container > .company-feedback-statistics.exporting .content-side .chart-body .nps-chart .percentage-bar > div > span,
.body > .feedback-container > .company-feedback-statistics.exporting .content-side .chart-body .nps-chart .percentage-bar > div > span {
  width: 100%;
  text-align: center;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side,
.body > .feedback-container > .company-feedback-statistics .content-side {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: flex-start;
  overflow: hidden;
  color: #36425a;
  margin-left: 10;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .header,
.body > .feedback-container > .company-feedback-statistics .content-side .header {
  position: relative;
  width: 100%;
  display: flex;
  z-index: 99;
  max-height: 30;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .header .buttons,
.body > .feedback-container > .company-feedback-statistics .content-side .header .buttons {
  position: absolute;
  right: 0;
  display: flex;
  align-items: center;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .header .buttons > div,
.body > .feedback-container > .company-feedback-statistics .content-side .header .buttons > div {
  margin-left: 10;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .header .buttons .refresh-icon,
.body > .feedback-container > .company-feedback-statistics .content-side .header .buttons .refresh-icon {
  cursor: pointer;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .header .buttons .refresh-icon .ngager-statistics-refresh,
.body > .feedback-container > .company-feedback-statistics .content-side .header .buttons .refresh-icon .ngager-statistics-refresh {
  color: #5d76aa;
  font-size: 24px;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .header .buttons .refresh-icon.disabled,
.body > .feedback-container > .company-feedback-statistics .content-side .header .buttons .refresh-icon.disabled {
  cursor: no-drop;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .header .buttons .refresh-icon.disabled .ngager-statistics-refresh,
.body > .feedback-container > .company-feedback-statistics .content-side .header .buttons .refresh-icon.disabled .ngager-statistics-refresh {
  color: #bbbbbb;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  position: relative;
  padding-left: 20;
  padding-bottom: 20;
  max-width: 1500;
  align-self: center;
  width: 100%;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body > h1,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body > h1 {
  font-size: 1.5em;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body > .progress,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body > .progress {
  display: none;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .nps-section,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .nps-section,
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .tag-section,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .tag-section {
  margin-top: 30;
  margin-bottom: 30;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .nps-section .question-detailed-chart,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .nps-section .question-detailed-chart,
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .tag-section .question-detailed-chart,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .tag-section .question-detailed-chart {
  padding-top: 0;
  padding-bottom: 0;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .nps-section .question-detailed-chart .text-question-answers,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .nps-section .question-detailed-chart .text-question-answers,
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .tag-section .question-detailed-chart .text-question-answers,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .tag-section .question-detailed-chart .text-question-answers {
  padding-left: 0;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .nps-section .question-detailed-chart .text-question-answers .question-header .question-text,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .nps-section .question-detailed-chart .text-question-answers .question-header .question-text,
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .tag-section .question-detailed-chart .text-question-answers .question-header .question-text,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .tag-section .question-detailed-chart .text-question-answers .question-header .question-text {
  padding-left: 0;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart {
  padding-bottom: 30;
  padding-top: 50;
  position: relative;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header {
  display: flex;
  width: 100%;
  margin-bottom: 0;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .buttons,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .buttons {
  z-index: 100;
  display: flex;
  justify-content: flex-end;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .buttons > div,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .buttons > div {
  margin: 5;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .buttons i,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .buttons i {
  font-size: 20;
  color: #5d76aa;
  cursor: pointer;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .question-text,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .question-text {
  padding-left: 10;
  display: flex;
  flex: 1;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .tags,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .tags {
  display: flex;
  margin-left: 20;
  margin-right: 20;
  flex-direction: row;
  flex-wrap: nowrap;
  flex: 0;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .tags .tag-name,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .tags .tag-name {
  display: flex;
  background-color: #36425a;
  padding: 5px;
  color: #fff;
  border-radius: 20px;
  padding-left: 10;
  padding-right: 10;
  white-space: nowrap;
  max-width: 150;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-right: 5;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .tags .tag-name:last-child,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .question-header .tags .tag-name:last-child {
  margin-right: 0;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart {
  display: flex;
  flex: 1;
  min-height: 300;
  overflow: hidden;
  position: relative;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .awesome-bar-chart,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .awesome-bar-chart {
  margin-right: 90;
  overflow: auto;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .average-container,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .average-container {
  min-width: 90;
  max-width: 90;
  position: absolute;
  right: 0;
  bottom: 0;
  height: 150;
  display: flex;
  justify-content: center;
  align-items: center;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .average-container .average,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .average-container .average {
  bottom: 40;
  justify-content: center;
  align-items: center;
  position: absolute;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .average-container .average .value,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .average-container .average .value {
  font-size: 2em;
  font-weight: bold;
  background-color: #fff;
  width: 80px;
  height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 80px;
  border: 1px solid #d6d9e2;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .average-container .average.nps .value,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .average-container .average.nps .value {
  background-color: #6c81af;
  color: #fff;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .average-container .average .label,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart .chart .average-container .average .label {
  position: absolute;
  bottom: -30px;
  color: #36425a;
  width: 100%;
  text-align: center;
}
.moduleHolder > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart.exporting .chart,
.body > .feedback-container > .company-feedback-statistics .content-side .chart-body .question-detailed-chart.exporting .chart {
  overflow: unset;
}

.chapter-map-container .chapter-map {
  margin: auto;
  position: relative;
  /*start .map-grid*/
  /*end .map-grid*/
}
.chapter-map-container .chapter-map > div {
  margin: auto;
  position: relative;
}
.chapter-map-container .chapter-map::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.chapter-map-container .chapter-map:hover::-webkit-scrollbar {
  background: #d2def5;
}
.chapter-map-container .chapter-map:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.chapter-map-container .chapter-map .map-grid {
  display: flex;
  flex-wrap: wrap;
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
}
.chapter-map-container .chapter-map .map-grid .game-node-box {
  width: 41px;
  height: 41px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node {
  background-color: #fff;
  width: 81%;
  height: 81%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  cursor: pointer;
  position: relative;
  outline-color: transparent;
  box-shadow: 0px 0px 3px #000;
  border-width: 4px;
  border-style: solid;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node i {
  color: #fff;
  font-size: 20px;
  outline-color: transparent;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node i.remove-chapter-game {
  position: absolute;
  top: -11px;
  right: -5px;
  display: none;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node i.completed {
  background-color: #9acf61;
  border: 5px solid #e2f9ca;
  border-radius: 100px;
  font-size: 18px;
  padding: 3px;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node:hover i.remove-chapter-game {
  display: block;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .meter,
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .mandatory {
  position: absolute;
  border-radius: 56px;
  bottom: -8px;
  right: -7px;
  width: 17px;
  height: 17px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #778090;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .meter span,
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .mandatory span,
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .meter i,
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .mandatory i {
  color: #fff;
  font-size: 8px;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .waypoint-progress {
  position: absolute;
  border-radius: 56px;
  bottom: -13px;
  right: -10px;
  color: #fff;
  font-size: 8px;
  justify-content: center;
  align-items: center;
  background-color: #778090;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .waypoint-progress .circle {
  /* width: 100%;
              padding-top: 100%;
              height: 0; */
  width: 23px;
  height: 23px;
  position: relative;
  display: block;
  visibility: hidden;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .waypoint-progress .text {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .waypoint-progress .text span {
  margin: auto;
}
.chapter-map-container .chapter-map .map-grid .game-node-box .game-node .mandatory {
  left: -7px;
  z-index: 1;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.chapterFooter {
  position: absolute;
  bottom: 10px;
  right: 0px;
  height: 100px;
}
.chapterFooter .footer-button {
  position: absolute;
  bottom: 20px;
  right: 20px;
  width: 48px;
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 40px;
  background-color: #36425A;
  outline: 0;
  cursor: pointer;
}
.chapterFooter .footer-button i {
  font-size: 20px;
  color: #fff;
}
.chapterFooter > div {
  height: 48px;
  display: inline-block;
}
.chapterFooter > div > div {
  vertical-align: middle;
  display: inline-block;
}
.chapterFooter > div p {
  display: inline-block;
  line-height: 48px;
  margin-left: 10px;
  border-radius: 100px;
  color: #778091;
  font-size: 14px;
  font-weight: 100;
}
.chapterFooter > div.meterContainer1 {
  position: absolute;
  bottom: 82px;
  right: 10px;
}
.chapterFooter > div.meterContainer2 {
  position: absolute;
  bottom: 70px;
  right: 69px;
}
.chapterFooter > div.meterContainer3 {
  position: absolute;
  bottom: 10px;
  right: 82px;
}
.chapterFooter .navWrapper {
  width: 100%;
  height: 100%;
  display: flex;
}
.chapterFooter .navWrapper > div {
  margin: auto;
}

.chapter-list {
  overflow: auto;
  height: 100% !important;
  padding-right: 20px;
}
.chapter-list .chapter-element {
  display: flex;
  flex-direction: row;
  min-height: 200px;
  flex-shrink: 1;
}
.chapter-list .chapter-element:first-child .chapter-element-marker-wrap .lines .markers-line:first-child {
  border: none;
}
.chapter-list .chapter-element:last-child .chapter-element-marker-wrap .lines .markers-line:last-child {
  border: none;
}
.chapter-list .chapter-element-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding-bottom: 3px;
  align-items: flex-end;
}
.chapter-list .view-intro-icon {
  text-align: center;
  cursor: pointer;
  margin-left: 3px;
}
.chapter-list .view-intro-icon i {
  font-size: 18px;
  margin: auto;
  background-color: transparent;
}
.chapter-list .chapter-element-title {
  font-size: 16px;
  color: #577B9F;
  display: flex;
  flex: 1;
}
.chapter-list .chapter-element-title > span {
  display: flex;
}
.chapter-list .chapter-element-title > span.view-intro-icon {
  margin-left: 5;
}
.chapter-list .chapter-element-subtitle {
  font-size: 12px;
}
.chapter-list .chapter-element-content {
  display: flex;
  flex: 4;
  justify-content: center;
  flex-direction: column;
  line-height: 1.2;
}
.chapter-list .chapter-element-marker {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid transparent;
  background-color: #C3DDF4;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
}
.chapter-list .chapter-element-marker-wrap {
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  position: relative;
}
.chapter-list .chapter-element-marker-padding {
  z-index: 1;
  padding: 10px;
  border-radius: 50%;
  border: 1px solid #F0F4FC;
  background-color: #F0F4FC;
}
.chapter-list .chapter-element-marker-icon {
  font-size: 18px;
}
.chapter-list .chapter-image {
  position: relative;
  width: 100%;
  height: 150px;
  border-radius: 10px;
  cursor: pointer;
}
.chapter-list .chapter-image .overlay-icon {
  font-size: 30px;
}
.chapter-list .chapter-image-overlay {
  width: 100%;
  height: 100%;
  background-color: transparent;
  opacity: 0.9;
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
}
.chapter-list .lines {
  display: flex;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.chapter-list .lines .markers-line {
  border-left: 2px solid #C3DDF4;
  /* position: absolute; */
  display: flex;
  /* width: 2px; */
  flex: 1;
}
.chapter-list .selected .chapter-element-marker {
  width: 40px;
  height: 40px;
  background-color: #C86A77;
}
.chapter-list .selected .chapter-element-marker-icon {
  color: #FFFFFF;
  font-size: 22px;
}
.chapter-list .completed .chapter-image-overlay {
  background-color: #6FBC90;
}
.chapter-list .completed .overlay-icon {
  color: #FFF395;
}
.chapter-list .locked .chapter-image-overlay {
  background-color: #6F95BC;
}
.chapter-list .locked .overlay-icon {
  color: #FFFFFF;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.story-mode-container {
  margin-top: 10;
  overflow: hidden;
  width: 100%;
}
.story-mode-container .chapter-list-column {
  max-width: 380;
  display: flex;
  min-width: 350;
}
.story-mode-container .chapter-list-column .chapter-list {
  width: 100%;
}
.story-mode-container .story-mode-map {
  display: flex;
  flex: 1;
  background-color: #e8ecf5;
  position: relative;
  overflow: hidden;
}
.story-mode-container .story-mode-map .fullscreen {
  color: #36425A;
  cursor: pointer;
  font-size: 20px;
  left: 15px;
  position: absolute;
  top: 15px;
  z-index: 5;
}
.story-mode-container .story-mode-map .chapter-map-container {
  flex: 1;
  overflow: auto;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.actionLearning {
  flex-direction: column;
  flex-grow: 1;
}
.actionLearning > div.content {
  flex: 1;
  overflow: hidden;
  margin-top: 10;
}
.actionLearning > div .resourcesColumn {
  margin-right: 5;
}
.actionLearning > div .resourcesColumn .filter-header {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.actionLearning > div .resourcesColumn .filter-header .fa-arrow-left {
  cursor: pointer;
  margin-right: 10px;
  font-size: 16px;
}
.actionLearning > div .resourcesColumn .resourcesList {
  height: calc(100% - 50px);
  overflow-x: hidden;
  overflow-y: auto;
}
.actionLearning > div .resourcesColumn .resourcesList::-webkit-scrollbar {
  width: 8px;
}
.actionLearning > div .resourcesColumn .resourcesList:hover::-webkit-scrollbar {
  background: #d2def5;
}
.actionLearning > div .resourcesColumn .resourcesList:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.actionLearning > div .resourcesColumn .resourcesList .vertical-categories-games {
  margin-right: 0;
}
.actionLearning > div .resourcesColumn .resourcesList .gameResourcesContainer > div {
  cursor: pointer;
  transition-property: all;
  transition-duration: 0.3s;
  justify-content: center;
  align-items: center;
  padding: 0px 0px 0 34px;
  min-height: 70px;
}
.actionLearning > div .resourcesColumn .resourcesList .gameResourcesContainer > div:hover {
  background-color: '#fff';
}
.actionLearning > div .resourcesColumn .resourcesList .gameResourcesContainer > div i {
  width: 20px;
}
.actionLearning > div .resourcesColumn .resourcesList .gameResourcesContainer.resources-filter > div {
  padding: 0 !important;
}
.actionLearning > div .resourcesColumn .resourcesList .resourceMeta {
  text-align: left;
  flex-grow: 1;
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding: 10px 0px;
}
.actionLearning > div .resourcesColumn .resourcesList .resourceMeta p {
  line-height: 1;
}
.actionLearning > div .resourcesColumn .resourcesList .resourceMeta p:first-child {
  font-size: 12px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 210px;
  line-height: 1.4;
}
.actionLearning > div .resourcesColumn .resourcesList .resourceMeta p:last-child {
  font-size: 10px;
  color: #bfbfbf;
}
.actionLearning > div .resourcesColumn .resourcesList .completionIndicator {
  width: 40px;
  line-height: 56px;
  display: flex;
}
.actionLearning > div .resourcesColumn .resourcesList .completionIndicator i {
  border: 4px solid #f5f5f5;
  background-color: #dadada;
  height: 20px;
  border-radius: 100px;
  color: white;
  width: 20px;
  line-height: 20px;
  font-size: 10px;
  margin: auto;
  justify-content: center;
  align-items: center;
  display: flex;
}
.actionLearning > div .resourcesColumn .resourcesList .completionIndicator i.consumed {
  background-color: #9acf61;
  border: 4px solid #e2f9ca;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer {
  overflow: hidden;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer i.expand-collapse {
  width: 20px;
  line-height: 56px;
  margin-left: 10px;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .gameHeader {
  transition-property: none;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 60px;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .gameHeader .act-button {
  font-size: 22px;
  width: 32px;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .gameHeader:hover {
  background-color: #f1f5fd;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .gameHeader + .ngager-flexbox-container.activeResource {
  background-color: #f1f5fd;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .gameHeader .gameName {
  font-size: 13px;
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
  text-align: left;
  flex: 1;
  color: #6c81af;
  padding-top: 10;
  padding-bottom: 10;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .gameHeader .gameCollapse {
  font-size: 22px;
  color: #6c81af;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .gameHeader .game-icon-container {
  width: 30px;
  height: 30px;
  border-radius: 30px;
  border: 3px solid red;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 8px;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .gameHeader .game-icon-container i {
  font-size: 16px;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer.active .gameHeader {
  background-color: #d2def5;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .gameIcon {
  font-size: 16px;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .fa-file-text-o {
  font-size: 14px;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .fa-play {
  font-size: 10px;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer .fa-volume-up {
  font-size: 12px;
}
.actionLearning > div .resourcesColumn .resourcesList .games .gameContainer.collapsed .gameResourcesContainer {
  height: 0;
  overflow: hidden;
}
.actionLearning .contentConsuming {
  flex-grow: 1;
  background-color: #e8ecf5;
  background-image: url(/f766990dc43ac2ab42a444ac98a4ea0f.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
  position: relative;
  overflow: hidden;
}
.actionLearning .contentConsuming .resourceHeader {
  transition-property: all;
  transition-duration: 0.3s;
  z-index: 10000;
  position: absolute;
  left: 50%;
  margin-left: -92px;
  top: -50px;
  line-height: 40px;
  color: #ff9a00;
  font-size: 18px;
  background-color: rgba(255, 255, 255, 0.52);
  border-bottom-right-radius: 50px;
  border-bottom-left-radius: 50px;
  padding: 0 30px;
}
.actionLearning .contentConsuming .resourceHeader i {
  outline: none;
  cursor: pointer;
}
.actionLearning .contentConsuming .resourceHeader .fa-share-alt {
  color: #7b7979;
  margin-right: 15px;
}
.actionLearning .contentConsuming .resourceHeader .fa-star,
.actionLearning .contentConsuming .resourceHeader .fa-star-o {
  margin-right: 2px;
  line-height: 45px;
}
.actionLearning .contentConsuming video {
  cursor: pointer;
}
.actionLearning .contentConsuming:hover .resourceHeader {
  top: 0;
}
.actionLearning .contentConsuming audio {
  width: 100%;
  height: 100%;
  background-image: url(/be267aaf83a4542384734b6a8479d4ba.svg);
  background-repeat: no-repeat;
  background-position: 53% 50%;
  background-size: 100px;
  cursor: pointer;
}
.rating {
  display: flex;
}
.rating i {
  margin: 2px;
  width: auto !important;
  line-height: 20px !important;
}
.carousel-container {
  margin: 0 auto;
  padding: 40px;
  width: 80%;
  color: #333;
  overflow-y: hidden !important;
}
.carousel-container .learning-card-container {
  background: #fff;
  height: 120px;
  margin: 10px 12px;
  position: relative;
  text-align: center;
  height: 75%;
}
.carousel-container .learning-card-container .card-background-image {
  background-size: 100%;
  background-color: #fff;
  background-position: center;
  height: 76%;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  z-index: 9999;
}
.carousel-container .learning-card-container .card-bottom {
  background-color: #fff;
  width: 100%;
  height: 25%;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  display: flex;
  align-items: center;
}
.carousel-container .learning-card-container .card-bottom span {
  font-size: 11px;
  color: #283850;
  font-weight: bold;
  margin: 0px 23px 0px 10px;
  text-align: left;
  line-height: 13px;
}
.carousel-container .learning-card-container .card-icon {
  position: absolute;
  bottom: -13px;
  right: 15px;
  width: 30px;
  height: 30px;
  background: #283850;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 30px;
}
.carousel-container .learning-card-container .card-icon i {
  color: #fff;
  font-size: 14px;
}
.carousel-container .slick-track {
  padding-top: 5px;
}
.carousel-container .center .slick-center .learning-card-container {
  color: #f0f4fc;
  opacity: 1;
  transform: scale(1.23);
  border-radius: 10px;
}
.carousel-container .center .learning-card-container {
  opacity: 0.8;
  transition: all 300ms ease;
}
.carousel-container .slick-dots {
  bottom: inherit !important;
}
.carousel-container .slick-next:before,
.carousel-container .slick-prev:before {
  color: #6c81af;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.chat {
  flex-direction: column;
  flex-grow: 1;
}
.chat > div {
  height: 100%;
}
.chat > div .settingsAside {
  position: relative;
}
.chat > div .settingsAside > .fa-times {
  cursor: pointer;
  position: absolute;
  right: 5;
  top: 3;
  font-size: 20;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #f0f4fc;
}
.chat > div aside {
  min-width: 300px;
  max-width: 400px;
  flex-grow: 0;
  flex-direction: column;
  border: 1px solid #dce0ee;
  box-sizing: border-box;
}
.chat > div aside.usersAside {
  min-width: 350px;
  max-width: 350px;
}
.chat > div aside header {
  padding: 20px 20px 0 20px;
}
.chat > div aside .asideList {
  flex-grow: 1;
  display: flex;
  overflow: hidden;
}
.chat > div aside .asideList::-webkit-scrollbar {
  width: 8px;
}
.chat > div aside .asideList:hover::-webkit-scrollbar {
  background: #d2def5;
}
.chat > div aside .asideList:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.chat > div aside .asideList .asideItem {
  padding: 12px 30px;
  cursor: pointer;
  position: relative;
  min-height: 50;
  justify-content: center;
  align-items: center;
  transition-property: all;
  transition-duration: 0.3s;
}
.chat > div aside .asideList .asideItem:hover {
  background-color: #d8e0f2;
}
.chat > div aside .asideList .asideItem:hover .action-buttons {
  opacity: 1;
}
.chat > div aside .asideList .asideItem:focus {
  outline: none;
}
.chat > div aside .asideList .asideItem .action-buttons {
  position: absolute;
  right: 10;
  top: 0;
  z-index: 10;
  bottom: 0;
  display: flex;
  align-items: center;
  opacity: 0;
}
.chat > div aside .asideList .asideItem .action-buttons i {
  font-size: 20;
}
.chat > div aside .asideList .asideItem .action-buttons i.remove {
  color: coral;
}
.chat > div aside .asideList .asideItem img {
  color: red;
}
.chat > div aside .asideList .asideItem div:first-child {
  margin-right: 6px;
}
.chat > div aside .asideList .asideItem div:last-child {
  width: calc(100% - 41px);
  max-width: 300;
}
.chat > div aside .asideList .asideItem div p {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}
.chat > div aside .asideList .asideItem div p:first-child {
  font-size: 15px;
  font-weight: 100;
}
.chat > div aside .asideList .asideItem div p:last-child {
  color: #a9b3cc;
}
.chat > div aside .asideList .asideItem div:first-child i.fa-users {
  width: 40px;
  height: 40px;
  display: block;
  line-height: 40px;
  text-align: center;
  font-size: 20px;
  border-radius: 100px;
  background: #3e4b64;
  color: #f2f6fc;
}
.chat > div aside .asideList .asideItem div:first-child i.fa-user {
  width: 40px;
  height: 40px;
  display: block;
  line-height: 40px;
  text-align: center;
  font-size: 20px;
  border-radius: 100px;
  background: #3e4b64;
  color: #f2f6fc;
}
.chat > div aside .asideList .markedUser {
  background-color: #36425A;
}
.chat > div aside .asideList .markedUser p {
  color: #d8e0f2;
}
.chat > div aside .asideList .markedUser:hover {
  background-color: #36425A;
}
.chat > div aside .asideList .activeConversation {
  background-color: #d8e0f2;
}
.chat > div aside .asideList .conversationNotification {
  position: absolute;
  left: 0;
  background-color: #f55e53;
  color: white;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  font-size: 9px;
  left: 20;
  top: 9;
  border-radius: 100px;
}
.chat > div aside .groupChatContainer {
  min-height: 214px;
  box-sizing: border-box;
  background: #fafbff;
  padding: 0 15px;
  position: relative;
  flex-direction: column;
}
.chat > div aside .groupChatContainer i.fa-times {
  cursor: pointer;
  position: absolute;
  right: 15px;
  color: #93addc;
  top: 15px;
  z-index: 100;
  font-size: 16px;
}
.chat > div aside .groupChatContainer i.fa-times:focus {
  outline: none;
}
.chat > div aside .groupChatContainer button {
  background-color: #36425A;
  color: #f0f4fc;
  cursor: pointer;
}
.chat > div aside .groupChatContainer button.cta {
  background-color: #9acf61;
}
.chat > div aside .groupChatContainer .groupChatButtons {
  margin-bottom: 30px;
  text-align: center;
  margin: auto;
}
.chat > div aside .groupChatContainer .participantsCounterContainer {
  height: 80px;
  margin-top: 7px;
}
.chat > div aside .groupChatContainer .participantsCounterContainer .participantsList {
  height: 70px;
  overflow: auto;
}
.chat > div aside .groupChatContainer .participantsCounterContainer .participantsList::-webkit-scrollbar {
  width: 8px;
}
.chat > div aside .groupChatContainer .participantsCounterContainer .participantsList::-webkit-scrollbar {
  background: #d2def5;
}
.chat > div aside .groupChatContainer .participantsCounterContainer .participantsList::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.chat > div aside .groupChatContainer .participantsCounterContainer .participantsList .fa-user-o {
  font-size: 10px;
  color: #36425A;
}
.chat > div main {
  flex-grow: 1;
  min-width: 220px;
  background-color: #e8ecf5;
  flex-direction: column;
  margin: 0 4px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
  position: relative;
  overflow: hidden;
}
.chat > div main > div {
  box-sizing: border-box;
}
.chat > div main > div.conversation {
  padding: 20px;
  flex-grow: 1;
  overflow: auto;
  position: relative;
  height: 63%;
}
.chat > div main > div.conversation > .loading {
  width: 95%;
  text-align: center;
  position: sticky;
  bottom: 10;
}
.chat > div main > div.conversation::-webkit-scrollbar {
  width: 8px;
}
.chat > div main > div.conversation:hover::-webkit-scrollbar {
  background: #d2def5;
}
.chat > div main > div.conversation:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.chat > div main > div.conversation .message {
  padding-bottom: 60px;
  display: flex;
}
.chat > div main > div.conversation .message > .sender-info {
  margin: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 90;
  max-width: 90;
}
.chat > div main > div.conversation .message > .sender-info > .ngager-avatar {
  margin: 0;
  margin-bottom: 5;
}
.chat > div main > div.conversation .message > .sender-info > span {
  white-space: normal;
  word-break: normal;
  text-align: center;
  font-size: 13px;
}
.chat > div main > div.conversation .message .uploading-file {
  background: #fff;
  padding: 10px;
  height: 70px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.chat > div main > div.conversation .message .uploading-file .name {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.chat > div main > div.conversation .message .uploading-file .progress-bar {
  position: absolute;
  bottom: 34px;
  width: 86%;
}
.chat > div main > div.conversation .message .uploading-file .processing {
  position: absolute;
  bottom: 37px;
  width: 86%;
  text-align: center;
  font-size: 12px;
}
.chat > div main > div.conversation .message .messageText {
  background-color: #d8e0f2;
  border-radius: 6px;
  color: #6e7585;
  max-width: 50%;
  padding: 10px;
  font-size: 13px;
  line-height: 1.7;
  position: relative;
  margin-left: 20px;
  margin-top: 5px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}
.chat > div main > div.conversation .message .messageText.video {
  max-width: 500;
  flex: 1;
  max-height: 350;
}
.chat > div main > div.conversation .message .messageText:before {
  content: '';
  width: 0;
  height: 0;
  border-top: 0px solid transparent;
  border-right: 16px solid #d8e0f2;
  border-bottom: 16px solid transparent;
  left: -10px;
  top: 0;
  position: absolute;
}
.chat > div main > div.conversation .message .messageText .messageTime {
  color: #a9b4ce;
  font-size: 10px;
  margin-top: 7px;
}
.chat > div main > div.conversation .message .messageText .pdf-message {
  background-color: #fff;
  padding: 10px;
  border-radius: 5px;
  cursor: pointer;
  display: flex;
}
.chat > div main > div.conversation .message .messageText .pdf-message i {
  font-size: 40px;
}
.chat > div main > div.conversation .message .messageText .pdf-message span {
  padding-left: 5px;
  font-size: 12px;
}
.chat > div main > div.conversation .message .messageText .image-message {
  cursor: pointer;
}
.chat > div main > div.conversation .message .messageText .image-message img {
  border-radius: 5px;
}
.chat > div main > div.conversation .message.receiver {
  flex-direction: row-reverse;
}
.chat > div main > div.conversation .message.receiver .messageText {
  margin-left: 0;
  margin-right: 20px;
}
.chat > div main > div.conversation .message.receiver .messageText:before {
  border-top: 0 solid transparent;
  border-left: 16px solid #d8e0f2;
  border-bottom: 16px solid transparent;
  border-right: none;
  left: initial;
  right: -10px;
}
.chat > div main > div.createMessage {
  border-top: 1px solid #ddd;
  display: flex;
  flex-direction: column;
  min-height: 70;
  max-height: 140;
}
.chat > div main > div.createMessage .create-message-bottom {
  display: flex;
  width: 97%;
  margin: 0 15px;
  flex-grow: 1;
}
.chat > div main > div.createMessage .create-message-bottom .send-button {
  cursor: pointer;
  margin: auto 5px;
  color: #5987f6;
  font-weight: bold;
}
.chat > div main > div.createMessage .group-settings {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 10;
}
.chat > div main > div.createMessage .group-settings .fa {
  font-size: 26;
  cursor: pointer;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #f0f4fc;
}
.chat > div main > div.createMessage .group-settings.active .fa {
  color: coral;
}
.chat > div main > div.createMessage .attached-file {
  margin: auto;
  font-size: 30px;
  color: #5987f6;
  margin-right: 13px;
  cursor: pointer;
}
.chat > div main > div.createMessage .uploadedMediaPreview {
  display: flex;
  width: 100%;
  overflow: auto;
  flex-wrap: wrap;
}
.chat > div main > div.createMessage .uploadedMediaPreview .pdf-thumbnail .progress-bar,
.chat > div main > div.createMessage .uploadedMediaPreview .pdf-thumbnail .progress-bar {
  position: absolute;
  top: 0;
  width: 100%;
}
.chat > div main > div.createMessage .uploadedMediaPreview .image-thumbnail {
  margin: 5px;
  width: 70px;
  height: 70px;
  border: 1px solid #f0f4fc;
  border-radius: 6px;
  overflow: hidden;
  opacity: 1;
  transition-property: all;
  transition-duration: 1s;
  position: relative;
}
.chat > div main > div.createMessage .uploadedMediaPreview .image-thumbnail:hover a {
  opacity: 1;
}
.chat > div main > div.createMessage .uploadedMediaPreview .image-thumbnail a {
  cursor: pointer;
  position: absolute;
  outline: none;
  opacity: 0;
  top: 0;
  right: 0;
}
.chat > div main > div.createMessage .uploadedMediaPreview .image-thumbnail a i {
  background: #5186ed;
  width: 16px;
  height: 16px;
  text-align: center;
  line-height: 15px;
  border-radius: 20px;
  color: #f0f4fc;
  font-size: 10px;
  margin: 4px;
}
.chat > div main > div.createMessage .uploadedMediaPreview .image-thumbnail a img {
  width: 100%;
  transition-property: all;
  transition-duration: 1s;
}
.chat > div main > div.createMessage .uploadedMediaPreview .pdf-thumbnail {
  width: 133px;
  height: 51px;
  position: relative;
  background-color: #fff;
  border-radius: 5px;
  margin: 5px;
  justify-content: center;
  align-items: center;
  padding: 10px;
  display: flex;
  border: 1px solid #6f9ff8;
}
.chat > div main > div.createMessage .uploadedMediaPreview .pdf-thumbnail i {
  font-size: 40px;
  color: #5186ed;
}
.chat > div main > div.createMessage .uploadedMediaPreview .pdf-thumbnail .file-name {
  padding-left: 8px;
  font-size: 12px;
}
.chat > div main > div.createMessage .uploadedMediaPreview .pdf-thumbnail:hover a {
  opacity: 1;
}
.chat > div main > div.createMessage .uploadedMediaPreview .pdf-thumbnail a {
  cursor: pointer;
  position: absolute;
  outline: none;
  opacity: 0;
  top: 0;
  right: 0;
}
.chat > div main > div.createMessage .uploadedMediaPreview .pdf-thumbnail a i {
  background: #5186ed;
  width: 16px;
  height: 16px;
  text-align: center;
  line-height: 15px;
  border-radius: 20px;
  color: #f0f4fc;
  font-size: 10px;
  margin: 4px;
}
.chat > div main > div .avatarContainer {
  margin: auto;
}
.chat > div main > div .senderAvatar {
  margin: auto;
}
.chat > div main > div .message-input {
  display: flex;
  flex: 1;
  margin-left: 15;
  margin-right: 10;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.feed-post-buttons {
  margin-top: 10px;
  border-top: 1px solid #f0f4fc;
  position: relative;
}
.feed-post-buttons.has-active-button button {
  opacity: 0.3;
}
.feed-post-buttons > div {
  flex-grow: 1;
  text-align: center;
  font-size: 14px;
  margin: auto;
}
.feed-post-buttons > div.active button {
  opacity: 1;
  font-weight: bold;
}
.feed-post-buttons > div button {
  width: 100%;
  border: none;
  background: none;
  padding: 20px;
  cursor: pointer;
  color: #778091;
  font-size: 14px;
  font-family: "Helvetica Neue", Helvetica, "open sans", verdana;
  outline: none;
  align-items: center;
  justify-content: center;
  display: flex;
}
.feed-post-buttons > div button i {
  color: #36425A;
  font-size: 20;
  margin-right: 10;
}
.feed-post-buttons > span {
  height: 50px;
  width: 1px;
  background-color: #f0f4fc;
}
.feed-post-buttons > .disabled {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background-color: #fff;
  z-index: 100;
  opacity: 0.7;
  cursor: no-drop;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.comments {
  margin-top: 6px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.comments > div:first-child {
  border-top: 1px solid #f1f4fc;
  padding-top: 10px;
}
.comments .ngager-avatar {
  margin-right: 10;
  flex: none;
}
.comments .ngager-avatar .avatar {
  background-color: #36425A;
  color: #fff;
}
.comments .view-previous-comments {
  position: relative;
  height: 30;
  width: 100%;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
}
.comments .view-previous-comments span:first-child {
  color: #385898;
}
.comments .comments-list {
  display: block;
  width: 100%;
  overflow: auto;
  justify-content: flex-end;
}
.comments .comments-list .comment {
  margin-bottom: 12px;
  position: relative;
}
.comments .comments-list .comment > .disabled {
  display: flex;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #fff;
  opacity: 0.7;
  z-index: 10;
}
.comments .comments-list .comment .user-meta > div p:first-child {
  font-size: 12px;
}
.comments .comments-list .comment .comment-content {
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
}
.comments .addNewComment {
  position: relative;
  align-items: center;
}
.comments .addNewComment .addingCommentAnimation {
  position: absolute;
  right: 32px;
  bottom: 16px;
}

.feeed-filter-container {
  display: flex;
  margin-top: 20;
  margin-bottom: 20;
  position: relative;
}
.feeed-filter-container.disabled {
  opacity: 0.4;
}
.feeed-filter-container .block-ui {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  cursor: no-drop;
}
.feeed-filter-container .feeed-filter {
  position: relative;
  display: flex;
  min-height: 30;
  width: 100%;
  lex-wrap: wrap;
  padding-left: 40;
  flex-wrap: wrap;
}
.feeed-filter-container .feeed-filter .filter-value {
  margin: 2px;
  position: relative;
}
.feeed-filter-container .feeed-filter .filter-value .loading {
  position: absolute;
  right: 5;
  top: 5;
  z-index: 99;
}
.feeed-filter-container .feeed-filter .fa {
  cursor: pointer;
  color: #36425A;
  font-size: 30;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #f0f4fc;
  position: absolute;
  left: 0;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.edit-post-popup {
  min-width: 800px;
  z-index: 9999 !important;
  margin-top: -100px !important;
}
.edit-post-popup > div {
  background-color: transparent !important;
  box-shadow: none !important;
}
.edit-post-popup > div > div {
  padding: 0 !important;
  max-height: inherit !important;
}
.edit-post-popup > div .feedManager {
  height: auto;
}
.edit-post-popup > div .feedManager .feedContainer {
  margin: 0 auto;
}
.comment .comment-actions {
  position: absolute;
  top: 0;
  right: 0;
  display: none;
}
.comment .comment-actions i {
  font-size: 14px;
  margin: 0 3px;
  cursor: pointer;
  outline: none;
  color: #5186ed;
}
.comment:hover .comment-actions {
  display: flex;
}
.postCover {
  background-color: #fff;
  opacity: 0.5;
  position: absolute;
  top: 60px;
  right: 0px;
  bottom: 16px;
  left: 0px;
  z-index: 1;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.topMenu li {
  position: relative;
}
.topMenu li .notification {
  position: absolute;
  background: #f55d53;
  border-radius: 10px;
  padding-left: 6px;
  padding-right: 6px;
  color: white;
  font-size: 9px;
  margin-left: 4px;
  margin-top: 8px;
  z-index: 2;
  top: 0;
  right: 42px;
}
.topMenu li .notification {
  animation: animationFrames linear 1s;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  -webkit-animation: animationFrames linear 1s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: animationFrames linear 1s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -o-animation: animationFrames linear 1s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -ms-animation: animationFrames linear 1s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
}
@keyframes animationFrames {
  0% {
    transform: rotate(0deg) scaleX(1) scaleY(1);
  }
  10% {
    transform: rotate(-3deg) scaleX(0.8) scaleY(0.8);
  }
  20% {
    transform: rotate(-3deg) scaleX(0.8) scaleY(0.8);
  }
  30% {
    transform: rotate(3deg) scaleX(1.2) scaleY(1.2);
  }
  40% {
    transform: rotate(-3deg) scaleX(1.2) scaleY(1.2);
  }
  50% {
    transform: rotate(3deg) scaleX(1.2) scaleY(1.2);
  }
  60% {
    transform: rotate(-3deg) scaleX(1.2) scaleY(1.2);
  }
  70% {
    transform: rotate(3deg) scaleX(1.2) scaleY(1.2);
  }
  80% {
    transform: rotate(-3deg) scaleX(1.2) scaleY(1.2);
  }
  90% {
    transform: rotate(3deg) scaleX(1.2) scaleY(1.2);
  }
  100% {
    transform: rotate(0deg) scaleX(1.2) scaleY(1.2);
  }
}
.feed-likes-container,
.feed-segments-container {
  height: 100% !important;
  display: flex;
  flex: 1;
}
.feed-likes-container .feed-likes-body,
.feed-segments-container .feed-likes-body,
.feed-likes-container .feed-segments-body,
.feed-segments-container .feed-segments-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  overflow: hidden;
  padding-top: 20;
  padding-left: 20;
}
.feed-likes-container .feed-likes-body .fa-times,
.feed-segments-container .feed-likes-body .fa-times,
.feed-likes-container .feed-segments-body .fa-times,
.feed-segments-container .feed-segments-body .fa-times {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 25;
  -webkit-text-stroke-color: #f0f4fc;
  -webkit-text-stroke-width: 2px;
  cursor: pointer;
}
.feed-likes-container .feed-likes-body .title-container,
.feed-segments-container .feed-likes-body .title-container,
.feed-likes-container .feed-segments-body .title-container,
.feed-segments-container .feed-segments-body .title-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
.feed-likes-container .feed-likes-body .title-container .title-div,
.feed-segments-container .feed-likes-body .title-container .title-div,
.feed-likes-container .feed-segments-body .title-container .title-div,
.feed-segments-container .feed-segments-body .title-container .title-div {
  z-index: 9999;
  background: #f0f4fc;
  padding: 0 15px;
}
.feed-likes-container .feed-likes-body .title-container .title,
.feed-segments-container .feed-likes-body .title-container .title,
.feed-likes-container .feed-segments-body .title-container .title,
.feed-segments-container .feed-segments-body .title-container .title {
  text-align: center;
  font-weight: bold;
  color: #36425A;
}
.feed-likes-container .feed-likes-body .title-container .title-dash,
.feed-segments-container .feed-likes-body .title-container .title-dash,
.feed-likes-container .feed-segments-body .title-container .title-dash,
.feed-segments-container .feed-segments-body .title-container .title-dash {
  background-color: #36425A;
  height: 2px;
  position: absolute;
  left: 40px;
  right: 40px;
}
.feed-likes-container .feed-likes-body .feed-likes,
.feed-segments-container .feed-likes-body .feed-likes,
.feed-likes-container .feed-segments-body .feed-likes,
.feed-segments-container .feed-segments-body .feed-likes,
.feed-likes-container .feed-likes-body .feed-segments,
.feed-segments-container .feed-likes-body .feed-segments,
.feed-likes-container .feed-segments-body .feed-segments,
.feed-segments-container .feed-segments-body .feed-segments {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: auto;
}
.feed-likes-container .feed-likes-body .feed-likes .feed-like-item,
.feed-segments-container .feed-likes-body .feed-likes .feed-like-item,
.feed-likes-container .feed-segments-body .feed-likes .feed-like-item,
.feed-segments-container .feed-segments-body .feed-likes .feed-like-item,
.feed-likes-container .feed-likes-body .feed-segments .feed-like-item,
.feed-segments-container .feed-likes-body .feed-segments .feed-like-item,
.feed-likes-container .feed-segments-body .feed-segments .feed-like-item,
.feed-segments-container .feed-segments-body .feed-segments .feed-like-item,
.feed-likes-container .feed-likes-body .feed-likes .feed-segment-item,
.feed-segments-container .feed-likes-body .feed-likes .feed-segment-item,
.feed-likes-container .feed-segments-body .feed-likes .feed-segment-item,
.feed-segments-container .feed-segments-body .feed-likes .feed-segment-item,
.feed-likes-container .feed-likes-body .feed-segments .feed-segment-item,
.feed-segments-container .feed-likes-body .feed-segments .feed-segment-item,
.feed-likes-container .feed-segments-body .feed-segments .feed-segment-item,
.feed-segments-container .feed-segments-body .feed-segments .feed-segment-item {
  align-items: center;
  display: flex;
  margin: 20px 15px;
  flex-shrink: 0;
}
.feed-likes-container .feed-likes-body .feed-likes .feed-like-item i.fa-users,
.feed-segments-container .feed-likes-body .feed-likes .feed-like-item i.fa-users,
.feed-likes-container .feed-segments-body .feed-likes .feed-like-item i.fa-users,
.feed-segments-container .feed-segments-body .feed-likes .feed-like-item i.fa-users,
.feed-likes-container .feed-likes-body .feed-segments .feed-like-item i.fa-users,
.feed-segments-container .feed-likes-body .feed-segments .feed-like-item i.fa-users,
.feed-likes-container .feed-segments-body .feed-segments .feed-like-item i.fa-users,
.feed-segments-container .feed-segments-body .feed-segments .feed-like-item i.fa-users,
.feed-likes-container .feed-likes-body .feed-likes .feed-segment-item i.fa-users,
.feed-segments-container .feed-likes-body .feed-likes .feed-segment-item i.fa-users,
.feed-likes-container .feed-segments-body .feed-likes .feed-segment-item i.fa-users,
.feed-segments-container .feed-segments-body .feed-likes .feed-segment-item i.fa-users,
.feed-likes-container .feed-likes-body .feed-segments .feed-segment-item i.fa-users,
.feed-segments-container .feed-likes-body .feed-segments .feed-segment-item i.fa-users,
.feed-likes-container .feed-segments-body .feed-segments .feed-segment-item i.fa-users,
.feed-segments-container .feed-segments-body .feed-segments .feed-segment-item i.fa-users {
  margin-right: 10;
  font-size: 30;
}
.feed-likes-container .feed-likes-body .feed-likes .feed-like-item .full-name,
.feed-segments-container .feed-likes-body .feed-likes .feed-like-item .full-name,
.feed-likes-container .feed-segments-body .feed-likes .feed-like-item .full-name,
.feed-segments-container .feed-segments-body .feed-likes .feed-like-item .full-name,
.feed-likes-container .feed-likes-body .feed-segments .feed-like-item .full-name,
.feed-segments-container .feed-likes-body .feed-segments .feed-like-item .full-name,
.feed-likes-container .feed-segments-body .feed-segments .feed-like-item .full-name,
.feed-segments-container .feed-segments-body .feed-segments .feed-like-item .full-name,
.feed-likes-container .feed-likes-body .feed-likes .feed-segment-item .full-name,
.feed-segments-container .feed-likes-body .feed-likes .feed-segment-item .full-name,
.feed-likes-container .feed-segments-body .feed-likes .feed-segment-item .full-name,
.feed-segments-container .feed-segments-body .feed-likes .feed-segment-item .full-name,
.feed-likes-container .feed-likes-body .feed-segments .feed-segment-item .full-name,
.feed-segments-container .feed-likes-body .feed-segments .feed-segment-item .full-name,
.feed-likes-container .feed-segments-body .feed-segments .feed-segment-item .full-name,
.feed-segments-container .feed-segments-body .feed-segments .feed-segment-item .full-name {
  color: #778091;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.feedManager {
  height: 100%;
  overflow: auto;
}
.feedManager .postOverlay {
  position: fixed;
  background: rgba(5, 19, 41, 0.7);
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 2;
  opacity: 0;
  transition-property: all;
  pointer-events: none;
  transition-duration: 0.3s;
}
.feedManager .postOverlay.active {
  pointer-events: all;
  opacity: 1;
}
.feedManager .tab:first-child::before {
  content: "\E816" !important;
  font-family: 'ngager';
  top: 15px;
  margin-left: -60px;
}
.feedManager .tab:last-child::before {
  font-family: "FontAwesome";
  content: "\f013" !important;
  top: 14px;
  margin-left: -68px;
  font-size: 20px;
}
.feedManager .feedContainer {
  width: 700;
  margin-right: auto;
  margin-left: auto;
  margin-top: 70px;
  position: relative;
}
.feedManager .feedContainer > .loading {
  position: absolute;
  bottom: 0;
  z-index: 99;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.feedManager .feedContainer .postFeedContainer.onTop {
  position: relative;
  z-index: 2;
}
.feedManager .feedContainer .postFeedContainer.disabled {
  opacity: 0.5;
  cursor: no-drop;
}
.feedManager .feedContainer .postFeedContainer .postFeed {
  background: white;
  padding: 20px 20px 0 20px;
  border: 1px solid #e6ebf5;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  position: relative;
}
.feedManager .feedContainer .postFeedContainer .postFeed .adminAvatar {
  position: absolute;
  left: -50px;
  top: 17px;
  padding: 10px;
  display: flex;
  background-color: #f0f4fc;
  border-radius: 100px;
}
.feedManager .feedContainer .postFeedContainer .postFeed .adminAvatar .half-circle {
  width: 50%;
  height: 100%;
  background-color: #f0f4fc;
  border-top-right-radius: 100px;
  border-bottom-right-radius: 100px;
  border: 1px solid #e6ebf5;
  border-left: 0;
  box-sizing: border-box;
  position: absolute;
  margin: auto;
  top: 0px;
  right: -4px;
  z-index: 0;
}
.feedManager .feedContainer .postFeedContainer .postFeed .adminAvatar .avatar-image {
  z-index: 1;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadingMessage {
  position: absolute;
  padding: 30px;
  background: white;
  z-index: 10;
  right: 0;
  text-align: center;
}
.feedManager .feedContainer .postFeedContainer .postFeed .feedText {
  flex-grow: 1;
  margin-left: 40px;
}
.feedManager .feedContainer .postFeedContainer .postFeed hr {
  display: none;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview {
  position: relative;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div {
  position: absolute;
  right: 0;
  width: 70px;
  height: 70px;
  border: 1px solid #f0f4fc;
  border-radius: 6px;
  overflow: hidden;
  opacity: 0;
  margin-top: 25px;
  transition-property: all;
  transition-duration: 1s;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div a {
  cursor: pointer;
  position: absolute;
  outline: none;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div a i {
  background: #36425A;
  width: 16px;
  height: 16px;
  text-align: center;
  line-height: 15px;
  border-radius: 20px;
  color: #f0f4fc;
  font-size: 10px;
  margin: 4px;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div img {
  width: 100%;
  transition-property: all;
  transition-duration: 1s;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div.video {
  opacity: 1;
  margin-top: 0px;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div.video div.cover {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #222;
  opacity: 0;
  z-index: 0;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div.video i.fa-video-camera,
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div.video i.fa-picture-o {
  position: absolute;
  font-size: 32px;
  top: 20px;
  left: 18px;
  color: #f0f4fc;
  opacity: 0;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div.video:hover div.cover {
  opacity: 0.5;
}
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div.video:hover i.fa-video-camera,
.feedManager .feedContainer .postFeedContainer .postFeed .uploadedMediaPreview > div.video:hover i.fa-picture-o {
  opacity: 1;
}
.feedManager .feedContainer .postFeedContainer .publishPost {
  width: 100%;
  font-family: inherit;
  pointer-events: none;
  margin-bottom: 30px;
  opacity: 0;
  transition-property: all;
  transition-duration: 0.3s;
}
.feedManager .feedContainer .postFeedContainer .publishPost.buttonVisible {
  opacity: 1;
  cursor: pointer;
  pointer-events: all;
}
.feedManager .feedContainer .post-container {
  position: relative;
}
.feedManager .feedContainer .post-container hr {
  border: none;
  height: 1px;
  background: #d7dfef;
  margin-top: 14px;
  margin-bottom: 14px;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
.feedManager .feedContainer .post-container .post {
  background: white;
  padding: 20px;
  border: 1px solid #e6ebf5;
  border-radius: 10px;
}
.feedManager .feedContainer .post-container .post > div.livestream .postContent img {
  width: 100%;
}
.feedManager .feedContainer .post-container .post > div.livestream .postContent iframe {
  width: 100%;
  border: none;
}
.feedManager .feedContainer .post-container .post > div.livestream .user-meta .ngager-avatar .avatar {
  background-color: #36425A;
  color: #fff;
}
.feedManager .feedContainer .post-container .post > div.livestream .postContent .postImageWrapper {
  align-items: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-color: #222;
  height: 400;
  background-position: center;
}
.feedManager .feedContainer .post-container .post > div.livestream .postContent .postImageWrapper::before {
  display: none;
}
.feedManager .feedContainer .post-container .post > div.livestream.live .user-meta {
  background-color: #36425A;
  color: #fff;
  padding: 10;
  align-items: center;
}
.feedManager .feedContainer .post-container .post > div.livestream.live .user-meta .ngager-avatar {
  margin-right: 10;
  color: #FFFFFF;
  border-radius: 48px;
  border: 1px solid #fff;
}
.feedManager .feedContainer .post-container .post > div.livestream.live .user-meta .ngager-tv-retro {
  font-size: 30;
}
.feedManager .feedContainer .post-container .post > div.livestream.live .postContent {
  margin-top: 3px;
}
.feedManager .feedContainer .post-container .post > div.livestream.live .postContent .message {
  margin-top: 0;
}
.feedManager .feedContainer .post-container .post .user-meta {
  position: relative;
}
.feedManager .feedContainer .post-container .post .user-meta .ngager-avatar {
  margin-right: 10;
}
.feedManager .feedContainer .post-container .post .user-meta div:nth-child(2) {
  flex-grow: 1;
}
.feedManager .feedContainer .post-container .post .user-meta div > p:first-child {
  font-weight: 600;
  font-size: 14px;
}
.feedManager .feedContainer .post-container .post .processing-text {
  margin: 5px 0;
  color: #6fa0ff;
  font-size: 0.9em;
}
.feedManager .feedContainer .post-container .post .deletePost {
  position: absolute;
  right: -28px;
  top: 0px;
  background: #d5ddec;
  width: 30px;
  text-align: center;
  height: 30px;
  box-sizing: border-box;
  transition-property: all;
  transition-duration: 0.2s;
  opacity: 0;
  cursor: pointer;
  outline: none;
  border: none;
}
.feedManager .feedContainer .post-container .post .deletePost i {
  font-size: 18px;
  color: #667daf;
  line-height: 30px;
}
.feedManager .feedContainer .post-container .post .deletePost::after {
  content: " ";
  width: 0;
  height: 0;
  border-top: 9px solid #bbc5d8;
  border-right: 9px solid transparent;
  position: absolute;
  top: 30px;
}
.feedManager .feedContainer .post-container .post .editPost {
  right: 2px;
  width: 40px;
  padding-top: 2px;
}
.feedManager .feedContainer .post-container .post .editPost::after {
  border-top: 0;
  border-right: 0;
}
.feedManager .feedContainer .post-container .post:hover .deletePost {
  opacity: 1;
}
.feedManager .feedContainer .post-container .post .postContent {
  margin-top: 10px;
}
.feedManager .feedContainer .post-container .post .postContent .pdf-message {
  padding: 20;
  border-radius: 10px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 1px dashed #ddd;
  opacity: 0.7;
}
.feedManager .feedContainer .post-container .post .postContent .pdf-message:hover {
  opacity: 1;
}
.feedManager .feedContainer .post-container .post .postContent .pdf-message i {
  font-size: 50px;
  color: brown;
  margin-bottom: 10;
}
.feedManager .feedContainer .post-container .post .postContent .pdf-message span {
  font-size: 1.2em;
}
.feedManager .feedContainer .post-container .post .postContent .message {
  margin-top: 20px;
  margin-bottom: 8px;
  white-space: pre-line;
}
.feedManager .feedContainer .post-container .post .postContent video {
  background: #000000;
}
.feedManager .feedContainer .post-container .post .postContent .postImageWrapper {
  min-height: 300px;
  max-height: 600;
  overflow: hidden;
  position: relative;
  cursor: pointer;
  display: flex;
  justify-content: center;
}
.feedManager .feedContainer .post-container .post .postContent .postImageWrapper > .fa-play {
  position: absolute;
  align-self: center;
  font-size: 20px;
  width: 78px;
  height: 43px;
  background-color: #222222cc;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  color: #fff;
  padding-left: 10;
  border: 1px solid;
  left: 10;
  top: 10;
}
.feedManager .feedContainer .post-container .post .postContent .postImageWrapper > .fa-play:hover {
  background-color: #22222280;
}
.feedManager .feedContainer .post-container .post .postContent .postImageWrapper::before {
  content: 'Loading...';
  margin: auto;
  font-size: 14px;
  font-weight: 100;
  position: absolute;
  letter-spacing: 4px;
  text-align: center;
  color: #000;
  width: 300px;
  left: 50%;
  margin-left: -150px;
  height: 64px;
  top: 50%;
  margin-top: -32px;
  background: #36425A;
  background-size: 200% auto;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.feedManager .feedContainer .post-container .post .postContent .postImageWrapper img {
  max-width: 100%;
  position: relative;
  margin: auto;
  max-height: 100vh;
}
.feedManager .feedContainer .post-container .post .postContent iframe {
  width: 100%;
  height: 400px;
}
.feedManager .feedContainer .post-container .post .postContent audio {
  width: 100%;
}
.feedManager .feedContainer .post-container .post .post-summary {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
}
.feedManager .feedContainer .post-container .post .post-summary .segments {
  max-width: 250;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.feedManager .feedContainer .post-container .post .post-summary .segments i {
  margin-right: 5;
}
.feedManager .feedContainer .post-container .post .post-summary .segments span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.feedManager .feedContainer .post-container .post .post-summary .likesAndComments > div i {
  cursor: pointer;
  font-size: 13px;
  margin-right: 3px;
  line-height: 13px;
}
.feedManager .feedContainer .post-container .post .post-summary .likesAndComments > div i.fa-comment-o {
  font-size: 14px;
}
.feedManager .feedContainer .post-container .post .post-summary .likesAndComments > div i:focus {
  outline: none;
}
.feedManager .feedContainer .post-container .post .post-summary .likesAndComments > div span {
  display: inline-block;
  min-width: 10px;
  margin-right: 3px;
  line-height: 13px;
}

.live-stream-container {
  display: flex;
  flex: 1;
  flex-direction: row;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.live-stream-container .sidebar {
  width: 400px;
  display: flex;
  position: absolute;
  left: 0;
  height: 100%;
}
.live-stream-container .sidebar .comments {
  display: flex;
  flex-direction: column;
  flex: 1;
  margin-top: 0;
  color: #fff;
  justify-content: flex-end;
  overflow: hidden;
}
.live-stream-container .sidebar .comments > div:first-child {
  border-top: none;
}
.live-stream-container .sidebar .comments .comments-list {
  padding: 10;
}
.live-stream-container .sidebar .comments .comments-list .comment:first-child {
  border-top: none;
}
.live-stream-container .sidebar .comments .comments-list .comment .user-meta > div p:first-child {
  font-weight: bold;
  font-size: 1em;
}
.live-stream-container .sidebar .comments .addNewComment {
  padding: 10;
  padding-top: 0;
}
.live-stream-container .content {
  display: flex;
  flex: 1;
}
.live-stream-container .content iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.statistics-story-table td {
  height: 60px !important;
}
.statistics-story-table th,
.statistics-story-table td {
  text-align: center !important;
}
.statistics-story-back-button {
  padding: 10px;
  font-size: 2em !important;
  cursor: pointer;
}
.statistics-story-icon-check {
  background-color: #9acf61;
  border: 4px solid #e2f9ca;
  border-radius: 100px;
  color: #ffffff;
  height: 22px;
  width: 22px;
  line-height: 25px !important;
  font-size: 10px;
  margin: auto;
}
.grid-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid #eee;
}
.grid-cell-user {
  cursor: pointer;
  padding: 0 20px;
  width: 210px !important;
  justify-content: start;
}
.grid-cell-user:hover .grid-cell-user-data {
  text-decoration: underline;
}
.grid-cell-user-data {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.statistics-story-grid-bottom-left::-webkit-scrollbar,
.statistics-story-grid-top-right::-webkit-scrollbar {
  display: none;
}
.statistics-story-progress-bar {
  width: 80%;
  height: 30px;
  background: #bfd1f3;
  position: relative;
}
.statistics-story-progress-bar__meter {
  height: 30px;
  background: #5186ed;
}
.statistics-story-progress-bar__meter--complete {
  background: #9acf61;
}
.statistics-story-progress-bar__meter-label {
  position: absolute;
  text-align: center;
  width: 100%;
  margin: 0;
  line-height: 30px;
  color: #fff;
}
.rc-collapse {
  background-color: #fff;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  background-color: transparent;
  padding: 0 80px;
}
.rc-collapse-anim-active {
  transition: height 0.2s ease-out;
}
.rc-collapse > .rc-collapse-item {
  border: 1px solid #d9d9d9;
  border-bottom: none;
  background-color: #e8ecf5;
}
.rc-collapse:last-of-type {
  margin-bottom: 20px;
}
.rc-collapse:last-of-type .rc-collapse-item {
  border-bottom: 1px solid #d9d9d9;
}
.rc-collapse > .rc-collapse-item > .rc-collapse-header {
  height: 38px;
  line-height: 38px;
  color: #666;
  cursor: pointer;
  position: relative;
  font-size: 18px;
  padding: 10px 15px;
  outline: none;
}
.rc-collapse > .rc-collapse-item > .rc-collapse-header .arrow {
  font-family: 'FontAwesome';
  font-style: normal;
  position: absolute;
  right: 25px;
  font-size: 1.2em;
  transition: all 300ms ease-in 0s;
}
.rc-collapse > .rc-collapse-item > .rc-collapse-header .arrow::after {
  content: '\F078';
}
.rc-collapse > .rc-collapse-item-active > .rc-collapse-header .arrow {
  transform: rotate(180deg);
}
.rc-collapse > .rc-collapse-item-disabled > .rc-collapse-header {
  cursor: not-allowed;
  color: #999;
  background-color: #f3f3f3;
}
.rc-collapse-content {
  overflow: hidden;
  color: #666;
  background-color: #fff;
}
.rc-collapse-content > .rc-collapse-content-box {
  margin-top: 0;
  margin-bottom: 0;
}
.rc-collapse-content-inactive {
  display: none;
}
.rc-collapse-item:last-child > .rc-collapse-content {
  border-radius: 0 0 3px 3px;
}

.story-card {
  position: relative;
  min-width: 350px;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
}
.story-card .link {
  color: #FFFFFF;
}
.story-card .story-card-image {
  width: 100%;
}
.story-card .story-card-header {
  width: 100%;
  height: 300px;
  border-top-right-radius: 5px;
  border-top-left-radius: 8px;
}
.story-card .story-card-progress-ribbon {
  position: absolute;
  right: -8px;
  margin-top: 20px;
  width: 100px;
  text-align: center;
  box-sizing: border-box;
  outline: none;
  border: none;
  padding: 7px;
  color: #FFF;
  font-size: 12px;
}
.story-card .story-card-progress-ribbon:after {
  content: " ";
  width: 0;
  height: 0;
  border-top: 9px solid #000;
  border-right: 9px solid transparent;
  position: absolute;
  top: 31px;
  right: 0;
}
.story-card .story-card-content {
  color: #FFFFFF;
  padding: 20px;
  display: flex;
  flex-direction: column;
  height: 100px;
  justify-content: space-between;
}
.story-card .story-card-content-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  line-height: 1;
}
.story-card .card-title {
  font-size: 20px;
  text-align: left;
}
.story-card .card-description {
  font-size: 12px;
  text-align: left;
}
.story-card .card-progress {
  display: flex;
  align-items: center;
  flex-direction: row;
}
.story-card .card-progress-item-wrap {
  display: flex;
  flex-grow: 1;
  flex-direction: row;
  align-items: center;
}
.story-card .card-progress-item-wrap-last {
  flex-grow: 0;
}
.story-card .card-progress-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 10px;
}
.story-card .card-progress-item-icon {
  font-size: 24px;
}
.story-card .card-progress-item-icon-end {
  font-size: 22px;
  color: #FFFFFF;
  opacity: 0.4;
}
.story-card .card-progress-item-marker {
  width: 15px;
  height: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #FFFFFF;
  border-radius: 50%;
  background-color: #FFFFFF;
  opacity: 0.4;
}
.story-card .card-progress-item-marker .map-marker-icon {
  font-size: 18px;
  color: #577B9F;
}
.story-card .marker-active {
  width: 25px;
  height: 25px;
}
.story-card .marker-highlighted {
  opacity: 1;
}
.story-card .step-connector-root {
  flex: 1 1 auto;
}
.story-card .step-connector-line {
  display: block;
  border-color: #bdbdbd;
  border-top-style: solid;
  border-top-width: 2px;
  opacity: 0.4;
}
.story-card .step-connector-line-highlighted {
  opacity: 1;
}

.story-list-slider-container {
  display: flex;
  position: relative;
  width: 1200px;
  height: 450px;
  margin-top: 50;
}
.story-list-slider-container .slick-prev {
  left: -40px;
}
.story-list-slider-container .slick-next {
  right: -40px;
}
.story-list-slider-container .slick-next,
.story-list-slider-container .slick-prev {
  width: 30px;
  height: 30px;
}
.story-list-slider-container .slick-next:before,
.story-list-slider-container .slick-prev:before {
  color: #6C81AF;
  font-size: 30px;
}
.story-list-slider-container .slick-dots {
  bottom: -50px;
}
.story-list-slider-container .slick-dots li button:before {
  font-size: 8px;
}
.story-list-slider-container .slick-dots li.slick-active button:before,
.story-list-slider-container .slick-dots li button:before {
  color: #718FCC;
}
.story-list-item {
  min-width: 350px;
}
.slick-slide {
  padding: 0 8px;
  box-sizing: border-box;
}

#modal-container-team-results .modal-content::before {
  width: 900px;
  height: 700px;
  content: '';
  display: block;
  background: white;
  position: absolute;
  margin-left: -47px;
  margin-top: -34px;
}
.story-list .cards-container-header {
  display: flex;
}
.story-list .story-list-container {
  display: flex;
  flex-grow: 1;
  flex-direction: row;
  justify-content: center;
  margin-top: 20px;
}
.story-list .story-list-container .story-card {
  margin-right: 35px;
  width: 350px;
}
.story-list .story-list-container .story-card:last-child {
  margin-right: 0;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.leaderboardUI {
  height: 100%;
  overflow: auto;
  margin: auto;
}
.leaderboardUI .container {
  width: 100%;
  margin: auto;
  display: flex;
  flex-direction: column;
  flex: 1;
  height: 100%;
}
.leaderboardUI .container .leaderboard-item {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: center;
  min-height: 60px;
  max-height: 60px;
  margin: 35px 0;
  padding: 10px 0 10px 100px;
  text-align: left;
  position: relative;
  border-top-left-radius: 30px !important;
  border-bottom-left-radius: 30px !important;
  font-size: 18px;
}
.leaderboardUI .container .leaderboard-item .leaderboard-item-col {
  padding: 0 10px;
  width: 0;
}
.leaderboardUI .container .leaderboard-item .leaderboard-item-pos {
  flex-grow: 1;
}
.leaderboardUI .container .leaderboard-item .leaderboard-item-name {
  flex-grow: 5;
}
.leaderboardUI .container .leaderboard-item .leaderboard-item-points {
  flex-grow: 2;
}
.leaderboardUI .container .leaderboard-item .leaderboard-item-buttons {
  flex-grow: 1;
}
.leaderboardUI .container .leaderboard-item .leaderboard-item-avatar {
  position: absolute;
  left: 0;
  width: 80px !important;
  height: 80px !important;
}
.leaderboardUI .container .leaderboard-item .leaderboard-item-avatar-default {
  font-size: 2em !important;
  width: initial !important;
  height: initial !important;
}

.target-container {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  display: flex;
}
.target-container .target-tabs {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.target-container .target-tabs .content-container {
  display: flex;
  overflow: auto;
  flex: 1;
}
.target-container .target-tabs > div:first-child button {
  width: 200px !important;
}
.target-container .target-tabs > div:first-child + div div {
  width: 200px !important;
  background-color: #283850 !important;
  height: 3px !important;
  margin-top: -4px !important;
}
.target-container .target-tabs > div:first-child + div div::after {
  content: "";
  position: absolute;
  left: 50%;
  margin-left: -15px;
  width: 0;
  height: 0;
}
.target-container .target-tabs > div:first-child + div {
  width: 600px !important;
}
.target-container .target-tabs.team > div:first-child + div {
  width: 600px !important;
}
.target-container .target-tabs.personal > div:first-child + div {
  width: 400px !important;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.categoriesListContainer .resourcesColumn {
  margin-right: 20px;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.categoriesListContainer .resourcesColumn .resourcesList {
  overflow: auto;
}
.categoriesListContainer .resourcesColumn .resourcesList::-webkit-scrollbar {
  width: 8px;
}
.categoriesListContainer .resourcesColumn .resourcesList:hover::-webkit-scrollbar {
  background: #d2def5;
}
.categoriesListContainer .resourcesColumn .resourcesList:hover::-webkit-scrollbar-thumb {
  background: #abc4f6;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory {
  text-align: center;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header {
  position: relative;
  color: white;
  cursor: pointer;
  outline: none;
  padding-top: 40%;
  overflow: hidden;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header > div:first-child {
  position: absolute;
  text-align: center;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  display: flex;
  z-index: 2;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header > div:first-child > div {
  padding-left: 20px;
  padding-right: 20px;
  margin: auto;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header > div:first-child > div i {
  font-size: 26px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header .expandCollapseIconContainer {
  position: absolute;
  bottom: 15px;
  right: 15px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header .expandCollapseIconContainer i {
  font-size: 16px;
  cursor: pointer;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header .expandCollapseIconContainer i:focus {
  outline: none;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header .overlay {
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  opacity: 0.6;
  z-index: 1;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header .categoryProgress {
  position: absolute;
  bottom: 0;
  width: 100%;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header .categoryProgress > div {
  height: 5px;
  background-color: white;
  opacity: 0.7;
  width: 100%;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header .categoryProgress p {
  text-align: left;
  font-size: 12px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header img {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header i {
  position: relative;
  z-index: 1;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .header p {
  position: relative;
  z-index: 1;
  font-size: 15px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer {
  overflow: hidden;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer i {
  width: 50px;
  text-align: center;
  line-height: 50px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .gameHeader {
  transition-property: none;
  background-color: #fbfbfb;
  cursor: pointer;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .gameHeader:hover {
  background-color: #f1f5fd;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .gameHeader .gameName {
  font-size: 15px;
  font-weight: 100;
  line-height: 50px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  text-align: left;
  flex-grow: 1;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .gameHeader .gameCollapse {
  font-size: 18px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .resourceMeta {
  text-align: left;
  flex-grow: 1;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .resourceMeta p {
  line-height: 1;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .resourceMeta p:first-child {
  font-size: 13px;
  margin-top: 16px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 255px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .resourceMeta p:last-child {
  font-size: 10px;
  color: #bfbfbf;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .completionIndicator {
  width: 62px;
  line-height: 56px;
  display: flex;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .completionIndicator i {
  border: 4px solid #f5f5f5;
  background-color: #dadada;
  height: 22px;
  border-radius: 100px;
  color: white;
  width: 22px;
  line-height: 22px;
  font-size: 10px;
  margin: auto;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .completionIndicator i.consumed {
  background-color: #9acf61;
  border: 4px solid #e2f9ca;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .active-icon {
  width: 62px;
  line-height: 56px;
  display: flex;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .active-icon i {
  border: 4px solid #f5f5f5;
  background-color: #dadada;
  height: 22px;
  border-radius: 100px;
  color: white;
  width: 22px;
  line-height: 22px;
  font-size: 10px;
  margin: auto;
  background-color: #9acf61;
  border: 4px solid #e2f9ca;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .gameIcon {
  font-size: 20px;
  min-width: 50px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .fa-file-text-o {
  font-size: 15px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .fa-play {
  font-size: 14px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .fa-volume-up {
  font-size: 14px;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .gameResourcesContainer > div {
  background: white;
  cursor: pointer;
  transition-property: all;
  transition-duration: 0.3s;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer .gameResourcesContainer > div:hover {
  background-color: #f1f5fd;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory .games .gameContainer.collapsed .gameResourcesContainer {
  height: 0;
  overflow: hidden;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory.expanded .games {
  transition-property: all;
  transition-duration: 0.3s;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory.collapsed {
  overflow: hidden;
}
.categoriesListContainer .resourcesColumn .resourcesList .accordion .accCategory.collapsed .games {
  transition-property: all;
  transition-duration: 0.3s;
  height: 0;
}

.reports {
  flex-direction: column;
  flex-grow: 1;
  height: 100%;
}
.reports > div .contentConsuming {
  flex-grow: 1;
  background-color: #f0f4fc;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
  height: 100%;
  position: relative;
  overflow: auto;
}
.reports > div .contentConsuming .game-container {
  margin-bottom: 20px;
  padding-bottom: 20px;
  background-color: #FFFFFF;
}
.reports > div .contentConsuming .game-container .game-header {
  display: block;
  position: relative;
}
.reports > div .contentConsuming .game-container .game-header .completed-time {
  position: absolute;
  right: 20;
  top: 10px;
  font-style: oblique;
}
.reports > div .contentConsuming .game-container .game-header .game-name {
  font-weight: bold;
  background-color: #FFFFFF;
  justify-content: left;
  padding-left: 20px;
}
.reports > div .contentConsuming .game-container .game-header .game-name i {
  font-size: 30;
  margin-right: 10px;
}

.report-game {
  display: block;
  padding: 30px;
  margin: auto;
  max-width: 1100;
}
.report-game > .field {
  display: block;
  margin-bottom: 30px;
}
.report-game > .field:last-child {
  margin-bottom: 0;
}
.report-game > .field .max-width {
  max-width: 700px;
  margin: auto;
}
.report-game > .field.gridsystem {
  margin-bottom: 80px;
}
.report-game > .field .text-container {
  margin-bottom: 20px;
  width: 100%;
}
.report-game > .field .text-container hr {
  border-top: none #778091;
  border-left: none #778091;
  border-right: none #778091;
  border-bottom: 2px dotted #778091;
  box-sizing: content-box;
  margin: 0px;
  width: 100%;
}
.report-game > .field .text-container .answer {
  font-size: 14.4px;
  padding: 5px 0;
}

.moduleHolder > .endorsement {
  flex: 1 1 0%;
  flex-grow: 1;
  height: 100%;
  display: flex;
  width: 100%;
  margin: auto;
  color: #6c81af;
}
.moduleHolder > .endorsement.my-endorsements {
  width: 100%;
  margin: auto;
  height: 100%;
  justify-content: flex-start;
  color: #6c81af;
  display: flex;
  flex-direction: row;
}
.moduleHolder > .endorsement.my-endorsements .left-col {
  display: flex;
  overflow: auto;
  border-left: 0;
  border-top: 0;
  border-bottom: 0;
  padding-top: 10;
  flex-direction: column;
}
.moduleHolder > .endorsement.my-endorsements .left-col .ngager-list {
  overflow: auto;
  margin-top: 10;
}
.moduleHolder > .endorsement.my-endorsements .right-col {
  display: flex;
  flex-grow: 1;
  overflow: auto;
  padding-top: 20px;
  flex-direction: column;
  align-items: center;
}
.moduleHolder > .endorsement.my-endorsements .right-col .endorsement-details {
  max-width: 600;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 30;
}
.moduleHolder > .endorsement.my-endorsements .right-col .endorsement-details .icon-container {
  width: 196;
  height: 196;
  background-color: #fff;
  display: flex;
  border-radius: 196px;
  justify-content: center;
  align-items: center;
}
.moduleHolder > .endorsement.my-endorsements .right-col .endorsement-details span.name {
  font-size: 28;
  font-weight: bold;
  margin-top: 20;
  margin-bottom: 20;
}
.moduleHolder > .endorsement.my-endorsements .right-col .endorsement-details span.motivation {
  font-size: 1.1em;
  font-style: italic;
  text-align: justify;
  justify-content: center;
  display: flex;
}
.moduleHolder > .endorsement.my-endorsements .right-col .endorsement-details .sender {
  padding-left: 55;
  display: flex;
  flex-direction: column;
  position: relative;
  margin-top: 20;
  margin-bottom: 20;
  justify-content: center;
  min-height: 60;
}
.moduleHolder > .endorsement.my-endorsements .right-col .endorsement-details .sender span.sender-name {
  line-height: 20px;
}
.moduleHolder > .endorsement.my-endorsements .right-col .endorsement-details .sender span.received-at {
  font-size: 0.9em;
  opacity: 0.4;
}
.moduleHolder > .endorsement.give-endorsement {
  flex-direction: column;
  align-items: center;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel {
  width: 100%;
  min-width: 100%;
  margin: auto;
  min-height: 500;
  margin-top: 50;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .ngager-carousel-container {
  height: 290;
  width: 100%;
  max-width: 1200;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .ngager-carousel-container .slick-current .slide-item {
  transform: scale(1);
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .ngager-carousel-container .slide-item {
  min-width: 350;
  max-width: 350;
  height: 250px;
  transform: scale(0.84);
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .ngager-carousel-container .slide-item .card-content {
  height: 220;
  width: 350;
  max-width: 350;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .list {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  max-width: 400;
  margin: auto;
  width: 100%;
  /* justify-content: flex-start; */
  margin-top: 0;
  padding-top: 20;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .list .item {
  display: flex;
  flex: 1;
  min-height: 50;
  align-items: center;
  margin-bottom: 15;
  cursor: pointer;
  border: 1px solid;
  border-radius: 10px;
  background-color: #ffffff80;
  border-color: #6c81af80;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .list .item:hover {
  background-color: beige;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .list .item .icon {
  min-width: 70;
  text-align: center;
  width: 70;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .list .item .icon .fa {
  font-size: 30;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .list .item .text {
  display: flex;
  flex-direction: column;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .list .item .text .title {
  font-size: 1.1em;
}
.moduleHolder > .endorsement.give-endorsement .categories-carousel .list .item .text .description {
  font-size: 0.9em;
  color: #c4c4c4;
}

.notice-number {
  position: absolute;
  left: -15px;
  top: 15px;
  min-width: 30;
  max-width: 100;
  height: 30;
  background-color: #ed9292;
  display: flex;
  border-radius: 30px;
  justify-content: center;
  align-items: center;
}
.notice-number span {
  color: #fff;
  margin: auto;
  padding: 5;
}

.feedback-message {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  max-width: 900;
  align-self: center;
  width: 100%;
}
.feedback-message span.title {
  font-size: 1.2em;
  font-weight: bold;
}
.feedback-message span.sub-title {
  font-size: 1.1em;
  opacity: 0.61;
}
.feedback-message .form {
  margin-bottom: 20;
}
.feedback-message .button {
  display: flex;
  justify-content: center;
}

.progress-bar {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.progress-bar .progess-info {
  display: flex;
  width: 100%;
  margin-top: 3;
  opacity: 0.7;
}
.progress-bar .progess-info span {
  padding-right: 15;
}
.progress-bar .slider {
  height: 30px;
  width: 100%;
  background-color: #fff;
  border-width: 0.5px;
  border-style: solid;
  border-color: #ddd;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.progress-bar .slider .slider-progress {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.progress-bar .slider .slider-progress.low-value span {
  color: gray;
  position: absolute;
  left: 100%;
  margin-left: 3;
}
.progress-bar .slider .slider-progress span {
  color: #fff;
  text-align: center;
}
.progress-bar .slider .more {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
  text-align: center;
}

.action-nudge-suggestions {
  display: flex;
  justify-content: center;
  /* margin-top: 10; */
  flex-direction: column;
  align-items: center;
  padding-top: 10;
  padding-bottom: 10;
  position: relative;
}
.action-nudge-suggestions .action-nudge-trigger > span.title {
  font-weight: bold;
  text-align: center;
  width: 100%;
  display: block;
}
.action-nudge-suggestions .action-nudge-trigger .action-nudge-trigger-text {
  display: flex;
  margin: 5;
  align-items: center;
}
.action-nudge-suggestions .action-nudge-trigger .action-nudge-trigger-text .fa {
  font-size: 20;
  margin: 5;
}
.action-nudge-suggestions i.fa-times {
  position: absolute;
  right: 5;
  top: 5;
  font-size: 20;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: cornsilk;
  cursor: pointer;
  z-index: 20;
}

.summary-per-request,
.summary-per-template {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding-top: 10;
  padding-left: 20;
}
.summary-per-request .myfeedback-summary,
.summary-per-template .myfeedback-summary {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  flex: 1;
  overflow: hidden;
}
.summary-per-request .myfeedback-summary .filter,
.summary-per-template .myfeedback-summary .filter {
  height: 50;
  margin-bottom: 10;
}
.summary-per-request .myfeedback-summary .filter .ngager-half,
.summary-per-template .myfeedback-summary .filter .ngager-half {
  overflow: hidden;
  margin-right: 20;
}

.ngager-segments-picker {
  display: flex;
  flex-direction: column;
  color: #5d76aa;
  overflow: auto;
  flex: 1;
}
.ngager-segments-picker > div {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ngager-segments-picker .tree-container {
  justify-content: flex-start;
}
.ngager-segments-picker .filter {
  min-height: 40;
  max-height: 40;
  border-bottom: 1px solid #bcd1f9;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.ngager-segments-picker .filter .search-icon {
  font-size: 15;
  color: #829acf;
  max-width: 20;
}
.ngager-segments-picker .filter input.text {
  display: inline-flex;
  flex: 1;
  height: 30;
  background-color: transparent;
  border: none;
  margin-left: 10;
  color: #5d76aa;
}
.ngager-segments-picker .filter input.text::-moz-placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #5d76aa;
  opacity: 1;
  /* Firefox */
}
.ngager-segments-picker .filter input.text::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #5d76aa;
  opacity: 1;
  /* Firefox */
}
.ngager-segments-picker .filter input.text:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #5d76aa;
}
.ngager-segments-picker .filter input.text::-ms-input-placeholder {
  /* Microsoft Edge */
  color: #5d76aa;
}
.ngager-segments-picker .filter .select-all {
  max-width: 100;
  justify-content: space-evenly;
  display: flex;
  flex: 1;
  align-items: center;
}
.ngager-segments-picker .filter .select-all label {
  cursor: pointer;
}
.ngager-segments-picker .filter .select-all input.checkbox {
  font-size: 40;
}
.ngager-segments-picker .segments-tree {
  padding-bottom: 30;
  justify-content: flex-start;
}
.ngager-segments-picker .selected-segments {
  opacity: 1;
  display: flex;
  flex: 1;
  position: relative;
  min-height: 96;
  max-height: 96;
  background-color: #283850;
  color: #fff;
  padding-left: 30;
}
.ngager-segments-picker .selected-segments > span {
  font-size: 1.1em;
  font-weight: bold;
}
.ngager-segments-picker .selected-segments .number-people {
  position: absolute;
  bottom: 5;
  right: 5;
  font-size: 0.8em;
  font-style: italic;
}

.users-populator {
  display: flex;
  flex: 1;
  overflow: hidden;
  min-height: 477;
}
.users-populator .user-popuplator-options {
  margin: auto;
}
.users-populator .user-popuplator-options p.download-text {
  font-size: 13px;
  position: absolute;
  bottom: 5px;
  left: 5;
  right: 5;
}
.users-populator .manage-users {
  display: flex;
  flex: 1;
  flex-direction: column;
}
.users-populator .manage-users > div {
  flex: 1;
}
.users-populator .manage-users .form {
  width: 100%;
  max-height: 150;
}
.users-populator .manage-users .users-list {
  margin-top: 30;
  display: flex;
  overflow: hidden;
}
.users-populator .manage-users .ngager-list {
  margin-top: 30;
  width: 100%;
}
.users-populator .manage-users .ngager-list .item {
  background-color: #E2E9F8;
  margin-bottom: 6px;
  border-radius: 16px;
  min-height: 30px;
}
.users-populator .manage-users .ngager-list .item > div {
  min-height: unset;
  display: flex;
  align-content: center;
  align-items: center;
}
.users-populator .manage-users .ngager-list .item div.userName {
  width: 30%;
  padding: 0 10px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.users-populator .manage-users .ngager-list .item div.fullname {
  width: 30%;
  padding: 0 10px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.users-populator .manage-users .ngager-list .item div.email {
  width: 30%;
  padding: 0 10px;
  margin-right: 5;
  max-width: 200;
}
.users-populator .manage-users .ngager-list .item div.email > span {
  text-overflow: ellipsis;
  overflow: hidden;
}
.users-populator .manage-users .ngager-list .item div.actions {
  width: 10%;
  text-align: center;
  width: 50;
  justify-content: space-between;
  align-items: center;
  margin-right: 5;
}
.users-populator .manage-users .ngager-list .item .buttons {
  display: flex;
  height: 100%;
}
.users-populator .manage-users .ngager-list .item .buttons > div {
  width: 20;
  height: 100%;
  display: flex;
  align-items: center;
}
.users-populator .manage-users .ngager-list .item .buttons > div i {
  line-height: 20px;
  margin: auto;
  cursor: pointer;
  font-size: 14px;
}
.users-populator .manage-users .ngager-list .item .buttons > div i.fa-times-circle {
  color: #ED839C;
}
.users-populator .manage-users .bottom {
  max-height: 40;
  display: flex;
}
.users-populator .manage-users .bottom .back-button {
  margin-top: 10;
  font-size: 14px;
  cursor: pointer;
}
.users-populator .manage-users .bottom .back-button i {
  margin-right: 5;
}

.nps-chart {
  display: flex;
  flex: 1;
  flex-wrap: nowrap;
  padding-top: 20;
  align-items: center;
  padding-bottom: 20;
}
.nps-chart .question-text {
  display: block;
  width: 300;
}
.nps-chart .question-text > span {
  padding-right: 5;
}
.nps-chart .percentage-bar {
  display: flex;
  height: 40;
  flex: 1;
  flex-wrap: nowrap;
  border-radius: 10px;
  overflow: hidden;
}
.nps-chart .percentage-bar > div {
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.nps-chart .percentage-bar > div.low {
  color: #ffffff;
}
.nps-chart .percentage-bar > div.medium {
  color: #707070;
}
.nps-chart .percentage-bar > div.high {
  color: #ffffff;
}
.nps-chart .percentage-bar > div > span {
  font-size: 1.2em;
  font-weight: bold;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.nps-chart .percentage-bar > div:last-child {
  flex: 1;
}
.nps-chart .average-value {
  display: flex;
  min-width: 60;
  height: 60;
  background-color: #6c81af;
  border-radius: 60px;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 1.5em;
  font-weight: bold;
  margin-left: 20;
}

.question-detailed-chart .text-question-answers div.answers div.answer {
  margin: 0;
}

.company-feedback-number {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.company-feedback-number .number-detailed {
  display: flex;
  flex: 1;
  width: 100%;
  min-height: 150;
}
.company-feedback-number .number-genreal {
  padding-left: 30;
  padding-right: 30;
  display: flex;
  justify-content: center;
  align-items: center;
}
.company-feedback-number .number-genreal > span {
  height: 60;
  border-radius: 60px;
  display: flex;
  background-color: #36425A;
  color: #fff;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  padding: 10;
  font-size: 20;
  min-width: 60px;
}

.tag-general .tag-overview-chart:last-child .awesome-bar-chart {
  margin-bottom: 0;
}
.tag-general .tag-overview-chart .awesome-bar-chart {
  margin-bottom: 30;
}
.tag-general .tag-overview-chart .avg {
  display: flex;
  width: 100%;
  align-items: center;
}
.tag-general .tag-overview-chart .avg span.tag-name {
  display: flex;
  width: 33%;
  max-width: 600;
  min-width: 300;
  font-size: 1.2em;
  font-weight: bold;
}
.tag-general .tag-overview-chart .avg span.tag-name > span {
  padding: 10;
  border-radius: 20px;
  color: #36425a;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 100%;
}
.tag-general .tag-overview-chart .avg .avg-chart {
  display: flex;
  flex: 1;
  margin-right: 10;
  height: 40px;
}
.tag-general .tag-overview-chart .avg .avg-chart .progress {
  background-color: #36425a;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  position: relative;
  display: flex;
  align-items: center;
}
.tag-general .tag-overview-chart .avg .avg-chart .progress .value {
  position: absolute;
  right: 10;
  color: #fff;
  font-size: 1.2em;
  font-weight: bold;
}

.group-by {
  display: flex;
  flex-direction: row;
}
.group-by > span {
  font-size: 1em;
  margin-left: 10;
  padding-left: 2px;
  padding-right: 2px;
  cursor: pointer;
}
.group-by > span.active {
  font-weight: bold;
  border-bottom: 2px solid;
  cursor: default;
}

.moduleHolder > .meeting {
  flex-direction: column;
  flex: 1 1 0%;
  flex-grow: 1;
  height: 100%;
  display: flex;
  width: 100%;
  margin: auto;
  color: #6C81AF;
}
.moduleHolder > .meeting .games-carousel {
  width: 100%;
  min-width: 100%;
}
.moduleHolder > .meeting .games-carousel .ngager-carousel-container {
  width: 100%;
  max-width: 900;
}
.moduleHolder > .meeting .games-carousel .ngager-carousel-container .slick-current .slide-item {
  transform: scale(1);
}
.moduleHolder > .meeting .games-carousel .ngager-carousel-container .slick-current .slide-item .card-bottom {
  display: block;
}
.moduleHolder > .meeting .games-carousel .ngager-carousel-container .slide-item {
  min-width: 250;
  max-width: 250;
  transform: scale(0.9);
}
.moduleHolder > .meeting .games-carousel .ngager-carousel-container .slide-item .card-bottom {
  display: none;
}
.moduleHolder > .meeting .games-carousel .ngager-carousel-container .slide-item > div {
  height: 310;
  border: 1px solid #E2EBFF;
}
.moduleHolder > .meeting .games-carousel .ngager-carousel-container .slide-item > div .card-content .card-bottom {
  position: absolute;
  bottom: 20;
  left: 0;
  right: 0;
}
.moduleHolder > .meeting .meeting-form {
  margin: auto;
  display: flex;
  width: 100%;
  justify-content: center;
  flex: 1;
}
.moduleHolder > .meeting .meeting-form .game-container {
  width: 100%;
  display: flex;
  height: 100%;
  flex-direction: column;
}
.moduleHolder > .meeting .meeting-form .game-container > .form {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: auto;
  width: 100%;
}
.moduleHolder > .meeting .meeting-form .game-container > .form > .game-body {
  padding-top: 0;
  max-width: 700;
}

.change-password-form .content {
  display: flex;
  flex-direction: row;
}
.change-password-form .fields {
  display: flex;
  flex-direction: column;
}
.change-password-form .fields-input {
  position: relative;
  margin-bottom: 15px;
}
.change-password-form .show-password-button {
  position: absolute;
  bottom: 15;
  right: 0;
  cursor: pointer;
  z-index: 10;
}
.change-password-form .password-rules-list-container {
  margin-left: 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 12px;
}
.change-password-form .password-rules-list-container .heading {
  padding-bottom: 5px;
}
.change-password-form .password-rules-list .checked {
  color: #a4c639;
}
.change-password-form .buttons {
  display: flex;
  justify-content: flex-end;
  margin-top: 20;
}
.change-password-form .text-banner {
  margin-bottom: 20px;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.profile {
  height: 100%;
  overflow: hidden;
}
.profile .report_activities,
.profile .activities,
.profile .target,
.profile .endorsement {
  display: flex;
  flex-direction: column;
}
.profile .report_activities .content,
.profile .activities .content,
.profile .target .content,
.profile .endorsement .content {
  height: unset;
  display: flex;
  flex: 1;
  flex-direction: column;
}
.profile .report_activities .content > div,
.profile .activities .content > div,
.profile .target .content > div,
.profile .endorsement .content > div {
  overflow: hidden;
  display: flex;
  flex: 1;
}
.profile .report_activities .content > div > div,
.profile .activities .content > div > div,
.profile .target .content > div > div,
.profile .endorsement .content > div > div {
  overflow: hidden;
  flex: 1;
}
.profile .report_activities .content > div > div.report-activities,
.profile .activities .content > div > div.report-activities,
.profile .target .content > div > div.report-activities,
.profile .endorsement .content > div > div.report-activities {
  display: flex;
  flex: 1;
  flex-direction: column;
}
.profile aside {
  width: 300px;
  /* min-width: 290px; */
  text-align: center;
  padding: 30px 10px;
  display: flex;
  flex-direction: column;
}
.profile aside .scrollable-content {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
  overflow-y: auto;
}
.profile aside .edit-button {
  display: flex;
  margin-top: 5;
}
.profile aside .edit-button .ngager-edit {
  color: #5186ed;
  font-size: 18;
  font-weight: bold;
  opacity: 0.6;
  height: 20;
}
.profile aside .edit-button .ngager-edit:hover {
  opacity: 1;
}
.profile aside .avatar-wrapper {
  width: 160px;
  height: 160px;
  position: relative;
  margin: auto;
  display: flex;
}
.profile aside .avatar-wrapper .upload-button {
  width: 160;
  height: 160;
}
.profile aside .avatar-wrapper .profile-photo {
  width: 150px;
  /* margin-left: 5px; */
  height: 150px;
  overflow: hidden;
  border-radius: 150px;
  margin: auto;
}
.profile aside .avatar-wrapper .profile-photo img {
  height: 100%;
  min-width: 100%;
}
.profile aside .avatar-wrapper .overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  background: #5186ed;
  border-radius: 200px;
  opacity: 0.2;
}
.profile aside .avatar-wrapper .border {
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: 200px;
  border: 17px solid #5186ed;
  opacity: 0.1;
  box-sizing: border-box;
}
.profile aside .name {
  font-weight: 600;
  margin-top: 10px;
  font-size: 16px;
  color: #5186ed;
}
.profile aside .job-title {
  font-size: 14px;
  margin-top: 0px;
}
.profile aside .email {
  opacity: 0.5;
  word-wrap: break-word;
}
.profile aside hr {
  margin-top: 10;
  margin-right: 20px;
  border: none;
  background: #c6d4f1;
  height: 1px;
}
.profile aside .aside-section {
  text-align: left;
  padding-top: 10px;
}
.profile aside .aside-section i.ngager-report {
  font-size: 20px;
  font-weight: bold;
}
.profile aside .aside-section .fields {
  display: table;
  border-collapse: separate;
  border-spacing: 0 5px;
}
.profile aside .aside-section .fields .row {
  display: table-row;
}
.profile aside .aside-section .fields .cell {
  display: table-cell;
}
.profile aside .aside-section .fields .field .label {
  padding-right: 15;
  width: 90;
}
.profile aside .aside-section .fields .field .value {
  font-style: italic;
  word-break: break-all;
}
.profile aside .aside-section .fields .field .value a {
  color: #5186ed;
}
.profile aside .aside-section > span.name {
  color: #5186ed;
  font-size: 16px;
  font-weight: 600;
  opacity: 0.6;
  display: block;
  margin-bottom: 5;
}
.profile aside .aside-section > span.name i {
  width: 20;
}
.profile aside .aside-section h2 {
  opacity: 0.6;
}
.profile aside .aside-section p {
  font-size: 14px;
  margin-left: 10px;
}
.profile > div {
  height: 100%;
  flex: 1;
}
.profile > div > div {
  height: 100%;
}
.profile > div > div > div:first-child {
  border-bottom: 1px solid #d6def5;
  white-space: normal !important;
}
.profile > div > div > div:first-child + div div {
  background-color: #6ea0fc !important;
}
.profile > div > div > div:first-child + div div::after {
  content: '';
  position: absolute;
  left: 50%;
  margin-left: -15px;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 10px solid #6ca0fc;
}
.profile > div > div > div:last-child {
  overflow: auto;
  height: calc(100% - 20px);
}
.profile .assets {
  height: calc(100% - 22px);
  flex-direction: column;
}
.profile .assets > div > div {
  flex: 1;
}
.profile .assets > div > div:first-child {
  flex: 1;
  flex-wrap: wrap;
}
.profile .assets > div > div:last-child {
  flex: 2;
}
.profile .assets > div:first-child {
  flex: 2;
}
.profile .assets > div:last-child {
  flex: 1;
  overflow: auto;
}
.profile .assets .assetShowcase {
  justify-content: start;
}
.profile .assets .assetShowcase .assetContainer {
  text-align: center;
  flex-basis: 160px;
  margin-bottom: 50px;
}
.profile .assets .assetShowcase .assetContainer img {
  height: 100px;
  width: 100px;
  border-radius: 100px;
}
.profile .assets .assetShowcase .assetContainer > div:nth-child(2) {
  font-size: 36;
  font-weight: 600;
}
.profile .badges {
  height: calc(100% - 22px);
  flex-direction: column;
}
.profile .badges h2 {
  border-bottom: 1px solid #b3cdfd;
  margin-bottom: 30px;
  margin-top: 50px;
}
.profile .badges > div:first-child {
  flex: 2;
  overflow: auto;
}
.profile .badges > div:last-child {
  flex: 1;
}
.profile .badges .badgesShowcase {
  display: flex;
  flex-direction: column;
  flex: 2;
  margin-right: 20px;
}
.profile .badges .badgesShowcase .badgesList {
  overflow: auto;
  flex-wrap: wrap;
  justify-content: start;
  flex: 1;
}
.profile .badges .badgeContainer {
  text-align: center;
  flex-basis: 160px;
  margin-bottom: 50px;
}
.profile .badges .badgeContainer img {
  height: 100px;
}
.profile .badges .badgeContainer > div:nth-child(2) {
  font-size: 12px;
}
.profile .badges .ongoingBadgesShowcase {
  flex: 1;
  margin-left: 20px;
  flex-direction: column;
}
.profile .badges .ongoingBadgesShowcase .ongoingBadgesList {
  flex-wrap: wrap;
  flex: 1;
  overflow: auto;
}
.profile .badges .ongoingBadgesShowcase .ongoingBadgesList .badgeContainer {
  margin-bottom: 35px;
}
.profile .badges .ongoingBadgesShowcase img {
  opacity: 0.3;
}
.profile .badges .ongoingBadgesShowcase .badgeProgress {
  display: inline-block;
  width: 27px;
  height: 14px;
  text-align: center;
  line-height: 15px;
  background: #f38181;
  color: white;
  border-radius: 100px;
  margin-right: 3px;
  font-size: 9px;
}
.profile .endorsements {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 100%;
  justify-content: stretch;
  align-items: stretch;
}
.profile .endorsements .endorsement-container {
  background-color: #e7ebf9;
  height: 90%;
  overflow: auto;
}
.profile .endorsements .endorsement-container .endorsements-list {
  flex-wrap: wrap;
  justify-content: center;
  flex-direction: row;
  margin-bottom: 50;
}
.profile .endorsements .endorsement-container .endo {
  height: 100px;
  margin-top: 50px;
  margin-left: 25px;
  margin-right: 25px;
  flex-basis: 400px;
}
.profile .endorsements .endorsement-container .endo > div {
  margin-top: auto;
  margin-bottom: auto;
  flex: 1;
}
.profile .endorsements .endorsement-container .endo .endo-info {
  background-color: #dfe4f1;
  border-radius: 20px;
  margin-left: -35px;
  padding-left: 44px;
  height: 100px;
  flex: 1;
}
.profile .endorsements .endorsement-container .endo .endo-info > div {
  margin-top: auto;
  margin-bottom: auto;
  margin-left: 20px;
}
.profile .endorsements .endorsement-container .endo .endo-info > div p:first-child {
  font-size: 18px;
  font-weight: bold;
  color: #6882b5;
}
.profile .endorsements .endorsement-container .endo .avatar {
  position: relative;
}
.profile .endorsements .endorsement-container .endo .avatar img {
  width: 60px;
  height: 60px;
  border-radius: 100px;
  border: 6px solid #f1f4fc;
  margin: auto;
}
.profile .filter-item {
  margin-right: 10px;
  position: relative;
}
.profile .filter-item .fa-times {
  position: absolute;
  top: 42px;
  right: 0px;
  font-size: 14px;
  cursor: pointer;
}
.profile .report-activities .filter-item {
  min-width: 250;
}
.profile .report-activities .report-activities-container {
  overflow: auto;
  display: flex;
  flex-direction: column;
  flex: 1;
  background-color: #e7ebf9;
}
.profile .report-activities .report-activities-container .report-activities-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  flex-direction: row;
}

.ngagerIndicator {
  width: 40px;
  line-height: 56px;
  display: flex;
}
.ngagerIndicator i {
  border: 4px solid #f5f5f5;
  background-color: #dadada;
  height: 20px;
  border-radius: 100px;
  color: white;
  width: 20px;
  line-height: 20px;
  font-size: 10px;
  margin: auto;
  justify-content: center;
  align-items: center;
  display: flex;
}
.ngagerIndicator i.completed {
  background-color: #9acf61;
  border: 4px solid #e2f9ca;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
.statistics {
  flex-direction: column;
  flex-grow: 1;
  height: 100%;
}
.statistics > div {
  display: flex;
  height: 100%;
}
.statistics > div .leftColumnContainer .itemList {
  overflow-x: hidden;
}
.statistics > div .leftColumnContainer .itemList .item {
  border-bottom: 1px solid;
  margin-bottom: 0;
  height: 98px;
}
.statistics > div .leftColumnContainer .itemList .item div:first-child p {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  opacity: 0.9;
}
.statistics > div .leftColumnContainer .itemList .item:hover .selectedCategoryIndicator,
.statistics > div .leftColumnContainer .itemList .item.selected .selectedCategoryIndicator {
  margin-left: -15px;
}
.statistics > div .leftColumnContainer .itemList .item:hover .dataHolder,
.statistics > div .leftColumnContainer .itemList .item.selected .dataHolder {
  padding-left: 15px;
}
.statistics > div .leftColumnContainer .itemList .item .selectedCategoryIndicator {
  box-sizing: border-box;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 70px;
  background: white;
  opacity: 0.3;
  transition-duration: 0.2s;
  transition-property: all;
  border-bottom-right-radius: 90px;
  border-top-right-radius: 90px;
  height: 120px;
  margin-left: -70px;
}
.statistics > div .leftColumn {
  /* this is a workaround to quickly solve a bug because we can't set width: 400 for some reason */
  min-width: 300px;
  max-width: 300px;
  margin-right: 30px;
}
.statistics > div .contentConsuming {
  flex-grow: 1;
  background-color: #e8ecf5;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.statistics > div .contentConsuming .bottom-buttons-container {
  z-index: 999;
  text-align: right;
  position: absolute;
  bottom: 10;
  right: 20;
}
.statistics > div .contentConsuming .bottom-buttons-container button {
  display: inline-flex;
  margin-left: 10px;
  border: none;
  width: 40;
  height: 40;
  border-radius: 40px;
  padding: 0;
  background-color: #5186ed;
}
.statistics > div .contentConsuming .bottom-buttons-container button span {
  margin: auto;
}
.statistics > div .contentConsuming.assets-statistic,
.statistics > div .contentConsuming.badges-statistic {
  display: flex;
  flex-direction: column;
}
.statistics > div .contentConsuming.assets-statistic .tabs,
.statistics > div .contentConsuming.badges-statistic .tabs {
  overflow: hidden !important;
  height: 53px !important;
  min-height: 53px !important;
}
.statistics > div .contentConsuming.assets-statistic .details-container,
.statistics > div .contentConsuming.badges-statistic .details-container {
  position: relative;
  text-align: center;
  justify-content: center;
  width: 100%;
}
.statistics > div .contentConsuming.assets-statistic .details-container .header,
.statistics > div .contentConsuming.badges-statistic .details-container .header {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 20;
  margin-right: 20;
}
.statistics > div .contentConsuming.assets-statistic .details-container .header .filter,
.statistics > div .contentConsuming.badges-statistic .details-container .header .filter {
  margin: 0 10;
  width: 25%;
  max-width: 220;
}
.statistics > div .contentConsuming.assets-statistic .details-container .header.badges .filter,
.statistics > div .contentConsuming.badges-statistic .details-container .header.badges .filter {
  width: 20%;
}
.statistics > div .contentConsuming.statistics-container {
  position: relative;
  display: flex;
  flex-direction: column;
}
.statistics > div .contentConsuming.statistics-container .tabs {
  position: relative;
  height: 52px;
  overflow: auto;
}
.statistics > div .contentConsuming.statistics-container .is-group {
  position: absolute;
  display: block;
  right: 10px;
  top: 10px;
}
.statistics > div .contentConsuming.statistics-container .is-group > span {
  position: absolute;
  left: -25px;
  top: 2px;
}
.statistics > div .contentConsuming.statistics-container .activity {
  display: flex;
  vertical-align: middle;
  justify-content: center;
  position: relative;
  overflow: auto;
  height: 100%;
}
.statistics > div .contentConsuming.statistics-container .activity .details-container {
  position: relative;
  padding-top: 50px;
  text-align: center;
  justify-content: center;
  width: 100%;
}
.statistics > div .contentConsuming.statistics-container .activity .details-container .summarize-table {
  width: 100%;
  padding: 20px;
  padding-top: 30px;
  margin: auto;
  max-width: 800px;
}
.statistics > div .contentConsuming.statistics-container .activity .details-container .summarize-table table {
  border-collapse: collapse;
  width: 100%;
  font-size: 13;
}
.statistics > div .contentConsuming.statistics-container .activity .details-container .summarize-table table td,
.statistics > div .contentConsuming.statistics-container .activity .details-container .summarize-table table th {
  border: none;
  text-align: center;
  padding: 8px;
}
.statistics > div .contentConsuming.statistics-container .activity .details-container .summarize-table table td:first-child,
.statistics > div .contentConsuming.statistics-container .activity .details-container .summarize-table table th:first-child {
  text-align: left;
}
.statistics > div .contentConsuming.statistics-container .activity .details-container .summarize-table table td:first-child .fa-circle,
.statistics > div .contentConsuming.statistics-container .activity .details-container .summarize-table table th:first-child .fa-circle {
  margin-right: 5px;
}
.statistics > div .contentConsuming.statistics-container .activity .details-container .summarize-table table th {
  text-transform: capitalize;
}
.statistics > div .contentConsuming.statistics-container .activity .details-container .stacked-chart-wrapper {
  width: 100%;
  overflow: auto;
}
.statistics > div .contentConsuming.statistics-container .activity .details-container .back-button {
  position: absolute;
  left: 0;
  font-size: 20;
  cursor: pointer;
  top: 0;
  padding: 10px;
}
.statistics > div .contentConsuming.statistics-container .activity .details-container h3 {
  font-size: 1.1rem;
}
.statistics > div .contentConsuming.statistics-container .activity .summary-container {
  position: relative;
  padding: 20px;
  padding-top: 50px;
  text-align: center;
  justify-content: center;
  max-width: 830px;
  margin: auto;
}
.statistics > div .contentConsuming.statistics-container .activity .summary-container .item {
  position: relative;
  width: 45%;
  height: 95px;
  background-color: #5186ed;
  overflow: hidden;
  color: #ffffff;
  display: inline-block;
  margin: 10px;
  cursor: pointer;
  min-width: 300px;
  border-radius: 5px;
}
.statistics > div .contentConsuming.statistics-container .activity .summary-container .item:hover {
  background-color: #5186ed !important;
}
.statistics > div .contentConsuming.statistics-container .activity .summary-container .item .name {
  display: block;
  font-size: 20;
  padding-left: 50px;
  padding-top: 10px;
  text-align: left;
}
.statistics > div .contentConsuming.statistics-container .activity .summary-container .item .current {
  position: absolute;
  right: 10;
  top: 10;
  font-size: 20;
}
.statistics > div .contentConsuming.statistics-container .activity .summary-container .item .previous {
  position: absolute;
  right: 10;
  bottom: 10;
  text-transform: capitalize;
}
.statistics > div .contentConsuming.statistics-container .activity .summary-container .item .arrow-up {
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 5px solid #e8ecf5;
  border-width: 95px;
  position: absolute;
  top: 0;
  left: -95px;
  opacity: 0.5;
}
.statistics > div .contentConsuming.statistics-container .activity .summary-container .item .group-snitt {
  position: absolute;
  bottom: 0;
  height: 50px;
  left: 0;
  width: 85px;
  display: flex;
  color: #fff;
}
.statistics > div .contentConsuming.statistics-container .activity .summary-container .item .group-snitt .label {
  position: absolute;
  width: 100%;
  font-size: 9px;
  bottom: 2px;
  text-align: center;
  text-transform: capitalize;
}
.statistics > div .contentConsuming.statistics-container .activity .summary-container .item .group-snitt .number {
  font-size: 20;
  margin: auto;
}
.statistics > div .contentConsuming.statistics-container .assets-statistic .details-container {
  position: relative;
  padding: 10px;
  text-align: center;
  justify-content: center;
  width: 100%;
  height: 100vh;
}
.statistics > div .contentConsuming.statistics-container .assets-statistic .details-container .header {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-left: 20;
  padding-right: 20;
}
.statistics > div .contentConsuming.statistics-container .badges-statistic .details-container {
  position: relative;
  padding: 10px;
  text-align: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.statistics > div .contentConsuming.statistics-container .badges-statistic .details-container .header {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-left: 20;
  padding-right: 20;
}
.statistics > div .contentConsuming.statistics-container .games-statistic-container {
  margin-top: 0;
  height: 100%;
  overflow-x: auto;
}
.statistics > div .contentConsuming.statistics-container .games-statistic-container .filters {
  display: flex;
  width: 100%;
}
.statistics > div .contentConsuming.statistics-container .games-statistic-container .filters .filter {
  margin: auto;
  max-width: 25% !important;
  min-width: 100px;
  padding: 10px;
  padding-top: 0;
}
.statistics > div .contentConsuming.statistics-container .games-statistic-container .chart {
  position: relative;
  width: 100%;
}
.statistics > div .contentConsuming.statistics-container .games-statistic-container .chart .sort-button {
  position: absolute;
  font-size: 20;
  right: 30px;
  top: 0;
  cursor: pointer;
  outline: none;
}
.statistics > div .contentConsuming.statistics-container .games-statistic-container .chart .sort-button.enabled {
  color: darkorange;
}
.statistics > div .contentConsuming .pipeline-statistic-container {
  margin-top: -10px;
  overflow-x: auto;
}
.statistics > div .contentConsuming .pipeline-statistic-container .filters {
  display: flex;
  width: 100%;
}
.statistics > div .contentConsuming .pipeline-statistic-container .filters .filter {
  margin: auto;
  max-width: 30% !important;
  min-width: 200px;
  padding: 10px;
  padding-top: 0;
}
.statistics > div .contentConsuming .pipeline-statistic-container .rct-sidebar-header {
  background-color: transparent;
}
.statistics > div .contentConsuming .pipeline-statistic-container .rct-label-group {
  background-color: #36425A;
  border-left: none;
}
.statistics > div .contentConsuming .pipeline-statistic-container .rct-label.rct-first-of-type {
  border-width: 1px;
}
.statistics > div .contentConsuming .pipeline-statistic-container .react-calendar-timeline {
  margin-bottom: 50px;
}
.statistics > div .contentConsuming .pipeline-statistic-container .react-calendar-timeline .rct-items .rct-item-content {
  font-size: 13px;
}
.statistics > div .contentConsuming .pipeline-statistic-container .react-calendar-timeline .rct-items .rct-item {
  border-right-color: #d9dde8 !important;
}
.statistics > div .contentConsuming .pipeline-statistic-container .react-calendar-timeline .rct-items .rct-item.Cancelled {
  background-color: #bbbbbb;
  border-color: #bbbbbb;
}
.statistics > div .contentConsuming .pipeline-statistic-container .react-calendar-timeline .rct-items .rct-item.Completed {
  background-color: limegreen;
  border-color: limegreen;
}
.statistics > div .contentConsuming .pipeline-statistic-container .react-calendar-timeline .rct-sidebar .rct-sidebar-row {
  font-size: 13px;
  text-align: left;
  padding-left: 10px;
}
.statistics > div .contentConsuming .pipeline-statistic-container .react-calendar-timeline .rct-vertical-lines .rct-vl {
  border-left: none;
  background-color: transparent;
}
.statistics > div .contentConsuming .pipeline-statistic-container .react-calendar-timeline .rct-vertical-lines .rct-vl.rct-day-6 {
  background-color: transparent;
}
.statistics > div .contentConsuming .pipeline-statistic-container .react-calendar-timeline .rct-vertical-lines .rct-vl.rct-day-0 {
  background-color: transparent;
}
.statistics > div .contentConsuming .pipeline-statistic-container .react-calendar-timeline .rct-vertical-lines .rct-vl.rct-vl-first {
  border-left-width: 1px;
}
.statistics > div .contentConsuming .teampulse-container {
  position: relative;
  height: 100%;
  overflow: auto;
  background-color: #e8ecf5;
  width: 100%;
}
.statistics > div .contentConsuming .teampulse-container .tabs-content-container {
  display: flex;
  flex-grow: 1;
}
.statistics > div .contentConsuming .teampulse-container .tabs-content-container > div {
  display: flex;
}
.statistics > div .contentConsuming .teampulse-container .top-left-buttons {
  position: absolute;
  top: 5;
  left: 15;
  display: flex;
  width: 250px;
  height: 35px;
  align-items: center;
  z-index: 99;
}
.statistics > div .contentConsuming .teampulse-container .top-left-buttons > div {
  margin-right: 20;
}
@media (max-width: 1230px) {
  .statistics > div .contentConsuming .teampulse-container .top-left-buttons {
    width: 100px;
  }
  .statistics > div .contentConsuming .teampulse-container .top-left-buttons > div > span {
    display: none;
  }
}
.statistics > div .contentConsuming .teampulse-container .filters {
  height: 60;
  display: flex;
  padding-top: 10;
  justify-content: flex-end;
  padding-right: 10;
}
.statistics > div .contentConsuming .teampulse-container .filters > div {
  width: 150;
}
.statistics > div .contentConsuming .teampulse-container .filters > div span.title {
  margin-left: 13px;
  text-transform: capitalize;
  font-size: 14;
}
.statistics > div .contentConsuming .teampulse-container .filters > div .input-wrapper {
  position: relative;
  width: 90%;
  height: 30;
  margin: 12px;
  margin-right: 0;
  margin-top: 5px;
}
.statistics > div .contentConsuming .teampulse-container .filters > div .input-wrapper input {
  border: 1px solid #ddd;
  font-size: 13;
  color: #778091;
  padding-left: 10;
  width: 100%;
  height: 100%;
  border-radius: 5px;
}
.statistics > div .contentConsuming .teampulse-container .filters > div .input-wrapper .fa {
  font-size: 18px;
  position: absolute;
  right: 5px;
  top: 6px;
  cursor: pointer;
}
.statistics > div .contentConsuming .teampulse-container .filters > div .labelText {
  font-size: 1rem;
}
.statistics > div .contentConsuming .teampulse-container .filters .segments-selector {
  position: relative;
  top: unset;
  right: unset;
}
.statistics > div .contentConsuming .teampulse-container.grid .chart-container {
  min-width: 600;
  max-width: 800;
  flex-grow: 1;
  padding-top: 30;
}
.statistics > div .contentConsuming .teampulse-container.slider div.graph .chart-container {
  min-width: 100%;
  padding-top: 30;
}
.statistics > div .contentConsuming .teampulse-container.slider div.graph .chart-container .slider-wrapper {
  flex-grow: 1;
  display: inline-block;
}
.statistics > div .contentConsuming .teampulse-container.slider div.graph .chart-container .caption {
  text-align: left;
  padding-left: 20;
}
.statistics > div .contentConsuming .teampulse-container.wordcloud {
  width: 100%;
}
.statistics > div .contentConsuming .teampulse-container.wordcloud .chart-container {
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  min-width: 600;
  max-width: 1000;
  padding-top: 30;
}
.statistics > div .contentConsuming .teampulse-container.wordcloud .chart-container .caption {
  width: 100%;
  margin: unset;
  text-align: center;
  display: block;
}
.statistics > div .contentConsuming .teampulse-container .sticky-header {
  position: sticky;
  display: flex;
  padding-top: 10px;
  justify-content: flex-end;
  height: 60px;
  width: 100%;
  top: 0;
  background-color: #e8ecf5;
  z-index: 99;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game {
  padding-left: 20;
  padding-right: 20;
  position: relative;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container {
  margin-top: 20;
  margin-bottom: 50;
  position: relative;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.slider .chart-container {
  min-width: 100%;
  padding-top: 30;
  display: flex;
  flex: 1;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.slider .chart-container .slider-wrapper {
  flex-grow: 1;
  display: inline-block;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.slider .chart-container .caption {
  text-align: left;
  padding-left: 20;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container .buttons {
  position: absolute;
  right: 5;
  width: 55px;
  display: flex;
  justify-content: space-between;
  top: 5;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container .chart-container {
  padding-top: 30;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container .chart-container > div {
  display: inline;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container .caption {
  font-size: 20;
  color: #97add8;
  text-align: left;
  padding-right: 60;
  padding-left: 20;
  padding-bottom: 20;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .chart-container {
  padding-top: 30;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .chart-container > div {
  padding-bottom: 40;
  display: inline-block;
  padding-left: 40;
  padding-right: 40;
  padding-top: 20;
  min-width: 658;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .chart-container > div .caption {
  padding: 0;
  padding-bottom: 20;
  text-align: center;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .grid-wrapper {
  margin: auto;
  position: relative;
  margin-top: 30px;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .grid-wrapper .coordinator {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
  display: flex;
  vertical-align: middle;
  justify-content: center;
  z-index: 9;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .grid-wrapper .coordinator .x-axis {
  width: 100%;
  margin: auto;
  position: relative;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .grid-wrapper .coordinator .x-axis .min {
  transform: rotate(270deg);
  text-align: center;
  position: absolute;
  right: 50%;
  width: 100%;
  margin-right: 20px;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .grid-wrapper .coordinator .x-axis .max {
  transform: rotate(90deg);
  text-align: center;
  position: absolute;
  left: 50%;
  width: 100%;
  margin-left: 20px;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .grid-wrapper .coordinator .y-axis {
  height: 100%;
  margin: auto;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .grid-wrapper .coordinator .y-axis .min {
  text-align: center;
  position: absolute;
  bottom: -20px;
  width: 100%;
  left: 0;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .grid-wrapper .coordinator .y-axis .max {
  text-align: center;
  position: absolute;
  top: -20px;
  width: 100%;
  left: 0;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .grid-wrapper > div.grid {
  width: 100%;
  height: 100%;
  margin: auto;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 9;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game .field-container.grid .grid-wrapper > div.background {
  width: 100%;
  height: 100%;
  margin: auto;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  opacity: 0.04;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game.sharing {
  display: inline-block;
}
.statistics > div .contentConsuming .teampulse-container .custom-reflection-game.sharing .field-container {
  display: inline-block;
  min-width: 100%;
}
.statistics > div .contentConsuming .teampulse-container .segments-selector {
  position: absolute;
  right: 10px;
  top: 55px;
  width: 150px;
  z-index: 99;
}
.statistics > div .contentConsuming .teampulse-container .segments-selector span.title {
  margin-left: 13px;
  text-transform: capitalize;
  font-size: 14;
}
.statistics > div .contentConsuming .teampulse-container .segments-selector select {
  width: 90%;
  height: 30;
  margin: 12px;
  margin-right: 0;
  border: 1px solid #ddd;
  font-size: 13;
  color: #778091;
  margin-top: 5px;
}
.statistics > div .contentConsuming .teampulse-container .segments-selector .labelText {
  font-size: 1rem;
}
.statistics > div .contentConsuming .teampulse-container .questions-selector {
  position: relative;
  width: 250px;
  z-index: 99;
}
.statistics > div .contentConsuming .teampulse-container .questions-selector span.title {
  margin-left: 13px;
  text-transform: capitalize;
  font-size: 14;
}
.statistics > div .contentConsuming .teampulse-container .questions-selector select {
  width: 90%;
  height: 30;
  margin: 12px;
  margin-right: 0;
  border: 1px solid #ddd;
  font-size: 13;
  color: #778091;
  margin-top: 5px;
}
.statistics > div .contentConsuming .teampulse-container .questions-selector .labelText {
  font-size: 1rem;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs .caption {
  font-weight: 600;
  font-size: 20;
  color: #97add8;
  padding-top: 10;
  text-align: center;
  padding-bottom: 20;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.reflections {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.reflections .caption {
  text-align: center;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.reflections .list-texts {
  padding-bottom: 30px;
  padding-left: 20px;
  padding-right: 20px;
  overflow-y: auto;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.reflections .list-texts .fa-quote-left {
  margin-right: 10px;
  font-size: 20px;
  vertical-align: middle;
  color: #97add9;
  opacity: 0.3;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: auto;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph .grid-wrapper {
  margin: auto;
  position: relative;
  margin-top: 40px;
  margin-bottom: 50;
  display: flex;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph .grid-wrapper .coordinator {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
  display: flex;
  vertical-align: middle;
  justify-content: center;
  z-index: 9;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph .grid-wrapper .coordinator .x-axis {
  width: 100%;
  margin: auto;
  position: relative;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph .grid-wrapper .coordinator .x-axis .min {
  transform: rotate(270deg);
  text-align: center;
  position: absolute;
  right: 50%;
  width: 100%;
  margin-right: 20px;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph .grid-wrapper .coordinator .x-axis .max {
  transform: rotate(90deg);
  text-align: center;
  position: absolute;
  left: 50%;
  width: 100%;
  margin-left: 20px;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph .grid-wrapper .coordinator .y-axis {
  height: 100%;
  margin: auto;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph .grid-wrapper .coordinator .y-axis .min {
  text-align: center;
  position: absolute;
  bottom: -30px;
  width: 100%;
  left: 0;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph .grid-wrapper .coordinator .y-axis .max {
  text-align: center;
  position: absolute;
  top: -30px;
  width: 100%;
  left: 0;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph .grid-wrapper > div.grid {
  width: 100%;
  height: 100%;
  margin: auto;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 9;
}
.statistics > div .contentConsuming .teampulse-container .teampulse-tabs div.graph .grid-wrapper > div.background {
  width: 100%;
  height: 100%;
  margin: auto;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  opacity: 0.04;
}
.share-button,
.expand-button {
  display: flex;
  cursor: pointer;
  justify-content: center;
  align-items: center;
}
.share-button.disabled,
.expand-button.disabled {
  cursor: no-drop;
  opacity: 0.5;
}
.share-button .fa,
.expand-button .fa {
  font-size: 20px;
  cursor: pointer;
  color: #888;
}
.share-button > span,
.expand-button > span {
  font-size: 14px;
  font-weight: bold;
  color: #888;
  padding-left: 5px;
}

.wordcloud-container {
  display: flex;
  justify-content: center;
  position: relative;
  overflow-y: hidden;
  overflow-x: hidden;
}
.wordcloud-container .spiner-container {
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  bottom: 0;
}
.wordcloud-container .spiner-container > div {
  margin: auto;
}

.awesome-slider-chart-container {
  position: relative;
  width: 100%;
  padding-bottom: 80px;
}
.awesome-slider-chart-container .toggle-detail {
  position: absolute;
  bottom: 5px;
}
.awesome-slider-chart-container .line {
  width: 100%;
  height: 2px;
  background-color: red;
  margin-top: 50px;
  position: relative;
}
.awesome-slider-chart-container .line .min {
  position: absolute;
  left: 0;
  z-index: 5;
  bottom: -20px;
}
.awesome-slider-chart-container .line .max {
  position: absolute;
  right: 0;
  z-index: 5;
  bottom: -20px;
}
.awesome-slider-chart-container .line .steps {
  position: absolute;
  width: 100%;
  bottom: 0;
}
.awesome-slider-chart-container .line .steps .step {
  position: absolute;
  width: 0;
}
.awesome-slider-chart-container .line .steps .step .bar {
  width: 1px;
  height: 12px;
  margin-top: -7px;
  margin-left: -1px;
  background: #9aaacc;
}
.awesome-slider-chart-container .line .steps .step span {
  margin-left: -4px;
  margin-top: 40px;
  display: block;
}
.awesome-slider-chart-container .line .circle {
  position: absolute;
  width: 0;
}
.awesome-slider-chart-container .line .circle > div {
  position: absolute;
  border-radius: 100px;
  display: flex;
}
.awesome-slider-chart-container .line .circle > div > span {
  margin: auto;
  color: #ffffff;
  font-size: 16;
}
.awesome-slider-chart-container .line .circle.details {
  left: 0%;
  z-index: 12;
}
.awesome-slider-chart-container .line .circle.details > div {
  width: 40px;
  height: 40px;
  background-color: #477bea;
  left: -20px;
  bottom: -21px;
  border: 2px solid #477bea;
}
.awesome-slider-chart-container .line .circle.details > div:hover {
  border: 2px solid #9acf61;
}
.awesome-slider-chart-container .line .circle.average {
  left: 0%;
  z-index: 11;
}
.awesome-slider-chart-container .line .circle.average > div {
  width: 60px;
  height: 60px;
  background-color: #6396ff;
  left: -30px;
  bottom: -31px;
  border: 2px solid #6396ff;
}
.awesome-slider-chart-container .line .circle.average > div:hover {
  border: 2px solid #9acf61;
}
.awesome-slider-chart-container .line .circle.manager {
  left: 0%;
  z-index: 10;
}
.awesome-slider-chart-container .line .circle.manager > div {
  width: 80px;
  height: 80px;
  background-color: #acc5f4;
  left: -40px;
  bottom: -41px;
  border: 2px solid #acc5f4;
}
.awesome-slider-chart-container .line .circle.manager > div:hover {
  border: 2px solid #9acf61;
}

/*
-------------------------------------------------------------------------
    LESS variables
-------------------------------------------------------------------------
*/
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/* -------------------------------------------- */
/*
-------------------------------------------------------------------------
    Login
-------------------------------------------------------------------------
*/
.login-container {
  background-image: url(/0d4745cc50a26287e9aa291c511ab137.png);
  background-repeat: no-repeat;
  background-size: cover;
  font-family: "Helvetica Neue", Helvetica, "open sans", verdana;
  height: 100%;
}
.login-container .login {
  padding-top: 80px;
  width: 100%;
}
.login-container .login form,
.login-container .login .form {
  text-align: center;
  margin-top: 20px;
  width: 320px;
  margin: auto;
  padding: 0 20px;
  box-sizing: border-box;
}
.login-container .login form .text-banner,
.login-container .login .form .text-banner {
  margin-bottom: 40px;
}
.login-container .login form .logo,
.login-container .login .form .logo {
  margin-bottom: 80px;
}
.login-container .login form .logo img,
.login-container .login .form .logo img {
  width: 100%;
}
.login-container .login form > .input-control,
.login-container .login .form > .input-control {
  display: flex;
  flex-direction: row-reverse;
}
.login-container .login form > .input-control i,
.login-container .login .form > .input-control i {
  font-size: 18px;
  color: rgba(255, 255, 255, 0.4);
  display: inline-block;
  width: 16px;
  margin-right: 6px;
  height: 40px;
  line-height: 42px;
  transition-duration: 0.3s;
  transition-property: all;
}
.login-container .login form > .input-control input[type='text'],
.login-container .login .form > .input-control input[type='text'],
.login-container .login form > .input-control input[type='password'],
.login-container .login .form > .input-control input[type='password'] {
  height: 40px;
  border: none;
  background-color: transparent;
  color: #f0f4fc;
  font-size: 17px;
  flex-grow: 1;
}
.login-container .login form > .input-control input[type='text']:focus,
.login-container .login .form > .input-control input[type='text']:focus,
.login-container .login form > .input-control input[type='password']:focus,
.login-container .login .form > .input-control input[type='password']:focus {
  outline: none;
}
.login-container .login form > .input-control input[type='text']:focus + i,
.login-container .login .form > .input-control input[type='text']:focus + i,
.login-container .login form > .input-control input[type='password']:focus + i,
.login-container .login .form > .input-control input[type='password']:focus + i {
  color: white;
  font-size: 20px;
}
.login-container .login form .input-error,
.login-container .login .form .input-error {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 3px;
}
.login-container .login form .input-error span,
.login-container .login .form .input-error span {
  color: #ffc4a9;
  margin-left: 5px;
}
.login-container .login form .input-error i,
.login-container .login .form .input-error i {
  color: #ffc4a9;
}
.login-container .login form hr,
.login-container .login .form hr {
  border: none;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.4);
}
.login-container .login form button[type='submit'],
.login-container .login .form button[type='submit'] {
  background-color: #9acf61;
  width: 100%;
  border: none;
  color: #f0f4fc;
  height: 50px;
  text-transform: uppercase;
  margin-top: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.login-container .login form .loginBtn,
.login-container .login .form .loginBtn {
  background-color: #9acf61 !important;
  width: 100%;
  border: none;
  color: #f0f4fc;
  height: 50px;
  text-transform: uppercase;
  margin-top: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.login-container .login form a,
.login-container .login .form a {
  margin-top: 20px;
  display: inline-block;
  font-size: 11px;
  letter-spacing: 0.5px;
  color: #99bbff;
  padding-bottom: 2px;
}
.login-container .login ::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.4);
  font-size: 14px;
}
.login-container .login ::-moz-placeholder {
  color: rgba(255, 255, 255, 0.4);
  font-size: 14px;
}
.login-container .login :-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.4);
  font-size: 14px;
}
.login-container .login :-moz-placeholder {
  color: rgba(255, 255, 255, 0.4);
  font-size: 14px;
}
.reset-password .fa.fa-unlock-alt {
  font-size: 100px;
  color: #f55e53;
  position: absolute;
  top: -70px;
  right: -30px;
  background: white;
  width: 150px;
  height: 150px;
  border-radius: 150px;
  text-align: center;
  line-height: 150px;
  border: 11px solid #36425A;
}
/*
-------------------------------------------------------------------------
    End of login
-------------------------------------------------------------------------
*/

.set-password {
  background-image: url(/0d4745cc50a26287e9aa291c511ab137.png);
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.set-password .set-password-body {
  display: flex;
  flex-direction: column;
}
.set-password .set-password-body .download-link-container {
  text-align: center;
}
.set-password .set-password-body .download-link-container .download-link {
  padding: 3px 0;
  color: #b2b3b7;
  font-size: 12px;
}
.set-password .set-password-body .download-link-container .download-link a {
  color: #fff;
}
.set-password .central-form {
  width: 300;
  height: 550;
  margin: auto;
  position: relative;
}
.set-password .central-form img {
  display: block;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.set-password .central-form .text-banner {
  margin-bottom: 40px;
}
.set-password .central-form .error-message {
  color: red;
}
.set-password .central-form .inputs-container {
  margin-top: 40px;
}
.set-password .central-form .inputs-container .password-rules-list {
  margin-bottom: 20px;
}
.set-password .central-form .inputs-container .password-rules-list .checked {
  color: #98eb48;
  opacity: 0.8;
}
.set-password .central-form .inputs-container input {
  color: #e6edfd;
  width: 100%;
  height: 48px;
  padding-left: 18px;
  font-size: 16px;
  font-weight: 100px;
  border: 1px solid rgba(255, 255, 255, 0.4);
  background: transparent;
}
.set-password .central-form .inputs-container input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: rgba(255, 255, 255, 0.4);
}
.set-password .central-form .inputs-container input::-moz-placeholder {
  /* Firefox 19+ */
  color: rgba(255, 255, 255, 0.4);
}
.set-password .central-form .inputs-container input:-ms-input-placeholder {
  /* IE 10+ */
  color: rgba(255, 255, 255, 0.4);
}
.set-password .central-form .inputs-container input:-moz-placeholder {
  /* Firefox 18- */
  color: rgba(255, 255, 255, 0.4);
}
.set-password .central-form .indicators {
  margin-top: 10px;
  line-height: 18px;
  font-size: 10px;
  letter-spacing: 0.3px;
  color: #a1bcf8;
}
.set-password .central-form .indicators p {
  transition-property: all;
  transition-duration: 0.2s;
}
.set-password .central-form .indicators p i {
  font-size: 10px;
  opacity: 0;
  transition-delay: 0.1s;
  margin-left: 3px;
}
.set-password .central-form .indicators p span {
  margin-left: 4px;
}
.set-password .central-form .indicators p.valid {
  color: #98eb48;
}
.set-password .central-form .indicators p.valid i {
  opacity: 1;
}
.set-password .central-form button {
  width: 100%;
  height: 50px;
  background: rgba(255, 255, 255, 0.4);
  border-radius: 5px;
  color: #f0f4fc;
  margin-top: 10px;
  n-moz-transition-property: all;
  transition-property: all;
  transition-duration: 0.2s;
}
.set-password .central-form button.enabled {
  background-color: #9acf61;
  border: none;
  text-transform: uppercase;
  cursor: pointer;
}
.set-password .central-form .success-msg,
.set-password .central-form .password-match-msg {
  n-moz-transition-property: all;
  transition-property: all;
  transition-duration: 0.2s;
}