/*  le tableau de donn�e */

#tblca1 {
    /*width:100%;*/
    font-size: 16px;
    text-align: right;
    /*margin: 0 auto;*/
    /*float:left;*/
    z-index: 2;
    border-style: solid;
    border-width: 1px;
    padding-top: 10px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    -khtml-border-radius: 20px;
    -webkit-border-radius: 20px;
    /*background-color:#f6efa9;*/
    background-color: white;
    padding: 10px;
    position: relative;
    width: 1300px;
    margin-left: 230px;
    margin-top: 0px;
    font-family: "arial", Garamond, 'Comic Sans';
}

#tblca2 {
    /*width:100%;*/
    font-size: 16px;
    text-align: right;
    /*margin: 0 auto;*/
    /*float:left;*/
    z-index: 2;
    border-style: solid;
    border-width: 1px;
    padding-top: 10px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    -khtml-border-radius: 20px;
    -webkit-border-radius: 20px;
    /*background-color:#f6efa9;*/
    background-color: white;
    padding: 10px;
    position: relative;
    width: 1300px;
    margin-left: 230px;
    margin-top: 0px;
    font-family: "arial", Garamond, 'Comic Sans';
}

#annee {
    font-size: 20px;
    text-align: left;
}


/* Titre du tableau juste sous les onglets */

#titrehh {
    position: relative;
    top: 5px;
    font-size: 12px;
    text-align: center;
    font-size: 18px;
    z-index: 2;
    margin: 0 auto;
    font-family: "arial", Garamond, 'Comic Sans';
}


/* menu haut case � cocher DROITS, TIMBRES ... */

#choix_haut {
    /*position: relative;
	font-size:12px;
	left:100px;
	padding:5px;
	height:25px;*/
    margin-top: 10px;
    margin-bottom: 8px;
    margin-left: 50px;
    font-size: 12px;
    text-align: left;
    padding: 5px;
    z-index: 2;
    /*background:white;*/
    display: inline-block;
    height: 27px;
    box-shadow: 3px 3px 3px #aaa;
    border: 1px solid #202069;
    border-radius: 5px;
    background-color: #E6E6E6;
    font-family: "arial", Garamond, 'Comic Sans';
}


/*idem menu UNITE CARTONS ...*/

#choix {
    /*position:absolute;*/
    /*margin : 0 auto;*/
    /*position:relative;*/
    margin-top: 10px;
    margin-bottom: 8px;
    margin-left: 50px;
    font-size: 12px;
    text-align: left;
    padding: 5px;
    z-index: 2;
    /*background:white;*/
    display: inline-block;
    height: 27px;
    box-shadow: 3px 3px 3px #aaa;
    border: 1px solid #202069;
    border-radius: 5px;
    background-color: #E6E6E6;
    font-family: "arial", Garamond, 'Comic Sans';
}


/* idem pour occuper la place*/

#choix_haut_vide {
    height: 20px;
}


/* chaque element du menu haut bloc DROITS, BLOC TIMBRE ...*/

.menu_h {
    padding-right: 40px;
    float: left;
}


/* cadre central, d�j� h�rit� du CSS principal */

#centre {
    /*width:1450px;*/
}

#tbl_agent {
    width: 100%;
    text-align: left;
}


/* la boite de liste d�roulante � gauche */

#sel_gauche {
    float: left;
    padding: 5px;
    margin: 5px;
    /*border-style: solid;
	border-width: 1px;*/
    margin-top: 40px;
    width: 200px;
    /*background:white;*/
    display: inline-block;
    border: 1px solid #202069;
    box-shadow: 3px 3px 3px #aaa;
    border-radius: 5px;
    background-color: #E6E6E6;
    font-family: "arial", Garamond, 'Comic Sans';
}

#sel_gauche_cont {
    height: auto/*1500px*/
    ;
    float: left;
}


/*bouton affiche/masque pour bascule affichage CA QTE*/

#bmasque {
    color: #ffffff;
    -moz-box-shadow: 0px 0px 3px #343434;
    -webkit-box-shadow: 0px 0px 3px #343434;
    -o-box-shadow: 0px 0px 3px #343434;
    box-shadow: 0px 0px 3px #343434;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border: 1px solid #656565;
    background: #cbcefb;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#cbcefb", endColorstr="#656565");
    /* Pour IE seulement et mode gradient � linear */
    background-image: -webkit-gradient(linear, left top, left bottom, from(#cbcefb), to(#656565));
    background-image: -moz-linear-gradient(top center, #cbcefb, #656565);
    background-image: -o-linear-gradient(top, #cbcefb, #656565);
    /*uniquement en mode linear*/
}

.btout {
    -moz-box-shadow: inset 0px 1px 0px -20px #cae3fc;
    -webkit-box-shadow: inset 0px 1px 0px -20px #cae3fc;
    box-shadow: inset 0px 1px 0px -20px #cae3fc;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #4197ee));
    background: -moz-linear-gradient( center top, #79bbff 5%, #4197ee 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#4197ee');
    background-color: #79bbff;
    -webkit-border-top-left-radius: 7px;
    -moz-border-radius-topleft: 7px;
    border-top-left-radius: 7px;
    -webkit-border-top-right-radius: 7px;
    -moz-border-radius-topright: 7px;
    border-top-right-radius: 7px;
    -webkit-border-bottom-right-radius: 7px;
    -moz-border-radius-bottomright: 7px;
    border-bottom-right-radius: 7px;
    -webkit-border-bottom-left-radius: 7px;
    -moz-border-radius-bottomleft: 7px;
    border-bottom-left-radius: 7px;
    text-indent: -9px;
    border: 3px solid #469df5;
    display: inline-block;
    color: #ffffff;
    font-family: Arial;
    font-size: 17px;
    font-weight: bold;
    font-style: normal;
    height: 29px;
    line-height: 29px;
    /*width:131px;*/
    text-decoration: none;
    text-align: center;
    text-shadow: 1px 1px 0px #287ace;
    padding-left: 13px;
    padding-right: 5px;
}

.classname:hover {
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff));
    background: -moz-linear-gradient( center top, #378de5 5%, #79bbff 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff');
    background-color: #378de5;
}

.classname:active {
    position: relative;
    top: 1px;
}

.btout2 {
    color: #343434;
    box-shadow: 0px 0px 10px #343434;
    border-radius: 10px;
    border: 2px solid #cd9934;
    background: #fffe65;
    background: linear-gradient(#fffe65, #fffc9e);
    display: inline-block;
    color: #343434;
    font-family: arial;
    font-size: 22px;
    font-weight: bold;
    padding: 2px 12px;
    text-decoration: none;
}

.btout3 {
    color: #ffffff;
    box-shadow: 0px 0px 10px #343434;
    border-radius: 10px;
    border: 2px solid #f8ff00;
    background: #cb0000;
    background: radial-gradient(#cb0000, #fe0000);
    display: inline-block;
    font-family: arial;
    font-size: 22px;
    font-weight: bold;
    padding: 2px 12px;
    text-decoration: none;
}

.btoutbleu {
    color: #00009b;
    border-radius: 10px;
    border: 3px solid #3531ff;
    background: #34cdf9;
    background: linear-gradient(#34cdf9, #329a9d);
    display: inline-block;
    font-family: arial;
    font-size: 22px;
    font-weight: bold;
    padding: 2px 12px;
    text-decoration: none;
}

.btout4 {
    color: #680100;
    box-shadow: 0px 0px 5px #343434;
    border-radius: 10px;
    border: 2px solid #330001;
    background: #ffccc9;
    background: linear-gradient(#ffccc9, #fd6864);
    display: inline-block;
    font-family: arial;
    font-size: 22px;
    font-weight: bold;
    padding: 2px 12px;
    text-decoration: none;
}

.btout:hover {
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #5cb811), color-stop(1, #77d42a));
    background: -moz-linear-gradient( center top, #5cb811 5%, #77d42a 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#5cb811', endColorstr='#77d42a');
    background-color: #5cb811;
}

.btout:active {
    position: relative;
    top: 1px;
}

#btout {
    position: absolute;
    top: 10px;
    left: 40px;
}


/* pour les onglets dans la partie centrale */

.tabrow {
    text-align: left;
    list-style: none;
    margin: 0px 0 0px;
    padding-left: 50px;
    line-height: 24px;
    height: 26px;
    overflow: hidden;
    font-size: 12px;
    font-family: verdana;
    position: relative;
}

.tabrow li {
    border: 1px solid #23236C;
    background: white;
    /*background: #D1D1D1;
		    background: linear-gradient(top, #ECECEC 50%, #D1D1D1 100%);*/
    display: inline-block;
    position: relative;
    z-index: 0;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4), inset 0 1px 0 #FFF;
    text-shadow: 0 1px #FFF;
    margin: 0 -5px;
    padding: 0 20px;
}

.tabrow a {
    color: #555;
    text-decoration: none;
    font-weight: bold;
}

.tabrow li.selected {
    /*background: #FFF;*/
    background: #E6E6E6;
    /*#B9C8E4;*/
    color: #333;
    z-index: 2;
    /* border-bottom-color: #FFF;*/
    border-bottom-color: #E6E6E6;
}

.tabrow:before {
    position: absolute;
    content: " ";
    width: 100%;
    bottom: 0;
    left: 0;
    border-bottom: 1px solid #23236C;
    z-index: 1;
}

.tabrow li:before,
.tabrow li:after {
    border: 1px solid #23236C;
    position: absolute;
    bottom: -1px;
    width: 5px;
    height: 5px;
    content: " ";
}

.tabrow li:before {
    left: -6px;
    border-bottom-right-radius: 6px;
    border-width: 0 1px 1px 0;
    box-shadow: 2px 2px 0 #D1D1D1;
}

.tabrow li:after {
    right: -6px;
    border-bottom-left-radius: 6px;
    border-width: 0 0 1px 1px;
    box-shadow: -2px 2px 0 #D1D1D1;
}

.tabrow li.selected:before {
    /*box-shadow: 2px 2px 0 #FFF;*/
    box-shadow: 2px 2px 0 #E6E6E6;
}

.tabrow li.selected:after {
    /*box-shadow: -2px 2px 0 #FFF;*/
    box-shadow: -2px 2px 0 #E6E6E6;
}


/************  menu gauche *********************/

.navigation {
    margin: 5px;
    padding: 0;
    list-style: none;
    background: #000;
    color: #fff;
    width: 183px;
    margin-top: 10px;
    font: 1.2em "Trebuchet MS", sans-serif;
}

.navigation a,
.navigation span {
    display: block;
    padding: 4px 10px;
    color: #fff;
    text-decoration: none;
    /*background: #000 url(menu-item.png) left bottom no-repeat;*/
}

.navigation .open a,
.navigation .open span {
    background-image: url(menu-item-enroule.png);
}

.navigation a:hover,
.navigation a:focus,
.navigation a:active {
    /*text-decoration: underline;*/
    background: #E6E6E6;
    /* background:#C0D1E7;*/
    color: black;
}

.navigation .subMenu {
    font-size: .8em;
    background: #ccc url(subMenu.png) 0 0 repeat-x;
    font-size: .9em;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #666;
}

.navigation ul.subMenu a {
    background: none;
    padding: 3px 20px;
    color: black;
}

.open_at_load {
    background-color: red;
    color: green;
}

.selectionne {
    background-color: orange;
    color: green;
}

.selectionne a {
    background-color: orange;
    /*color:green;*/
}


/*-----------------------------------------*/

.navigation .toggleSubMenu a {
    background: none green;
    border-radius: 4px;
}

.navigation .subMenu {
    background: none #E6E6E6;
    list-style: none;
    border-radius: 4px;
}

.navigation .subMenu a:hover {
    background: none #FF0;
    color: #000;
    border-radius: 4px;
}

.navigation,
.navigation a {
    background: none red;
    border-radius: 4px;
}

.navigation a:hover,
.navigation a:focus,
.navigation a:active {
    background: none #FF0
}

.navigation .selectionne {
    background-color: #68689C;
    border-color: #FF0;
    border-style: solid;
    border-width: 1px;
    color: #FFF
}

.navigation .selectionne a {
    color: #FFF!important;
    text-decoration: none
}


/*-----------------------------------------*/


/*-----------------------------------------*/


/*         bloc affiche environnement commande, client ....         */

#info_commande {
    position: absolute;
    top: -100px;
    left: 200px;
    width: 400px;
    z-index: 10000;
    border-style: solid;
    border-width: 1px;
    padding-top: 2px;
    padding-left: 10px;
    padding-right: 10px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    -khtml-border-radius: 20px;
    -webkit-border-radius: 20px;
    box-shadow: 3px 3px 6px #aaa;
    border-color: #008080;
    font-family: arial;
    background-color: #008080;
    color: white;
    transition: opacity 0.5s ease-in-out;
    font-size: 20px;
}


/***************** menu et onglets ******************/


/******************************************/

.menu_accordeon_sel {
    background: black;
    text-shadow: 0 1px black;
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4), inset 0 1px 0 #FFF;
    /* background: linear-gradient(top, #ECECEC 50%, #D1D1D1 100%);*/
}

.menu_accordeon_sel a {
    color: white !important;
    text-shadow: 0 1px white;
}

#sous_onglet {
    background: #E6E6E6;
    text-shadow: 0 1px #FFF;
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4), inset 0 1px 0 #FFF;
    background: linear-gradient(top, #ECECEC 50%, #D1D1D1 100%);
    z-index: 10000000;
}

#menu-accordeon {
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: left;
    width: 95%;
    margin-left: 2%;
}

#menu-accordeon ul {
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}

#menu-accordeon li {
    /* background-color:#729EBF; */
    /* background-image:-webkit-linear-gradient(top, #729EBF 0%, #333A40 100%);*/
    /* background-image: linear-gradient(to bottom, #729EBF 0%, #333A40 100%);*/
    /* border-radius: 6px;*/
    margin-bottom: 2px;
    box-shadow: 3px 3px 3px #999;
    border: solid 1px #333A40;
    padding-left: 2%;
}

#menu-accordeon li li {
    max-height: 0;
    overflow: hidden;
    transition: all .5s;
    border-radius: 0;
    background: #444;
    box-shadow: none;
    border: none;
    margin: 0
}

#menu-accordeon a {
    display: block;
    text-decoration: none;
    /* color: #fff;*/
    color: black;
    padding: 8px 0;
    font-family: arial;
    font-size: 1.3em;
    font-weight: bold;
}

#menu-accordeon ul li a,
#menu-accordeon li:hover li a {
    font-size: 1em
}

#menu-accordeon li:hover {
    background: #E6E6E6;
}

#menu-accordeon li li:hover {
    background: #999;
}

#menu-accordeon ul li:last-child {
    border-radius: 0 0 6px 6px;
    border: none;
}

#menu-accordeon li:hover li {
    max-height: 15em;
}

#onglet_vertical {
    /*	width:12px;
		height:30px;
		cursor:pointer;*/
    position: fixed;
    top: 63px;
    left: 15px;
    z-index: 999999;
    /*border-radius: 0px 2px 2px 0px;*/
    /*box-shadow:1px 1px 1px 0px rgba(50, 50, 50, 0.75);*/
    border-left: 0px;
    /*border-radius: 0px 10px 10px 0px;
		box-shadow:1px 1px 1px 0px rgba(50, 50, 50, 0.75);
		border-left:0px;
		margin-left:-10px;

		border: 1px groove #000000;
		
		background: rgb(86, 86, 86);
		background: linear-gradient(90deg, rgb(86, 86, 86) 20%, rgb(219, 219, 219) 100%);*/
    transition: all 1s linear;
}

#onglet_vertical:hover {
    transform: rotate(90deg);
}


/*i[voyant="onglet"] {
    font-size: 20px;
    color: orange;
    margin-left: -15px;
    margin-top: 3px;
    margin-bottom: -5px;
    cursor: pointer;
}*/

.voyant_sous_onglet_vide {
    font-size: 20px;
    margin-left: -15px;
    margin-top: 3px;
    margin-bottom: -5px;
}


/*   onglets*/

.menu_onglet {
    /*border-bottom:solid 2px black ;*/
    margin-top: -9px;
    margin-left: 50px;
}

.onglet {
    margin: 10px -2px 0px 0px;
    padding: 5px 10px 0px 10px;
    font-size: 16px;
    float: left;
    /*width:100px ; */
    text-decoration: none;
    text-align: center;
    border: 1px solid #23236C;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    background-color: #D8D8D8;
    border-bottom: solid 0px white;
    font-family: Georgia;
}

a.onglet {
    color: black;
    background-color: #D8D8D8;
    font-family: arial;
}

.onglet:hover {
    background-color: black;
    color: white;
    font-weight: bold;
    color: black;
    background-color: white;
    border: 2px solid #23236C;
    border-bottom: solid 0px white;
}

.onglet_actif {
    /* style de l'onglet de la page active */
    position: relative;
    /* l'onglet inactif est mis en position relative */
    top: 3px;
    /* pour pouvoir baisser l'onglet de 2 pixels */
    font-weight: bold;
    color: black;
    background-color: white;
    border: 2px solid #23236C;
    border-bottom: solid 0px white;
}

a.onglet_actif {
    color: black;
    background-color: white;
    font-family: arial;
}

.onglet_actif:hover {
    /*background-color:black;
	color:white;*/
}

.spacer {
    clear: both
}


/* force le retour ?la ligne apr? des boites float */


.btoggle {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 50px;
    background-color: #bbb;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    text-align: center;
}
.btoggle input {
    width: 100%;
    height: 100%;
    margin: 0 0;
    padding: 0 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}

.btoggle label {
  display:block;
  position:absolute;
  top:1px;
  right:1px;
  bottom:1px;
  left:1px;
  background-image:-webkit-linear-gradient(top,#fff 0%,#ddd 50%,#fff 50%,#eee 100%);
  background-image:-moz-linear-gradient(top,#fff 0%,#ddd 50%,#fff 50%,#eee 100%);
  background-image:-ms-linear-gradient(top,#fff 0%,#ddd 50%,#fff 50%,#eee 100%);
  background-image:-o-linear-gradient(top,#fff 0%,#ddd 50%,#fff 50%,#eee 100%);
  background-image:linear-gradient(top,#fff 0%,#ddd 50%,#fff 50%,#eee 100%);
 
  box-shadow:0 2px 3px rgba(0,0,0,0.4),
    inset 0 -1px 1px #888,
    inset 0 -5px 1px #bbb,
    inset 0 -6px 0 white;

  border-radius:3px;
  font:normal 4px Arial,Sans-Serif;
  color:#666;
  text-shadow:0 1px 0 white;
  cursor:text;
}

.btoggle label:before {
  content:attr(data-off);
  position:absolute;
  top:3px;
  right:0;
  left:0;
  z-index:4;
  color:red;
  font-weight:bold;
  font-size:16px;
}

.btoggle label:after {
  content:attr(data-on);
  position:absolute;
  right:0;
  bottom:3px;
  left:0;
  color:#666;
  text-shadow:0 -1px 0 #eee;
  color:#00FF00;
  font-weight:bold;
  font-size:18px;
}

.btoggle input:checked + label {
  background-image:-webkit-linear-gradient(top,#eee 0%,#ccc 50%,#fff 50%,#eee 100%);
  background-image:-moz-linear-gradient(top,#eee 0%,#ccc 50%,#fff 50%,#eee 100%);
  background-image:-ms-linear-gradient(top,#eee 0%,#ccc 50%,#fff 50%,#eee 100%);
  background-image:-o-linear-gradient(top,#eee 0%,#ccc 50%,#fff 50%,#eee 100%);
  background-image:linear-gradient(top,#eee 0%,#ccc 50%,#fff 50%,#eee 100%);

  box-shadow:0 0 1px rgba(0,0,0,0.4),
    inset 0 1px 7px -1px #ccc,
    inset 0 5px 1px #fafafa,
    inset 0 6px 0 white;
}

.btoggle input:checked:hover + label {
 
  box-shadow:0 1px 3px rgba(0,0,0,0.4),
    inset 0 1px 7px -1px #ccc,
    inset 0 5px 1px #fafafa,
    inset 0 6px 0 white;
}

.btoggle input:checked + label:before {
  z-index:1;
  top:4px;
}

.btoggle input:checked + label:after {
  bottom:3px;
  color:#aaa;
  text-shadow:none;
  z-index:4;
  color:#00FF00;
  font-weight:bold;
  font-size:18px;
}
