@media screen and (min-width: 1086px) {
    #flyout_links{
        display: none;
    }
    .hamburger{
        display: none;
    }
    .layout-mobile, .outputmobile{
        display:none;
    }
    
    .body{
        font-size: 16px;
    }
    #img-table{
        border-radius:0px;
        width:93.5%;
        margin-left:1.6%;
        margin-right:auto;
    }

    .vertical-center{
        position:relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    .blog{
        padding-right: 4%;
    }
    .creneau{
        display:inline-flex;
    }
    table{
        margin:2.5%;
        width:95%;
    }
    td, th{
        vertical-align: top; /* Aligns content to the top */
        text-align: left;
        padding: 5px;
        padding-top: 3px;
        width:12%;
        border-radius: 5px;
    }

    .agendatable-th1{
        width: 40% ;
    }
    .agendatable-th2{
        width: 10%;
    }
    .agendatable-th3{
        width: 10%;
    }
    .agendatable-th4{
        width: 20%;
    }

    .layout-grid{
        position: fixed;
        display: grid;
        grid-template-columns: 15% 70% 15%;
        grid-template-rows: 5% 5% 5% 5% 5% 8% 8% 8% 4% 4% 4% 4% 4% 4% 15% 10%;
        grid-template-areas: 
        "home output astuce"
        "logo output astuce"
        "logo output astuce"
        "logo output astuce"
        "logo output actu1"
        "m1 output actu1"
        "m2 output actu1"
        "m3 output actu1"
        "m5 output actu1"
        "m5 output temoin1"
        "m6 output temoin1"
        "m6 output temoin1"
        "m7 output temoin1"
        "m7 output temoin1"
        "m8 output temoin1"
        "footer footer footer";
        box-sizing: border-box;
        width: 100%;
        overflow: hidden;
        height: 100%; 
        min-height: 100vh;
    }
  
    .rdv-container{
        width: 95%;
    }
    .rdv-container-left{
        width: 60%;
        float: left;
        margin-right: 5%;
    }
    .rdv-container-left th,
    .rdv-container-left td{
        max-width: 100%;
    }
    .rdv-container-right{
        margin-top:.25%;
        width: 35%;
        float: right;
    }
    .layout-logo{
        transform: scale(0.9);
        width:100%;
        height: 100%;
        margin: 0;

    }

    

    .outputsite{
        position:relative;
        display: flexbox; /* Ensure it behaves as a block-level element */
        box-sizing: border-box; /* Include padding and border in the element's total width and height */
        width: 100%; /* Ensure it takes full width */
        height: 102%; /* Ensure it takes full height */
        z-index: 0;
        margin-left: auto;
        margin-right: auto;
        outline: none;
        grid-area: scrollable-content;
        overflow-y: auto;

    }
    

   
    .rdv{
        width: 95%;
        display: grid;
        margin-top:3.5%;
        grid-template-columns: repeat(1, 1fr); /* 3 columns */
    }
    .rdvitem{
        display:inline-flex;
        background-color: #16acde;
        text-align: left;
        border-radius: 5px;
        margin-top:1%;
    }
    .contact{
        width: 100%;
        display: grid;
        grid-template-columns: 2fr 3fr 2fr;
        margin-bottom: 5%;
    }
    .contactitem{
        background-color: rgb(232, 231, 231);
        text-align: center;
        border-radius: 5px;
        margin:1%;
    }
    .block{
        display: block;
    }
    .modal {
        display: none;
        position: fixed;
        z-index: 10;
        padding-top: 60px;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: auto;
        background-color: rgb(0,0,0);
        background-color: rgba(0,0,0,0.4);
    }
    .modal-content {
        background-image: url('/static/img/redblack.webp');
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        margin: auto;
        padding: 20px;
        border: 1px solid #888;
        width: 37%;
        height:78%;
        box-shadow: 
        inset 0 0 0 2px #E3D4B9,
        0 2px 5px 2px rgba(0,0,0,.3);
        border-radius: 5px;
    }
    .modal-content > p{
        width:75%;
        font-size: 2em;
        color:white;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* Add shadow to the text */
    }
    .close {
        color: #aaa;
        float: right;
        font-size: 28px;
        font-weight: bold;
    }
    .close:hover,
    .close:focus {
        color: black;
        text-decoration: none;
        cursor: pointer;
    }
    
}