@property --oficial {
  syntax: "<color>";
  inherits: false;
  initial-value: #3a892d;
}
@property --gris {
  syntax: "<color>";
  inherits: false;
  initial-value: #e6e6e6;
}
@property --rojo {
  syntax: "<color>";
  inherits: false;
  initial-value: #ff6917;
}
@property --verde {
  syntax: "<color>";
  inherits: false;
  initial-value: #00c100;
}
.color-oficial {color:#fff !important; background-color: var(--oficial) !important}
.color-rojo {color:#fff !important; background-color:#ff6917 !important}
.color-naranja {color:#fff !important; background-color:#ff9e00 !important}
.color-marron {color:#fff !important; background-color:#d18c1e !important}
.color-azul {color:#fff !important; background-color:#0098dc !important}
.color-verde {color:#fff !important; background-color:#00c100 !important }
.color-blanco {color:#000 !important; background-color:#f0f0f0 !important }
.texto-oficial {color: var(--oficial) !important;}
.texto-rojo {color: #ff6917 !important;}
.texto-naranja {color: #ff9e00 !important;}
.texto-marron {color: #d18c1e !important;}
.texto-azul {color: #0098dc !important;}
.texto-verde {color: #00c100 !important;}
.texto-blanco {color: #f0f0f0 !important;}
.texto-xlarge {font-size: 1.5em;}