.position-exact {
    top: 0;
    left: 20px;
    display: none;
}

.position-exact p {
    font-size: 14px;
    line-height: 16px;
    font-family: var(--main-font);
}

a.modal-vignette:hover .position-exact {
    display: block;
}

.modal-vignette img {
    height: 231px !important;
    object-fit: cover !important;
}

.modal-title, .description {
    font-size: 16px;
    line-height: 19px;
    font-family: var(--main-font);
}

span.overlay {
    background: #0042ffb3;
    display: none;
    border-radius: 10px;
    height: 231px;
    width: 100%;
    position: absolute;
}

.modal-vignette:hover .overlay {
    display: block;
}

.modal-content {
    background-color: transparent;
    border: 0;
    color: white;
}

.modal {
    z-index: 100000;
    background-color: #0042ffcc;
}

.modal-header {
    border-bottom: none;
}

.modal-footer {
    display: block;
    color: white;
    border-top: none !important;
}

.btn-fleche {
    background-color: transparent;
    border: none;
    box-shadow: none;
}

.btn-link-modal {
    width: 27px !important;
    max-height: 30px !important;
    height: auto !important;
    background-color: transparent !important;
    border: none;
    box-shadow: none;
    border-radius: 0 !important;
}

.modal-content .btn-close {
    background: transparent url("../img/close.svg") center/1em auto no-repeat;
}

.view-more-button {
    background-color: #00E1FF;
    color: #1F2D3D;
    border: 2px solid #00E1FF;
}

.view-more-button:hover {
    background-color: #1F2D3D;
    color: white;
    border: 2px solid white;
}

@media (min-width: 1200px) {
    .modal-xl {
        max-width: 1350px;
    }
}