:root {
  color-scheme: light;
}

*{margin: 0; padding: 0}

body{font:normal 1em "Montserrat", serif; background: #fff !important; color:#333}

header a{display: flex; justify-content: space-between; padding: 10px 20px; flex-wrap: wrap; align-items: center}
header img{max-width: 250px}
header a{text-decoration: none; color:#324697; font-size: 0.5em}

section{background: #fff; padding: 3em}


section {
  background: #fff !important;
}
section:nth-of-type(2),
section:nth-of-type(3) {
  background: #EDF1FF !important;
}

section:nth-child(2){background: #EDF1FF; box-shadow: inset 0px 10px 15px -3px rgba(0,0,0,0.1); padding: 3em}
section:nth-child(3){background: #EDF1FF; padding: 0; margin-bottom: -5px}
section:nth-child(4) h2{color:#71CBF4}
.elementor-shape-fill{fill: #fff}

#action{ padding-bottom: 3em; display: flex; justify-content: center}
#action button{background: #324697; color:#fff; border: none; padding: 10px 20px; margin:2px; font:normal 1em "Montserrat", serif; float: left;min-width: 150px; border-radius: 3px; cursor: pointer   }
#action button svg{max-width: 20px; display: inline-block; float: left; margin-right: 10px }
#action button span{ float: left }
#action button#stopBtn{border:1px solid #324697; background: none; color:#324697; }
#action button#stopBtn svg{max-height: 20px; margin-left:15px }

#voiceCanvas{display: block; margin: 0 auto; border:1px solid #ccc; max-width: 400px; width: 100%; height: 100px; border-radius: 3px;}

  
#output, #output_ecran{white-space: pre-wrap; border:1px solid #ccc; padding:10px; margin:20px 0; height:300px; overflow:auto;}

.terminalpaiement, .connection{background: #EDF1FF; padding: 10px;  border-radius: 3px; margin: 5px 0}
.terminalpaiement h3, .connection h3{margin-bottom: 10px }
.terminalpaiement input, .connection input{padding: 12px 10px; border: none; margin:2px;}
#payerbt, #connectbt{background: #324697; color:#fff; border: none; padding: 10px 20px; margin:2px; font:normal 1em "Montserrat", serif; min-width: 150px; border-radius: 3px; cursor: pointer   }