:root {
  --bs-primary: #1097a3;
  --bs-primary-rgb: 4, 130, 141;
  --bs-secondary: #64c3cc;
  --bs-secondary-rgb: 100, 195, 204;
  --bs-tertiary:  #0ac1d150;
  --monocromo: #1097a3 !important;
 
  --verde: #00851B !important;
  --arancio: #CD4704 !important;
  --rosso: #CE0000 !important;


  --warning: #664d03;
  --danger: #58151c;
  --success: #0a3622;
}

/*ICONE SPRITE*/

/*dimensioni*/

.icon-xs{
  width:20px;
  height:20px;
}
.icon-s{
  width:30px;
  height:30px;
}
.icon-m{
  width:50px;
  height:50px;
}
.icon-l{
  width:75px;
  height:75px;
}
.icon-xl{
  width:100px;
  height:100px;
}
.icon-xxl{
  width:150px;
  height:150px;
}


/*comportamento*/
.icon-colors {
  --color: #000;
  --color-1: var(--bs-primary);
  --color-2: var(--bs-secondary);
}

a:hover .icon-colors, button:hover .icon-colors{
  --color: var(--bs-secondary);
  --color-1: var(--bs-secondary);
  --color-2: var(--bs-primary);
}


.icon-monocromo{
  --color-1: var(--monocromo);
  --color-2: var(--monocromo);
}
a:hover .icon-monocromo, button:hover .icon-monocromo{
  --color-1: var(--monocromo);
  --color-2: var(--monocromo);
}


.icon-monocromo-button{
  --color-1: var(--bs-primary);
  --color-2: var(--bs-primary);
}
a:hover .icon-monocromo-button, button:hover .icon-monocromo-button{
  --color-1: var(--monocromo);
  --color-2: var(--monocromo);
}


.icon-semaforo{
  --color: #000;
  --color-arancio:var(--arancio);
  --color-rosso:var(--rosso);
  --color-verde:var(--verde);
}

.icon-white{
  --color-1: #fff;
  --color-2: #fff;
}

a:hover .icon-white, button:hover .icon-white{
  --color-1: #fff;
  --color-2: #fff;
}

.icon-black{
  --color-1: #000000;
  --color-2: #000000;
}

a:hover .icon-black, button:hover .icon-black{
  --color-1: #000000;
  --color-2: #000000;
}

.icon-warning{
  --color: var(--warning);
  --color-1: var(--warning);
  --color-2: var(--warning);
}

.icon-danger{
  --color: var(--danger);
  --color-1: var(--danger);
  --color-2: var(--danger);
}

.icon-success{
  --color: var(--success);
  --color-1: var(--success);
  --color-2: var(--success);
}

/*fine ICONE SPRITE*/

