/* ------------------------------------------------------------------------*/
/* le bleu edugain est #19398a ou hsl(223,69%,32%), il est éclairci ici de 10% soit #214BB5 ou hsl(223,69%,42%);*/


html {
  height: 100%;
}

body {
    color: #4F4F4F;
	font-family: "TrebuchetMS", "BitstreamVeraSans", verdana, lucida, arial, helvetica, sans-serif;
	font-size: 0.85em;
    background-color: #fff;
	-webkit-text-size-adjust: 100%;
    min-height: 100%;
}

#wrapper{
	margin:0;
	padding:0;
}
#content{
	margin:0;
	padding:2rem 1rem;
}


/* Header*/
#header {
    width: 100%;
    margin:0;
    padding:0;
}
#header ul {
	width: 100%;
	display:table;
	table-layout:fixed;
	margin:0;
	padding:0.3rem 0.5rem;
	box-sizing:border-box;
}
#header ul li{
	display:table-cell;
	width:40%;
}
#header ul li.logo{
    width: 30%;
}

#header .title{	
    width: 100%;
    height:5rem;
    line-height: 5rem;
    margin:0;
    padding:0;
	background-color:#FF8547;
	background-color:hsl(20,100%,64%);
}

#header .title span{	
    height:5rem;
    line-height: 5rem;
    margin:0;
    padding:0;
}

#header .title span h1{
    width: 100%;
    font-size: 1.6em;
    letter-spacing:0.1rem;
    color: #fff;
    font-weight:bold;
    height:5rem;
    line-height:5rem;
   	text-align:center;
}

#header .title h1 small{
    font-size: 0.9em;
    color: #fff;
    clear: left;
}

/* Footer*/
#footer{
	width:100%;
	height:2rem;
	line-height:2rem;
}

#footer span{
	height:2rem;
	line-height:2rem;
}

/* Alignment classes*/
.align-center{
	text-align:center;
}
.align-right{
	text-align:right;
}
.align-left{
	text-align:left;
}

/* Changes for foundation buttons*/
button, .button{
	background:#214BB5; 
	background:hsl(223,69%,42%);
	border: 2px solid #214BB5;
	border:2px solid hsl(223,69%,42%);
	font-weight:bold;
	border-radius:10px;
}
button:hover, .button:hover{
	background:none;
	color:#214BB5;
	color:hsl(223,69%,42%);
}

.alert-box{
	margin-left:auto;
	margin-right:auto;
}
.alert-box.radius{
	border-radius:5px;
}


/* CUSTOM WIZARD*/
.wizard > .steps .current a, .wizard > .steps .current a:hover, .wizard > .steps .current a:active {
    background: none repeat scroll 0% 0% #214BB5;
    color: #FFF;
    cursor: default;
    border-radius: 10px;    
}
.wizard > .steps a, .wizard > .steps a:hover, .wizard > .steps a:active {
    display: block;
    width: auto;
    margin: 0px 0.5em 0.5em;
    padding: 1em;
    text-decoration: none;
    border-radius: 10px;
}
.wizard > .content {
    background: none;
    overflow: auto;
    overflow-x: hidden;
	border:2px solid #214BB5;
	border:2px solid hsl(223,69%,42%);
    border-radius: 10px;
}
.wizard > .content fieldset{
	border:none;
	margin-left:auto;
	margin-right:auto;
}

.wizard > .actions a, .wizard > .actions a:active {
    text-decoration: none;
	background:hsl(223,69%,42%);
	background:#214BB5;
	border: 2px solid #214BB5;
	border:2px solid hsl(223,69%,42%);
	font-weight:bold;
	border-radius:10px;
}

.wizard > .actions a:hover{
	color:#214BB5;
	color:hsl(223,69%,42%);
	background:none;
	border: 2px solid #214BB5;
	border:2px solid hsl(223,69%,42%);
	font-weight:bold;
	border-radius:10px;
}

.wizard > .actions .disabled a, .wizard > .actions .disabled a:hover, .wizard > .actions .disabled a:active {
    background: none repeat scroll 0% 0% #9DC8E2;
    color: #fff;
  	border: 2px solid #9DC8E2;
}

.wizard > .content > .body label[for="sp_entityid"] {
    display:block;
    margin-bottom: 0;
	font-weight:bold;
}

.wizard > .content > .body label.error {
    color: #fff;
    width: 100%;
    margin-left: 0;
    background: #f04124;
    padding: 0.3rem 2rem ;
    margin: 1rem auto;
}
.wizard > .content > .body span.custom-combobox label.error {
    position:absolute;
    margin: 3rem auto;
}

    
/* Accounts profile page*/
.accounts_profile{
	box-sizing:border-box;
	min-width: 30%;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: stretch;
}

.accounts_profile > div.tbl {
  flex: 0 0 22em;
  display: block; /* IE fix */
  margin-right:1em;
}


.accounts_profile div.tbl table{
	width:100%;
	margin-top:2rem;
	table-layout: fixed; 
	word-wrap: break-word;
}

.accounts_profile div.tbl table tr th:nth-child(1){
	width:40%;
}

.accounts_profile div.tbl table tr:nth-child(3) div{
	display:flex;
	margin:0;
	padding:0;
	height:7em;
	overflow-y:scroll;	
}
.accounts_profile div.tbl table tr:nth-child(3) div p{
	margin:auto 0;
	display: block; /* IE fix */
	font-size: 0.875rem;
	line-height: 1.3;
	text-align:left;
}

.show_account_details{
	margin-bottom:0;
	padding:0.5rem 1rem;
}
.accounts_profile table caption{

	background-color:#FF8547;
	background-color:hsl(20,100%,54%);
	color:#fff;
	padding:0.2rem 0 0.2rem 1rem;
	border-radius:5px 5px 0 0;
	text-align:left;
}

.login {float: left}
.menu {float: right}
.footer {text-align: center}
.prod {background-color: #028A34}
h1 {text-align: center}
li.parametre {margin-bottom: 15px;}
dd.parametre {margin-bottom: 15px;}
div.important{border-style:solid;border-color:black;border-width:1px;background-color:#F5DEB3;padding:5px;}
.mandatory{color:#e00853;font-style:italic;font-weight:bold;margin:0 3px}
.notice{border:2px solid #05a;padding:5px 5px 5px 5px;margin:20px;}
#sp_entityid{width:100%;}
.scrollable{overflow-y: scroll;}
fieldset.scrollable{height: 75%;}
.wizard .content div.radio_inline input[type="radio"]{display: inline;}

.custom-combobox {
    position: relative;
    display: inline-block;
}
.custom-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    padding: 0;
}
.custom-combobox-input {
    margin: 0;
    padding: 5px 10px;
    padding-left: 40px;
    width: 600px;

}

.ui-autocomplete {
		max-height: 400px;
		overflow-y: auto;
		/* prevent horizontal scrollbar */
		overflow-x: hidden;
}
/* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
* html .ui-autocomplete {
  height: 400px;
}


/*Global*/
h1,h2,h3,h4,h5,h6 {
	color:#214BB5;
	color:hsl(223,69%,42%);
}
h3{
	margin-top:2rem;
}

/* Links */
a, a:visited, a:active, a:link{
	text-decoration:underline;
}

a:hover{
	text-decoration:none;
}