/* ======================================================================== //
//                                                                          //
// Fichier     : COMMON.CSS                                                 //
//                                                                          //
// Description : Application de gestion                                     //
//               Feuille des styles CSS - Styles communs                    //
//                                                                          //
// Auteur      : IDÉLOGIC - Dany MIODON (05/12/2008)                        //
//                                                                          //
// ======================================================================== */


/* Styles généraux
   ~~~~~~~~~~~~~~~ */
* {
   font-family: "Trebuchet MS", Verdana, Tahoma, Helvetica, Sans-Serif;
   /*font-family: Sans-Serif;*/
   font-size: 100%;
   font-style: inherit;
   font-weight: inherit;
   margin: 0;
   padding: 0;
}

body {
   background-color: #ffffff; /* White */
   color: #483d8b; /* DarkSlateBlue */
   font-size: 75%;
   min-width: 900px;
   position: relative;
   text-align: center;
}

p {
   overflow: hidden;
}

img {
   border: none;
   vertical-align: middle;
}

a {
   outline: none;
}


/* Styles de l'en-tête de page
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#header {
   background: #89c6f3 url("../images/header-bkg.jpg") repeat-x;
   border-bottom: 1px solid #508dc6;
   color: #ffffff; /* White */
   height: 73px;
   overflow: hidden;
   /*padding: 10px;*/
   text-align: center;
}

#logo {
   background: #89c6f3 url("../images/logo.jpg") no-repeat;
   float: left;
   height: 73px;
   /*overflow: hidden;*/
   width: 446px;
}

#header h1 {
   font-size: 200%;
   font-weight: bold;
   margin-top: 12px;
   text-transform: uppercase;
}

#menu {
   background-color: #ffffff;
   border-bottom: 1px solid #508dc6;
   text-align: left;
}

#user {
   /*background-color: lightgreen;*/
   height: 1.9em;
   margin: 0;
   overflow: hidden;
   padding: 0 6px 0 0;
   text-align: right;
}

#user div {
   /*background-color: pink;*/
   padding: .18em 0 0;
}

#home, #info {
   /*background-color: lightgreen;*/
   border: none;
   border-right: 1px solid #508dc6;
   float: left;
   height: 1.9em;
   margin: 0;
   padding: 0;
}

#home a, #info a {
   /*background-color: pink;*/
   display: block;
   height: 1.9em;
   margin: 0;
   padding: 0 6px;
   width: 16px;
}

#home a:hover, #info a:hover {
   background-color: #ffebcd; /* BlanchedAlmond */
   text-decoration: none;
}

#home img,#info img {
   margin-top: -8px;
   padding-top: .95em;
}

.flash {
   color: #ff8c00; /* DarkOrange */
   font-weight: bold;
}


/* Styles de la barre d'infos
   ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#infos {
   background-color: #89c6f3;
   border-bottom: 1px solid #508dc6;
   color: #ffffff; /* White */
   font-size: 90%;
   /*overflow: hidden;*/
   padding: 2px 5px;
   text-align: right;
}

#infos a, #infos a:link, #infos a:visited {
   color: #ffffff; /* White */
   font-weight: bold;
   /*margin: 0;
   padding: 0;*/
   margin: 0 2px;
   text-decoration: none;
}

#infos a:hover {
   color: #ff8c00; /* DarkOrange */
   text-decoration: underline;
}

#infos img {
   margin: 0;
   padding: 0;
}


/* Styles du corps de page
   ~~~~~~~~~~~~~~~~~~~~~~~ */
#content, #nojs {
/* background-color: lightgreen; */
   /*border: 1px solid red;*/
   /*clear: both;*/
   /*float: left;*/
   /*margin: 0;*/
   /*overflow: hidden;*/
   padding: 10px;
   text-align: justify;
}

#content h2, #nojs h2 {
   border-bottom: 1px solid #cccccc;
   color: #ff8c00; /* DarkOrange */
   font-size: 140%;
   /*font-variant: small-caps;*/
   font-weight: bold;
   margin-bottom: 10px;
   /*padding-bottom: 2px;*/
}

/* AJOUTÉ POUR LA PAGE NOJS.PHP */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#content ul, #nojs ul {
   list-style-type: square;
   padding-left: 20px;
}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.dyntable {
   /*background-color: lightgrey;*/
   border: 1px solid #483d8b; /* DarkSlateBlue */
}

strong {
   font-style: normal;
   font-weight: bold;
}
em {
   font-style: italic;
   font-weight: normal;
}
.error, .critical {
   color: red;
}
.black {
   color: black;
}
.seblue {
   background-color: #e6e6fa;
}
.select {
   width: 15em;
}
.td-padding-left {
   padding-left: 10px;
}
.bold {
   font-weight: bold;
}
.italic {
   font-style: italic;
}
.center {
   text-align: center;
}
.left {
   text-align: left;
}
.right {
   text-align: right;
}
.navigation {
   border: none;
   /*margin-top: 2px;*/
   /*padding: 0px 4px;*/
   /*vertical-align: sub;*/
   /*vertical-align: middle;*/
}
.float-left {
   float: left;
}
.float-right {
   float: right;
}
.float-none {
   float: none;
}
.hint {
   cursor: help;
}
.hand {
   cursor: pointer;
}
.hidden {
   visibility: hidden;
}
.none {
   display: none;
}
.inline {
   display: inline;
}
.block {
   display: block;
}
.font-normal {
   font-size: 100%;
}
.font-small {
   font-size: 90%;
}
.font-big {
   font-size: 130%;
}
.width-full {
   width: 100%;
}
.img-header {
   margin-top: -3px;
}
.uppercase {
   text-transform: uppercase;
}
.middle {
   vertical-align: middle;
}
hr {
   background-color: #508dc6;
   border: 0;
   color: #508dc6;
   height: 1px;
   margin: 10px 0;
}

table {
   border: 1px solid #508dc6;
   border-collapse: collapse;
   /*border-width: 1px;*/
   /*font-size: 80%;*/
}
td.day {
   border-right: none;
   text-align: right;
}
td.empty {
   background-color: #dcdcdc; /* Gainsboro  */
}

table.list {
   /*font-size: 90%;*/
}
table.list thead {
   background-color: #89c6f3;
   border: 1px solid #508dc6;
   color: #ffffff; /* White */
   font-weight: bold;
   /*font-size: 130%;*/
   padding: 13px 0 3px;
}
table.list .odd {
   background-color: #dadada;
}
table.list .even {
   background-color: #eaeaea;
}
table.list .ended {
   color: #808080;
}
table.list td, table.list th {
   border: none;
   padding: 3px 0 3px 7px;
   text-align: left;
}
table.list th {
   border-bottom: 1px solid #508dc6;
   /*padding: 3px 0 3px 8px;*/
}
table.list .icon {
   padding-left: 0;
   text-align: center;
   width: 24px;
}
table.list .amount {
   padding-right: 2px;
   text-align: right;
   /*width: 4.5em;*/
   /*width: 5.25em;*/
   width: 60px;
}
table.list .check {
   padding-left: 0;
   text-align: center;
   /*width: 4.5em;*/
   /*width: 5.25em;*/
   width: 60px;
}
table.list .hours {
   padding-right: 2px;
   text-align: right;
   /*width: 4.5em;*/
   /*width: 5.25em;*/
   width: 110px;
}
table.list tbody td input, table.list tbody td select {
   margin: 0 3px 0 0;
}

table.project td.name, td.project {
   padding: 3px 0 3px 7px;
   text-align: left;
   width: 200px;
}


/* Styles pour les fenêtre popup
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
#modalBackground {
   /*background-color: #333333;*/
   background-color: #508dc6;
   cursor: wait;
   display: none;
   filter: alpha(opacity=40);
   height: 100%;
   left: 0;
   opacity: 0.40;
   position: fixed;
   top: 0;
   width: 100%;
   z-index: 9;
}

#modalWindow {
   background: #ffffff url("../images/ajax-loader.gif") no-repeat 10px 10px;
   border: 1px solid #508dc6;
   display: none;
   /*height: 10em;*/
   height: auto;
   left: 0;
   overflow: hidden;
   padding: 10px 10px 10px 52px;
   position: fixed;
   text-align: left;
   top: 0;
   visibility: hidden;
   /*width: 20em;*/
   width: auto;
   z-index: 10;
}

.input {
   color: black;
   font-size: 90%;
}

table.calendar {
	/*border-collapse: separate;*/
   left: -2px;
   margin-bottom: 2px;
   margin-top: 2px;
   table-layout: fixed;
}
table.calendar thead {
   /*border: 1px solid #508dc6;*/
}
table.calendar tbody {
   /*border: none;*/
}
table.calendar th, table.calendar td {
   overflow: hidden;
   text-align: center;
   /*width: 25px; ~~ Padding diminué sur les INPUT ~~ */
   width: 23px;
}
table.calendar th {
   background-color: #89c6f3;
   border: none;
   color: #ffffff;
   font-weight: bold;
}
table.calendar td {
   border: 1px solid #508dc6;
   border-left: none;
}
table.calendar .week {
   /*width: 25px;*/
}
table.calendar input {
   margin: 0;
   padding: 0;
   text-align: center;
}
table.calendar .weekend {
   background-color: #ffdfdf;
   color: #ff0000; /* Red */
}
table.calendar th.total {
   border: 1px solid #508dc6;
   border-right: 1px solid #508dc6;
   color: black;
   width: 40px;
}
table.calendar td div {
   margin: 0;
   overflow: hidden;
   padding: 0;
   text-align: center;
}
table.calendar td.resume {
   background-color: #ffffff; /* White */
   border: 1px solid #508dc6;
   /*color: #508dc6;*/
   color: black;
   font-size: 90%;
}
table.calendar td.total {
   background-color: #ffffff; /* White */
   /*border: 1px solid #508dc6;*/
   color: black;
   font-size: 90%;
}
table.calendar td.total div {
   width: 38px;
}
table.calendar td.week div {
   /*width: 22px; ~~ Padding diminué sur les INPUT ~~ */
   width: 20px;
}

input, select {
   border-width: 1px;
}
.monospace {
   font-family: monospace;
}