/* ============================================================================================================================= */
/* ===================================================================================== FORMULARIOS =========================== */
/* ============================================================================================================================= */
.b_over_form{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}
.label_form_area{
  background-color: #89919A;
  color: rgba(0,0,0,0.8);
  font-weight: bold;
  margin-bottom: 12px;
  padding:5px 8px 3px 8px;
  font-size: 16px;
  line-height: 18px;
  font-family: 'Roboto Condensed','Lato',Tahoma,Geneva,sans-serif;
}

/* ------------------------ */
.formCell{padding:12px 12px;}

/*Resetear estilos navegador */
*:focus{outline:none; box-shadow:none;}
:invalid {box-shadow: none;}
:-moz-submit-invalid {box-shadow: none;}
:-moz-ui-invalid {box-shadow:none;}

::placeholder{font-style:italic; color:#696974;}
::-webkit-input-placeholder{font-style:italic; color:#696974;} /* WebKit */
::-moz-placeholder{font-style:italic; color:#696974;} /* Firefox 19+ */

/* Esto oculta el fondo amarillento y fuerza a que se vea el campo limpio si el navegador intenta autocompletarlo */
input:-webkit-autofill {
  background-color: white !important;
  -webkit-box-shadow: 0 0 0px 1000px white inset !important;
  color: #000 !important;
}

/* ------------------------------------------------------ Estilos generales básicos ----------- */
option[value=""][disabled]{color:#9999a4 !important; /*display:none;*/}
label{font-size:15px; line-height:19px; /*height:32px;*/ display:inline-block; /*padding-top:4px;*/}
input[type="checkbox"]{margin:0px 5px 0px 0px;}
.labelmin{font-size:14px; line-height:17px;}
input[type="radio"]{margin:0px 5px;}
fieldset{margin:0; padding:0; /*border:1px solid #c0c0cb;*/ overflow:hidden; position:relative; padding-top:32px; background-color:var(--base-1); color:black;}
legend{
	font-family: 'Roboto Condensed','Lato',Tahoma,Geneva,sans-serif;
	font-size: 17px;
	line-height: 19px;
	padding: 7px 12px 7px 12px;
	background-color:var(--base-8);
	width: 100%;
	position: absolute;
	top: 0;
	color: white;
}
.legend{
	font-family: 'Roboto Condensed','Lato',Tahoma,Geneva,sans-serif;
	font-size: 17px;
	line-height: 19px;
	padding: 7px 12px 7px 12px;
	background-color:var(--base-8);
	color: white;
}
.sublegend{
	font-size: 14px;
	line-height: 17px;
	color: #3E466B;
	padding: 8px 16px;
	text-align: left;
	/*background-color: #c5d1e2;*/
	background-color: #d4e0f1;
}

/* ------------------------- */
/*.border{border:1px solid #cfd8dc;}*/
.deactivated{pointer-events:none;}
.marked_complete{/*border-color:#7ab228 !important;*/ border-color:#66a6c9 !important;}
.marked_error{border-color:#e32424 !important; border-width:2px !important;}


/* ------------------------------------------------------ Elementos de edición ---------------------- */
.edit_elem_tools{
	position:absolute;
	right:9px;
	top:6px;
	line-height:0;
}
.selected_element{background-color:#1f70a7 !important;}

/* ------------------------------------------------------ Títulos Section, Panel, Area, Field ---------------------- */
.titlePanel{
	font-size: 19px;
	line-height: 21px;
	margin-bottom: 24px;
	color:#000;
	pointer-events: none;
	font-weight:bold;
	font-family:'Roboto Condensed','Lato',Tahoma,Geneva,sans-serif;
}

/* ------------------------------------------------------ Títulos campos ---------------------- */
.titleField{/*display:none;*/ font-size:15px; line-height:17px; color:#61b10f; /*position:absolute;*/
	pointer-events:none; margin-top:-17px; opacity:0;
	-webkit-transition: top 200ms linear, opacity 200ms linear, margin-top 200ms linear;
	-ms-transition: top 200ms linear, opacity 200ms linear, margin-top 200ms linear;
	transition: top 200ms linear, opacity 200ms linear, margin-top 200ms linear;
}
.titleField.fixed{margin-top:0 !important; opacity:1 !important;}

.titleFieldView{
	font-size: 17px;
	line-height: 19px;
	margin-bottom: 3px;
	color:#000;
	pointer-events: none;
	font-weight:bold;
	font-family:'Roboto Condensed','Lato',Tahoma,Geneva,sans-serif;
}
.textFieldView{
	font-size: 15px;
	color: #37474f;
}

.titleField-1{font-size:16px; line-height:17px; margin-bottom:3px; font-weight:bold;}
.titleField-2{
	font-size: 17px;
	line-height: 19px;
	color:#000;
	margin-bottom: 3px;
	font-weight:bold;
	font-family:'Roboto Condensed','Lato',Tahoma,Geneva,sans-serif;
}
.titleField-3 {
	font-size: 15px;
	line-height: 16px;
	color: #000;
	margin-bottom: 2px;
	font-weight: bold;
	font-family: 'Roboto Condensed','Lato',Tahoma,Geneva,sans-serif;
	display: inline-block;
}
.titleField-1.animated, .titleField-2.animated{
	pointer-events:none; margin-top:-17px; opacity:0;
	-webkit-transition: top 200ms linear, opacity 200ms linear, margin-top 200ms linear;
	-ms-transition: top 200ms linear, opacity 200ms linear, margin-top 200ms linear;
	transition: top 200ms linear, opacity 200ms linear, margin-top 200ms linear;
}
.titleControl{display:inline-block; font-size:14px; line-height:15px;}
.titleField-mini{
	color: #545C65;
	font-size: 11px;
	line-height: 12px;
	margin-bottom: 4px;
}
.subTitleField{
	/*margin-top: -3px;*/
	padding-left: 1px;
	margin-bottom: 10px;
	font-size: 14px;
	line-height: 16px;
	color: #37474f;
}
.textFieldExplanation{
	text-align: left;
	font-size: 14px;
	line-height: 16px;
	color: #7f8691;
	margin-top:6px;
}

/* --------------------------------------------------------- Send ------------------- */
.send_button{
	display: inline-block;
	width: 28px;
	height: 28px;
	position: absolute;
	right: 10px;
	bottom: 12px;
	background-image: url('icn/send.svg');
	background-size: 70%;
	background-repeat: no-repeat;
	background-position: center center;
}
.send_button:hover{
	background-color:#969DA5;
}
/* --------------------------------------------------------- Selector search advaned ------------------- */
.search_button{
	display: inline-block;
	width:22px;
	height:22px;
	position: absolute;
	right:10px;
	top:5px;
	background-image: url('icn/search-green.svg');
	background-size:contain;
	background-repeat: no-repeat;
	background-position: center center;
}
.selector_search_option{
	/*background-color:rgba(0,0,0,0.15);*/
	background-color:white;
	padding:5px 12px;
	margin-bottom:1px;
	width:100%;
}
.selector_search_option:hover{
	/*background-color:#7f9c6b;*/
	background-color: rgba(255, 255, 255, 0.7);
	padding-left:15px;
	/*margin-left:4px;*/
}
.selector_search_option:active{
	background-color:#689f38;
	opacity:0.8;
}
.selector_search_option.mark{
	pointer-events:none;
	background-color:#689f38;
	color:white;
	font-weight:bold;
}

/* --------------------------------------------------------- Estilos campos (Box) ---------------------- */
input.box{
	box-sizing:border-box;
	font-size:16px;
	line-height:19px;
	padding:8px 12px;
	margin:0;
	width:100%;
	border:1px solid #B2BAC3;
	background-color:white;
	font-family:var(--font_body);
}
input.box.min{
	font-size: 15px;
  	line-height: 17px;
  	padding: 6px 12px;
}
input.box.big{
	font-size: 17px;
    line-height: 20px;
    padding: 9px 14px;
}
input.box.max{
	font-size:18px;
	line-height:20px;
	padding:10px 14px;
}


textarea.box{resize:vertical; min-height:92px; border:1px solid #B2BAC3; margin:0; padding: 6px 10px; width:100%; font-size:16px; line-height:19px;
	font-family: 'Lato', Tahoma, Geneva, sans-serif;
	font: 'Lato', Tahoma, Geneva, sans-serif;}
select.box{
	/*
	-webkit-border-radius: 5px 0 0 5px;
	-moz-border-radius: 5px 0 0 5px;
	border-radius: 5px 0 0 5px;
	*/
	/*height: 32px;*/
	font-size: 16px;
	line-height: 19px;
	border: 1px solid #B2BAC3;
	background-color: white;
	padding: 6px 10px;
	font-family: 'Lato', Tahoma, Geneva, sans-serif;
	font:'Lato', Tahoma, Geneva, sans-serif;
}
select.box option{/*min-height:32px; padding:7px 0px;*/ /*padding:7px 10px;*/ padding:5px 10px;}
select.box optgroup{
 	background:#222931;
    color:#fff;
    }
select.box[multiple]{padding:7px 0px;}
select.transparent_dark, select.transparent_light{
	background:none;
	color:inherit;
	padding:5px;
	font-size:inherit;
}
select.transparent_dark option{min-height:32px; background-color:#222931;}
select.transparent_light option{min-height:32px; background-color:#e2e6ec;}

/* --------------------------------------------------------- Estilos campos (Sub) ---------------------- */
.sub{
	width:100%;
	font-size:16px;
	line-height:19px;
	margin:0;
	padding:8px 12px;
	padding-top:3px;
	/*min-height:30px;*/
	background-color:transparent;
	font-family: 'Lato', Tahoma, Geneva, sans-serif;
	font: 'Lato', Tahoma, Geneva, sans-serif;
	border-top:none;
	border-left:none;
	border-right:none;
}
/* #72ae30 cambiado por #8e24aa */
.sub:optional{border-bottom:1px dotted #9999a4;}
.sub:required {border-bottom:1px solid #9999a4;}
.sub:focus:valid{border-color:var(--color2-6); border-width:2px;}
.sub:focus:invalid{border-bottom-color:#e32424; border-width:2px;}

textarea.sub{resize:vertical; min-height:80px; font-size:16px; line-height:19px; font-family: 'Lato', Tahoma, Geneva, sans-serif;	font: 'Lato', Tahoma, Geneva, sans-serif;}

select.sub{padding-left:4px !important; height:31px; font-family: 'Lato', Tahoma, Geneva, sans-serif; font: 'Lato', Tahoma, Geneva, sans-serif;}
select.sub:focus:valid{border-bottom:1px dotted #9999a4;}


/* ============================================================= CAMPOS MÚLTIPLES =========================== */
.fc{padding:5px 5px 20px 5px;}
.fcdetail{padding-right:5px;}
.fctool{padding:0px 5px;}
/* -------------------------- */
.fc_more{padding:5px 5px 20px 5px;}
.fc_line:last-child .b_del{margin-bottom:20px;}

.b_add{color:#7cb342; fill:#7cb342;}
.b_add:hover{color:#abda9f; fill:#abda9f;}
.b_add:active{color:#70707d; fill:#70707d;}

.b_del{
	background-image:url('icn/delete-red.svg');
	width:17px;
	height:19px;
	background-size:contain;
	background-repeat:no-repeat;
	vertical-align:middle;
	display:inline-block;
}
.b_del:hover{color:#e32424; fill:#e32424;}
.b_del:active{color:#70707d; fill:#70707d;}

/* ============================================================= BOTÓN CHAT ====================================== */
.b_chat{	
	width:27px;
	height:26px;
	background-size: contain;
	background-repeat: no-repeat;
	display: inline-block;
	padding-bottom:8px;
	text-align:center;

	font-size:13px;
	line-height:13px;
	margin-bottom:-4px;
}
.b_chat:hover{opacity:0.6;}

.b_chat.readed{
	color:#ececf3;
	background-image:url('icn/chat_readed.svg');
}
.b_chat.new{
	color:white;
	font-weight:bold;
	background-image:url('icn/chat_new.svg');
}
.b_chat.empty{
	color:white;
	background-image:url('icn/chat_empty.svg');
}

/* ------------------------------------------------------ CK Editor------------- */
.ck-content{padding:12px 14px !important;}

/* ============================================================= LISTADO ====================================== */
.select_listado{
	border:1px solid #B2BAC3;
	background-color:white;
	overflow-y: auto;
}.select_listado::-webkit-scrollbar {
    -webkit-appearance: none;
}.select_listado::-webkit-scrollbar:vertical {
    width: 10px;
}.select_listado::-webkit-scrollbar:horizontal {
    height: 10px;
}.select_listado::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .5);
    border-radius: 10px;
    border: 2px solid #ffffff;
}.select_listado::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #ffffff;
}
.select_listado_option{
	padding:3px 5px;
	cursor:pointer;
	word-break: break-word;
}
.select_listado_option.mark{
	background-color: #4E7BA8;
	color: white;
}

/* ============================================================= COMBO ====================================== */
.newCombo{position:relative;/*font-size:13px; line-height:17px;*/ display:block;}    
.newCombo em{
	cursor: pointer;
	border-left:1px dotted #9999a4;
	padding:8px 0px 8px 3px;
    display:inline-block;
	align-self: center;
	line-height:0;
	fill:#9999a4;
}
.newCombo em:hover{border-left:1px solid #8e24aa; fill:#8e24aa;}
.newCombo em:active{border-left:1px solid #41414e; fill:#41414e;}

.newCombo svg {
	width: 19px !important;
	fill: inherit !important;
}
/* -------------------------- Combo List --------------- */
.newComboList{
	position: absolute;
    z-index:1700;
	margin-top:-1px;	
	max-height:0px; min-width:170px;
	/*height:0px;*/
	width:100%;
	overflow-y:hidden;
	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
}

.newCombo ul{background-color:#fff; display:block; overflow-x:hidden; overflow-y:auto; margin:0px; padding:0px; border:none;}
.newCombo li{
	list-style-type:none;
	color:#000;
	border-top:1px solid #c5c5ce;
	cursor:pointer;
	text-align:left;
	white-space:nowrap;
	padding:4px 8px;	
	font-size:14px;
	/*
	line-height:1.6;
	min-height:32px;*/
}
.newCombo li:hover{background-color:#eee5d9; color:#000; padding-left:14px; /*border-left:4px solid #b87b2d;*/}
.newCombo li:first-child{border-top:none;}

/*
@media all and (max-width:768px) {
    .newCombo li{padding:11px 10px;}
	.sub{padding:10px 10px;}
}*/

/* -------------------------------- */
.newCombo combo{color:#fff; fill:#fff;}
.newCombo combo:hover{color:#a1e2ff; fill:#a1e2ff;}
.newCombo combo:active{color:#333; fill:#333;}


/* -------------------------- Combo Header --------------- */
.newComboHeader{min-height:2px; background-color:#b87b2d; color:#fff; padding:4px 10px 6px 10px; font-size:12px; text-align:center;}
.newComboHeaderSlim{min-height:2px; background-color:#b87b2d;}
/* ----------------------- Combo Footer ------------ */
.newComboFooter{min-height:3px; background-color:#b87b2d; color:#fff; padding:4px 10px 6px 10px; font-size:12px; text-align:center;}
.newComboFooterSlim{min-height:4px; background-color:#b87b2d;}



/* ============================================================= SWITCH ====================================== */
.switch{
	height:20px;
	width:40px;
	padding:2px;
	-webkit-border-radius:100px;
	-moz-border-radius:100px;
	border-radius:100px;
	cursor:pointer;
	display: inline-block;
	vertical-align: bottom;
}

.switch.on{
	/*background-color:#2e7d32;*/
	background-color:#689f38;
}
.switch.off{
	/*background-color:#c62828;*/
	background-color:#8192A6;
}

.handle{	
	width:16px;
	height:16px;
	background-color:white;
	-webkit-border-radius:100px;
	-moz-border-radius:100px;
	border-radius:100px;

	-webkit-transition: margin-left 200ms linear;
	-ms-transition: margin-left 200ms linear;
	transition: margin-left 200ms linear;
}
.switch.on .handle{
	margin-left:20px;
}

/* ============================================================================================================================= */
/* ===================================================================================== IMAGE EDITION ========================= */
/* ============================================================================================================================= */
.image-edition{
	background-image:url('no-image.png');
	background-repeat:no-repeat;
	background-position:center center;
	background-color:white;
	
	line-height:0;
	overflow:hidden;
	border:1px solid #c0c0cb;
	min-height:145px;
	padding:12px;
	position:relative;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
}
.image-edition img{width:100%; height:100%; object-fit:cover;}
.image-edition button{position:absolute; left:24px; top:24px;}

.btn_box.images{
	background-image:url('icn/image-photo-white.svg');
	background-repeat: no-repeat;
	background-size:22px auto;
	background-position:center center;
	min-width:32px;
	min-height:32px;
}


/* ============================================================================================================================= */
/* ===================================================================================== MATERIALIZE =========================== */
/* ============================================================================================================================= */

/* ----------------------------------------------------------------- SLIDER / RANGE
/* Functional styling;
 * These styles are required for noUiSlider to function.
 * You don't need to change these rules to apply your design.
 */
.noUi-target,
.noUi-target * {
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-user-select: none;
  -ms-touch-action: none;
  touch-action: none;
  -ms-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.noUi-target {
  position: relative;
}
.noUi-base,
.noUi-connects {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
}
/* Wrapper for all connect elements.
 */
.noUi-connects {
  overflow: hidden;
  z-index: 0;
}
.noUi-connect,
.noUi-origin {
  will-change: transform;
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  height: 100%;
  width: 100%;
  -ms-transform-origin: 0 0;
  -webkit-transform-origin: 0 0;
  -webkit-transform-style: preserve-3d;
  transform-origin: 0 0;
  transform-style: flat;
}
/* Offset direction
 */
.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin {
  left: 0;
  right: auto;
}
/* Give origins 0 height/width so they don't interfere with clicking the
 * connect elements.
 */
.noUi-vertical .noUi-origin {
  top: -100%;
  width: 0;
}
.noUi-horizontal .noUi-origin {
  height: 0;
}
.noUi-handle {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  position: absolute;
}
.noUi-touch-area {
  height: 100%;
  width: 100%;
}
.noUi-state-tap .noUi-connect,
.noUi-state-tap .noUi-origin {
  -webkit-transition: transform 0.3s;
  transition: transform 0.3s;
}
.noUi-state-drag * {
  cursor: inherit !important;
}
/* Slider size and handle placement;
 */
.noUi-horizontal {
  height: 18px;
}
.noUi-horizontal .noUi-handle {
  width: 28px;
  height: 18px;
  right: -14px;
  top: -6px;
}
.noUi-vertical {
  width: 18px;
}
.noUi-vertical .noUi-handle {
  width: 18px;
	height: 28px;
	right: -6px;
	bottom: -14px;
}
.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle {
  left: -17px;
  right: auto;
}
/* Styling;
 * Giving the connect element a border radius causes issues with using transform: scale
 */
.noUi-target {
  /*background: #FAFAFA;*/
  border-radius: 4px;
  /*border: 1px solid #D3D3D3;
  box-shadow: inset 0 1px 1px #F0F0F0, 0 3px 6px -5px #BBB;*/
}
.noUi-connects {
  border-radius: 3px;
  background-color: #333b44;
}
.noUi-connect {
  background: #3FB8AF;
}
/* Handles and cursors;
 */
.noUi-draggable {
  cursor: ew-resize;
}
.noUi-vertical .noUi-draggable {
  cursor: ns-resize;
}
.noUi-handle {
	border: 1px solid #D9D9D9;
	border-radius: 3px;
	background: #415266;
	cursor: default;
	box-shadow: inset 0 0 1px #415266, inset 0 1px 7px #2D3E52, 0 3px 6px -3px #394A5E;
}
.noUi-active {
  /*box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB;*/
}
/* Handle stripes;
 */
.noUi-handle:before,
.noUi-handle:after {
  content: "";
  display: block;
  position: absolute;
  height: 11px;
  width: 1px;
  background: #E8E7E6;
  left: 11px;
  top: 3px;
}
.noUi-handle:after {
  left: 14px;
}
.noUi-vertical .noUi-handle:before,
.noUi-vertical .noUi-handle:after {
  width: 10px;
	height: 1px;
	left: 3px;
	top: 11px;
}
.noUi-vertical .noUi-handle:after {
  top: 14px;
}
/* Disabled state;
 */
[disabled] .noUi-connect {
  background: #B8B8B8;
}
[disabled].noUi-target,
[disabled].noUi-handle,
[disabled] .noUi-handle {
  cursor: not-allowed;
}
/* Base;
 *
 */
.noUi-pips,
.noUi-pips * {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.noUi-pips {
  position: absolute;
  color: #485960;
}
/* Values;
 *
 */
.noUi-value {
  position: absolute;
  white-space: nowrap;
  text-align: center;
  /*Mio*/
  font-size: 12px;
  line-height: 12px;
}
.noUi-value-sub {
  color: #ccc;
  font-size: 10px;
}
/* Markings;
 *
 */
.noUi-marker {
  position: absolute;
  background: #CCC;
}
.noUi-marker-sub {
  background: #718289;
}
.noUi-marker-large {
  background: #718289;
}
/* Horizontal layout;
 *
 */
.noUi-pips-horizontal {
  padding: 10px 0;
  height: 80px;
  top: 100%;
  left: 0;
  width: 100%;
}
.noUi-value-horizontal {
  -webkit-transform: translate(-50%, 50%);
  transform: translate(-50%, 50%);
}
.noUi-rtl .noUi-value-horizontal {
  -webkit-transform: translate(50%, 50%);
  transform: translate(50%, 50%);
}
.noUi-marker-horizontal.noUi-marker {
  margin-left: -1px;
  width: 2px;
  height: 5px;
}
.noUi-marker-horizontal.noUi-marker-sub {
  height: 10px;
}
.noUi-marker-horizontal.noUi-marker-large {
  height: 15px;
}
/* Vertical layout;
 *
 */
.noUi-pips-vertical {
  padding: 0 10px;
  height: 100%;
  top: 0;
  left: 100%;
}
.noUi-value-vertical {
  -webkit-transform: translate(0, -60%);
  transform: translate(0, -60%);
  padding-left: 16px;
}
/* ---- */
.noUi-vertical-left .noUi-pips-vertical {
	padding: 0 10px;
	height: 100%;
	top: 0;
	left: -30px;
}
.noUi-vertical-left .noUi-value-vertical {
  -webkit-transform: translate(0, -60%);
  transform: translate(0, -60%);
  right:0;
  padding-right:16px;
}
/* ---- */
.noUi-rtl .noUi-value-vertical {
  -webkit-transform: translate(0, 50%);
  transform: translate(0, 50%);
}
.noUi-marker-vertical.noUi-marker {
  width: 5px;
  height: 2px;
  margin-top: -1px;
}
.noUi-marker-vertical.noUi-marker-sub {
  width: 6px;
}
.noUi-marker-vertical.noUi-marker-large {
  width: 10px;
}
.noUi-tooltip {
  display: block;
  position: absolute;
  border: 1px solid #D9D9D9;
  border-radius: 3px;
  background: #fff;
  color: #000;
  padding: 5px;
  text-align: center;
  white-space: nowrap;
}
.noUi-horizontal .noUi-tooltip {
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  left: 50%;
  bottom: 120%;
}
.noUi-vertical .noUi-tooltip {
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  top: 50%;
  right: 120%;
}
.noUi-horizontal .noUi-origin > .noUi-tooltip {
  -webkit-transform: translate(50%, 0);
  transform: translate(50%, 0);
  left: auto;
  bottom: 10px;
}
.noUi-vertical .noUi-origin > .noUi-tooltip {
  -webkit-transform: translate(0, -18px);
  transform: translate(0, -18px);
  top: auto;
  right: 28px;
}