@media screen and (max-width: 1024px) {
    html, body {
        margin: 0px;
        padding: 0;
        height: 98%;
        background-color: #F0F8FF;
        font-family: Sans-Serif;
        overscroll-behavior: contain;
    }

    #wrapper {
        position: relative; /* référent du footer */
        /*min-height: 100%;*/
        width: 100%;
    }

    #container {
        padding-bottom: 0px; /* padding-bottom = hauteur du footer */
        min-height: 100%;
    }

    #content {
        background-color: #F0F8FF;
        margin: 0px 0px 0px 0px;
        padding: 10px 10px 0px 10px;
        border: 0px solid #496077;
        border-radius: 10px;
        min-height: 100%;
    }

    #footer {
        position: absolute;
        width: 100%; /* obligatoire si la largeur du footer n'est pas spécifiée explicitement dans le code CSS */
        height: 30px;
        bottom: 0; /* positionner le footer en bas */
        left: 0; /* positionner le footer à gauche */
        font-size: small;
        text-align: center;
        margin-bottom: 0px;
    }

    .ModeH {
        visibility: collapse;
        width: 0px;
        height: 0px;
        max-width: 0px;
        word-wrap: break-word;
        font-size: 0em;
        display: none !important;
    }

    .ModeV {
        visibility: visible;
        /*font-weight: bold;*/
        width: auto;
        height: auto;
        display: normal !important;
    }

    .LogoImg {
        width: 96px;
        height: 96px;
        margin-top: -5px;
    }

    .LogoText {
        width: 300px;
        margin-left: 5px;
    }

    .cellLogo {
        max-width: 96px;
    }

    .TblLogin {
        margin-left: auto;
        margin-right: auto;
        width: 95%;
    }

    .ChpLoginPwd {
        width: 100%;
    }

    .TitreGS {
        font-size: 30px;
        color: #909295;
        font-family: Arial;
        margin-top: 40px;
        margin-left: 4px;
    }

    .VersionSite {
        font-size: 25px;
        color: #909295;
        font-family: Arial;
        font-weight: normal;
        margin-left: 4px;
    }

    .PageLogin {
        font-size: 60px;
    }

        .PageLogin input[type='submit'] {
            font-size: 60px;
            margin-top: 20px;
            padding: 10px;
        }

    .ddl {
        font-size: 60px;
    }

    .txtDate {
        width: 450px;
        font-size: 60px;
    }

    /*div.menu {
        font-size: 30px;
        height: 90px;
        vertical-align: central;
    }

    div.menu ul li a, div.menu ul li a:visited {
        height: 90px;
        text-align: center;
        vertical-align: central;
    }*/
    div.hideSkiplink {
        width: 100%;
    }

    div.menu {
        padding: 4px 0px 4px 8px;
    }

        div.menu ul {
            list-style: none;
            margin: 0px;
            padding: 0px;
            width: auto;
        }

            div.menu ul li a, div.menu ul li a:visited {
                font-size: 30px;
                background-color: #F0F8FF;
                border: 2px #cccccc solid;
                color: #555555;
                display: block;
                line-height: 1.35em;
                padding: auto 15px 5px auto;
                text-decoration: none;
                /*white-space: nowrap;*/
                /*width:150px;*/
                text-align: center;
                height: 90px;
                vertical-align: middle;
            }

                div.menu ul li a:hover {
                    background-color: #bfcbd6;
                    color: #465c71;
                    text-decoration: none;
                    /*font-weight: bold;*/
                }

                div.menu ul li a:active {
                    background-color: #465c71;
                    color: #cfdbe6;
                    text-decoration: none;
                }

        div.menu a.static.selected {
            color: #222222;
            background-color: #ffffff;
            font-weight: bold;
        }

    /*div.menuMobile {
        margin-top: 25px;
        margin-bottom: 15px;
        font-size: 30px;
        height: auto;
        border: none;
        width: 100%;
        align-items: center;
        position: relative;
    }*/
    div.menuMobile {
        margin-top: 25px;
        margin-bottom: 15px;
        font-size: 30px;
        height: auto;
        border: none;
        width: 100%;
        align-items: center;
        position: relative;
    }

        div.menuMobile ul::cue {
            border: 3px #cccccc solid;
        }

        div .menuMobile ul {
            list-style: none;
            margin: 0px;
            padding: 0px;
            width: auto;
            height: auto;
            position: relative;
            align-self: center;
            margin-right: auto;
        }

        div .menuMobile[nb="1"] ul {
            width: 150px;
            margin-left: Calc(50% - 75px);
        }

        div .menuMobile[nb="2"] ul {
            width: 320px;
            margin-left: Calc(50% - 160px);
        }

        div .menuMobile[nb="3"] ul {
            width: 490px;
            margin-left: Calc(50% - 245px);
        }

        div .menuMobile[nb="4"] ul {
            width: 640px;
            margin-left: Calc(50% - 320px);
            /* margin-left: Calc(50% - 255px);*/
        }

        div .menuMobile[nb="5"] ul {
            width: 780px;
            margin-left: Calc(50% - 390px);
            /*  margin-left: Calc(50% - 255px);*/
        }

        div .menuMobile li {
            margin-right: 20px;
            margin-bottom: 0px;
            padding-bottom: 0px;
        }

            div .menuMobile li:last-child {
                margin-right: 0px;
            }

        div .menuMobile[nb="3"] .icon {
            height: 150px;
            width: 150px;
        }

        div .menuMobile[nb="4"] .icon {
            height: 145px;
            width: 145px;
        }

        div .menuMobile[nb="5"] .icon {
            height: 140px;
            width: 140px;
        }


        div.menuMobile a.static.selected {
            color: #222222;
            font-weight: bold;
            border-bottom: 5px #0085ff solid;
        }


    /*  Tableaux  */

    .TblTournee {
        border-spacing: 0px;
        border-width: 1px;
        background-color: transparent;
        overflow: scroll;
        margin-top: 5px;
        margin-bottom: 5px; /*    border-bottom-style:hidden;     border-right-style:hidden;     border-top-style:solid;     border-left-style:solid;*/
        border-style: solid;
        border-color: Black;
    }


        .TblTournee th {
            /*border-top-style:hidden;     border-left-style:hidden;*/
            background-color: #dddddd;
            font-size: 1.0em;
            text-align: center;
            padding: 3px;
            border-spacing: 0px;
            border-width: 1px;
            border-style: solid;
            border-color: Black;
        }

        .TblTournee tr:nth-child(even) {
            /*background: #FF;*/
        }

        .TblTournee tr:nth-child(odd) {
            background: #FFF;
        }

        .TblTournee td {
            border-spacing: 0px;
            border-width: 1px;
            border-style: solid; /*border-top-style:hidden;     border-left-style:hidden;*/
            border-color: Black;
            margin: 3px;
            height: 23px;
        }

    .TblPlanning {
        border-spacing: 0px;
        border-width: 0px;
        background-color: transparent;
        overflow: scroll;
        margin-top: 5px;
        margin-bottom: 5px; /*    border-bottom-style:hidden;     border-right-style:hidden;     border-top-style:solid;     border-left-style:solid;*/
        border-style: none;
        border-color: Black;
        text-align: center;
        border-spacing: 0;
        border-collapse: collapse;
        font-weight: bold;
    }


        .TblPlanning th {
            /*border-top-style:hidden;     border-left-style:hidden;*/
            background-color: #FFF;
            /*font-size: 1.5vw;*/
            text-align: center;
            padding-left: 5px;
            padding-right: 5px;
            margin-left: 2px;
            margin-right: 2px;
            border-spacing: 2px;
            border-width: 2px;
            border-style: solid;
            border-color: Black;
            border-width: 2px;
        }

        .TblPlanning tr:nth-child(even) {
            /*background: #FF;*/
        }

        .TblPlanning tr:nth-child(odd) {
            /* background: #FFF;*/
        }

        .TblPlanning td {
            border-spacing: 0px;
            border-width: 0px;
            border-left-width: 1px;
            border-style: solid; /*border-top-style:hidden;     border-left-style:hidden;*/
            border-color: Black;
            margin: 0px;
            /*height:23px;*/
            background: #FFF;
            /*  font-size:smaller;*/
        }


    /*  Général  */
    .User {
        font-size: 13px;
        font-weight: bold;
    }

    .TitreGS {
        font-size: 30px;
        color: #909295;
        font-family: Arial;
        margin-top: 40px;
        margin-left: 4px;
    }

    h1, h2, h3, h4, h5, h6 {
        font-size: 1.5em;
        color: #000000;
        text-transform: none;
        font-weight: 500;
        margin-bottom: 2px;
        margin-top: 2px;
    }

    h1 {
        text-align: center;
        font-size: 1.6em;
        padding-bottom: 0px;
        margin-bottom: 0px;
        margin-top: 5px;
    }

    h2 {
        font-size: 40px;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    h3 {
        font-size: 1.2em;
    }

    h4 {
        font-size: 1.1em;
    }

    .failureNotification {
        font-size: 0.8em;
        color: Red;
    }

    .PiedPagePrint {
        display: none;
    }

    .PiedPage {
        display: none;
    }


    .LienPrecSuiv {
        font-size: 1.4em;
        text-align: center;
    }

    .LienTxtNorm {
        text-decoration: none;
        color: Black;
    }

    .LienTxtNormSansCouleur {
        text-decoration: none;
        color: inherit;
    }

    .PlMois {
        text-decoration: none;
        color: inherit;
        font-size: 15px;
        font-size: 1vw;
    }

    .PlJour {
        text-decoration: none;
        color: inherit;
        font-size: smaller;
        font-size: 1vw;
    }

    .PlActivite {
        text-decoration: none;
        color: inherit;
        font-size: smaller;
        font-size: 1vw;
    }

    .Consigne {
        font-weight: bold; /*color:Red;*/
    }

    .SaisieReal {
    }

    input[type='text'], input[type='password'] {
        /*border-radius: 5px;     box-shadow: 1px 1px 5px #CCC; */
        /*  border-radius: 4px;*/
        border: 1px solid #777;
        font-weight: 200;
        font-size: inherit;
        /* font-family: Verdana;*/
        padding-left: 3px;
        padding-right: 3px;
    }

        input[type='text']:hover, input[type='password']:hover {
            /*border-radius: 5px; */
            border: 1px solid #666;
            box-shadow: 1px 1px 5px #CCC;
        }

    input[readonly="readonly"], input[readonly="readonly"]:hover {
        border: 0px solid #666;
        background-color: transparent;
        box-shadow: none;
    }

    input[Err="true"], input[Err="true"]:hover {
        border: 1px solid #f00;
    }

        input[Err="true"]:hover {
            border: 1px solid #f00;
            box-shadow: 1px 1px 5px #F88;
        }


    /*CSS for dropdown box*/
    select {
        width: 200px;
        font-size: 40px;
        border: 1px solid #777;
    }

        select: hover {
            width: 200px;
            border: 1px solid #666;
            box-shadow: 1px 1px 5px #CCC;
        }

        select.heure {
            width: 160px;
        }


    .SaisieReal input[type='text'], .SaisieReal input[type='password'] {
        text-align: center;
    }

        .SaisieReal input[type='text']:hover, .SaisieReal input[type='password']:hover {
            text-align: center;
        }

    .DateCourante {
        text-decoration: underline;
        font-size: x-large;
    }

    .DateCouranteIE7 {
        text-decoration: underline;
        font-size: 1.0em;
    }

    .PageLogin, .PageChangePwd {
        font-size: 60px;
    }

    input[type='submit'], input[type='reset'] {
        font-size: 40px;
        margin-top: 20px;
        padding: 10px;
    }

    input[type='time'] {
        width: 200px;
    }

    .LogoImg {
        width: 96px;
    }

    .LogoText {
        width: 300px;
    }

    .PlH {
        visibility: collapse;
    }

    .PlV {
        visibility: visible;
    }

    .PlMoisV {
        text-decoration: none;
        color: inherit;
        font-size: 50px;
    }

    .PlJourV {
        text-decoration: none;
        color: inherit;
        font-size: 30px;
    }

    .PlActiviteV {
        text-decoration: none;
        color: inherit;
        font-size: smaller;
        font-size: 30px;
        margin-bottom: 5px;
    }

    @media screen and (max-width: 900px) {
        .PlH {
            visibility: collapse;
        }

        .PlV {
            visibility: visible;
        }
    }

    .PlActiviteV {
        font-size: 30px;
    }

    .LegendeActCode {
        border: 3px solid LightGray;
    }

    .LegendeActLib {
        padding-left: 10px;
        font-weight: normal;
    }

    .Page {
        font-size: 40px;
    }

    .PageDemande {
        font-size: 60px;
    }

        .PageDemande p {
            margin-bottom: 20px;
            margin-top: 20px;
        }

        .PageDemande ul {
            margin-bottom: 00px;
            margin-top: 0px;
        }

        .PageDemande li {
            margin-bottom: 30px;
            margin-top: 0px;
        }

    .PageCompteTemps {
        max-width: 100%;
        font-size: 40px;
    }

    .PageTourneeMob {
        max-width: 100%;
    }

    .CompteTempsTotSolde {
        flex-direction: column;
        width: 100%;
    }

    .CompteTempsTot {
        height: auto;
        margin-left: 0px;
        margin-right: 0px;
    }

    .CompteTempsSolde {
        height: auto;
        margin-top: 15px;
        margin-left: 0px;
        margin-right: 0px;
    }

    .TblCptTpsAct {
        margin-left: auto;
        margin-right: auto;
    }

    .TblCptTpsTotSolde {
        border: 1px solid black;
    }

    .CompteTempsCorr {
        /*border:1px solid black;*/
        /* max-width: 300px;*/
    }

    .TblCptTpsCorr {
        /*border: 1px solid black;*/
        width: 100%;
    }

        .TblCptTpsCorr td {
            /*border: 1px solid black;*/
        }

    .ModeVLargMax1 {
        max-width: 1px;
    }


    .iconeGrande {
        height: 150px;
    }

    .iconeMoyenne {
        height: 96px;
    }

    .iconePetite {
        height: 50px;
    }

    .popup {
    }

        /* The actual popup */
        .popup .popuptext {
            margin-left: -200px;
        }

            /* The actual popup */
            .popup .popuptext[typePopup="Visite"] {
                font-size: 60px;
                margin-left: -470px;
                max-width: 600px;
            }


    .divRecap {
        /*        font-size: 40px;*/
    }

    .recap {
        /* font-size:30px;*/
    }

    #Info {
        font-size: 45px;
    }

    #Badgeuse {
        font-size: 45px;
    }

    .bSuiv img, .bPrec img {
        height: 90px;
    }

    .detail-jour td.code-act {
        width: 120px;
    }

    .item {
        font-size: 30px;
    }
    /*Liste autocomplete*/
    .ui-menu .ui-menu-item {
        font-size: 45px;
    }

    .TblVisiteMob td.hDbtFin {
        height: 150px;
    }

    .TblVisiteMob td:first-child {
        width: 160px;
        min-width: 160px;
        max-width: 160px;
    }

    .TblVisiteDetail td:first-child {
        width: 160px;
        text-align: center;
    }

    .TblVisiteDetail td:last-child {
        padding-left: 20px;
    }


    .TblVisiteDetail td.ico {
        font-size: 60px;
    }

    .icone {
        font-size: 40px;
    }

    .fa-user.icone {
        font-size: 60px;
    }

    .grid-responsive {
        grid-template-columns: 100%;
    }

    .user-menu {
        top: 60px;
        width: 750px;
        font-size: 60px !important;
    }

        .user-menu a {
            font-size: 60px !important;
        }

    .dropdown-content a {
        font-size: 1.5rem;
    }

    .mini-loading {
        height: 59px;
        margin-top: 0px;
    }

    .h-combo {
        height: 71px;
    }

    .ico-moy {
        font-size: 1.2em;
    }

    .ddl {
        max-width: 99%;
    }

    #ddlDuree {
        margin-top: 5px;
    }

    .chevron {
        font-size: 80px;
    }

    button {
        font-size: 50px;
    }

    .groupbox {
        border-width: 2px;
        border-radius: 10px;
        margin-bottom: 20px;
        padding: 10px;
    }

    .grid-dde {
        display: grid;
        /* grid-template-columns: 8% 20% 18% 18% 18% 9% 2% 5%; */
        grid-template-columns: repeat(4, auto);
        grid-column-gap: 30px;
        padding-left: 15px;
    }

    .box-dde-dbt {
        width: 300px;
        grid-row-start: 1;
        grid-column: span 2;
    }

    .box-dde-fin {
        width: 300px;
        max-width: 300px;
        grid-row-start: 1;
        grid-column: span 2;
        padding-right: 25px;
    }

    .box-dde-type {
        /*margin-left: 10px;*/
        margin-top: 20px;
        grid-row-start: 2;
        grid-column: span 4;
    }

    .box-dde-valide {
        grid-column: span 4;
        text-align: right;
    }

    .close {
        top: -10px;
        left: Calc(100% - 40px);
    }

    input[type='checkbox'] {
        width: 30px;
        height: 30px;
    }


    .grid-decimal {
        grid-template-columns: calc(50% + 10px) calc(50% - 10px);
    }

    #modalDdeContent {
        font-size: 40px;
    }

        #modalDdeContent select, #modalDdeContent input, #modalDdeContent textarea {
            font-size: 40px;
        }

    .btn {
        padding-top: 5px;
    }

    .number-plus-moins {
        width: 110px !important;
    }

    #ddeRep {
        max-height: 50vh;
        position: relative;
    }

        #ddeRep .cadre-table-scroll {
            max-height: Calc(50vh - 90px);
        }

    .grid-jour-horaire {
        grid-template-columns: 190px 1fr;
    }

    .phone-small {
        font-size: 0.8em;
    }

    .phone-newline {
        display: block;
    }

        .phone-newline div {
            margin-top: 15px;
        }

        .phone-newline div:first-child {
            margin-top: 0px !important;
        }

    .menu-sub {
        padding-left: 60px;
    }
}