/******************************************************************************/
/*****************************  Elements HTML / Generique   *******************/
/******************************************************************************/
html{
   margin:0; padding:0;
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
/*	font-size : 13px;*/
}
#header > h1 {
   margin: 0;
   padding: 15px;
}
h2 {margin: .5em auto;}
body{
   color: #222;
   margin:0; padding:0; top: 0;
   position: relative;
   background-color: #26C4EC ; /* demande Gosselin #9ABF15;*/
   /*background-image: linear-gradient(to bottom, #9ABF15 26%, #D8F279 90%);
   background-repeat: no-repeat;*/
   min-height: 100%;
   overflow: visible;
}

a { color : #0066CC; text-decoration :	none; }
a:link, a:visited { color: #396F9A; text-decoration: none; font-weight: normal;}
a:hover { color: #0066CC; text-decoration: underline; font-weight: normal; cursor: pointer;}
a:active { outline:none; }
a, .no-border { border: 0 !important; }

form{
   text-align: left;
   border-radius: 5px;
   background-color: white;
   box-shadow: 0px 0px 5px 1px #ccc;
/*   z-index: 500;*/
}

input[type="text"]:focus,input[type="number"]:focus,input[type="password"]:focus,input[type="date"]:focus,input[type="datetime-local"]:focus,
input[type="file"]:focus,input[type="email"]:focus,input[type="datetime"]:focus,
textarea:focus, select:focus {
	outline:none; border-width: 2px; padding: 1px 2px;
}
input[type="text"].modifiable:focus,input[type="number"].modifiable:focus,input[type="password"].modifiable:focus,
input[type="date"].modifiable:focus,input[type="datetime-local"].modifiable:focus,input[type="datetime"].modifiable:focus,
input[type="file"].modifiable:focus,input[type="email"].modifiable:focus,
textarea.modifiable:focus, select.modifiable:focus {
   /*outline: #26c4ec;*/
   border-color: #F98E1F;
}
input[type="text"],input[type="number"],input[type="password"],input[type="date"],input[type="datetime-local"],input[type="datetime"],
input[type="file"],input[type="email"],
textarea, select {
   color	  : #333;
   border  : 1px solid #bbb;
   margin  : 2px 3px;
   padding : 2px 3px;
   background-color: #EDEDED;
   vertical-align: middle;
   min-height: 22px;
   border-radius: 3px;
}
input[type="date"],input[type="datetime-local"],input[type="datetime"],input[type="text"].date {min-width: 6em; width: 6rem;}
input[type="number"]:not(.modifiable) {appearance:normal;}
textarea { width: 99%; }
textarea::-moz-placeholder{font-stretch: condensed; font-size: smaller; color: #111}

option {
/*  color: #333; background-color: #EDEDED; vertical-align: middle; padding: 2px;*/
}
label{ display: inline-block;vertical-align: middle;}
input[type="image"]:not(.pj){
   cursor: pointer;
   vertical-align: middle;
   width: 2em;
   min-height: 1em;
   border: 0;
}
/*{
input[type="image"].PJajout{
   height: auto;
   border: 1px solid #F98E1F;
}*/
.pj { background: url('../images/trombone-icone-32.png') no-repeat top right}
a>img {vertical-align: bottom; padding-right: 5px; max-height: 2em;}

.fieldset input[type="checkbox"]{
   border:0;
   vertical-align:top;
   margin-right:5px;
}

form input[type="button"].ajouter,
form input[type="button"][id$="_modify"],
 input[type="button"][id$="_save"],
form input[type="button"][id$="_cancel"],
form input[type="submit"]{
   background-color: #333740;
   text-decoration: none;
   color: white;
   border: 0px none; border-radius: 5px;
   width: auto; min-width: 70px;
   padding: 8px 4px;
}
form input[type="button"][id$="_modify"]:hover,
 input[type="button"][id$="_save"]:hover,
form input[type="button"][id$="_cancel"]:hover,
form input[type="submit"], button:hover{
   background-color:#494F5C;
}
form input[type="button"][id$="_cancel"]{
   color: red; font-style: italic;
}
/*table */ input[type="button"][name="ajouter"]{
   min-width: 60px; width: auto;
}

form  input[type="radio"] {
        /*-webkit-appearance: none;*/
        /*appearance: none;*/
      }

form input[type="radio"] {
			width: 1.5em; height: 1.5em;
        border-radius: 1em;
        border: 2px solid green;
        vertical-align: -1px;
        outline: none;
      }
form input[type="radio"] { margin: 0px .5em; padding: .2em;outline: none;}
form input[type="radio"]:checked { background-color: green; color: green; }
/*form input[type="radio"]:not(:checked) { color: gray; }*/
form input[type="radio"]::before { display: block; content: " ";width: 1em;height: 1em;border-radius: .6em;color: green;transform-origin: center;transition: all 0.3s ease-in; }
form input[type="radio"]:checked::before {
        transform: translate(.3em, .3em) scale(1);
        transition: all 0.3s cubic-bezier(0.25, 0.25, 0.56, 2);
      }

table.listing {
   border-collapse: inherit;
   border-spacing: 0;  /*border-radius: 4px;*/
   margin: 4px auto;
   width: 100%;
   border: 2px solid #9ABF15;
   background-color: #9ABF15;
}
table.listing > thead,
table.listing > tfoot{
   color: #8A160D;
   background-color: #9ABF15;
}
table.listing >  tbody >  tr > td	{
   min-height: 30px;
   height: 30px;
   padding: 2px 3px;
   border: 2px solid transparent;
   vertical-align: middle;
   cursor: pointer;
}
table.listing > thead > tr >td {border-bottom: 1px solid transparent;}
table.listing > thead > tr[title] > td[title="Colonne non triable"]:hover {
   cursor: default;
}
table.listing > thead > tr[title] > td[id] { cursor: pointer }
table.listing > thead > tr[title] > td[id].sort {
   border-bottom: 1px solid #5B605A !important;
   background-position:right center;
   background-repeat:no-repeat;
   padding-right:18px;
}
table.listing > thead > tr[title] > td[id].ASC {
   background-image:url('../images/arrow-up.png');
}
table.listing > thead > tr[title] > td[id].DESC {
   background-image:url('../images/arrow-down.png');
}

div#appLoading {
   display: block;
   position: fixed;
   top: 1px;   left: 1px;   bottom: 1px;   right: 1px;
   padding: 20%;
   background-color: white;
   opacity: 0.90;
   z-index: 8000;
}
div#appLoading > div {
   position: relative;
   border: 5px solid #333740; border-radius: 10px;
   padding: 2% 2%;
   width: 100%;
   background-color: #708C0B;
   text-align: center;
}
div#appNotification, div#appNotifError, div#toTop {
   display: block;
   position: fixed;
   border: 5px solid #333740;
   border-radius: 10px;
   width: 40%;
   bottom: 30px;   right: 30%;
   min-height: 60px;
   text-align: center;
   vertical-align: middle;
   z-index: 7500;
	font-size: 130%;
}
div#appNotification, div#toTop {
   background-color: white;
   color: #708C0B;
}
div#appNotifError {
   background-color: #F98E1F;
   color: white;
}
div#toTop {
   bottom: 10px;right: 10px; width: 20px; min-height: 17px; border-width: 3px;
	padding-top: 6px; z-index: 7600; cursor: pointer; opacity: .8;
}

div#main_menu, div#header { text-align: center; }

div#main_menu, div#main_content, div#header{
	display: block;
	clear: both;
   margin: 0 auto;
   margin-bottom: 10px;
}
div#header > div input[type=image] {
   width: 20px;
   height: 20px;
}
div#main_menu {
   width: 90%;
   margin-bottom: 45px;
}
div#main_content{
   display: block;
   margin: 20px auto;
   background-color: #F2F2F2;
   margin-bottom: 10px;
   padding: 5px .3%;
   border-radius: 10px;
   width: 98.75%;
	/*overflow-x: hidden;*/
   position: relative;
}
div#main_content>div {min-height: 450px;}
div#main_content div#divQuelconque {text-align: center;}

/******************************************************************************/
/*****************************       Class       ******************************/
/******************************************************************************/

.spacer {}
.calendar { vertical-align: middle; max-width: 14%; margin-left: -10px}
.date	{ padding: 3px 2px	}
.nombre, .right, .code_postal	{	text-align:right;}
.center{ text-align: center; margin: 0 auto; }
.centre				{	text-align:center;}
.bold, .gras		{	font-weight: bold !important; }
.italic				{	font-style: italic;}
.smaller				{	font-size: 85% !important; }
.bigger				{	font-size: 125% !important; }
.clair				{	background-color: #E3E3E3; padding: 3px;}
.red					{	color: red; }
.redBackground		{	background-color: red !important; }
.barre				{	text-decoration: line-through !important; }
.sousligne			{	text-decoration: underline; }
.inline				{	display: inline-block;}
.absolute			{	padding: 5px;}
.bordure {border : 1px solid black;}
.noDisplay, .noShow	{	display:none !important; }
.noVisible				{	visibility: hidden !important;}

.exportPdf{
	background: url("../images/icons/file.pdf.png") no-repeat center left;
	padding-left: 22px !important; padding-right: 8px !important;
}

.OrangeBackground, .BlancBackground {
   margin: 0px;
   padding: 4px;
}
.OrangeBackground{
   background-color: #FaFaFa;
	box-shadow: 0px 0px 5px 1px #CCC;
   border: 1px solid #F98E1F;
   border-radius: 0 3px;
   min-height: 400px;
}
.BlancBackground{
   text-align: left;
   border-radius: 5px;
   background-color: white;
   box-shadow: 0px 0px 5px 1px #ccc;
}
table.BlancBackground > tbody > tr{
   padding: 5px;
}

form.filtre { background-color: #9ABF15; border: none;}
form.filtre > table {width: 99.9%}

form .controls {
   text-align:center;
   display: block;
   clear: both;
   padding: .8em 0 .5em 0;
}
form.filtre div.controls { float: right; padding: 0 }

.onglet {
   background-color: white;
   display: inline-block;

   border: 1px solid #F98E1F;
   border-radius: 5px 5px 0 0;
   position: relative;
   cursor: pointer;
}
.onglet:hover {
   background-color: #E97E1F;
   color: white;
}

.onglet.btn-active {
   background-color: #E97E1F; /*#5B605A;*/
   margin-top: -1px;
	font-weight: bold;
}
input.ongletNew {
   top: 0px;
}

.divfieldset-menu {
   float: left;
   min-height: 90px;
   text-align: center;
   background-color: #F2F2F2;
   border-radius: 10px;
   padding-bottom: 3px;
   margin: 2px 1px;
   max-width: 16.1%;
}
.btnNav{
   background-color: #5B605A;
   margin : 2px 1px;
   border-radius: 5px;
   border: 0;
   padding : 5px 2px;
   min-width: 90px;
   /*float : left;*/
   text-align : center;
   color: #F2F2F2;
   cursor: pointer;
   border: 1px solid #5B605A;
}

.btnNav:hover{
   background-color: #E97E1F;
   font-style: italic;
}
.btnNav.btn-active{
   background-color: #F98E1F;
   font-style: italic;
}

input.btnPager, .btnPatientSuivPrec, .btnMenu {
   background-color: #333740;
   text-decoration: none;
   color: white;
   border: 0px none;
   width: auto;
   min-width: 50px;
   border-radius: 5px;
   padding: 2px 5px;
   line-height: 16px;
   font-style: normal;
   cursor: pointer;
}
input.btnPager:hover, .btnPatientSuivPrec:hover, .btnMenu:hover{   background-color: #494F5C; }
form input[type="button"][id$="_save"][value="+"], form input[type="button"].session_plus_moins {
   min-width: 20px;
   width: 25px;
   padding: 5px;
}
input.btnPager[disabled]{   visibility: hidden; }


.blocAide{
   background-color: #FFFCEB;
   background-image: url(/app/www/share/images/bgaidecms.jpg);
   background-position: top;
   background-repeat: repeat-x;
   border: 2px solid #999;
}
div.fieldset{
   border: 2px #9ABF15 solid;
   margin-top: 2px;
   border-radius: 10px 5px;
   background-color: white;
   padding: 1px 1px 1px 2px;
   position: relative;
}
div.fieldset > .legend{
   border: 2px solid #9ABF15;
   border-radius: 5px 5px 0  0;
   color: #333;
   background-color: #9ABF15;
	margin: -4px -3px 0px -4px;
	margin: -2px -2px 0px -2px;
   font-weight: bold;
	padding: 3px 0 3px 10px;
}
div.fieldset > div.legend + table.listing {margin-top: 0;}
.fieldset label{
   text-align: right;
	font-style: italic;
}
/*.fieldset label:not(.checkpole){ min-width: 120px; }
.fieldset img + label:not(.checkpole){ min-width: 100px; width: auto }*/
.fieldset img + label:not(.checkpole){ margin-left: 1em }

.notif-number{
	z-index: 505;
   position: absolute;
   top: -5px; right: -15px;
   height: 25px;   width: 33px;
   border-radius: 25px;
   background-color: #F98E1F;
   color: #FFF;
   text-align: center;
   line-height: 25px;
   font-weight: bold;
   font-size: 90%;
	border: 1px white solid;
}

.obligatoire, .obligatoire:focus {/*
   border: 2px solid red !important;
   padding: 4px !important;*/
}

table.listing >  tbody >  tr.impair	{
   background-color: #ECECEC;
}
table.listing >  tbody  > tr.pair 	{
   background-color: #D5D5D5;
}
/*table.listing > tbody > tr.impair:hover, table.listing > tbody > tr.pair:hover */
table.listing > tbody > tr:hover {
   background-color: #E97E1F;
   color: white;
}
tr.selected {
   border-style: outset;
   background-color: #ABABAB;
   font-style: oblique;
   font-weight: bolder;
   cursor: pointer;
}
/******************************************************************************/
/*****************************   Auto Complete   ******************************/
/******************************************************************************/
div.autocomplete{
/*   padding: 10px 0 0 0;*/
   min-width: 16em;
   z-index: 1002;
}
div.autocomplete ul {
   list-style: none;
   margin: 0 0 -4px 0;
   padding: 0;
   overflow: hidden;
   overflow-y: auto;
   background-color: #fff;
   color: #5B605A;
   max-height: 15em;
   padding: 2px;
   border-radius: 2px;
   box-shadow: 0px 0px 5px 1px #5B605A;
}
div.autocomplete ul li{
   padding: 1px 1px;
   text-align: left;
   display: block;
   text-decoration: none;
   background-color: transparent;
   position: relative;
   width: 99%;
}
div.autocomplete ul li:hover,
div.autocomplete ul li:focus,
div.autocomplete ul li.selected{
   background-color: #ddd;
   cursor: pointer;
}
div.autocomplete ul li span {
   display: block;
   padding: 1px 1px 1px 10px;
   font-style: italic;
   font-size: 85%;
}
div.autocomplete ul li span.informal{
   display:inline-block;
}
div.autocomplete ul em{
   font-style: normal;
   color: #6EADE7;
}

/******************************************************************************/
/*****************************   Class Colonne    ******************************/
/******************************************************************************/
.left_div, .col2, .col3, .col4, .col5 , .col3bis, .colonne {float: left; padding: 1px; }
.col2, .col3, .col4, .col5, .col3bis {   box-sizing: border-box;}
.left_div{
   clear:left;
   width: 49.3%;
}
.right_div {
   float: right;
   width: 49.6%;
}
.col2{ width: 49.5%; padding: 2px;}
.col2 + .col2 { margin-left: 2px; }
.col3{   width: 33.1%; padding: 2px 2px;}
.col3 + .col3{ margin-left: 1px;}
.col3 + .col3bis{ width: 66.1%;margin-left: 1px;}
.fieldset.col3 {padding: 1px !important; margin-left: 0px !important}
.col4 { width: 24.7%; padding: 2px 1px; }
.col4 + .col4 { margin-left: 1px; }
.col5	{   width: 19.6%;}
.col5 + .col5{   margin-left: 0;}

.clearfix:after {
   content: ".";
   display: block;
   clear: both;
   visibility: hidden;
   line-height: 0;
   height: 0;
}
div.dropHover {
	border: 2px dashed #FF0000;
}

/******************************************************************************/
/*****************************   Media Device    ******************************/
/******************************************************************************/
@-moz-document url-prefix(){
   body{
      min-height: 100%;
      height: 100%;
   }
}

@media (min-width: 1px) {
   html { font-size: 11px; }
   form { padding: 0.25em; }
	div#main_menu{width:99%}
   .divfieldset-menu h2 span{ display: none}
   input[type="image"].PJajout{ height: 2.15em; padding: 0.2em 0.8em; background-color: #DDD;}
   .onglet { margin-left: 1px; padding: 0.6em 0.8em;}
   .onglet.btn-active{}
	.fieldset label:not(.checkpole) { min-width:50px; width: auto;}
	select { width: auto; max-width: 10em;}
}
@media (min-width: 1008px) {
	html	{ font-size: 11px; }
   form { padding: 0.3em; }
	.divfieldset-menu { max-width:16.3%}.divfieldset-menu h2 span{ display: initial}
	input {   min-height: 2em;}
	input[type="text"]:not(.nombre):not(.code_postal):not(.date), select{min-width: 80px;}
   .onglet { margin-left: 2px; /*padding: 0.5em 0.8em; */}
	.fieldset label:not(.checkpole):not(.simpleCheckbox) { min-width:60px; width:72px;}
	select { max-width: 13em;}
}

@media (min-width: 1200px) {
	html{  font-size: 12px;  }
   form { padding: 5px; }
	div#main_menu{width:96%}
	.divfieldset-menu { max-width:16.3%;margin-left: 2px}
/*   input[type="image"].PJajout{ height: 12px; }*/
	input[type="text"]:not(.nombre):not(.code_postal):not(.date), select{ min-width: 90px;}
	.fieldset label:not(.checkpole):not(.simpleCheckbox) { min-width: 90px; width:auto /*125px*/;}
	select { max-width: 170px;}
	label.simpleCheckbox:before {letter-spacing: -3px !important;}
	label.simpleCheckbox {padding-right:14px !important;}
	/*input[type="checkbox"]:checked + label.simpleCheckbox:before {left: auto; right:1px !important;}*/
}