html, body {
  height: 99%;
  margin: 0px;
  width: 100%;
}

H4 {
  background-color:#EEEEFF;
  font-size: 23px;
  margin-top: 0;
  margin-bottom: 5px;
}

font.doc{
  color: #7D237C;
  font-size: 25px;

}

font.page{
  color: #7D237C;
  font-size: 25px;

}

font.group{
  color: #7D237C;
  font-size: 21px;
}

font.line{
  color: #7D237C;
  font-size: 13px;
}

font.field{
  color: #7D237C;
  font-size: 14px;
}

font.xml-text{
  font-size: 14px;
  font-family:monospace;
}

font.element{
  color: #7D237C;
}

font.attribute{
  color: #8F4C19;
}

font.page-name{
  color: grey;
}

font.line-name{
  color: #F48E93;
}

font.field-name{
  color: #18229F;
}

font.group-name{
  color: #FF0000;
  font-weight: bold;
}

button {
  box-shadow:inset 0px 1px 0px 0px #fff6af;
  	background-color:#FEF9E7;
  	border-radius:6px;
  	border:1px solid #333029;
  	display:inline-block;
  	cursor:pointer;
  	color:#000000;
  	font-family:Verdana;
  	font-size:10px;
  	padding:3px 6px;
  	text-decoration:none;
  	text-shadow:0px 1px 0px #ffee66;
}
button:hover {
	background-color:#F9E79F;
}
button:active {
  position:relative;
	top:1px;
}

.main-container {
  margin-left: 0%;
  margin-right: 0%;
  overflow: scroll;
  width: 100%;
  height: calc(100% - 100px);
}

.pressed-button{
  border-style: inset;
  background-color: #DCDCDC;
}

.normal-button{
  border-style: outset;
  background-color: #C1C0C0;
}

.xml_doc{
  display: inline-block;
  margin-left:5px;
}

.xml_page{
  background-color:#F8F8F8;
  margin-left:15px;
}

.xml_field{
  margin-left:20px;
  white-space: pre;
}

.xml_group{
  background-color:#FFCCCC;
  margin-left:20px;
}

.xml_line{
  margin-right:15px;
  background-color:#F5F5F5;
  margin-left:20px;
}

.param_field{
  margin-left:20px;
  white-space: pre;
  color: #18229F;
}

.param_var_cond{
  margin-left:20px;
  white-space: pre;
  color: blue;
}

.param_table{
  margin-left:20px;
  white-space: pre;
  color: red;
}
.param_list{
  margin-left:20px;
  white-space: pre;
  color: red;
}

.param_items{
  margin-left:20px;
  white-space: pre;
  color: silver;
}

.param_header_footer_aggregate{
  margin-left:20px;
  white-space: pre;
  color: gray;
}

.param_line{
  margin-left:20px;
  white-space: pre;
  color: #F48E93;
}

.param_doc{
  margin-left:20px;
  white-space: pre;
  color: grey;
}

.param_param{

  margin-left:20px;
  white-space: pre;
  color: black;
}

.param_comment{
  margin-left:20px;
  white-space: pre;
  color: green;
}

.param_xsl{
  margin-left:20px;
  white-space: pre;
}


#workflow-iframe {
  overflow: hidden;
  margin-left: 2%;
  margin-right: 2%;
  width: 96%;
  height: 90%;
  height: calc(100% - 10px);
  border:3px double black;
}

#training-iframe {
  overflow: hidden;
  margin-left: 2%;
  margin-right: 2%;
  width: 96%;
  height: 90%;
  height: calc(100% - 10px);
  border:3px simple black;
}


#entete {
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  width: 90%;
  height: 90px;
}

#form-iframe {
  display: inline;
  width: 100%;
  height: 100%;
  border: 0px;
}

#form-container {
  float: left;
  margin-left: 1%;
  margin-right: 1%;
  overflow: scroll;
  width: 48%;
  height: 100%;
}

#result-container {
  float: left;
  margin-top: 10px;
  margin-left: 0%;
  margin-right: 1%;
  overflow: hidden;
  width: 49%;
  height: calc(100% - 10px);
}

#result-div {
  float: left;
  overflow: hidden;
  width: 100%;
  height: 95%;
  display: block;
}

#result-iframe {
  float: left;
  overflow: hidden;
  width: 96%;
  height: calc(95% - 20px);
  border: 1px solid black;
  display: none;
}

#result-download {
  width: 99%;
  height: 25px;
}

#result-xml {
  float: left;
  overflow: scroll;
  margin-top: 10px;
  margin-left: 0%;
  margin-right: 1%;
  width: 98%;
  height: calc(100% - 60px);
  border: 1px solid black;
  white-space: nowrap;
}

#result-xml2 {
  float: left;
  overflow: scroll;
  margin-top: 10px;
  margin-left: 0%;
  margin-right: 1%;
  width: 48%;
  height: calc(100% - 40px);
  border: 1px solid black;
  white-space: nowrap;
}

#result-expander {
  float: left;
  overflow: scroll;
  margin-top: 10px;
  margin-left: 0%;
  margin-right: 1%;
  width: 48%;
  height: calc(100% - 40px);
  border: 1px solid black;
  white-space: nowrap;
}

#result-table {
  float: left;
  overflow: scroll;
  margin-top: 10px;
  margin-left: 0%;
  margin-right: 1%;
  width: 48%;
  height: calc(100% - 40px);
  border: 1px solid black;
  white-space: nowrap;
}

#server-info {
  background-color: ALICEBLUE;
  margin-left: 5%;
  border:1px dotted black;
  padding:10px 10px;
  width: 90%;
}

#info-facture {
  background-color: ALICEBLUE;
  margin-left: 5%;
  border:1px dotted black;
  padding:10px 10px;
  width: 90%;
}

#info-wf {
  background-color: ALICEBLUE;
  margin-left: 5%;
  border:1px dotted black;
  padding:10px 10px;
  width: 90%;
}

#dblists {
  width: 96%;
  height: 50px;
  font-size: 14px;
  font-family: monospace;
  //float: left;
  overflow: hidden;
  border:1px dotted black;
  text-align: left;
  white-space: nowrap;
}

#docrupt {
  width: 200px;
  height: 20px;
  font-size: 14px;
  font-family: monospace;
  //float: left;
  overflow: hidden;
  border:1px dotted black;
  text-align: left;
  white-space: nowrap;
}

#xml-param {
  width: 96%;
  height: 450px;
  font-size: 14px;
  font-family: monospace;
  float: left;
  overflow: scroll;
  border:1px dotted black;
  text-align: left;
  white-space: nowrap;
}

#paragraph {
  width: 96%;
  height: 450px;
  font-size: 14px;
  font-family: monospace;
  float: left;
  overflow: scroll;
  border:1px dotted black;
  text-align: left;
  white-space: pre;
}

#xml-data {
  width: 96%;
  height: 300px;
  font-size: 14px;
  font-family: monospace;
  float: left;
  overflow: scroll;
  border:1px dotted black;
  text-align: left;
  white-space: nowrap;
  margin-bottom: 20px;
}

#xsl {
  width: 96%;
  height: 600px;
  font-size: 14px;
  font-family: monospace;
  float: left;
  overflow: scroll;
  border:1px dotted black;
  text-align: left;
  white-space: nowrap;
}


td,
th {
    padding: 4px;
}

td {
    text-align: center;
}


table {
    border-collapse: collapse;
    letter-spacing: 1px;
    font-family: sans-serif;
    font-size: .8rem;
}

select {
  /* styling */
  background-color: white;
  border: thin solid black;
  border-radius: 4px;
  display: inline-block;
  font: inherit;
  font-size: .8rem;
  line-height: 1.2em;
  padding: 0.5em 2.5em 0.5em 1em;

  /* reset */

  margin: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;

  background-image:
    linear-gradient(45deg, transparent 50%, blue 50%),
    linear-gradient(135deg, blue 50%, transparent 50%),
    linear-gradient(to right, skyblue, skyblue);
  background-position:
    calc(100% - 20px) calc(1em + 2px),
    calc(100% - 15px) calc(1em + 2px),
    100% 0;
  background-size:
    5px 5px,
    5px 5px,
    2.5em 2.5em;
  background-repeat: no-repeat;
}

select:focus {
  background-image:
    linear-gradient(45deg, white 50%, transparent 50%),
    linear-gradient(135deg, transparent 50%, white 50%),
    linear-gradient(to right, gray, gray);
  background-position:
    calc(100% - 15px) 1em,
    calc(100% - 20px) 1em,
    100% 0;
  background-size:
    5px 5px,
    5px 5px,
    2.5em 2.5em;
  background-repeat: no-repeat;
  border-color: grey;
  outline: 0;
}


select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}


a.lien_neutre{
  color: black;
  text-decoration: none;
}