/* Responsive for small screen */




@media (max-width: 800px) {





    /* structure */


    #cadreInterieurPageBlanche {
        border:   solid #ddd 0px;
    }

    .menu {
        padding-top: 4px;
        padding-bottom: 4px;
    }
    .bouton-menu-principale {
        width: 82px;
        font-size: 14px;
        padding-top: 6px;
        padding-bottom: 6px;
    }



    .hide_in_desktop {
        display:  block;
    }

    .hide_in_mobile {
        display: none;
    }

    .mobile {
        display: block;
    }

    body {
        width: auto;
        margin: 0;
        padding: 0;
    }

    /* mobile:  pour éviter le zoom automatique de la zone */
    input[type='text'],
    input[type='number'],
    textarea {
      font-size: 16px;
    }



    /* page de style principale */

    .pageName {
        margin-top: 1px;
        paddinf-top: 1px;
        margin-bottom: 2px;
    }

    .box_logo {
        margin-top: 0px; 
        margin-left: 0px; 
        margin-right: 0px; 
        margin-bottom: 0px;
        align-items: center;
        border: 0px;
    }


    #logoContainer {
        padding-top: 3px;
        padding-top: 3px;

    }

    #cadre_profil {
        margin-top: 2px;
    }

    #cadreInterieurMenu {
         margin: 0px;
         padding: 1px;
         border: solid #ddd 0px;
    }

    #cadreInterieurPageBlanche {
        margin: 0px;
        padding-left: 10px;
        padding-right: 12px;
        padding-top: 12px;
    }

    #cadreInterieurFooter {
         margin: 0px;
         font-size: 8px;
    }

    /*
    #logo {
        padding: 3px;
        width: 144px;
    }
    */


    #left {
        overflow:  auto;
    }

    #cadre_640 {
       margin: 1;
       padding: 1; 
    }


    /* Sub Menu */

    .subMenuBubulleItem {
        margin-bottom: 4px;
        width: 72px;
        margin-right: 2px;
    }


    /* Page de Login */

    #loginBox {
        margin-top: 0px;
        min-width: 100%;
        min-width: 200px;
    }

    /* Mailbox - Reply       */

    #mailboxFormulaireBox {
    }

    #mailboxZoneDeTexte {
        font-size: 16px;
    }

    #mailboxButtonSend {
    }
    
    .messageHeaderSource {
        font-size: 10px;
        white-space: nowrap;
    }

    .messageHeaderOption {
        font-size: 10px;
        white-space: nowrap;
    }




    /* Scanner Parano 2022 */

    #cadre_scaner {

    }

    .scanner {
        float: left;
        border: 0px solid red;
        margin: 3px;
        margin-bottom: 12px;

    }

    .scanner .parano {
        padding: 2px;
        box-shadow: 1px 1px 4px #888888;
    }

    .scanner .parano .who {
        font-size: 10px;
        text-align: center;
        padding: 0px;
        margin: 0px;
    }

    .scanner .parano .id {
        text-align: center;
        font-size: 8px;
        padding: 0px;
        margin: 0px;
    }

    .scanner .parano .photoArea {
        margin: 3px;
        margin-bottom: 0px;
    }

    .scanner .parano .photoArea img {
        width:  55px;
        height: 110px;
        background: linear-gradient(to bottom, grey, darkgray);
    }


/* Menu principale */

.menuButton { 
    width: 73px;
   margin-left: 2px;
   margin-right: 2px;

 }

/* Sub Menu                    */

    .subMenu {

    }

    .subMenuItem {
        padding-left:  8px;
        padding-right: 8px;
    }

    .subMenuEmoji {
        font-size: 18px;
    }

    .subMenuName {
        font-size: 11px;
    }

    /* --------------------------*/
    /*                           */
    /* Bureau                    */
    /*                           */
    /*---------------------------*/

    .bureau_propa {
        width: 300px;
    }

    


/* ==========================================
                           
 Tout concernant la mise en page d'une fiche    
                         
============================================= */


    #cadre_profile {
        align-items: center;
        display:  flex;
        flex-direction: column;
    }

    /* A gauche:  La photo de couverture */

    #cadre_profile #cadre_photo {
        width:  90%;
        padding-left: 16px;
        padding-right: 16px;
    }

    #cadre_profile #cadre_photo img { 
        /* margin: 0 auto; */
        width: initial;
        min-height: initial;
        width: 100%;
        /* height: 350px; */
        max-height: 350px;
        max-height: 50vh;
        border-radius: 12px;
        object-fit: cover;
        /*object-position: top;*/
        border:  0px solid #eeeeee;
        padding: 2px;
    }


/* A droite:  La présentation */

    #cadre_profile #cadre_presentation { 
        width: 100%;
        padding: 9px;
        margin-left:  0px;
        border-radius: 9px;
        min-height: initial;
    }

    #cadre_presentation #pseudo { 
        font-size: 18px;
    
    }

    #cadre_presentation #presentation { 
        margin-top: 21px;
        font-size: 11px;
    }

    

    .photo {

    }

    #cadre_profile #error {

    }


    #frimousse img {
        /*
        height: 50px;
        min-height: initial;
        object-fit: cover;
        object-position: top;
        */
    }




/* ==========================================
                           
 Galerie Photo (mobile)
                         
============================================= */

.galeriePhotoItem {
    width: 45%;
}



    /* article */

    .propaTitle {
        font-size: 18px;
    }

    .sourceFull {
        font-size: 9px;
    }

    /* Bootstrap */
    .alert {
        width: 98%;
    }

    #form {
        width: 98%;
    }

    .form-group {
        width: 98%;
    }

    article img {
        width:  100%;
     object-fit: cover;
    }

    /* facade Navibot */

    #navibot {
        white-space:nowrap;
        overflow:hidden;
        padding-top:    Opx;
        padding-bottom: Opx;
    }

    #navibotDroit {
        display: none;
    }




    /* facade header */

    #header {
        margin: 0px;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    #title {
        text-align: center;
    }

    #subSectorName {
        text-align: center;
    }



    /*  Le menu */

    #lemenu {
        float: none;
        text-align: center;
    }

    #lemenu #principale {
        width: 100%;
        font-size: 19px;
        padding: 13px;
    }

    #lemenu #subusers {
        width: 100%;
        font-size: 19px;
    }

    #lemenu #subnews {
        width: 100%;
        text-align: center;
        font-size: 18px;
        font-style: italic;
        padding-left:   15px;
        padding-top:    11px;
        padding-bottom: 5px;
    }


    /* Le Menu : Login & Subscribe */

    #menuMobileLoginButton {

        width: 100%;
        text-align: center;
        padding-top: 6px;
        padding-bottom: 6px;
    }

    /* Le Menu : User info */
    #userInfo {
        /* display: none; */
        width: 100%;
        text-align: center;

    }


    /* Mini Call for mobile */

    #miniCall {
        display: block;
        transform: rotate(-1.5deg);
        background-color: rgba(255, 254, 0, 0.2);
        margin-top: 25px;
        margin-left: 31px;
        margin-right: 31px;
        padding-top:    21px;
        padding-left:   31px;
        padding-right:  31px;
        padding-bottom: 31px;
        font-size: 19px;
        box-shadow: 3px 3px 15px #888888;
    }


    #miniCall2 {
        display: block;
        transform: rotate(-1.1deg);
        background-color: rgba(255, 254, 0, 0.2);
        width: 75%;
        margin-left: 20px;
        margin-top: 25px;
        margin-bottom: 40px;

        /*
        margin-right: 61px;
        */
        padding-top:    21px;
        padding-left:   21px;
        padding-right:  21px;
        padding-bottom: 31px;
        font-size: 14px;
        box-shadow: 3px 3px 15px #888888;
    }



    /* Page Scanner */

    #scanner {
        margin-top: 25px;
        margin-left: 5px;
    }

    .box {
       /* margin-right: 18px; */
    }

    .box .photo {
        margin: 5px;
    }


    #menuSeparator {
        display: none;
    }

    #menuEnding {
        display: none;
    }

    /* la page */
    #lapage {
       padding: 0px;
       margin: 0px;
    }

    /* collone gauche */
    #right {
        padding: 0px;
        margin: 0px;
        width: 100%;
        float: none;
    }

    /* collone gauche */
    #left {
        padding: 1px;
        margin: 0px;
        width: 100%;
        float: none;
    }

    .zonelink a {
        line-height: 0px;
        word-spacing: -1px;
    }

    .entry {
        margin-top: 17px;
    }

    /* Page Login */



    /* page messagerie */

    #cadre_messagerie {
        margin: 0 auto;
        margin-top: 3px;
        padding: 0px;
    }

    .messageSource {
        font-size: 12px;
    }

    .messageText {
        font-size: 12px;
        padding-left: 6px;
        padding-bottom: 6px;
    }



    /* page secteur */

    /*
    h1 {
        text-align: center;
    }
    */

    .sourceFull {
        text-align: center;
    }

    .sectors {
        margin: 0 auto;
        width: 96%;
        padding-top: 21px;
    }

    .card {
        width: 100px;
        height: 150px;
    }

    .card .img img {
        width: 90px;
        height: 90px;
    }

    .card .name {
        font-size: 10px;
    }


    /* UN ARTICLE sur Mobile   */

    .cadre_article {
        margin-top: 2px;
    }

    article {
        margin-left: 9px;
        margin-right: 9pxx;
    }

    article .titre-principal {
        margin-top: 2px;

    }


    /* Main Page with FlexBox */

    #lapage {
        display: flex;
        /* flex-direction: column; */
        flex-direction: column-reverse;
    }

    footer {
        display: none;
    }

    #paddingPageBlanche {
        margin-top:    0px;
        padding-top:   0px;
        padding-left:  0px;
        padding-right: 0px;
    }


    /* propaganda */
    .propaText {
       float: none;
    }

    .propaInfo {
        display: none;
    }

    .propa h1 {
        margin-top: 21px;
        font-size: 29px;
    }

    .propa h2 {
        margin-top: 35px;
    }

    .propa h3 {
        margin-top: 25px;
    }

    .propaSourceFull {
        text-align: center;
        font-size: 16px;
    }

    /* sous mobile, les images dans la zone propa
      doivent être à 100%
     */
    .propa img {
        height: auto;
        width: 100%;
    }


    .propa {
        padding-left: 7px;
        /* background-color: #f2f2f2; */
        border: solid 0px #ffffff;
        margin-bottom: 32px;
        width: 100%;

        color: rgba(0,0,0,.84);

        --x-height-multiplier: 0.375;
        --baseline-multiplier: 0.17;
        font-family: medium-content-serif-font,Georgia,Cambria,"Times New Roman",Times,serif;
        letter-spacing: .01rem;
        font-weight: 400;
        font-style: normal;
        font-size: 21px;
        line-height: 1.58;
        letter-spacing: -.003em;
    }


    /* Proposer un article */

    .focusColor {
        margin: 0px;
        padding: 0px;
        padding-left: 3px;
        padding-right: 3px;
        border-radius: 0px;
        border: 0px solid #a7cd8f;
        margin-bottom: 21px;
    }

    /* Facade user Profile */

    #theBigBox {

    }

    /* zone Vote */
    .zoneVote {
        margin-left:  6px;
        margin-right: 12px;
    }

    .zoneVote .glyphicon {
        font-weight: 900;
    }



/* ==========================================
                           
            LE RECAP

============================================= */


    .recap-article {
        padding:            2px;
        margin-bottom:      14px;
        margin-left:        7px;
        margin-right:       7px;
    }


    .recap-title h3 {
        margin: 0;
        font-size: 1.2em;
        cursor: pointer;
    }

    .recap-article-info {
        color: #555;
        margin-top: 5px;
        font-size:      0.9em;
    }

    .recap-intro-agentic {
        font-style:     italic;
        font-size:      0.9em;
        max-width:      98%; 
        white-space:    normal; 
        overflow-wrap:  break-word; 
        margin-top:     6px;
        line-height:    1.4em; /* Améliore la lisibilité */
        padding-left:   0px;
        padding-right:  0px;
        margin-bottom:  2px;
    }



}