/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}


/* HTML5 display-role reset for older browsers */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}


/*************************/
/* OWN STYLES BEGIN HERE */
/*************************/

/* DEFINE VARIABLES */
:root {
    --main-color: rgba( 0, 145, 205, 1 );
}


html {
    display: box;
    height: 100%;
}


/*body, table {*/

body {
    background-color: #ffffff;
    min-height: 100%;
    font-family: tahoma, helvetica, arial, 'sans serif';
    font-size: 1em;
    color: #444444;
}

h2 {
    /*font-size: 1.25em;*/
    font-weight: bold;
    padding-bottom: 0.5em;
    /*text-decoration: underline;*/
}

b {
    font-weight: bold;
}

p {
    margin-bottom: 1em;
}

ul {
    list-style: inherit;
    margin: 1em;
}

ul .sublist {
    list-style: circle;
    margin: 0.5em 1em;
}

ul li {
    list-style: inherit;
}


/*ul{
  list-style: disc;
  list-style-position: inside;
  margin: 1em 0;
}

li {

}*/

.wrapper {
    position: relative;
    height: auto;
    min-height: 100%;
    margin-bottom: -20px;
    /* On ne sait pas pourquoi mais sans ça, il y a une bande blanche en bas de chaque page… */
}


/* Default table style */

table {}


/*th {
  border: 1px solid #666666;
  line-height: 2.5em;
  padding: 0 10px;
}*/

td {
    border: 1px solid var( --main-color );
    line-height: 2em;
    padding: 0 10px;
    position: relative;
    /*vertical-align: top;*/
}

th {
    /* Background color*/
    background: var( --main-color );
    /* Everything else ! */
    border: 1px solid #666666;
    color: #ffffff;
    font-weight: normal;
    font-size: 1.1em;
    height: 2.5em;
    line-height: 2.5em;
    padding: 0 10px;
}

tr {
    height: 2.0em;
}

.table-no-inside-border td {
    border: none;
}

table .table-no-inside-border {
    border: 1px solid var( --main-color );
}


/* définition des div */

.home {
    background-color: #ffffff;
    border: 1px solid rgba( 0, 0, 0, 0.6 );
    border-radius: 3px;
    box-shadow: 0px 10px 50px 0px rgba( 0, 0, 0, 0.2 );
    left: 50%;
    margin: auto;
    padding: 2em 1em;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}

    .home table {
        color: #000000;
    }

    .home .error {
        color: red;
        font-weight: bold;
        text-align: center;
        padding-top: 2em;
    }

.menu {
    /*background-color: #000000;*/
    background: var( --main-color );
    background: -moz-linear-gradient(top, var( --main-color ) 0%, rgba( 0, 145, 205, 0.8 ) 100%);
    background: -webkit-linear-gradient(top, var( --main-color ) 0%,rgba( 0, 145, 205, 0.8 ) 100%);
    background: linear-gradient(to bottom, var( --main-color ) 0%,rgba( 0, 145, 205, 0.8 ) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='var( --main-color )', endColorstr='rgba( 0, 145, 205, 0.8 )',GradientType=0 );
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 200px;
}

.menu .titleMenu {
    color: #ffffff;
    font-weight: bold;
    line-height: 1.5em;
    padding: 10px;
}

.menu .titleMenu a {
    color: #ffffff;
    text-decoration: none;
}

#main {
    /*position: relative;*/
    margin-left: 210px;
    padding: 10px;
}

#calendrier {
    position: absolute;
    top: 40px;
    left: 10px;
    width: 180px;
}

#taches {
    position: absolute;
    top: 40px;
    left: 190px;
    width: 550px;
    height: 200px;
    border: 1px dashed #bbbbbb;
    overflow: auto;
}

#messagerie {
    position: absolute;
    top: 270px;
    left: 10px;
    height: 170px;
}


/* définition des styles */

input {
    /*border: 1px solid red;*/
    /*background: #FFFFFF;*/
    font-family: verdana;
    padding: 0;
    margin: 0;
    height: 2em;
}

    input[type=image]{
        height: auto;
      }

table.pickerTable tr {
    height: 20px;
}

table.pickerTable td {
    width: initial;
    height: 14px;
    border: 1px solid #000;
    cursor: pointer;
}

select {
    padding: 0;
    margin: 0;
    height: 20px;
}

textarea {
    padding: 0;
    margin: 0;
    height: 20px;
}


/* classes */

.message-container {
    position: fixed;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 1;
}

    .message-container .message-content {
        background-color: white;
        border: 1px solid;
        border-radius: 5px;
        box-shadow: 0px 3px 20px 5px rgba( 0, 0, 0, 0.25 );
        display: inline-block;
        margin: 1rem;
        padding: 0.5rem;
    }

    .message-container .message-content.error {
        color: red;
        border-color: red;
    }

    .message-container .message-content.success{
        color: green;
        border-color: green;
    }

.msg {
    border: 1px solid #ffffff;
    border-radius: 5px;
    display: none;
    font-weight: bold;
    margin-bottom: 1em;
    padding: 0.5em 1em;
}

    .msg.error {
        color: red;
        border-color: red;
    }

    .msg.success{
        color: green;
        border-color: green;
    }

.obligatoire {
    color: red;
}

.consigneObligatoire {
    margin-top: 1em;
}

.image_thumbnail {
    height: auto;
    width: 100px;
}

    .image_thumbnail:hover{
        opacity: 0.9;
    }

.conteneurChamp {
    /* conteneur principal des champs de formulaires */
    /*border: 1px solid red;*/
    line-height: 2em;
    /* Pour permettre un alignement vertical correct des checkboxes. Voir si ça ne casse rien ailleurs ! */
    margin-bottom: 0.5em;
}

.titre_section_menu {
    text-transform: uppercase;
    font-weight: bold;
    padding: 3px;
}

.formLabel {
    /* label des formulaires (intitulés) */
    border: 0;
    float: left;
    font-weight: normal;
    height: 2em;
    line-height: 2em;
    width: 270px;
    /*max-width: 230px;*/
    /*min-width: 150px;*/
    padding: 0 10px 0 0;
    text-align: right;
    /*border:1px solid green;*/
}

.formLabelErreur {
    /* label des formulaires (intitulés) */
    float: left;
    height: 2em;
    width: 230px;
    border-right: 2px solid red;
    line-height: 2em;
    padding: 0 10px 0 0;
    text-align: right;
    font-weight: bold;
}

.fieldContainer {
    display: inline-block;
}

.choixDeLangue {
    background-color: lightgrey;
    border-radius: 5px;
    border: 3px solid white;
    cursor: pointer;
    display: inline-block;
    margin-right: 2px;
    padding: 0 5px;
}

    .choixDeLangue:hover{
        border: 3px solid orange; 
    }
    
    .choixDeLangue.selected{
        border: 3px solid orange; 
    }
    
    .choixDeLangue.reset-choixDeLangue {
        background: none;
        border: none;
    }

    .choixDeLangue.isLocalized {
        background-color: green;
        color: white;
    }


.messageURL {
    /* message de l'URL à l'encodage des formulaires */
    font-weight: bold;
    color: red;
    margin: 0 0 15px 0;
}

.consignesChamp {
    /* consignes des champs de formulaires */
    font-size: 0.8em;
}

.inputText {
    border: 1px solid #bbbbbb;
    border-radius: 3px;
    /*background: #FFFFFF;*/
    font-family: verdana, sans-serif, helvetica;
    font-size: 1em;
    color: #22392D;
    scrollbar-3dlight-color: #ffffff;
    scrollbar-arrow-color: #ffffff;
    scrollbar-darkshadow-color: #ffffff;
    scrollbar-face-color: #ffffff;
    scrollbar-highlight-color: #ffffff;
    scrollbar-shadow-color: #ffffff;
    scrollbar-track-color: #ffffff;
    height: 2.0em;
    padding: 0.25em 0.5em;
}

.inputTextWYSIWYG {
    /*border: 1px solid red;*/
    border-radius: 3px;
    /*background: #FFFFFF;*/
    font-family: verdana, sans-serif, helvetica;
    font-size: 1em;
    color: #22392D;
    scrollbar-3dlight-color: #ffffff;
    scrollbar-arrow-color: #ffffff;
    scrollbar-darkshadow-color: #ffffff;
    scrollbar-face-color: #ffffff;
    scrollbar-highlight-color: #ffffff;
    scrollbar-shadow-color: #ffffff;
    scrollbar-track-color: #ffffff;
    height: 2.0em;
    padding: 0.25em 0.5em;
}

.inputCheck {
    border: 0;
    /*height: 2em;*/
    line-height: 2em;
    padding: 0;
    margin: 0 7px 0 0;
    /*outline: 1px solid red;*/
}

input[type="checkbox"].inputCheck {
    height: auto;
}

.inputSubmit {
    background-color: var( --main-color );
    border: 0;
    border-radius: 3px;
    color: #FFFFFF;
    cursor: pointer;
    font-family: inherit;
    font-size: 1.1em;
    font-weight: bold;
    height: 2em;
    padding: 0.5em 1em;
}

    .inputSubmit:hover {
        box-shadow: 0 2px 4px 0 rgba( 0, 0, 0, 0.35 );
        margin: -2px 0 2px 0;
      }

.i18n_form {
    /*border: 1px solid red;*/
    display: none;
}

en {
    font-family: tahoma, helvetica, arial, sans serif;
    font-size: 11px;
}

.titre_general {
    font-size: 1.5em;
    color: #999999;
}

.tableau_menu {
    font-family: tahoma, helvetica, arial, sans serif;
    font-size: 11px;
    border: 1px dashed #BBBBBB;
    background-color: #EEEEEE;
}

.titre_menu {
    font-weight: bold;
    text-align: center;
    height: 24px;
    padding-top: 10px;
}

.sousTitreMenu {
    font-weight: bold;
    padding-bottom: 5px;
}

.elementMenu {
    padding: 7px 10px 7px 10px;
    border-bottom: 1px dashed #BBBBBB;
    color: #EEEEEE;
}

.titre {
    font-weight: bold;
}


/*.menu {
    color: #333333;
}*/

.footnote {
    margin-top: 1.0em;
}

.petit {
    font-size: 0.8em;
}

.moi {
    font-weight: bold;
    color: red;
}

.tableau {
    font-size: 1em;
    border: 1px dashed #BBBBBB;
    padding: 1px;
}

.rangeefinale {
    font-weight: bold;
    border-top: 1px dashed #BBBBBB;
    background-color: #EEEEEE;
}

.rangee2 {
    font-weight: bold;
    border-bottom: 1px dashed #BBBBBB;
}


/* TABLE SORTER */

.sortable {}

.sortable thead {
    cursor: pointer;
}

.sortable th {
    border: 1px solid var( --main-color );
    line-height: 2.5em;
    padding: 0 10px;
}

.sortable td {
    line-height: 2em;
    padding: 0 10px;
    border: 1px solid var( --main-color );
}

.sortable .head .classement {
    background: url(../images/sorter/sort.gif) 0 center no-repeat;
    cursor: pointer;
    padding-left: 10px;
    /*outline: 1px solid blue;*/
}

.sortable .desc,
.sortable .asc {
    text-decoration: underline;
}

.sortable .desc .classement {
    background: url(../images/sorter/desc.gif) 0 center no-repeat;
    cursor: pointer;
    padding-left: 10px;
}

.sortable .asc .classement {
    background: url(../images/sorter/asc.gif) 0 center no-repeat;
    cursor: pointer;
    padding-left: 10px;
}

.sortable .evenrow:hover td {
    background: #EEEEEE
}

.sortable .oddrow:hover td {
    background: #EEEEEE
}

/* Files list */
.files_list {
  border: 1px solid transparent;
  border-radius: 3px;
  display: block;
  margin: 1.0em 0;
  padding: 0.25em 0.5em;
  position: relative;
}

  .files_list:hover {
    border-color: #bbbbbb;
  }

  .files_list .files_list__thumbnail {
    display: inline-block;
    margin-right: 0.5em;
  }

  .files_list .files_list__caption {
    display: inline-block;
    line-height: 1.25em;
  }

  .files_list .files_list__actions {
      display: none;
      position: absolute;
      right: 0.5em;
      top: 0.5em;
    }

      .files_list:hover .files_list__actions {
        cursor: pointer;
        display: block;
        position: absolute;
        right: 0;
        top: 0;
      }

    .files_list .files_list__actions .files_list__delete_file,
    .files_list .files_list__actions .files_list__copy2clipboard {
      display: block;
      padding: 0.25em;
      /*float: right;*/
    }

/* Gallery */

.gallery_thumbnail {
  border: 1px solid #dddddd;
  display: inline-block;
  margin: 0.5em;
  position: relative;
}

/*  .gallery_thumbnail > a > img {
    height: 150px;
    width: auto;
  }*/

    .gallery_thumbnail:hover > a > img {
      opacity: 0.9;
    }

  .gallery_thumbnail .thumbnail_caption {
    background-color: rgba( 0, 0, 0, 0.5 );
    bottom: 0;
    display: none;
    left: 0;
    position: absolute;
    width: 100%;
  }

    .gallery_thumbnail:hover .thumbnail_caption {
      display: block;
      font-size: 0.8em;
      color: #ffffff;
    }

    .gallery_thumbnail .thumbnail_caption img {
      /*padding: 0 0.5em;*/
    }

  .gallery_thumbnail .thumbnail_caption .copy2clipboard {
    padding: 0.5em;
    cursor: pointer;
    float: right;
  }

    .gallery_thumbnail .thumbnail_caption div {
      padding: 0.5em;
      display: inline-block;
      /*margin: 0.5em;*/
    }

  .gallery_thumbnail .deleteImage {
    display: none;
    position: absolute;
    right: 0.5em;
    top: 0.5em;
  }

    .gallery_thumbnail:hover .deleteImage {
      cursor: pointer;
      display: block;
    }

/* liens */

a {
    color: #333333;
    text-decoration: none;
}

a:hover {
    color: #F3A773;
}

a.souligne {
    color: #333333;
    text-decoration: underline;
}

a.souligne:hover {
    color: #F3A773;
}

a.lien_lien {
    text-decoration: none;
    color: #BBBBBB;
}

a.lien_lien:hover {
    text-decoration: none;
    color: #999999;
}

/* Duplicator */
.duplicator-container {
  float: right;
  text-align: center;
}

  .duplicator-container .clone-link-container {
      margin-top: 5px;
  }

/*copy2cliploard*/
.copy2clipboard {
    cursor: pointer;
}

/* File uploader */
.button {
    display: inline-block;
}

/* Modifiers */
.hidden {
    display: none;
}