.message-enigme
{
    border: solid 2px #aaa;
    border-radius: 10px;
    padding: 20px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

.bd-placeholder-img
{
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

@media (min-width: 768px)
{
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}

.footer
{
    width: 2.5rem;
    height: auto;
}

.lien_titre
{
    color: #212529;
    text-decoration: none;
}

.lien_titre:hover
{
    color: #5a5f64;
    text-decoration: none;
}

input.reponse
{
    padding: 5px;
    color: #666;
    border: solid 1px #666;
    border-radius: 5px;
    outline: 0 none;
}

input.reponse:focus
{
    color: #333;
    border-color: rgb(13, 100, 207);
    box-shadow: 0 0 0 1px rgb(13, 100, 207) inset, 0 0 0 1px #fff, 0 0 0 3px rgba(13, 100, 207, 0.4);
}

input.reponse.correct
{
    color: rgb(49, 147, 70);
    background-color: rgba(49, 147, 70, 0.07);
    border-color: rgb(49, 147, 70);
    box-shadow: 0 0 0 1px rgb(49, 147, 70) inset, 0 0 10px rgba(49, 147, 70, 0.6);
}

input.reponse.incorrect
{
    color: rgb(236, 0, 0);
    background-color: rgba(236,0, 0, 0.07);
    border-color: rgb(236, 0, 0);
}

input.reponse.incorrect:focus
{
    box-shadow: 0 0 0 1px rgb(236, 0, 0) inset, 0 0 0 1px #fff, 0 0 0 3px rgba(236, 0, 0, 0.4);
}

span.afficher_indice
{
    cursor: pointer;
}

span.afficher_indice:hover
{
    text-decoration: underline;
}