/* 1350 - login */
/* 1300 */
/* 1180 */
/* 1050 */
/* 1024 -- switch demi menu */
/* 900 */
/* 800 - login */
/* 700 */
/* 650 - full menu */
/* 550 - login */
/* 450 - login */
/* 300 - login */

@media screen and (max-width:1350px){
  #menu {
    padding:5px 2%;
  }

}

@media screen and (max-width:1300px){

}

@media screen and (max-width:1200px){
  #menu_top{
    font-size: 0.8em;
  }

  .days div{
    height:11em;
  }

  /* CALENDRIER */
  .absence h2{
    width:80px;
    height:80px;
  }

  .conge h2{
    width:80px;
    height:80px;
  }

  div.chomage h2 {
    width: 35px;
    height: 42px;
  }

  .holiday h2{
    width:80px;
    height:80px;
  }

  #calendar-big h2{
    padding-top:30px!important;
    margin:25px auto 25px auto;
  }

  .week-title{

  }

  .week-detail{
    height:8.75em;
  }


}

@media screen and (max-width:1050px){
  #menu {
    padding:5px 1%;
    font-size: 0.9em;
  }

  #img_demande{
    height:13px;
  }

  #menu_top{
    font-size: 0.7em;
  }

}

@media screen and (max-width:1024px){
  /* disparition menu */

  #switch{
      display: block;
  }

  #menu{
    display:none;
    float:none;
    width:50%;
    position: absolute;
    top:0;
    left:0;
    z-index: 10000;
    font-size: 1.3em;
    border-right:1px solid #00b0e1;
    padding:5px 2%;
    font-size: 0.9em;
  }

  #div_logo_menu{
    text-align: center;
  }

  #logo_menu{
    width:40%;
  }

  #menu_auth_picto{
  }

  #menu_auth{
  }

  #menu li.li_tableau_bord_gris{
    padding-left:13%;
  }

  /* container central */
  #container{
    width:100%;
    display: block;
  }

  /* entete tableau de bord */

  #menu_top{
    font-size: 0.9em;
  }

  #container_header_deconnexion{
    font-size: 0.85em;
  }
}


@media screen and (max-width:900px){

    /* entete tableau de bord */

    #menu_top{
      font-size: 0.8em;
    }

    #container_header_deconnexion{
        font-size: 0.8em;
    }

    .days div{
      height:10em;
    }

    div.chomage h2 {
      width: 75px;
      height: 85px;
    }

    .week-detail{
      height:8em;

    }

    .week-title{
      height:8.5em;
    }



    #calendar-big h2{
      padding-top:30px!important;
      margin:15px auto 15px auto;
    }
}

@media screen and (max-width:800px){

  /* LOGIN */
  #login_form{
      width:75%;
  }

  #logo_div{
      /*width:50%;*/
      font-size: 0.7em;
  }


  #container_header_deconnexion{
      font-size: 0.7em;
  }

  #bouton_fiche_de_paie{
    width:30%;
  }


  /* FICHE */
  /*
  #conges_maladies_absences .fiche_flex{
    display:block;
  }

  #conges_maladies_absences .fiche_infos{
    display: block;
    width:100%;
  }

  #conges_maladies_absences .fiche_title{
    display: inline-block;
  }

  #conges_maladies_absences .fiche_results{
    display: inline-block;
  }
  */

  .content{
    font-size: 0.8em;
  }

  span.jconfirm-title{
    font-size: 0.8em!important;
  }


  .jconfirm.jconfirm-material .jconfirm-box .jconfirm-buttons button{
    font-size: 0.6em;
  }

  .conge-actions button{
    font-size: 0.8em!important;
  }

  .event-actions button{
    font-size: 0.8em!important;
  }
}

@media screen and (max-width:740px){

    .table-responsive{
        text-align: center;
    }
}

@media screen and (max-width:700px){


  #container_header_deconnexion{
      font-size: 0.6em;
  }

  #bouton_fiche_mensuelle{
    margin-left:1%;
    padding:2px 0%;
  }

  #menu_top{
    text-align: center;
  }

  .title-section{
    font-size: 1.5em;
  }

  .date_top{
    font-size: 0.75em;
  }

  #calendar-big .month{
    font-size: 0.75em!important;
  }

  /* FICHE */
  .fiche_flex{
    display: block;
  }

  .fiche_title{
    width:100%;
  }

  .days div{
    height:9em;
  }



  .week-detail{
    height:7.25em;

  }

  .week-title{
    height:8em;
    margin-left:3em;
  }
  /*
  .week-detail{
    height:7.15em;
  }

  .week-title{
    height:9.2em;
  }
  */

  .projet span{
    width:7em;
  }


  .absence h2{
    width:70px;
    height:70px;
  }

  .conge h2{
    width:70px;
    height:70px;
  }

  .holiday h2{
    width:70px;
    height:70px;
  }

  #calendar-big h2{
    padding-top: 25px!important;
    margin: 15px auto 15px auto;
  }

  .event_heuresjour{
    margin-top:13px;
  }

  #heurestot{
    width:45%;
    font-size: 0.9em;
  }

  .content{
    font-size: 0.7em;
  }

}

@media screen and (max-width:650px){
  #menu{
    width:100%;
    font-size: 1.3em;
    border:0;
    padding:5px 5%;
    font-size: 0.9em;
  }

  #menu_top div{
    display:block;
    width:80%;
    margin:10px auto;
    font-size: 1.2em;
  }

  #menu_top div#bouton_fiche_mensuelle{
    margin:0 auto;
  }
  /*
  .days div{
    font-size: 0.7em;
  }
  */

  .projet span{
    width:auto;
  }


  #calendar-big .month{
    font-size: 0.6em!important;
  }

  .absence h2{
    width:60px;
    height:60px;
  }

  .conge h2{
    width:60px;
    height:60px;
  }

  .holiday h2{
    width:60px;
    height:60px;
  }

  #calendar-big h2{
    padding-top:20px!important;
    margin:15px auto 15px auto;
  }

  .days div{
    height:8em;
  }

  .week-title{
    height:7.5em;
  }

  .week-detail{
    height:6.35em;
  }

  .event_heures{
    margin-top:10px!important;

  }

  .number-day{
    top:0!important;
    font-size: 0.8em!important;
  }

  #texte_valider{
    font-size: 0.8em;
  }

  #fiche_validee{
    font-size: 0.8em;
  }

  #div_footer_valid{
    width:20%;
  }

  table{
      display: block;
      font-size: 1em;
  }

}

@media screen and (max-width:550px){

  .conge-actions button{
    font-size: 0.7em!important;
  }

  .event-actions button{
    font-size: 0.7em!important;
  }

  /* LOGIN */
  #login_form{
      width:100%;
  }

  #login_form button[type=submit]{
      width: 50%;
      font-size: 1.1em;
  }

  #container_header_deconnexion{
    width: 40%;
    margin: 0 auto;
    display: block;
    font-size: 0.8em;
    margin: 10px auto;
  }

  #container_header{
    padding:10px 0 0 0;
  }


  .title-section{
    font-size: 1.5em;
  }

  .date_top{
    font-size: 0.6em;
  }

  #calendar-big .month{
    font-size: 0.6em;
  }

  #commentaire_haut{
    display: block;
    width:100%;
  }

  #fiche_comment{
    display: block;
    width:100%;
    margin-top:10px;
  }

  #fiche_infos_commentaire_haut{
    display: block;
  }

  /* CALENDRIER */

    .absence h2{
      width:40px;
      height:40px;
    }

    .conge h2{
      width:40px;
      height:40px;
    }

    .holiday h2{
      width:40px;
      height:40px;
    }

    #calendar-big h2{
      padding-top:15px!important;
      margin:10px auto 10px auto;
      font-size: 0.8em;
    }



    .days div{
      height:5.5em;
      font-size: 0.8em;
    }

    /*
    .week-title{
      height:7.5em;
    }
    */

    .week-detail{
      height:4.35em;
    }

    .event_heures{
      margin-top:0!important;
      font-size: 0.5em!important;
    }

    .event_heures.event_heuresjour{
      margin-top:5px!important;
      font-size: 0.8em!important;
    }

    .event_heures.event_heuresnuit{
      margin-top:5px!important;
      font-size: 0.8em!important;

    }

    .projet div.event_span{
      font-size: 0.6em!important;
    }

    /*
    .number-day{
      top:0!important;
      font-size: 0.8em!important;
    }
    */

    #calendar-big .month{
      font-size: 0.4em!important;
    }

    span.jconfirm-title{
      font-size: 0.8em!important;
    }

}

@media screen and (max-width:500px){
  #projets_attribues_table{
    font-size: 0.8em;
  }

  #container table{
    font-size: 0.8em;
  }

  .content{
    font-size: 0.65em;
  }

  .conge-actions button{
    font-size: 0.6em!important;
  }

  .event-actions button{
    font-size: 0.6em!important;
  }
}

@media screen and (max-width:460px){

  span.jconfirm-title{
    font-size: 0.7em!important;
  }


  /* LOGIN */
  #login_form button[type=submit]{
      width: 75%;
      font-size: 1.1em;
  }


  #logo_div{
      width:75%;
  }

  label{
    font-size: 0.7em;
    padding:0;
  }

  select{
    padding:0;
    font-size: 0.8em;
  }

  button{
    height: auto!important;
    padding: 3px 1%!important;
  }


  .mot_de_passe_oublie{
    font-size: 0.9em;
  }

  /* Tableau de bord */
  /* Entête */
  #menu_top div{
    /*display:block;*/
    width:80%;
    /*margin:10px auto;*/
  }

  #menu_top div#bouton_fiche_mensuelle{
    /*margin:0 auto;*/
  }

  #container_header_date{
    display: block;
    margin:0 auto;
    width:100%;
    text-align:center;
    font-size: 0.9em;
  }

  .month-nav{
    font-size: 1.3em!important;
    width:100%!important;
    margin:0 auto!important;
  }



  .week-title{
    margin-left:2.5em;
  }

  .week-detail{
    height:4.35em;
  }

  .event_heures.event_heuresjour{
    margin-top:5px!important;
    font-size: 0.7em!important;
  }

  .event_heures.event_heuresnuit{
    margin-top:5px!important;
    font-size: 0.7em!important;

  }


  #heurestot{
    width:50%;
    font-size: 0.8em;
    height:4.3rem;
  }

  /*
  #texte_valider{
    font-size: 0.8em;
  }

  #fiche_validee{
    font-size: 0.8em;
  }
  */
  #div_footer_valid{
    width:30%;
  }


}

@media screen and (max-width:400px){
  .fiche_results{

  }

  .fiche_title{

  }


  .week-title{
    /*height:8.1em;*/
    height:7.4em;
  }

  .week-detail{
    /*height:4.35em;*/
    font-size: 0.6em;
    height:7.3em;
  }

  .weekdays div{
    font-size: 0.7em!important;
  }

  .absence h2{
    width:35px;
    height:35px;
  }

  .conge h2{
    width:35px;
    height:35px;
  }

  .holiday h2{
    width:35px;
    height:35px;
  }


  #calendar-big h2{
    padding-top:13px!important;
    margin:10px auto 10px auto;
    font-size: 0.6em;
  }

  .event_heures.event_heuresjour{
    margin-top:5px!important;
    font-size: 0.6em!important;
  }

  .event_heures.event_heuresnuit{
    margin-top:5px!important;
    font-size: 0.6em!important;

  }


  #heurestot{
    width:80%;
    font-size: 0.8em;
    height:4.3rem;
  }

  #projets_attribues_table{
    font-size: 0.7em;
  }

  #container table{
    font-size: 0.7em;
  }


}


@media screen and (max-width:330px){

  #div_footer_valid{
    margin-top:10px;
  }

  #heurestot{
    width:100%;
  }


  #projets_attribues_table{
    font-size: 0.6em;
  }

  #container table{
    font-size: 0.6em;
  }

}

@media screen and (max-width:300px){

  /* LOGIN */
  #login_form button[type=submit]{
      font-size: 1em;
  }

  .fiche_infos{
    display: block!important;
    padding:5px 3%!important;
  }

  .fiche_results{
    margin-top:5px;
    width:100%!important;
    text-align: center!important;
  }



}