:root {
    --primary: #195982;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #d63384;
    --danger: #dc3545;
    --orange: #fd7e14;
    --warning: #ffc107;
    --success: #198754;
    --teal: #20c997;
    --info: #0dcaf0;
    --secondary: #CE3231;
    --light: #f8f9fa;
    --dark: #212529;
    --fond-bleu: #88B3CF;
    --fond-rouge: #D0AAB8;
    --fond-orange: #822626;
    --gray-100: #f8f9fa;
    --gray-200: #e9ecef;
    --gray-300: #dee2e6;
    --gray-400: #ced4da;
    --gray-500: #adb5bd;
    --gray-600: #6c757d;
    --gray-700: #495057;
    --gray-800: #343a40;
    --gray-900: #212529;


}
.custom-logo-link{margin-right: 0px}
.tagline {display: flex;flex-direction: column;justify-content: end;align-items: end;padding-bottom: 7px}
.tagline span {font-style: italic;font-size: 12px;line-height: 13px}




.scroll-on-mobile-img .block_img {
    width: 22% !important;
    flex-basis: 22%;
    margin-bottom: 25px
}

.text-annonce {
    padding: 0px;
    width: 35%;
    flex-basis: 33%
}

.text-annonce .description {
    padding: 25px 5px
}

.text-annonce .description a {
    width: 100%
}

.text-annonce .rapport a span {
    display: block;
    background: #195982;
    color: #fff;
    padding: 5px 15px;
    margin-top: 15px
}

.text-annonce .rapport a {
    width: 100%;
    padding: 0 5px
}

.img-annonce {
    padding: 0px
}

#error-404-wrapper {
    background: #fff;
    padding: 5px 50px;
    position: relative;
    height: 500px
}

#error-404-wrapper h1 {
    display: none
}

#error-404-wrapper h2 {
    font-size: 50px
}

#error-404-wrapper h4 {
    color: #aaa;
    margin-top: -50px;
    font-size: 29px;
    font-weight: bold
}

#_404_custom {
    display: flex;
    overflow-x: hidden;
    padding-top: 2px;
    position: absolute;
    bottom: 25px;
    right: -5px;
    width: 600px;
}

.img-404 {
    margin-right: -18px
}

#_404_custom img {
    width: 100% !important;
    margin-right: -50px
}

.col-iban {
    width: 13%
}

.error-login {
    margin-top: 25px;
    background: #eee;
    padding: 5px 25px
}

.error-login .fas {
    padding-right: 10px
}

.landscape {
    display: none
}

.html-landscape::after {
    content: 'Orientez votre téléphone en mode portrait';
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    background: #195982;
    color: #fff;
    font-size: 35px;
}


h6.acheteur,
h3.acheteur {
    color: rgb(13, 110, 253)
}

h6.vendeur,
h3.vendeur {
    color: rgb(219, 116, 29)
}

.comment-ca-marche .panel-line-0 p {
    color: #fff !important
}

.comment-ca-marche .panel-line-1 {
    height: 195px
}

.comment-ca-marche .panel-line-2 {
    height: 366px
}

.comment-ca-marche .panel-line-3 {
    height: 300px
}

.comment-ca-marche .panel-grid-cell {
    height: 100%
}

#commissions {
    padding: 17px 75px;
    color: #fff
}

.comment-ca-marche .annonces h3 {
    color: #fff !important;
    padding: 5px 0px 0px 15px
}

.message-text {
    width: 100%
}

.wpcf7-submit {
    background: #0d6efd;
    color: #fff
}

.contact .requis {
    font-size: 11px
}

.intro-contact {
    color: #fff
}

.contact form {
    margin: 0 auto;
    display: block;
    padding: 5px 25px
}

div.contact {
    display: flex;
    justify-content: center
}

.sticky-footer .fa-paper-plane {
    padding-right: 10px
}

.sticky-footer a {
    color: #fff;
    font-size: 17px
}

.sticky-footer {
    z-index: 9999999;
    color: #fff;
    position: fixed;
    right: 2px;
    bottom: 0px;
    background: #0D6EFD;
    padding: 7px 15px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.itemname {
    background: #0080DB;
    color: #fff;
    padding: 5px 15px
}

.control_iban {
    opacity: 0;
    width: 0
}

h1.entry-title {
    background: #fff;
    padding: 5px 25px;
    border-left: 10px solid #DB741D
}

.vehicule-filters {
    border: 1px solid #ddd
}

.bg-gray-200 {
    background: var(--gray-200);
}

.back-to-list {
    font-size: 20px;
    text-transform: none;
    width: 40%;
    max-height: 50px;
}

.contact-ad {
    margin-left: auto;
    border: 1px solid #ddd;
    background: #f2f2f2;
    box-shadow: 0 0 1px #777;
    border-radius: 5px;
    padding: 7px 16px
}

.contact-ad a {
    margin: 5px auto;
    display: block;
    text-align: center
}

.marque {
    border-bottom: 1px solid #ddd;
}

.isotope-pager {
    position: absolute;
    bottom: 5px;
    width: 100%;
    display: flex;
    justify-content: center
}

#vehicule-container {
    padding-bottom: 60px
}

.pager {
    padding: 4px 7px
}

.pager.active {
    background: #195982;
    color: #fff
}

.details-annonce li {
    display: flex
}

.details-annonce li span:last-child {
    margin-left: auto
}

.immat {
    position: relative;
    border: 1px solid #444;
    text-align: center;
    height: 28px;
    width: 60%;
    margin: 1px auto 15px auto;
}

.immat::before {
    position: absolute;
    left: 0px;
    content: '';
    width: 7px;
    height: 27px;
    background: rgb(51, 119, 220)
}

#wrapper-footer-full {
    display: flex
}

#wrapper-footer-full>div {
    padding: 25px 2px
}


.card-horizontal {
    display: flex;
    flex: 1 1 auto;
}

.list-group-flush li {
    line-height: 20px;
    display: flex;
}

.list-group-flush li i {
    padding-right: 10px;
}

.list-group-flush li span:last-child {
    margin-left: auto
}

.invalid-feedback {
    margin-top: 0px !important
}

.bg-primary {
    background-color: var(--primary) !important
}

.btn-red {
    background: #D4352E;
    color: #fff !important;
    text-transform: none;
}

.btn-orange {
    background: #822626
}

.bg-gray-800 {

    background-color: var(--gray-800);
}

.bg-gray-400 {

    background-color: var(--gray-400);
}

.bg-gray-200 {

    background-color: var(--gray-200);
}

.btn-primary {
    color: #fff;
    background-color: #195982 !important;
    border-color: #195982 !important;
}

.btn-primary:hover {
    color: #fff;
    background-color: #5a0066;
    border-color: #4f0059;
}

h1 {
    font-size: 27px
}

.kv-file-content {
    width: 100% !important
}


.desktop_hidden {
    display: none
}


#Header {
    position: fixed;
    height: 70px;
    width: 100%;
    padding-top: 12px;
    top: 0px;
    z-index: 999;
    transition: background-color 1.2s ease-in-out;
    background: rgba(100, 100, 100, 0.5);

    background: #fff;

}

.header {
    display: flex;
    width: 100%;
    max-width: 1140px;
    margin: 0 auto;
    justify-content: space-around;
    padding: 0 30px
}

/*.list-car{background: #f0f0f0}*/
.flex {
    display: flex
}

body {
    position: relative;
    font-family: 'IBM Plex Sans Arabic', sans-serif;
    background: #eee;

}

#Header #socialHeader {
    justify-content: center;
    display: flex;
    flex-basis: 55%;
    width: 55%;
}

#Header #socialHeader img {
    width: 25px;
    margin: 0 15px;
}

#Header #loginHeader a {


    border: none;
    box-shadow: none;
    font-weight: bold;
    z-index: 9999;
    transition: background-color 1.9s ease-in-out;
}

#Header a:not(.custom-logo-link) {
    padding: 5px 12px;
    font-family: 'Roboto', sans-serif !important;
    font-size: 16px !important;
}

#Header #becomePartner a {

    background: #0d6efd;
    color: #fff;
    border: none;
    box-shadow: none;
    font-weight: bold;
    z-index: 9999
}

#full-width-page-wrapper {
    padding-top: 30px
}

#Header .end a {
    padding: 7px 20px
}

.end {
    display: flex;
    margin-left: auto;
    width: 40%;
    flex-basis: 40%;
    justify-content: space-around;
    margin-top: 5px;
    z-index: 999
}

.extra-img {
    width: 100%
}

._remaining {
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    width: 100%;
    padding: 9px 20px 15px 20px;
    height: 135px;
    background: var(--primary);
    color: #fff
}

._remaining p {
    padding-left: 35px;
    text-align: center;
    font-size: 15px;
}

._remaining::before {

    content: '\f2f2';
    font-family: 'Font Awesome 5 FRee';
    color: #fff;
    position: absolute;
    margin-top: -40px;
    margin-left: -30px;
    width: 45px;
    height: 80px;
    transform: rotate(45deg);
    background-color: var(--secondary)
    /* to see where it is */
}

.bg-fond-rouge {

    background-color: var(--fond-rouge);
}

.biding {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: var(--primary);
    border-radius: 15px;
    border: 1px solid #777;
}

.btn-biding {
    background: var(--secondary);
    color: #fff
}

.biding h4 {
    color: #fff;
    font-size: 19px;
    margin-bottom: 0px;
}

.alert-devenir-partenaire {
    margin-top: 30px
}

.biding-feature {
    width: 100%;
    display: block
}

.biding-feature img {
    width: 100%
}

.biding .btn-biding:hover {
    color: #fff
}


.help {

     width: 100%;display: flex;
    justify-content: space-between;
   

    background: rgba(40, 160, 70, 0.8);
    border-radius: 12px;
    box-shadow: 0 0 07px #888;
    padding: 12px ;
    align-items: center
}

.help div:last-child {
    font-size: 15px;
    color: #fff
}

.card-link {
    text-transform: none;
    font-size: 17px;
}

.help div:first-child {
    padding-right: 0px
}

.help .fa-calendar-check {
    color: #fff;
    font-size: 24px;
    vertical-align: center;
    padding-top: 3px;
}


.has-biding {
    position: absolute;
    top: 5px;
    left: 5px;
    font-size: 14.4px
}

#description {
    padding: 15px 35px;
}

#description>div {
    padding-left: 20px;
    border-left: 2px solid var(--secondary);
}

.home #wrapper-navbar,
.home h1 {
    display: none !important
}

.accroche {

    color: #fff;

    margin-bottom: 45px;

    position: relative;
    z-index: 10;

}

.accroche h1 {
    display: block !important;
    margin-bottom: 45px;
    font-size: 37px;
}

.accroche a {
    font-size: 26px;
    width: 40%;
    text-align: center;
    border-radius: 25px;
    border: 1px solid #fff;


}

.btn-vendeur {
    background: #DB741D;
    color: #fff !important;
    font-size: 20px;

}

.btn-acheteur {
    background: #0d6efd;
    color: #fff !important;
    font-size: 20px;

}

#top-background::before {
    content: '';
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 0;
    left: 0;
    right: 0px;
    bottom: 0px;




}

.inscription .cta {
    position: absolute;
    bottom: 40px;
    text-align: center;
    width: 100%;
    display: inline-block
}

.inscription {
    padding: 25px 55px;
    border-radius: 20px;
    min-height: 405px;
    position: relative
}

#video {
    position: relative
}

#_video {
    border-radius: 20px
}

#imgVideo {
    position: absolute;
    top: -10px;
    border-radius: 17px;
    border: 7px solid #DB741D;
    overflow: hidden
}

#imgVideo:hover {
    cursor: pointer
}

.vendeur h3 {
    color: #DB741D
}

.acheteur h3 {
    color: #0d6efd
}

#top-background {
    position: relative;
    height: 580px;
}

.revendeur.intro-account {
    padding: 10px 30px;
    background: rgba(219, 116, 29, 0.2)
}

.acheteur.intro-account {
    padding: 10px 30px;
    background: rgba(13, 110, 253, 0.2)
}

.link-to-car-page {
    background: #fff;

    height: 50px;
    position: relative;
    z-index: 10;
    border-radius: 5px;


}

#stats {
    box-shadow: 0 0 5px #444
}

.lsow-number {
    width: 100%
}

.stat-right .lsow-odometer {
    text-align: right !important
}

.stat .odometer-inside {
    position: relative;
    font-size: 45px !important
}

.stat .lsow-suffix {
    font-size: 25px !important;
    display: block;
    width: 100%
}

.stat.vendeurs .lsow-odometer:last-child .lsow-suffix {
    color: #DB741D !important
}

.stat.vendeurs .lsow-odometer:last-child .odometer-value {
    color: #DB741D !important
}

.stat.vendeurs .lsow-odometer .odometer-value {
    font-size: 45px !important;
    letter-spacing: -5px !important;
}

.stat.vendeurs .lsow-odometer .odometer-digit {
    letter-spacing: -5px !important
}

.stat.acheteurs .lsow-odometer:last-child .lsow-suffix {
    color: #0D6EFD !important;
    margin-top: -15px
}

.stat.acheteurs .lsow-odometer:last-child .odometer-value {
    color: #0D6EFD !important
}

.stat.acheteurs .lsow-odometer .odometer-value {
    font-size: 45px !important;
    letter-spacing: -5px !important;
}

.stat.acheteurs .lsow-odometer .odometer-digit {
    letter-spacing: -5px !important
}

.link-to-car-page>div>div>div:first-child {
    position: relative;
    color: #222;
    margin-bottom: 0px;
    padding-left: 25px;
    padding-top: 7px;


    font-size: 22px;
}

.link-to-car-page>div>div>div:last-child {
    position: absolute;
    right: 0px;
    bottom: 0px;
    top: 0px;

}

.link-to-car-page a {
    color: #fff;
    display: flex;
    border-radius: 5px;
    align-items: center;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;

    font-size: 20px;
    padding: 2px 15px 0px 15px;
    background: #195982;

    font-weight: 600;
    height: 100%;
    box-shadow: 0 0 4px #444;

}


.link-to-car-page a:hover {
    text-decoration: none;
}

span.fa-search {
    font-size: 18px;
    padding-right: 12px
}

#sell,
#_buy {
    margin-top: -90px;
    border-radius: 20px !important;
    z-index: 50;
    position: relative;
    background: #fff;
    padding-top: 25px !important;
    padding-bottom: 20px !important;
}


#sell h3,
#_buy h3 {
    font-size: 24px;
    text-align: center;
    padding-bottom: 30px;
}

#sell h3+div p:first-child,
#_buy h3+div p:first-child {

    padding-bottom: 25px;
}

.home-template {
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin-top: -50px
}

.home #page {
    width: 100%
}


#btn-control span {
    font-weight: bold;
    font-size: 19px
}

#page {
    padding: 95px 0px 0px 0px;
    max-width: 1140px;
    width: 100%;
    margin: 0 auto;
}




.home #page {
    padding-top: 30px
}

.custom-logo-link img {
    height: 50px;
    width: auto;

    padding: 0px 5px 5px 5px;
}

#wrapper-footer {
    height: 150px
}

.desktop-hidden {
    display: none
}

#wrapper-navbar {
    display: none
}

#wrapper-footer {
    position: relative
}

.widget-title,
.home-block h3 {
    font-weight: bold;
    color: #195982
}

#bon-savoir {
    border-radius: 10px;
    /*text-align: justify*/
}

/*#bon-savoir h6::before{ content: '👍';  font-size: 30px;margin-top: -25px;padding-right: 10px}*/

.angry {
    position: relative
}

.angry::before {
    content: '😧';
    display: block;
    width: 100%;
    padding-right: 25px;
    text-align: center;
    font-size: 30px;
}

#bon-savoir h6 {
    font-weight: bold
}

.lsow-accordion.style2 .lsow-panel .lsow-panel-title::before {
    background: #195982 !important
}

ul.check {
    list-style: none;
}

ul.check li::before {


    content: '\f14a';


    font-family: 'Font Awesome 5 Free';

    font-size: 15px;

    font-style: normal;

    font-weight: normal;

    padding-right: 10px;

    color: #149595;

}

h3.smile::before {
    content: '😀';
    padding-right: 25px;
    font-size: 25px
}

.wrapper-footer {
    background: #302929;
}

#wrapper-footer-full {
    background: #302929;
    width: calc(80% - 6px);
    margin: 0 auto
}

#wrapper-footer-full div {
    color: rgb(163, 160, 160)
}

#wrapper-footer-full div a {
    color: #fff !important
}

#wrapper-footer-full h3 {
    color: #fff;
    font-weight: 400;
    font-size: 20px
}

.alert-devenir-partenaire h4::before {

    content: '🚀';
    padding-right: 25px;
    font-size: 25px
}

.alert-devenir-partenaire h4 {
    font-weight: bold;
    text-align: center;
    padding-top: 25px;
    color: #195982
}

.alert-devenir-partenaire .wondering::before {
    content: '🤔';
    padding-right: 25px;
    font-size: 25px
}


.send-constat h4::before {

    content: '👍';
    padding-right: 25px;
    font-size: 25px
}


.terms .content {
    height: 250px;
    overflow-y: scroll;
    text-align: justify;
    padding: 10px 25px;
    border: 1px solid #ccc;
}
#partenaires>div{height: 275px}
#partenaires>div .card{height: 275px}


#partenaires .card-body {
    position: relative;
}
.xpcar .card-body{flex-basis: 66.7%!important}

.xpcar img{height: 100%;width: 183px!important}
.xpcar .img-square-wrapper{width: 183px!important;flex: 1 183px!important;}
.xpcar a{margin-top: 25px;display: inline-block}

.xpcar p{text-align: center}
#partenaires .card-footer {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
}

#partenaires .xpcar .card-footer {
    background: #FBE122;
    color: #000;
    font-weight: :bold;
}

#partenaires .garage-midi .card-footer {
    background: #82B341;
    color: #000;
    font-weight: :bold;
}


.annonce-list h5 {
    width: 100%;
    flex-basis: 100%
}

.annonce-list {
    flex-wrap: wrap
}

.image-annonce-list {
    flex-basis: 30%
}

.btn-kv-close {
    display: none
}


.infos-texte {
    display: none
}

.file-drop-zone {
    height: 320px
}

.file-drop-zone-title {
    font-size: 15px
}

.file-preview {
    height: 390px
}

.dialogWide>.modal-dialog {
    position: relative;
    width: 60% !important;
    max-width: 60% !important;
}

.dialogWide .modal-content {

    overflow-y: scroll;
}

#dialog-actions {

    display: flex;


    justify-content: space-between;
    background: #fff;
    padding: 15px 25px;
    text-align: right;
}
.wrapper-canvas{height: 100%;overflow-y: scroll}
#save-canvas {
    background: #22BB33;
    padding: 7px 20px;
    color: #fff;
    border-radius: 10px
}

#reset-blur {
    background: rgba(170, 170, 170, 0.7);
    color: #222;
    padding: 7px 20px;
    border-radius: 10px
}

.wrapper_progress {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap
}

.wrapper_progress p {
    width: 100%
}

.progress_loading_canvas {
    height: 150px
}

.progress img {
    width: 100%
}

.instructions,
#dialog-actions {
    display: none
}

.instructions {
    padding: 10px 25px;
    background: #eaeaea;
    margin-bottom: 25px
}

.hidden {
    display: none
}

.bootbox-body {
    position: relative
}

.wrapper_progress_save {
    display: none;
    position: absolute;
    height: 800px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    background: rgba(150, 150, 150, 0.2)
}

.wrapper_progress_save p {
    position: absolute;
    top: -20px;
    width: 80%;
    margin: 0 auto;

    font-size: 25px;
    font-weight: bold;
    text-align: center;
    background: #195982;
    color: #fff;
}

.rapport-expert div a:first-child{height: 300px;overflow-y: hidden}

.rapport-expert div a:last-child{background: rgb(25, 89, 130);color: #fff}

.account-succes{ height:100px; }

.account-succes .side{ flex: 1;background:#2E9482;padding:25px;display:flex;align-items:center;
    justify-content:center }

    .account-succes i{font-size:65px;color:#fff}

    .account-succes .main {flex:10;padding: 15px 25px;background: var(--gray-200)}

    #args .card{height: 445px; box-shadow: 0px 3px 6px 0px rgba(61, 87, 119, 0.2);

        transition: transform .4s;}

        #args .card:hover {
            transform: scale(1.05);
            box-shadow: 0px 4px 8px 0px rgba(61, 87, 119, 0.3);
        }


        .current-bid{background: #fff;color:#000;padding: 5px 10px;margin-bottom: 25px;display: flex; flex-direction: column}

           .current-bid span{font-size: 14px}


           .info-enchere{color:#fff;line-height: 15px;font-size: 12px}

           .commissions{background: #0D6EFD;color: #fff;padding: 5px 10px;margin-top: 15px;font-size: 13px}

           .commissions p{margin-bottom: 0px;display: flex;justify-content: space-between}