/**** fonts ****/

@font-face {
    font-family: "font";
    src:  url("../fonts/fakt-pro/FaktPro-Normal.woff2") format("woff2"),
    url("../fonts/fakt-pro/FaktPro-Normal.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "font";
    src:  url("../fonts/fakt-pro/FaktPro-Bold.woff2") format("woff2"),
    url("../fonts/fakt-pro/FaktPro-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'icomoon';
    src:  url('../fonts/icomoon/fonts/icomoon.eot?7c2g3h');
    src:  url('../fonts/icomoon/fonts/icomoon.eot?7c2g3h#iefix') format('embedded-opentype'),
    url('../fonts/icomoon/fonts/icomoon.ttf?7c2g3h') format('truetype'),
    url('../fonts/icomoon/fonts/icomoon.woff?7c2g3h') format('woff'),
    url('../fonts/icomoon/fonts/icomoon.svg?7c2g3h#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-chevron-right:before {
    content: "\e963";
}
.icon-chevron-left:before {
    content: "\e964";
}
.icon-chevron-down:before {
    content: "\e965";
}
.icon-chevron-up:before {
    content: "\e966";
}
.icon-home:before {
    content: "\e962";
}
.icon-icon-aio-plus:before {
    content: "\e905";
}
.icon-icon-blogs:before {
    content: "\e90f";
}
.icon-icon-calendar:before {
    content: "\e910";
}
.icon-icon-gear:before {
    content: "\e92c";
}
.icon-icon-pencil:before {
    content: "\e940";
}
.icon-icon-power-off:before {
    content: "\e943";
}
.icon-icon-remove:before {
    content: "\e947";
}
.icon-icon-search:before {
    content: "\e949";
}


/**** end fonts ****/

/**** general ****/

body{
    font-family:'font', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    outline:none!important;
    color: #333333;
    font-size:15px;
}
.btn.primary, .btn.secondary, input[type="button"].primary, input[type="submit"].primary{
    background-color: #c20033!important;
    border-color: #c20033!important;
    color:white!important;
    outline:none!important;
    text-transform: none;
}
.btn{
    font-size: 15px;
    text-transform:none;
    background-color: #fff!important;
    border: solid 1px #D3DCE6!important;
    color: #333333;
}
h1 {
    font-family: 'font', Helvetica, Arial, sans-serif;
    color: #333333;
    font-size: 21px;
    font-weight: normal;
    margin-top:0;
    text-transform:none;
}
#pln_addp, #pln_addt, #pln_editt, #pln_editp, #pln_dtlt, #pln_dtlp, .pln_lbform, #pln_addinfo, #pln_editinfo{
    padding:20px;
}
button{
    outline:none!important;
}
select{
    padding: 2px 33px 2px 8px;
    margin-bottom: 0;
    height: 33px;
    line-height: 17px;
    text-transform: none;
    background: #fff url(../images/icon-arrow-down.svg) no-repeat right 0.75rem center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size:14px;
    font-family:'font', Helvetica, Arial, sans-serif;
    color: #333333;
    border: 1px solid #D3DCE6;
    outline:none!important;
}
input[type=text], input[type=password],  input[type=email]{
    font-family: 'font', Helvetica, Arial, sans-serif;
    color: #333333;
    font-size:14px;
    padding: 2px 8px 2px 8px;
    height: 33px;
    line-height: 17px;
    border: 1px solid #D3DCE6;
    box-sizing: border-box;
    outline:none!important;
}
#cboxClose {
    position: absolute;
    bottom: auto!important;
    top: 20px;
    right: 20px!important;
}
.action{
    margin-top:20px;
    text-align: right;
}
.action .btn{
    margin-left:10px;
}
/**** end general ****/

/**** header ****/

#header {
    background-color: #fff;
    color: #333333;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 2px 12px rgba(132,146,166,.1);
}
#header_titre{
    font-family:'font', Helvetica, Arial, sans-serif;
    color: #333333;
    font-weight:bold;
    margin-left:20px;
    margin-right: auto;
}
#header_titre span.highlighted{
    color: #333333!important;
}
#header_titre span.highlighted .petit{
    color: #333333!important;
}
span#userlogged a{
    color: #333333!important;
    text-transform: none;
    width:auto;
    font-size:1.2rem;
    position: static;
    padding: 0 20px 0 0;
}
#header_menu{
    background: #fff;
    position: static;
    padding:0 20px 0 20px;
}
#header_menu .ui-button{
    background-color: #c20033;
    min-width: 33px;
    font-size: 12px;
    margin-top: -3px;
    height:33px;
    background-image: none;
    position: relative;
}
#header_menu .ui-button:before{
    background-image: none;
    font-family: 'icomoon';
    color:white;
    font-size:16px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
#header_menu .ui-icon{
    display:none;
}
div#switchdb{
    background-color: #F5F6FA;
    top:70px;
    color: #333333;
    padding:8px 20px;
    font-size:12px;
}
div#switchdb select {
    padding: 2px 8px;
    margin-bottom: 0;
    height: 33px;
    line-height: 17px;
    text-transform: none;
    color: #333333;
    background: #fff url(../images/icon-arrow-down.svg) no-repeat right 0.75rem center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size:14px;
    font-family:'font', Helvetica, Arial, sans-serif;
    color: #333333;
    border: 1px solid #D3DCE6;
    outline:none!important;
    margin-left:10px;
}
#header_logo img{
    width: 146px;
    height: auto;
    position:static;
    margin-top: 2px;
    margin-left:20px;
}
#header_titre span.highlighted{
    margin-left: 0;
    margin-right: 0;
    color:#c20033;
}
/**** end header ****/

/**** login ****/

html.login {
    height: 100%;
    background-color: #F5F6FA;
}
html.login body {
    background: transparent;
}
/*html.login #zone_login{
    background: white;
    border:none;
}
html.login #zone_login {
    background: white;
    border: none;
    padding: 40px;
}
html.login #zone_login input{
    width:100%;
    display:block;
    margin-bottom:15px;
}
html.login #zone_login button{
    width:100%;
    display:block;
}*/
#zone_login{
    background: white;
    border:none;
}
#zone_login {
    background: white;
    border: none;
    padding: 40px;
}
#zone_login input{
    width:100%;
    display:block;
    margin-bottom:15px;
}
#zone_login button{
    width:100%;
    display:block;
}
/**** end login ****/

/**** content main ****/
div.planning_12h th .th_heures{
    font-size: 13px !important;
}
div.blocinfo.add{
    color: #333333;
}
#principal {
    margin-top: 124px;
}
table.planning td.tdunite div{
    background: #F5F6FA;
    border: none;
    color: #333333;
    font-weight: normal;
}
table td{
    border-color: #D3DCE6!important;
}
.tr_blocinfos .ui-button{
    width:33px;
    height:33px;
    background-color: #fff!important;
    border-color: #D3DCE6;
    color:white;
    margin-right:8px;
}
.tr_blocinfos .ui-button.ui-state-default{
    background: transparent;
}
div.pln_slot:hover{
    background-color: #F5F6FA;
    opacity:1!important;
}
#cboxOverlay {
    background: rgba(0, 0, 0, 0.6)!important;
}
span.selection_personnes {
    margin-right: 20px;
    margin-top: 15px;
    display: inline-block;
}
.btgestion {
    font-family: 'font', Helvetica, Arial, sans-serif!important;
    background-color: #F5F6FA!important;
    padding-top: 0!important;
    padding-bottom: 10px!important;
    /* box-sizing: border-box; */
    margin-bottom: -12px;
    color: #333333!important;
}
.petit {
    color: #333333;
}
.zone_detail table tr:nth-child(odd) {
    background-color: #F5F6FA;
}
/**** end content main ****/

/**** reporting ****/

/*
.index-reportings .btgestion {
    margin-bottom:10px;
    margin-top:10px;
}
.index-reportings .btgestion {
    margin-bottom: 10px;
    margin-top: 10px;
    height: auto!important;
    padding-bottom: 0!important;
}
*/
/**** end reporting ****/

/**** index boxes ****/
.index-boxes-2021{
    display:flex;
    flex-wrap: wrap;
    justify-content: center;
    box-sizing:border-box;
}
.index-boxes-2021 .btgestion{
    box-sizing:border-box;
    display:flex;
    align-items: center;
    justify-content: center;
    padding:0 10px!important;
    margin:0!important;
    border:solid 8px white!important;
    border-radius: 12px!important;
    height: auto!important;
}
/**** end index boxes  ****/

.zone_detail table .libelle{
    text-transform: none;
}
table.table_liste th {
    border-radius: 3px / 3px;
    background-color: #AEAEAE !important;
}
input[type=number] {
    padding: 2px 8px 2px 8px;
    margin-bottom: 0;
    height: 27px;
    line-height: 17px;
    text-transform: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 14px;
    font-family: 'font', Helvetica, Arial, sans-serif;
    color: #333333;
    border: 1px solid #D3DCE6;
    outline: none !important;
}
.planning-mobile{
    display:none;
}
.planning-mobile-switch{
    display:none;
}
#header_menu .ui-button{
    border:none!important;
}
#header_titre {
    text-transform: none!important;
}
.planning .pln_td_nom{
    white-space: nowrap;
    font-size:15px;
    max-width: inherit!important;
    width:auto!important;
    padding-right: 10px!important;
}
@media screen and (max-width:1279px){
    #header{
        display:block;
        height:auto;
        padding: 0 0 15px 0;
        position: static;
    }

    div#switchdb{
        position: static;
        padding:5px 20px;
        text-align:left;
    }
    #header_logo img {
        width: 106px;
        margin-top: 15px;
    }
    #header_titre{
        padding:10px 20px;
        font-size: 15px;
        margin:0;
        text-align:left;
        font-weight:bold;
    }
    #header_titre span.highlighted{
        font-size: 15px;
    }
    #userlogged{
        display:block;
    }
    span#userlogged a {
        font-size: 11px;
        position: absolute;
        top: 16px;
        left: auto;
        right: 0;
    }
    #header_titre span.highlighted .petit {
        font-size: 15px;
    }
    #header_menu .ui-button {
        background-color: #c20033;
        margin:3px 3px 3px 0!important;
        height: 33px;
        min-width: 33px;
    }
    #header_menu{
        padding: 0 0 0 20px;
        box-sizing: border-box;
        text-align: left;
        height:auto;
    }
    #principal{
        overflow-x: auto;
        margin-top:0;
    }
    .le_planning {
        min-width: 1280px;
    }
    html.login #zone_login {
        background: white;
        border: none;
        padding: 20px;
    }
}
@media screen and (max-width: 768px){
    table.planning th {
        min-width: 27px;
    }
    #pln_addp, #pln_addt, #pln_editt, #pln_editp, #pln_dtlt, #pln_dtlp, .pln_lbform, #pln_addinfo, #pln_editinfo {
        padding: 10px;
    }
    #formReporting table .td-1ligne-mobile td:nth-of-type(odd), #formReporting table .td-1ligne-mobile td:nth-of-type(even),
    #formReporting table td:nth-of-type(odd), #formReporting table td:nth-of-type(even)
    {
        display: block !important;
        padding: 5px 10px !important;
        height: auto !important;
        float:none!important;
        width:100%!important;
        box-sizing: border-box;
    }
    #formReporting table .td-1ligne-mobile td:first-child{
        padding-top:10px!important;
    }
    #formReporting table .td-1ligne-mobile td:last-child{
        padding-bottom:10px!important;
    }
    #formReporting table td select{
        width:100%;
    }


    #header_titre {
        text-align: center;
        padding: 15px 10px 10px 10px;
    }
    #header_titre, #header_titre span.highlighted,#header_titre span.highlighted .petit {
        font-size:15px;
    }
    #principal {
        min-height: 70vh;
    }
    .bouton_home{
        display:none!important;
    }
    .planning{
        display:none;
    }
    .planning-mobile{
        display:block;
    }
    body.show-planning-mobile-all .planning{
        display:block;
    }
    body.show-planning-mobile-all .planning-mobile{
        display:none;
    }

    .le_planning {
        min-width: 1px;
    }
    body.show-planning-mobile-all .le_planning {
        min-width: 900px;
    }

    .planning-mobile td,
    .planning-mobile th
    {
        text-align:left;
    }
    .planning-mobile thead tr th
    {
        text-align: center;
        box-sizing:border-box;
        font-size:15px;
        font-weight:bold;
        border-left: solid 1px #eaeaea;
        border-bottom: solid 1px #eaeaea;
        padding: 5px 0 15px 10px;
    }
    .planning-mobile thead tr th:first-child{
        border-left:none;
        padding-left:0;
    }
    .planning-mobile tbody th,
    .planning-mobile tbody td
    {
        box-sizing:border-box;
        font-size:15px;
        font-weight:normal;
        text-align:left;
        border-left: solid 1px #eaeaea;
        border-bottom: dotted 1px #eaeaea;
        padding: 10px;
    }
    .planning-mobile tbody th{
        border-left:none;
        padding-left:0;
    }
    .planning-mobile tbody td{
        padding-top:0;
        padding-bottom:0;
        padding-left:4px;
        padding-right:0;
    }
    .planning-mobile-patrouille{
        font-weight:bold;
        height:24px;
        color:white;
        padding:10px 55% 10px 15px;
        cursor:pointer;
        position:relative;
    }

    .planning-mobile-patrouille.planning-mobile-patrouille-empty{
        cursor:default;
    }
    .planning-mobile-mission.planning-mobile-mission-empty{
        cursor:default;
        opacity:0;
    }

    .planning-mobile-mission{
        font-weight:normal;
        font-size:14px;
        height:24px;
        color:white;
        padding:10px 15px;
        cursor:pointer;
        position:absolute;
        background: rgba(255,255,255,0.4);
        top: 0;
        left: auto;
        right: 4px;
        border-left: dotted 1px #fff;
        width:40%;
    }
    .planning-mobile-patrouille-start{
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
        margin-top:4px;
    }
    .planning-mobile-patrouille-end{
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
        margin-bottom:4px;
    }
    .planning-mobile-mission.planning-mobile-mission-start{
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
        top:4px;
    }
    .planning-mobile-mission.planning-mobile-mission-end{
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
        height:20px;
    }
    .planning-mobile-mission.planning-mobile-mission-end.planning-mobile-mission-start{
        height:20px;
    }
    #switchdb{
        display:none;
    }
    .planning-mobile-switch{
        display:flex;
        justify-content: center;
        margin-bottom:-5px;
        margin-top:20px;
    }
    .planning-mobile-switch div{
        cursor:pointer;
        background: #fff;
        width:50px;
        height:33px;
        display:flex;
        justify-content: center;
        align-items: center;
        border-top: solid 1px #c20033;
        border-bottom: solid 1px #c20033;
    }
    .planning-mobile-switch div.active
    {
        background: #c20033;
    }
    .planning-mobile-switch-one-people{
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
        border-left: solid 1px #c20033;
    }
    .planning-mobile-switch-all-people{
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
        border-right: solid 1px #c20033;
    }
    .planning-mobile-switch div img:nth-child(1){
        display:none;
    }
    .planning-mobile-switch div.active img:nth-child(1)
    {
        display:block;
    }
    .planning-mobile-switch div.active img:nth-child(2)
    {
        display:none;
    }
    .planning-mobile-switch-one-people img{
        width:19px;
        height:auto;
    }
    .planning-mobile-switch-all-people img{
        width:21px;
        height:auto;
    }
    #header_menu{
        display:flex;
        justify-content: center;
        padding:0;
    }
    .bgcolor-voiture{
        background-color: rgb(255, 0, 67);
        opacity: 0.8;
    }
    .bgcolor-cycle{
        background-color: rgb(85, 118, 204);
        opacity: 0.8;
    }

}






/*************** blocs infos *****************/
.blocinfo-v2{
    border-radius: 4px;
    background-color: #F5F6FA;
    border: 1px solid #ccc;
    padding:10px 15px;
    flex: 1;
    position: relative;
    margin-right:2px;
}
.blocinfo-v2-txt{
    display:flex;
    margin-bottom:33px;
}
.blocinfo-v2-txt img{
    margin-right:15px;
    height:20px;
    width:20px;
}
.blocinfo-v2-actions{
    position: absolute;
    left:auto;
    right:15px;
    top:auto;
    bottom:10px;
}
.blocinfo-v2-actions img{
    height:17px;
    width: auto;
}
.blocinfo-v2-actions img.icon-pdf{
    height: 19px;
    width: auto;
    margin-right: 2px;
}

.blocinfo-v2-actions a {
    display: inline-block;
    margin-left: 5px;
    margin-top: 7px;
}

.blocinfo-v2-wrapper{
    display:flex;
}
/*************** end blocs infos *****************/