* { margin: 0; padding: 0 }
body { background-image: url("http://etapes.com/assets/stripe-4479359c6f28134742a6572ca1fffae0.png"); /*  background-position: 310px -30px;
  background-repeat: repeat;
  background-size: auto auto;
*/ font-family: "Roboto", sans-serif; overflow-x: hidden; width: 100vw; }
h1 { background-color: black; width: 70px; text-align: center; height: 70px; border-radius: 70px; color: white; font-size: 14px; line-height: 70px; text-transform: uppercase; font-weight: 400; margin: auto; }
h1 span { font-weight: 100; }
body.login { padding-top: 3em; text-align: center; }
body.login input[type='text'], body.login input[type='password'] { border-radius: 3px; width: 12em; display: block; border: 1px solid silver; margin: 1em auto; padding: 0.3em 1em; }
div#main { min-height:100vh; background-color: white; margin: auto; overflow: scroll; padding-bottom: 1em; width: 1200px; }
div.basdepage { background-image: url(../img/bas-page.png); width: 1200px; height: 300px; background-repeat: no-repeat; background-size: cover; margin: 0 auto; }
p#userid { text-align: right; padding: 6px; font-size: 12px; }
p#userid a { display: inline-block; background: black; color: white; padding: 3px 8px; text-decoration: none; margin-left: 1em; border-radius: 3px; font-size: 11px; -webkit-transition: all 0.3s; transition: all 0.3s; }
p#userid a:hover { background-color: gray; color: black; }
#main section { display: block; margin: 3em 2em; }
#main section table { border-collapse: collapse; border: 1px solid black; margin: auto; font-size: 10px; width: 100%; }
#main section#neworder table { border-collapse: collapse; border:none;}

#main section legend { font-size: 18px; font-weight: normal; padding: 0 1em; text-transform: uppercase; }
#main section#neworder table td, #main section#neworder table th { border:none; background: white; padding: 5px; }
#main section table td, #main section table th { border:1px solid #777; padding: 5px; }
input#validNewOrdr { border: 1px solid black; letter-spacing: 1px; background: black; color: white; text-transform: uppercase; font-size: 12px; display: block; padding: 2px 10px; border-radius: 3px; margin: 10px auto; -webkit-transition: all 0.3s; transition: all 0.3s; cursor: pointer; box-sizing: border-box; }
input[type="button"] { border: 1px solid black; background: black; color: white; text-transform: uppercase; font-size: 9px; display: inline-block; padding: 2px 10px; border-radius: 3px; -webkit-transition: all 0.3s; transition: all 0.3s; cursor: pointer; margin: 0 1em; letter-spacing: 1px; box-sizing: border-box; }
input#validNewOrdr:hover, input[type="button"]:hover { background: #eee; color: black; }
.date_picker { display: block; margin: auto; text-align: center; width: 6em; }
td.col_product { width: 172px; text-align: center; }
input#workload { display: block; margin: auto; width: 40px; text-align: center; }
input#emergency { display: block; margin: auto; position: relative; bottom: 1px; right: 2px; }
td, th { text-align: center; }
input.reset { opacity: 0; position: absolute; }
fieldset { padding: 1em; border: 2px solid black; }
td.emergency { color: red; font-weight: bold; }
aside#suivi { position: fixed; background-color: rgba(0,0,0,0.8); height: 100vh; width: 100vw; left: 0; transition: all 0.3s; top: -100vh; }
aside#suivi.active { top: 0; }
#suivi > form { background: rgba(255,255,255,1); display: block; height: 92vh; margin: 2vh auto; max-width: 800px; overflow: auto; padding: 2vh; width: 90%; }
#suivi > form h2 { text-align: center; position: relative; line-height: 40px; height: 40px; margin-bottom: 3em; }
#formSuivi > fieldset { margin: 1em auto; }
#formSuivi fieldset p { font-size: 14px; font-weight: normal; position: relative; line-height: 18px; }
#formSuivi fieldset#infos p, #formSuivi fieldset#customer_fb p { padding: 10px 0; }
#formSuivi fieldset p.pcomment { height: 140px; }
#formSuivi fieldset p span, #formSuivi fieldset p input[type="text"], #formSuivi fieldset p textarea, #formSuivi fieldset p select { font-weight: normal; display: inline-block; position: absolute; left: 170px; }
#formSuivi fieldset p input[type="text"] { text-align: center; padding: 1px 10px }
#formSuivi fieldset legend { padding: 0 1em; text-transform: uppercase; }
#formSuivi h2 a { cursor: pointer; border: 1px solid black; position: absolute; top: 0; right: 0; width: 40px; height: 40px; border-radius: 50px; line-height: 40px; text-align: center; font-size: 24px; font-weight: 100; transition: all 0.3s; }
#formSuivi h2 a:hover { background-color: black; color: white; }
#formSuivi input[type="checkbox"] { display: inline-block; margin-right: 1em; position: relative; bottom: 1px; }
#formSuivi fieldset#updwrkld p { line-height: 22px; cursor: pointer; }
#formSuivi fieldset#updwrkld p label { cursor: pointer; }
#formSuivi fieldset p textarea { height: 140px; width: calc( 100% - 170px ); }
#formSuivi > fieldset#resume { float: left; margin-right: 20px; width: 350px; margin-top: 0; }
#formSuivi > fieldset#updwrkld { padding: 62px; margin-top: 0; }
#updwrkld > legend { margin-left: -47px; }
#departure > p { float: left; width: 50%; }
#formSuivi > input#btnUpload { background: black none repeat scroll 0 0; border: medium none; color: white; display: block; margin: 5em auto 3em; padding: 5px 2em; text-transform: uppercase; margin-top: 5em; border-radius: 3px; transition: all 0.3s; border: 1px solid black; cursor: pointer; }
#formSuivi > input#btnUpload:hover { background-color: white; color: black; }
#main div#map { height: 825px; display: block; margin: auto; background-image: url(../img/europe.svg); background-size: cover; }
#liste div#filtres { background: #eee none repeat scroll 0 0; border-radius: 18px; margin-bottom: 1em; padding: 0.5em 1em; }
#liste div#filtres button { background: #868686 none repeat scroll 0 0; border: 1px solid black; border-radius: 3px; box-sizing: border-box; color: white; cursor: pointer; display: inline-block; font-size: 11px; letter-spacing: 1px; margin: 0 1em; padding: 2px 10px; text-transform: uppercase; transition: all 0.3s ease 0s; position: relative; bottom: 3px; }
#liste div#filtres span { font-size: 11px; }
#liste div#filtres button:hover { background: white; color: black; }
#filtres > form { text-align: center; }
tr.closed { background: #eee; color: #afafaf; text-decoration: line-through; }
nav ul li { display: inline-block; padding: 0 0.5em; list-style-type: none; color: #d0d0d0; transition: all 0.2s; border: 5px solid #d0d0d0; border-bottom: none; margin: 0 0.5em; }
nav ul li.active, nav ul li:hover { border: 5px solid black; border-bottom: none; box-sizing: border-box; padding-bottom: 4px; color: black; }
nav ul { border-bottom: 5px solid black; margin-top: 1em; text-align: left; }
nav li a { transition: all 0.2s; color: #7F7E7E; font-size: 11px; letter-spacing: 2px; text-decoration: none; text-transform: uppercase; }
nav li.active a, nav li:hover a { color: black; font-size: 11px; letter-spacing: 2px; text-decoration: none; text-transform: uppercase; }
section#neworder * { font-size: 1.07em; }
#neworder > fieldset { border-width: 5px; }
#neworder > fieldset input, #neworder > fieldset select { background: black; color: white; padding: 5px; border: none; }
input.productnumber { display: inline-block; margin-top: 2px; text-align: center; width: 60px; }
#neworder > fieldset input, #neworder > fieldset select { background: #e5e5e5 none repeat scroll 0 0; border: medium none; color: black; font-weight: bold; padding: 5px; }
#neworder fieldset table { background-color: #eee;  
}
#neworder fieldset input#validNewOrdr { background: black none repeat scroll 0 0; border: 1px solid black; border-radius: 300px; box-sizing: border-box; color: white; cursor: pointer; display: block; font-size: 9px; height: 65px; letter-spacing: 2px; margin: 0 auto; padding: 2px 2px; text-transform: uppercase; transition: all 0.3s ease 0s; }

#neworder fieldset input#validNewOrdr:hover { border-color:black; color:black; background:white; }
#main section fieldset p {
  margin: 1em 0;
  padding: 13px 1em;
  background:#dedede;
  box-sizing: border-box;
  text-align:center;
  letter-spacing:1px;
  font-size:12px;
  text-transform:uppercase;
}
#main section fieldset p:nth-child(2) { margin-top:2em; border-radius:20px;}
#main section fieldset p:nth-child(3) { float:right; background-color:#33dd33; border-radius:0 20px 20px 0;}
#main section fieldset p:nth-child(4) { float:left; background-color:#bbffbb; margin-bottom:4em; border-radius:20px 0 0 20px;}
#main section fieldset hr { content:""; clear:both; margin-top:2em; display:block; transition:all 0.6s; border:1px solid black; background:black;}