* {

    padding:0;

    margin:0;

}

body {

    overflow:hidden;

}

#mon-canvas {

    background-color:#44F;

    margin:auto;

    display:block;

}

#info {

    display:none;

    background-color:#FF0;

    border:1px red solid;

    position:absolute;

    margin:1em;

    padding:0.2em 0.5em;

    border-radius:0.5em;

}

#insert {

    display:none;

    background-color:#F88;

    border:1px red solid;

    position:absolute;

}

label {

    display:block;

    clear:both;

}

legend {

    opacity:1;

    background-color:#F88;

    border:solid #F00 1px;

    border-radius:0.5em;

    padding:0 1em;

    text-shadow:2px 2px 2px #000, -2px -2px 2px #000;

}      

legend:hover {

    color:#FF0;

    cursor:default;

}

fieldset#control {

    text-shadow:2px 2px 2px #000, -2px -2px 2px #000;

    color:#FFF;

    float:left;

    position:absolute;

    top:1em;

    left:2em;

    background-color:rgba(128,128,128,0.5);

    border:solid #F00 1px;

    border-radius:0.5em;

    padding:0.2em 0.5em;

}

input {

    vertical-align:middle;

}

input[type="number"] {

    border-radius:1em;

    display:block;

    float:right;

}

#locadraw input[type="number"] {

    width:10ex;

}

#res>:not(ul), #control, #params, #info ,#addParams ,#adding, #loca{

    user-select:none;

    -khtml-user-select:none;

    -o-user-select:none;

    -moz-user-select:-moz-none;

    -webkit-user-select:none;

}

div#params {

    padding:0.2em 1.3em;

    border-radius:0.5em;

    background-color:rgba(128,128,128,0.5);

    border:solid #00F 1px;

    position:absolute;

    top:1em;

    right:2em;

    float:right;

}

div#params em {

    display:block;

    float:right;

    background-color:#88F;

    border-radius:0.5em;

    padding:0 0.5em;

    color:#FFF;

}

div#params em:nth-child[2] {

    display:inline;

}

span#loca{

        text-shadow:2px 2px 2px #000, -2px -2px 2px #000;

    color:#FFF;

    float:left;

    position:absolute;

    bottom:1em;

    left:1em;

    cursor:pointer;

    padding:0.2em 0.5em;

    padding:0 1em; 

}

div#addParams  {

        text-shadow:2px 2px 2px #000, -2px -2px 2px #000;

    color:#FFF;

    float:left;

    position:absolute;

    top:1em;

    right:2em;

    border:solid #F00 1px;

    border-radius:0.5em;

    padding:0.2em 0.5em;

    background-color:#F88; 

    padding:0 1em; 

}

div#addParams label {

    border-radius:0.5em;

    padding:0 1em;

}

div#addParams label:hover {

         color: #FF0; 

}

fieldset#locadraw {

    color:#FFF;

    float:left;

    position:absolute;

    bottom:1em;

    left:1em;

    background-color:rgba(128,128,128,0.5);

    border:solid #F00 1px;

    border-radius:0.5em;

    padding:0 1em;

    visibility:hidden;

}

fieldset#adding {

    color:#FFF;

    float:left;

    position:absolute;

    top:1em;

    right:2em;

    background-color:rgba(128,128,128,0.5);

    border:solid #F00 1px;

    border-radius:0.5em;

    padding:0 1em;

    visibility: hidden;

}

form#form_param label {

    margin-right: 15px;

    width: 0.5em;

    padding:0.3em 0.5em;

    min-height: 1px;

    text-align: left;

    text-shadow:2px 2px 2px #000, -2px -2px 2px #000;

}

input:focus {

  border-color: rgba(82, 168, 236, 0.75);

  -moz-box-shadow: 0 0 8px rgba(82, 168, 236, 0.5);

  -webkit-box-shadow: 0 0 8px rgba(82, 168, 236, 0.5);

  box-shadow: 0 0 8px rgba(82, 168, 236, 0.5);

}

.correct {

  border-color: rgba(68, 191, 68, 0.75);

}

.correct:focus {

  border-color: rgba(68, 191, 68, 0.75);

  -moz-box-shadow: 0 0 8px rgba(68, 191, 68, 0.5);

  -webkit-box-shadow: 0 0 8px rgba(68, 191, 68, 0.5);

  box-shadow: 0 0 8px rgba(68, 191, 68, 0.5);

}

.incorrect {

  border-color: rgba(191, 68, 68, 0.75);

}

.incorrect:focus {

  border-color: rgba(191, 68, 68, 0.75);

  -moz-box-shadow: 0 0 8px rgba(191, 68, 68, 0.5);

  -webkit-box-shadow: 0 0 8px rgba(191, 68, 68, 0.5);

  box-shadow: 0 0 8px rgba(191, 68, 68, 0.5);

} 

/*p#chsignInfo {

color:#F00;

font-size: 12px;

margin:1.02em 1em;

background-color: #CCC;

border-radius: 4px;

padding:2px;

}*/

.answer {

  margin:0.2em 0;

  display:block;

}

.answer input {

  border-radius:0.5rem;

  padding:0.2em 0.7em;

}

.form_button {

    background-color:rgba(128,128,128,0.9);

    /*background: url(button.png) no-repeat top;*/

    display:inline-block;

}

.validators {

    text-align:center;

    background-color:#CCC;

    border:solid 1px #F55;

    border-width:0 0 1px 0;

    display:none;

}

#res {

    padding:0.2em 0.4em;

    color:#FF8;

    position:absolute;

    bottom:1em;

    right:2em;

    background-color:rgba(0,0,0,0.3);

    border:solid #FFF 1px;

}

#res:empty {padding:0;}

#res li {

    list-style-type: none;

    color:#FFF;

    background-color:rgba(100,0,0,0.5);

}