* {
    -webkit-user-select: none;  /* Support pour Chrome et Safari */
    -moz-user-select: none;     /* Support pour Firefox */
    -ms-user-select: none;      /* Support pour IE 10+ et Edge */
    user-select: none;          /* Standard syntaxe */
}
* {font-family: "Indie Flower", cursive; font-weight: 400; font-style: normal;}
body {padding: 0 1em;}
h1 {text-align: center; font-size: 2.25em; text-decoration: underline; margin: 0.33em 0;}
strong {font-weight: bold; color: #9D5C4B;}
button {display: flex; border:2px solid #000000; border-radius: 0.35em; font-size: 1.5em; background:#fff; color:#000;padding:0.2em 1em; margin:0 1em;max-width: 10em;}
button:hover {cursor: pointer; border-color:#9D5C4B; color:#9D5C4B;}


#main-content {display: flex; flex-direction: column; justify-content: center; align-items: stretch; width: 100%;}
#main-actions,
#below-actions > div,
#main-vision {display: flex; flex-direction: row; justify-content: center; align-items: center; padding: 1em 0; position: relative;}
#below-actions {display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 1em 0; position: relative;}

#speech {position:absolute;top:-4em;width:18em;min-height:5em;left:50%;right:1em;border:2px solid #000000; border-radius: 0.35em;background: #fff;transform: translate(-50%, 0);z-index: 100;padding:0em 0.5em;display: none;}
#speech p {font-size:0.9em;font-family: "Kode Mono", monospace;color:#111;margin:0.5em 0;overflow-wrap: break-word;hyphens: manual; word-wrap: break-word; line-height: 1.5;white-space:preserve-breaks;}
#speech p strong {font-weight: 700; color: #9D5C4B;font-size:0.9em;font-family: "Kode Mono", monospace;margin:0;}

#below-actions input {max-width: 18em;line-height: 2;}
#below-actions input, #below-actions button{display: flex; border:2px solid #000000; border-radius: 0.35em; font-size: 1em; background:#fff; color:#000;padding:0.2em 0.5em; margin:0 0.25em;}
#below-actions a {margin: 0 0.25em; color: #5b352a;}
#below-actions a:hover, #below-actions button:hover{color: #9D5C4B;border-color: #9D5C4B;}
#below-actions input,
#below-actions span,
#below-actions a,
#below-actions p{font-family: "Kode Mono", monospace; font-size: 0.85em;}
#below-actions .error{color:red;}
#public-address {width: 17em;}
#canvas {border:2px solid #000000; border-radius: 0.35em; position: relative; max-width: 400px; display:flex; width: 100%;}

.loading{position: relative; display: block; padding: 0.25em 0.5em; color:white; border:2px solid #000000; border-radius: 0.35em;background: #9D5C4BB8;}
.loading span{position: relative;z-index: 2;}
.loading:before{content:'';position: absolute;bottom: 0;left:0;top:0;background: #9D5C4B;z-index: 1;}