@font-face {
    font-family: "Phosphor-Duotone";
    src: url("./Phosphor-Duotone.woff2");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.ph-duotone {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: "Phosphor-Duotone" !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

    .ph-duotone.ph-android-logo:before {
        content: "\e008";
        opacity: 0.2;
    }

    .ph-duotone.ph-android-logo:after {
        content: "\e009";
        margin-left: -1em;
    }

    .ph-duotone.ph-cloud-check:before {
        content: "\e1b0";
        opacity: 0.2;
    }

    .ph-duotone.ph-cloud-check:after {
        content: "\e1b1";
        margin-left: -1em;
    }

    .ph-duotone.ph-devices:before {
        content: "\eba4";
        opacity: 0.2;
    }

    .ph-duotone.ph-devices:after {
        content: "\eba5";
        margin-left: -1em;
    }

    .ph-duotone.ph-envelope-simple-open:before {
        content: "\e21a";
        opacity: 0.2;
    }

    .ph-duotone.ph-envelope-simple-open:after {
        content: "\e21b";
        margin-left: -1em;
    }

    .ph-duotone.ph-eye-slash:before {
        content: "\e224";
        opacity: 0.2;
    }

    .ph-duotone.ph-eye-slash:after {
        content: "\e225";
        margin-left: -1em;
    }

    .ph-duotone.ph-fingerprint-simple:before {
        content: "\e240";
        opacity: 0.2;
    }

    .ph-duotone.ph-fingerprint-simple:after {
        content: "\e241";
        margin-left: -1em;
    }

    .ph-duotone.ph-ghost:before {
        content: "\e62a";
        opacity: 0.2;
    }

    .ph-duotone.ph-ghost:after {
        content: "\e62b";
        margin-left: -1em;
    }

    .ph-duotone.ph-git-pull-request:before {
        content: "\e282";
        opacity: 0.2;
    }

    .ph-duotone.ph-git-pull-request:after {
        content: "\e283";
        margin-left: -1em;
    }

    .ph-duotone.ph-globe:before {
        content: "\e288";
        opacity: 0.2;
    }

    .ph-duotone.ph-globe:after {
        content: "\e289";
        margin-left: -1em;
    }

    .ph-duotone.ph-gps-slash:before {
        content: "\edd4";
        opacity: 0.2;
    }

    .ph-duotone.ph-gps-slash:after {
        content: "\edd5";
        margin-left: -1em;
    }

    .ph-duotone.ph-hand-heart:before {
        content: "\e810";
        opacity: 0.2;
    }

    .ph-duotone.ph-hand-heart:after {
        content: "\e811";
        margin-left: -1em;
    }

    .ph-duotone.ph-identification-card:before {
        content: "\e2c8";
        opacity: 0.2;
    }

    .ph-duotone.ph-identification-card:after {
        content: "\e2c9";
        margin-left: -1em;
    }

    .ph-duotone.ph-newspaper:before {
        content: "\e344";
        opacity: 0.2;
    }

    .ph-duotone.ph-newspaper:after {
        content: "\e345";
        margin-left: -1em;
    }

    .ph-duotone.ph-shooting-star:before {
        content: "\ecfa";
        opacity: 0.2;
    }

    .ph-duotone.ph-shooting-star:after {
        content: "\ecfb";
        margin-left: -1em;
    }

    .ph-duotone.ph-squares-four:before {
        content: "\e464";
        opacity: 0.2;
    }

    .ph-duotone.ph-squares-four:after {
        content: "\e465";
        margin-left: -1em;
    }

    .ph-duotone.ph-wifi-slash:before {
        content: "\e4f2";
        opacity: 0.2;
    }

    .ph-duotone.ph-wifi-slash:after {
        content: "\e4f3";
        margin-left: -1em;
    }