/* Move down content because we have a fixed navbar that is 50px tall */
body {
    font-family: 'montserratregular';
    color: #373737;
    background: #F6F5F8;
}

#body {
    /*background: linear-gradient(109.13deg, #6A9B3A 2.37%, #41633B 82.74%);*/
    background: rgb(65,99,59);
    /*background: linear-gradient(180deg, rgba(65,99,59,1) 0%, rgba(106,155,58,1) 100%);*/
}

.widget-content {
    padding-top: 65px;
    padding-bottom: 20px;
    background: #F6F5F8;
    border-bottom-left-radius: 20px;
    margin-left: 110px;
    height: 100%;
}

.fontAwesome {
    font-family: Helvetica, FontAwesome,sans-serif;
}

.first-element {
    font-weight: bold;
    display: block;
}

.second-element {
    font-size: smaller;
    display: block;
    color: #A4A7AE;
}

.fistElementTable {
    /*width: 1% !important;*/
    position: relative;
    overflow: hidden;
    border-radius: 0px 0px 0px 0px;
    /*border-right: 1px dashed #DFDFDF !important;*/
}
.fistElementTable:before {
    content: "";
    display: block;
    background-image: linear-gradient(#ffffff80, #ebebec);
    position: absolute;
    top: -10px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 20px;
}
.dialogbox {
    margin: 0;
    position: absolute;
    right: 1%;
}

.fistElementTable:after {
    content: "";
    display: block;
    background-image: linear-gradient(#ebebec, #ffffff80);
    position: absolute;
    bottom: -10px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 20px;
}

.secondElementTable {
    position: relative;
    overflow: hidden;
    border-radius: 0px 0px 0px 0px;
}

/*.secondElementTable:before {
    content: "";
    display: block;
    background-image: linear-gradient(#ffffff80, #ebebec);
    position: absolute;
    top: -10px;
    left: -15px;
    width: 20px;
    height: 20px;
    border-radius: 20px;
}

.secondElementTable:after {
    content: "";
    display: block;
    background-image: linear-gradient(#ebebec, #ffffff80);
    position: absolute;
    bottom: -10px;
    left: -14px;
    width: 20px;
    height: 20px;
    border-radius: 20px;
}*/
.dialogbox {
    margin:0;
    position:absolute;
    right:1%;
}
.dialogboxgris {
    margin: 0;
    position: absolute;
    left: 1%;
}

.tipgris {
    width: 0px;
    height: 0px;
    position: absolute;
    background: transparent;
    border: 10px solid #ccc;
}

.tip {
    width: 0px;
    height: 0px;
    position: absolute;
    background: transparent;
    border: 10px solid #76A82F;
}

.tip-up {
    top: -25px; /* Same as body margin top + border */
    left: 10px;
    border-right-color: transparent;
    border-left-color: transparent;
    border-top-color: transparent;
}

.tip-upgris {
    top: -25px; /* Same as body margin top + border */
    border-right-color: transparent;
    border-left-color: transparent;
    border-top-color: transparent;
}


.dialogbox .body {
    position: relative;
    max-width: 300px;
    height: auto;
    margin: 12px 10px;
    padding: 0px;
    background-color: #76A82F;
    border-radius: 3px;
    border: 5px solid #76A82F;
}

.body .message {
    min-height: 30px;
    border-radius: 3px;
    font-family: Arial;
    font-size: 14px;
    line-height: 1.5;
    color: white;
}

.dialogboxgris .bodygris {
    position: relative;
    max-width: 300px;
    height: auto;
    margin: 12px 10px;
    padding: 0px;
    background-color: #DADADA;
    border-radius: 3px;
    border: 5px solid #DADADA;
}

.bodygris .messagegris {
    min-height: 30px;
    border-radius: 3px;
    font-family: Arial;
    font-size: 14px;
    line-height: 1.5;
    color: #797979;
}

h1 {
    font-family: 'philosopherregular';
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    line-height: 42px;
    display: inline-block;
    position: relative;
    color: #41633B;
    margin-left: 15px;
}

h2, .widget-header .title, .widget-sec-header .title {
    font-family: 'philosopherregular';
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    line-height: 18px;
    color: #373737;
    /* identical to box height */
}

.widget-header .title {
    display: block;
    margin-bottom: 15px;
}

p {
    font-size: 14px;
}

img {
    max-width: 100%;
}

.hidden {
    display: none !important;
}

#content {
    padding: 17px 0 0 !important;
}


/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
input,
select,
textarea {
    /*max-width: 280px;*/
}

.sidebar {
    position: fixed;
    /*background: #41633B;*/
    top: 0;
    bottom: 0;
    width: 110px;
    left: 0;
    z-index: 10;
    /*background: linear-gradient(109.13deg, #6A9B3A 2.37%, #41633B 82.74%);*/
    background: rgb(65,99,59);
    /*background: linear-gradient(180deg, rgba(65,99,59,1) 0%, rgba(106,155,58,1) 100%);*/
    text-align: center;
}

.logo {
    margin-top: 10px;
}

.nav-right {
    /*float: right;*/
    background: #fff;
    /*margin: -10px -15px 0 0;*/
    padding: 15px 20px 0;
    border-bottom-left-radius: 20px;
    position: absolute;
    right: 0;
    top: 0;
    height: 60px;
}

.nav-right .navbar-nav {
    display: block;
    border: 0;
    background: transparent;
}

    .nav-right .navbar-nav li {
        display: inline-block;
    }

.nav-right .k-menu .k-item > .k-link {
    display: block;
    padding: 0.5rem 1rem;
    line-height: 1.34em;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.nav-right .k-state-hover a,
.nav-right .k-state-hover a:focus,
.nav-right .k-state-hover a:hover
.nav-right .k-state-hover:hover a,
.nav-right .k-state-border-down,
.nav-right .k-state-border-down:focus,
.nav-right .k-state-border-down:hover {
    background: white !important;
    background-color: white !important;
    box-shadow: inset 0 3px 8px rgba(0,0,0,0) !important;
}

.nav-right .dropdown-menu {
    /*right: 0;
left: auto;*/
    position: absolute;
    float: none;
    padding: 0;
    left: initial;
    right: 0;
}

.nav-right .dropdown-item {
    font-size: 12px;
    padding: 10px 12px;
}

.card-gestion a {
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    color: #A4A7AE;
}


.content-page {
    border: 0;
    padding: 0 15px;
}

.panel-left {
    /*overflow: hidden;*/
    width: 69.7%;
    float: left;
}

.panel-left-dashboard {
    width: 54%;
    float: left;
}

.header-panel {
    position: fixed;
    left: 110px;
    right: 0;
    top: 0;
    height: 75px;
    z-index: 9 !important;
    background: #F6F5F8;
    padding-top: 10px;
    border-top-left-radius: 20px;
}

.main-panel {
    /*padding-left: 110px;
    padding-top: 80px;
    position: relative;
    z-index: 2;*/
}

.panel-right {
    float: right;
    width: 28%;
    margin-left: 20px;
}

.panel-right-dashboard {
    float: right;
    width: 44%;
    margin-left: 20px;
}

.sidebar .navbar-nav {
    width: 100%;
}

.sidebar .navbar-nav .nav-link {
    font-weight: 400;
    font-size: 12px;
    line-height: 13px;
    text-align: center;
    color: #fff;
    padding: 13px 5px !important;
    position: relative;
}

        .sidebar .navbar-nav .nav-link i {
            font-size: 36px;
            display: block;
            line-height: 26px;
        }

        .sidebar .navbar-nav .nav-link:hover,
        .sidebar .navbar-nav .nav-link.active {
            background: #76A82F;
            color: #fff;
        }

#mainNav {
    padding: 0;
    display: block;
}

.main-panel table,
.content-panel table {
    display: block;
}

    .main-panel table tbody,
    .content-panel table tbody,
    .main-panel table thead,
    .content-panel table thead {
        display: block;
        width: 100%;
    }

        .content-panel .k-grid tbody > tr,
        .main-panel table tbody > tr,
        .content-panel table tbody > tr {
            background: #FFF !important;
            /**box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.0831239);*/
            box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.15);
            border-radius: 8px;
            overflow: hidden;
            display: flex;
            margin-bottom: 20px;
        }

        .content-panel .k-grid thead tr,
        .main-panel table thead tr,
        .content-panel table thead tr {
            overflow: hidden;
            display: flex;
        }

        .content-panel .k-grid thead th,
        .main-panel table thead th,
        .content-panel table thead th,
        .main-panel .k-filter-row th, .main-panel .k-grid-header th.k-header,
        .content-panel .k-filter-row th, .content-panel .k-grid-header th.k-header {
            color: #A4A7AE;
            font-size: 14px;
            font-weight: normal;
            text-align: left;
            display: inline-flex;
        }

.main-panel table tbody,
.content-panel table tbody,
.main-panel table thead,
.content-panel table thead{
    display: block;
    width: 100%;
}
    .content-panel .k-grid tbody > tr,
    .main-panel table tbody > tr,
    .content-panel table tbody > tr {
        background: #FFF !important;
        /**box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.0831239);*/
        box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.15);
        border-radius: 16px;
        overflow: hidden;
        display: flex;
        margin-bottom: 10px;
    }
.content-panel .k-grid thead tr,
.main-panel table thead tr,
.content-panel table thead tr {
    overflow: hidden;
    display: flex;
}
.content-panel .k-grid thead th,
.main-panel table thead th,
.content-panel table thead th,
.main-panel .k-filter-row th, .main-panel .k-grid-header th.k-header,
.content-panel .k-filter-row th, .content-panel .k-grid-header th.k-header{
    color: #A4A7AE;
    font-size: 14px;
    font-weight: normal;
    text-align: left;
    display: inline-flex;
}
.content-panel .k-detail-row .k-grid-header th.k-header {
    width: 60%;
}

    .content-panel .k-detail-row .k-grid-header th.k-header:first-child {
        width: 40%;
    }

.main-panel .content-panel .k-detail-row .k-grid-header tbody td.k-header,
.main-panel .k-detail-row table tbody td {
    width: 60%;
}

    .main-panel .content-panel .k-detail-row .k-grid-header tbody td.k-header:first-child,
    .main-panel .k-detail-row table tbody td:first-child {
        width: 40%;
    }
/*.main-panel .k-detail-row .k-content {
    width: 450px;
}*/
.content-panel .k-grid-header th.k-header > .k-link,
.main-panel .k-grid-header th.k-header > .k-link {
    display: block;
    min-height: 18px;
    line-height: 18px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #A4A7AE;
}

.content-panel .k-widget, .main-panel .k-widget {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,0);
    width: 100%;
}

.content-panel .k-grid tbody td,
.main-panel table tbody td {
    border: 0;
    display: inline-flex;
    box-sizing: border-box;
    overflow: hidden;
    font-size: 14px;
    padding: 1.2rem 0.75rem;
}

.content-panel table caption,
.main-panel table caption {
    width: 100%;
    display: block;
}

.main-panel table.table-no-shadow tbody tr,
.content-panel table.table-no-shadow tbody tr {
    margin-bottom: 0;
}

.caption-center {
    text-align: center;
}

.main-panel table {
    border-spacing: 20px;
}

.main-panel table {
    /**box-sizing: border-box;*/
    padding: 0;
    border: 0;
    background: transparent;
}

    .content-panel .k-grid tbody td p,
    .main-panel table tbody td p {
        margin-bottom: 0;
    }

.main-panel div.k-grid-footer, .main-panel div.k-grid-header {
    /*padding-right: 17px;
    border-bottom-style: solid;
    border-bottom-width: 0;
    zoom: 1;*/
    background: #fff;
    background: transparent;
    padding-right: 0;
}

.main-panel .k-grid-header-wrap {
    border-color: transparent;
}

.content-panel .k-grid-header th.k-header, .content-panel .k-grid-header th.k-header:hover,
.main-panel .k-grid tr:hover {
    background: transparent;
    border: 0;
}

.main-panel table {
    border-spacing: 0;
}

.content-panel #myTab2.nav-tabs {
    background: #FFFFFF;
    border: none;
    box-sizing: border-box;
    border-radius: 30px;
    display: inline-flex;
    padding: 8px;
    /*height: 46px;*/
    margin-bottom: 20px;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.0831239);
}

.content-panel #myTab2.nav-tabs.old {
    border: 1px solid #B9B9B9;
    box-shadow: none;
    padding: 4px;
}

.content-panel .nav-tabs#myTab2.old .nav-link {
    padding: 0px 25px;
    color: rgba(43, 43, 43, 0.6);
}

.content-panel #myTab2.nav-tabs .nav-link.active, .content-panel #myTab2.nav-tabs .nav-item.show .nav-link {
    border: 0;
    background: transparent;
    /*padding: 2px;*/
    display: block;
    line-height: 26px;
    /*padding: 0 20px;*/
}
.content-panel .nav-tabs#myTab2 .nav-link {
    color: #41633B;
    font-size: 14px;
    border-radius: 20px;
    border: 0;
    line-height: 26px;
    padding: 5px 25px;
    font-family: 'philosopherregular';
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    cursor: pointer;
}
/*.content-panel .nav-tabs#myTab2 .nav-item:first-child {
    padding-left: 7px;
}
.content-panel .nav-tabs#myTab2 .nav-item:last-child {
    padding-right: 7px;
}*/

.content-panel #myTab2.nav-tabs .nav-link.active {
    background: #76A82F;
    border-radius: 52px;
    color: #fff;
}

h1::after {
    position: absolute;
    width: 54px;
    height: 0px;
    left: 0;
    bottom: -2px;
    height: 2px;
    background: #76A82F;
    content: "";
}

#myTabContent.tab-content > .tab-pane {
    border: 1px solid red;
    border-radius: 0 0 20px 20px;
    border-color: #fff #dee2e6 #dee2e6;
    padding: 10px;
}

.sidebar hr {
    border: 1px solid rgba(255, 255, 255, 0.56);
    width: calc(100% - 20px);
    margin-left: 10px;
    margin-top: 2rem;
}

#grid .k-grouping-header {
    display: none;
}

.content-panel .k-grid .k-grid-header {
    border: 0;
}

.panel-card, .card {
    background: #fff;
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.15);
    border-radius: 10px;
    padding: 15px;
    border: 0;
    margin-bottom: 20px;
}

.header-panel i {
    color: #A4A7AE;
    font-size: 20px;
}

    .header-panel i.icon-user {
        font-size: 30px;
        vertical-align: middle;
        display: inline-block;
    }

.header-panel .navbar-nav .nav-link {
    color: #373737;
    font-size: 13px;
    padding: 0 13px;
}

    .header-panel .navbar-nav .nav-link span.txt-item {
        display: inline-block;
        height: 30px;
        line-height: 34px;
        vertical-align: bottom;
    }

    .header-panel .navbar-nav .nav-link span.k-menu-expand-arrow {
        display: inline-block;
        vertical-align: bottom;
        margin-bottom: 0;
        padding: 15px;
        width: 18px;
        height: 10px;
        margin-left: 15px;
    }

        .header-panel .navbar-nav .nav-link span.k-menu-expand-arrow.k-i-arrow-60-down:before {
            background: url(../Images/chevron-1.png) no-repeat left top / 100% auto;
            width: 18px;
            height: 10px;
            content: "";
        }

.nav-right .navbar-nav li {
    border: 0 !important;
}

.nav-right .navbar-nav li ul {
    overflow: hidden !important;
}

/*.nav-right .navbar-nav li+li{
    margin-left: 20px;
}*/

.nav-right .navbar-nav#menu-top .dropdown-menu li{
    display: block;
    margin-right: 0;
}

.nav-right .navbar-nav li a {
    position: relative;
}

.nav-right .navbar-nav li .label {
    position: absolute;
    top: -23px;
    right: -15px;
    text-align: center;
    font-size: 12px;
    padding: 0;
    line-height: 18px;
    background: #76A82F;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    color: #fff;
}

.nav-right .navbar-nav li.notification {
    line-height: 40px;
    vertical-align: top;
}

.price-green {
    color: #76A82F;
    font-size: 20px;
}

.progress {
    background-color: #E3E4E7;
    border-radius: 12px;
    width: 80%;
    margin-left: 10%;
}

.progress-bar {
    background: #E3E4E7;
}

    .progress-bar.bg-green {
        background: #76A82F;
    }

.owl-nav button span {
    display: none;
}

.owl-theme .owl-nav {
    position: absolute;
    top: 30%;
    left: -15px;
    right: -18px;
}

.owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-prev:hover {
    background: url(../images/left.png) no-repeat;
    width: 60px;
    height: 60px;
    display: inline-block;
    float: left;
}

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-next:hover {
    background: url(../images/right.png) no-repeat;
    width: 60px;
    height: 60px;
    display: inline-block;
    float: right;
}

.owl-nav button {
    outline: none;
}

#carouselBankAccountList.carousel-compte .owl-item.active {
    border: 1.69537px solid #76A82F;
    border-radius: 10px;
}

#carouselBankAccountList.carousel-compte .owl-item.active + .owl-item.active {
    box-shadow: none;
    border: 0.847683px solid #DCDCDC;
}

#carouselBankAccountList.owl-carousel.owl-drag.virement-list .owl-item.active {
    opacity: 0.4;
}

#carouselBankAccountList.owl-carousel.owl-drag.virement-list .owl-item.active {
    /*border-width: 0;*/
}
#carouselBankAccountList.owl-carousel.owl-drag.virement-list .owl-item{
    cursor: pointer;
}
#carouselBankAccountList.owl-carousel.owl-drag.virement-list .owl-item.active.active-virement {
    opacity: 1;
    border-width: 1px;
    border-color: #76A82F;
}

.owl-carousel.owl-drag .owl-item.active + .owl-item.active {
    opacity: .3;
    border-width: 0px;
}

#carouselBankAccountList.virementCarousel .owl-item {
    border-width: 0;
    opacity: .4;
}

#carouselBankAccountList.virementCarousel .owl-item.activeVirement:not(.cloned) {
    border: 1.69537px solid #76A82F;
    opacity: 1;
    border-radius: 10px;
}

#carouselBankAccountList.carousel-compte.virementCarousel .owl-item.activeVirement:not(.cloned) {
    border-width: 1.69537px;
}

#carouselBankAccountList.carousel-compte.virementCarousel .owl-item {
    border-width: 0;
}

div#crediteAccount,
#debitedAccount, #benefAccount {
    display: flex;
}

    #crediteAccount .icon-Compte-credit,
    #benefAccount .icon-Compte-credit,
    #debitedAccount .icon-Compte-dbit {
        display: inline-block;
        line-height: 0.5;
        font-size: 40px;
        color: #76a82f;
        margin-left: -11px;
    }

    #crediteAccount .groupCredit,
    #benefAccount .groupCredit,
    #debitedAccount .groupDebit {
        display: inline-block;
    }

#detailVirement .groupCredit p,
#detailVirement .groupDebit p,
#virementAccount .groupCredit label,
#virementAccount .groupDebit label {
    margin-left: 0;
}

#menuConfig {
    position: absolute;
    z-index: 1000;
    display: none;
    float: left;
    padding: 0.5rem 0;
    margin: 0.125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.15);
    top: 17px;
    min-width: 70px;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    left: -65px;
    border-radius: 5px;
    background-color: #424242;
}

.menuRecipient {
    position: absolute;
    cursor: pointer;
    padding: 2px 5px;
}

.menuPhoneFavoriteNumber {
    position: absolute;
    cursor: pointer;
    padding: 2px 5px;
}
ul#menuConfig li {
    padding: 0 5px;
}

ul#menuConfig li a {
    color: #fff;
    font-size: 12px;
    padding: 5px;
}

ul#menuConfig li a:hover {
    text-decoration: none;
}

#cardcarousel.cartes .owl-item.active.active-card {
    opacity: 1;
}

#cardcarousel.cartes .owl-item.active {
    opacity: .3;
}

.owl-carousel.owl-drag .owl-item.active .graph-act {
    border-width: 1px;
    border-style: solid;
    border-color: #76A82F;
    border-radius: 10px;
}

.owl-carousel.owl-drag .owl-item.active + .owl-item.active .graph-act {
    /*border-width: 0;*/
    border: 0.847683px solid #DCDCDC;
}

.owl-carousel.owl-carousel2.owl-drag .owl-item.active + .owl-item.active {
    opacity: .4;
    transform: scale(0.8, 0.8);
}

#owl-carouselBankAccountList.owl-carousel.owl-drag.account-list .owl-item.active {
    opacity: 0.4;
}

#owl-carouselBankAccountList.owl-carousel.owl-drag.account-list .owl-item.active .graph-act {
    border-width: 0;
}

#owl-carouselBankAccountList.owl-carousel.owl-drag.account-list .owl-item.active.active-account {
    opacity: 1;
}

#owl-carouselBankAccountList.owl-carousel.owl-drag.account-list .owl-item.active.active-account .graph-act {
    border-width: 1px;
    border-color: #76A82F;
}

.carousel-cartes {
    width: 95%;
}

.owl-carousel.owl-carousel2 .owl-nav button.owl-prev,
.owl-carousel.owl-carousel2 .owl-nav button.owl-next {
    display: none;
}

.tooltip-1 {
    background: url(../images/T1.png) no-repeat;
    width: 80px;
    height: 53px;
    display: inline-block;
    text-align: center;
    padding-top: 20px;
    font-family: 'montserratregular';
    font-style: normal;
    font-weight: 600;
    font-size: 10px;
    line-height: 12px;
    color: #373737;
    opacity: 0.5;
    margin: 10px 20px 0 25%;
}

.tooltip-2 {
    background: url(../images/T2.png) no-repeat;
    width: 80px;
    height: 53px;
    display: inline-block;
    text-align: center;
    padding-top: 14px;
    font-family: 'montserratregular';
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #fff;
    margin: 10px 0 0;
}

.txt-progress {
    font-family: 'montserratregular';
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 15px;
    padding: 0 25px;
}

.txt-progress span {
    display: inline-block;
    width: 50%;
    text-align: left;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 15px;
    color: #BDBDBD;
    font-family: "Montserratbold";
    float: left;
    height: 22px;
    margin-top: 8px;
}

.txt-progress span + span {
    text-align: right;
}

.menu-panel {
    background: #fff;
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.15);
    border-radius: 16px;
    padding: 10px 15px;
    border: 0;
    margin-bottom: 20px;
    min-height: 50px;
}

.menu-panel h2 {
float: left;
}

.menu-panel .navbar-nav {
display: block;
/*margin-top: -5px;*/
}

.menu-panel .navbar-nav li {
float: left;
margin-right: 15px;
}

.menu-panel .navbar-nav li a {
color: #41633B;
font-style: normal;
font-weight: normal;
font-size: 15px;
line-height: 17px;
font-family: 'philosopherregular';
padding: 0;
}

.menu-panel .navbar-nav li a i {
    font-size: 30px;
    vertical-align: middle;
}

#chart1, #chart2, .graph-carte {
    height: 90px;
    background: #fff;
    border: 0;
    overflow: hidden;
}
/*#graphe-activite {
    height: 150px;
    overflow: hidden;
}
#chartActivity {
    height: 150px !important;
}*/
.carousel-cartes .owl-carousel .owl-stage-outer {
    padding: 30px 28px;
    margin: 0 -30px;
}

.carousel-cartes .k-content,
.slick-comptes .k-content {
    background-color: transparent;
    padding-top: 80px;
}

.graph-act {
    position: relative;
    background: #fff;
    /*box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.15);*/
    border-radius: 10px;
    padding: 10px;
    border: 0.847683px solid #DCDCDC;
    cursor: pointer;
}
.owl-carousel.owl-drag .owl-item.active .graph-act {
box-shadow: 0px 11.24px 23.72px rgba(67, 81, 91, 0.3);
}
.owl-carousel.owl-drag .owl-item.active + .owl-item.active .graph-act {
    box-shadow:none;
}
#owl-carouselBankAccountList.account-list.owl-carousel.owl-drag .owl-item.active-account .graph-act {
    box-shadow: 0px 11.24px 23.72px rgba(67, 81, 91, 0.3);
}
#owl-carouselBankAccountList.account-list.owl-carousel.owl-drag .owl-item:not(.active-account) .graph-act {
    box-shadow: none;
    border: 0.847683px solid #DCDCDC;
}
.data-chart {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 20;
    right: 10px;
}

.data-chart h2 {
    background: #F2F5ED;
    border-radius: 90px;
    padding: 4px 20px;
    font-style: normal;
    font-weight: bold;
    font-size: 15px;
    line-height: 23px;
    color: #41633B;
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.carousel-cartes p,
.slick-comptes p {
    margin-bottom: 5px;
}

.price-charte {
    font-style: normal;
    font-weight: bold;
    font-size: 24.9796px;
    line-height: 30px;
    color: #76A82F;
    font-family: "Montserratbold";
}

#virementAccount {
    border: 1px solid #DEDEDE;
    box-sizing: border-box;
    border-radius: 12px;
    padding: 15px 30px;
    margin-bottom: 15px;
}


div#crediteAccount {
    margin-top: 15px;
}

div#benefAccount {
    border-bottom: 1px solid #D6D6D6;
    margin-top:15px;
}

div#virementAccount label {
    font-family: "Philosopher";
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 18px;
    color: rgba(55, 55, 55, 0.5);
    margin-left: 20px;
    display: block;
    margin-bottom: 5px;
    opacity: 1;
}

.card .form-popin label {
    margin-left: 20px;
}

.card .form-popin label:first-child {
    font-family: "Philosopher";
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    display: block;
    margin-bottom: 5px;
    line-height: 23px;
}

div#virementAccount label#label_creditedAccountName,
div#virementAccount label#label_beneficiaire,
div#virementAccount label#label_numero,
div#virementAccount label#label_debitedAccountName {
    font-family: "montserratregular";
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 18px;
    color: #373737;
}

div#virementAccount label#label_creditedAccountRib,
div#virementAccount label#label_debitedAccountRib {
    font-family: "montserratregular";
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 17px;
    color: #A4A7AE;
}

div#virementAccount label#label_debitedAccountRib {
    margin-bottom: 0;
}

div#debitedAccount {
    border-bottom: 1px solid #D6D6D6;
}

#myModal input.btn, #myModal button.btn {
    margin-top: 10px;
    width: 100%
}
#myModalDelete input {
    margin-top: 10px;
    width: 100%;
}

#montantVerminet label,
#motifVerminet label {
    display: block;
    font-family: "Philosopher";
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 23px;
    opacity: 0.5;
    margin-bottom: 0;
    color: #373737;
}

    #montantVerminet label#label_amount {
        font-family: "montserratregular";
        font-style: normal;
        font-weight: bold;
        font-size: 28px;
        line-height: 34px;
        color: #76A82F;
        opacity: 1;
    }

#montantVerminet label#label_amount sup {
        font-family: 'montserratregular';
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    top: -1em;
}

    #montantVerminet label#label_amount_debiter {
        font-family: "montserratregular";
        font-style: normal;
        font-weight: bold;
        font-size: 28px;
        line-height: 34px;
        color: #76A82F;
        opacity: 1;
    }

        #montantVerminet label#label_amount_debiter sup {
            font-family: 'montserratregular';
            font-style: normal;
            font-weight: 500;
            font-size: 15px;
            line-height: 18px;
            top: -1em;
        }

#detailVirement p {
    font-family: "Philosopher";
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 18px;
    margin-left: 20px;
    display: block;
    margin-bottom: 5px;
}

#detailVirement p:first-child {
    color: rgba(55, 55, 55, 0.5);
}

#virementAccount #credName,
#virementAccount #debName {
    font-family: "montserratregular";
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 18px;
    color: #373737;
}

#detailVirement #virementAccount .form-group {
    margin-top: 0;
    margin-bottom: 15px !important;
}

#detailVirement #virementAccount div#debitedAccount {
    margin-bottom: 0 !important;
}

#detailVirement .form-group {
    margin-top: 15px;
    margin-bottom: 15px !important;
}

#detailVirement #reference, #detailVirement #reason {
    font-family: "montserratregular";
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    color: #373737;
}

div#montantVerminet {
    margin-top: 15px;
}

div#frequency_layout {
    margin-top: 15px;
}

label#label_motif,
label#label_frequency,
label#label_name {
    font-family: "montserratregular";
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 18px;
    color: #373737;
    margin-bottom: 0;
    opacity: 1;
}
#motifVerminet {
    margin-top: 15px;
}
#confirm_password {
    margin-top: 60px;
}
#confirm_password LABEL {
    border: 1px solid #76a82f;
    box-sizing: border-box;
    border-radius: 12px;
    padding: 15px;
    margin-left: 0;
}
#myModal .form-popin label {
    /*opacity: 1;*/
    display: block;
}

#montantVerminet #amount {
    font-family: "Montserratbold";
    font-style: normal;
    font-weight: bold;
    font-size: 28px;
    line-height: 34px;
    color: #76A82F;
}

#detailVirement #reference, #detailVirement #reason {
    font-family: "montserratregular";
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 18px;
    color: #373737;
}

#detailVirement #date {
    font-family: "montserratregular";
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 18px;
    color: #373737;
}

label#label_startDate,
label#label_endtDate {
    font-family: "montserratregular";
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 18px;
    color: #373737;
    display: inline-block;
    max-width: 40%;
    opacity: 1;
}

label#label_reason {
    opacity: 1;
    font-weight: 600;
}

label#label_endtDate {
    margin-left: 1ch;
}

label#label_startDate {
    margin-left: 35px;
}

.txt-ch {
    opacity: 0.67;
    color: #8B8B8B;
    font-size: 14px;
    line-height: 17px;
}

.k-chart svg {
    /*opacity: 0.3;*/
}

#gauge-container {
    width: 200px;
    height: 200px;
    text-align: center;
    margin: 0 auto 30px auto;
}

#gauge {
    width: 220px;
    height: 220px;
    margin: 0 auto 0;
}

.customer-photo {
    display: inline-block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-size: 32px 35px;
    background-position: center center;
    vertical-align: middle;
    line-height: 32px;
    box-shadow: inset 0 0 1px #999, inset 0 0 10px rgba(0,0,0,.2);
    margin-left: 5px;
}

.customer-name {
    display: inline-block;
    vertical-align: middle;
    line-height: 32px;
    padding-left: 3px;
}

.k-menu .k-item, .k-menu.k-header {
    border-color: #c5c5c5;
}

.card-compte #menu {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #ccc;
    border-radius: 0;
}

.card-compte #menu a {
font-style: normal;
font-size: 12px;
line-height: 15px;
color: #A4A7AE;
position: relative;
}

.card-compte #menu a::after {
    bottom: 0;
    left: 10px;
    right: 10px;
    height: 2px;
    background: #76A82F;
    content: "";
    display: none;
    position: absolute;
}

.card-compte #menu li a:hover::after,
.card-compte #menu > #menu_mn_active > a:after {
    display: block;
}

.card-compte #menu li li a:hover::after {
    display: none;
}

.card-compte .k-widget.k-menu-horizontal > .k-item {
    border: 0;
}

.card-compte #menu li {
    float: right;
    color: #A4A7AE;
    font-size: 12px;
    line-height: 15px;
}

.card-compte #menu > li:first-child {
    float: left;
    font-weight: bold;
    font-size: 13px;
    line-height: 17px;
}

.card-compte #menu li li, .ligne #menu li li:first-child {
    float: none;
}

.card-compte #menu > li a:hover, .card-compte #menu #menu_mn_active {
    background: transparent;
    border-bottom-color: #76A82F;
}

.card-compte #menu li li a:hover {
    color: #76A82F;
}

.card-compte .k-draghandle:hover,
.card-compte .k-listbox .k-item:hover:not(.k-state-disabled),
.card-compte .k-pager-wrap .k-link:hover,
.card-compte .k-state-hover,
.card-compte div.k-filebrowser-dropzone em.k-draghandle:hover,
.card-compte .k-listbox .k-item:hover:not(.k-state-disabled),
.card-compte .k-pager-wrap .k-link:hover,
.card-compte .k-state-hover,
.card-compte div.k-filebrowser-dropzone em {
    background: transparent;
}




.content-panel #grid {
    /*background: transparent;*/
    border: 0;
}

/******* Devis List *******/
.table-convertisseur caption {
    display: none !important;
}

.table-striped.table-convertisseur {
    margin-bottom: 0;
}

    .table-striped.table-convertisseur tbody tr:nth-of-type(odd) {
        background: transparent;
    }

.table-convertisseur p {
    margin-bottom: 0;
}

.card-conv {
    margin-bottom: 50px;
}

.table th, .table td {
    border: 0 !important;
}

.main-panel table.table-no-shadow tbody tr, .content-panel table.table-no-shadow tbody tr {
    background: #FFF !important;
    box-shadow: 0px 5px 8px 0px rgba(0,0,0,0);
    border-radius: 0;
    overflow: hidden;
    display: table-row;
    width: 100%;
}

    .main-panel table.table-no-shadow thead th, .content-panel table.table-no-shadow thead th,
    .main-panel table.table-no-shadow tbody tr td, .content-panel table.table-no-shadow tbody tr td {
        display: table-cell;
    }

.main-panel .k-block, .main-panel .k-widget, .content-panel .k-block, .content-panel .k-widget {
    background: transparent;
    border: 0;
}

.main-panel .k-grid td, .content-panel .k-grid td {
    padding: 0.75rem;
}

.main-panel .k-filter-row th, .main-panel .k-grid-header th.k-header,
.content-panel .k-filter-row th, .content-panel .k-grid-header th.k-header {
    padding: 0.75rem;
}

.panel-footer a {
    margin-right: 10px;
}

/******** Formulaire ********/
.form-control,
.k-widget.k-dropdown .k-dropdown-wrap,
.k-widget.k-datepicker .k-picker-wrap,
.text-box {
    background: #fff;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
    border-radius: 25px !important;
    padding: 2px 15px;
    border: 0;
    height: 45px;
    font-size: 15px;
    width: 100%;
    color: #373737;    
}

.modal-body .form-control {
    font-weight: 600;
}

select#categoryname {
    font-weight: 600;
}

.k-widget.k-dropdown .k-dropdown-wrap {
    background: #fff url(../Images/chevron-2.png) no-repeat right center !important;
    width: calc(100% - 28px);
    height: 41px;
}

.k-widget.k-datepicker .k-picker-wrap {
    padding: 0 15px;
    width: calc(100% - 30px);
}

    .k-widget.k-datepicker .k-picker-wrap .k-i-calendar {
        margin-top: 5px;
        margin-right: 2px;
    }

    .k-widget.k-datepicker .k-picker-wrap input {
        margin-top: 5px;
    }

.k-picker-wrap.k-state-default .k-input {
    box-shadow: inset 0 1px 1px rgba(0,0,0,0);
    text-indent: 0;
}

.k-widget.k-dropdown .k-dropdown-wrap .k-i-arrow-60-down:before {
    display: none;
}

.k-animation-container .k-list-container {
    border-color: #80bdff !important;
    background-color: #fff !important;
}

.k-animation-container .dropdown-header.k-header {
    display: none !important;
}

.k-multiselect-clearable .k-multiselect-wrap {
    background: #fff;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
    border-radius: 25px !important;
    padding: 0 15px;
    border: 0;
    min-height: 45px;
    font-size: 15px;
    width: 100%;
    color: #373737;
    background: #fff url(../Images/chevron-2.png) no-repeat right center !important;
}

    .k-multiselect-clearable .k-multiselect-wrap ul {
        padding-top: 5px;
    }

#cards-list .k-form-control, .card-request .form-control {
    width: 60%;
}

textarea {
    min-height: 100px;
}

.btn, .k-button, .keypad-connect, .keypad-clear {
    background: #76A82F;
    border-radius: 25px !important;
    padding: 0 20px;
    color: #fff;
    font-size: 15px;
    height: 45px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
    line-height: 45px;
    border: 0;
    font-family: "philosopherbold";
}
.btn-cancel {
    background: #EAEAEA !important;
    color: #373737 !important;
}

.keypad-clear {
    background: #EAEAEA;
    color: #373737;
    margin-bottom: 10px !important;
}

.keypad-clear, .keypad-connect {
    width: calc(100% - 6px);
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25) !important;
}

.btn-details {
    border: 0;
    background: transparent;
    padding: 0;
}

select, .select2.select2-container {
    /* Appearance will hide the default arrow */
    /* But kind of quirky and best to include the browser prefix */
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: #fff url(../Images/chevron-2.png) no-repeat right center !important;
    background: #fff;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
    border-radius: 25px !important;
    padding: 5px 15px;
    border: 0;
    height: 45px;
    font-size: 15px;
    width: 100%;
    color: #373737;
    padding-right: 30px !important;
}

[type="radio"]:checked,
[type="radio"]:not(:checked) {
    /*position: absolute;
    left: -9999px;
    opacity: 0;*/
    height: 20px;
    width: 20px;
    position: relative;
    z-index: 5;
    margin-right: 5px;
}

[type="checkbox"]:checked,
[type="checkbox"]:not(:checked) {
    /*position: absolute;
    left: -9999px;
    opacity: 0;*/
    height: 20px;
    width: 20px;
    position: relative;
    z-index: 5;
    margin-right: 5px;
}

input[type="radio"] + label + input[type="radio"] {
    margin-left: 20px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 38px;
}

.select2-container--default .select2-selection--single {
    border: 0;
}

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 36px;
        width: 36px;
        opacity: 0;
    }

.custom-control-label::before {
    height: 1.5rem;
    width: 1.5rem;
}

.custom-switch .custom-control-label::after {
    top: calc(0.25rem + 2px);
    left: calc(-2.25rem + 2px);
    width: calc(1.5rem - 4px);
    height: calc(1.5rem - 4px);
    border-radius: 1rem;
}

.custom-switch .custom-control-label::before {
    left: -1.75rem;
    width: 2.75rem;
    border-radius: 1rem;
}

.custom-switch .custom-control-label::after {
    top: calc(0.25rem + 2px);
    left: calc(-1.75rem + 2px);
    width: calc(1.5rem - 4px);
    height: calc(1.5rem - 4px);
    border-radius: 1rem;
}

.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    background-color: #fff;
    -webkit-transform: translateX(1.25rem);
    transform: translateX(1.25rem);
}

.custom-switch {
    width: 2.75rem;
    padding-left: 0;
}




/*[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
    margin-left: -20px;
}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 1px solid #ddd;
    border-radius: 100%;
    background: #fff;
}
[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: #F87DA9;
    position: absolute;
    top: 4px;
    left: 4px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}*/
/*.k-widget.k-multiselect.form-control {
    height: auto;
    min-height: 45px; 
}*/
.form-group {
    margin-bottom: 20px !important;
}

.form-inline button + button {
    margin-left: 10px;
}

.form-popin .form-group {
    margin-bottom: 30px !important;
}

.form-popin label {
    color: #373737;
    opacity: 0.5;
}

.form-popin .form-group p {
    margin-bottom: 5px;
}

.form-popin .form-group .row-label > div {
    position: relative;
}

.form-popin .form-group .row-label label {
    position: absolute;
    left: 32px;
    top: 12px;
    font-size: 14px;
}

.form-popin .form-group .row-label input {
    padding-left: 66px;
    font-size: 14px;
}

.form-popin .form-control:disabled,
.form-popin .form-control[readonly] {
    background: #fff;
}

.form-popin .widget-header .title {
    color: #41633B;
    font-size: 20px;
    line-height: 22px;
}

    .form-popin .widget-header .title i {
        font-size: 34px;
        color: #76A82F;
    }

    .form-popin .widget-header .title .title-popin {
        vertical-align: top;
        display: inline-block;
        line-height: 40px;
    }

.form-popin .form-submit {
    text-align: center;
}

    .form-popin .form-submit .btn {
        margin: 0 5px;
    }

.form-popin span.text-danger {
    font-size: 11px;
    line-height: 14px;
    display: block;
    margin-top: 10px;
}
/*******/
.content-panel .k-grid tbody td.text-center, .main-panel table tbody td.text-center,
.content-panel .k-grid thead th.text-center, .main-panel table thead th.text-center {
    align-items: center;
    justify-content: center;
}

table th.text-right, table td.text-right {
    align-items: flex-end;
    justify-content: flex-end;
}

#pagin {
    margin-top: 30px;
}

    #pagin .pagenumber {
        display: inline-block;
    }

    #pagin .pagination-container {
        float: right;
    }

        #pagin .pagination-container .pagination li {
            display: inline-block;
            margin: 0 5px;
        }

#cardsLifting-list {
    width: 100%;
}

    #cardsLifting-list k-form-control {
        width: calc(60% + 30px);
    }

    #cards-list > ul, #cardsLifting-list ul {
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
    }

        #cards-list > ul li, #cardsLifting-list > ul li {
            list-style: none;
            margin-bottom: 15px;
            text-align: center;
            position: relative;
            width: 100%;
            padding-right: 15px;
            padding-left: 15px;
        }

    #cards-list h3, #cardsLifting-list p {
        font-size: 14px;
    }

.k-pager-wrap .k-link:hover,
.k-pager-wrap .k-link.k-state-selected {
    color: #000;
    height: 37px;
    border-color: #d5d5d5;
}

.k-grid-pager .k-widget.k-dropdown .k-dropdown-wrap {
    height: 31px;
    line-height: 17px;
    padding-top: 0;
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.25);
}

.thumbnail {
    border: 2px solid transparent;
    padding: 10px 10px 5px;
    border-radius: 7px;
}

    .thumbnail.selected {
        border-color: #76A82F;
    }
/*.modal-open {
    position: relative;
    z-index: 1;
}
.modal-open > div {
    position: static;
}*/
.color-compte {
    display: block !important;
}

    .color-compte td div {
        border-radius: 5px;
        overflow: hidden;
    }

html .k-grid-edit-row .k-widget.k-tooltip {
    background-color: rgba(255, 255, 255, 1);
    border: 1px solid #ccc;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.25);
    color: #A4A7AE;
    font-size: 12px;
    padding: 10px;
}

.line {
    margin-bottom: 10px;
}

/********* Modal *********/
.modal.show .modal-dialog .modal-content {
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.35);
    border-radius: 20px;
    border: 0;
}
.modal.show.right .modal-dialog .modal-content {
    border-radius: 20px 0 0 20px;
}

.modal-header .close {
    position: absolute;
    right: 7px;
    top: 0px;
    font-size: 30px;
}
.modal.left .modal-content, .modal.right .modal-content {
    height: 100%;
    overflow-y: auto;
}
.moda.left .modal-dialog, .modal.right .modal-dialog {
    position: fixed;
    margin: auto;
    height: 100%;
    -webkit-transform: translate3d(0%,0,0);
    -ms-transform: translate3d(0%,0,0);
    -o-transform: translate3d(0%,0,0);
    transform: translate3d(0%,0,0);
}
.modal.right.fade .modal-dialog {
    right: 0;
    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
    -o-transition: opacity 0.3s linear, right 0.3s ease-out;
    transition: opacity 0.3s linear, right 0.3s ease-out;
}

.keypad-popup {
    z-index: 101545;
    box-shadow: 0px 5px 8px rgba(0, 0, 0, 0.35);
    border-radius: 12px;
    /*padding: 2px;*/
    padding: 5px;
    width: 331px !important;
}
/*.pageLogin .keypad-popup {
    width: 331px !important;
    padding: 5px;
}*/

.keypad-row button {
    border: 0;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.65);
    border-radius: 3px;
    margin: 3px;
}
.keypad-row button:focus {
    border: 0;
    outline: none;
}

.keypad-row {
    padding: 6px;
}

.keypad-key {
    margin: 5px !important;
    width: 33.8px;
    font-style: normal;
    font-weight: bold;
    font-size: 24px;
    line-height: 23px;
    color: #41633B;
    height: 60px;
    background: linear-gradient(180deg, #FFFFFF 33.33%, #EAEFF0 100%) !important;
    box-shadow: 0px 7px 11px rgba(0, 0, 0, 0.19) !important;
    border-radius: 8px !important;
}

.keypad-key[disabled] {
    border: none;
    cursor: inherit;
}

.form-group {
    position: relative;
}

.form-group .keypad-trigger, .form-popin .keypad-trigger {
    position: absolute;
    right: 10px;
    top: 5px;
    left: 5px;
    width: 320px;
    opacity: 0;
}

.content-login {
    background: #fff;
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.15);
    border-radius: 10px;
    padding: 0 15px;
    border: 0;
    margin-bottom: 20px;
    max-width: 800px;
    margin: 0 auto;
}

.banque-en-ligne .alert-danger {
    font-size: 10px;
}


.top-login {
    max-width: 800px;
    margin: -95px auto 20px;
}

    .top-login .pull-left {
        float: left;
    }

        .top-login .pull-left img {
            width: 130px;
            padding-top: 10px;
        }

    .top-login .pull-right {
        float: right;
    }

        .top-login .pull-right img {
            width: 200px;
        }

.content-login .col-lg-6:first-child {
    border-right: 1px solid #ccc;
}

.content-login .form-inline .form-control,
.content-login .form-inline .btn {
    width: 100%;
}

.content-login .form-inline .form-control {
    padding-left: 40px;
}

.content-login .form-inline .form-group {
    display: block;
    width: 100%;
}

.content-login .form-inline .form-captcha input {
    width: calc(100% - 112px);
    display: inline-block;
    padding-left: 15px;
}

.content-login .form-captcha .header_captcha {
    display: inline-block;
}

.LBD_CaptchaDiv > div {
    display: inline-block;
}

.LBD_CaptchaIconsDiv {
    padding-left: 8px;
}

.col-login {
    padding: 50px 40px;
}

.informationIcons {
    vertical-align: middle;
}

    .informationIcons a {
        background: #468847;
        border-radius: 7px !important;
        padding: 5px 10px 8px 5px;
    }

        .informationIcons a:hover {
            color: transparent;
        }

        .informationIcons a + a {
            margin-left: 10px;
        }

    .informationIcons i {
        font-size: 24px;
        color: #fff;
        vertical-align: middle;
        margin-right: 5px;
    }

    .informationIcons span {
        font-size: 13px;
        vertical-align: middle;
        color: #fff;
    }

.brand_logo {
    text-align: center;
    margin-bottom: 30px;
}

    .brand_logo img {
        width: 150px;
        display: inline-block;
    }

p.adresse-bottom {
    font-size: 12px;
    border-top: 1px solid #ccc;
    padding-top: 10px;
}

.content-left {
    padding-top: 40px;
    height: 320px;
}

.informationIcons {
    padding-top: 20px;
    padding-bottom: 10px;
}

.form-user i, .form-password i {
    position: absolute;
}

.form-user i {
    left: 12px;
    top: 9px;
    font-size: 20px;
}

.form-password i {
    left: 12px;
    top: 9px;
    font-size: 20px;
}

.ui-widget.ui-widget-content {
    z-index: 5 !important;
}

.btn-extract button span {
    display: inline-block;
    vertical-align: middle;
}

.btn-extract .btn {
    line-height: 40px;
}
input:focus {
    outline: none !important;
}

/******************/
.sidebar .navbar-nav li {
    display: block;
    float: none;
}

#navbarResponsive {
    height: 100vh;
}

.small-screen .navbar-nav.flex-column {
    height: 318px;
    overflow: hidden;
    display: block;
}
.Xlarge-screen .navbar-nav.flex-column {
    height: 318px;
    overflow: hidden;
    display: block;
}

.navbar-nav.navbar-fixed-bottom {
    position: absolute;
    bottom: 110px;
    left: 0;
    right: 0;
    display: block;
}

.navbar-nav.navbar-fixed-bottom:before {
    width: 80%;
    /*margin-left: 10%;*/
    content: "";
    height: 1px;
    background: #fff;
    margin-bottom: 7px;
    display: inline-block;
}

.li_dropdown a {
    padding-bottom: 20px !important;
}

.t1 {
    display: inline-block;
    margin: 2px auto;
    width: 20px;
    font-size: 12px;
    height: 10px;
    position: absolute;
    left: calc(50% - 10px);
    top: 320px;
    font-size: 14px;
    color: #fff;
    cursor: pointer;
}

.t2 {
    display: inline-block;
    margin: 2px auto;
    width: 20px;
    font-size: 12px;
    display: none;
    height: 10px;
    position: absolute;
    left: calc(50% - 10px);
    top: 320px;
    font-size: 14px;
    color: #fff;
    cursor: pointer;
}

.cards {
    margin-bottom: 20px;
}

    .cards img {
        box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.15);
    }

.price-g {
    font-size: 19px;
    font-weight: bold;
}

.row2 {
    padding-left: 10px;
}

.row1 {
    padding-right: 10px;
}

.title-left {
    float: left;
    margin-top: 10px;
}

.search-right {
    float: right;
    margin-bottom: 30px;
    position: relative;
}

.btn-rech {
    background: #fff;
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.15);
    border-radius: 20px;
    padding: 6px 15px;
    border: 0;
    color: #41633B;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 17px;
    font-family: 'philosopherregular';
}

    .btn-rech i {
        font-size: 26px;
        vertical-align: middle;
    }

.title-plafond {
    background: #F2F5ED;
    border-radius: 20px;
    padding: 4px 20px;
    font-style: normal;
    font-weight: bold;
    font-size: 15px;
    line-height: 23px;
    color: #41633B;
    display: block;
    text-align: center;
    margin-bottom: 15px;
}

.bar {
    color: #a4a7ae;
}

.bar2 {
    border-left: 1px solid #ccc;
    color: #76a62f;
}

.graph-carte > div {
    margin-top: 10px;
}

.menu-cartes {
    margin: 0 0 20px 0;
    padding-left: 0;
}

    .menu-cartes li {
        display: inline-block;
        list-style: none;
        width: 30%;
        height: 120px;
        background: #fff;
        box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.15);
        border-radius: 10px;
        padding: 15px;
        border: 0;
        margin-bottom: 20px;
        margin-right: 20px;
        position: relative;
        padding-top: 80px;
        font-size: 18px;
    }

        .menu-cartes li a {
            color: #76A82F;
        }

        .menu-cartes li i {
            position: absolute;
            right: 20px;
            top: 20px;
            font-size: 60px;
        }

.top-benef h2, .card-emetteur h2 {
    background: #F2F5ED;
    border-radius: 30px;
    padding: 4px 20px;
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    line-height: 26px;
    color: #41633B;
    display: block;
}

.line-benef {
    /*display: flex;*/
    height: 50px;
    font-size: 14px;
}

    .line-benef > div {
        float: left;
    }

.letter-name {
    width: 40px;
    padding: 0 3px;
    background: #F2F5ED;
    border-radius: 30px;
    text-align: center;
    line-height: 40px;
    height: 40px;
}

.line-benef > div:nth-child(2) {
    padding: 3px 10px;
    width: calc(60% - 42px);
}

.line-benef > div:last-child {
    padding: 3px 10px;
    width: 40%;
    text-align: right;
}

.top-benef select {
    margin-bottom: 10px;
    width: 110px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0);
}

.card-emetteur h3 {
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    line-height: 26px;
    display: block;
    font-family: 'philosopherregular';
    margin-bottom: 2px;
}

.carousel-comptes-inclure .item:hover {
    cursor: default;
}

.info-compte h3 {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.info-compte p:hover, .info-compte h3:hover {
    cursor: default;
}

.btn2 {
    color: #76A82F;
    background: #fff;
    font-size: 30px;
    padding: 0;
    width: 45px;
    text-align: center;
    margin-left: 10px;
}

.pull-left {
    float: left;
}

.pull-right {
    float: right;
}

.content-virement {
    /*width: 75%;*/
    padding: 0 40px;
}

.custom-switch .custom-control-label::after {
    background: #fff;
}

.custom-switch .custom-control-label::before {
    background: #adb5bd;
}

.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: #76a62f;
    background-color: #76a62f;
}

.ajouter {
    color: #8B8B8B;
    vertical-align: top;
    font-size: 13px;
}

    .ajouter i {
        font-size: 30px;
        line-height: 24px;
    }

    .ajouter:hover {
        text-decoration: none;
    }

    .ajouter span {
        text-decoration: underline;
        vertical-align: top;
    }

.card-emetteur label {
    color: #8B8B8B;
    margin-bottom: 15px;
    font-size: 15px;
}

.card-emetteur p.txt-ch {
    margin-bottom: 5px;
}

.carousel-compte .carte-emet {
    position: relative;
    background: #fff;
    border-radius: 10px;
    padding: 15px;
    /*box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.15);*/
}

.carousel-compte.owl-carousel.owl-drag .owl-item.active {
    box-shadow: 0px 11.24px 23.72px rgba(67, 81, 91, 0.3);
}

.carousel-compte.owl-carousel.owl-drag .owl-item.active + .owl-item.active {
    border: 1px solid #373737;
    /*box-shadow: 0px 2px 15px rgba(0, 0, 0, 0);*/
}
/*.carousel-compte.owl-carousel.owl-drag .owl-item.active.selected {
    box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2);
}
.carousel-compte.owl-carousel.owl-drag .owl-item.active:not(.selected) {
    border: 1px solid #373737;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0);
}*/
.carousel-compte.owl-carousel .owl-stage-outer {
    padding: 20px 30px 30px 30px;
    margin: 0 -30px;
}

.card-emetteur p.price-charte {
    margin-bottom: 0;
}

.table-benef td:first-child {
    padding: 0.75rem 0;
}

.label-title {
    font-family: 'philosopherregular';
    font-weight: 500;
    font-size: 17px;
}

.montant {
    font-weight: bold;
    font-size: 24.9796px;
}
.left-montant {
    float: left;
    width: calc(100% - 130px);
}

.left-montant-recharge {
    float: left;
    width: calc(100% - 130px);
}

#carouselBankAccountList {
    /*margin-bottom: 20px;*/
    padding: 0 25px;
}

.pull-right .btn2 + .btn2 {
    margin-left: 8px;
}

.card-depense img {
    width: 100%;
    height: auto;
}

.div-search {
    position: relative;
}

.div-search i, .search-right > i {
    position: absolute;
    left: 8px;
    top: 3px;
    font-size: 24px;
    color: #A4A7AE;
}

.div-search input, .search-right > input {
    padding-left: 35px;
    height: 30px;
    font-size: 12px;
    width: 140px;
    font-weight: 500;
    font-family: 'montserratregular';
}

.card-depense img {
    webkit-filter: grayscale(1);
    -moz-filter: grayscale(1);
    -o-filter: grayscale(1);
    -ms-filter: grayscale(1);
    filter: grayscale(1);
    filter: gray;
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
    max-height: 250px;
}

#owl-carouselBankAccountList {
    margin-bottom: 30px;
    padding: 0 30px;
}

.item-carte {
    position: relative;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.info-carte {
    position: absolute;
    left: 11%;
    top: 52%;
    z-index: 10;
}
#cardcarousel .info-carte {
    font-size: 18px;
}
.item-carte .num-carte {
    color: #fff;
    font-size: 20px;
    /*margin-left: 10px;*/
    margin-top: 2px;
    font-weight: 600;
    text-transform: uppercase;
}

.item-carte .num-cp {
    color: #fff;
    font-size: 8px;
    margin: -2px 0 0 10px;
}

.item-carte .date-exp-carte {
    color: #fff;
    font-size: 11px;
    margin-left: 6px;
    text-align: right;
    margin-right: 7ch;
}
.item-carte .exp-carte {
    padding-right: 8px;
    color: #fff;
    font-size: 8px;
    font-weight: 600;
    text-transform: uppercase;
    tab-size: 2;
}
.item-carte .nom-carte {
    color: #fff;
    font-size: 9px;
    /*margin-left: 10px;*/
    margin-top: -1px;
    font-weight: 600;
    text-transform: uppercase;
}
/*#Cardlist .info-carte {
    -moz-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    -o-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
}*/

.pos {
    font-style: normal;
    font-weight: bold;
    /*font-size: 24.9796px;
    line-height: 30px;*/
    color: #76a82f;
}

#Cardlist {
    /*margin-bottom: 10px;*/
}

.fa-credit-card, .icon-operations-carte {
    margin-top: 3px;
}

.menu-panel .navbar-nav li a i.icon-financement {
    font-size: 22px;
    line-height: 30px;
}

.card-depense {
    display: block;
}

.retour {
    color: #A4A7AE;
    font-family: philosopherregular;
    margin: 5px 0 30px;
    display: inline-block;
}

    .retour:hover {
        color: #76A82F;
        text-decoration: none;
    }
/*
.mobile-screen .navbar-nav.flex-column {
    display: none;
    position: fixed;
    background: #000;
    left: 110px;
    top: 0;
    width: 220px;
    bottom: 0;
    z-index: 999999999999999999999999;
}

    .mobile-screen .navbar-nav.flex-column.show {
        display: block !important;
        padding-top: 20px;
    }

.mobile-screen .sidebar .navbar-nav.flex-column .nav-link i {
    font-size: 30px;
    display: inline-block;
    line-height: 20px;
    vertical-align: middle;
}

.mobile-screen .sidebar .navbar-nav.flex-column .nav-link {
    font-weight: 400;
    font-size: 15px;
    line-height: 20px;
    text-align: left;
    color: #fff;
    padding: 8px 5px;
    position: relative;
}*/
.mobile-screen .sidebar .navbar-nav .nav-link:hover, .mobile-screen .sidebar .navbar-nav .nav-link.active {
    background: transparent;
}

.navbar-light .navbar-toggler {
    color: rgba(0, 0, 0, 0.5);
    border-color: rgba(255, 255, 255, 0.3);
    display: none;
}

.top-card-package {
    position: relative;
    margin-bottom: 30px;
}

.type-package {
    border-radius: 20px;
    position: absolute;
    background: red;
    color: white;
    padding: 0 20px;
    line-height: 25px;
    left: 2px;
    line-height: 35px;
    top: -35px;
    font-weight: bold;
    font-size: 20px;
    font-family: philosopherregular;
}

.price-package {
    border-radius: 20px;
    position: absolute;
    background: #41633B;
    color: white;
    padding: 0 20px;
    line-height: 25px;
    right: 2px;
    line-height: 35px;
    top: -35px;
    font-size: 12px;
    font-family: philosopherregular;
}

    .price-package strong {
        font-size: 16px;
    }

.card-package {
    margin-top: 30px;
}

.icone-package {
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    border-radius: 50%;
    /*background: #76A82F;*/
    color: white;
    float: right;
    margin-right: 32px;
}

.icone-package .icone-package {
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
}

.icone-ok {
    background: #76A82F url(../Images/ok.png) no-repeat center center;
    width: 20px;
    height: 20px;
    line-height: 20px;
    display: inline-block;
    border-radius: 50%;
}

.icone-no {
    background: #5B5B5B url(../Images/close2.png) no-repeat center center;
    width: 20px;
    height: 20px;
    line-height: 20px;
    display: inline-block;
    border-radius: 50%;
}

.card-actuel .icone-no {
    background: #BABABA url(../Images/close.png) no-repeat center center;
}

.icone-package::after {
}

.card-classic .type-package {
    background: #365880;
}

.card.card-package {
    background: #373737;
    color: #fff;
}

    .card.card-package.card-actuel {
        background: #fff;
    }

.option-package {
    font-family: philosopherregular;
    font-size: 15px;
    line-height: 17px;
    color: #ffffff;
    float: left;
    width: calc(100% - 60px);
    padding-right: 25px;
}

.card-actuel .option-package {
    color: #373737;
}

.card-package .option-no .option-package {
    color: #A8A8A8;
}

.card-actuel .option-no .option-package {
    color: #787878;
}

.card-package {
    position: relative;
}

.card-package:before {
    position: absolute;
    border: 1px solid #FFF;
    right: 23px;
    top: 30px;
    bottom: 90px;
    width: 70px;
    border-radius: 12px;
    content: "";
    opacity: 0.4;
}

.card-package.card-actuel:before {
    border: 1px solid #76A82F;
}

.card-package .btn {
    margin-top: 30px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0);
    font-weight: bold;
}

.card-gold .type-package {
    background: linear-gradient(102.56deg, #E5C554 5.2%, #FDFF99 35.37%, #DAAC36 86.94%);
    color: #724706;
}

.card-platium .type-package {
    background: linear-gradient(102.56deg, #ACACAC 5.2%, #ECECEC 35.37%, #AAAAAA 86.94%);
    color: #515151;
}

.card-package button:disabled {
    background: #EAEAEA;
    color: #6F6F6F;
    opacity: 1;
    cursor: default;
}

.form-montant .pull-left {
    width: calc(100% - 120px);
}

.form-montant .btn {
    font-size: 30px;
    padding: 0 10px;
}

/********** Page login ***********/
.banque-en-ligne {
    max-width: 100%;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 12px;
    padding: 15px;
    margin-right: 0;
    min-height: 300px;
    width: 360px;
}

    .banque-en-ligne .field-validation-error.text-erreur {
        color: #fff;
        font-size: 10px;
    }

.apps {
    background: #F3F3F4;
    padding: 45px 15px 15px;
    margin-top: -30px;
    position: relative;
    z-index: 3;
    /*background: red;*/
    border-radius: 0 0 20px 20px;
}

.header-login {
    position: relative;
    z-index: 8;
    background: blue;
    padding-top: 80px;
    background: url(../Images/bg-header.png) repeat-x left top;
    height: 150px;
    margin-top: -15px;
    display: inline-flex;
}

    .header-login:before {
        background: url(../Images/left-header.png) no-repeat left top;
        content: "";
        width: 399px;
        height: 150px;
        display: block;
        position: absolute;
        left: 0;
        top: 0;
    }

    .header-login:after {
        background: url(../Images/right-header.png) no-repeat left top;
        content: "";
        width: 30px;
        height: 150px;
        display: block;
        position: absolute;
        right: 0;
        top: 0;
    }

.middle-login {
    background: linear-gradient(109.36deg, #296334 36.92%, #76A82F 94.04%);
    border-radius: 26px;
    background: url(../Images/BG.png) no-repeat left top / cover;
    padding: 150px 0 20px 0;
    position: relative;
    z-index: 5;
    margin-top: -120px;
    min-height: 550px;
    flex-shrink: 0;
}

.logo-zitouna {
    position: absolute;
    width: 250px;
    left: 160px;
    top: 30px;
}

    .logo-zitouna img {
        width: 180px;
    }

.middle-login .container {
    position: relative;
}

.img-screens {
    /*margin-bottom: -100px;
    padding-left: 50px;*/
    position: absolute;
    left: 47%;
    top: 0;
    width: 900px;
}

.banque-en-ligne h2 {
    font-family: philosopherregular;
    font-size: 30px;
    line-height: 32px;
    color: #ffffff;
    text-align: center;
}

.banque-en-ligne p {
    color: #76A82F;
    text-align: center;
    font-size: 16px;
}

.bottom-footer {
    background: url(../Images/bg-footer.png) repeat-x center bottom;
    height: 140px;
    clear: both;
    position: relative;
}

.left-footer {
    float: left;
    width: 18%;
    padding-top: 60px;
    text-align: center;
}

.right-footer {
    float: right;
    width: 12%;
    padding-top: 70px;
}

.center-footer {
    float: left;
    width: 61%;
    text-align: center;
    padding-top: 100px;
    color: #fff;
}

.bottom-footer p {
    margin-bottom: 0;
    margin-top: 5px;
    font-size: 12px;
}

.footer-login > h2 {
    text-align: center;
    font-family: philosopherregular;
    font-size: 22px;
    line-height: 28px;
}

.besoin-aide {
    margin: 0 auto -80px;
    max-width: 800px;
    text-align: center;
    position: relative;
    z-index: 20;
}

.bottom-footer:before {
    background: url(../Images/left-footer.png) no-repeat left top;
    content: "";
    width: 340px;
    height: 140px;
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: -1;
}

.bottom-footer:after {
    /*background: url(../Images/right-footer.png) no-repeat left top;*/
    background: url(../Images/left-footer.png) no-repeat left top;
    transform: scaleX(-1);
    content: "";
    width: 340px;
    height: 140px;
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
}
/*.besoin-aide > div {
    width: 33%;
    padding: 0 15px;
    float: left;
    text-align: center;
}*/
.icone-mail {
    background: url(../Images/icone-mail.png) no-repeat left center / 100% auto;
    display: inline-block;
    width: 32px;
    height: 35px;
    margin-bottom: 10px;
}

.icone-adresse {
    background: url(../Images/icone-adresse.png) no-repeat left center / 100% auto;
    display: inline-block;
    width: 28px;
    height: 35px;
    margin-bottom: 10px;
}

.icone-tel {
    background: url(../Images/icone-tel.png) no-repeat left center / 100% auto;
    display: inline-block;
    width: 32px;
    height: 35px;
    margin-bottom: 10px;
}
.icone-user {
    background: url(../Images/icon-user.png) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 28px;
    margin-right: 7px;
    margin-left: 5px;
}
.icone-notification {
    background: url(../Images/icon-notification.png) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.footer-login {
    padding-top: 30px;
    margin-top: auto;
}

.loginPage {
    height: 100%;
    overflow-x: hidden;
    flex-direction: column;
    display: flex;
}

.besoin-aide p {
    font-size: 13px;
}

.besoin-aide a {
    color: #373737;
}

.right-footer img {
    width: 90px;
}

.left-footer a {
    display: inline-block;
    margin-right: 3px;
}

.left-footer i {
    display: inline-block;
    width: 30px;
    height: 31px;
}

.icone-facebook {
    background: url(../Images/icone-facebook.png) no-repeat left center / 100% auto;
}

.icone-instagram {
    background: url(../Images/icone-instagram.png) no-repeat left center / 100% auto;
}

.icone-linkedin {
    background: url(../Images/icone-linkedin.png) no-repeat left center / 100% auto;
}

.icone-youtube {
    background: url(../Images/icone-youtube.png) no-repeat left center / 100% auto;
}

.icone-twitter {
    background: url(../Images/icone-twitter.png) no-repeat left center / 100% auto;
}

.banque-en-ligne input[type="text"], .banque-en-ligne input[type="password"] {
    padding-left: 35px;
}

html {
    overflow-x: hidden;
}

body {
    overflow-x: hidden;
}

.apps img {
    height: 48px;
}

.apps p {
    font-family: philosopherregular;
    font-size: 20px;
    line-height: 24px;
}

#form-login {
    clear: both;
}

/** page compte*/
ul#ACCOUNT_SUBMENU i {
    color: #76A82F;
}

.btn-primary:hover {
    background-color: #a4a7ae;
    border: 0;
}
.modal-body .card {
    box-shadow: none;
}
.modal-dialog {
    width: 375px;
}
table td .fa-chevron-right {
    color: #2e2e2e;
}
.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus{
    border:none;
}
@media (max-width: 991px) {
    div .selectbtn {
        display: block !important;
        margin-right: 0 !important;
        margin-top: 5px;
    }

    .form-popin .form-group .row-label input {
        margin-top: 5px;
    }
}

@media (max-width: 1535px) and (min-width: 400px) {
    .virementPadDiv div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 30% !important;
    }
}

@media (max-width: 1919px) and (min-width: 1536px) {
    .virementPadDiv div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 30% !important;
    }
}

@media (max-width: 2200px) and (min-width: 1920px) {
    .virementPadDiv div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 32% !important;
    }
}



@media (max-width: 1535px) and (min-width: 400px) {
    .settingsProfileMobile div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 40% !important;
    }
}

@media (max-width: 1919px) and (min-width: 1536px) {
    .settingsProfileMobile div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 43% !important;
    }
}

@media (max-width: 2200px) and (min-width: 1920px) {
    .settingsProfileMobile div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 45% !important;
    }
}



@media (max-width: 1535px) and (min-width: 400px) {
    .phonerefillPadDiv div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 17% !important;
    }
}

@media (max-width: 1919px) and (min-width: 1536px) {
    .phonerefillPadDiv div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 33% !important;
    }
}


@media (max-width: 2200px) and (min-width: 1920px) {
    .phonerefillPadDiv div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 39% !important;
    }
}

@media (max-width: 1535px) and (min-width: 400px) {
    .PermenvirementPadDiv div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 17% !important;
    }
}

@media (max-width: 1919px) and (min-width: 1536px) {
    .PermenvirementPadDiv div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 33% !important;
    }
}

@media (max-width: 2200px) and (min-width: 1920px) {
    .PermenvirementPadDiv div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 39% !important;
    }
}

@media (max-width: 1919px) and (min-width: 1536px) {
    .PermenvirementPadEditDiv div.keypad-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 7% !important;
        left: 80.5% !important;
    }
}


@media (max-width: 1850px) and (min-width: 1501px) {
    .middle-login {
        padding: 190px 0 20px 0 !important;
    }

    .middle-login .img-screens {
        top: -40px!important;
    }

    .footer-login {
        padding-top: 15px!important;
    }

    .footer-login .bottom-footer {
        height: 125px!important;
    }

    .footer-login .bottom-footer {
        height: 125px !important;
    }

    .bottom-footer .center-footer {
        padding-top: 90px!important;
    }

    .middle-login .img-screens .form-user {
        margin-left: 53% !important;
    }

    .middle-login .img-screens img {
        margin-left: -50px !important;
    }
}

@media (max-width: 1500px) and (min-width: 1261px) {
    .middle-login {
        padding: 190px 0 20px 0 !important;
    }

    .middle-login .img-screens .form-user {
        margin-left: 38.3% !important;
    }

    .middle-login .img-screens img {
        width: 89% !important;
        margin-left: -90px !important;
    }
}

@media (max-width: 1260px) and (min-width: 1026px) {
    .middle-login {
        padding: 190px 0 20px 0 !important;
    }

    .middle-login .img-screens .form-user {
        margin-left: 27.3% !important;
    }

    .middle-login .img-screens img {
        width: 68% !important;
        margin-left: -20px !important;
    }

    .loginPage .apps .container {
        text-align:center!important;
    }

    .besoin-aide {
        margin: 0px auto -54px!important;
    }
}

@media (max-width: 1025px) and (min-width: 821px) {
    .middle-login {
        padding: 190px 0 20px 0 !important;
    }

    .middle-login .img-screens .form-user {
        margin-left: 21% !important;
    }

    .middle-login .img-screens img {
        width: 63% !important;
        margin-left: -35px !important;
    }

    .loginPage .apps .container {
        text-align: center !important;
    }

    .besoin-aide {
        margin: 0px auto -54px !important;
    }
}

@media (max-width: 820px) and (min-width: 600px) {
    .middle-login {
        padding: 140px 0 20px 0 !important;
    }

    .middle-login .banque-en-ligne {
        margin-left: 25%!important;
    }

    .middle-login .img-screens img {
        width: 63% !important;
        margin-left: 20% !important;
    }

    .middle-login .img-screens .form-user {
        margin-left: 45.5% !important;
    }

    .middle-login .img-screens {
        top:40px!important;
    }

    .loginPage .apps .container {
        text-align: center !important;
    }

    .besoin-aide {
        margin: 0px auto -54px !important;
    }
}

/**page cheques*/
/*#partialTableMonetic tbody tr:before {
    content: '';
    border-right: 1px dashed #DFDFDF !important;
    left: 11px;
    position: absolute;
    z-index: 1;
    height: calc(100% - 20px);
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}*/
#partialTableMonetic tr {
    box-shadow: none;
    position: relative;
}
#ReciviedCheckTable td,
tbody#PreavisCheckTable td,
tbody#CnpCheckTable td,
tbody#ProgressCheckTable td {
    padding: 15px 8px;
    line-height: 30px;
}
tbody#ReciviedCheckTable tr,
tbody#PreavisCheckTable tr,
tbody#CnpCheckTable tr,
tbody#ProgressCheckTable tr{
    position: relative;
    box-shadow: none;
}
tbody#ReciviedCheckTable tr:before,
tbody#PreavisCheckTable tr:before,
tbody#CnpCheckTable tr:before,
tbody#ProgressCheckTable tr:before{
    content: '';
    border-right: 1px dashed #DFDFDF !important;
    left: 11px;
    position: absolute;
    z-index: 1;
    height: calc(100% - 20px);
    top: 10px;
}
/** page check*/
#block-calendar .input-group {
    width: 20%;
    display: inline-block;
}
#block-calendar .btn {
    background: #76A82F;
    border-radius: 25px !important;
    padding: 0 20px;
    color: #fff;
    font-size: 15px;
    height: 45px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
    line-height: 45px;
    border: 0;
}
div#block-calendar .input-group input {
    display: inline-block;
    float: none;
    width: calc(100% - 36px);
    padding: 0 15px;
    height: 45px;
}
#block-calendar .fa-calendar {
    position: absolute;
    right: 13px;
    top: 13px;
    z-index: 3;
}

/*.mobile-screen .sidebar .navbar-nav .nav-link {
    height: 30px;
    overflow: hidden;
}*/
.mobile-screen .sidebar .navbar-nav .nav-link {
    padding: 1px 7px;
}
.mobile-screen .sidebar .navbar-nav .nav-link span {
    display: none;
}

#carouselBankAccountList.carousel-compte.owl-theme .owl-nav {
    margin: 0;
    position: absolute;
    top: 44%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

#carouselBankAccountList.carousel-compte .carte-emet h3 {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.form-horizontal input + button {
    margin-right: 10px;
}
.card-checkbook label {
    background: transparent;
    border-radius: 0;
    padding: 0;
    margin-bottom: 5px;
    font-weight: bold;
    font-size: 16px;
    line-height: 26px;
    font-family: 'philosopherregular';
    color: #373737;
    display: block;
}
.carnets-cheque {
    margin-bottom: 20px;
}

.carnets-cheque > div {
    float: left;
    max-width: calc(25% - 24.5px);
    text-align: center;
    padding: 9px;
    border: 2px solid transparent;
    border-radius: 5px;
}
.carnets-cheque > div + div {
    margin-left: 10px;
}
.carnets-cheque img {
    box-shadow: 0px 3.58652px 11.6562px rgba(0, 0, 0, 0.34);
}
.radios-bloc {
    display: flex;
}
.radios-bloc .form-radio {
display: flex;
position: relative;
}
.radios-bloc .form-radio + .form-radio {
    margin-left: 10px;
}
.radios-bloc label {
    width: 60px;
    height: 40px;
    border: 2px solid #E0E0E0;
    background: #FFFFFF;
    border-radius: 20px;
    text-align: center;
    line-height: 40px;
}
.radios-bloc input[type="radio"] {
    position: absolute;
    left: 0;
    top: 0;
    width: 60px;
    height: 40px;
    opacity: 0;
}
.radios-bloc input[type="radio"]:not(:checked)+label {
    color: #373737;
    opacity: 0.5;
}
.radios-bloc input[type="radio"]:checked+label {
    border: 2px solid #76A82F;
}
.barre {
    display: inline-block;
    float: left;
    margin-left: 35px;
}
.card-checkbook .form-barre > label {
    float: left;
    margin: 5px 40px 0 0;
}
.card-checkbook .form-group {
    margin-bottom: 40px !important;
}

@media (min-width: 992px) {
    /*.mobile-screen .navbar-expand-lg .navbar-toggler {
        display: inline-block;
    }*/
    header {
        padding: 10px 0 !important;
    }
}

    
.owl-carousel.carousel-disabled{
    pointer-events: none;
}
.owl-carousel.carousel-disabled .owl-nav {
    display: none;
}

.text-right .btn + .btn {
    margin-right: 10px;
}

.buttons-telecharger button.btn {
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    padding: 0 15px;
}
.m-10 {
    margin-top: 10px;
}
/* la zone affichant l'option sélectionnée */
.dropdownCell {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: #fff url(../Images/chevron-2.png) no-repeat right center !important;
    background: #fff;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.25);
    border-radius: 25px !important;
    padding: 5px 15px;
    border: 0;
    height: 45px;
    font-size: 15px;
    width: 100%;
    color: #373737;
    padding-right: 30px !important;
    line-height: 35px;
}

.dropdownCell img {
    margin: -4px 8px 0px 3px;
    vertical-align: middle;
    width: 24px;
}

.dropdownPanel {
    border: 1px solid #bbb;
    width: calc(100% - 30px);
    position: absolute;
    z-index: 50;
    background: #fff;
}

.dropdownOpt {
    background-color: #fff;
    cursor: pointer;
    font-family: arial;
    font-size: 12px;
    padding: 7px 0;
}

.dropdownOpt img {
    margin: 0px 8px 0px 3px;
    vertical-align: middle;
    width: 24px;
}

.dropdownOptSelected {
    background-color: #ccc;
}
.list-country {
    width: 100%;
}
.list-country img {
    width: 26px;
    margin: 0 8px 0 0;
}
.list-country li {
    padding: 5px 10px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered img {
    width: 30px;
    margin-top: -6px;
    margin-right: 6px;
}
.select2-container .select2-results img {
    width: 30px;
    margin-top: -6px;
    margin-right: 6px;
}

#AmountTND {
    font-weight: bold;
    color: #76A82F;
}
#LdReference {
    border: 0;
    /*color: #76A82F;*/
    font-weight: bold;
    margin-left: 10px;
}
.line_tr {
    overflow: visible !important;
}
ul#menuConfig li + li {
    border-top: 1px solid rgba(255, 255, 255, .3);
    -webkit-background-clip: padding-box; /* for Safari */
    background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
}
#DataTableRequest tbody tr[demand-statut='En attente'] td:nth-child(4) {
    color: #F2994A;
}
#DataTableRequest tbody tr[demand-statut='Validée'] td:nth-child(4) {
    color: #76A82F;
}
#DataTableRequest tbody tr[demand-statut='Annulée'] td:nth-child(4) {
    color: #F82424;
}
#DataTableRequest tbody tr[demand-statut='En cours'] td:nth-child(4) {
    color: #F2994A;
}
#DataTableRequest tbody tr[demand-statut='Rejeté'] td:nth-child(4) {
    color: #F82424;
}

#DataTableRequest tbody tr[demand-statut='En attente'] td:nth-child(4):before {
    content: "";
    background-image: url(/ib/Images/Check/progress.png);
    background-repeat: no-repeat;
    width: 21px;
    height: 21px;
    margin-right: 11px;
}
#DataTableRequest tbody tr[demand-statut='Validée'] td:nth-child(4):before {
    content: "";
    background-image: url(/ib/Images/Check/issued.png);
    background-repeat: no-repeat;
    width: 21px;
    height: 21px;
    margin-right: 11px;
}
#DataTableRequest tbody tr[demand-statut='Annulée'] td:nth-child(4):before {
    content: "";
    background-image: url(/ib/Images/Check/cancel.png);
    background-repeat: no-repeat;
    width: 21px;
    height: 21px;
    margin-right: 11px;
}
#DataTableRequest tbody tr[demand-statut='Rejeté'] td:nth-child(4):before {
    content: "";
    background-image: url(/ib/Images/Check/cancel.png);
    background-repeat: no-repeat;
    width: 21px;
    height: 21px;
    margin-right: 11px;
}
#DataTableRequest tbody tr[demand-statut='En cours'] td:nth-child(4):before {
    content: "";
    background-image: url(/ib/Images/Check/progress.png);
    background-repeat: no-repeat;
    width: 21px;
    height: 21px;
    margin-right: 11px;
}

#Cardlist .owl-nav {
    display: none;
}

#Cardlist .owl-item.active + .owl-item.active {
    opacity: .4;
    transform: scale(0.8, 0.8);
}
#block-calendar {
    margin-bottom: 10px;
}
.form-changeMotDePasse > button {
    margin-top: 10px;
}
/** style icone svg **/

.icone_financement:after {
    content: '';
    background: url(../Images/icones/financement.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icone_investissement:after {
    content: '';
    background: url(../Images/icones/investissement.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icone_demande_rdv:after {
    content: '';
    background: url(../Images/icones/demande_rdv.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icone_demande_fonds_devise:after {
    content: '';
    background: url(../Images/icones/demande_fonds_devise.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icone_suivi_demandes:after {
    content: '';
    background: url(../Images/icones/suivi_demandes.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icone_cheques_emis:after {
    content: '';
    background: url(../Images/icones/cheques_emis.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icone_consultation_remise_cheques:after {
    content: '';
    background: url(../Images/icones/consultation_remise_cheques.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icone_bordereau_remise_cheques:after {
    content: '';
    background: url(../Images/icones/bordereau_remise_cheques.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icone_demande_carnet_cheques:after {
    content: '';
    background: url(../Images/icones/demande_carnet_cheques.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icone_suivi_demandes_cheques:after {
    content: '';
    background: url(../Images/icones/suivi_demandes_cheques.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icon_demande_CB:after {
    content: '';
    background: url(../Images/icones/demande_CB.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

.icon_demande_levee:after {
    content: '';
    background: url(../Images/icones/demande_levee.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}

@media (min-width: 1600px) {
    .large-screen .sidebar .navbar-nav .nav-link {
        padding: 13px 5px;
    }
}


@media (min-width: 1200px) and (max-width: 1350px) {
    .type-package {
        font-size: 17px;
        padding: 0 15px;
    }

    .price-package {
        padding: 0 15px;
    }
}

@media (max-width: 1500px) {
}

@media (min-width: 1400px) {
    /*#cardcarousel .item-carte .num-carte {
        font-size: 16px;
    }*/

    #cardcarousel .item-carte .num-cp {
        font-size: 10px;
    }

    #cardcarousel .item-carte .date-exp-carte {
        /*font-size: 13px;
        margin-left: 60%;*/
    }

    /*#cardcarousel .item-carte .nom-carte {
        font-size: 14px;
    }*/

    /*.info-carte {
        left: 28px;
        top: 54%;
    }*/

    /*#Cardlist .item-carte .date-exp-carte {
        margin-left: 55%;
        margin-top: -10px;
    }*/
}

/*@media (min-width: 1500px) {
.banque-en-ligne {
        float: right;
        margin-right: 30px;
    }
}*/

@media (min-width: 1700px) {
    /*#cardcarousel .item-carte .num-carte {
        font-size: 17px;
    }*/

    #cardcarousel .item-carte .num-cp {
        font-size: 11px;
    }

    /*#cardcarousel .item-carte .date-exp-carte {
        font-size: 14px;
        margin-left: 72%;
    }*/

    /*#cardcarousel .item-carte .nom-carte {
        font-size: 15px;
    }*/

    .info-carte {
        left: 11%;
        top: 57%;
    }

    /*#Cardlist .item-carte .date-exp-carte {
        margin-left: 68%;
        margin-top: -4px;
    }*/
}

.recharge-div-left {
    width: 64%;
    float: left;
}

.recharge-div-right {
    width: 34%;
    float: right;
    margin-left: 20px;
}


.recharge-div-right {
    width: 34%;
    float: right;
    margin-left: 20px;
}

/*Transaction icons*/

.icone_autre_txn_-1:after {
    content: '';
    background: url(../Images/icones/transactions/gris/autre_txn_-1.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_recharge_carte_technologique_txn_938:after {
    content: '';
    background: url(../Images/icones/transactions/gris/recharge_carte_technologique_txn_938.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_paiement_prélèvement_txn_217:after {
    content: '';
    background: url(../Images/icones/transactions/gris/paiement_prélèvement_txn_217.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_retrait_especes_txn_2:after {
    content: '';
    background: url(../Images/icones/transactions/gris/retrait_especes_txn_2.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_deblocage_de_provision_txn_977:after {
    content: '';
    background: url(../Images/icones/transactions/gris/deblocage_de_provision_txn_977.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_encaissement_cheque_preavise_txn_969:after {
    content: '';
    background: url(../Images/icones/transactions/gris/encaissement_cheque_preavise_txn_969.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_encaissement_cheque_txn_969:after {
    content: '';
    background: url(../Images/icones/transactions/gris/encaissement_cheque_txn_969.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_encaissement_effet_txn_904:after {
    content: '';
    background: url(../Images/icones/transactions/gris/encaissement_effet_txn_904.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_encaissement_remise_txn_940:after {
    content: '';
    background: url(../Images/icones/transactions/gris/encaissement_remise_txn_940.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_paiement_echeance_txn_420:after {
    content: '';
    background: url(../Images/icones/transactions/gris/paiement_echeance_txn_420.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_paiement_echeance_txn_430:after {
    content: '';
    background: url(../Images/icones/transactions/gris/paiement_echeance_txn_430.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_paiement_echeance_txn_434:after {
    content: '';
    background: url(../Images/icones/transactions/gris/paiement_echeance_txn_434.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_paiement_effet_txn_903:after {
    content: '';
    background: url(../Images/icones/transactions/gris/paiement_effet_txn_903.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_Paiement_internet_txn_270:after {
    content: '';
    background: url(../Images/icones/transactions/gris/Paiement_internet_txn_270.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_recharge_telephonique_txn_338:after {
    content: '';
    background: url(../Images/icones/transactions/gris/recharge_telephonique_small_txn_338.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 26px;
}

.icone_reglement_chèque_txn_965:after {
    content: '';
    background: url(../Images/icones/transactions/gris/reglement_chèque_txn_965.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_reglement_tpe_txn_249:after {
    content: '';
    background: url(../Images/icones/transactions/gris/reglement_tpe_small_txn_249.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 25px;
}

.icone_remboursement_placement_txn_427:after {
    content: '';
    background: url(../Images/icones/transactions/gris/remboursement_placement_txn_427.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_retrait_cheque_txn_4:after {
    content: '';
    background: url(../Images/icones/transactions/gris/retrait_cheque_txn_4.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_retrait_DAB_txn_253:after {
    content: '';
    background: url(../Images/icones/transactions/gris/retrait_DAB_txn_253.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_retrait_especes_txn_17:after {
    content: '';
    background: url(../Images/icones/transactions/gris/retrait_especes_txn_17.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_souscription_placement_txn_401:after {
    content: '';
    background: url(../Images/icones/transactions/gris/souscription_placement_txn_401.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_transfert_emis_a_etranger_txn_210:after {
    content: '';
    background: url(../Images/icones/transactions/gris/transfert_emis_a_etranger_txn_210.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_transfert_reçu_de_étranger_txn_220:after {
    content: '';
    background: url(../Images/icones/transactions/gris/transfert_reçu_de_étranger_txn_220.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_versement_especes_txn_52:after {
    content: '';
    background: url(../Images/icones/transactions/gris/versement_especes_txn_52.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_versement_especes_txn_52:after {
    content: '';
    background: url(../Images/icones/transactions/gris/versement_especes_txn_52.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_virement_intra_txn_990:after {
    content: '';
    background: url(../Images/icones/transactions/gris/virement_intra_txn_990.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_virement_reçu_txn_245:after {
    content: '';
    background: url(../Images/icones/transactions/gris/virement_reçu_txn_245.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_virement-emis_txn_212:after {
    content: '';
    background: url(../Images/icones/transactions/gris/virement-emis_txn_212.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}
/**from*/
.icone_versement_espèces_txn_47:after {
    content: '';
    background: url(../Images/icones/transactions/gris/versement_espèces_txn_47.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_transfert_emis_sgmt_txn_213:after {
    content: '';
    background: url(../Images/icones/transactions/gris/transfert_emis_sgmt_txn_213.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_blocage_provision_txn_976:after {
    content: '';
    background: url(../Images/icones/transactions/gris/blocage_provision_txn_976.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_remboursement_placement_txn_426:after {
    content: '';
    background: url(../Images/icones/transactions/gris/remboursement_placement_txn_426.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_paiement_échéance_txn_434:after {
    content: '';
    background: url(../Images/icones/transactions/gris/paiement_échéance_txn_434.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_paiement_échéance_txn_430:after {
    content: '';
    background: url(../Images/icones/transactions/gris/paiement_échéance_txn_430.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_encaissement_prélèvement_txn_400:after {
    content: '';
    background: url(../Images/icones/transactions/gris/encaissement_prélèvement_txn_400.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_blocage_provision_txn_976:after {
    content: '';
    background: url(../Images/icones/transactions/gris/blocage_provision_txn_976.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}

.icone_encaissement_cheque_txn_966:after {
    content: '';
    background: url(../Images/icones/transactions/gris/encaissement_cheque_txn_966.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 18px;
    height: 18px;
}
.icon_edit_p:after {
    content: '';
    background: url(../Images/icones/icon_edit_.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 20px;
    height: 20px;
}

.icon_exchange:after {
    content: '';
    background: url(../Images/icones/icon_exchange.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 20px;
    height: 20px;
}

.icon_benificier:after {
    content: '';
    background: url(../Images/icones/icon_benificier.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 45px;
    height: 45px;
}

.icon_virm_devise:after {
    content: '';
    background: url(../Images/icones/icon_virm_devise.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 45px;
    height: 48px;
}

.icon_virm_devise_blue:after {
    content: '';
    background: url(../Images/icones/icon_virm_devise_blue.svg) no-repeat left center / 100% auto;
    /* display: inline-block;
    width: 45px;
    height: 48px;*/
    display: block;
    width: 40px;
    height: 40px;
}

.icon_virm_entreprise:after {
    content: '';
    background: url(../Images/icones/icon_virm_entreprise.svg) no-repeat left center / 100% auto;
    display: block;
    width: 40px;
    height: 40px;
}

.icon_virement:after {
    content: '';
    background: url(../Images/icones/icon_virement.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 45px;
    height: 45px;
}

.icon_historique_virm:after {
    content: '';
    background: url(../Images/icones/icon_historique_virm.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 45px;
    height: 45px;
}

.icon_benificier:after {
    content: '';
    background: url(../Images/icones/icon_benificier.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 45px;
    height: 45px;
}

.icon_recharge_carte_technologique:after {
    content: '';
    background: url(../Images/icones/icon_recharge_carte_technologique.svg) no-repeat left center / 100% auto;
    display: inline-block;
    width: 30px;
    height: 30px;
}






/* Responsive: Portrait tablets and up */
@media (min-width: 992px) {
    header {
        padding: 0;
    }
}

@media (max-width: 1399px) {
    .besoin-aide {
        margin: 0 auto -60px;
    }

    .left-montant-recharge {
        width: 42%;
    }

}

@media (max-width: 1199px) {
    .besoin-aide {
        margin: 0 auto -50px;
    }
    .panel-left, .panel-right, .panel-left-dashboard, panel-right-dashboard, .panel-right-dashboard, .recharge-div-left, .recharge-div-right {
        width: 100%;
        float: none;
        margin: 0;
    }
}

@media (max-width: 991px) {
    .card-emetteur .pull-right .btn2 + .btn2 {
        margin-left: 0;
        margin-top: 5px;
        display: block;
    }

    .img-screens {
        position: relative;
        left: auto;
        top: 0;
        width: 100%;
        margin-top: 30px;
    }

    .left-footer {
        width: 200px;
    }

    .center-footer {
        width: 56%;
    }

    #block-calendar .input-group {
        width: 100%;
        margin-bottom: 10px;
    }
    header {
        padding: 0;
    }
    .header-panel {
        padding: 80px 0 5px 0 !important;
        height: auto;
    }
    .widget-content {
        padding-top: 120px;
    }

    .header-login, .loginPage {
        display: block;
    }
}

@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }

    .body-content {
        padding: 0;
    }

    #cards-list > ul li, #cardsLifting-list > ul li {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .navbar-toggler {
        display: none;
    }

    .right-footer {
        width: 110px;
    }
}

@media (max-width: 767px) {
    navbar-toggler {
        display: none;
    }
    /*.navbar-nav.flex-column {
        display: none !important;
    }*/

    .navbar-nav.flex-column.show {
        display: block !important;
    }

    .navbar-nav.flex-column.show {
        display: block !important;
        padding-top: 20px;
    }

    /*.sidebar .navbar-nav.flex-column .nav-link i {
        font-size: 30px;
        display: inline-block;
        line-height: 20px;
        vertical-align: middle;
    }
    .sidebar .navbar-nav .nav-link span{
        display: none;
    }*/

    /*.sidebar .navbar-nav.flex-column .nav-link {
        font-weight: 400;
        font-size: 15px;
        line-height: 20px;
        text-align: left;
        color: #fff;
        padding: 8px 5px;
        position: relative;
    }

    .navbar-nav.flex-column {
        display: none;
        position: fixed;
        background: #000;
        left: 110px;
        top: 0;
        width: 220px;
        bottom: 0;
        z-index: 999999999999999999999999;
    }*/

    /*.t1, .t2 {
        display: none !important;
    }

    .small-screen .navbar-nav.flex-column {
        height: auto !important;
    }*/

    .middle-login {
        border-top-right-radius: 0;
    }

    .header-login:after {
        display: none;
    }

    .banque-en-ligne {
        width: 100%;
    }

    .bottom-footer {
        background: url(../Images/bg-footer2.png) repeat-x center bottom;
    }

    .center-footer {
        margin-left: 0;
        width: 100%;
    }

    .left-footer {
        padding-top: 40px;
        position: absolute;
        left: 0;
    }

    .right-footer {
        width: 90px;
        padding-top: 40px;
        margin-right: 10px;
        position: absolute;
        right: 0;
    }

    .besoin-aide {
        margin: 0 auto -20px;
    }

    .apps {
        text-align: center;
    }

        .apps a {
            margin-bottom: 8px;
            display: inline-block;
        }
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 375px;
    }
}

@media (max-width: 439px) {
    .logo-zitouna {
        width: auto;
        left: auto;
        right: 16%;
    }

    .banque-en-ligne h2 {
        font-size: 28px;
    }
}

/*Begin Aninmated text loading component*/
@import url(https://fonts.googleapis.com/css?family=Lato:300,400);

*, :before, :after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.loader-dots {
    padding: 0.5em 2.2em 0.5em 1em;
    border-radius: .8em;
    color: #373737;
    background: #ffffffe6;
    display: block;
    position: relative;
    font: 600 1em/1.5 'montserratregular',sans-serif;
    letter-spacing: 2px;
    width: 50ch;
    margin: auto;
    text-align: center;
    margin-bottom: 20px;
}
.loader-dots:after {
    content: '.....';
    width: 0;
    position: absolute;
    overflow: hidden;
    animation: loader-dots-animation 1s infinite;
}
.result {
    position: relative;
}
.emptyTransaction {
    margin-bottom: 20px;
}
@keyframes loader-dots-animation {
    0% {
        width: 0.0em;
    }

    50% {
        width: 1.2em;
    }

    100% {
        width: 0.2em;
    }
}