body {
    padding-top: 5rem;
    background-color: whitesmoke;
}

a:hover {
    text-decoration: none;
}

.main-div {
    padding: 0px;
    margin-top: -20px;
}

.text-fixed {
    font-family: 'monospace';
}

.card {
    margin-bottom: 25px;
    border-width: 3px;
    padding: 5px;
}
.center-container {
    display: flex;
    justify-content: center;
    align-items: center;
}
.card-img {
    height: 300px;
    width: auto;
    display: block;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
}

.card-img-produit {
    height: 150px;
    width: auto;
    display: block;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
}

.cart-img-produit {
    height: 40px;
    width: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

th,
td {
    vertical-align: middle !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}

.BDC_CaptchaDiv {
    margin: auto;
    display: inline;
}

.BDC_Placeholder {
    min-height: 10px !important;
}

.BDC_CaptchaImageDiv>a {
    opacity: 0%;
    cursor: default;
}

#ExampleCaptcha_CaptchaImage {
    margin-top: 5px;
}

.navbar.vert {
    background-color: #0F828F !important;
}

.bleu-uga {
    background-color: #272B42 !important;
}

.border-bleu-uga {
    border: 1px solid #272B42;
}

.border-bleu-uga-epais {
    border: 4px solid #272B42;
}

.text-bleu-uga {
    color: #272B42 !important;
}

main {
    margin: 0px !important;
}

.fond-vert {
    background-color: #0F828F !important;
}

.border-vert {
    border-color: #0F828F !important;
    border-width: 2px !important;
}

.text-vert {
    color: #0F828F !important;
}

.fond-vert-light {
    background-color: #94C7CD !important;
}

.border-violet {
    border-color: #9160B0 !important;
    border-width: 2px !important;
}

.fond-violet {
    background-color: #9160B0 !important;
}

.fond-violet-deep {
    background-color: #5072B2 !important;
}

.text-violet {
    color: #9160B0 !important;
}

.text-violet-light {
    color: #B593CA !important;
}

.border-violet-light {
    border-color: #B593CA !important;
    border-width: 2px !important;
}

.fond-violet-light {
    background-color: #B593CA !important;
}

.card-body {
    padding: 5px;
}

.img-navbar {
    max-height: 30px;
    border-radius: 5px;
}

button:disabled:hover {
  cursor: not-allowed !important;
}

.btn-violet {
    background-color: #9160B0;
    border-color: #9160B0;
    color: white;
}

.btn-violet:hover {
    background-color: #604075;
    border-color: #604075;
    color: white;
}

.btn-violet.disabled {
    background-color: #B593CA;
    border-color: #B593CA; 
    color: rgb(234, 234, 234);
}

.btn-vert {
    background-color: #0F828F;
    border-color: #0F828F;
    color: white;
}

.btn-vert:hover {
    background-color: #09464e;
    border-color: #09464e;
    color: white;
}

.btn-vert.disabled {
    background-color: #64898e;
    border-color: #64898EFF;
    color: rgb(234, 234, 234);
}

div.form-group {
    margin-bottom: 8px;
}
label {
    margin-bottom: 3px;
    font-weight: bold;
    color: #6A6A6A;
}
label.required {
    color: #E84E0F;
}
small {
    margin-top: 0 !important;
    font-style: italic;
}
.clickable:hover {
    cursor: pointer !important;
}
.unclickable:hover {
    cursor: not-allowed !important;
}
.disabled:hover {
    cursor: not-allowed !important;
}
:where(.fond-violet.clickable):hover {
    background-color: #604075 !important;
}
:where(.fond-violet-deep.clickable):hover {
    background-color: #324770 !important;
}
:where(.fond-vert.clickable):hover {
    background-color: #94C7CD !important;
}
span.alert-danger.d-block {
    padding: 8px 10px 8px 10px !important;
    margin-bottom: 10px !important;
}
table.table-condensed tr td, table.table-condensed tr th {
    padding: 3px !important;
    vertical-align: middle !important;
}
table.table-xs tr td, table.table-condensed tr th {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    vertical-align: middle !important;
}
.btn, .card, .card-header {
    border-radius: 0px !important;
    border-width: 0px !important;
}
.hovered:hover {
    border-color: #604075 !important;
    opacity: 0.75;
}
.ombre{
    box-shadow: 0 0 10px rgba(0,0,0,.2);
    transition: box-shadow .3s;
}
.ombre:hover {
    box-shadow: 0 0 15px rgba(96,64,117,.9);
}
:where(.text-violet.hovered.clickable):hover {
    color: #604075 !important;
    opacity: 1 !important;
}
table.table-agenda tr td, table.table-agenda tr th {
    height: 30px !important;
}
table.table-agenda-entreprise tr td, table.table-agenda-entreprise tr th {
    height: 20px !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
}
.list-group-item {
    background-color: transparent;
}
.btn-back {
    position: absolute; left:10px; top:10px;
}
.btn-back:hover {
    transform:scale(1.1);
    cursor: pointer;
}
.zoom-hover:hover {
    transform:scale(1.1);
    cursor: pointer;
}
.page-link {
    color : #0F828F !important;
}
li.page-item {
    color : #0F828F;
    background-color: white;
}
li.page-item.disabled a.page-link {
    color : gray !important;
}
li.page-item.active a.page-link {
    color : white !important;
    border-color: #0F828F;
    background-color: #0F828F;
}
.border-bottom-epais {
    border-bottom: 2px solid;
}

/*
img.img-expand:hover {
    max-height: 80px !important;
}
*/

@media print {
    .no-print, .navbar, .no-print * {
        display: none !important;
    }
    .main {
        margin-left: 0;
        width: 100%;
        background-color: white !important;
    }
    body {
        padding-top: 0 !important;
        background-color: white !important;
    }
}

.hide {
    visibility: hidden !important;
}
.page-break {
    page-break-before: always;
}

.ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: '…';
}
.border-right-medium {
    border-right-width: medium !important;
}

/* pour DataTables */
.controlTab {
    margin-left: 15px;
    padding-left: 0px;
    padding-right: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
    width: 98%;
}

.dt-paging-button, .dt-button {
    padding: 2px 8px 2px 6px !important;
    margin: 0 !important;
}

.dt-input {
    margin: 0 !important;
}
#dt-search-0 {
    font-style: italic;
    width: 100%;
}

#dt-length-0 {
    font-size: 9pt;
    width: 100%;
}

ul.pagination {
    font-size: 9pt;
}

div.dt-info {
    font-size: 9pt;
    font-style: italic;;
    padding-top: 0px;
}

div.dt-search {
    font-size: 9pt;
}

.dt-layout-row:not(.dt-layout-table) {
    padding:6px;
    margin: 0px;
    border: 1px solid #272B42;
}

/* textarea growable */
.grow-wrap {
    /* easy way to plop the elements on top of each other and have them both sized based on the tallest one's height */
    display: grid;
}
.grow-wrap::after {
    /* Note the weird space! Needed to preventy jumpy behavior */
    content: attr(data-replicated-value) " ";

    /* This is how textarea text behaves */
    white-space: pre-wrap;

    /* Hidden from view, clicks, and screen readers */
    visibility: hidden;
}
.grow-wrap > textarea {
    /* You could leave this, but after a user resizes, then it ruins the auto sizing */
    resize: none;

    /* Firefox shows scrollbar on growth, you can hide like this. */
    overflow: hidden;
}
.grow-wrap > textarea,
.grow-wrap::after {
    /* Identical styling required!! */
    border: 1px solid black;
    padding: 0.5rem;
    font: inherit;

    /* Place on top of each other */
    grid-area: 1 / 1 / 2 / 2;
}