/* **************** */
/* Style responsive */
/* **************** */
/* ------------------------- Menu haut */
/* class pour fixer le menu */
.fixemenu{position:fixed; top:0;}
#barre_menu label, #hamburger {
  display: none;
}
div#page{background-color: #FFF;}
 /* .sansstyle a img{
    max-width: 727px;
    width: 100%;
  }*/
  /*#barre_menu{overflow: visible;}*/ /* pour contrecarrer le div général, mais problème quand même */
/* ------------------------- Limite de la gestion par pixel */
@media screen and (max-width:1020px){
 /* body{background-color:#FF0000;}*/
  div#page {
    width:calc(100% - 10px);
    /*background-color: #FFFF00;*/
  }
  div#navigation{
    width:calc(20% - 20px);
    /*background-color: #00FF00;*/
    margin-right:20px;
  }
  #imgboutique, #imgcalendrier{width:100%;}
  div#contenu_sans_nav_sans_encadres, div#contenu_deco{
    width:calc(80% - 20px);
    /*background-color: #0000FF;*/
  }
  div#contenu_avec_encadres{
    width:calc(75% - 10px);
    /*background-color: #00FFFF;*/
  }
  div#encadres{
    width:calc(25% - 10px);
    /*background-color: #FFFF00;*/
  }
  ul#menu_principal li.menu_haut_style{
    margin: 0 0 10px 0;
    font-size:1em;
    padding : 0 5px;
  }
  .pour_recherche{
    float: none;
    display:flex;
    justify-content: center;
  }
  .bloc_menu_ufr ul{
    width: 100%;
  }

}
/* ------------------------- Limite du menu */
@media screen and (max-width:900px){
    #imgboutique, #imgcalendrier{max-width:265px; display:block; margin:0 auto;}
  /*body{background-color:#00FF00;}*/
  div.ligne {
    justify-content: center; 
  }
  div#page {
    /*background-color: #00FFFF;*/
    /*flex-direction:column-reverse;*/
  }
  #lecontenu{
    display: flex;
    flex-wrap: wrap;
    justify-content:space-between;
  }
  div#contenu_sans_nav_sans_encadres, div#navigation{
    width: 100%;
  }
  div#contenu_sans_nav_sans_encadres{order: 1;}
  div#navigation{order: 2;}
  /* Barre menu */
  #barre_menu{
    height: 30px;
    /*position: fixed;
    top:40px;*/
    overflow: visible;
  }
  #barre_menu label {
      /*display: inline-block;*/
      display:block;
      position: absolute;
      top:-20px;
      left:5px;
      z-index: 150100;
      color: #fff;
      background: --var(--main-violet);
      font-style: normal;
      font-size: 1.4em;
      padding: 5px 10px;
    }
    #barre_menu ul {
      display: none;
      position: absolute;
      top:20px;
      left:-10px;
    }
    ul#menu_principal ul{
      position:relative;
      top:0;
    }
    ul#menu_principal{
      line-height: 40px;
    }
    #barre_menu input:checked ~ ul#menu_principal {
      display: block;
      width: 100%;
      background-color: var(--main-violet);
    }
    ul#menu_principal{
      display:none;
    }
    ul#menu_principal li.menu_haut_style{
      float:none;
      text-align: center;
      width: 100%;
    }
    ul#menu_principal ul{
      width:100%;
    }
    form#recherche_simple{
      text-align: left;
      padding-left:5px;
    }
    .menu_haut_style ul{
      position: absolute;
    }
    #MOTS-CLEFS{
      display: block;
      float: left;
      margin-left: 5px;
      margin-top: -2px;
    }
    .ok{
      display: inline-block;
      float: none;
    }
    /*------- Barre haute */
  #menu{
    max-height: 40px;
  }
    #menu .menu_reseau{
      display:none;
    }
    .barre_haute a.opacity02 img{
      height: 40px;
      width: auto;
    }
    a.isbn {
    background:url(img/isorbonne_logo_res.png) right top no-repeat ;
    width: 61px;
    height: 14px;
  }
  a.isbn:hover {
    background:url(img/isorbonne_logo_res-off.png) right top no-repeat ;
  }
   a.icampus {
    background:url(img/icampus_logo_res.png) right top no-repeat ;
    width: 61px;
    height: 14px;
  }
  a.icampus:hover {
    background:url(img/icampus_logo_res-off.png) right top no-repeat ;
  }
 #menusutiles{
  display: flex;
  flex-wrap: wrap;
  justify-content:space-between;
 }
 #acces, #infos_pratiques{
  width:48%;
 }
  div#navigation .visuel-rubrique{
    background-image: none;
    height: 1px;
    padding: 0;
  }
  div#contenu_sans_nav_sans_encadres, div#contenu_deco{
    width:100%;
  }
  div.colonne_deco {
    padding: 0;
  }
  div.colonne{float: none;}
 .col50, .style1, .style2, .style3, .ligne{width:100%;}
  .colonne.col30{width: 48%; float: right;}
  .div.style2 h3{background-color: var(--couleur2); }
  div.style2{border-bottom: 2px solid transparent;}
  .menu_secondaire:before{
    content: "Mais aussi dans cette rubrique";
    display: block;
    position:relative;
    top:0;
    left:0;
    font-size: 1.1em;
    font-weight: 700;
    margin:20px 0 5px 0;
    padding:bottom:5px;
    border-bottom: solid 1px var(--main-violet);
  }
  .encadre_fiche_contenu details ol{max-width:90%; margin-left:28px;}
  /* class pour fixer le menu */
  /*.fixemenu{position:fixed; top:0;}*/
}
@media screen and (max-width:680px){
    div#page {
   /* background-color: #FF00FF;*/
    /*flex-direction:column-reverse;*/
  }
    /*body{background-color:#0000FF;}*/
  .img300{width:100%; display:block; margin :5px auto;}
  .img400{width:100%; display:block; margin :5px auto;}
  .ligne {
    display: flex;
    flex-wrap: wrap;
    justify-content:space-between;
  }
  .col30{
  width:100%;
  }
  .col50{
    width:100%;
  }
  div#contenu_sans_nav_sans_encadres, div#contenu_deco{
    display: flex;
    flex-wrap: wrap;
  }
  div#contenu_avec_encadres{
    width: 100%;
  }
  div#encadres{
    width:100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
  }
    .encadre_fiche{width:48%;}
    .logo_pied{width:120px; height:auto;}
    dl.type_2 dt, dl.type_1 dt{width:110px;}
    dl.type_2 dd{margin-left:120px;}
    dl.type_1 dd{margin-left:110px;}
    dl.type_2{background: #fff url(img/liste_definition_type_2_resp.png) repeat-y;}
    div.encadre_generique{width: 100%;}
    .img30pc{width: 45%;}
    ul.liste-actualites li {
      margin: 0 0 5px 10px;
    }
    .quart, .tier, .demi, .cinquieme{width:100%;}
}

@media screen and (max-width:465px){
  div#page {
    /*background-color: #EE0000;*/
    /*flex-direction:column-reverse;*/
  }
  .colonne.col30{width: 100%; float: none;}
    /*body{background-color:#00FFFF;}*/
    #acces, #infos_pratiques{
      width:100%;
    }
    .encadre_fiche{width:100%;}

    .img30pc{width: 100%; padding:0;}
}