@font-face { font-family: 'Gunny Rewritten';
         src: local('Gunny Rewritten'), 
         local('GunnyRewritten'), 
         url('gunnyrewritten.woff2') format('woff2'), 
         url('gunnyrewritten.woff') format('woff'), 
         url('gunnyrewritten.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Akrobat';
    src: local('Akrobat Thin'), local('Akrobat-Thin'), url('Akrobatthin.woff2') format('woff2'), url('Akrobatthin.woff') format('woff'), url('Akrobatthin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'Zhizn';
    src: local('Zhizn'), url('zhizn.woff2') format('woff2'), url('zhizn.woff') format('woff'), url('zhizn.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'TM Vinograd Filled';
    src: local('TM Vinograd Filled Oblique'), local('TMVinograd-FilledOblique'), url('Tmvinogradfilledoblique.woff2') format('woff2'), url('Tmvinogradfilledoblique.woff') format('woff'), url('Tmvinogradfilledoblique.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: 'TM Vinograd Filled';
    src: local('TM Vinograd Filled'), local('TMVinograd-Filled'), url('Tmvinogradfilled.woff2') format('woff2'), url('Tmvinogradfilled.woff') format('woff'), url('Tmvinogradfilled.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Eurofurence';
    src: local('eurofurence light'), local('Eurofurencelight'), url('eurofurencelight.woff2') format('woff2'), url('eurofurencelight.woff') format('woff'), url('eurofurencelight.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}
html { margin: 0; padding: 0; font-family: Arial, Tahoma;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
 -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
          }   
          
.newkaz { font-family: 'Gunny Rewritten'; }
.newkaz1 { font-family: 'Beer money'; }
.newkaz2 { font-family: 'Akrobat'; }
.newkaz3 { font-family: 'Zhizn'; }
.newkaz4 { font-family: 'TM Vinograd Filled'; }
.newkaz5 { font-family: 'Eurofurence'; }


           
.fleft { float: left; }
.fright { float: right; }
.tenright { box-shadow: 3px 0 3px 0; }
.ften { box-shadow: -2px 2px 4px 2px black; }
.fnt6 { font-size: 6pt;}
.fnt7 { font-size: 7pt;}
.fnt8 { font-size: 8pt;}
.fnt9 { font-size: 9pt;}
.fnt10 { font-size: 10pt;}       
.fnt11 { font-size: 11pt;}       
.fnt12 { font-size: 12pt;}       
.fnt14 { font-size: 14pt;}       
.fnt16 { font-size: 16pt;}
.fnt18 { font-size: 18pt;}
.fnt20 { font-size: 20pt;}
.fnt21 { font-size: 21pt;} 
.fnt22 { font-size: 22pt;} 
.fnt24 { font-size: 24pt;} 
.fnt26 { font-size: 26pt;}
.fnt28 { font-size: 28pt;}
.fnt30 { font-size: 30pt;}
.fnt32 { font-size: 32pt;}
.fnt34 { font-size: 34pt;}
.fnt36 { font-size: 36pt;}
.fnt38 { font-size: 38pt;}
.fnt42 { font-size: 42pt;}
.fnt46 { font-size: 46pt;}
.fnt48 { font-size: 48pt;}
.fnt52 { font-size: 52pt;}
.fnt56 { font-size: 56pt;}
.fnt58 { font-size: 58pt;}
.fnt64 { font-size: 64pt;}
.fnt68 { font-size: 68pt;}
.fnt72 { font-size: 72pt;}
.fnt90 { font-size: 90pt;}
.fnt120 { font-size: 120pt;}
.fnt150 { font-size: 150pt;}
.fntsz60 { font-size: 60%; }
.fntsz70 { font-size: 70%; }
.fntsz80 { font-size: 80%; }
.fntsz90 { font-size: 90%; }
.fclrBlue { color: blue; }
.fclrRed { color: red; }
.fclrWhite { color: white; }
.fclrBlack { color: black; }
.fclrGreen { color: green; }
.fclrGray { color: gray; }
.fclrYellow { color: yellow; }
.fclrc60062 { color:#c60062; }
.fclr049b00 { color:#049b00; }
.fclr0005d0 { color:#0005d0; }
.fclrea7f00 { color:#ea7f00; }
.fclrSilver { color: silver; }
.txtline { text-decoration: underline; }
.bgWhite { background-color: white; }
.fntbld { font-weight: bold; }
.fntnrml { font-weight: normal; }
.tx_cent { text-align:center; }
.tx_left { text-align:left; }
.tx_right { text-align:right; }
.inpstyl { padding:21px;margin:8px;border-radius:24px;text-align:center; }
.opac09 { opacity:0.9; }
.opac05 { opacity:0.5; }
.opac03 { opacity:0.3; }
.opac01 { opacity:0.1; }
.abris1 { -webkit-text-stroke: 1px; -webkit-text-fill-color: white; }
.abris2 { -webkit-text-stroke: 2px; -webkit-text-fill-color: white; }
.googmap { background-image: url(img/googmap.gif); }
.sharewn { background-image: url(img/delicca.gif); }
.scankn { background-image: url(img/scanner.jpg); }
.cardkn { background-image: url(img/card.gif); }
.biletkn { background-image: url(img/icon.png); }
.gpskn { background-image: url(img/gps.gif); } 
.playkn { background-image:url(img/play.gif); }
.delkn { background-image:url(img/delpic.gif); }
.paykn { background-image:url(img/paypic.gif); }
.xpykn { background-image:url(img/brpaypic.gif); }



.trubka { display: inline-block; margin: 6px; padding: 6px; width:170px; height:170px; 
          cursor: pointer; border: 1px solid white; background-color:white;
          background-repeat: no-repeat; background-position: center center; background-size: 80% auto;
          color: black; box-shadow: 1px 1px 2px 2px black; border-radius:50%; position:relative;
          background-image: url(img/trubka.gif); }   
.trubka:active { box-shadow: inset 2px 2px 2px 2px black; text-shadow: 1px 1px 1px grey; 
                 transform: scale(0.95,0.95);
                }
.whatst { display: inline-block; margin: 6px; padding: 6px; width:170px; height:170px; 
          cursor: pointer; border: 1px solid white; background-color:white;
          background-repeat: no-repeat; background-position: center center; background-size: 80% auto;
          color: black; box-shadow: 1px 1px 2px 2px black; border-radius:50%; position:relative;
          background-image: url(img/whatsapp.gif); }
.whatst:active { box-shadow: inset 2px 2px 2px 2px black; text-shadow: 1px 1px 1px grey; 
                 transform: scale(0.95,0.95);
                }
.plavnik { transition-timing-function: ease-in; transition: all 0.4s; }
.activvv { box-shadow: 1px 1px 6px 1px black; transform: scale(1.1); border-radius: 10px; border: 2px solid lime; }

.knn { display:inline-block; color:black; margin:16px; padding:8px; background-size:100%; 
       background-repeat:no-repeat; background-position:center center; }
.knn:active { transform:scale(0.99);  }

.parcts { display:inline-block; width:100%; }
body { font-size:24pt; background-image:none;background-position:center bottom;padding:0;margin:0;
       background-repeat:no-repeat;background-size:100% auto;background-attachment:fixed;
       background-color: #f3fffa; text-align:center; height:100%; width:100%; } 
#basga { text-align:center; }
.ftenin { box-shadow: inset 2px 2px 2px 2px black;  }
.bilet { display:inline-block; border-radius: 6px; box-shadow: 1px 1px 6px 3px black;
         background-color:#ffdc3a;color:black; min-width: 170px; border:3px solid yellow; 
         margin:16px; padding:8px; width:auto; min-height:55px; font-size:18pt;
        }
.bilet:active { box-shadow: none; transform:scale(0.99) rotate(4deg);  }

.loadbox { display:none;width:400px;height:64px;border:1px solid blue;text-align:left;
       background-color:yellow;color:gray;line-height:8px;left:0px;position:relative;border-radius:4px;
          }
.loadproc { display:inline-block;width:0%;height:64px;background:linear-gradient(0deg,blue,silver,blue); 
            transition-timing-function: ease-in; transition: all 0.3s;
           }
.playrnd { width:88px;height:88px;
          } 
#showbottmenu { position: relative; left: -10px; top: -25px; 
       background-image: url(img/updn.png); width: 100px; height: 100px; border-radius: 50%; 
       float: left; transform: scale(1) rotate(180deg); background-size: 80%; background-position: center center; 
       opacity: 1; transition: 0.3s; }
#bottmenu { display: inline-block; position: fixed; left: 12px; right: 1px; 
     bottom: 2px; height: auto; text-align: center; transition: 0.3s; 
     background-color: rgba(0, 0, 0, 0.4); box-shadow: black 0px -3px 5px 3px; }       
#warnings { display:inline-block; position:relative; top:-24px; width: calc(100% - 245px); 
         overflow:visible; height:auto; min-height:64px; bottom:-100px;
          }
.partinn { display:inline-block;padding:36px;background-color:rgba(230,230,230,0.9); color:black;
      margin:24px;border-radius:16px; background-repeat:no-repeat; background-position:center center;
      background-size: 60% auto; width:calc(100% - 120px); 
      }  
.assenizator { background-position: right bottom; background-size: 60% auto;
   background-image: url(img/asseinzator.gif);  
          }
.border {
  border-image: linear-gradient(to right, #3acfd5 0%, #3a4ed5 100%);
  border-radius: 5px; /* this doesn't work */
  border-width: 36px;
  border-style: solid;
  padding: 5px;
}
.slideinn { display:inline-block;padding:16px;padding-top:8px;background-color:rgba(255,255,255,0.5);
      margin:16px;border-radius:16px; background-repeat:no-repeat; background-position:center center;
      background-size: 60% auto; transition-timing-function: ease-in; transition: all 0.1s;
      overflow:hidden; 
      }
.strelka { display:inline-block;padding:4px;height:48px;width:48px;float:right;
   background-repeat:no-repeat;background-position:center center;background-size:90% auto;
   background-image:url(img/updnw.gif); transition-timing-function: ease-in; transition: all 0.3s; }
   
/* .slideinn:active { transform:scale(0.99); }  */
 
#rMainMN { width: 450px; height: 450px; z-index: 25; 
           background-image: radial-gradient(black,rgba(0,0,0,0.4));
           background-size: 100%;
          }
#mmnn1 { width: 100px; height: 100px; float: left; top: 0px; 
         left: calc(50% - 50px); background-size: 80%; background-size:65%;
       }
#mmnn2 { width:100px;height:100px;float:left;top:-48px;left:12px; background-size:65%;
        }
#mmnn3 { width:100px;height:100px;float:right;top:-24px;left:-6px;background-size:65%;
        }
#mmnn4 { width: 100px; height: 100px; float: left; top: -24px; left: 42px;background-size:65%;
        }
#mmnn5 { width: 100px; height: 100px; top: -12px; left: 12px;background-size:65%; 
        }

.roundmenu { transition-timing-function: ease-in; transition: all 0.5s; transform: scale(0.2);
             display: inline-block;  border-radius: 50%; 
             border: 4px solid black;  position: fixed;
             box-shadow: 1px 1px 48px 12px black;
             text-align: center; /*  */
             } 
.roundmenu:active { transform: scale(1.0);

                     } 
#MLogo1 { padding: 16px;background-color:rgba(0,0,0,0.4); 
          /* background-size: auto 50%; background-repeat: no-repeat; background-position: right 8px; 
          transition-timing-function: ease-in; transition: all 0.3s;
          */
          width:100%;height:100px;top:0px;left:0px;
          border:1px dotted blue; display:inline-block; position: fixed; z-index:1;
          transition: all 0.3s ease 0s;
          }
.menuknop { display: inline-block; margin: 4px; padding: 8px; padding-left: 8px; padding-right: 8px; 
          border-radius: 3px; cursor: pointer; cursor: pointer;/* default */; border: 1px solid black;
          background-color: white; color: grey;
          box-shadow: 1px 1px 1px 1px black; 
          background-repeat: no-repeat; background-position: center center; background-size: 66% auto;
         }   
.menuknop:active { box-shadow: inset 1px 1px 1px 1px black; background-color: yellow;
                } 
.warnknop { display: inline-block; margin: 16px; padding: 12px; padding-left: 24px; padding-right: 24px; 
          border-radius: 16px; cursor: pointer; position: relative; 
          background-color: #e7e7e7; color: #464646; width: calc(100% - 90px); max-width: 800px;
          height:auto; min-height: 18px; transition-timing-function: ease-in; transition: all 0.01s; 
          background-repeat: no-repeat; 
          box-shadow: 1px 1px 8px 4px black; 
          background-position: calc(100% - 24px) 68px; background-size: auto 88px;
         }   
.warnknop:active { box-shadow: inset 1px 1px 1px 1px black; background-color: yellow;
                    transform: scale(0.98); 
                } 
#progresf { display: inline-block; padding: 24px; background-color: rgba(0,10,100,0.95); color: white;
            border: 3px solid blue; border-radius: 16px; position: fixed; 
            top: 16px; left: 188px; cursor: pointer; max-width: calc(100% - 64px);
            transition-timing-function: ease-in; transition: all 0.9s;
            width: auto; height: auto; z-index: 1000; font-weight: bold;
            box-shadow: 0px 0px 6px 6px rgba(0,0,0,0.8); 
            /* text-shadow: 2px 2px 2px white, -2px -2px 2px white; */
            } 
.rndmen { display:inline-block; border-radius:50%; border:3px ridge gray; text-align:center;
          background-position:center;background-size:65%;background-repeat:no-repeat; 
         } 
.rndmen:active { box-shadow: inset 2px 2px 2px 4px black; }
.inputback { top: 0; left: 0; z-index: 1000; width: 100%; min-height: 100%; height: 100%;
            background-color: rgba(0,0,150,0.9); background-repeat: no-repeat;
            background-position: center center; 
            display: inline-block; position: fixed; 
            color: white; text-align: center; vertical-align: middle; overflow-y:scroll;
            font-weight: normal; 
           }  
#bigload { top: 0; left: 0; z-index: 10001; width: 100%; height: 100%;
            background-color: rgba(0,0,0,0.3); display:inline-block; position: fixed; 
            color: yellow; text-align: center; vertical-align: middle; 
            font-weight: bold; font-size: 16pt;
           }           
#danetbox { background-color: rgba(0,100,0,0.2); display: none; z-index: 9999; }          
#danetmobi { display: inline-block; position: fixed; z-index: 1; text-align: center; background-color: #4169e2;
             width:calc(100% - 88px);  height: auto; top: -800px; left:44px;color: white;
             border: 5px double white; border-radius: 24px; box-shadow: 1px 1px 36px 8px black;
             transition-timing-function: ease-in; transition: all 0.6s;
              } 
.ttknops { padding: 24px; border-radius: 32px; border: 3px solid blue; margin: 8px;
          background-color: rgba(0,0,0,0.3); color: white; background-repeat: no-repeat;
          background-position: center center; background-size: auto 80%;
          cursor: pointer; width: auto; display: inline-block; 
          } 
.ttknops:active { box-shadow: 3px 3px 5px 5px black inset; text-shadow: 1px 1px 1px black; color: red;
                  } 
.ttknops:hover { background-color: rgba(0,0,0,0.5); }                  
.obknop { display: inline-block; margin: 4px; padding: 4px; padding-left: 12px; padding-right: 12px; 
          border-radius: 3px; cursor: pointer; cursor: pointer;/* default */; border: 1px solid black;
          background-color: rgba(222,222,222,1.0); color: black;
          box-shadow: 1px 1px 1px 1px black;
         }   
.obknop:active { box-shadow: inset 1px 1px 1px 1px grey;
                 text-shadow: 1px 1px 1px grey; box-shadow: inset 1px 1px 1px 1px black;
                 background-color: white;
                } 
.rndknop { display: inline-block; margin: 6px; padding: 6px; width:120px; height:120px; 
          cursor: pointer; border: 1px solid white; background-color:white;
          background-repeat: no-repeat; background-position: center center; background-size: 90% auto;
          color: black; box-shadow: 1px 1px 2px 2px black; border-radius:50%; position:relative;
         }   
.rndknop:active { box-shadow: inset 2px 2px 2px 2px black; text-shadow: 1px 1px 1px grey; 
                 transform: scale(0.95,0.95);
                }
.rndknop2 { display:inline-block; border-radius:50%; background-repeat: no-repeat; background-position: center center;
           background-size: 100%; padding: 4px; margin: 8px;
          }                                                                        
.rndknop2:active { transform: scale(0.95); }          
            
.plusknop { display:inline-block; border-radius:50%; background-repeat: no-repeat; background-position: center center;
           background-size: 80%; padding: 4px; margin: 8px; border:2px solid gray; background-color: rgba(0,0,0,0.1);
           width:150px;height:150px;background-image:url(img/plusb.gif);
           }                                                        
.plusknop:active { transform: scale(0.95); }          
.dfknop1 { padding: 16px; margin: 24px; text-align: center; vertical-align: middle;
           border: 1px solid black; background-color: rgba(255,255,255,0.5); color: black;
           }
.dfknop2, .raspknop { padding: 16px; border-radius: 8px; border: 2px solid black; margin: 6px;
          background-repeat: no-repeat; background-position: center center; background-size: auto 80%;
          cursor: pointer; width: auto; display: inline-block; box-shadow: -1px 1px 4px 2px black;
          color: blue; 
          } 
.dfknop2:active { box-shadow:none; text-shadow: 1px 1px 1px black; color: red;
                 }  

.raspknop:active { box-shadow:none; text-shadow: 1px 1px 1px black; color: red;
                 }      
.dfknop { padding: 16px; border-radius: 6px; border: 2px solid black; margin: 8px;
          background-repeat: no-repeat;
          background-position: center center; background-size: auto 80%;
          cursor: pointer; width: auto; display: inline-block; 
          } 
.dfknop:active { box-shadow:1px 1px 2px 2px black inset; text-shadow: 1px 1px 1px black; color: red;
                 }
                  
.closeknopD { width: 120px; height: 120px; border-radius: 50%; float: right; right: 10px; top: 10px;
              cursor: pointer; position: fixed; border: 0px dotted red; font-size: 42pt;
              text-align: center; vertical-align: middle; /* background-color: rgba(220,0,90,0.7); */
              background-position: center center; background-image:url(img/closew.gif);
              background-size: 100% 100%; background-color: silver; 
              z-index:1; right:12px;top:12px;
              }                        
.closeknopD:active { background-color: red; }

.fixxx { position:fixed; background-color:white; color:black; padding:16px; border-radius:18px; margin:24px; }

input:focus {  
  background-color: #adeeff;
}  
select { border-radius:16px; padding:6px; }
input:focus { background-color: #adeeff; }   
input[type="checkbox"] { transform: scale(3); }
input[type="radio"] { transform: scale(3); } 
input[type=password]{ border-radius:16px;padding:6px; }
input[type=text]{ border-radius:16px; padding:6px; }
input[type=number]{ border-radius:16px; padding:6px; }
textarea { border-radius:16px; padding:6px; resize:vertical; }
input[type=range] {
  -webkit-appearance: none;
  margin: 24px 0; 
}
input[type=range]:focus {
  outline: none;
}
/* input[type=range]::-webkit-slider-runnable-track {
  width: 90%;
  height: 6px;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: #3071a9;
  border-radius: 1.3px;
  border: 0.2px solid #010101;
  transition-timing-function: ease-in; transition: all 0.3s;
} */

input[type=range]::-webkit-slider-thumb {
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.54), 0px 0px 1px rgba(13, 13, 13, 0.54);
  border: 3px solid #000000;
  height: 77px;
  width: 77px;
  border-radius: 50%; background-color: #55ddff;
  background-image: radial-gradient(#55ddff, #0081b5, #0081b5);
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -32px;
}
/*
input[type=range]:focus::-webkit-slider-runnable-track {
  background: #367ebd; 
  transition-timing-function: ease-in; transition: all 0.3s;
} */
input[type=range]::-moz-range-track {
  width: 100%;
  height: 36px;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: black;
  border-radius: 1.3px;
  border: 0px solid #010101;   
  transition-timing-function: ease-in; transition: all 0.3s;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.54), 0px 0px 1px rgba(13, 13, 13, 0.54);
  border: 2px solid #000000;
  height: 77px;
  width: 77px;
  border-radius: 50%;
  background: #55ddff;
  cursor: pointer;       
  transition-timing-function: ease-in; transition: all 0.3s;
}

.cmn-toggle {
	position: absolute;
	margin-left: -9999px;
	visibility: hidden;
}

.cmn-toggle + label {
	display: block;
	position: relative;
	cursor: pointer;
	outline: none;
	user-select: none;
}

/* Round Style CSS Toggle Switch */

input.cmn-toggle-round + label {
	padding: 2px;
	width: 120px;
	height: 60px;
	background-color: #dddddd;
	border-radius: 60px;
}

input.cmn-toggle-round + label:before,
input.cmn-toggle-round + label:after {
	display: block;
	position: absolute;
	top: 1px;
	bottom: 1px;
	left: 1px;
	content: "";
}

input.cmn-toggle-round + label:before {
	right: 1px;
	background-color: #f1f1f1;
	border-radius: 60px;
	transition: background 0.4s;
}

input.cmn-toggle-round +label:after {
	width: 58px;
	background-color: #fff;
	border-radius: 100%;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

input.cmn-toggle-round:checked + label:before {
	background-color: #8ce196;
}

input.cmn-toggle-round:checked + label:after {
	margin-left: 60px;
}


/* Round Style CSS Toggle Switch with Flat Finish*/

input.cmn-toggle-round-flat + label {
	padding: 2px;
	width: 120px;
	height: 60px;
	background-color: #dddddd;
	border-radius: 60px;
	transition: background 0.4s;
}

input.cmn-toggle-round-flat + label:before,
input.cmn-toggle-round-flat + label:after {
	display: block;
	position: absolute;
	content: "";
}

input.cmn-toggle-round-flat + label:before {
	top: 2px;
	left: 2px;
	bottom: 2px;
	right: 2px;
	background-color: #fff;
	border-radius: 60px;
	transition: 0.4s;
}

input.cmn-toggle-round-flat + label:after {
	top: 4px;
	left: 4px;
	bottom: 4px;
	width: 52px;
	background-color: #dddddd;
	border-radius: 52px;
	transition: margin 0.4s, background 0.4s;
}

input.cmn-toggle-round-flat:checked + label {
	background-color: #8ce196;
}

input.cmn-toggle-round-flat:checked + label:after {
	margin-left: 60px;
	background-color: #8ce196;
}

.si-wrapper {
	display: inline-block;
	position: relative;
}

.speech-input {
	margin: 0;
}

.si-wrapper button {
	position: absolute;
	top: 0;
	right: 0;
	height: 64px;
	width: 64px;
	margin: 0;
	border: 0;
	padding: 0;
	background: none;
	font: 0/0 a;
  cursor:pointer;
  border: 0px dotted red;
}

.si-mic,
.si-mic:after,
.si-holder,
.si-holder:before,
.si-holder:after {
	position: absolute;
	background: #333;
}

/* Microphone icon */
.si-mic {
	display: block;
	height: 25%; /* 64px; 8px / 32px */
	top: 9.375%; /* 3px / 32px */
	left: 37.5%; /* 12px / 32px */
	right: 37.5%; /* 12px / 32px */
	-webkit-border-radius: 99px 99px 0 0;
	-moz-border-radius: 99px 99px 0 0;
	border-radius: 99px 99px 0 0;
}

.si-mic:before,
.si-mic:after,
.si-holder {
	-webkit-border-radius: 0 0 99px 99px;
	-moz-border-radius: 0 0 99px 99px;
	border-radius: 0 0 99px 99px;
}

.si-mic:before {
	position: absolute;
	z-index: 1;
	content: '';
	width: 150%; /* 12px / 8px */
	height: 137.5%; /* 11px / 8px */
	top: 100%; /* 8px / 8px */
	left: -25%; /* -2px / 8px */
	background: #fff;
}

.si-mic:after {
	z-index: 1;
	content: '';
	width: 100%; /* 10px / 10px */
	height: 100%; /* 10px / 10px */
	top: 110%; /* 11px / 10px */
	left: 0;
}

.si-holder {
	display: block;
	height: 40.625%; /* 13px / 32px */
	width: 50%; /* 16px / 32px */
	left: 25%; /* 8px / 32px */
	top: 37.5%; /* 12px / 32px */
}

.si-holder:after {
	content: '';
	width: 66.666%; /* 8px / 16px */
	height: 18.182%; /* 2px / 13px */
	bottom: -30.769%; /* -4px / 13px */
	left: 16.667%; /* 2px / 16px */
}

.si-holder:before {
	content: '';
	width: 33.333%; /* 4px / 16px */
	height: 27.273%; /* 3px / 13px */
	top: 92.308%; /* 12px / 13px */
	left: 33.333%; /* 4px / 16px */
}