.material-icons,
.material-icons-outlined {
 display        : inline-block;
 font-family    : 'Material Icons';
 font-weight    : normal;
 font-style     : normal;
 font-size      : 24px;  /* Preferred icon size */
 line-height    : 1;

 word-wrap      : normal;
 white-space    : nowrap;
 direction      : ltr;
 text-transform : none;
 letter-spacing : normal;

 /* Support for all WebKit browsers. */
 -webkit-font-smoothing : antialiased;

 /* Support for Safari and Chrome. */
 text-rendering : optimizeLegibility;

 /* Support for Firefox. */
 -moz-osx-font-smoothing : grayscale;

 /* Support for IE. */
 font-feature-settings : 'liga';
}

.material-icons-outlined {
 font-family : 'Material Icons Outlined';
}

/* Rules for sizing the icon. */
.material-icons.md-12,
.material-icons-outlined.md-12 {
 font-size : 12px;
}

.material-icons.md-14,
.material-icons-outlined.md-14 {
 font-size : 14px;
}

.material-icons.md-16,
.material-icons-outlined.md-16 {
 font-size : 16px;
}

.material-icons.md-18,
.material-icons-outlined.md-18 {
 font-size : 18px;
}

.material-icons.md-21,
.material-icons-outlined.md-21 {
 font-size : 21px;
}

.material-icons.md-24,
.material-icons-outlined.md-24 {
 font-size : 24px;
}

.material-icons.md-32,
.material-icons-outlined.md-32 {
 font-size : 32px;
}

.material-icons.md-36,
.material-icons-outlined.md-36 {
 font-size : 36px;
}

.material-icons.md-48,
.material-icons-outlined.md-48 {
 font-size : 48px;
}

.material-icons.md-pointer,
.material-icons-outlined.md-pointer {
 cursor : pointer;
}

/* Rules for using icons as white on a dark background. */
.material-icons.md-light,
.material-icons-outlined.md-light {
 color : var(--blanco);
}

.material-icons.md-dark,
.material-icons-outlined.md-dark {
 color : var(--oscuro);
}

.material-icons.md-darkness,
.material-icons-outlined.md-darkness {
 color : var(--negro);
}

.material-icons.md-warning,
.material-icons-outlined.md-warning {
 color : var(--amarillo);
}

.material-icons.md-error,
.material-icons-outlined.md-error {
 color : var(--rojo);
}

.material-icons.md-notice,
.material-icons-outlined.md-notice {
 color : var(--azul);
}

.material-icons.md-call,
.material-icons-outlined.md-call {
 color : var(--verdeBG) !important;
}

.material-icons.md-inProcess,
.material-icons-outlined.md-inProcess {
 color : var(--marcarTel) !important;
 animation: 1s infinite alternate inProcess;
}

.material-icons.md-hangup,
.material-icons-outlined.md-hangup {
 color : var(--rojoBG) !important;
}

@keyframes inProcess {
    0% {
        transform: scale(.7);
    }
}

.material-icons.md-light.md-inactive,
.material-icons.md-dark.md-inactive,
.material-icons.md-darkness.md-inactive,
.material-icons-outlined.md-light.md-inactive,
.material-icons-outlined.md-dark.md-inactive,
.material-icons-outlined.md-darkness.md-inactive {
 color : var(--inactivoOscuro);
}