#modal-info{
position: fixed;
top: -20%;
left: 0;
width: 100%;
height: 100%;/*
background: rgba(0, 0, 0, 0.5); /* Fond semi-transparent */
display: flex;
justify-content: center;
align-items: center;
z-index: 4;}

#header-modal-i{
text-align: center;
padding-bottom: 30px;}

#content-modal-i{
position: relative;
width: 360px;
padding: 20px;
background-color: #3f3f3f88;
border-radius: 10px;
box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 
0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;}

#titre-modal-i{
font-size: 17px;
padding: 34px 25px 2px 25px;
text-align: center;}

.button-i{
width: 100%;
margin-top: 12px;
margin-bottom: 0px;
padding: 12px 0px 12px 0px;
background-color: #007bff;
color: white;
border: none;
border-radius: 6px;
cursor: pointer;
font-size: 14px;
text-align: center;}

.button-i:hover{
background-color: #0056b3;}


#close-modal-i{
position: absolute;
float: right;
top: -6px;
right: -1px;
cursor: pointer;
font-size: 23px;
color: #222222;
font-family: Arial, Helvetica, sans-serif;
padding: 10px;}

#close-modal-i:hover{
color: white;}


/* MOBILES en mode portrait */
@media (max-width: 600px) and (orientation: portrait) 
{
    #modal-info{
    position: relative;
    top: 90px;
    align-items: flex-start;}

    #modal-i{
    width: 340px;}

    #content-modal-i{
    width: 300px;
    background-color: #4b4b4b88;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 
    0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
    font-size: 17px;}

}

/* MOBILES en mode paysage */
@media (max-width: 1000px) and (orientation: landscape) 
{

    #modal-info{
    position: relative;
    top: 40px;
    align-items: flex-start;}

    #modal-i{
    width: 340px;}

    #content-modal-i{
    width: 300px;
    background-color: #4b4b4b88;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 
    0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
    font-size: 17px;}

}