:root{
    --color-avantadi: rgba(150, 0, 63,1);
    --color-avantadi-active: rgba(150, 0, 63,0.5);
    --color-enlaces:rgba(69,115,210,1);
    --color-enlaces-active:rgba(0,90,160,0.5);
    --color-texto:#000000;
    --color-svg-icon:#000000ba;
    /*
    --color-is-not-pending:rgb(91, 192, 222);
    */
    --color-is-pending:rgb(240, 173, 78); 
    --color-is-not-pending:rgb(61, 159, 20);
    
    --color-card-header-back:rgba(150, 0, 63,0.5);
    --color-card-header-text:#ffffff;

    --color-card-border:#7e7e7e77;

    --color-warning: rgba(150, 0, 63, 1);
    --color-text-warning: rgba(150, 0, 63, 0.5);

    --color-alert:rgba(107, 146, 107,1);
    --color-text-alert:rgba(107, 146, 107,0.5);
    --color-text-deselect:#a0a0a0;

    --color-ok:#4d841d;
    --color-gris-muy-claro:#eeeeee;
    --color-gris-claro:#E0E0E0;
    --color-gris-oscuro:#8d8c8c;

    --page-padding: 5px;
    --card-padding: 5px;
    --min-padding: 2px;

    --border-general: #dedede 1px solid;

    --alto-barra-nav: 50px;
    --font-size-normal: 8pt;
    --font-size-plus: 12pt;
    --font-size-plus-plus: 14pt;
}
body
{
    font-size: var(--font-size-normal);
    background-color:white;
    font-family: Arial;
}

header{
    width: 100%;
    position: sticky;
    top:0;
    background: #fff;
    /*border-bottom: 1px solid var(--color-avantadi);*/
    box-shadow: 0 1px 5px var(--color-enlaces);
    z-index: 1;
}

P
{
    BACKGROUND: none transparent scroll repeat 0% 0%;
    color: var(--color-texto);
    font-size: var(--font-size-normal);
    MARGIN-LEFT: 0px;
    TEXT-INDENT: 0px
}
H1
{
    color: var(--color-texto);
    font-size: var(--font-size-plus-plus);
    margin-left: 0px;;
    padding:0px;
    text-align: center;
}
H2
{
    COLOR: var(--color-enlaces);
    font-size: 16pt/16pt;
    MARGIN-LEFT: 0px
}
H3
{
    COLOR: var(--color-enlaces);
    font-size: bold var(--font-size-normal);
    MARGIN-LEFT: 0px;
    TEXT-ALIGN: center
}
H4
{
    color: var(--color-texto);
    font-size: bold var(--font-size-plus);
    MARGIN-LEFT: 0px
}
H5
{
    color: var(--color-texto);
    font-size: bold var(--font-size-normal);
    MARGIN-LEFT: 0px
}
H6
{
    BACKGROUND: none transparent scroll repeat 0% 0%;
    COLOR: var(--color-enlaces);
    font-size: bold var(--font-size-plus-plus);
    MARGIN-LEFT: 0px;
}

th
{
    color: var(--color-gris-oscuro);
    font-size: var(--font-size-normal);
    vertical-align:middle;
    word-wrap: break-word;
    text-align: center;
}

td
{
    color: var(--color-texto);
    font-size: var(--font-size-normal);
    vertical-align:middle;
    word-wrap: break-word;
}
td > * {
    vertical-align : middle;
}
th  * {
    display: inline;

}

.tr-rows-alternate:nth-child(odd){
    background-color: var(--color-gris-muy-claro);

}
li
{
    DISPLAY: list-item;
    font-size: var(--font-size-plus);
}

b
{
    font-weight: bold;

}
strong
{
    font-weight: bold;
}
i
{
    font-style: italic;
}


em
{
    FONT-STYLE: italic
}

ADDRESS
{
    FONT-STYLE: italic
}
BLOCKQUOTE
{
    FONT-STYLE: italic
}


input, select, textarea{
	font-size: var(--font-size-normal);
	color: var(--color-enlaces);
    border:1px solid var(--color-gris-claro);
    box-sizing:content-box;
}

input:focus, select:focus, textarea:focus{
    outline: none;
    border-color:var(--color-enlaces-active);
}

.divLikeInput{
	font-size: var(--font-size-normal);
    font-weight: normal;
	color:var(--color-texto);
    border:1px solid var(--color-gris-claro);
    box-sizing:content-box;
}

.tTip
{
    color: #00FF00;
}
.infoTip
{
    color: var(--color-text-deselect);
}

a:link,a:visited,a:active,.boutonFileLikeA
{
    color: var(--color-enlaces);
    text-decoration: none;
}

a:hover,.boutonFileLikeA:hover
{
    color:  var(--color-enlaces-active);
    text-decoration: none;
    cursor: pointer;
}
.a-border{
    border:1px solid var(--color-enlaces-active);
    padding: 2px;
    border-radius: 2px;
}
.tableBordergGrey
{
    border:1px solid #D0D0D0;
}

.fontSelect
{
    color: var(--color-enlaces);
    text-decoration: none;
}
.fontUnSelect
{
    COLOR:  var(--color-enlaces);
    text-decoration: none;
}
.fontDeselect
{
    color: var(--color-text-deselect);
    text-decoration: none;
}
.fontNormal
{
    COLOR: #555555;
    text-decoration: none;
}
.fontStandart
{
    COLOR: var(--color-texto);
    text-decoration: none;
}
.font-due{
    color: var(--color-avantadi);
    text-decoration: none;
}
.font-not-due{
    color: var(--color-ok);
    text-decoration: none;
}

.fontWarning
{
    color: var(--color-warning);
    text-decoration: none;
}
.fontGreen
{
    color:var(--color-alert);
    text-decoration: none;
}
.font-like-th
{
    color: var(--color-gris-oscuro);
    font-size: var(--font-size-normal);
    font-weight: bold;
    word-wrap: break-word;
    margin: 0px 5px;
}
.navigationBar
{
    border:0px solid #FFFFFF;
	color: var(--color-texto);
    BACKGROUND-COLOR: #FFFFFF
}

.noBorderCellBlack
{
    border:0px solid #FFFFFF;
}
.noBorderCellBold
{
    border:0px solid #FFFFFF;
    font-weight: bold;
}
.allBorderCellBlack
{
    border:1px solid #CCCCCC;
}

.titlecell
{
    border:1px solid #0000004d;
	color: var(--color-gris-oscuro);
    BACKGROUND-COLOR: #dddddd3d;
    vertical-align:middle;
}
.titlecellWhite
{
    border: var(--border-general);
	color: var(--color-text-deselect);
    background-color: #ffffff;
    vertical-align:middle;
}
.titlecellblueNoBorder
{
    border:0px solid #ffffff;
    COLOR: #008080;
    font-size: var(--font-size-normal);
    vertical-align:middle;
}
.titlecellblue
{
    border:1px solid #CCCCCC;
    COLOR: #008080;
    font-size: var(--font-size-normal);
    vertical-align:middle;
}
.bigTitleCellblue
{
    BORDER-RIGHT: #DDDDDD 0px solid;
    BORDER-TOP: #CCCCCC 0px solid;
    BORDER-LEFT: #CCCCCC 0px solid;
    BORDER-BOTTOM: #CCCCCC 0px solid;
    COLOR: #008080;
    font-size: var(--font-size-plus);
    FONT-WEIGHT: bold;
    vertical-align:middle;
}
.totalCell
{
    BORDER-RIGHT: #FFFFFF 0px solid;
    BORDER-TOP: #CCCCCC 1px solid;
    BORDER-LEFT: #FFFFFF 0px solid;
    BORDER-BOTTOM: #FFFFFF 0px solid;
    FONT-WEIGHT: bold;
    vertical-align:middle;
    }


.totalCellFontNormal
{
    BORDER-RIGHT: #FFFFFF 0px solid;
    BORDER-TOP: #CCCCCC 1px solid;
    BORDER-LEFT: #FFFFFF 0px solid;
    BORDER-BOTTOM: #FFFFFF 0px solid;
    COLOR: #808080;
    vertical-align:middle;
}

.noborder
{
    border:medium none;
    vertical-align:middle;
}
.imgNoborder{
	border-width: 0px;
	vertical-align:middle;
}
.textWarning
{
    color: var(--color-warning);
}
.oscuroValue
{
    background-color: #A4B6DD;
    color: #555555;
    font-size: var(--font-size-plus);
}
.oscuroName
{
    COLOR: #555555;
    BACKGROUND-COLOR: #e6e6ff;
    WIDTH: 20px;
    HEIGHT: 20px
}


.bouton,.submitir {
    border-radius: 3px;
    padding: 5px 5px;
    background-color: var(--color-enlaces);
    border: none;
    margin: 2px 2px;
    color: white;
    font-size: var(--font-size);
    cursor: pointer;
    box-shadow: 0 2px 2px var(color-gris-claro);
  }

.bouton:hover,.submitir:hover {
    background-color: var(--color-enlaces-active);
    color: white;
  }

  .bouton:disabled,.submitir:disabled {
    background-color: var(--color-gris-muy-claro);
    color: var(--color-gris-oscuro);
    }

  

.boutonFile {
    border-radius: 3px;
    padding: 3px 5px;
    background:var(--color-enlaces);
    border: var(--color-enlaces);
    margin: 2px 2px;
    color:white;
    font-size: var(--font-size);
    cursor: pointer;
  }
.boutonFile:hover {
    background: var(--color-enlaces-active);
  }

.cancell {
    border-radius: 3px;
    padding: 3px 5px;
    background:white;
    border: none;
    margin: 2px 2px;
    color: var(--color-enlaces);
    font-size: var(--font-size);
    cursor: pointer;
    box-shadow: 0 2px 2px var(--color-enlaces-active);
}
.cancell:hover {
    color: var(--color-enlaces-active);
}

.bouton-delete {
    border-radius: 3px;
    padding: 5px 5px;
    background-color: var(--color-avantadi);
    border: none;
    margin: 2px 2px;
    color: white;
    font-size: var(--font-size);
    cursor: pointer;
    box-shadow: 0 2px 2px var(color-gris-claro);
}
.bouton-delete:hover {
    background: var(--color-avantadi-active);
}


.articuloAlternativo
{
    background-color: #dddddd3f;
}
.articuloAlternativoMarcar
{
    BACKGROUND-COLOR: #FFAAAA
}

.radio
{
	border: #FFFFFF 0px solid;
}


#titulo_00{
	margin-top: 10px;
	margin-bottom: 2px;
	margin-left: 10px;
	margin-right: 10px;
}

#titulo_01{
	margin-top: 2px;
	margin-bottom: 2px;
	margin-left: 2px;
	margin-right: 10px;
}

#curtain { 
    display:table-cell;
	position: fixed; 
	z-index: 99; 
	left: 0; 
	top: 0; 
	width: 100%; 
	height: 100%; 
	background-color: #ffffff;      
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	opacity: 0.8;
	text-align: center;
	vertical-align:middle;
	COLOR: green;
	text-decoration: none;
    font-size: 20pt;
   } 

#curtainLight { 
    display:table-cell;
	position: fixed; 
	z-index: 99; 
	left: 0; 
	top: 0; 
	width: 100%; 
	height: 100%; 
	background-color: #ffffff;      
	filter:alpha(opacity=40);
	-moz-opacity:0.4;
	opacity: 0.4;
	text-align: center;

	vertical-align:middle;
	COLOR: green;
	text-decoration: none;
    font-size: 20pt;
   } 
   
   
.lightTip {
	WIDTH: 342px
}
.lightTip .content {
	BORDER-BOTTOM: #e2e2e2 3px solid; BORDER-LEFT: #e2e2e2 3px solid; PADDING-BOTTOM: 10px; PADDING-LEFT: 10px; WIDTH: 310px; PADDING-RIGHT: 10px; BACKGROUND: #ffffff; COLOR: #020202; BORDER-TOP: #e2e2e2 3px solid; BORDER-RIGHT: #e2e2e2 3px solid; PADDING-TOP: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px
}
.lightTip .bottom {
	BACKGROUND: url(/suCollect/images/notch-white.png) no-repeat center top; HEIGHT: 14px
}
.infoTip {
	WIDTH: 300px
}
.infoTip .content {
	BORDER-BOTTOM: #000099 1px solid; BORDER-LEFT: #000099 1px solid; PADDING-BOTTOM: 5px; PADDING-LEFT: 5px; WIDTH: 280px; PADDING-RIGHT: 5px; BACKGROUND: #ffffff; COLOR: #020202; BORDER-TOP: #000099 1px solid; BORDER-RIGHT: #000099 1px solid; PADDING-TOP: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px
}
.infoTip .bottom {
	BACKGROUND: url(/suCollect/images/notch-white.png) no-repeat center top; HEIGHT: 14px
}
.allborders
{
    BORDER-RIGHT: #CCCCCC 1px solid;
    BORDER-TOP: #CCCCCC 1px solid;
    BORDER-LEFT: #CCCCCC 1px solid;
    BORDER-BOTTOM: #CCCCCC 1px solid;
    vertical-align:middle;
    display: table-cell;
}
.noneborders
{
    BORDER-RIGHT: #FFFFFF 0px solid;
    BORDER-TOP: #FFFFFF 0px solid;
    BORDER-LEFT: #FFFFFF 0px solid;
    BORDER-BOTTOM: #FFFFFF 0px solid;
    display: table-cell;
}
.topbottomcell
{
    BORDER-RIGHT: #FFFFFF 0px solid;
    BORDER-TOP: #CCCCCC 1px solid;
    BORDER-LEFT: #FFFFFF 1px solid;
    BORDER-BOTTOM: #CCCCCC 1px solid;
    vertical-align: top;
    display: table-cell;
}

.topcell
{
    BORDER-RIGHT: #FFFFFF 0px solid;
    BORDER-TOP: #CCCCCC 1px solid;
    BORDER-LEFT: #FFFFFF 0px solid;
    BORDER-BOTTOM: #FFFFFF 0px solid;
    display: table-cell;
}
.topleftcell
{
    BORDER-RIGHT: #FFFFFF 0px solid;
    BORDER-TOP: #CCCCCC 1px solid;
    BORDER-LEFT: #CCCCCC 1px solid;
    BORDER-BOTTOM: #FFFFFF 0px solid;
    display: table-cell;
}
.leftcell
{
    BORDER-RIGHT: #FFFFFF 0px solid;
    BORDER-TOP: #FFFFFF 0px solid;
    BORDER-LEFT: #CCCCCC 1px solid;
    BORDER-BOTTOM: #FFFFFF 0px solid;
    display: table-cell;
}
.rightcell
{
    BORDER-RIGHT: #CCCCCC 1px solid;
    BORDER-TOP: #FFFFFF 0px solid;
    BORDER-LEFT: #FFFFFF 0px solid;
    BORDER-BOTTOM: #FFFFFF 0px solid;
    display: table-cell;
}

.toprightcell
{
    BORDER-RIGHT: #CCCCCC 1px solid;
    BORDER-TOP: #CCCCCC 1px solid;
    BORDER-LEFT: #FFFFFF 0px solid;
    BORDER-BOTTOM: #FFFFFF 0px solid;
    display: table-cell;
}
.bottomleftcell
{
    BORDER-RIGHT: #FFFFFF 0px solid;
    BORDER-TOP: #FFFFFF 0px solid;
    BORDER-LEFT: #CCCCCC 1px solid;
    BORDER-BOTTOM: #CCCCCC 1px solid;
    display: table-cell;
}
.bottomrightcell
{
    BORDER-RIGHT: #000000 1px solid;
    BORDER-TOP: #FFFFFF 0px solid;
    BORDER-LEFT: #FFFFFF 0px solid;
    BORDER-BOTTOM: #CCCCCC 1px solid;
    display: table-cell;
}
.bottomcell
{
    BORDER-RIGHT: #FFFFFF 0px solid;
    BORDER-TOP: #FFFFFF 0px solid;
    BORDER-LEFT: #FFFFFF 0px solid;
    BORDER-BOTTOM: #CCCCCC 1px solid;
    display: table-cell;
}
.bordercellth
{
    border: #008080 1px solid;
    vertical-align: top;
    display: table-cell;
}
.bgwhite{
    BACKGROUND-COLOR: #ffffff
}
.oscuroName
{
    COLOR: #555555;
    BACKGROUND-COLOR: #e6e6ff;
    WIDTH: 20px;
    HEIGHT: 20px
}
.delette
{
    BORDER-RIGHT: #555555 1px solid;
    BORDER-TOP: #cccccc 1px solid;
    FONT-SIZE: var(--font-size-plus);
    BORDER-LEFT: #cccccc 1px solid;
    COLOR: red;
    BORDER-BOTTOM: #555555 1px solid;
    
    BACKGROUND-COLOR: #ffffff
}
.vertaligntop { 
	vertical-align:top; 
	margin-top:0; 
}
.chkBackImage {

    background-image: url(/suCollect/images/163.png);
    background-repeat: repeat-y;
    background-position: center center;
    width: 20px;
}
.chkBackImageTo {
    background-image: url(/suCollect/images/164.png);
    background-repeat: no-repeat;
    background-position: top center;
    width: 20px;
}

.btn-info{background-color:#CCFFFF}
.btn-success{background-color:#CCFF99}
.btn-default{background-color:#FFFFFF}
.btn-primary{background-color:#CCCCFF}
.btn-warning{background-color:#FFFFCC}
.btn-danger{background-color:#FFCCCC}


.btn{
    display:inline-block;
    padding:6px 12px;
    margin-bottom:0;
    font-size:var(--font-size-plus);
    font-weight:400;
    color: #000000;
    line-height:1.42857143;
    text-align:center;
    white-space:nowrap;
    vertical-align:middle;
    -ms-touch-action:manipulation;
    touch-action:manipulation;
    cursor:pointer;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    background-image:none;
    border:1px solid #555555;
    border-radius:4px
}
.containerButtonsListVH {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    margin: 5px;
}
.containerColumn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction:column;
    margin:auto;
    padding: var(--min-padding);
}

.containerRow {
    display: flex;
    align-items:center;
    justify-content:space-between;
    flex-direction:row;
    margin:auto;
    padding: var(--min-padding);
}

.containerRowCenter {
    display: flex;
    align-items:center;
    justify-content:center;
    flex-direction:row;
    padding: var(--min-padding);
}


.containerRowLeft {
    display: flex;
    align-items:center;
    justify-content:flex-start;
    flex-direction:row;
    margin:auto;
    padding: var(--min-padding);
}

.container100{
    width: auto;
    margin: 2px;
}
.containerMin{
    width:fit-content;
    margin: 2px;
    /*border: 1px solid rgb(247, 0, 255);*/
}
.wrapperExtend {
    display: flex;
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
    /*border: 1px solid rgb(30, 255, 0);*/
}
.wrapper {
    display: flex;
    flex-direction:row;
    justify-content:center;
    align-items:center;
    /*border: 1px solid rgb(30, 255, 0);*/
}
div#vacio
{
	background-color: rgba(0, 0, 255, 0.445);
	border: 1px solid grey;
    border-radius: 5px;
	width: 400px;
	padding: 1px;
}
 
div#div_completado
{
	position: relative;
	top: 0px;
	left: 0px;
	background-color: #FFFFFF;
	width: 0px;
	padding-top: 5px;
	padding: 0px;
}
 
div#div_barra
{
	position: relative;
	top: 0px;
	left: 0px;
	color: var(--color-texto);
	padding: 0px;
	padding-top: 0px;
	font-size: var(--font-size-normal);
}
 
div#div_boton
{
	position: relative;
	top: 0px;
	left: 0px;
	height: 30px;
	text-align: center;
	padding: 0px;
	padding-top: 5px;
	font-size: var(--font-size-plus-plus);
}
.card {
    border: var(--color-card-border) 1px solid;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.123);
    border-radius: 5px; /* 5px rounded corners */
    padding: var(--card-padding);
    margin: var(--card-padding) auto;
    width:fit-content;

    
  }
  .card-adjusted{
    border: var(--color-card-border) 1px solid;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.123);
    border-radius: 5px; /* 5px rounded corners */
    padding: var(--card-padding);
    margin: var(--card-padding) var(--card-padding);
  }


  .card-with-title{
    display: flex;
    flex-direction: column;
    border: var(--color-card-border) 1px solid;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.123);
    border-radius: 5px; /* 5px rounded corners */
    padding: 0px;
    margin: var(--card-padding) var(--card-padding);
  }

  .card-with-title-header {
    background: var(--color-card-header-back);
    color: var(--color-card-header-text);
    text-align: center;
    padding:var(--min-padding);
  }
  .card-with-title-container {
    padding: var(--card-padding);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
 }

 .min-with-select {
    min-width: 150px;
 }

  .card_warning {
    border:var(--color-warning) 1px solid;
    box-shadow: 2px 2px 5px var(--color-text-warning);
    border-radius: 5px; /* 5px rounded corners */
    padding: var(--page-padding);
    margin: var(--card-padding) auto;
    width:fit-content;
  }
  .card_alert {
    border:var(--color-alert) 1px solid;
    box-shadow: 2px 2px 5px var(--color-text-alert);
    border-radius: 5px; /* 5px rounded corners */
    padding: var(--page-padding);
    margin: var(--card-padding) auto;
    width:fit-content;
  }
  hr{
    margin: 10px auto;
  }
.gridLikeTable {
    display: grid;
    grid-gap: 2px;
    justify-items:flex-start;
    align-items:center;
}
.grid-2-columns {
    display: grid;
    grid-template-columns: 1fr 4fr;
    grid-gap: 5px;
    justify-items:flex-start;
    align-items:center;
    margin: 5px;
}
.grid-3-columns {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 5px;
    justify-items:flex-start;
    align-items:center;
    margin: 5px;
}
.grid-show-4-columns {
    display: grid;
    grid-template-columns: 1fr 10fr 2fr 1fr;
    grid-gap: 5px;
    justify-items:flex-start;
    align-items:center;
    margin: 5px;

    padding: 5px;
    border: var(--border-general);
    border-radius: 3px; /* 5px rounded corners */

}

.flex-row-center{
    display: flex;
    flex-flow: row;
    justify-content: space-between;
    align-items:center;

}
.flex-row-left{
    display: flex;
    flex-flow: row;
    justify-content:flex-start;
    align-items:center;

}
::-webkit-calendar-picker-indicator {
    filter: invert(15%) sepia(64%) saturate(5393%) hue-rotate(194deg) brightness(97%) contrast(101%);
}

dialog {
    border:var(--border-general);
    border-radius: 5px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    padding: 1rem;
    /*margin: 5px 0px 10px 10px;*/
    max-width: 95vw;
    max-height: 90vh;
  }

/******************** PERCENTAGES ***********************/
.percentage-container {
    display: flex;
    flex-flow: column;
    align-items:flex-end;
    justify-content: flex-start;
}
.percentage {
    margin: 0px;
    padding: 2px;
    width: 100%;
    max-width: 500px;
    border: 1px solid var(--color-gris-oscuro);
    height: 10px;
  }
  
.percentage_bar {
    height: 100%;
    width: 1%;
    background-color: var(--color-gris-oscuro);
  }
/******************** TOOLTIP ***********************/
  .tooltip-collect {
    position: relative;
    display: inline-block;
  }
  
  .tooltip-collect .tooltiptext-collect {
    visibility: hidden;
    width: 120px;
    background-color: var(--color-gris-oscuro);
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -60px;
    opacity: 0;
    transition: opacity 0.3s;
  }
  
  .tooltip-collect .tooltiptext-collect::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: var(--color-gris-oscuro) transparent transparent transparent;
  }
  
  .tooltip-collect:hover .tooltiptext-collect {
    visibility: visible;
    opacity: 1;
  }