body {
    margin: 0px;
    padding: 0px;   
    font-family:"Arial","Courrier New","Times New Roman";

}

#header {
    width: 100%;
    height: 128px;
    background-image:url('bg_01.png');   
}

 

#page {
    width: 100%;
    position: absolute;
    top: 128px;
}
#content {
    margin-top: 55px;
    width: 100%;
    min-height: 400px;
    position: relative;
}

  
/*         IMAGE DE HEADER = LOGO KUQ      */
#logo {
    position: absolute;
    top: 8px;
    left: 24px;
    width: 400px;
    height: 128px;
    background-image:url('f6kuq.png');
    background-repeat:no-repeat;    
}


.hide_mobile {

    font-family: 'Open Sans', arial, serif;
    font-size: 14px;    
    margin: 10px;
    padding: 5px;
    text-align: justify;
}



.emp {
    border: 1px solid #808080;
    background-color: #F8F0D0;   
}



/* ==== SI GRAND ECRAN = NON MOBILE SUP 481px ====     */
@media screen and (min-width: 481px) {

#leftcolumn { 
    position: absolute;
    top: 0px;
    left: 0px;
    width: 110px;
    height: 459px;
    background-image:url('f6kuq.png');
    
}

#center {
    position: absolute;
    top:0px;
    left: 110px;
/*     right: 400px;  */
}
 
}

/*    === DEBUT ECRAN MOBILE ======   */
@media screen and (max-width: 480px) {


/*   SI MOBILE PAS DE COLONNE GAUCHE       */
#leftcolumn { 
    position: absolute;
    top: 0px;
    left: 0px;
    width: 0px;
    height: 0px;
    background-image:url('f6kuq.png');
}

#center {
    position: absolute;
    top:0px;
    left: 10px;
}

  
}

/* === FIN ECRAN MOBILE  ==== */






@media (max-width: 640px) {
    * {
        -webkit-box-sizing: border-box;
           -moz-box-sizing: border-box;
                box-sizing: border-box;
    }
    
    /* passer body (et tous les éléments de largeur fixe) en largeur automatique */

    body {
        width: auto;
        margin: 0;
        padding: 0;
    }
    
    /* fixer une largeur maximale de 100% aux éléments potentiellement problématiques */

    img,
    table,
    td,
    blockquote,
    code,
    pre,
    textarea,
    input,
    iframe,
    object,
    embed,
    video {
        max-width: 100%;
    }
    
    /* conserver le ratio des images */

    img {
        height: auto;
    }
    
    
    
    /* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) */

        Tableau  {
        float: none;
        width: auto;
    }
    
    /* masquer les éléments superflus */

    .hide_mobile {
        display: none !important;
   
   
  
}


/* =======  fin du header tablette max 640 ========  */