@import url(https://fonts.googleapis.com/css?family=Dosis:400,200,300,500,600,700,800);
@import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,200,700);

@font-face {
    font-family: Neuropol;
    src: url('/Neuropol.ttf');
}

.NeuropolFont {
    font-family: Neuropol;
}

body {
    margin: 0;
    padding: 0;
    height: 100%;
}

.verticalSeparator {
    margin-top: 0px;
    text-align: center;
    padding: 0 !important;
}

/* Margin entre les panels */
.row > .panel {
    margin-bottom: 10px;
}

.pr-0 {
    padding-right: 0px !important;
}

.pl-0 {
    padding-left: 0px !important;
}

.pt-0 {
    padding-top: 0px !important;
}

.pb-0 {
    padding-bottom: 0px !important;
}

.pt-1 {
    padding-top: 15px !important;
}

.pb-1 {
    padding-bottom: 15px !important;
}

.mt-0 {
    margin-top: 0px !important;
}

.mr-1 {
    margin-right: 15px !important;
}
.mb-0 {
    margin-bottom: 0px !important;
}

.display-flex {
    display: flex !important;
}

/* XXS MAX */
@media (max-width: 350px) {

    .hidden-xxs {
        display: none !important;
    }

    .visible-xxs {
        display: block !important;
    }

    .xxs-flex {
        display: flex !important;
    }

    .mt-xxs-1 {
        margin-top: 13px;
    }
}

/* XS MIN */
@media (max-width: 768px) {
}

/* XS MAX */
@media (max-width: 768px) {
    .mr-xs-1 {
        margin-right: 15px !important;
    }
<<<<<<< .working
||||||| .merge-left.r1827

    .pt-xs-1 {
        padding-top: 15px !important;
    }

    .pr-xs-0 {
        padding-right: 0px !important;
    }

    .pl-xs-0 {
        padding-left: 0px !important;
    }
=======

    .pt-xs-1 {
        padding-top: 15px !important;
    }

    .pr-xs-0 {
        padding-right: 0px !important;
    }
    .pb-xs-1 {
        padding-bottom: 15px !important;
    }
    .pl-xs-0 {
        padding-left: 0px !important;
    }
>>>>>>> .merge-right.r1845
}

/* SM MAX */
@media (min-width: 350px) and (max-width: 768px) {

    .mt-xs-1 {
        margin-top: 13px;
    }

    .hidden-xs2 {
        display: none !important;
    }

    .xs-flex {
        display: flex !important;
    }
}

.mr-iban-1 {
    margin-right: 15px !important;
}

.right-col-banque {
    padding-top: 15px !important;
}

.pb-blockVar {
    padding-bottom: 15px !important;
}

@media (max-width: 991px) {
    .right-col-banque {
        padding-top: 0px !important;
    }
}

@media (max-width: 991px) {
    .mr-iban-1 {
        margin-right: 0px !important;
    }
    .pb-blockVar {
        padding-bottom: 10px !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .pb-sm-min-1 {
        padding-bottom: 15px;
    }
}

/* SM MAX */
@media (max-width: 767px) {
    .btn-ajouter-justificatif {
        margin-bottom: 10px;
        float: right;
        margin-left: 23px;
        margin-top: 20px;
    }
}

.col-custom-1 {
    flex: 0 0 4.16666%;
    max-width: 4.16666%;
}

.slashSeparator {
    margin-left: -2px;
    margin-right: -15px;
    padding: 0px !important;
    text-align: center;
    width: 0px !important;
}

/* SM MIN */
@media (min-width: 768px) {
    .slashSeparator-sm {
        margin-left: -2px;
        margin-right: -15px;
        padding: 0px !important;
        text-align: center;
        width: 0px !important;
    }

    .libelle-xs-15 {
        margin-left: -10px;
        margin-right: -15px;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .ml-sm-min-15 {
        margin-left: -15px;
    }

    .link-ajouter-justificatif
    {
        display:grid;
    }
}

/* MD MIN */
@media (min-width: 992px) {
    .ml-md-s {
        margin-left: -20px;
    }
    .small-input {
        padding-right: 0px !important;
        padding-left: 0px !important;
    }
    .pl-md-0 {
        padding-left: 0px !important;
    }
    .pr-md-0 {
        padding-right: 0px !important;
    }
    .text-nb-justificatif
    {
        padding-top:7px;
    }
}

.noPadding {
    padding: 0 !important;
}

.noPadding input {
    padding: 0 !important;
    text-align: center;
}

body label {
    font-size: 13px;
    line-height: 29px;
}

.spaceForm {
    height: 48px;
}

.lineHeight {
    height: 34px;
}

.form-group .row, .left-col-banque .row, .right-col-banque .row {
    margin-bottom: 1em;
}

/* css pour le btn annuler usager modifs */
.annulerUsagerModifs {
    color: black;
    background-color: #C9F296;
}

.resultatUsagerModifs {
    color: black;
    background-color: #ff6a00;
}

/* css pour menuPrincipale */
.menuPrincipale .carousel {
    margin-bottom: 0;
    padding: 0 40px 30px 40px;
}

.carousel-control {
    left: -12px;
    width: 55px;
}

    .carousel-control.right {
        right: -12px;
        background-image: none;
    }

    .carousel-control.left {
        background-image: none;
    }

.menuPrincipale .carousel-indicators {
    right: 50%;
    top: auto;
    bottom: 0px;
    margin-right: -19px;
}

    .menuPrincipale .carousel-indicators li {
        background: #c0c0c0;
    }

    .menuPrincipale .carousel-indicators .active {
        background: #333333;
    }

.menuPrincipale {
    max-width: 1200px;
    margin-top: 100px;
}



    .menuPrincipale .well {
        background-color: transparent;
    }


        .menuPrincipale .well img {
            background-color: transparent;
            border: 1px solid transparent;
        }

        .menuPrincipale .well .thumbnail {
            background-color: transparent;
            /*border:1px solid transparent;*/
            margin: 20px;
            background-color: transparent;
            /*border:3px solid white;*/
            margin: 20px;
            width: 100px;
            height: 100px;
            margin-top: 40px;
            margin-bottom: 40px;
        }

            .menuPrincipale .well .thumbnail:hover {
                border-color: black;
            }

        .menuPrincipale .well p {
            color: green;
            background-color: transparent;
            border: 1px solid transparent;
        }

    .menuPrincipale .glyphicon-chevron-left {
        /*background-color:black;*/
        border-radius: 50%;
        color: black;
    }

    .menuPrincipale .glyphicon-chevron-right {
        /*background-color:black;*/
        border-radius: 50%;
        color: black;
    }

/*  fin css pour menuPrincipale */

/*   css pour usagerInfos */

@import url('https://cdnjs.cloudflare.com/ajax/libs/select2/3.4.8/select2.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/select2/3.4.8/select2-bootstrap.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css');

.timepicker-picker .table-condensed td {
    text-align: center
}


/*  fin css pour usagerInfos */

/*   css pour operation usager */

.usagerInfos label {
}

.usagerInfos table th {
    background-color: #C9F296;
}

.usagerInfos table {
}


.usagerInfos .operationUsager {
    background-color: transparent;
}

    .usagerInfos .operationUsager img {
        height: 30px;
        width: 40px;
    }

    .usagerInfos .operationUsager .nav {
        margin-top: 22px;
    }

        .usagerInfos .operationUsager .nav li {
            margin-left: 15px;
        }
/*   fin css pour operation usager */
/*   css pour menuVerticale */

/*.menuVertical{
    width:140px;
    margin-top:55px;
}*/



.menuVertical {
    width: 140px;
    margin-top: 0px;
}


    .menuVertical .vertical .carousel-inner {
        height: 100%;
    }

    .menuVertical .carousel.vertical .item {
        -webkit-transition: 0.6s ease-in-out top;
        -moz-transition: 0.6s ease-in-out top;
        -ms-transition: 0.6s ease-in-out top;
        -o-transition: 0.6s ease-in-out top;
        transition: 0.6s ease-in-out top;
    }

    .menuVertical.carousel.vertical .active {
        top: 0;
    }

    .menuVertical .carousel.vertical .next {
        top: 400px;
    }

    .menuVertical .carousel.vertical .prev {
        top: -400px;
    }

        .menuVertical .carousel.vertical .next.left,
        .menuVertical .carousel.vertical .prev.right {
            top: 0;
        }

    .menuVertical .carousel.vertical .active.left {
        top: -400px;
        background-image: none;
    }

    .menuVertical .carousel.vertical .active.right {
        top: 400px;
        background-image: none;
    }

    .menuVertical .carousel.vertical .item {
        left: 0;
    }

    .menuVertical .carousel.vertical .carousel-control {
        width: 100%;
        bottom: inherit;
        top: inherit;
    }

        .menuVertical .carousel.vertical .carousel-control.left {
            top: 0;
            margin-left: 10%;
        }

        .menuVertical .carousel.vertical .carousel-control.right {
            bottom: 0;
            margin-right: 10%;
        }

    .menuVertical .glyphicon-chevron-up {
        /*background-color:black;*/
        border-radius: 50%;
        color: black;
    }

    .menuVertical .glyphicon-chevron-down {
        /*background-color:black;*/
        border-radius: 50%;
        color: black;
    }


    .menuVertical img {
        border: 1px solid transparent;
        width: 60px;
    }

    .menuVertical .thumbnail {
        background-color: transparent;
        /*border:3px solid white;*/
        margin: 20px;
        width: 100px;
        height: 100px;
        margin-top: 40px;
        margin-bottom: 40px;
    }

        .menuVertical .thumbnail:hover {
            border-color: green;
        }

    .menuVertical .carousel-inner p {
        background-color: transparent;
        text-align: center;
        font-weight: bold;
        color: black;
        font-size: 10px;
    }


/*   fin css pour menuVerticale */

/*    css pour page layout */



/*************************
*******Typography******
**************************/

body {
    font-family: 'Dosis', sans-serif;
    font-size: 17px;
    color: black;
    background: none;
}

.full {
    background: url('../Ressources/Styles/Images/Arriere-plans/Background.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

/*.cadre{
  width:auto;
  height:auto;

  margin: 50px auto;
  border-radius:6px;
  -webkit-border-radius:6px;
  box-shadow:0px 0px 2px #555, 0px 0px 10px #999,0px 0px 60px #CCC;
}*/

.cadre {
    width: auto;
    height: auto;
    /*background: -webkit-linear-gradient(-90deg, #C3C1BF 0%, #B7B4B0 100%);*/
    margin: 5px auto;
    margin-top: auto;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    box-shadow: 0px 0px 2px #555, 0px 0px 10px #999,0px 0px 60px #CCC;
}


.content {
    position: relative;
    margin-top: 80px;
    padding-bottom: 20px;
}

    .content p {
        margin-top: 30px;
    }

    .content img {
        position: absolute;
        top: -50px;
        border: 5px solid #C9F296;
    }







/*************************
*******Header CSS******
**************************/

#header {
    font-size: 20px;
}

/* css pour la navigation layout sans menu varticale */

.headerNavigationLayotSansMV .navbar-custom {
    /*background-color:#229922;*/
    background-color: #C9F296;
    color: #ffffff;
    border-radius: 0;
}

    .headerNavigationLayotSansMV .navbar-custom .navbar-nav > li > a {
        color: #fff;
        padding-left: 20px;
        padding-right: 20px;
    }

    .headerNavigationLayotSansMV .navbar-custom .navbar-nav > .active > a, .navbar-nav > .active > a:hover, .navbar-nav > .active > a:focus {
        color: #ffffff;
        background-color: transparent;
    }

    .headerNavigationLayotSansMV .navbar-custom .navbar-nav > li > a:hover, .nav > li > a:focus {
        text-decoration: none;
        /*background-color: #33aa33;*/
        background-color: white;
    }

    .headerNavigationLayotSansMV .navbar-custom .navbar-brand {
        color: #eeeeee;
    }

    .headerNavigationLayotSansMV .navbar-custom .navbar-toggle {
        background-color: #eeeeee;
    }

    .headerNavigationLayotSansMV .navbar-custom .icon-bar {
        background-color: #33aa33;
    }

.headerNavigationLayotSansMV .product-img img {
    /*max-width: 100%;*/
    max-width: 100px;
    margin-top: -10px;
    margin-left: -25px;
}

.headerNavigationLayotSansMV span {
    color: black;
    /*font-size: 14px;*/
}

.headerNavigationLayotSansMV li {
    margin-right: 16px;
}

@media (max-width:768px) {
    .headerNavigationLayotSansMV .product-img img {
        max-width: 100px;
    }

    @media (max-width:768px) {
        .menuPrincipale {
            max-width: 300px;
        }

        @media (max-width:320px) {
            .menuPrincipale .thumbnail {
                max-width: 200px;
            }

            /* fin css pour la navigation layout sans menu varticale */
            /******************************** fin Header CSS********************************/


            /*******************************Footer CSS******************************/
            #footer {
                background-color: transparent;
                background-position: center bottom;
                background-repeat: no-repeat;
                background-size: cover;
                color: #FFFFFF;
                font-size: 20px;
                padding: 35px 0;
                max-height: 90px;
            }

                #footer a {
                    color: #f7ab24;
                }

                    #footer a:hover {
                        color: #1B7B98;
                    }
        }
    }
}


/*  css pour le modal de messages */

.propreModel .modal {
    width: 90%; /* desired relative width */
    left: 5%; /* (100%-width)/2 */
    /* place center */
    margin-left: auto;
    margin-right: auto;
    margin-top: 100px;
    max-width: 600px;
}



    .propreModel .modal h2 {
        text-align: center;
    }

    .propreModel .modal p {
        text-align: center;
        padding-top: 130px;
    }




/*   css pour operation hisotorique des passages */

.HistoriquePassage label {
}

.HistoriquePassage table th {
    background-color: #C9F296;
}

.HistoriquePassage table {
}

.HistoriquePassage .operationsHistoriquePassage {
    background-color: transparent;
}

    .HistoriquePassage .operationsHistoriquePassage img {
        height: 30px;
        width: 40px;
    }

    .HistoriquePassage .operationsHistoriquePassage .nav {
        margin-top: 22px;
    }

        .HistoriquePassage .operationsHistoriquePassage .nav li {
            margin-left: 15px;
        }



/*  fin  css pour operation hisotorique des passages */


/* style pour  modal ajout reclamation */

.ajoutReclamation .modal.modal-wide .modal-dialog {
    width: 90%;
}

.ajoutReclamation .modal-wide .modal-body {
    overflow-y: auto;
}

.ajoutReclamation #myModal .modal-body p {
    margin-bottom: 900px
}

/* fin style pour  modal ajout reclamation */



/*  css pour la navigation layout sans menu varticale smartPhone*/

.headerNavigationLayotSansMVSmartPhone .navbar-custom {
    background-color: white;
    color: grey;
    border-radius: 0;
}


    .headerNavigationLayotSansMVSmartPhone .navbar-custom .icon-bar {
        background-color: grey;
    }




/* fin css pour la navigation layout sans menu varticale smartPhone*/


/*   css pour operation chargement des passages */

/*.ChargementPassage label{
    font-size :1.4em !important;
}

.HistoriquePassage .operationsChargementPassage img{
    height:30px;
    width:40px;
  
}*/


/*  fin  css pour operation chargement des passages */


/*************************************************************************************************************************************************************/
/*  css pour menu principal simplifié    */

.navigation-bar {
    margin-bottom: 20px;
}

.navbox-tiles:after {
    content: '';
    display: table;
    clear: both;
}


.navigation-bar.navbox-open .navbox-trigger {
    background-color: #F44336;
}


.navbox-trigger .fa {
    font-size: 20px;
    color: #fff;
}

.navbox-trigger:hover {
    background-color: #484747;
}

.navbox {
    background-color: #484747;
    width: 100%;
    -webkit-backface-visibility: initial;
    backface-visibility: initial;
    /*max-height:665px;*/
    max-height: 675px;
    /*min-height:675px;*/
    overflow: auto;
}

.navbox-tiles {
    width: 100%;
    padding: 25px;
}

    .navbox-tiles .tile {
        display: block;
        width: 100%;
        height: auto;
        padding-bottom: 29%;
        border: 2px solid transparent;
        color: #fff;
        margin-bottom: 80px;
    }



        .navbox-tiles .tile img {
            text-align: center;
            max-width: 100px;
            max-height: 100px;
        }


.MenuElement {
    background-color: #3498db;
    margin-left: 5px;
    margin-bottom: 5px;
    border: 2px solid transparent;
    color: #fff;
    padding-bottom: 20px;
    overflow-y: hidden;
    max-height: 185px;
    max-width: 144px;
}

    .MenuElement:hover {
        border-color: #fff;
        text-decoration: none;
    }

    .MenuElement .tile:hover {
        text-decoration: none;
    }

/* Fin css pour menu principal simplifié    */
/*************************************************************************************************************************************************************/

/*debut style pour la dimension des images d'operations */
.imgOperationDimension {
    max-height: 35px;
    min-height: 35px;
    max-width: 35px;
    min-width: 35px;
}

/*fin style pour la dimension des images d'operations */

.messageErreur {
}

.fontSize {
}

.help-inline {
}