@import url('https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i|Muli:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i');
@import url('fontawesome-full.min.css');
@import url('knacss.css');

/* ANIMATIONS */
@keyframes rotate {
    0% {
        -webkit-transform: rotate(0) scale(1);
        transform: rotate(0) scale(1)
    }

    50% {
        -webkit-transform: rotate(180deg) scale(.6);
        transform: rotate(180deg) scale(.6)
    }

    100% {
        -webkit-transform: rotate(360deg) scale(1);
        transform: rotate(360deg) scale(1)
    }
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0) translateX(-50%) rotate(0); -webkit-transform: translateY(0) translateX(-50%) rotate(0);}
    40% {transform: translateY(-15px) translateX(-50%) rotate(90deg); -webkit-transform: translateY(-15px) translateX(-50%) rotate(90deg);}
    60% {transform: translateY(-10px) translateX(-50%) rotate(45deg); -webkit-transform: translateY(-10px) translateX(-50%) rotate(45deg);}
}

/* COMMONS */
html, body {
    width: 100%;
    height: 100%;
    -webkit-font-smoothing: antialiased !important;
}
html body *{box-sizing: border-box}
html body{color: #2c3e40}
.content{
    width: 150rem;
    margin: 0 auto
}
.content-large{
    width: 95%;
    margin: 0 auto
}
.content-s {
    width: 75rem;
    margin: 0 auto;
}

.container{font-size: 1.4rem}
ul{margin: 0;padding: 0}
ul li{list-style: none}
a, a:hover, a:active, a:focus{
    color: inherit;
    text-decoration: none;
}
p{margin: 0}
span[class^="ico-"]{
    background: url('../img/pictos_sprit.png') left top no-repeat;
    width: 2rem;
    height: 2rem;
    display: inline-block;
    vertical-align: middle
}
body.env_o span[class^="ico-"]{
    background-image: url('../img/pictos_sprit_o.png');
}
.col-3 {width: calc(3% - 0.01px)}
.col-5 {width: calc(5% - 0.01px)}
.col-6 {width: calc(6% - 0.01px)}
.col-6-edit {width: calc(6% - 0.01px); border-left : #0B0B0B 1px solid; border-top : #0B0B0B 1px solid; border-bottom : #0B0B0B 1px solid}
.col-7 {width: calc(7% - 0.01px)}
.col-10 {width: calc(10% - 0.01px)}
.col-10-edit {width: calc(10% - 0.01px); border-left : #0B0B0B 1px solid; border-top : #0B0B0B 1px solid; border-bottom : #0B0B0B 1px solid}
.col-12 {width: calc(12% - 0.01px)}
.col-12-edit {width: calc(12% - 0.01px); border-left : #0B0B0B 1px solid; border-top : #0B0B0B 1px solid; border-bottom : #0B0B0B 1px solid}
.col-15 {width: calc(15% - 0.01px)}
.col-15-edit {width: calc(15% - 0.01px); border-left : #0B0B0B 1px solid; border-top : #0B0B0B 1px solid; border-bottom : #0B0B0B 1px solid}
.col-17 {width: calc(17% - 0.01px)}
.col-19 {width: calc(19% - 0.01px)}
.col-20 {width: calc(20% - 0.01px)}
.col-20-edit {width: calc(20% - 0.01px); border-left : #0B0B0B 1px solid; border-top : #0B0B0B 1px solid; border-bottom : #0B0B0B 1px solid}
.col-25 {width: calc(25% - 0.01px)}
.col-25-edit {width: calc(25% - 0.01px); border-left : #0B0B0B 1px solid; border-top : #0B0B0B 1px solid; border-bottom : #0B0B0B 1px solid}
.col-27 {width: calc(27% - 0.01px)}
.col-30 {width: calc(30% - 0.01px)}
.col-31 {width: calc(31% - 0.01px)}
.col-35 {width: calc(35% - 0.01px)}
.col-40 {width: calc(40% - 0.01px)}
.col-45 {width: calc(45% - 0.01px)}
.col-50 {width: calc(50% - 0.01px)}
.col-55 {width: calc(55% - 0.01px)}
.col-60 {width: calc(60% - 0.01px)}
.col-70 {width: calc(70% - 0.01px)}
.col-80 {width: calc(80% - 0.01px)}
.col-90 {width: calc(90% - 0.01px)}
.col-100 {width: calc(100% - 0.01px)}
div[class*="col-"]{
    -webkit-box-flex: 0;

    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}
span.ico-dashboard:hover, .active span.ico-dashboard{background-position: -2.1rem 0}
span.ico-pause:hover, .active span.ico-pause{background-position: -2.1rem 0}
span.ico-note,
body.env_o span.ico-history{background-position: 0 -2.1rem}
span.ico-coin,
body.env_o span.ico-upload{background-position: 0 -4.2rem}
span.ico-dollarbag{background-position: 0 -6.3rem}
span.ico-file{background-position: 0 -8.3rem}
span.ico-setting{background-position: 0 -10.3rem}
span.ico-what {
    background-position: -0.3rem -12.4rem;
    height: 1.6rem;
    width: 1.6rem;
}
span.ico-import {
    background-position: -2.3rem -12.4rem;
    width: 1.6rem;
    height: 1.6rem;
}
span.ico-search {
    background-position: -2.1rem -14rem;
    height: 1.7rem;
    width: 1.7rem;
}
span.ico-add {
    background-position: -0.2rem -14rem;
    height: 1.7rem;
    width: 1.7rem;
}
span.ico-fus {
    background-position: 0rem -17.1rem;
    height: 1.6rem;
    width: 2.7rem;
}
span.ico-lis {
    background-position: 0rem -18.7rem;
    height: 1.6rem;
    width: 2.7rem;
}
span.ico-arrowdb {
    background-position: 0rem -15.7rem;
    height: 0.6rem;
    width: 1.7rem;
}
span.ico-arrowdbl {
    background-position: 0rem -15.7rem;
    height: 0.6rem;
    width: 1.7rem;
}
a:hover span.ico-note, .active span.ico-note,
body.env_o a:hover span.ico-history, body.env_o .active span.ico-history{background-position: -2.1rem -2.1rem}
a:hover span.ico-coin, .active span.ico-coin,
body.env_o a:hover span.ico-upload, body.env_o .active span.ico-upload{background-position: -2.1rem -4.2rem}
a:hover span.ico-dollarbag, .active span.ico-dollarbag{background-position: -2.1rem -6.3rem}
a:hover span.ico-file, .active span.ico-file{background-position: -2.1rem -8.3rem}
a:hover span.ico-setting, .active span.ico-setting{background-position: -2.1rem -10.3rem}
body.env_o a:hover span.ico-pause, body.env_o .active span.ico-pause{background-position: -2.1rem 0}
.hidden .fa-eye-slash:before {content: "\f06e"}

#gauche {float: left; margin-left: 1px; font-size:1rem; font-style: italic;}
#droite {float: right; margin-right: 1px; font-size:1rem; font-style: italic;}
.noDisplay {display: none}
.noPadding {padding: 0rem}
.inbl{display: inline-block; vertical-align: top}
.inbl.vm{vertical-align: middle}
.inblbox > *{display: inline-block; vertical-align: top}
.inblbox-middle > *{display: inline-block; vertical-align: middle}
.flexbox{display: flex;}
.tcenter{text-align: center}
.tright{text-align: right; padding-right : 0.2rem}
.tleft{text-align: left}
.tjustify{text-align: justify}
.acenter{margin: 0 auto}
.aright{margin-left: auto}
.pull_r{float: right}
.pas{padding-right: 1rem; padding-bottom: 1rem; padding-left: 1rem; padding-top: 1rem}
.pabs{padding-right: 2rem; padding-bottom: 2rem; padding-left: 2rem; padding-top: 2rem}
.pam{padding-right: 3rem; padding-bottom: 3rem; padding-left: 3rem; padding-top: 3rem}
.prs{padding-right: 1rem}
.pls{padding-right: 1rem}
.plm{padding-right: 2.5rem}
.prxs{padding-right: 0.5rem}
.plxs{padding-right: 0.5rem}
.mrxxs{margin-right: 0.2rem}
.mrxs{margin-right: 0.5rem}
.mlxs{margin-left: 0.5rem}
.mrs{margin-right: 1rem}
.mls{margin-left: 1rem}
.mrbs{margin-right: 2rem}
.mlbs{margin-left: 2rem}
.mrm{margin-right: 3rem}
.mlm{margin-left: 3rem}
.mlmm{margin-left: 5rem}
.mtxx{margin-top: 1rem}
.mtx{margin-top: 2rem}
.mtm{margin-top: 3rem}
.mtmm{margin-top: 5rem}
.mtb{margin-top: 6rem}
.mtbb{margin-top: 8rem}
.mtxl {margin-top: 10rem;}
.mbb{margin-bottom: 6rem}
.mbbb{margin-bottom: 8rem}
.mvm{margin-top: 3rem; margin-bottom: 3rem}

.prb {padding-right: 5rem}
.plb {padding-left: 5rem}
.bleft {border-left: solid 1px; border-color: #B8B8B8; padding: 0 0.2rem}
.bright {border-right: dashed 1px; border-color: #B8B8B8; padding: 0 0.2rem}
.bbottom {border-bottom: dashed 1px; border-color: #B8B8B8; padding: 0 0.2rem}
.flexgrow{flex-grow: 1;}
.green {color: #1bb55d}
.greenback {color: #1bb55d; background: #a6eac3 !important;}
.greenbold {color: #1bb55d; font-weight: bold;}
.red {color: #e66b4e}
.redradius {color: #e66b4e;
    background: rgba(230, 107, 78, 0.39);
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border: 1px solid #e66b4e;
    text-align: center}
.redbold {color: #e66b4e; font-weight: bold;}
.redback {color: #e66b4e; background: rgba(237, 187, 176, 0.58) !important;}
.orange {color: #FFBB43}
.orangefonce {color: #e69324;}
.orangebold {color: #e66b4e; font-weight: bold;}
.yellow {color: #F4BB37}
.yellowback {color: #f4eb2a;  background: #F4BB37 !important;}
.blue {color: #0838B9}
.blueback {color: #4bb4b9; background: #0838B9 !important;}
.greenblue {color: #23BCBA}
.greenblueback {color: #23BCBA;  background: rgba(35, 188, 186, 0.24) !important;}
.greyback {color: #9c9c9c; background: #5d5d5d !important;}
.violet {color: #DE8DE6}
.blueclear {color: #828DF7}
.whitebackorange {color: #e66b4e; font-weight: bold; background: white !important}
.noborder {border:0 !important}

.greyccc{color: #3e3e3e;
}
.greyf {color: #0B0B0B}
.blanc {color: #ebfafa}
.fontsmall{font-size:0.9rem;}
.fontlarge{font-size:1.5rem;}
.fontbig {font-size: 2.5rem}
.retard1mois  {color: #FF8C00}
.retard3mois {color: #F4661B}
.retard6mois {color: #FF4500}
.retardplus {background: #FF4500 !important; color:#fff}

.inbl_box > * {
    display: inline-block;
    vertical-align: top;
}
.thin {font-weight: 200}
.arrow_box {
    position: relative;
    background: #f2dede;
    border: 1px solid #ebccd1;
}
.arrow_box:after, .arrow_box:before {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.arrow_box:after {
    border-color: rgba(242, 222, 222, 0);
    border-left-color: #f2dede;
    border-width: 7px;
    margin-top: -7px;
}
.arrow_box:before {
    border-color: rgba(235, 204, 209, 0);
    border-left-color: #ebccd1;
    border-width: 8px;
    margin-top: -8px;
}
.ui-widget.ui-widget-content {font-size: 1.3rem}
button {
    color: white;
    padding: 1rem;
    border-radius: 0.5rem;
    cursor: pointer;
    background: #f4bb37;
    border: none;
    font-size: 1.1rem;
    font-weight: 500
}
button.discrete {
    background: transparent;
    border: 1px solid;
    letter-spacing: 0.03rem;
    font-size: 1.1rem;
}
button.discreteSave {
    background: transparent;
    border: 1px solid #E1775A;
    letter-spacing: 0.03rem;
    font-size:1.1rem;
}
button.switchVue {
    background: #23BCBA;
    border: 1px solid #23BCBA;
    letter-spacing: 0.03rem;
    font-size:1.5rem;
    color:white;
    font-weight: bold;
}
button.filtre {
    background: transparent !important;
    border: none;
    letter-spacing: 0.03rem;
    font-size: 2rem;
    color:#ff0000;
}
button.wico {padding-right: 1.4rem;position: relative;padding-left: 3.5rem}
button.wico.pls {padding-left: 4rem}
button.wico.plm {padding-left: 4.5rem}
button + button{margin-left: 1rem}
select, input{max-width: 100%}
.popin form select{width: 100%; height: 100%}
select.blue, select.transparent, select.darkblue {
    position: relative;
    border-radius: 0.3rem;
    color: white;
    padding: 1rem 3rem 1rem 1.5rem;
    font-size: 1.2rem;
    border: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url(../img/white_arrow.png) right 1rem center no-repeat #23BCBA;
    border : 1px solid white;
    cursor: pointer
}
select.transparent{background: url(../img/white_arrow.png) right 1rem center no-repeat transparent}
select.darkblue{background: url(../img/white_arrow.png) right 1rem center no-repeat #1c2541}
select.grey{
    position: relative;
    border-radius: 0.3rem;
    padding: 0.5rem 3rem 0.5rem 1.5rem;
    font-size: 1.2rem;
    border: solid 1px #E5E3E3;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url(../img/black_arrow.png) right 1rem center no-repeat rgba(158, 158, 158, 0.19);
    cursor: pointer;
    text-align:left;
}
select.greysmall{
    position: relative;
    border-radius: 0.3rem;
    padding: 0.2rem 0.2rem 0.2rem 0.2rem;
    font-size: 1.2rem;
    border: solid 1px #E5E3E3;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    background:#E5E3E3;
    background: url(../img/black_arrow.png) right 1rem center no-repeat rgba(158, 158, 158, 0.19);
    cursor: pointer;
    text-align:left;
}
select.red{
    position: relative;
    border-radius: 0.3rem;
    padding: 0.5rem 3rem 0.5rem 1.5rem;
    font-size: 1.2rem;
    border: solid 1px #E5E3E3;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url(../img/black_arrow.png) right 1rem center no-repeat rgba(158, 158, 158, 0.19);
    cursor: pointer;
    text-align:left;
    color:#e66b4e;
}
.lighter {position: relative}
.light{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 100%;
    background: rgba(255, 255, 255, 0.15);
    transition: 0.2s ease
}
.lighter:hover .light {width: 100%}
.layer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 3;
}
.popin {
    position: fixed;
    left: 50%;
    top: 45%;
    /*transform: translate(-50%, -50%);*/
    background: white;
    padding: 2rem 5rem;
    border-radius: 0.4rem;
    z-index: 3;
    min-width: 100rem;
    max-height: 90%;
    overflow-y: scroll
}
.popin input {width: 100%}
.popin input.inbl {width: auto}
.popin .fa-times-circle.closer {
    color: #c9426c;
    position: absolute;
    top: 1rem;
    right: 1rem;
    font-size: 2rem;
    cursor: pointer;
    transition: 0.2s ease
}
.budget .popin.dashboard-details {width: 90%; max-width: 85rem}
.popin.quick-addLine {padding: 1rem 7rem;}
h3 {
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    font-size: 2rem;
}
h3.bb{
    border-bottom: 0.5px solid #ececee;
    padding-bottom: 1rem;
}
span.ask{
    color: #23bcbb;
    border: 1px solid;
    display: inline-block;
    padding: 0rem 1.05rem;
    border-radius: 50%;
    cursor: pointer;
    transition: 0.2s ease;
    margin-right: 0.5rem;
    transform: scale(0.8);
}
span.asksmall{
    color: #23bcbb;
    border: 1px solid;
    display: inline-block;
    padding: 0rem 1.05rem;
    border-radius: 20%;
    cursor: pointer;
    transition: 0.2s ease;
    margin-right: 0.5rem;
    transform: scale(0.8);
}
span.comment {
    color: #23bcbb;
    /*: 1px solid;*/
    display: inline-block;
    cursor: pointer;
    transition: 0.2s ease;
    margin-right: 0.5rem;
    transform: scale(0.8);
}
form .row {padding: 0.2rem 0}
form input,
form textarea{
    background: rgba(158, 158, 158, 0.19);
    border: none;
    padding: 0.5rem 1rem 0.5rem 1rem;
    transition: 0.2s ease;
}
form input[type="submit"], form button.red, button.green, button.blue,  button.orange,#recap_tabs input[type="submit"] {
    background: #23bcbb;
    border: none;
    color: white;
    border-radius: 0.4rem;
    cursor: pointer;
    font-size: 1.4rem;
    padding: 1rem;
}
#recap_tabs input[type="submit"]{font-size: 1.1rem;}
form button.red,
form input[type="submit"].red{
    font-weight: normal;
    padding: 1rem;
    width: 100%;
    background: #c9426c
}
form button.red:hover,
form input.red[type="submit"]:hover {
    background: #9d3556;
}
form input[type="submit"]:hover {background: rgba(35, 188, 187, 0.8)}
form button.blue,
form input[type="submit"].blue{
    font-weight: normal;
    padding: 1rem;
    width: 100%;
    background: #2896bc;
}
form button.blue:hover,
form input.blue[type="submit"]:hover {
    background: #2ca2bc;
}
form button.orange,
form input[type="submit"].orange{
    font-weight: normal;
    padding: 1rem;
    width: 100%;
    background: #ffbe1e;
}
form button.orange:hover
form input.orange[type="submit"]:hover {
    background: #ffaf27;
}
form input[type="submit"]:hover {background: rgba(35, 188, 187, 0.8)}
input[type="checkbox"] {display: none}
input[type="checkbox"] + label {
    background: rgba(198, 198, 198, 0.61);
    width: 1.5rem;
    height: 1.5rem;
    position: relative;
    margin: 0 1rem 0 0;
    font-size: 1rem;
    display: inline-block;
    color: black;
    border-radius: 0.2rem;
    border: 1px solid rgba(198, 198, 198, 0.61)
}

input[type="checkbox"] + label > i {transform: scale(0);transition: 0.2s cubic-bezier(0.04, 0.99, 0.28, 1.13)}
input[type="checkbox"]:checked + label > i {transform: scale(1)}
input.blue[type="checkbox"] + label {
    border: none;
    background: rgba(198, 198, 198, 0.4);
    color: #23bcbb;
    font-size: 1.4rem;
}
input.blue[type="checkbox"] + label i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: none;
}
input.blue[type="checkbox"]:checked + label > i{display: inline-block}
.tabs .tab {
    cursor: pointer;
    padding-bottom: 1rem;
}
.tabs .tab.active {border-bottom: 3px solid #23BCBA;}
.popinList .popinItem {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 3
}
.popinList .popinItem.on{display: block}

#jrange input {
    width: 200px;
}
#jrange div {
    font-size: 9pt;
}
.date-range-selected > .ui-state-active,
.date-range-selected > .ui-state-default {
    background: none;
    background-color: lightsteelblue
}
.inputfile + label {
    max-width: 80%;
    font-size: 1.25rem;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    padding: 0.625rem 1.25rem;
    color: white;
    background-color: rgb(244, 187, 55);
    border: 1px solid rgb(222, 169, 48);
    border-radius: 0.3rem
}
.inputfile:focus + label,
.inputfile.has-focus + label {
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px
}
.inputfile + label svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    margin-right: 0.25em
}
.inputfile:focus + label, .inputfile.has-focus + label, .inputfile + label:hover {background-color: rgba(244, 187, 55, 0.9)}
.inputfile {display: none}
.ball-clip-rotate-multiple {
    position: fixed;
    top: 0;
    left: 0;
    color: black;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 9999999999;
}
.ball-clip-rotate-multiple>div {
    position: absolute;
    left: 50%;
    top: 50%;
    border: 2px solid #fff;
    border-bottom-color: transparent;
    border-top-color: transparent;
    border-radius: 100%;
    height: 35px;
    width: 35px;
    -webkit-animation: rotate 1s 0s ease-in-out infinite;
    animation: rotate 1s 0s ease-in-out infinite;
    transform: translate(-50%, -50%)
}
.ball-clip-rotate-multiple>div:last-child {
    display: inline-block;
    top: 50%;
    left: 50%;
    width: 11px;
    height: 9px;
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
    border-color: #fff transparent;
    -webkit-animation-direction: reverse;
    animation-direction: reverse;
    margin-left: 12.5px;
    margin-top: 12.5px
}
#popin_add .row.grid-2 .col:first-child {width: 40%}
#popin_add .row.grid-2 .col:last-child {width: 60%}
p.warning {
    text-align: center;
    padding: 1rem;
    border-radius: 0.4rem;
    border: 1px solid;
    margin: 2rem 0;
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc
}
p.warning.error {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1
}
p.warning.success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

/* APP ======================================================================================= */

/* ********* */
/* STRUCTURE */
/* ********* */

body{padding: 15.2rem 0 0 10rem; transition: 0.2s ease; font-family: 'Montserrat', sans-serif}
.container{padding: 3rem 0}
.container.fixed-header-actions{padding: 5rem 0 3rem;}
header{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 15.2rem;
    padding: 3rem 0 0 7.8rem;
    color: white;
    background: url(../img/bghead.png) 7.8rem bottom no-repeat, linear-gradient(to right, #54e994 0%,#23bcbb 100%);
    background-size: contain;
    transition: 0.2s ease;
    z-index: 1
}
body.env_o header{
    background: url(../img/bghead.png) 7.8rem bottom no-repeat, linear-gradient(to right, #f4bb37 0%,#f49537 100%);
}

header .deployer_h {
    position: absolute;
    bottom: 0;
    right: 1rem;
    font-size: 1.4rem;
    line-height: 2rem;
    padding: 0.2rem 1rem;
    background: #26ada8;
    border-top-left-radius: 0.4rem;
    border-top-right-radius: 0.4rem
}
body.env_o header .deployer_h{
    background: #f4bb37;
}
header .deployer_h i {
    transform: rotate(-180deg);
    transition: 0.2s ease;
    cursor: pointer
}
body.head_mini {padding: 4.4rem 0 0 10rem;}
body.head_mini header .deployer_h i {transform: rotate(0deg)}
.head_mini header {transform: translateY(-71%)}
nav#asideMenu{
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    background: #1c2541;
    color: #979ba8;
    transition: 0.4s ease;
    z-index: 2
}
nav#asideMenu > #bloc_logo{
    background: #141b32;
    padding: 3.6rem 1rem
}
nav#asideMenu > #bloc_logo img{display: inherit}
nav#asideMenu ul{padding: 2rem 2.25rem}
nav#asideMenu ul li {padding: 0 0 3.5rem}
nav#asideMenu ul li span{transition: 0.2s ease}
#asideMenu.maxi div#bloc_logo .small_logo {display: none}
#asideMenu.maxi div#bloc_logo .big_logo {display: inline}
#asideMenu div#bloc_logo .small_logo {display: inline}
#asideMenu div#bloc_logo .big_logo {display: none}
#asideMenu.maxi a:hover, #asideMenu.maxi a.active{color: #44e693}
body.env_o #asideMenu.maxi a:hover,
body.env_o #asideMenu.maxi a.active{color: #f4bb37}
#asideMenu select{margin: 0}
.clip-circle {
    -webkit-clip-path: circle(50% at 50% 50%);
    clip-path: circle(50% at 50% 50%);
    background-size: cover;
    background-position: center center
}
nav .clip-circle{
    width: 5.5rem;
    height: 5.5rem;
    margin: 0 auto;
    display: block
}
#asideMenu span[class^="ico-"]{margin-right: 0.5rem;}
#asideMenu span.title{display: none;}
#asideMenu ul li i{
    width: 2rem;
    text-align: center;
    margin-right: 0.5rem;
    transition: 0.2s ease;
}
body.env_o #asideMenu ul li i:hover,
body.env_o #asideMenu ul li a.active i{
    color: #f4bb37;
}
#asideMenu.maxi span.title {
    padding-left: 0.5rem;
    display: inline-block;
    font-size: 1.3rem;
    text-transform: uppercase
}
nav#asideMenu.maxi ul li {
    padding: 0 1rem 3.5rem;
    text-align: left
}
#asideMenu.maxi ul li a:not(.clip-circle) {
    display: block;
    margin: 0 auto;
    position: relative;
    cursor: pointer
}
nav#asideMenu .profile_desc {display: none}
nav#asideMenu.maxi .profile_desc {
    display: block;
    color: white;
    font-size: 1.3rem;
    padding: 1rem 0 0.5rem;
    border-bottom: 1px solid rgba(151, 155, 168, 0.5)
}
#asideMenu .deployer {
    position: absolute;
    right: 0;
    bottom: 1rem;
    background: rgb(20, 27, 50);
    color: white;
    font-size: 1.4rem;
    padding: 0.5rem 1rem;
    border-top-left-radius: 0.4rem;
    border-bottom-left-radius: 0.4rem;
    z-index: 0;
    cursor: pointer;
    transition: 0.2s ease;
}
#asideMenu.maxi .deployer i {transform: rotate(-180deg)}
#asideMenu i.fa.fa-external-link {transition: 0.2s ease}
#asideMenu.maxi i.fa.fa-external-link {transform: rotate(-90deg)}
/*nav#asideMenu.maxi ul li:first-child {padding-bottom: 2.5rem}*/
.profile_desc span.name {font-weight: 500}
.profile_desc span.desc {font-weight: 300}
nav#asideMenu.maxi ul {padding: 2rem}
header nav#bloc_ariane a,
header .roller {font-size: 1.3rem; text-transform: uppercase}
header .actions button {
    position: relative;
    padding-left: 4rem;
    margin: 0
}
header .actions span[class^="ico-"] {
    position: absolute;
    left: 1.5rem;
    top: 50%;
    transform: translateY(-50%)
}
header nav#topMenu ul li{
    display: inline-block;
    vertical-align: top;
    padding: 1rem 4rem 1rem 0;
    font-size: 1.2rem;
}
header nav#topMenu ul li.active {
    background: white;
    color: #23bcbb;
    text-align: center;
    padding: 1rem 2rem;
    margin: 0 2rem 0 0;
    border-top-left-radius: 0.7rem;
    border-top-right-radius: 0.7rem
}
body.env_o header nav#topMenu ul li.active{
    color: #f4bb37;
}
header nav#topMenu ul li.active.red {color: #e66b4e; background: rgba(230, 107, 78, 0.39)
}
header nav#topMenu{
    position: absolute;
    bottom: 0;
    font-size: 1.4rem
}
header select.darkblue {
    margin: 0;
    background-color: transparent;
    border-radius: 0.4rem;
    font-weight: 400;
    font-size: 1.9rem;
    text-transform: uppercase;
    padding: 0 2.8rem 0 0;
}
header select.darkblue option {
    color: #23bcba;
    font-size: 1.5rem;
}
body.env_o header select.darkblue option {
    color: #f4bb37;
}

/* CHARTS */
.chartist-tooltip {
    position: absolute;
    display: inline-block;
    opacity: 0;
    min-width: 5em;
    padding: .5em;
    background: rgba(35, 188, 186, 0.7);
    color: #fff;
    font-family: Oxygen,Helvetica,Arial,sans-serif;
    text-align: center;
    pointer-events: none;
    z-index: 1;
    -webkit-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    -o-transition: opacity .2s linear;
    transition: opacity .2s linear;
}
.chartist-tooltip:before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    width: 0;
    height: 0;
    margin-left: -15px;
    border: 15px solid transparent;
    border-top-color: rgba(35, 188, 186, 0.7)
}
.chartist-tooltip.tooltip-show {opacity: 1}
.ct-area, .ct-line {pointer-events: none}
.ct-line {stroke-width: 2px}
.ct-point {stroke-width: 6px}
.chart-legend {padding-top: 1rem}
.chart-legend div span:before {
    content: "";
    width: 2rem;
    height: 0.8rem;
    background: blue;
    position: absolute;
    border-radius: 1rem;
    transform: translate(-120%, -50%);
    top: 50%
}

.chart-legend div span {
    position: relative;
    padding-left: 2.4rem
}
.chart-legend > div {
    display: inline-block;
    margin-right: 2rem;
    vertical-align: top
}
.ct-point{cursor: pointer}
.ct-series-a .ct-bar, .ct-series-a .ct-line, .ct-series-a .ct-point, .ct-series-a .ct-slice-donut {stroke: #F38630;}
.ct-series-b .ct-bar, .ct-series-b .ct-line, .ct-series-b .ct-point, .ct-series-b .ct-slice-donut {stroke: #ffcb48;}
.ct-series-c .ct-bar, .ct-series-c .ct-line, .ct-series-c .ct-point, .ct-series-c .ct-slice-donut {stroke: #6f5cf7;}
.ct-series-d .ct-bar, .ct-series-d .ct-line, .ct-series-d .ct-point, .ct-series-d .ct-slice-donut {stroke: #93b4f7;}
.ct-series-e .ct-bar, .ct-series-e .ct-line, .ct-series-e .ct-point, .ct-series-e .ct-slice-donut {stroke: #52c088;}
.ct-series-f .ct-bar, .ct-series-f .ct-line, .ct-series-f .ct-point, .ct-series-f .ct-slice-donut {stroke: #8ae94b;}
.ct-series-g .ct-bar, .ct-series-g .ct-line, .ct-series-g .ct-point, .ct-series-g .ct-slice-donut {stroke: #e92042;}
.ct-series-h .ct-bar, .ct-series-h .ct-line, .ct-series-h .ct-point, .ct-series-h .ct-slice-donut {stroke: #f49699;}
.ct-series-i .ct-bar, .ct-series-i .ct-line, .ct-series-i .ct-point, .ct-series-i .ct-slice-donut {stroke: #a45fe9;}
.ct-series-j .ct-bar, .ct-series-j .ct-line, .ct-series-j .ct-point, .ct-series-j .ct-slice-donut {stroke: #525252;}

.ct-chart-treso .ct-point{cursor: pointer}
.ct-chart-treso .ct-series-a .ct-bar, .ct-chart-treso .ct-series-a .ct-line, .ct-chart-treso .ct-series-a .ct-point, .ct-chart-treso .ct-series-a .ct-slice-donut {stroke: #F38630;}
.ct-chart-treso .ct-series-b .ct-bar, .ct-chart-treso .ct-series-b .ct-line, .ct-chart-treso .ct-series-b .ct-point, .ct-chart-treso ct-series-b .ct-slice-donut {stroke: #828DF7;}
.ct-chart-treso .ct-series-c .ct-bar, .ct-chart-treso .ct-series-c .ct-line, .ct-chart-treso .ct-series-c .ct-point, .ct-chart-treso .ct-series-c .ct-slice-donut {stroke: #23BCBA;}
.ct-chart-treso .ct-series-d .ct-bar, .ct-chart-treso .ct-series-d .ct-line, .ct-chart-treso .ct-series-d .ct-point, .ct-chart-treso .ct-series-d .ct-slice-donut {stroke: #a45fe9;}


.ct-chart-margeratio .ct-point{cursor: pointer}
.ct-chart-margeratio .ct-series-a .ct-bar, .ct-chart-margeratio .ct-series-a .ct-line, .ct-chart-margeratio .ct-series-a .ct-point, .ct-chart-margeratio .ct-series-a .ct-slice-donut {stroke: #F38630;}
.ct-chart-margeratio .ct-series-b .ct-bar, .ct-chart-margeratio .ct-series-b .ct-line, .ct-chart-margeratio .ct-series-b .ct-point, .ct-chart-margeratio ct-series-b .ct-slice-donut {stroke: #828DF7;}
.ct-chart-margeratio .ct-series-c .ct-bar, .ct-chart-margeratio .ct-series-c .ct-line, .ct-chart-margeratio .ct-series-c .ct-point, .ct-chart-margeratio .ct-series-c .ct-slice-donut {stroke: #23BCBA;}
.ct-chart-margeratio .ct-series-d .ct-bar, .ct-chart-margeratio .ct-series-d .ct-line, .ct-chart-margeratio .ct-series-d .ct-point, .ct-chart-margeratio .ct-series-d .ct-slice-donut {stroke: #a45fe9;}

.ct-chart-sec .ct-series-a .ct-bar, .ct-chart-sec .ct-series-a .ct-line, .ct-chart-sec .ct-series-a .ct-point, .ct-chart-sec .ct-series-a .ct-slice-donut {stroke: #de8de6;}
.ct-chart-sec .ct-series-b .ct-bar, .ct-chart-sec .ct-series-b .ct-line, .ct-chart-sec .ct-series-b .ct-point, .ct-chart-sec .ct-series-b .ct-slice-donut {stroke: #23BCBA ;}
.ct-chart-sec .ct-series-c .ct-bar, .ct-chart-sec .ct-series-c .ct-line, .ct-chart-sec .ct-series-c .ct-point, .ct-chart-sec .ct-series-c .ct-slice-donut {stroke: #828DF7 ;}
.ct-chart-sec .ct-series-d .ct-bar, .ct-chart-sec .ct-series-d .ct-line, .ct-chart-sec .ct-series-d .ct-point, .ct-chart-sec .ct-series-d .ct-slice-donut {stroke: #F38630 ;}
.ct-chart-sec .ct-series-a .ct-bar {stroke-width: 20px;}
.ct-chart-sec .ct-series-b .ct-bar {stroke-width: 20px;}
.ct-chart-sec .ct-series-c .ct-bar {stroke-width: 20px;}
.ct-chart-sec .ct-series-d .ct-bar {stroke-width: 20px;}

.ct-chart-dashg-prod .ct-series-a .ct-bar, .ct-chart-dashg-prod .ct-series-a .ct-line, .ct-chart-dashg-prod .ct-series-a .ct-point, .ct-chart-dashg-prod .ct-series-a .ct-slice-donut {stroke: #DE8DE6 ;}
.ct-chart-dashg-prod .ct-series-b .ct-bar, .ct-chart-dashg-prod .ct-series-b .ct-line, .ct-chart-dashg-prod .ct-series-b .ct-point, .ct-chart-dashg-prod .ct-series-b .ct-slice-donut {stroke: #23BCBA;}
.ct-chart-dashg-prod .ct-series-c .ct-bar, .ct-chart-dashg-prod .ct-series-c .ct-line, .ct-chart-dashg-prod .ct-series-c .ct-point, .ct-chart-dashg-prod .ct-series-c .ct-slice-donut {stroke: #828DF7 ;}
.ct-chart-dashg-prod .ct-series-d .ct-bar, .ct-chart-dashg-prod .ct-series-d .ct-line, .ct-chart-dashg-prod .ct-series-d .ct-point, .ct-chart-dashg-prod .ct-series-d .ct-slice-donut {stroke: #F38630;}
.ct-chart-dashg-prod .ct-series-a .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-prod .ct-series-b .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-prod .ct-series-c .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-prod .ct-series-d .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-prod .ct-label {font-size:1.2rem; font-weight: lighter}


.ct-chart-dashg-exploitation .ct-series-a .ct-bar, .ct-chart-dashg-exploitation .ct-series-a .ct-line, .ct-chart-dashg-exploitation .ct-series-a .ct-point, .ct-chart-dashg-exploitation .ct-series-a .ct-slice-donut {stroke: #DE8DE6 ;}
.ct-chart-dashg-exploitation .ct-series-b .ct-bar, .ct-chart-dashg-exploitation .ct-series-b .ct-line, .ct-chart-dashg-exploitation .ct-series-b .ct-point, .ct-chart-dashg-exploitation .ct-series-b .ct-slice-donut {stroke: #23BCBA ;}
.ct-chart-dashg-exploitation .ct-series-c .ct-bar, .ct-chart-dashg-exploitation .ct-series-c .ct-line, .ct-chart-dashg-exploitation .ct-series-c .ct-point, .ct-chart-dashg-exploitation .ct-series-c .ct-slice-donut {stroke: #828DF7 ;}
.ct-chart-dashg-exploitation .ct-series-d .ct-bar, .ct-chart-dashg-exploitation .ct-series-d .ct-line, .ct-chart-dashg-exploitation .ct-series-d .ct-point, .ct-chart-dashg-exploitation .ct-series-d .ct-slice-donut {stroke: #F38630;}
.ct-chart-dashg-exploitation .ct-series-a .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-exploitation .ct-series-b .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-exploitation .ct-series-c .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-exploitation .ct-series-d .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-exploitation .ct-label {font-size:1.2rem; font-weight: lighter}

.ct-chart-dashg-charg .ct-series-a .ct-bar, .ct-chart-dashg-charg .ct-series-a .ct-line, .ct-chart-dashg-charg .ct-series-a .ct-point, .ct-chart-dashg-charg .ct-series-a .ct-slice-donut {stroke: #F38630 ;}
.ct-chart-dashg-charg .ct-series-b .ct-bar, .ct-chart-dashg-charg .ct-series-b .ct-line, .ct-chart-dashg-charg .ct-series-b .ct-point, .ct-chart-dashg-charg .ct-series-b .ct-slice-donut {stroke: #828DF7 ;}
.ct-chart-dashg-charg .ct-series-c .ct-bar, .ct-chart-dashg-charg .ct-series-c .ct-line, .ct-chart-dashg-charg .ct-series-c .ct-point, .ct-chart-dashg-charg .ct-series-c .ct-slice-donut {stroke: #23BCBA ;}
.ct-chart-dashg-charg .ct-series-d .ct-bar, .ct-chart-dashg-charg .ct-series-d .ct-line, .ct-chart-dashg-charg .ct-series-d .ct-point, .ct-chart-dashg-charg .ct-series-d .ct-slice-donut {stroke: #a45fe9 ;}
.ct-chart-dashg-charg .ct-series-a .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-charg .ct-series-b .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-charg .ct-series-c .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-charg .ct-series-d .ct-bar {stroke-width: 40px;}

.ct-chart-dashg-margebrute .ct-series-a .ct-bar, .ct-chart-dashg-margebrute .ct-series-a .ct-line, .ct-chart-dashg-margebrute .ct-series-a .ct-point, .ct-chart-dashg-margebrute .ct-series-a .ct-slice-donut {stroke: #DE8DE6 ;}
.ct-chart-dashg-margebrute .ct-series-b .ct-bar, .ct-chart-dashg-margebrute .ct-series-b .ct-line, .ct-chart-dashg-margebrute .ct-series-b .ct-point, .ct-chart-dashg-margebrute .ct-series-b .ct-slice-donut {stroke: #23BCBA ;}
.ct-chart-dashg-margebrute .ct-series-c .ct-bar, .ct-chart-dashg-margebrute .ct-series-c .ct-line, .ct-chart-dashg-margebrute .ct-series-c .ct-point, .ct-chart-dashg-margebrute .ct-series-c .ct-slice-donut {stroke: #828DF7 ;}
.ct-chart-dashg-margebrute .ct-series-d .ct-bar, .ct-chart-dashg-margebrute .ct-series-d .ct-line, .ct-chart-dashg-margebrute .ct-series-d .ct-point, .ct-chart-dashg-margebrute .ct-series-d .ct-slice-donut {stroke: #F38630 ;}
.ct-chart-dashg-margebrute .ct-series-a .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-margebrute .ct-series-b .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-margebrute .ct-series-c .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-margebrute .ct-series-d .ct-bar {stroke-width: 80px;}
.ct-chart-dashg-margebrute .ct-label {font-size:1.2rem; font-weight: lighter}

.ct-chart-dashg-client .ct-series-a .ct-bar, .ct-chart-dashg-client .ct-series-a .ct-line, .ct-chart-dashg-client .ct-series-a .ct-point, .ct-chart-dashg-client .ct-series-a .ct-slice-donut {stroke: #23BCBA ;}
.ct-chart-dashg-client .ct-series-b .ct-bar, .ct-chart-dashg-client .ct-series-b .ct-line, .ct-chart-dashg-client .ct-series-b .ct-point, .ct-chart-dashg-client .ct-series-b .ct-slice-donut {stroke: #FFCB48 ;}
.ct-chart-dashg-client .ct-series-c .ct-bar, .ct-chart-dashg-client .ct-series-c .ct-line, .ct-chart-dashg-client .ct-series-c .ct-point, .ct-chart-dashg-client .ct-series-c .ct-slice-donut {stroke: #F38630 ;}
/*.ct-chart-flux .ct-series-a .ct-slice-pie, .ct-chart-flux2 .ct-series-a .ct-slice-pie {stroke: #c4f8dc; fill: #c4f8dc;}
.ct-chart-flux .ct-series-b .ct-slice-pie, .ct-chart-flux2 .ct-series-b .ct-slice-pie {stroke: #fec6c6; fill: #fec6c6;}
.ct-chart-flux .ct-series-c .ct-slice-pie, .ct-chart-flux2 .ct-series-c .ct-slice-pie {stroke: #B8B8B8; fill: #B8B8B8;}*/
.ct-chart-dashg-client .ct-label {font-size:1.3rem; font-weight: bold}

.ct-chart-dashg-fournisseur .ct-series-a .ct-bar, .ct-chart-dashg-fournisseur .ct-series-a .ct-line, .ct-chart-dashg-fournisseur .ct-series-a .ct-point, .ct-chart-dashg-fournisseur .ct-series-a .ct-slice-donut {stroke: #23BCBA ;}
.ct-chart-dashg-fournisseur .ct-series-b .ct-bar, .ct-chart-dashg-fournisseur .ct-series-b .ct-line, .ct-chart-dashg-fournisseur .ct-series-b .ct-point, .ct-chart-dashg-fournisseur .ct-series-b .ct-slice-donut {stroke: #FFCB48 ;}
.ct-chart-dashg-fournisseur .ct-series-c .ct-bar, .ct-chart-dashg-fournisseur .ct-series-c .ct-line, .ct-chart-dashg-fournisseur .ct-series-c .ct-point, .ct-chart-dashg-fournisseur .ct-series-c .ct-slice-donut {stroke: #F38630 ;}
.ct-chart-dashg-fournisseur .ct-label {font-size:1.3rem; font-weight: bold}

.ct-chart-dashg-client-fournisseur .ct-series-a .ct-bar, .ct-chart-dashg-client-fournisseur .ct-series-a .ct-line, .ct-chart-dashg-client-fournisseur .ct-series-a .ct-point, .ct-chart-dashg-client-fournisseur .ct-series-a .ct-slice-donut {stroke: #23BCBA ;}
.ct-chart-dashg-client-fournisseur .ct-series-c .ct-bar, .ct-chart-dashg-client-fournisseur .ct-series-c .ct-line, .ct-chart-dashg-client-fournisseur .ct-series-c .ct-point, .ct-chart-dashg-client-fournisseur .ct-series-c .ct-slice-donut {stroke: #F38630 ;}
.ct-chart-dashg-client-fournisseur .ct-label {font-size:1.3rem; font-weight: bold}

.ct-chart-dashg-nbclient .ct-series-a .ct-bar, .ct-chart-dashg-nbclient .ct-series-a .ct-line, .ct-chart-dashg-nbclient .ct-series-a .ct-point, .ct-chart-dashg-nbclient .ct-series-a .ct-slice-donut {stroke: #DE8DE6 ;}
.ct-chart-dashg-nbclient .ct-series-b .ct-bar, .ct-chart-dashg-nbclient .ct-series-b .ct-line, .ct-chart-dashg-nbclient .ct-series-b .ct-point, .ct-chart-dashg-nbclient .ct-series-b .ct-slice-donut {stroke: #23BCBA ;}
.ct-chart-dashg-nbclient .ct-series-c .ct-bar, .ct-chart-dashg-nbclient .ct-series-c .ct-line, .ct-chart-dashg-nbclient .ct-series-c .ct-point, .ct-chart-dashg-nbclient .ct-series-c .ct-slice-donut {stroke: #828DF7 ;}
.ct-chart-dashg-nbclient .ct-series-d .ct-bar, .ct-chart-dashg-nbclient .ct-series-d .ct-line, .ct-chart-dashg-nbclient .ct-series-d .ct-point, .ct-chart-dashg-nbclient .ct-series-d .ct-slice-donut {stroke: #F38630;}
.ct-chart-dashg-nbclient .ct-series-a .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-nbclient .ct-series-b .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-nbclient .ct-series-c .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-nbclient .ct-series-d .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-nbclient .ct-label {font-size:1.2rem; font-weight: lighter}

.ct-chart-dashg-panier .ct-series-a .ct-bar, .ct-chart-dashg-panier .ct-series-a .ct-line, .ct-chart-dashg-panier .ct-series-a .ct-point, .ct-chart-dashg-panier .ct-series-a .ct-slice-donut {stroke: #DE8DE6 ;}
.ct-chart-dashg-panier .ct-series-b .ct-bar, .ct-chart-dashg-panier .ct-series-b .ct-line, .ct-chart-dashg-panier .ct-series-b .ct-point, .ct-chart-dashg-panier .ct-series-b .ct-slice-donut {stroke: #23BCBA ;}
.ct-chart-dashg-panier .ct-series-c .ct-bar, .ct-chart-dashg-panier .ct-series-c .ct-line, .ct-chart-dashg-panier .ct-series-c .ct-point, .ct-chart-dashg-panier .ct-series-c .ct-slice-donut {stroke: #828DF7 ;}
.ct-chart-dashg-panier .ct-series-d .ct-bar, .ct-chart-dashg-panier .ct-series-d .ct-line, .ct-chart-dashg-panier .ct-series-d .ct-point, .ct-chart-dashg-panier .ct-series-d .ct-slice-donut {stroke: #F38630;}
.ct-chart-dashg-panier .ct-series-a .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-panier .ct-series-b .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-panier .ct-series-c .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-panier .ct-series-d .ct-bar {stroke-width: 40px;}
.ct-chart-dashg-panier .ct-label {font-size:1.2rem; font-weight: lighter}

.ct-chart-flux .ct-series-a .ct-slice-pie, .ct-chart-flux1 .ct-series-a .ct-slice-pie {stroke: #23BCBA; fill: #23BCBA;}
.ct-chart-flux .ct-series-b .ct-slice-pie, .ct-chart-flux1 .ct-series-b .ct-slice-pie {stroke: #FF8C00; fill: #FF8C00;}
.ct-chart-flux .ct-series-c .ct-slice-pie, .ct-chart-flux1 .ct-series-c .ct-slice-pie {stroke: #B8B8B8; fill: #B8B8B8;}
.ct-chart-flux .ct-label {stroke: #ffffff; font-size:1.6rem; font-weight: lighter}

.ct-chart-dashg-balance .ct-series-a .ct-bar, .ct-chart-dashg-balance .ct-series-a .ct-line, .ct-chart-dashg-balance .ct-series-a .ct-point, .ct-chart-dashg-balance .ct-series-a .ct-slice-donut {stroke: #23BCBA ;}
.ct-chart-dashg-balance .ct-series-b .ct-bar, .ct-chart-dashg-balance .ct-series-b .ct-line, .ct-chart-dashg-balance .ct-series-b .ct-point, .ct-chart-dashg-balance .ct-series-b .ct-slice-donut {stroke: #828DF7 ;}
.ct-chart-dashg-balance .ct-series-c .ct-bar, .ct-chart-dashg-balance .ct-series-c .ct-line, .ct-chart-dashg-balance .ct-series-c .ct-point, .ct-chart-dashg-balance .ct-series-c .ct-slice-donut {stroke: #FFCB48;}
.ct-chart-dashg-balance .ct-series-d .ct-bar, .ct-chart-dashg-balance .ct-series-d .ct-line, .ct-chart-dashg-balance .ct-series-d .ct-point, .ct-chart-dashg-balance .ct-series-d .ct-slice-donut {stroke: #F38630;}
.ct-chart-dashg-balance .ct-series-e .ct-bar, .ct-chart-dashg-balance .ct-series-e .ct-line, .ct-chart-dashg-balance .ct-series-e .ct-point, .ct-chart-dashg-balance .ct-series-e .ct-slice-donut {stroke: #e94c1f;}

/*.ct-chart-dashg-balance .ct-series-a .ct-bar, .ct-chart-dashg-balance .ct-series-a .ct-line, .ct-chart-dashg-balance .ct-series-a .ct-point, .ct-chart-dashg-balance .ct-series-a .ct-slice-donut {stroke: #105857;}
.ct-chart-dashg-balance .ct-series-b .ct-bar, .ct-chart-dashg-balance .ct-series-b .ct-line, .ct-chart-dashg-balance .ct-series-b .ct-point, .ct-chart-dashg-balance .ct-series-b .ct-slice-donut {stroke: #828DF7 ;}
.ct-chart-dashg-balance .ct-series-c .ct-bar, .ct-chart-dashg-balance .ct-series-c .ct-line, .ct-chart-dashg-balance .ct-series-c .ct-point, .ct-chart-dashg-balance .ct-series-c .ct-slice-donut {stroke: #FFBB43;}
.ct-chart-dashg-balance .ct-series-d .ct-bar, .ct-chart-dashg-balance .ct-series-d .ct-line, .ct-chart-dashg-balance .ct-series-d .ct-point, .ct-chart-dashg-balance .ct-series-d .ct-slice-donut {stroke: #e94c1f;}
.ct-chart-dashg-balance .ct-series-e .ct-bar, .ct-chart-dashg-balance .ct-series-e .ct-line, .ct-chart-dashg-balance .ct-series-e .ct-point, .ct-chart-dashg-balance .ct-series-e .ct-slice-donut {stroke: #1bb55d;}*/
.ct-chart-dashg-balance .ct-series-a .ct-bar {stroke-width: 150px;}
.ct-chart-dashg-balance .ct-series-b .ct-bar {stroke-width: 150px;}
.ct-chart-dashg-balance .ct-series-c .ct-bar {stroke-width: 150px;}
.ct-chart-dashg-balance .ct-series-d .ct-bar {stroke-width: 150px;}
.ct-chart-dashg-balance .ct-series-e .ct-bar {stroke-width: 150px;}

.ct-chart-dashg-balancesec .ct-series-a .ct-bar, .ct-chart-dashg-balancesec .ct-series-a .ct-line, .ct-chart-dashg-balancesec .ct-series-a .ct-point, .ct-chart-dashg-balancesec .ct-series-a .ct-slice-donut {stroke: #23BCBA;}
.ct-chart-dashg-balancesec .ct-series-b .ct-bar, .ct-chart-dashg-balancesec .ct-series-b .ct-line, .ct-chart-dashg-balancesec .ct-series-b .ct-point, .ct-chart-dashg-balancesec .ct-series-b .ct-slice-donut {stroke: #F38630 ;}
.ct-chart-dashg-balancesec .ct-series-c .ct-bar, .ct-chart-dashg-balancesec .ct-series-c .ct-line, .ct-chart-dashg-balancesec .ct-series-c .ct-point, .ct-chart-dashg-balancesec .ct-series-c .ct-slice-donut {stroke: #de8de6 ;}
.ct-chart-dashg-balancesec .ct-series-d .ct-bar, .ct-chart-dashg-balancesec .ct-series-d .ct-line, .ct-chart-dashg-balancesec .ct-series-d .ct-point, .ct-chart-dashg-balancesec .ct-series-d .ct-slice-donut {stroke: #828DF7 ;}
.ct-chart-dashg-balancesec .ct-series-a .ct-bar {stroke-width: 50px;}
.ct-chart-dashg-balancesec .ct-series-b .ct-bar {stroke-width: 50px;}
.ct-chart-dashg-balancesec .ct-series-c .ct-bar {stroke-width: 50px;}
.ct-chart-dashg-balancesec .ct-series-d .ct-bar {stroke-width: 50px;}
.ct-chart-dashg-balancesec .ct-series-e .ct-bar {stroke-width: 50px;}


#triangle{ font-size: 0px; line-height: 0%; width: 0px; border-bottom: 12px solid #828DF7;/* couleur du triangle*/ border-left: 6px solid transparent; border-right: 6px solid transparent; display: inline-block}

#dash_var .chart-legend div:nth-child(1) span:before {background: #F38630 }
#dash_var .chart-legend div:nth-child(2) span:before {background: #828DF7 }
#dash_var .chart-legend div:nth-child(3) span:before {background: #23BCBA }
#dash_var .chart-legend div:nth-child(4) span:before {background: #a45fe9 }
#dash_var .chart-legend div:nth-child(5) span:before {background: #ffeb64 }
#dash_var .chart-legend div:nth-child(6) span:before {background: #e92042 }
#dash_var .chart-legend div:nth-child(7) span:before {background: #8ae94b }
#dash_var .chart-legend div:nth-child(8) span:before {background: #52c088 }
#dash_var .chart-legend div:nth-child(9) span:before {background: #F43ded }
#dash_var .chart-legend div:nth-child(10) span:before {background: #525252 }

#dashbudg_var .chart-legend div:nth-child(1) span:before {background: #de8de6 }
#dashbudg_var .chart-legend div:nth-child(2) span:before {background: #23BCBA }
#dashbudg_var .chart-legend div:nth-child(3) span:before {background: #828DF7 }
#dashbudg_var .chart-legend div:nth-child(4) span:before {background: #F38630 }

#dashtiers_var .chart-legend div:nth-child(1) span:before {background: #23BCBA}
#dashtiers_var .chart-legend div:nth-child(2) span:before {background: #FFCB48}
#dashtiers_var .chart-legend div:nth-child(3) span:before {background: #F38630}


.chart-legend-dashtab div:nth-child(1) span:before {background: #a45fe9}
.chart-legend-dashtab div:nth-child(2) span:before {background: #828DF7}
.chart-legend-dashtab div:nth-child(3) span:before {background: #23BCBA}

.chart-legend div:nth-child(1) span:before {background: #F38630}
.chart-legend div:nth-child(2) span:before {background: #ffcb48}
.chart-legend div:nth-child(3) span:before {background: #6f5cf7}
.chart-legend div:nth-child(4) span:before {background: #93b4f7}
.chart-legend div:nth-child(5) span:before {background: #52c088}
.chart-legend div:nth-child(6) span:before {background: #8ae94b}
.chart-legend div:nth-child(7) span:before {background: #e92042}
.chart-legend div:nth-child(8) span:before {background: #f49699}
.chart-legend div:nth-child(9) span:before {background: #a45fe9}
.chart-legend div:nth-child(10) span:before {background: #525252}
.chart_color-1 {color: #F38630}
.chart_color-2 {color: #ffcb48}
.chart_color-3 {color: #6f5cf7}
.chart_color-4 {color: #93b4f7}
.chart_color-5 {color: #52c088}
.chart_color-6 {color: #8ae94b}
.chart_color-7 {color: #e92042}
.chart_color-8 {color: #f49699}
.chart_color-9 {color: #a45fe9}
.chart_color-10 {color: #525252}

#dashbfr_var .chart-legend div:nth-child(1) span:before  {background: #F38630}
#dashbfr_var .chart-legend div:nth-child(2) span:before  {background: #ffcb48}

line[class*="ct-goal-line-"]{stroke-width: 1px;stroke-dasharray: 10px}
.ct-goal-line-1 {stroke: #FFBB43}
.ct-goal-line-2 {stroke: #828DF7}
.ct-goal-line-3 {stroke: #A7DBDB}
.ct-goal-line-5 {stroke: #F38630}
.ct-goal-line-6 {stroke: #E94C6F}

.ct-area.ct-threshold-above {fill: rgba(27, 181, 93, 1)}
.ct-area.ct-threshold-below {fill: rgba(240, 91, 79, 1)}
.ct-goal-line {
    stroke: red;
    stroke-width: 1px;
}

/* ******* */
/* CONTENT */
/* ******* */
div#bloc_filters form select:last-child {margin: 0}
.container .actions button span {margin: 0 0.7rem 0 0;vertical-align: bottom}
.container .actions button.wico span {
    margin: 0;
    vertical-align: bottom;
    position: absolute;
    left: 0.93rem;
    top: 50%;
    transform: translateY(-50%)
}
div#bloc_filters p, div#bloc_filters select {
    display: inline-block;
    vertical-align: middle;
    margin: 0
}
div#bloc_filters p {
    text-transform: uppercase;
    color: #a9acb4;
    font-weight: 300
}
.list-item {text-align: center}
.list-item:not(.total):not(.head):not(.subhead):hover,
.list-item.selected{background: rgba(35, 188, 186, 0.1)}
.list-item {
    border-top: 1px solid #ececee;
    padding: 1.5rem 0;
    position: relative;
    overflow: hidden
}
.list-item:not(.total):not(.head):not(.subhead){cursor: pointer}
.list-item.head {
    background: #f2f6f9;
    color: #23BCBA;
    margin-bottom: 1rem;
    border: none
}
.list-item.headOrange {
    background: #ffbb4333;
    color: #f4bb37;
    margin-bottom: 1rem;
    border: none
}
.list-item.subhead {
    border: 0px solid;
    margin-top: 0.5rem;
    font-weight: 500;
    color: #23BCBA;
    padding: 1rem 0
}
.list-item.total {font-weight: 500;}
.list .list-item:last-child {border-bottom: 1px solid #ececee}
.list-item .more{font-size: 3rem;line-height: 0.6rem; transition: 0.2s ease}
.list-item .more:hover{color: #f4bb37}
.list .list-item .actions {
    position: absolute;
    right: 0;
    top: 0;
    padding: 1.5rem 0;
    transform: translateX(100%);
    transition: 0.2s ease;
    background: white
}
.list .list-item .actions.on {transform: translateX(0)}
.list .list-item .actions.col-20 {width: 20%}
.list .list-item .actions.actions_displayed {
    padding: 0;
    border: none;
    position: relative;
    background: transparent;
    right: initial;
    transform: none
}
.list-item.pair {background: #fefcf4}
.list-item.green {color: #1bb55d}
.list-item.violin {/*color: #828df7*/
    color:#2896bc;
    font-style: italic;
}
.list-item.backviolin {/*color: #828df7*/
    background-color:#2896bc;
}
.list-item.red {color: #e66b4e}
.list-item.sub_n1 {padding-left: 4rem}
.list-item.sub_n2 {
    padding-left: 7rem;
    color: rgba(44, 62, 64, 0.95)
}
.list .list-item.sub_n2 .lineSelector {left: 4rem}
.list-item .edition, .list-item.edit .vision {display: none}
.list-item .vision, .list-item.edit .edition {display: inline}
.list-red .list-item.head {color: #e66b4e;background: rgb(250, 235, 232)}

/*--- list item pour l'édition --*/
.list-item-edit {text-align: center}
.list-item-edit:not(.total):not(.head):not(.subhead):hover,
.list-item-edit.selected{background: rgba(35, 188, 186, 0.1)}
.list-item-edit {
    border: none;
    /*padding: 0.5rem 0;*/
    position: relative;
    overflow: hidden
}
.list-item-edit:not(.total):not(.title):not(.subhead){cursor: pointer}
.list-item-edit.head {
    background: #f2f6f9;
    color: #23BCBA;
}
.list-item-edit.title {
    /*background: #f2f6f9;*/
    color: #23BCBA;
    /*margin-bottom: 0.5rem;
    border: none;*/
}
.list-item-edit.subtitle {
    border: 0px solid;
    margin-top: 0.5rem;
    font-weight: bold;
    font-size: 1.5rem;
    /*color: #23BCBA;*/
}
.list-item-edit.level2 {
    font-weight:  bold;
    font-size: 1.1rem;
    /*color: #23BCBA;*/
}
.list-item-edit.level3 {
    /*font-weight:  bold;*/
    font-style: italic;
    font-size: 1rem;
    /*color: #23BCBA;*/
}
.list-item-edit.level3bis {
    font-weight:  normal;
    font-style: italic;
    font-size: 1rem;
    /*color: #23BCBA;*/
}
.list-item-edit.total {font-weight: bold; font-size:1.2rem}
.list-item-edit:last-child {border: none}
.list-item-edit .more{font-size: 3rem;line-height: 0.6rem; transition: 0.2s ease}
.list-item-edit .more:hover{color: #f4bb37}

.list-item-edit.editstrong {font-weight: bold}
.list-item-edit .pair {background: #fefcf4}
.list-item-edit .green {color: #1bb55d}
.list-item-edit .turquoise {color: #23BCBA}
.list-item-edit .white {color: #ffffff !important}

.list-item-edit .n1 {color: #de8de6; margin-right:0rem}
/*.list-item-edit .n1:after
{
    content: "";
    width: 1rem;
    height: 0.5rem;
    background: #F38630;
    position: absolute;
    border-radius: 1rem;
    transform: translate(+15%, -50%);
    top: 20%;
}*/
.list-item-edit .n11 {color:#de8de6; margin-right:0rem}
/*.list-item-edit .n11:after
{
    content: "";
    width: 1rem;
    height: 0.5rem;
    background: #F38630;
    position: absolute;
    border-radius: 1rem;
    transform: translate(+15%, -50%);
    top: 50%;
}*/

.list-item-edit .budget {color:#828DF7; margin-right:0rem}
/*.list-item-edit .budget:after
{
    content: "";
    width: 1rem;
    height: 0.5rem;
    background: #828DF7;
    position: absolute;
    border-radius: 1rem;
    transform: translate(+15%, -50%);
    top: 20%;
}*/
.list-item-edit .budget1 {color:#828DF7; margin-right:0rem}
/*.list-item-edit .budget1:after
{
    content: "";
    width: 1rem;
    height: 0.5rem;
    background: #828DF7;
    position: absolute;
    border-radius: 1rem;
    transform: translate(+15%, -50%);
    top: 50%;
}*/

.list-item-edit .real {color: #23BCBA; margin-right:0rem;}
/*.list-item-edit .real:after
{
    content: "";
    width: 1rem;
    height: 0.5rem;
    background: #23BCBA;
    position: absolute;
    border-radius: 1rem;
    transform: translate(+15%, -50%);
    top: 52%;
}*/
.list-item-edit .real1 {color: #23BCBA; margin-right:0rem;}
/*.list-item-edit .real1:after
{
    content: "";
    width: 1rem;
    height: 0.5rem;
    background: #23BCBA;
    position: absolute;
    border-radius: 1rem;
    transform: translate(+15%, -50%);
    top: 50%;
}*/
.select2-container .select2-choice {
    padding: 5px 10px;
    height: 40px;
    width: 132px;
    font-size: 1em;
}
.borderedit {border-left:1px solid rgba(5, 5, 5, 0.27); border-top:1px solid rgba(5, 5, 5, 0.27)}
.bordereditall {border:1px solid rgba(5, 5, 5, 0.27);}
.bordereditleft {border-left:1px solid rgba(5, 5, 5, 0.27);}
.bordereditright {border-right:1px solid rgba(5, 5, 5, 0.27);}
.borderedittop {border-top:1px solid rgba(5, 5, 5, 0.27);}
.bordereditbottom {border-bottom:1px solid rgba(5, 5, 5, 0.27);}

.bordereditpoint {border-left:1px dashed rgba(5, 5, 5, 0.27); border-top:1px solid rgba(5, 5, 5, 0.27)}
.bordereditallpoint {border:1px dashed rgba(5, 5, 5, 0.27);}
.bordereditleftpoint {border-left:1px dashed rgba(5, 5, 5, 0.27);}
.bordereditrightpoint {border-right:1px dashed rgba(5, 5, 5, 0.27);}
.borderedittoppoint {border-top:1px dashed rgba(5, 5, 5, 0.27);}
.bordereditbottompoint {border-bottom:1px dashed rgba(5, 5, 5, 0.27);}

.bordereditlarge {border-left:2px solid rgba(5, 5, 5, 0.27); border-top:1px solid rgba(5, 5, 5, 0.27)}
.bordereditalllarge {border:2px solid rgba(5, 5, 5, 0.27);}
.bordereditleftlarge {border-left:2px solid rgba(5, 5, 5, 0.27);}
.bordereditrightlarge {border-right:2px solid rgba(5, 5, 5, 0.27);}
.borderedittoplarge {border-top:2px solid rgba(5, 5, 5, 0.27);}
.bordereditbottomlarge {border-bottom:2px solid rgba(5, 5, 5, 0.27);}

.bordereditblue {border-left:1px solid rgba(35, 188, 186, 1); border-top:1px solid rgba(35, 188, 186, 1)}
.bordereditleftblue {border-left:1px solid rgba(35, 188, 186, 1);}
.bordereditrightblue {border-right:1px solid rgba(35, 188, 186, 1);}
.borderedittopblue {border-top:1px solid rgba(35, 188, 186, 1);}
.bordereditbottomblue {border-bottom:1px solid rgba(35, 188, 186, 1);}

.bordereditbluelarge {border-left:2px solid rgba(35, 188, 186, 1); border-top:1px solid rgba(35, 188, 186, 1)}
.bordereditleftbluelarge {border-left:2px solid rgba(35, 188, 186, 1);}
.bordereditrightbluelarge {border-right:2px solid rgba(35, 188, 186, 1);}
.borderedittopbluelarge {border-top:2px solid rgba(35, 188, 186, 1);}
.bordereditbottombluelarge {border-bottom:2px solid rgba(35, 188, 186, 1);}

.bgproduit {background: #e9feed;}
.bgcharge {background: #feefe8;}
.bgbilan {background: #f8feec;}
.bgsolde {background: #f2f6f9;}
.bgattention {background: #f9f057;}
.bgreal {background: #000; color:#fff;}
.bggrey1 {background: rgba(243, 216, 35, 0.35); color:#23BCBA; !important;}
.bggrey2 {background: rgba(243, 216, 35, 0.10); color:#000;}
.bggrey3 {background: #f3f3f3;}
.bggrey4 {background: #fbfbfb;}
.bggreypr {background: #e6dde4;}

.circle {
    margin:10px;
    width:100px;
    background:#23BCBA;
    height:100px;
    text-align:center;
    border-radius:100px;
    line-height: 90px; /* 100 - 10 */
    color:#fff;
}
/* searchbar */
#searchbar > div:first-child{padding-left: 0}
#searchbar > div{padding: 0 1.5rem;width: 27%}
#searchbar .tright {padding-left: 4rem; width: 16%}
#searchbar label {
    padding: 0 1rem 0 0;
    display: inline-block;
    vertical-align: middle;
    margin: 0
}
#searchbar input {
    padding: 0.5rem 1rem;
    border-radius: 0.4rem;
    border: 1px solid #dfdfdf;
    background: #fff;
    font-size: 1.25rem;
    margin:0.5rem;
}
div#searchbar {
    border: 1px solid #f4bb37;
    border-radius: 0.4rem;
    display: none;
    transform: scale(0.8);
    transition: 0.2s ease
}
div#searchbar.on{
    display: block;
    transform: scale(1)
}
#searchbar > div > div#slider-range {
    margin-left: 10%;
    transform: translateY(-15px);
    width: 60%;
    display: inline-block;
    vertical-align: text-bottom;
    border: none;
    background: #dfdfdf;
    height: 0.3rem
}

.ui-slider-range.ui-corner-all.ui-widget-header {background: #f4bb37}
span.ui-slider-handle.ui-corner-all.ui-state-default {
    background: #f4bb37;
    border: none;
    border-radius: 50%;
    height: 1.2rem;
    width: 1.2rem;
    cursor: pointer
}
#slider-range .displayVal {
    position: absolute;
    top: 1.8rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: 1.2rem;
    color: #2c3e40
}
#slider-range .displayVal.max {top: -2.2rem}
#searchbar > div label {width: 30%;}
#searchbar > div input {width: 70%;}
#slider-range .displayVal:after {content: "€"}
.popin form {font-size: 1.2rem}
.popin .grid-2 label{display: block}
.list {font-size: 1.2rem}
.list-item {padding: 0.9rem 2rem; position: relative}
#treso .list-item{padding: 0.5rem 0.5rem 0.5rem 0.5rem}
#justify .list-item{font-size: 1.1rem}
body[data-cat="justify"] .list-item {padding: 0.9rem 1rem 0.9rem 4rem}
#treso .list.np .list-item {padding: 0.9rem;}
.list .list-item .actions {padding: 0.9rem 1rem 0.9rem 3rem; border-left: 1px solid #ececee; width: auto; height: 100%}
.list .list-item .lineSelector {
    position: absolute;
    transition: 0.3s ease;
    left: 0;
    height: 100%;
    width: 1.5rem;
    top: 0
}
.list .list-item.head .actions.on {color: #2c3e40}
.list .list-item input[type="checkbox"] + label {
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    left: 1rem
}
.popin.searchbar-smooth {
    min-width: 40rem;
    max-height: 90%;
    overflow-y: scroll;
}
form table input {padding: 0.5rem}
form table tr td, form table tr th {
    line-height: 2.1rem;
    font-size: 1rem
}
.popin strong {color: #23bcbb}
.popin.searchbar-smooth {
    width: 60rem;
    height: 90%;
    overflow-y: scroll;
}
form table input {padding: 0.5rem}
form table tr td, form table tr th {
    line-height: 2.1rem;
    font-size: 1rem
}
div#freq {margin-bottom: 1rem}
.list-item .actions i,
.popinItem .list-item i{margin-right: 1rem; transition: 0.2s ease}
.list-item .actions i:hover,
.popinItem .list-item i:hover{color: #23BCBA}
.list-item.hidden{display: none;}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
    width: 45%;
    border-radius: 0.2rem;
    margin-right: 0.6rem;
    background: white;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    border: 1px solid rgba(197, 197, 197, 0.39);
    background: #f6f6f6;
    font-weight: normal;
    color: #2c3e40;
    text-align: center;
    border-radius: 0.2rem;
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
    border: 1px solid rgba(96, 125, 139, 0.34);
    background: rgba(158, 158, 158, 0.35);
}
.date-range-selected > .ui-state-active, .date-range-selected > .ui-state-default {
    background: none;
    background-color: #23BCBA;
    color: white;
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
    border: 1px solid #f4bb37;
    background: #007fff;
    font-weight: normal;
    color: #ffffff
}
#popin_add select.blue {background-position: 7.7rem center}
.off {display: none}
.popin.searchbar-addLine,
.popin.searchbar-editLine{
    width: 60rem;
    overflow-y: scroll;
    max-height: 90%
}
#popin_import p {color: #23BCBA;}
div#navMonth .fa,
.total .fa{font-size: 2rem;color: #23BCBA}
div#navMonth > span {
    display: inline-block;
    vertical-align: middle;
    padding: 0 0.5rem
}
.list-item.head .more {
    position: absolute;
    right: 1.5rem;
    top: 50%;
    font-size: 1.6rem;
    transform: translateY(-50%);
    cursor: pointer
}
.list-item.head .more:hover {
    transform: translateY(-50%) rotate(180deg);
    color: #23BCBA
}
button.yelbord {
    border: 1px solid #f4bb37;
    background: white;
    color: #2c3e40
}
.popin.header-hyp,
#popin_edit .popin{width: 50rem}
#popin_rglt .popin{width: 50rem}
button.yelbord i {
    color: #f4bb37;
    padding-right: 0.5rem
}
.popin.header-dossier,
#popin_edit .popin{width: 50rem}
#popin_rglt .popin{width: 50rem}
button.yelbord i {
    color: #f4bb37;
    padding-right: 0.5rem
}
button > i.fa{
    font-size: 1.2rem;
    margin-right: 0.5rem;
}
.content h2 {
    color: #23bcbb;
    font-size: 2rem;
    font-weight: 400;
    text-transform: uppercase
}
#params select,
#params .content input[type="text"],
#params .content input[type="number"],
#params .content input[type="date"]{width: 100%}
#params .content input.percent_field {width: auto}
/*input[type="radio"] {
    display: inline-block !important;
    width: auto !important;
    margin: 0 1rem !important;
    vertical-align: middle !important
}*/
input[type="radio"] {
    /* remove standard background appearance */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0 1rem !important;
    vertical-align: middle !important;
    /* create custom radiobutton appearance */
    display: inline-block;
    width: 22px;
    height: 22px;
    padding: 6px;
    /* background-color only for content */
    background-clip: content-box;
    border: 2px solid #bbb;
    background-color: #e7e6e7;
    border-radius: 50%;
}

/* appearance for checked radiobutton */
input[type="radio"]:checked {
    background-color: #23bcbb;
}

/* optional styles, I'm using this for centering radiobuttons */
.flexradio {
    display: flex;
    align-items: center;
}

.bank_list .bank_wrapper100 {
    padding: 1rem;
    background: rgba(240, 238, 238, 0.7);
    width: calc(100% - 0.01px - 1rem);
    border-radius: 0.4rem;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    margin-left: 1rem
}
.bank_list .bank_wrapper100:nth-child(odd) {
    margin-right: 1rem;
    margin-left: 0
}
.bank_list .bank_wrapper {
    padding: 1rem;
    background: rgba(240, 238, 238, 0.7);
    width: calc(100% / 2 - 0.01px - 1rem);
    border-radius: 0.4rem;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    margin-left: 1rem
}
.bank_list .bank_wrapper:nth-child(odd) {
    margin-right: 1rem;
    margin-left: 0
}
#params .prb {padding-right: 3rem}
#params .plb {padding-left: 3rem}
#params .content input[type="submit"] {width: auto}
section#params {font-size: 1.2rem}
#params select, #params input {line-height: 2rem}
.bank_list .bank_wrapper {padding-left: 3rem}
#addBank p {
    display: block;
    padding: 3rem;
    border: 2px dashed;
    color: rgb(204, 204, 204);
    font-size: 1.6rem;
    width: 90%;
    margin: 0 auto
}
#addBank:hover p {opacity: 0.7}
#popin_addBank .radios label{display: inline-block; margin: 0}
#popin_edit_password form p.warning.error{display: none}
#popin_edit_password form.error p.warning.error{display: block}
#popin_edit_password form.error input[type="text"] {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}
.col.radios {padding-top: 0.8rem}
.list-item.noActive {color: #a94442; opacity: 0.6}
section#plan_comptable .list-item.hidden {
    display: flex;
    opacity: 0.4
}
.list-item .jdoc i.fa.fa-paperclip {
    transform: rotate(-135deg);
    font-size: 1.8rem;
}
.list-item .jdocDash i.fa.fa-paperclip {
    transform: rotate(-135deg);
    font-size: 1.1rem;
}
#treso .list .list-item input.solde_b,
#treso .list.edit .list-item span.soldeb_desc{display: none}
#treso .list.edit .list-item input.solde_b{display: block}

button#edit_bankSold.on .vis,
button#edit_bankSold .ed{display: none}
button#edit_bankSold.on .ed{display: block}

button#edit_bankSold.on {
    background: white;
    color: #f4bb37;
    border: 1px solid
}
.bank_wrapper input[type="submit"] {background: #23bcbb; transition: none}
.bank_wrapper input[type="submit"]:hover {background: #23bcbb; color: white}
.bank_wrapper input[type="submit"][value="Supprimer"] {background: #c9426c}
#popin_delete button {width: 90%; transition: 0.2s ease}
#popin_delete form button.red:hover {background: rgba(201, 66, 108, 0.8)}
#popin_deleterglt button {width: 90%; transition: 0.2s ease}
#popin_deleterglt form button.red:hover {background: rgba(201, 66, 108, 0.8)}
/* DASHBOARD */
body[data-cat="dashboard"]  h1,
h1.green, h1.orange {
    font-weight: 300;
    font-size: 2rem;
    line-height: 3rem;
    margin: 0
}
h1.green{color: #23BCBA}
h1.orange{color: #FFBB43}
body[data-cat="dashboard"]  h1.mbs {margin-bottom: 1rem;}
body[data-cat="dashboard"]  h1 small {
    font-size: 1.3rem;
    color: #8A8A8A
}
body[data-cat="dashboard"]  p small {
    font-size: 1.1rem;
}
body[data-cat="dashboard"]  p large {
    font-size: 2rem;
}
body[data-cat="parametres"]  p large {
    font-size: 2rem;
}
.card {
    box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.23);
    padding: 2rem;
    margin-bottom: 2rem
}
.cardDouble, .cardFourth {
    box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.23);
    padding: 2rem;
    margin-bottom: 2rem
}
.cardEdition {
    box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.23);
    padding: 2rem;
    margin-bottom: 1rem;
}
.cardBal {
    box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.23);
    padding: 0rem;
    margin-bottom: 0rem;
}
.chart-top {position:relative; padding-right: 10rem}
#dashbudg_var .chart-top {padding-right: 0}
.chart-top #chart_filters {
    position: absolute;
    right: 0;
    width: auto
}
p#soldAmount {
    font-size: 2rem;
    font-weight: 300;
    border-bottom: 1px solid rgba(204, 204, 204, 0.35);
    margin-bottom: 2rem;
    padding-bottom: 0rem
}
.budget p#soldAmount {margin-bottom: 1.5rem}
.filtres {
    position: relative;
    padding-right: 6.5rem;
    color: #8A8A8A;
    border-bottom: 1px solid #cccccc
}
.filtrestop {
    position: relative;
    padding-right: 6.5rem;
    color: #8A8A8A;
    border-top: 1px solid #cccccc
}
.filtresEdition {
    position: relative;
    padding-right: 6.5rem;
    color: #8A8A8A;
}
p#dateInterval {
    font-size: 2rem;
    font-weight: 300;
    border-bottom: 1px solid rgba(204, 204, 204, 0.35);
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem
}
div#recap_tabs .card{height: 23rem}
div#recap_tabs .cardBal{height: 12rem}
div#recap_tabs .cardDouble{height: 40rem}
div#recap_tabs .cardFourth{height: 25rem}
div#recap_tabs .cardDouble .subcardDouble{height: 20rem}
.budget div#recap_tabs .scrollable {height: 15.8rem}
.scrollable {height: 15rem; position: relative;padding-right: 1.3rem;}
body[data-cat="justify"] .scrollable{height: 40rem;}
body[data-cat="treso"] .scrollable{height: 40rem;}

.sorter.asc span.ico-arrowdb {transform: rotate(180deg) translateX(-0.5rem)}
.popin.chart-point {
    width: 90%;
    transform: translate(-50%, -50%);
}
.popin.chart-filters {width: 65rem}
#popin_chartfilters input[type="checkbox"] + label {
    margin-right: 0;
    vertical-align: middle
}
#popin_chartfilters label + span {
    display: inline-block;
    vertical-align: middle
}
#dashbudg_var .chart-top select.blue.mbs {margin-bottom: 0.3rem}

/* DOCUMENTATION PAGE */
#documentation h1 {
    font-weight: 300;
    font-size: 2rem;
    line-height: 3rem;
    margin: 0;
    text-transform: uppercase;
    color: #23BCBA;
}
#documentation h2 {
    color: #a0a9b2;
    font-size: 1.5rem;
    font-weight: bold;
}
#documentation h3 {
    color: #a0a9b2;
    font-size: 1.3rem;
    text-align: left;
}
#documentation p {
    color: #000;
    font-size: 1.3rem;

}

/* LANDING PAGE */
body#landing_page{padding: 0}
#landing_page .grey{color: #a0a9b2}
#landing_page section p {
    font-size: 1.3rem;
    font-weight: 300;
}
#landing_page h1,
#landing_page h2,
#landing_page h3{font-family: 'Muli', sans-serif}
#landing_page h4{margin: 2rem 0 1.5rem 0}
#landing_page header {
    background: transparent;
    padding: 1rem 0;
    height: auto;
    transition: 0.2s ease;
    padding: 2rem 0;
}
#landing_page header.scrolled {
    background: linear-gradient(to right, #54e994 0%,#23bcbb 100%);
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2);
    z-index: 2;
    padding: 2rem 0
}
#landing_page header.scrolled .bloc_logo img {width: 9.3rem}
#landing_page .main_home{
    padding: 10vh 0;
    min-height: 100%;
    position: relative;
    padding-bottom: 10rem;
    background: url(../img/bghead.png) left bottom no-repeat, linear-gradient(to right, #54e994 0%,#23bcbb 100%);
    background-size: contain;
    color: white
}
.cta_try button {
    background: #fdb840;
    background: -moz-linear-gradient(left, #fdb840 0%, #f97c7e 100%);
    background: -webkit-linear-gradient(left, #fdb840 0%,#f97c7e 100%);
    background: linear-gradient(to right, #fdb840 0%,#f97c7e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdb840', endColorstr='#f97c7e',GradientType=1 );
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 1.3rem;
    padding: 1.8rem 4.6rem;
    width: 100%;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2)
}
.cta_try a {display: inline-block}
.cta_try a p small {font-size: 1.1rem}
.cta_try a p {margin-top: 0.2rem}
.bounce{
    -webkit-animation: bounce 2s 0s ease-in-out 2;
    animation: bounce 2s 0s ease-in-out 2
}
.main_home .scroller {
    position: absolute;
    bottom: 1rem;
    left: 50%;
    transform: translateX(-50%);
    background: white;
    color: black;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    line-height: 4rem;
    font-size: 2.5rem;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
    cursor: pointer
}
#landing_page section:not(.popinList) {padding: 4rem 0}
span.yellow_circle {
    width: 10rem;
    height: 10rem;
    display: inline-block;
    background: #F4BC1F;
    border-radius: 50%;
    line-height: 10rem;
    font-size: 4.5rem;
    text-align: center;
    color: white
}
section#slideshow {
    border-radius: 0 0 50% 50% / 2.5%;
    padding: 0 0 8rem 0
}
section#video {background: #dcf4f4}
section#tarifs {background: #F1F5F8}
.blue_grad{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#b169b5+0,8c8eff+100 */
    background: #b169b5; /* Old browsers */
    background: -moz-linear-gradient(top, #b169b5 0%, #8c8eff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #b169b5 0%,#8c8eff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #b169b5 0%,#8c8eff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b169b5', endColorstr='#8c8eff',GradientType=0 ) /* IE6-9 */
}
.green_grad{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#10babe+0,4aea92+100 */
    background: #10babe; /* Old browsers */
    background: -moz-linear-gradient(45deg, #10babe 0%, #4aea92 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(45deg, #10babe 0%,#4aea92 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(45deg, #10babe 0%,#4aea92 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#10babe', endColorstr='#4aea92',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    height: 100%
}
.red_grad{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f4bc21+0,fe7d7a+100 */
    background: #f4bc21; /* Old browsers */
    background: -moz-linear-gradient(top, #f4bc21 0%, #fe7d7a 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #f4bc21 0%,#fe7d7a 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #f4bc21 0%,#fe7d7a 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4bc21', endColorstr='#fe7d7a',GradientType=0 ) /* IE6-9 */
}

.prices > div {color: white}
#landing_page section p.title {
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 500
}

#landing_page section p.price {
    font-size: 6rem;
    font-weight: bold;
    font-family: 'Muli', sans-serif
}

#landing_page section p.price span.medium {
    font-size: 2.4rem;
    font-weight: 300;
    letter-spacing: 5px
}

#landing_page section p.price small {
    font-size: 1rem;
    font-weight: normal;
    letter-spacing: 2px
}
#landing_page section p.desc {padding: 0 5rem}
.prices button {
    background: transparent;
    border: 1px solid;
    letter-spacing: 5px;
    padding: 1rem 2rem;
    margin-top: 3rem
}
section#tarifs .green_grad {padding: 5.7rem 0}
.prices .green_grad button {
    background: white;
    color: #24bdba;
    margin-top: 5rem;
    border-color: white
}
.prices {
    margin: 3rem auto 0 auto
}
.prices > div {transition: 0.4s ease}
.prices > div:hover {transform: translateY(-1rem)}
.prices .col-30 div[class*="_grad"] {padding: 1rem;height: 45rem;position: relative}
.prices div[class*="_grad"] button {
    position: absolute;
    bottom: 1rem;
    left: 50%;
    width: 90%;
    transform: translateX(-50%);
    max-width: 25rem
}
.prices .col-40 div[class*="_grad"] button {max-width: 25rem}
.prices .col-40 div[class*="_grad"] {position: relative}
.prices ul.tcenter li {
    font-size: 1.4rem;
    margin-bottom: 0.5rem;
}
#testim .wrapper .mask {
    overflow: hidden;
    border-radius: 50%;
    width: 15rem;
    margin: 0 auto 2rem auto
}
#testim .wrapper p.name {
    font-size: 1.8rem;
    font-weight: 500
}
#testim .wrapper p.fonction {
    text-transform: uppercase;
    font-size: 1.1rem;
    letter-spacing: 3px
}
#testim .wrapper hr {
    width: 5rem;
    margin: 2rem auto;
    height: 2px;
    background: #F4BC1F
}
.owl-stage-outer {margin: 4rem 0}
.owl-theme .owl-dots .owl-dot span {width: 7px;height: 7px}
#landing_page h4 {
    margin: 2rem 0 1.5rem 0;
    font-weight: 400;
    text-transform: uppercase;
    font-size: 1.5rem;
    letter-spacing: 1px
}
#contact .green_grad {
    padding: 10.2rem 0;
    color: white
}
div#contact_form {padding: 0 7rem}
#contact_form input[type="submit"] {background: #f4bb37}
section#try_it {
    background: #FEEFD7;
    text-align: center;
    color: #FFFFFF
}

#try_it .content > * {
    display: inline-block;
    vertical-align: middle
}
.busy{opacity: 0.4;}
#try_it h3.yellow {
    margin: 0 3rem;
    text-transform: none
}
#landing_page footer {
    background: #1c2541;
    background: url(../img/bghead.png) 7.8rem bottom no-repeat, linear-gradient(to right, #54e994 0%,#23bcbb 100%);
    background-size: contain;
    padding: 5rem 0px;
    color: white
}
#landing_page footer, #landing_page header {font-size: 1.2rem}
.popin.landing-connexion {
    width: 60rem;
    border-radius: 1rem;
    overflow: hidden;
    padding: 0
}

#popin_connexion section.tabs {padding: 0}
#popin_connexion .tab.active {
    color: #23BCBA;
    border-bottom: none;
    background: white
}
#popin_connexion .tab {
    background: #23BCBA;
    color: white;
    padding: 1.6rem 0
}
#popin_connexion .tab_content {padding: 3rem 10rem}
#popin_connexion i,
#landing_page.connexion i{
    color: #23bcba;
    margin-right: 1rem;
    font-size: 1.9rem
}
#popin_connexion label,
#landing_page.connexion label{
    font-size: 1.6rem;
    font-weight: 300
}
#popin_connexion #con a,
#landing_page.connexion .connexion_page a{
    font-size: 1rem;
    text-decoration: underline
}
#popin_connexion input[type="submit"],
#landing_page.connexion input[type="submit"]{
    width: auto;
    padding: 1.3rem 2rem
}
#popin_connexion #inscr i{
    color: #23bcba;
    margin-right: 1rem;
    font-size: 1.9rem
}
.list .list-item input:not([type="submit"]), .list .list-item select {
    width: 95%;
    background: white;
    border: 1px solid #dedede;
    height: 2.2rem;
    font-size: 1.1rem;
    padding: 0;
    text-align: left
}
.list .list-item select[multiple] {
    width: 95%;
    background: white;
    border: 1px solid #dedede;
    height: 5rem;
    font-size: 1.1rem;
    padding: 0;
    text-align: left
}
.alert_email {
    position: absolute;
    display: none;
    transform: translate(0, -57%);
    right: 0;
    right: 2.5rem;
    padding: 1rem;
}
#popin_point .list-item {overflow: visible;}
.relative {
    position: relative;
    display: inline-block
}
#popin_point .fa-bell {margin: 0}
.alert_email textarea {
    background: white;
    margin: 0
}
.list .list-item .alert_email input {
    width: auto;
    margin-top: 0.5rem;
    float: right;
    background: #FFBB43;
    height: auto;
    padding: 0.7rem
}
.alert_email.active {
    display: block;
    z-index: 1
}
.alert_email i.fa.fa-times {
    position: absolute;
    top: 0.2rem;
    right: 0rem
}
#popin_point .scrollable,
#popin_details .scrollable{height: 30rem}
div#recap_tabs .scrollable {height: 11.5rem}
#dash_account .scrollable {height: 45rem}
#plan_comptable .scrollable {height: 55rem}
#editionitem .scrollable {height: 45rem}
.list .scrollable{margin-right: -1.3rem}
.popin.chart-point {overflow: hidden}
.confirm i {
    font-size: 2rem;
    color: #e66b4e
}
.confirm i.ok {color: #1bb55d}
.list .confirm{display: none}
.list.edit .confirm{display: block}
.ask .tooltip, .asksmall .tooltip  {
    position: absolute;
    background: rgba(35, 188, 187, 0.9);
    color: white;
    top: 4rem;
    left: 40%;
    transform: translateX(-40%);
    padding: 0.5rem;
    display: none;
    font-size: 1.5rem;
    text-transform: none;
    z-index: 9999;
    min-width: 35rem
}
.ask:hover .tooltip, .asksmall:hover .tooltip {display: block}
.ask .tooltip, .asksmall .tooltip {background: #23bcbb}
.ask .tooltip:after, .asksmall .tooltip:after {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(35, 188, 187, 0);
    border-bottom-color: #23bcbb;
    border-width: 7px;
    margin-left: -7px
}
.list-item button {
    background: transparent;
    color: #1bb55d;
    padding: initial
}

.list-item-edit button {
    color: #1bb55d;
    padding: 0.5rem;
    border-radius: 0.5rem;
    cursor: pointer;
    background: #E9FEED;
    border: 1px solid #1bb55d;
    font-size: 1.1rem;
    font-weight: 500
}
span.ct-label {
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-weight: bold;
    color: #2c3e57;
    font-size: 0.9rem;
    transform: translateY(5px)
}
span.ct-label.ct-vertical.zero {color: #e66b4e;font-size: 1.3rem}
.ct-label.ct-horizontal.today {-webkit-text-fill-color: #e66b4e;color: white;font-size: 1.3rem}
.ct-point.today {
    stroke: #e66c4f !important;
    stroke-width: 15px;
}
div#popin_groupDetails form {margin-bottom: 0.5rem}
div#popin_detailsBalance form {margin-bottom: 0.5rem}
#recap_tabs input[name*="amount"] {padding-right: 0.5rem}
#plan_comptable .list-item {padding-left: 4rem}
.mobileOnly{display: none;}
.desktopOnly{display: block;}
.docked_b{position: absolute; bottom: 0; left: 0; width: 100%}
#landing_page.connexion h1 {margin-top: 2rem; color: #23bcbb}
#landing_page.connexion section.connexion_page {
    width: 55rem;
    margin: 0 auto;
}
#landing_page.connexion label {margin: 0.2rem 0}
section#connect {background: white}
body#landing_page.connexion {background: #1c2541;}
#landing_page.connexion select {
    width: 100%;
    background: #ededed;
    border: none;
    padding: 0.3rem
}
#landing_page.connexion input[type="submit"] {
    font-size: 1.2rem;
    padding: 1rem
}
.file-list i {
    cursor: pointer;
    transition: 0.2s ease
}
.file-list i:hover {color: #23bcba}
.popin.treso-diff {width: 95%}
.popin.treso-donate {width: 65%}
.roller .sub {
    position: absolute;
    top: 3.2rem;
    right: 0;
    background: #4ebcba;
    padding: 1rem;
    border-radius: 0.1rem;
    border: 1px solid #47a5a3;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.14);
    z-index: 1;
    display: none;
}
.roller {position: relative}
.roller .trigger {cursor: pointer}
.roller.opened .sub {display: block}
.roller .trigger i.fa {transition: 0.2s ease; margin-left: 1rem}
.roller.opened .trigger i.fa {transform: rotate(-180deg)}
/* TEMP */
a[title="Ecriture groupée"] label {
    padding: 0.4rem 1.2rem;
    display: inline-block
}
body[data-cat="treso"] div#bloc_filters select {margin-right: 0rem}
.actions button {margin: 0}
#treso .actions button {margin-left: 0}
.popin.list-groupDetails {min-width: 75rem}

body[data-cat="justify"] span.bank-name strong {
    font-weight: 300;
    font-size: 2.5rem
}
div#header-bank {
    border-radius: 0.2rem;
    padding: 2rem;
    background: #f2f6f9;
}
#balance .actions button {margin-left: 0}
.popin.list-detailBalance {min-width: 80%}

#plcCatTreso .actions button {margin-left: 0}
.popin.list-detailCategory {min-width: 40%}
.popin.list-detailContact {min-width: 80%}
.popin.list-detailTiers {min-width: 80%}
.popin.list-detailAssoBanque {min-width: 80%}
.popin.list-detailRemise {min-width: 50%}

.popin .inline_actions input,
.popin .inline_actions button {
    line-height: 3rem;
    height: 3rem;
    padding: 0 1rem;
    display: inline-block;
    vertical-align: middle;
}

#mooves .list-item.head {
    background: #ffbb4333;
    color: #FFBB43;
}
body[data-cat="justify"] .associate-actions {opacity: 0;transition: 0.4s ease}
body[data-cat="justify"] .associate-actions.visible {opacity: 1}
body[data-cat="dashboard"] i.fa.fa-smile-o {color: #1bb55d;margin-right: 0.5rem; font-size: 1.5rem}
body[data-cat="dashboard"] i.fa.fa-meh-o {color: #FFBB43; margin-right: 0.5rem; font-size: 1.5rem}
body[data-cat="dashboard"] i.fa.fa-frown-o {color: #e66b4e;margin-right: 0.5rem;font-size: 1.5rem}
body[data-cat="dashboard"] i.fa.fa-database {color: #23BCBA;margin-right: 0.5rem;font-size: 1.5rem}
body[data-cat="dashboard"] i.fa.fa-envelope {color: #23BCBA;margin-right: 0.5rem;font-size: 1.5rem}
body[data-cat="dashboard"] i.fa.fa-lock {color: #23BCBA;margin-right: 0.5rem;font-size: 1.5rem}
.fixed-header-actions .grid-3.header-actions{
    position: fixed;
    top: 15.2rem;
    background: white;
    left: 10rem;
    width: calc(100% - 10rem);
    z-index: 1;
    padding: 1.5rem 1rem;
    transition: 0.2s ease;
}
.fixed-header-actions .grid-2.header-actions{
    position: fixed;
    top: 15.2rem;
    background: white;
    left: 10rem;
    width: calc(100% - 10rem);
    z-index: 1;
    padding: 1.5rem 1rem;
    transition: 0.2s ease;
}
.fixed-header-actions .grid-3.header-actions h6{margin-bottom: 0;}
.head_mini .fixed-header-actions .grid-3.header-actions{top: 4.4rem;}

/* DRAG & DROP */
.box__dragndrop,
.box__uploading,
.box__success,
.box__error,
.box__files,
.drop_zone .messages,
.drop_zone2 .messages
{
    display: none;
}
.drop_zone {
    padding: 2rem;
    background: rgba(35, 188, 186, 0.06);
    border: 1px dashed #23bcba;
    color: #23bcba;
    transition: 0.4s ease;
}
.drop_zone2 {
    padding: 2rem;
    background: rgba(255, 203, 72, 0.06);
    border: 1px dashed #ffcb48;
    color: #ffcb48;
    transition: 0.4s ease;
}
.box__files {
    padding: 1rem;
    color: #333;
}
.drop_zone.over{background: rgba(110, 130, 129, 0.1);}
.drop_zone input{display: none;}
.drop_zone label {margin: 0;}

.drop_zone2.over{background: rgba(110, 130, 129, 0.1);}
.drop_zone2 input{display: none;}
.drop_zone2 label {margin: 0;}

/* MEDIA QUERIES */
@media (max-width: 1640px) {
    .content {width: 115rem}
}
@media (max-width: 1300px) {
    .content {width: 89rem}
    div#recap_tabs .card {height: 26rem}
    div#recap_tabs .cardBal {height: 12rem}
    div#recap_tabs .cardDouble {height: 12rem}
    div#recap_tabs .cardFourth {height: 10rem}
    div#recap_tabs .cardDouble .subcardDouble{height: 25rem}
    .budget div#recap_tabs .scrollable {height: 18rem}
}
@media (max-width: 1020px)
{
    .content {width: 81rem}
    #bloc_filters select.mrbs {margin-right: 0.5rem}
    .actions button.wico {
        margin-left: 0;
        margin-bottom: 0.5rem;
        margin-right: 0.5rem
    }
}
@media (max-width: 940px)
{
    .fixed-header-actions .grid-3.header-actions{
        position: relative;
        top: initial;
        left: initial;
        width: 100%;
        padding: 0;
        background: transparent;
        z-index: auto;
    }
    nav#asideMenu {transform: translateX(-100%)}
    body {padding: 0}
    body.head_mini {padding: 0}
    header {
        padding-left: 0;
        background-position: 0 bottom;
        padding-top: 1rem;
        position: relative;
        height: auto
    }
    header nav#topMenu {
        position: relative;
        bottom: 0;
        font-size: 1.4rem;
        margin-top: 1rem
    }
    .content {
        width: 100%;
        padding: 0 2rem
    }
    header i.fa.fa-bars.resp_menu {
        font-size: 3rem;
        cursor: pointer
    }
    header nav#topMenu{padding: 1rem 0;}
    header nav#topMenu ul li.active {
        background: white;
        color: #23bcbb;
        padding: 1rem;
        border-top-left-radius: 0.7rem;
        border-top-right-radius: 0.7rem;
        border-radius: 0.7rem;;
        margin: 0 1rem 0 0;
    }
    header nav#topMenu ul li {
        display: inline-block;
        vertical-align: top;
        padding: 1rem;
        margin: 0 1rem 0 0;
    }
    #landing_page header.scrolled {
        position: fixed;
        background: #1c2541
    }
    #landing_page header .bloc_logo img {max-width: 9.3rem}
    nav#asideMenu.mobile_show {transform: translateX(0)}
    .mobileOnly{display: block}
    .desktopOnly{display: none}
    nav#asideMenu > #bloc_logo {padding: 1.5rem 1rem 3.6rem 1rem}
    #asideMenu .mobileOnly i.fa.fa-times {
        font-size: 2rem;
        color: white;
        padding: 1rem 0;
        cursor: pointer;
        transition: 0.4s ease
    }
    #asideMenu .mobileOnly i.fa.fa-times:hover {transform: rotate(90deg)}
    .xs-mtm {margin-top: 2rem}
    .xs-mts {margin-top: 1rem}
    .xs-mtxs {margin-top: 0.5rem}
    .xs-tcenter {text-align: center}
    .xs-tleft {text-align: left}
    .xs-tright {text-align: right}
    .xs-inbl {display: inline-block}
    .xs-noph{padding-left: 0; padding-right: 0;}
    .col-xs-100-i {width: 100% !important}
    .col-xs-100 {width: 100%}
    .col-xs-90 {width: 90%}
    .col-xs-80 {width: 80%}
    .col-xs-70 {width: 70%}
    .col-xs-60 {width: 60%}
    .col-xs-50 {width: 50%}
    .col-xs-49 {width: 49%}
    .col-xs-40 {width: 40%}
    .col-xs-30 {width: 30%}
    .col-xs-20 {width: 20%}
    .col-xs-15 {width: 15%}
    .col-xs-10 {width: 10%}
    .xs-pos-1{order: 1}
    .xs-pos-2{order: 2}
    .xs-pos-3{order: 3}
    .xs-pos-4{order: 4}
    .xs-pos-5{order: 5}
    .xs-pos-6{order: 6}
    .xs-nop{padding: 0}
    .xs-bwt {
        border-top: 1px solid;
        padding-top: 1rem;
        margin-top: 1rem;
        border-color: rgba(255, 255, 255, 0.35);
    }
    .xs-bwb {
        border-bottom: 1px solid;
        padding-bottom: 1rem;
        margin-bottom: 1rem;
        border-color: rgba(255, 255, 255, 0.35);
    }
    body#landing_page {padding: 5.5rem 0 0 0}
    div#recap_tabs .card, div#recap_tabs .cardBal, div#recap_tabs .cardDouble, div#recap_tabs .cardDouble .subcardDouble, div#recap_tabs .scrollable {height: auto;}
    .popin {
        width: 100% !important;
        height: 100% !important;
        top: 0;
        left: 0;
        position: absolute;
        transform: none;
    }
    #searchbar > div {width: 100%}
    #searchbar .tright {
        padding-left: 0;
        width: 100%
    }
    div#bloc_filters select {margin-bottom: 0.5rem}
    #params .xs-nop{padding: 0}
    .bank_list .bank_wrapper:nth-child(odd) {margin-right: 0}
    .bank_list .bank_wrapper {width: 100%; margin: 0; padding: 1rem;margin-top: 1rem; margin-bottom: 1rem}
    #landing_page .main_home {padding: 1rem;}
    #landing_page header {
        background: #1c2541;
        box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2);
        position: fixed;
        z-index: 2;
        padding: 2rem 0
    }
    #landing_page .main_home {
        background: linear-gradient(to right, #54e994 0%,#23bcbb 100%);
        padding: 1rem 1rem 8rem 1rem;
        border-radius: 0
    }
    #landing_page section:not(.popinList) {padding: 4rem 0}
    .content-s {width: 100%}
    .prices .col-40 div[class*="_grad"], .prices .col-30 div[class*="_grad"] {height: auto}
    .prices div[class*="_grad"] button {
        position: relative;
        left: initial;
        transform: none
    }
    body#landing_page section#tarifs .green_grad,
    body#landing_page section#tarifs .red_grad,
    body#landing_page section#tarifs .blue_grad{
        padding: 2rem 0;
    }
    div#contact_form {padding: 0}
    #try_it h3.yellow {margin: 0 0 2rem 0}
    section#tarifs .green_grad {padding: 0}
    .cta_try a {
        display: inline-block;
        width: 100%
    }
    .col.video-wrapper {width: 100% !important}
}