/*
 * Dice.css v1.0
 * Code - MIT License - https://github.com/diafygi/dice-css
 * Images - Public Domain - https://openclipart.org/detail/105931/sixsided-dice-faces-lio-01
 */

.dice {
    display: inline-block;
    min-height: 1em;
    padding-left: 1em;
    background-size: 1em;
    background-repeat: no-repeat;
    
}

.dice-1 {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3C!-- Generator: Adobe Illustrator 21.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Calque_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 60 60' style='enable-background:new 0 0 60 60;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FF1177;} %3C/style%3E%3Cg%3E%3Cpath d='M12,59C5.9,59,1,54.1,1,48V12C1,5.9,5.9,1,12,1h36c6.1,0,11,4.9,11,11v36c0,6.1-4.9,11-11,11H12z'/%3E%3Cpath class='st0' d='M48,2c5.5,0,10,4.5,10,10v36c0,5.5-4.5,10-10,10H12C6.5,58,2,53.5,2,48V12C2,6.5,6.5,2,12,2H48 M48,0H12 C5.4,0,0,5.4,0,12v36c0,6.6,5.4,12,12,12h36c6.6,0,12-5.4,12-12V12C60,5.4,54.6,0,48,0L48,0z'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='30' cy='30' r='6'/%3E%3C/g%3E%3C/svg%3E");
}

.dice-2 {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3Csvg version='1.1' id='Calque_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 60 60' style='enable-background:new 0 0 60 60;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FF1177;} %3C/style%3E%3Cg%3E%3Cpath d='M12,59C5.9,59,1,54.1,1,48V12C1,5.9,5.9,1,12,1h36c6.1,0,11,4.9,11,11v36c0,6.1-4.9,11-11,11H12z'/%3E%3Cpath class='st0' d='M48,2c5.5,0,10,4.5,10,10v36c0,5.5-4.5,10-10,10H12C6.5,58,2,53.5,2,48V12C2,6.5,6.5,2,12,2H48 M48,0H12 C5.4,0,0,5.4,0,12v36c0,6.6,5.4,12,12,12h36c6.6,0,12-5.4,12-12V12C60,5.4,54.6,0,48,0L48,0z'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='46.5' cy='46' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='14.5' cy='14' r='6'/%3E%3C/g%3E%3C/svg%3E");
}

.dice-3 {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3Csvg version='1.1' id='Calque_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 60 60' style='enable-background:new 0 0 60 60;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FF1177;} %3C/style%3E%3Cg%3E%3Cpath d='M12,59C5.9,59,1,54.1,1,48V12C1,5.9,5.9,1,12,1h36c6.1,0,11,4.9,11,11v36c0,6.1-4.9,11-11,11H12z'/%3E%3Cpath class='st0' d='M48,2c5.5,0,10,4.5,10,10v36c0,5.5-4.5,10-10,10H12C6.5,58,2,53.5,2,48V12C2,6.5,6.5,2,12,2H48 M48,0H12 C5.4,0,0,5.4,0,12v36c0,6.6,5.4,12,12,12h36c6.6,0,12-5.4,12-12V12C60,5.4,54.6,0,48,0L48,0z'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='46.5' cy='46' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='14.5' cy='14' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='30.5' cy='30' r='6'/%3E%3C/g%3E%3C/svg%3E");
}

.dice-4 {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3Csvg version='1.1' id='Calque_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 60 60' style='enable-background:new 0 0 60 60;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FF1177;} %3C/style%3E%3Cg%3E%3Cpath d='M12,59C5.9,59,1,54.1,1,48V12C1,5.9,5.9,1,12,1h36c6.1,0,11,4.9,11,11v36c0,6.1-4.9,11-11,11H12z'/%3E%3Cpath class='st0' d='M48,2c5.5,0,10,4.5,10,10v36c0,5.5-4.5,10-10,10H12C6.5,58,2,53.5,2,48V12C2,6.5,6.5,2,12,2H48 M48,0H12 C5.4,0,0,5.4,0,12v36c0,6.6,5.4,12,12,12h36c6.6,0,12-5.4,12-12V12C60,5.4,54.6,0,48,0L48,0z'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='46.5' cy='46' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='14.5' cy='14' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='14.5' cy='46' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='46.5' cy='14' r='6'/%3E%3C/g%3E%3C/svg%3E");
}

.dice-5 {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3Csvg version='1.1' id='Calque_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 60 60' style='enable-background:new 0 0 60 60;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FF1177;} %3C/style%3E%3Cg%3E%3Cpath d='M12,59C5.9,59,1,54.1,1,48V12C1,5.9,5.9,1,12,1h36c6.1,0,11,4.9,11,11v36c0,6.1-4.9,11-11,11H12z'/%3E%3Cpath class='st0' d='M48,2c5.5,0,10,4.5,10,10v36c0,5.5-4.5,10-10,10H12C6.5,58,2,53.5,2,48V12C2,6.5,6.5,2,12,2H48 M48,0H12 C5.4,0,0,5.4,0,12v36c0,6.6,5.4,12,12,12h36c6.6,0,12-5.4,12-12V12C60,5.4,54.6,0,48,0L48,0z'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='46.5' cy='46' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='14.5' cy='14' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='14.5' cy='46' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='46.5' cy='14' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='30.5' cy='30' r='6'/%3E%3C/g%3E%3C/svg%3E");
}

.dice-6 {
  background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3Csvg version='1.1' id='Calque_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 60 60' style='enable-background:new 0 0 60 60;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0{fill:%23FF1177;} %3C/style%3E%3Cg%3E%3Cpath d='M12,59C5.9,59,1,54.1,1,48V12C1,5.9,5.9,1,12,1h36c6.1,0,11,4.9,11,11v36c0,6.1-4.9,11-11,11H12z'/%3E%3Cpath class='st0' d='M48,2c5.5,0,10,4.5,10,10v36c0,5.5-4.5,10-10,10H12C6.5,58,2,53.5,2,48V12C2,6.5,6.5,2,12,2H48 M48,0H12 C5.4,0,0,5.4,0,12v36c0,6.6,5.4,12,12,12h36c6.6,0,12-5.4,12-12V12C60,5.4,54.6,0,48,0L48,0z'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='46.5' cy='46' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='14.5' cy='14' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='14.5' cy='46' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='46.5' cy='14' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='30.5' cy='14' r='6'/%3E%3C/g%3E%3Cg%3E%3Ccircle class='st0' cx='30.5' cy='46' r='6'/%3E%3C/g%3E%3C/svg%3E");
}