*{
	padding: 0;
	margin: 0;
}

:root {
  --my-toggle-background: #e5e7eb;
  --my-toggle-label-color: #fff;
  --my-toggle-sublabel-color: #d5d5d5;
  --my-toggle-width: 80px;
  --my-toggle-height: calc(var(--my-toggle-width) / 2);
  --my-toggle-gap-size: 4px;
  --my-toggle-text-color: #ffffff;
  --my-toggle-orb-background-color: #ffffff;
  --my-toggle-orb-size: calc(
    var(--my-toggle-height) - (var(--my-toggle-gap-size) * 2)
  );
  --my-toggle-active-background-color: #34d399;
  --my-toggle-inactive-background-color: #f87171;
}

body{

	background-color: #1a1a1c;
	/*color:#d5d5d5;*/
}

hr {
  margin-top: 0.5rem;
  margin-bottom: 1.5rem;
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
hr.dark {
  margin-top: 0.5rem;
  margin-bottom: 1.5rem;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.bg-gradient-primary-login{
	background-color: #f2f3f5;
	background-image: url(../gfx/faceux_bkg.jpg);
	background-position: center center;
	background-size: cover;
}

.bg-gradient-primary-login .card-body{
	border-radius: 100%;
	background-color: #ededed;
}

.bg-gradient-primary{
	background-color: #34d399;
	background-image: url();
}

.login-center{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}

.login-logo img{
	width: 3rem;
}

.login-logo > div{
	font-size: 2.5rem;
	font-weight: bold;
	padding: 10px 15px;
	color: #000;
}

.bg-login-image{
	min-height: 350px;
}

.green-text{
	color: #34d399 !important;
}

.btn-primary{
	background-color: #34d399;
	border-color: #34d399;
	color: #fff;
}

.btn-primary:hover, .btn-primary:focus,
.btn-primary.focus,.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle{
	background-color: #34d399;
	border-color: #34d399;
	box-shadow: none;
}

.sidebar-logo img{
	width: 2rem;
}

.sidebar-logo > div{
	font-size: 1.2rem;
	font-weight: bold;
	padding: 10px 15px;
	color: #000;
}

.sidebar.toggled .sidebar-brand .sidebar-logo{
	flex-direction: column;
}

.sidebar.toggled .sidebar-brand .sidebar-logo  > div{
	font-size: 0.8rem;
	padding: 2px;
}

.sidebar-dark #sidebarToggle::after{
	color: #fff;
}

.customer-name{
	font-size: 11px;
	text-align: center;
	padding-bottom: 1rem;
	color: #fff;
}

.copyright-login{
  position: absolute;
  width: 100%;
  bottom: 10px;
  text-align: center;
  font-size: 0.8rem;
  color: #666;
}

.table{
	/*color: #d5d5d5;*/
}

table.table-custom thead th, table.table-custom tbody td{
	border-bottom: 1px solid #e3e6f0;
	vertical-align: middle;
}

.page-item .page-link, .page-item.disabled .page-link{
	background-color: #717384;
	border-color: #6b6d7d;
}

.page-item .page-link{
	color: #fff;
}

.page-item.disabled .page-link{
	color: rgba(255,255,255,.3);
}

.page-item.active .page-link{
	color: #fff;
	background-color: #4e4f5b;
	border-color: #6b6d7d;
}

td.actions{
	text-align: center;
}

td.actions a{
	margin: 0 2px;
}

td.action-2{
	width: 100px;
}

td.action-3{
	width: 150px;
}

td.order{
	width: 50px;
	text-align: center;
}

td.date{
	width: 150px;
}

.sidebar .sidebar-brand{
	height: auto;
	padding: 1rem;
}
/*
.sidebar .sidebar-brand img{
	width: 90%;

}*/



.list-group-item, .list-group-flush > .list-group-item:last-child{
	border-bottom: 1px solid #fff;
	background-color: transparent;
}

#userDropdown{
	display: block;
	color: #fff;
	text-align: center;
}
#userDropdown img{
	width: 100px;
	height: auto;
	margin:0 auto;
}
#userDropdown > div{
	display: block;

}

div#content:not(.maps){
	padding-top: 24px;
}

div#content.maps, div#content.maps .container-fluid{
	padding: 0;
}

.hide{
	display: none !important;
}

.has-success .form-control {
    border-bottom: 2px solid #168b3f;
}

.has-danger .form-control {
    border-bottom: 2px solid #dc1d34;
}

.form-group .text-help {
    color: #dc1d34;
}
/*
#wrapper #content-wrapper{
	background-color: transparent;
}

.card{
	background-color: #2a2b2e;
	border:none;
}
*/
.nav-tabs.custom{
	position: relative;
	z-index: 1;
	border: none;
}

.nav-tabs.custom .nav-item{
	position: relative;
}

.sidebar-dark .sidebar-heading{
	color: rgba(255, 255, 255, 0.7);
}

.sidebar-dark .nav-item .nav-link, .sidebar-dark .nav-item .nav-link i, .sidebar .sidebar-card p{
	color: #fff;
}

.nav-link.active{
	background-color: rgba(0, 0, 0, 0.05);
}

.sidebar .nav-item .collapse .collapse-inner .collapse-item.active, .sidebar .nav-item .collapsing .collapse-inner .collapse-item.active{
	color: #3a3b45;
	font-weight: normal;
	background-color: #eaecf4;
}

.nav-tabs.custom .nav-link:not(.add-language){
	border-radius: 10px;
	min-width: 100px;
	background-color: #3c4043;
	color: #7b7e89;
	text-align: center;
	border:none;
	margin-right: 10px;
}

.nav-tabs.custom .nav-link.active{
	color: #3c4043;
	background-color: #FFF;
}

.nav-tabs.custom .nav-link.add-language{
	border-radius: 30px;
	min-width: 0;
	padding: 7px 12px;
	margin-top: 1px;
	margin-bottom: 1px;
	margin-left: 10px;
	cursor: pointer;
}

.nav-tabs.custom .delete-language{
	color: #FFF;
	border-radius: 100%;
	text-align: center;
	width: 18px;
	height: 18px;
	position: absolute;
	top:0;
	right: 0;
	transform: translate(0, -50%);
	font-size: 12px;
	background-color: #dc3545;
}

.wrap-delete-file{
	display: flex;
	align-items: center;
}

.delete-file,.delete-file:hover{
	color: #FFF;
	border-radius: 100%;
	text-align: center;
	width: 25px;
	height: 24px;
	margin-left: 10px;
	font-size: 16px;
	line-height: 24px;
	background-color: #dc3545;
	display: inline-block;
}

.dropzone {
	border: 0.0625rem solid #c6ccd6;
	border-radius: 0.5rem;
	background-color: #f9f9fb;
	display: block;
	margin: 40px;
}
.dropzone .dropzone-container {
	padding: 2rem 0;
	width: 100%;
	height: 100%;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color: #8c96a8;
	z-index: 20;
}
.dropzone .dropzone-container .dropzone-title {
	padding-top: 1.5rem;
}
.dropzone .dropzone-container .browse {
	text-decoration: underline;
	color: #007bff;
}
.dropzone .file-input {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	visibility: hidden;
	cursor: pointer;
}

.file-icon {
	/* Need position to allow stacking of pseudo-elements */
	position: relative;
	width: 4rem;
	height: 5.25rem;
	/* Padding for demo purposes */
	padding: 0.625rem;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 500;
	font-size: 2rem;
	color: #007bff;
	/* Second sheet of paper */
}
.file-icon, .file-icon:before, .file-icon:after {
	background-color: #ffffff;
	border-radius: 0.25rem;
	border: 0.125rem solid #b8bec9;
}
.file-icon:before, .file-icon:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	border: 0.125rem solid #ccd0d8;
}
.file-icon:before {
	left: -0.625rem;
	top: 0.5rem;
	z-index: -1;
}
.file-icon:after {
	top: -0.25rem;
	right: -0.25rem;
	left: auto;
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 0.25rem;
	border-width: 0.625rem;
	border-style: solid;
	border-color: #f9f9fb #f9f9fb #b8bec9 #b8bec9;
}

a[href^="http://maps.google.com/maps"]{display:none !important}
a[href^="https://maps.google.com/maps"]{display:none !important}

.gmnoprint a, .gmnoprint span, .gm-style-cc{
    display:none;
}

.gm-style-iw{
	color: #565656;
	font-weight: bold;
	font-family: "Barlow", "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/* The sidebar menu */
.sidebar-right {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: absolute; /* Stay in place */
  z-index: 1; /* Stay on top */
  top: 0;
  right: 0;
  bottom: 0;
  background-color: #fff; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */
}

.sidebar-right.active {
  width: 50%; /* 0 width - change this with JavaScript */
  padding: 10px 30px; /* Place content 60px from the top */
  box-shadow: -3px 0px 2px 1px #f6f6f6;
  border-left: #f6f6f6;
}

/* The sidebar links */
.sidebar-right a {
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidebar-right a:hover {
  color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidebar-right .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 64px;
  margin-left: 50px;
}

/* The button used to open the sidebar */
.openbtn {
  font-size: 20px;
  cursor: pointer;
  background-color: #111;
  color: white;
  border: none;
}

.openbtn:hover {
  background-color: #444;
}

.gm-customcontrol{
	padding: 10px;
	width: 60px;
}

.gm-customcontrol-top{
	padding: 10px;
	height: 60px;
	width: 300px;
}

.gm-customcontrol a{
	height: 40px;
	width: 40px;
	font-size: 21px;
	border-radius: 3px;
	line-height: 40px;
	text-align: center;
	cursor: pointer;
}

.gm-customcontrol-right a{
	display: block;
	margin-bottom: 5px;
}

.gm-customcontrol-top a{
	display: inline-block;
	margin-right: 5px;
}

.gm-customcontrol a.gm-custom-info, .gm-customcontrol-top a.gm-custom-info{
	color: #565656;
	background-color: #ffffff;
}

.gm-customcontrol a.gm-custom-info:hover, .gm-customcontrol-top a.gm-custom-info:hover{
	color: #000;
	background-color: #ebebeb;
}

.gm-customcontrol a.gm-custom-delete,.gm-customcontrol-top a.gm-custom-delete,.gm-customcontrol a.gm-custom-delete:hover,.gm-customcontrol-top a.gm-custom-delete:hover{
	color: #fff;
	background-color: #e02d1b;
	border:1px solid #e02d1b;
}

.list-content{
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: 250px;
	visibility: hidden;
  	opacity: 0;
  	transition: visibility 0s, opacity 0.3s linear;
	z-index: 9999;
	background-color: #2a2b2e;
	padding: 10px;
}

.list-content .lds-ring{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.list-content.active{
	visibility: visible;
	opacity: 1;
}

.list-content #list-areas-close{
	color: #fff;
	padding: 0.2rem 0.4rem;
	font-size: 1rem;
	position: absolute;
	left: 0;
	top: 5px;
	transform: translateX(-99%);
	background-color: #2a2b2e;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

.list-trigger-shape{
	text-overflow: ellipsis;
	overflow: hidden;
}

.list-trigger-shape i{
	margin-right: 5px;
}

.list-trigger-shape i.green{
	color:#1cc88a;
}

.list-trigger-shape i.red{
	color: #c92818;
}

.height-language{
	height: 300px;
	overflow: auto;
}

.card-map {
  box-shadow: 0 1px 2px 0 rgba(0,0,0,.15);
  margin: 20px;
  position: fixed;
  top:10px;
  right: 10px;
  margin-bottom: 50px;
  transition: all .2s ease-in-out;
  width: 300px;
  border-radius: 8px;
  overflow: hidden;
  z-index: 3;
  border: none;
  background-color: #303235;
  color: #fff;
}

.card-map:hover {
  /*box-shadow: 0 5px 22px 0 rgba(0,0,0,.25);*/
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
  margin-bottom: 54px;
}

.card-map.hide{
	display: none;
}

.card-map.show-list {
	right: 275px;
}

.card-map .card-close{
	position: absolute;
	right: 10px;
	top: 10px;
	font-size: 18px;
	line-height: 36px;
	height: 36px;
	width: 36px;
	text-align: center;
	border-radius: 100%;
	color: #fff;
	background-color: #303235;
}

.card-map .image {
  height: 168px;
  overflow: hidden;
  transition: all .2s ease-in-out;
  background-color: #303235;
}

.card-map .text {
  padding: 20px;
  height: 230px;
  overflow: hidden;
}

.card-map .text #card-content {
  margin-bottom: 0px;
}

.card-map .fab {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  position: absolute;
  margin-top: -20px;
  right: 20px;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, .3);
  color: #fff;
  font-size: 24px;
  line-height: 56px;
  text-align: center;
  transform: translateY(-50%);
  -webkit-transition: -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out;
}

.card-map .fab.red {
	background-color: #e02d1b;
}

.card-map .fab:hover {
  cursor: pointer;
}

.card-map .fab.red:hover {
  background: #c92818;
}
.card-map .action {
  padding: 20px;
  display: flex;
  justify-content: center;
}
.card-map .action a{
	margin-right: 5px;
	padding: 5px;
	display: flex;
	font-size: 0.8rem;
	background-color: #303235;
	align-items: center;
}
.card-map .action a i{
	width: 24px;
	padding-right: 4px;
	font-size: 20px;
}

#card-loading {

	min-height: 200px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.lds-ring {
	display: inline-block;
	position: relative;
	width: 80px;
	height: 80px;
}
.lds-ring div {
	box-sizing: border-box;
	display: block;
	position: absolute;
	width: 64px;
	height: 64px;
	margin: 8px;
	border: 8px solid #fff;
	border-radius: 50%;
	animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
	border-color: #fff transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
	animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
	animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
	animation-delay: -0.15s;
}
@keyframes lds-ring {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

#form-content{
	position: fixed;
	z-index: 4;
	width: 55%;
	min-height: 250px;
	top:50%;
	left: 50%;
	transform: translate(-50%,-50%);
	border-radius: 8px;
	background-color: #1a1a1c;
	padding: 0 20px 0 20px;
	height: 85vh;
	overflow: auto;
}

.h3{
	margin-bottom: 15px !important;
}

.h3 .form-cancel, .h3 .form-save{
	margin-left: 5px;
}
.h3 .form-delete{
	background-color: #be2617;
	border-color: #be2617;
	margin-left: 20px;
}


#form-content .h3{
	position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
	background-color: #1a1a1c;
	padding-top: 20px;
	padding-bottom: 20px;
	margin-bottom: 0;
	z-index: 999;
}

#form-content-nofixed{
	border-radius: 8px;
	background-color: #1a1a1c;
	min-height: 250px;
	position: relative;
}

#form-content-loading {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}

#form-content-info h1 .btn.float-md-right{
	margin-left: 10px;
}

.daterangepicker{
	color: #000;
}

/******** GRAFANA ************/

iframe body.app-grafana{
	background: transparent !important;
}

.map-dashboard{
	height: 450px;
	width: 100%;
	position: relative;
	margin-bottom: 50px;
}

.noinfo{
	position: absolute;
	top:50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.width-100{
	width: 100%;
}

my-toggle-group {
	float: right;
	display: flex;
	align-items: center;
}
my-toggle-group my-toggle {
  background: var(--my-toggle-background);
  width: var(--my-toggle-width);
  height: var(--my-toggle-height);
  border-radius: var(--my-toggle-height);
  display: inline-block;
  overflow: hidden;
  position: relative;
}
my-toggle-group my-toggle my-toggle-text {
  width: calc(var(--my-toggle-width) / 2);
  position: absolute;
  height: var(--my-toggle-height);
  font-size: 1.2rem;
  color: var(--my-toggle-text-color);
  top: 0;
  display: flex;
  line-height: var(--my-toggle-orb-size);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  left: var(--my-toggle-gap-size);
  font-weight: 500;
}
my-toggle-group my-toggle my-toggle-text:nth-child(2) {
  left: calc(50% - var(--my-toggle-gap-size));
  right: var(--my-toggle-gap-size);
}
my-toggle-group my-toggle my-toggle-orb {
  width: var(--my-toggle-orb-size);
  height: var(--my-toggle-orb-size);
  display: block;
  border-radius: var(--my-toggle-orb-size);
  top: var(--my-toggle-gap-size);
  right: var(--my-toggle-gap-size);
  transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1);
  position: absolute;
  background: var(--my-toggle-orb-background-color);
  z-index: 2;
  pointer-events: none;
}
my-toggle-group my-toggle input[type=checkbox] {
  height: var(--my-toggle-width);
  width: var(--my-toggle-width);
  margin: 0;
  background: var(--my-toggle-inactive-background-color);
  position: relative;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
my-toggle-group my-toggle input[type=checkbox]:checked {
  background: var(--my-toggle-active-background-color);
}
my-toggle-group my-toggle input[type=checkbox]:checked ~ my-toggle-orb {
  transform: translateX(calc( -1 * (calc(var(--my-toggle-width) - var(--my-toggle-orb-size))) + calc(var( --my-toggle-gap-size ) * 2) ));
}
my-toggle-group label {
  padding-left: 1.5em;
  font-weight: 500;
  color: var(--my-toggle-label-color);
  font-size: 1.125rem;
  flex: 1;
}
my-toggle-group label small {
  margin-top: 0.5em;
  display: block;
  font-weight: 400;
  font-size: 0.875rem;
  color: var(--my-toggle-sublabel-color);
}

.controls {
	padding: 1rem;
}

.controls i {
	font-size: 2rem;
	margin-right: 10px;
	cursor: pointer;
}

#filter{
	width:100%;
	padding:0 30px;
	background-color:white;
	height:60px;
	overflow:hidden;
	transition: height 0.5s;
	margin-bottom: 24px;
}

#filterclick{
	height: 70px;
	display: flex;
	align-items: center;
	cursor: pointer;
}
#filterclick span{
	flex-grow: 100;
}
#filterclick i{
	flex-grow: 1;
}

.mb-dashboard{
	margin-bottom: 24px;
}

#chart-faces{
	background-color: #fff;
	font-size: 2.2rem;
}

#chart-faces img{
	padding: 5%;
	width: 90%;
	height: auto;
}

#chart-faces div{
	text-align: center;
}

#chart-global{
	background-color: #fff;
}

#chart-global div{
	text-align: center;
}

#chart-global div span:first-child{
	font-size: 1.6rem;
	display: block;
}

#chart-global div span:last-child{
	font-size: 5rem;
	color:#34d399
}

.elements-list{
	height: 665px;
	overflow: auto;
}

.elements-card {
	display: flex;
	flex-direction: column;
	padding: 10px;
	cursor: pointer;
}

.elements-card img{
	margin: 5px auto;
	width: 1.5rem;
}

.elements-card span{
	font-size: : 0.6rem;
	text-align: center;
}

/* CSS from the cool website: http://cssarrowplease.com/ */

.tooltip-draw2d {
	position: absolute;
	background: #34d399;
	color: #FFF;
	border: 2px solid #b2efd9;
	padding:2px 10px;
}

.tooltip-draw2d:after,.tooltip-draw2d:before {
	bottom: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.tooltip-draw2d:after {
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #34d399;
	border-width: 7px;
	left: 50%;
	margin-left: -8px;
}

.tooltip-draw2d:before {
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: #b2efd9;
	border-width: 10px;
	left: 50%;
	margin-left: -11px;
}

.loading-data{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 99999;
	color: #fff;
	font-size: 3rem;
	background-color: rgba(0,0,0,0.8);
	display: flex;
	justify-content: center;
	align-items: center;
}

.myChart{
	width: 100%;
}

.poll-questions{

}

.question-item{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	margin-top: 2rem;
}

.question-item *{
	margin: 5px;
}

.question-item div{
	width: 100%;
}

.question-item input,.question-item textarea{
	width: 100%;
	display: block;
	border-radius: 5px;
}

.question-item i.fa-grip-vertical{
	font-size: 1.4rem;
	cursor: move;
}

.question-add-container{
	line-height: 2.7rem;
	font-size: 1.2rem;
	border-bottom: 1px solid #e6e6e6;
}

.question-item i.question-delete, .question-add{
	padding: 9px;
	border-radius: 5px;
	font-size: 1.4rem;
	cursor: pointer;
	margin-right: 0;
}

.question-result{
	display: flex;
	flex-direction: column;

}

.question-result .question-result-item{
	display: flex;
	flex-direction: column;
	margin-bottom: 5px;
	border:1px solid #d7d8dc;
	border-radius: 5px;
	padding: 10px;
	margin-bottom: 20px;
}

.question-result .question-result-item .question_order{
	text-align: left;
	background-color: #34d399;
	border-radius: 100%;
	color: #fff;
	font-size: 1.5rem;
	font-weight: bold;
	display: inline-block;
	width: 2rem;
	line-height: 2rem;
	text-align: center;
}

.question-result .question-result-item .question_name{
	line-height: 2rem;
	display: inline-block;
	font-size: 1.5rem;
}

.question-result .question-result-item .question_description{
	margin-top: 1rem;
}

.question-result .question-result-item .question_result{
	display: flex;
	flex-direction: column;
	width: 100%;
	justify-content: center;
}

.question-result .question-result-item .question_result > div{
	position: relative;
	margin-top: 4px;
	line-height: 2.5rem;
	background-color: #f6f6f6;
	border-radius: 4px;
}

.question-result .question-result-item .question_result > div i{
	padding-left: 12px;
	font-size: 1.5rem;
	padding-right: 12px;
	position: relative;
	z-index: 0;
	vertical-align: middle;
}

.question-result .question-result-item .question_result > div .question_result_bar{
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	z-index: 0;
	border-radius: 4px;
	background-color: #cfd9de;
}

.question-result .question-result-item .question_result > div .question_result_percent{
	position: absolute;
	right: 12px;
	top: 0;
	z-index: 0;
	font-weight: bold;
}

.question-result .question-result-item .question_result > div.active{
	color: #3d3d46;
}

.question-result .question-result-item .question_result > div.active .question_result_bar{
	background-color: #73e1b9
}

/*
.question-result .question-result-item .question_result div{
	display: grid;
	margin: 1rem;
}

.question-result .question-result-item .question_result div i{
	grid-column: 1;
	grid-row: 1;
	font-size: 5rem;
	overflow: hidden;
}*/
/*
.result-sad{
	color: #ff0000;
}
.result-neutral{
	color: #fc9403;
}
.result-happy{
	color: #34d399;
}
.result-surprised{
	color: #346fd3;
}*/

.wave {
	display: inline-block;
	border: 5px solid transparent;
	border-top-color: currentColor;
	border-radius: 50%;
	border-style: solid;
	margin: 4px;
}

.waveStrength-0 .wv4.wave,
.waveStrength-0 .wv3.wave,
.waveStrength-0 .wv2.wave,
.waveStrength-0 .wv1.wave {
	border-top-color: #eee;
}

.waveStrength-3 .wv4.wave,
.waveStrength-2 .wv4.wave,
.waveStrength-2 .wv3.wave,
.waveStrength-1 .wv4.wave,
.waveStrength-1 .wv3.wave,
.waveStrength-1 .wv2.wave {
	border-top-color: #eee;
}