@font-face {font-family: Vazir;font-style: normal;font-weight: normal;src: url('fonts/Vazir.eot');src: url('fonts/Vazir.eot?#iefix') format('embedded-opentype'), url('fonts/Vazir.woff2') format('woff2'), url('fonts/Vazir.woff') format('woff'),  url('fonts/Vazir.ttf') format('truetype');}
@font-face {font-family: Vazir;font-style: normal;font-weight: bold;src: url('fonts/Vazir-Bold.eot');src: url('fonts/Vazir-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/Vazir-Bold.woff2') format('woff2'), url('fonts/Vazir-Bold.woff') format('woff'), url('fonts/Vazir-Bold.ttf') format('truetype');}
body {background-color: #a5a5a5 ;margin: 30px;font-family: 'Vazir',"tahoma"; font-size:1.3em}
.main {text-align:center;}
.left {float:left;padding-left:15%}
.right {float:right;padding-right:15%}

table.center { margin-left: auto; margin-right: auto;}
.btn-one {  border-color: #f1c40f;  color: #333;  box-shadow: 0 0 0 0 #f1c40f, inset 0 0 100px 28px #f1c40f; transition: box-shadow 300ms ease-in-out, color 100ms ease-in-out;}
.btn-one:hover { box-shadow: 0 0 40px 0 #f1c40f, inset 0 0 25px 0 #f1c40f;  color: #f1c40f;}  
.buttons {  display: flex; justify-content: space-around;}
.btn { font-family: 'Vazir',"tahoma"; font-size: 1.2rem; background: none;  border: 0.185em solid #ececec;  padding: 0.7em 2.1em;  color: #000;  border-radius: 0.5em; cursor: pointer;}
.btn:focus { outline: none;}
.round { border-radius: 24px;}
.square {border-radius: 0px;}
#firstNumber, #firstNumber2 {border-radius: 9px; border-color: #f1c40f;padding:8px; box-shadow: 0 0 0 0 #f1c40f, inset 0 0 200px 28px #f1c40f;
transition: box-shadow 300ms ease-in-out, color 300ms ease-in-out;font-family: 'Vazir',"tahoma";
text-align: center;font-size:0.8em;margin:20px 0}
#firstNumber:hover , #firstNumber2:hover{ box-shadow: 0 0 40px 0 #f1c40f, inset 0 0 25px 0 #f1c40f;  color: #f1c40f;} 
/*** USWITCH SELECT ** */
.us-form select {position: relative; text-align:center;direction: rtl;
  -webkit-appearance: button;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;vertical-align: middle;height: 2.2em;margin: 2px;padding: 0.3em 0.6em;background: white;
  border: 1px solid #aaaaaa;border-radius: 0.3em;box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.4);font-size: 0.9em;font-weight: normal;overflow: hidden;text-shadow: 0 1px 0 white;
  -webkit-transition: box-shadow 200ms, border-color 200ms;-moz-transition: box-shadow 200ms, border-color 200ms;
  transition: box-shadow 200ms, border-color 200ms; white-space: nowrap; }
.us-form select option {text-shadow: none; }
.us-form select:disabled, .us-form select:disabled:hover {color: #cccccc !important;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important; }
.us-form select.error {color: #bf212e;border-color: #bf212e; }
.us-form select.input-big {font-size: 17px; }
.us-form.error select, .us-form .error select {color: #bf212e;border-color: #bf212e; }
.boxshadow .us-form select:not([size]):focus {outline: none;border-color: #66ccff;box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.4), 0 0 4px #66ccff; }
.boxshadow.no-touch .us-form select:not([size]):hover {box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.4), 0 0 0 3px #ffff88; }
.cssgradients .us-form select:not([size]) {
  border-color: #ececec;background-color: #ececec;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #ececec));
  background-image: -webkit-linear-gradient(top, white, #ececec);
  background-image: -moz-linear-gradient(top, white, #ececec);
  background-image: -ms-linear-gradient(top, white, #ececec);
  background-image: -o-linear-gradient(top, white, #ececec);
  background-image: linear-gradient(top, white, #ececec); }
.cssgradients .us-form select:not([size]).focus {border-color: #66ccff; }
.cssgradients .us-form select:not([size]).error {border-color: #bf212e; }
.cssgradients .us-form.error select, .cssgradients .us-form .error select {border-color: #bf212e; }
/* ie9/10 */
@media screen and (min-width: 0 \0) {
  .us-form select:not([size])::-ms-expand {background: transparent;border: none;width: 12px;padding-left: 5px;   }
  .boxshadow .us-form select:not([size]) {box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.4);  }
  .boxshadow .us-form select:not([size]):focus {box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.4), 0 0 4px #66ccff; }
  .no-touch.boxshadow .us-form select:not([size]):hover {border-color: white;box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.4), 0 0 0 3px #ffff88; } }
/* firefox - use a wrap */
@-moz-document url-prefix() {.us-form select:not([size]) {max-width: 999px !important; }
.us-form option {padding-right: 10px; }
.us-form-select-wrap {position: relative;display: inline-block;vertical-align: baseline;font-size: 0.9em; }
.us-form-select-wrap.input-big {font-size: 17px; }
.us-form-select-wrap:before {content: "";position: absolute;right: 0.5em;top: 0.3em;z-index: 11;bottom: 0.3em;width: 1.55em;
    background-color: #ececec;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #ececec));
    background-image: -webkit-linear-gradient(top, white, #ececec);
    background-image: -moz-linear-gradient(top, white, #ececec);
    background-image: -ms-linear-gradient(top, white, #ececec);
    background-image: -o-linear-gradient(top, white, #ececec);
    background-image: linear-gradient(top, white, #ececec); pointer-events: none; }
  .us-form-select-wrap:after {content: "\25bc";position: absolute;right: 5px;top: 0.9em;bottom: 0.8em;z-index: 12;font-size: 0.6em;line-height: 1;padding: 0.5em 4px 0;
    color: #999999;border-left: 1px solid white;box-shadow: -1px 0 0 #dddddd;text-shadow: 0 1px 0 white;pointer-events: none; } }
/* webkit */
@media all and (-webkit-min-device-pixel-ratio: 0) {
  .us-form select:not([size]) { padding-right: 30px; }
  .boxshadow .us-form select:not([size]) {background-repeat: no-repeat, repeat;background-position: 100% 50%, 0 0; font-family: 'Vazir',"tahoma"; }
  .boxshadow .us-form select:not([size]).error {color: #bf212e;border-color: #bf212e;  }
  .boxshadow .us-form.error select:not([size]), .boxshadow .us-form .error select:not([size]) {color: #bf212e;border-color: #bf212e;  }
  .boxshadow .us-form select:not([size]):focus {box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.4), 0 0 4px #66ccff; }
  .no-touch.boxshadow .us-form select:not([size]):hover {border-color: #c8c8c8;box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.4), 0 0 0 3px #ffff88; } }
/* multiple line select control (eg <select size="10">) */
.us-form select[size] {
  -webkit-appearance: none;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;box-sizing: content-box;display: inline-block;height: auto;margin: 2px;
  padding: 0.3em 0 0.3em 0.4em;border: 1px solid #c4c0c0;border-radius: 2px;box-shadow: 0px 3px 2px #eeeeee inset;font-size: 0.85em !important;
  -webkit-transition: box-shadow 200ms, border-color 200ms;
  -moz-transition: box-shadow 200ms, border-color 200ms;
  -ms-transition: box-shadow 200ms, border-color 200ms;
  transition: box-shadow 200ms, border-color 200ms;vertical-align: middle;overflow: scroll; }
.us-form select[size] .error {border-color: #bf212e; }
.us-form select[size]:focus {outline: none;color: #333333;border-color: #66ccff;box-shadow: 1px 3px 2px #eeeeee inset, 0 0 4px #66ccff; }
.us-form select[size]:focus:hover {outline: none;color: #333333;border-color: #66ccff;box-shadow: 1px 3px 2px #eeeeee inset, 0 0 4px #66ccff; }
.us-form.error select[size], .us-form .error select[size] {border-color: #bf212e;color: inherit; }
.no-touch .us-form select[size]:hover {border-color: #c4c0c0;box-shadow: 1px 3px 2px #eeeeee inset, 0 0 0 2px #ffff88; }
.us-form select.hidden {display: none; }
th,td {vertical-align:baseline;padding:10px;font-weight:normal;}
.toprow th {border-right:none;border-bottom:1px solid #eee;}
th,.toprow th:first-child {border-right:1px solid #eee;}
.darktest td, .darktest th {color:#fff;background:#666;}
.error td, .error th {color:#900;background:#FFFFE5;}