.mathematic {
    fill-opacity: 0;
    stroke: #000;
    stroke-width: 1;    
}
.shape {
    width: 60pt;
}
.packageCount {
    width: auto;
    height:60px;
}
.shape_square {
    content: url( 'square.svg' );
}
.shape_circle {
    content: url( 'circle.svg' );
}
.shape_ellipse {
    content: url( 'ellipse.svg' );
}
.shape_rectangle {
    content: url( 'rectangle.svg' );
}
.shape_triangle {
    content: url( 'triangle.svg' );
}
.shape_triangle90 {
    content: url( 'triangle90.svg' );
}

.digit-square-1 {
    content: url( 'digit-square-1.svg' );
    display:inline-flex;
}
.digit-square-2 {
    content: url( 'digit-square-2.svg' );
    display:list-item;
}

@media (prefers-color-scheme: dark) {
    .mathematic {
        fill-opacity: 0;
        stroke: #9f9f9f;
        stroke-width: 1;
    }
}