/*
couleur texte : 
- menu #757575  contenu : #000,
Bleu Cogicia : #2eabe3 - Gris fond: #404040 
*/
@font-face {
    font-family: "OpenSans light";
    src: url('../font/OpenSans-Light.ttf');
}

@font-face {
    font-family: "OpenSans italic";
    src: url('../font/OpenSans-Italic.ttf');
}
@font-face {
    font-family: "OpenSans Regular";
    src: url('../font/OpenSans-Regular.ttf');
}

@font-face {
    font-family: "OpenSans bold";
    src: url('../font/OpenSans-Bold.ttf');
}
@font-face {
    font-family: "OpenSans semibold";
    src: url('../font/OpenSans-SemiBold.ttf');
}
em
{
    font-family: "OpenSans italic",sans-serif;
}
strong{
    font-family: "OpenSans semibold", sans-serif;
}

html{font-size:100%}
body {
    font-size: 1rem;
    font-family: "OpenSans Regular", sans-serif;
    color:#333;
    line-height: 1.3;
}
#logo {max-height: 48px;}

h1{
    font-family: "OpenSans light";
    font-size: 1.8em;
    margin-top: 1em;
    margin-bottom: 1em;
    color: #2eabe3;
    text-align: center;
}
h2{
    font-size: 1em;	
    line-height: 2em;	
}
h3{
    color: #2f96c3;
    font-size: 0.9em;
    line-height: 2em;
    padding-left: 1em;
}
/*connexion*/
body{
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
body.container-fluid.login {
    /*    height: 100vh;
        display: flex;
        flex-direction: column;*/
    justify-content: center;
    align-items: center;
}
body.login form{
    padding: 1.5rem 1.75rem;
    box-shadow: 0 0 5px rgba(158,158,158,.65);
    margin-top:1.5rem;
}

/*nav*/
header{justify-content: space-between;padding: 14px 16px}

.main-menu {

    background: #404040;
    color: white;
    margin-left:-15px;
    margin-right: -15px;
}
.main-menu ul {
    display: flex;
    justify-content: space-around;
    width: 100%;
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #404040;
}
.main-menu ul li a:hover, .dropdown:hover .dropbtn {
    background-color: #2FAAE1;
}

/*formulaires*/
form {color:#656565; font-size: 1rem;}
#sujets input {
    margin-top: 1rem;
}
.societe{text-transform: uppercase;}
/*masque*/
#masque {
    position:fixed;    top:0;    left:0; right: 0;bottom:0; background: rgba(0,0,0,.85); display:none; z-index:99;}
#masque #form-interface{background: #fff; position:relative; padding:1.5rem ;
                        max-height: 100%; overflow: auto;  scrollbar-color: #333;  scrollbar-width: thin;}
#masque #form-interface::-webkit-scrollbar-track {
    background: #f1f1f1;
}
label.lblrequired::after{
    content:'*';
    color:red;
}
#masque form legend{text-align: center;color:#2f96c3}
.btn-close {position:absolute; right: 0; top:0; background: none;
            border: 0;
            font-size: 1.5rem;
            line-height: 0;}
p.autre {display:none;}
div.form-control.form-control-lg{height: auto; min-height: calc(1.5em + .75rem + 2px); margin-bottom: .75rem;font-size:1rem;}
.lb-checkbox{padding-right: .5rem;}
/**/
main{flex-grow:2; padding:15px}
#content{display:flex; flex-direction:column;justify-content:  flex-start;}
/*tableau récapitulatif*/
.domaines .recap span.sujet{
    display:block;
}
.d-ajout button { color:#fff;border-radius: 3px 3px 0 0; padding: 5px 10px; }
.recap {width: 100%; }
.recap td {border:solid 1px #2eabe3; padding: .5rem;}
.recap th{background: #2eabe3;color:#fff; text-align: center; padding: 1rem .5rem; }
.recap tr.domaine th{border-bottom:solid 2px #fff;}
.recap tr.sujet th{background: #fff; color:  #2eabe3;border: solid 1px;}
.recap .domaine th a{color:inherit; text-decoration: underline}
.recap .domaine th strong{text-transform: uppercase;}
.recap .domaine th span{font-weight: normal}
.recap th+th{border-left:solid 1px #fff;}
.recap .btn-modif, .recap .btn-del, .recap .btn-feedback {background: none;
                                                          border: none;
                                                          width: 100%;
                                                          outline: none;
                                                          font-size:1rem;}
.recap input.export {width:1.2rem; height: 1.2rem;}
.recap .btn-del{color:red}
button.btn-cancel {
    color: #fff;
    background-color: #053b73;
    border: 0;
    padding: .25rem;
    border-radius: 3px;
}
div#menusSujets {
    margin-bottom: 1rem;
}
.recap ul.sel-action{
    height: 30px;
    width: 150px;
    border: 1px #000 solid;
    list-style: none;padding: 0;

}
ul.sel-action li { padding: 5px 10px; /*position:relative;z-index: 2;*/ cursor: pointer }
ul.sel-action li:not(.init) { float: left; width: 100%; display: none; background: #ddd; }
ul.sel-action li:not(.init):hover, ul li.selected:not(.init) { background: #2eabe3; }
li.init { cursor: pointer; }
.recap ul.list{list-style:square inside; padding:.5rem;}
.recap ul.list li {margin-bottom:.5rem;}
.recap .id_contact{display:none;}
form div.contact, form div.sujet{border: solid 1px #2eabe3;padding: .5rem;margin-bottom: 1rem;}
fieldset.siret {border:solid 1px #2f96c3; padding:1rem;margin-bottom:1rem;}
fieldset.siret legend {font-size:1.1rem; width: auto; padding:0 1.5rem;}
/*fieldset.siret legend::after {
    content:'';height:.9rem; margin-bottom: .5rem;
    display:block; border-top:solid 1px #2f96c3;border-right:solid 1px #2f96c3;border-left:solid 1px #2f96c3;
}*/
.siret input{border-top:none;}
input#nic {width:5rem;}
.demandes #formMail {display:none;
                     position:fixed; top:0; bottom:0; right: 0;min-width: 50%; 
                     padding:4rem 2rem; border:solid 2px #2eabe3; 
                     background: #fff;}
/*trix*/
/*trix toolbar */
.trix-button.trix-button--icon-attach, .trix-button.trix-button--icon-link{
    display:none;
}

/*footer*/
footer.row.copyright {
    justify-content: center;
}
/*surcharde des classes Bootstrap*/
.btn-primary{background-color:#2FAAE1;border-color:#2FAAE1; }
.btn-primary:hover{background-color:#0f516f }
.btn.btn-link {background: none; text-decoration: underline; color:inherit}
.btn.btn-export {font-size: 1em; background: #757575; color:#fff;}
.boxing { overflow: hidden; }
/* filtres */
#div-filtres{
               display: none;
    }
    #div-filtres select, #div-filtres input{}
    #div-filtres label{display: flex; flex-direction: column;margin:0 1rem 1rem;
                       background: #e9edf3; padding:.75rem}
    #div-filtres>div{display:flex;justify-content: flex-start;
                     border-top:solid 1px #2eabe3;
                     border-bottom:solid 1px #2eabe3;
                     padding:1.5rem 15px; margin-bottom:1.5rem;flex-wrap: wrap;}
    #div-filtres .div-buttons{display: flex; flex-grow: 2;
                              justify-content: flex-end; align-items: center}
    #div-filtres button{ margin: .5rem}
    #p_demande{
        border: solid 2px #2eabe3;
    padding: 1.5rem 1rem;
    display: table;
    margin: 1rem auto;
    }
/*media queries*/
@media screen and (min-width:960px){
    #masque #form-interface {max-width: 960px; margin:auto; width: 50%;}
    #content{width:90%; margin:auto; max-width: 1500px;}
    #content.xl{width:100%;}
    .recap{border:solid 1px #2eabe3; max-width:100%;box-sizing: border-box;
    overflow-x:hidden;}
    /*.recap td strong{ display:block; }*/
    .xl .recap{font-size:.9rem;}
    #main-nav button, #top-nav button{
        display:none
    }
}
@media screen and (max-width:959px){
    #masque #form-interface { margin:auto; width: 95%;}
    .recap,.d-ajout{
        width:100%;
    }

    td.export{ display:none;}
    .menu ul{flex-direction:column; display:none;}
    #main-nav button.burger{display:block; background: transparent;color:#fff;
                            border:solid 0 transparent;
                            text-align:right;}
    button.btn-user{display:block; background: transparent;color:#333;
                    border:solid 0 transparent;
                    text-align:right;}
    #header{
        flex-direction: column-reverse;
        align-items: center;
    }

    #top-nav{display:flex; flex-direction:column;
             align-self: flex-end;
             background:none; color:#333;
             text-align:right;} 
    #top-nav a{display:none;    padding: .25rem 0;}
    nav button, nav button:hover,av button:focus{
        border: 0!important;
        background: 0;
        text-align: right;
    }
    /**/
    select option {
        overflow-wrap:  break-word;
        text-overflow: ellipsis;
    }
}
@media screean and (min-width:576px){
    input.mb-6 {
    width: 60%;
}
}
/*tableau responsive */
@media screen and (max-width:1025px){
   .xl .table thead, .table th {
        display: none;
    }
   .xl  .table tr{
        display: block;
        margin-bottom: 40px;
    }
  .xl   .table td {
        display: block;
        text-align: left;
    }
  .xl   .table td:before {
        content: attr(data-label);
        display:block;
        font-weight: bold;
    }
  .xl   .recap ul.sel-action{display:flex; width: 100%;height: auto; border-color:#2eabe3;
                         flex-wrap: wrap; justify-content: space-between;  
                         align-items:stretch; }
 .xl    .recap ul.sel-action .init{display:none;}
  .xl   .recap ul.sel-action li a{color:inherit;}
 .xl    .recap ul.sel-action li:not(.init){display:list-item; width:auto; margin:5px 0;
                                       border-radius: 2px; background:#2eabe3; color:#fff;font-weight: bold; float: none; padding: .25rem; }

}
@media (max-width: 959px){
    #content{width:100%}
    .table thead, .table th {
        display: none;
    }
    .table tr{
        display: block;
        margin-bottom: 40px;
    }
    .table td {
        display: block;
        text-align: left;
    }
    .table td:before {
        content: attr(data-label);
        display:block;
        font-weight: bold;
    }
    .recap ul.sel-action{display:flex; width: 100%;height: auto; border-color:#2eabe3;
                         flex-wrap: wrap; justify-content: space-between;  
                         align-items:stretch; }
    .recap ul.sel-action .init{display:none;}
    .recap ul.sel-action li a{color:inherit;}
    .recap ul.sel-action li:not(.init){display:list-item; width:auto; margin:5px 0;
                                       border-radius: 2px; background:#2eabe3; color:#fff;font-weight: bold; float: none; padding: .25rem; }
}