/* Generic form fields */

fieldset.elist, input[type="text"] input[type="number"] input[type="date"], textarea, select, option, fieldset.elist ul, fieldset.elist > legend, fieldset.elist input[type="text"] input[type="number"] input[type="date"] fieldset.elist > legend:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;}

form { 
  background: #fff; color: #000; /* background: #eef;*/
  border: solid thin #fff; /* #e0e0ff*/
	border-top-left-radius:1.2em;
  border-top-right-radius:1.2em;
	border-bottom-left-radius:1.2em;
	border-bottom-right-radius:1.2em; }

#wrapper { 
  margin: 2em 0 0 0; 
}

#bloc1, #bloc2 {
    display:inline;
}
#bloc1 {
  float: left;
}


input[type="text"], input[type="number"], input[type="date"] {
  width: 100%;
  padding: 8px 10px;
  margin: .2rem;
  box-sizing: border-box;
  font: 2rem 'Fira Sans', sans-serif;
  }

.radio-input {
   display: inline-block;
    vertical-align: top;
}
.radio-label {
   /*display: inline-block;*/
    vertical-align: top;
    /*margin-right: 3%;*/
}
  /* 500, 200 20 */
textarea {
  width: 400px;
  height: 170px;
  padding: 20px;
}

textarea, input[type="text"], input[type="number"], input[type="date"], fieldset.elist ul, select, fieldset.elist > legend {
  border: 2px #cccccc solid;
  border-radius: 6px;
}

  /* 32  14*/
input[type="text"], input[type="number"], input[type="date"], fieldset.elist, select, fieldset.elist > legend {
  height: 26px;
  font-family: Tahoma;
  font-size: 14px;
}

input[type="text"]:hover, input[type="number"], input[type="date"]:hover, textarea:hover, select:hover, fieldset.elist:hover > legend {
  background-color: #ddddff;}

  /* 4 20 */
select {
  padding: 4px 20px;}

option {
  height: 30px;
  padding: 5px 4px;}

/* ffcccc */
option:not(:checked), textarea:focus {
  background-color: #EDFFF6;}

  /* 28 -> 20*/
fieldset.elist > legend:after, fieldset.elist label {
  height: 28px;}

  /* 316 */
input[type="text"], input[type="number"], input[type="date"] fieldset.elist {
  width: 316px;}

/* ffcccc */
input[type="text"]:focus {
  /*background: #EDFFF6 url("data:image/gif;base64,R0lGODlhEAAQANU5APnoxuvr6+uxPdvb2+rq6ri4uO7qxunp6dPT06SHV+/rx8vLy+nezLO0sbe3t9Ksas+qaaCEV8rKyp2dnf39/QAAAK6ursifZHFxcc/Qzu3mxYyMjExCJnV1dc6maO7u7o+Pj2tXNoaGhtfDpKCDVu3lxM+tcaKEV9bW1qOFVWNjY8KrisTExNra2nBbObGxsby8vO/mu7Kyso9ZAuzs7MSgAIiKhf///8zMzP///wAAAAAAAAAAAAAAAAAAAAAAACH5BAEAADkALAAAAAAQABAAAAaXwJxwSCwOYzWkMpkkZmoAqDQaJdpqAqw2m53NRjlboAarFczomcE0C99o8DgNMVM8Tm3bbYDr9x11DwkzDG5yc2oQJIRCenx/MxoeETM2Q3pxATMlF4MYlo17OAsdLispMyAioIY0BzMcITMTKBasjgssFTMqGxItMjYUoTQBBAQHxgE0wZcfMtDRMi/QrA022NnaNg1CQQA7") no-repeat 2px center !important;*/
}

/* ccaaaa */
input[type="text"]:focus, input[type="number"], input[type="date"]:focus, textarea:focus, select:focus, fieldset.elist > legend {
  border: 3px #555 solid; /* 9FCC94 */
}
  
  /* radius 2, border 2, color af3333 */
fieldset {
  border: 1px #044C8C solid;
  border-radius: 10px;
}

/* Editable [pseudo]select (i.e. fieldsets with [class=elist]) */

fieldset.elist {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  overflow: visible;
  padding: 0;
  margin: 0;
  border: none;}

fieldset.elist ul {
  position: absolute;
  width: 100%;
  max-height: 320px;
  padding: 0;
  margin: 0;
  overflow: hidden;
  background-color: transparent;}

  /* Border 2px */
fieldset.elist:hover ul {
  background-color: #ffffff;
  border: 1px #af3333 solid;
  left: 2px;
  overflow: auto;}

fieldset.elist ul > li {
  list-style-type: none;
  background-color: transparent;}

fieldset.elist label {
  display: none;
  width: 100%;}

fieldset.elist input[type="text"] input[type="number"] input[type="date"] {
  width: 100%;
  height: 30px;
  line-height: 30px;
  border: none;
  background-color: transparent;
  border-radius: 0;}

fieldset.elist > legend {
  display: block;
  margin: 0;
  padding: 0 0 0 5px;
  position: absolute;
  width: 100%;
  cursor: default;
  background-color: #ccffcc;
  line-height: 30px; /* 30 */
  font-style: italic;}

fieldset.elist:hover > legend {
  position: relative;
  overflow: hidden;}

fieldset.elist > legend:after {
  width: 20px;
  content: "\2335";
  float: right;
  text-align: center;
  border-left: 2px #cccccc solid;
  font-style: normal;
  cursor: default;}

fieldset.elist:hover > legend:after {
  background-color: #99ff99;}

fieldset.elist ul input[type="radio"] {
  display: none;}

fieldset.elist input[type="radio"]:checked ~ label {
  display: block;
  width: 292px;
  background-color: #ffffff;}

fieldset.elist:hover input[type="radio"]:checked ~ label {
  width: 100%;}

fieldset.elist:hover label {
  display: block;
  height: 100%;} /* 100 */

fieldset.elist label:hover {
  color: #ffffff;
  background-color: #ebf3f8 !important;}

fieldset.elist:hover input[type="radio"]:checked ~ label {
  background-color: #aaaaaa;}