/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


/* ==========================================================================
Author's custom styles
========================================================================== */
body {
    font-family: 'robotolight',arial, sans-serif;
    margin:166px 0 0 0;
    color:#222;
    background-color: #fff;
}

h1,h2,h3,h4,h5,h6 {
    font-weight:normal;  
    font-family: 'roboto_condensedregular',arial, sans-serif;
    margin:0;
}

ul, li {
    list-style-type:none;
    margin:0;
    padding:0;
}

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

a:hover {
    color:#666;   
}

.ui-state-highlight { height: 1.5em; line-height: 1.2em; }

/* position des block principaux */

#main-header {
    position:fixed;
    left:0;
    top:0;
    width:100%;
    background-color:rgba(255,255,255,0.95);
    min-height:135px;
    z-index: 1000;
}

#main-display {
    /*margin:0 20px;  */ 
    position:fixed;
    width:100%;
    left:0;
    top:148px;
    bottom:0;
    transition: width 0.5s linear;
    overflow: auto;
}

body.right-reduced #main-display, body.right-reduced footer.colonne {
    width:75%;   
}

.fullwidth #main-editor {

}

.right-reduced #main-editor {
    left:75%;
}

#main-editor {
    position:fixed;
    top:148px;
    bottom:15px;
    width:25%;
    left:100%;
    z-index: 1000;
    background-color: #fff;
    border-left:2px solid #333;
    overflow:auto;
    transition: left 0.5s linear;
}

/* navigations - principale et tools */

.login-off .login, .login-on #login {
    display:block;   
}

.login-on .login, .login-off #login {
    display:none;   
}

.cadre-info {
    font-size:11px;
    padding:6px;
    background-color:#f6f6f6;
    color:#333;
    margin:1em 0;
    font-family: 'robotoregular';
}

/*
.form {
background-color: #f0f0f0;
padding:10px;
border-radius: 6px;
margin-top:6px;
}
*/
form.form-small label {
    color:#000;
}

form.form-small input, input.small-input {
    font-size: 11px;
    padding: 0px;
    border: 0;
    color: #222;
    border-bottom: 1px dotted #D1D1D1;
}


form.form-small fieldset input:focus, input.small-input:focus  {
    background: #fff;
}


.form-part-head {
    margin-bottom:4px;
}

.form-part-head h3 {
    background-color:#aaa;
    color:#fff;
    border-radius: 4px;
    padding:4px 6px;
}

.form-part-head h3 a{
    color:#fff;
    text-shadow: 0px 1px 0px #333;
}
.close .form-part-content {
    display:none;
}
.open .form-part-content {
    display:block;
}

.form-part-content {
    margin-bottom:1em;   
}

.bouton.bouton-plus {
    width:20px;
    height:20px;
    padding: 5px;
    font-size: 16px;
    border: 1px solid #ddd;
    background: #e2e2e2;
    border-radius: 4px;
    font-weight: bold;
    text-align: center;
    margin-top:10px;
    line-height: 1;
    cursor: pointer;
}

.bouton.bouton-plus:hover {
    background-color:#5c5a5a;
    color:#fff;
}

/* form toplabel */
form.toplabel fieldset {
    margin: 0 0 20px 0;
    font-size: 14px;
}
form.toplabel fieldset.form-actions {
    margin: 0;
}
form.toplabel fieldset label {
    display: block;
    margin: 0 0 5px 0;
    font-weight: bold;
}
form.toplabel fieldset.check label {
    display: inline;
    font-weight: normal;
}
form.toplabel fieldset.radio ul li label {
    display: inline;
    font-weight: normal;
}
form.toplabel fieldset input.form-text,
form.toplabel fieldset textarea, .form-doc-line {
    display: block;
    width: 100%;
    padding: 5px;
    font-size: 14px;
    border: 1px solid #ddd;
    background: #f6f6f6;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.05);
    -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.05);
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.05);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    box-sizing: border-box;
    margin-bottom:2px;

}
form.toplabel fieldset input.form-text:focus {
    border: 1px solid #ccc;
    background: #fff;
}
form.toplabel fieldset textarea {
    height: 150px;
}
form.toplabel fieldset select {
    min-width: 25%;
    margin: 0;
}
form.toplabel fieldset.radio ul {
    margin-top: 5px;
}
form.toplabel fieldset.radio ul li {
    margin: 0 0 5px 0;
}
form.toplabel fieldset.radio ul li:last-child {
    margin: 0;
}
form.toplabel fieldset p.form-help {
    margin: 5px 0 0 0;
    font-size: 12px;
    color: #999;
}
form.toplabel input[type="submit"] {
    margin: 0;
    padding: 5px 10px;
    font-size: 12px;	
    border: 1px solid #ccc;
    background: #777;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color:#fff;
}
form.toplabel input[type="submit"]:hover,
form.toplabel input[type="submit"]:focus {
    border: 1px solid #bbb;
    background: #444;
}
form.toplabel input[type="submit"]:active {
    border: 1px solid #ccc;
    background: #eee;
}	




.sep {
    margin:6px 35px; 
    border-bottom:2px solid #333;
}

#main-nav nav {
    font-size:13px;
    text-transform: uppercase;
    font-family: 'robotoregular', sans-serif;

}

.adminnav {
    text-align:right;   
}

#display-tools.colonne {
    font-size:14px;
    padding-bottom: 6px;
}

#display-tools a {
    padding-right:4px;   
}

body.fullwidth #bouton-fullwidth {
    display:none;
}

body.deuxtiers #bouton-fullwidth {
    display:inline;   
}

#display-tools .icon-group {
    padding-right: 1.5em;
}

#display-tools a {
    color:#bbb; 
}

#display-tools a:hover {
    color:#666; 
}

#display-tools .on, #display-tools .on:hover {
    color:#111;
}

#display-tools .searchlink {
    color:#222; 
    display:none;
}

.small-input {
    display:none;  
}

#display-statut {
    font-size:12px;   
    text-align:right;
}

#display-statut span {
    display:none;
}

#display-statut span:last-child {
    display:inline;
}

.texte {
    line-height:1.4;
}

.texte.medium {
    font-size:13px;
}

.texte.mini {
    font-size:11px;
}

.texte.tiny {
    font-size:9px;   
}

.texte a {
    text-decoration: underline;
}

.editor-info {
    margin-bottom:1em;   
}

.info-tools { padding: 6px;
    background-color: rgb(230, 230, 230);
    border-radius: 4px;
    display: flex;
}

#main-editor-tools {
    color:#cc0000;
    font-size:11px;
    padding:4px 6px;
    font-family: 'robotobold',sans-serif;
    margin-bottom:25px;

}

.editor-tools-left {
    float:left;
}

.editor-tools-right {
    float:right;
}

.tool-button {
    cursor:pointer;
    zoom:1;
    line-height:normal;
    white-space:nowrap;
    vertical-align:middle;
    text-align:center;
    cursor:pointer;
    -webkit-user-drag:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box
}
.tool-button::-moz-focus-inner {
    padding:0;
    border:0
}
.tool-button {
    font-family:inherit;
    font-size:100%;
    padding:.4em;
    color:#333;
    color:rgba(0,0,0,.8);
    border:1px solid #999;
    border:0 rgba(0,0,0,0);
    background-color:#f6f6f6;
    text-decoration:none;
    border-radius:2px;
    display: flex-item;
    margin-right: 2%;
}

.tool-button.carefull, .item-tools a.carefull {
    color:#cc0000;
}

.tool-button.small-carefull {
    color:#cc0000;
    font-size:11px;
    padding:4px 6px;
    font-family: 'robotobold',sans-serif;
}

.tool-button-hover,.tool-button:hover,.tool-button:focus {
    background-color:#ddd;
    color:#000;
}
.tool-button:focus {
    outline:0
}
.tool-button-active,.tool-button:active {
    box-shadow:0 0 0 1px rgba(0,0,0,.15) inset,0 0 6px rgba(0,0,0,.2) inset;
}
.tool-button[disabled],.tool-button-disabled,.tool-button-disabled:hover,.tool-button-disabled:focus,.tool-button-disabled:active {
    border:0;
    background-image:none;
    filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);
    filter:alpha(opacity=40);
    -khtml-opacity:.4;
    -moz-opacity:.4;
    opacity:.4;
    cursor:not-allowed;
    box-shadow:none
}
.tool-button-hidden {
    display:none
}
.tool-button::-moz-focus-inner {
    padding:0;
    border:0
}
.tool-button-primary,.tool-button-selected,a.tool-button-primary,a.tool-button-selected {
    background-color:#0078e7;
    color:#fff
}

/* main display */
.content-display {
    position:relative;
}

.waiter {
    font-size:3em;
    padding:3em 0;
    text-align: center;
    color:rgba(0,0,0,0.7);
    position:absolute;
    width:100%;
    z-index:10000;
}

#main-display .item.selected {
    background-color: #eee;
}

#main-display img{
    max-width:100%;
}

#main-display .item {
    position:relative;
}

#main-display .update-items li.chosen {
    background-color:#ccc;   
}

#main-display ul {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

#main-display .titre {
    font-family: 'robotoregular',sans-serif;  
    text-transform: uppercase;
}

.item-toolbox {
    position:relative;
}

.item-toolbox .item-mid-icon {
    display:none;  
}

#main-display .item-toolbox:hover .item-mid-icon {
    display:block;   
}

.item-toolbox .item-mid-icon {
    position:absolute;
    font-size: 24px;
    background-color: rgba(0,0,0,0.3);
    color: rgba(255,255,255,0.7);
    width: 50%;
    text-align: center;
    line-height: 140px;
    height: 100%;
    top:0; 
}

.item-toolbox .item-mid-icon:hover {
    background-color: rgba(0,0,0,0.8);
    color: #24e624;
}

.item-toolbox .item-mid-icon.left  {
    left:0;

}

.item-toolbox .item-mid-icon.right  {
    right:0;
}

.item-tools.big {
    margin-top:1em;   
}

.item-tools.big a {
    font-size: 16px;
    width: 19px;
    line-height: 16px;
    height: 19px;
}

.item-tools a:hover {
    color:#ddd;
    background-color: #333;
}


#main-display .update-items .item-toolbox:hover .item-mid-icon {
    display:none;
}


#main-display.selection li {
    display:none;
}

#main-display.selection li.selection-selected {
    display:block;
}

/* liste en mosaique */


section[data-display=mosaic] ul {
    -webkit-flex-direction: row;
    flex-direction: row;    
}


section[data-display=mosaic] .item {
    float:left; 
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; 
    width:12.5%;
    position:relative;
    overflow:hidden;
    padding:5px;
}

section[data-display=mosaic] .titre {
    padding-top:6px;
    color:#222;
    font-size:10px;
}

section[data-display=mosaic] .descriptif {
    display:none;   
}


.right-reduced .item-toolbox .item-mid-icon {
    line-height: 85px;   
}

/* liste en grande mosaique */


section[data-display=big-mosaic] ul {
    -webkit-flex-direction: row;
    flex-direction: row;    
}


section[data-display=big-mosaic] .item {
    float:left; 
    overflow:hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; 
    width:33.333333%;
    position:relative;
    overflow:hidden;
    padding:5px;
}

section[data-display=big-mosaic] .titre {
    padding-top:6px;
    color:#222;
    font-size:12px;
}

section[data-display=big-mosaic] .descriptif {
    display:none;   
}

section[data-display=big-mosaic] img {
    width:100%;
}

/* mosaique  en liste  - - - - */

section[data-display=liste] ul {
    -webkit-flex-direction: column;
    flex-direction: column;   
}

section[data-display=liste] .item {
    margin-bottom:1em; 
    width:100%;
    display: flex;
    display:-webkit-flex;
}
section[data-display=liste] .titre {
    margin-bottom:0.4em;
    color:#000;
    font-size:16px;
}

section[data-display=liste] .illu {
    float:left;
    margin-right: 2%;
    width:150px;
}

section[data-display=liste] .info-content {
    float:left; 
    margin-left:16px;
}

section[data-display=liste] .descriptif {
    font-size:11px;
    margin-bottom:1em;
}

/* liste small  */
section[data-display=liste-small] ul {
    -webkit-flex-direction: column;
    flex-direction: column;   
}

section[data-display=liste-small] .item {
    margin-bottom:6px; 
    width:100%;
    padding:4px;
}

section[data-display=liste-small] .item .illu {
    float:left;
    padding-right: 2em;
    width:150px;
    display:block;
}

section[data-display=liste-small] .item:nth-child(even) {
    background-color:#eee;
}

section[data-display=liste-small] .item-mid-icon, section[data-display=liste-small] .illustration { 
    width:40px;
    height:40px;
    position:relative;
    float:left;
    display:block;
    margin-right: 10px;
    line-height:40px;
    font-size:16px;
}

section[data-display=liste-small] .descriptif {
    display:none;   
}
section[data-display=liste-small] .titre, section[data-display=liste-small] .info-content {
    display:inline;
}
section[data-display=liste-small] .illustration {

}

#liste-small .illustration {
    width:40px;
}

/*  wide */
#wide {
    overflow-x: auto;
    padding-bottom:1em;
}
#wide ul {

    display:flex;
    -webkit-flex-direction: row; /* Safari */
    flex-direction:         row;
    -webkit-flex-wrap: nowrap; /* Safari */
    flex-wrap:         nowrap;
}
#wide li {
    width:500px;
    padding:10px;

}
/*
#wide li:nth-child(even) {
background-color: #eee;

}   
*/

/* display lateral   
.item:hover span {
display:block;   
}
*/

fieldset.file, .file-item  {
    position:relative;  
}

.image .file-item.multiple  {
    margin-bottom:0.5em;
}

li.image.multiple {
    display: flex;
    flex-wrap: wrap;
}

li.multiple label {
    width:100%;
    font-family: 'robotobold',sans-serif;
    margin:1em 0 0.3em 0;
}

.image.multiple .info-content {
    width:50%;
    float: left;
    padding:2px;
    box-sizing: border-box;
}

.display {
    margin-bottom:0.5em;
}

.display-date_entree {
    font-size: 10px;
}

.tools-image {

}

.item-tools.tools-image {
    display:block;
    position:absolute;
    bottom:6px;
    right:6px;
    top:auto;
}


.cartouche-item img {
    width:18%;
    display:inline-block;
    margin-right:2%;
}

.cartouche-item a {
    display:inline-block;
    width:10%;

    color:red;
}
.cartouche-item span {
    display:inline-block;
    width:70%;
    font-size: 12px;
}
.cartouche-item {
    padding:4px;
    background-color:#eee;
    border-radius:4px;
    margin-bottom:4px;
    font-family: 'robotoregular',sans-serif; 
}

/* tools display */


#main-editor .adapt {
    width:100%;
}

.item-tools a, .item-tools label, .form-doc-line label {
    font-size: 11px;
    background-color: #ccc;
    color: #000;
    border-radius: 3px;
    padding: 2px;
    width: 13px;
    float: left;
    text-align: center;
    margin-right: 4px;
    line-height: 11px;
    height: 13px;
}

.form-doc-line label {
    float:right;
}

.item-tools input, .form-doc-line input {
    display:none;
}

.file-item.remove img, .file-item.remove .form-doc-line {
    opacity:0.5;
}

.file-item.remove label {
    background-color:#d42f2f;
    color:#fff;
}

.file-item.remove {
    background-color:red;
}

.item-tools.big {
    margin-top:1em;   
}

.item-tools.big a {
    font-size: 16px;
    width: 19px;
    line-height: 16px;
    height: 19px;
}

.item-tools a:hover {
    color:#ddd;
    background-color: #333;
}

.wait {
    background-image: url(../img-default/wait.gif);
    background-repeat: no-repeat;
    background-position: center center;
}

.display-title {
    font-family: 'robotoregular',sans-serif;  
    text-transform: uppercase;
    font-size:21px;
    margin-bottom:0.5em;
}

.display-illustration {
    margin-bottom:0.5em;
    overflow-x: hidden;
}

#tools-display .display-illustration .adapt {
    width:auto;
    max-width:100%;
    max-height:300px;
}

.display-note {
    font-size:13px;
    margin-bottom:0.5em;
}

.display-author, .display-publisher, .display-isbn {
    font-size:11px;
    font-weight: bold;
    margin-bottom:0.2em;
}

/*  autres  */
.message {
    background-color: beige;
    border-radius: 20px;
    border:1px solid #999;
}

#table {
    font-size: 12px;
    background: #fff;
    width: 100%;
    border-collapse: collapse;
    text-align: left;
    color: #669;
}


#table th {
    font-size: 14px;
    font-weight: normal;
    color: #039;
    padding: 10px 8px;
    border-bottom: 2px solid #6678b1;
}
#table td {
    border-bottom: 1px solid #ccc;

    padding: 6px 8px;
}

#table tr.attention {
    background-color:rgba(255, 0, 0, 0.38);
    color:red;
}
#table tbody tr:hover td {
    color: #009;
}


/* ==========================================================================
Systeme de colonne - stephane
========================================================================== */
.retrait {
    padding:20px; 
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

.retrait-lat {
    padding:0 20px; 
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

.retrait-top {
    padding-top:20px;
}

.retrait-bottom {
    padding-bottom:20px;
}

.exergue{
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px 10px 10px 10px;
    background-color: #f5f5f5;
    padding: 20px;
}

.colonne.nopad {
    padding:0;   
}

.colonne.padlat {
    padding:0 35px;
}

.colonne.minipad {
    padding:17.5px 35px;   
}

.colonne {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */	
    float:left;
    overflow:hidden;
    position:relative;
    padding:35px;
}

.colonne.full { width:100%;	float:none; }
.colonne.mini, .mini-retrait { padding:10px; }
.colonne.tiers { width:33.33333%; }
.deuxtiers { width:66.6666666%;	}
.colonne.quart { width:25%;	}
.colonne.demi { width:50%; }
.colonne.troisquart { width:75%; }
.colonne.cinquieme { width:20%;	}
.colonne.deuxcinquiemes { width:40%; }
.colonne.troiscinquiemes { width:60%; }
.colonne.quatrecinquiemes { width:80%; }

.colonne.notop, h2.notop {
    padding-top:0;
    margin-top:0;
}

.colonne.nobottom, h2.nobottom {
    padding-bottom:0;
    margin-bottom:0;
}





@media only screen and (max-width: 699px) {

    .colonne.tiers, .colonne.deuxtiers, .colonne.demi, .colonne.quart, .colonne.troisquart, .colonne.cinquieme, .colonne.deuxcinquiemes, .colonne.troiscinquiemes, .colonne.quatrecinquiemes, nav li  {
        width:100%;
    }

    .projets .flex {
        display: block;

    }
}

@media print,
    (-o-min-device-pixel-ratio: 5/4),
    (-webkit-min-device-pixel-ratio: 1.25),
    (min-resolution: 120dpi) {

}
/* ==========================================================================
Helper classes
========================================================================== */

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
Print styles
========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}