/* personnalisations */
:root{
    --couleurC1: #d2dce5;
    --couleurC2: #a18084;
    --couleurC3: #e8dac7;
    --couleurC4: #e7ded7;
    --couleurC5: #a69085;


    --couleurF1: #2d3746;
    --couleurF2: #f27f81;
    --couleurF3: #483139;
    --couleurF4: #63414b;
    --couleurF5: #887672;

    --header-bgcolor: var(--couleurC1);
    --header-text: var(--couleurF1);
    --header-hover: var(--couleurF5);
    --menuG-bgcolor: var(--couleurC1);
    --menuG-color: var(--couleurC5);
    --cal-titrecolor: #FFF;
    --cal-titrebgcolor: var(--couleurF1);
    --cal-joursbgcolor: #FFF;
    --cal-jourscolor: var(--couleurC5);
    --cal-sembgcolor: #FFF;
    --cal-semcolor: var(--couleurF1);
    --cal-semhovercolor: var(--couleurF5);
    --cal-weekbgcolor: var(--couleurC5);
    --cal-weekcolor: #FFF;
    --cal-cellbgcolor: var(--couleurF3);
    --cal-cellcolor: #FFF;
    --cal-cellhoverbgcolor: #FFF;
    --cal-cellhovercolor: var(--couleurF1);
    --cal-current-day-bg: transparent;
    --cal-current-day-col: var(--couleurC1);
    --pl2-titrebgcolor: var(--couleurF1);
    --pl2-titrecolor: white;
    --pl2-entetebgcolor: var(--couleurC5);
    --pl2-entetecolor: white;
    --pl2-cellbgcolor: transparent;
    --pl2-cellcolor: var(--couleurF1);
    --icons-color: var(--couleurC5);
    --btn-primary-color: #FFF;
    --btn-primary-bgcolor: var(--couleurF1);
    --btn-primary-bordcolor: var(--couleurC1);
    --active-btn-primary-color: #FFF;
    --active-btn-primary-bgcolor: var(--couleurF1);
    --active-btn-primary-bordcolor: var(--couleurF3);
    --focus-btn-primary-bgcolor: var(--couleurF1);
    --focus-btn-primary-bordcolor: var(--couleurF3);
    --focus-btn-primary-color: #FFF;
    --menuadm-item-actif: var(--couleurF4);
    --ssmenuadm-actif-bg: var(--couleurF2);
    --ssmenuadm-actif-color: var(--couleurC4);
}
*{
    box-sizing: border-box;
}
body {
    padding:10px;
    overflow: hiden;
background-color: var(--header-bgcolor);
}


.btn-default{
    color:var(--couleurC4);
    background-color:var(--couleurF1);
    /*border:3px solid red!important;*/
}
#planning2 caption{
    background-color: var(--couleurC1);
}
#menuGauche2{
    padding-right:10px;
}
.titre{
    font-size:1.4rem;
    color:var(--header-text);
    margin:10px;
    padding:10px;
    background-color: #ffffff;
    border:1px solid #000000;
}

.nom_ressource{
    font-size:3.2rem;
    font-weight:900;
    color:var(--couleurF1);

}
.date::before,.nom_ressource::before{

position: relative;
top: 1px;
display: inline-block;
font-family: 'Glyphicons Halflings';
font-style: normal;
font-weight: 400;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
padding-right:20px;

}
.nom_ressource::before{
    content:'\e021';
}
.date::before{
    content:'\e109';
}
.date{
    font-weight: 900;
    background-color:var(--couleurF2);
    color:#ffffff;
    margin-right:10px;
line-height:180%;
    padding:5px;
        font-size:2.2rem;
}

#resource_selectorG{
border:1px solid #ccc;
    overflow: hidden;

}
#resource_selectorG .panel-default{
    margin-top:2rem;
    overflow: hidden;
    background-color: #ffffff;
}
#resource_selectorG .panel-heading{font-size:2rem;
margin-top:1rem;
text-align:center;
}
header, header a,#Date{
    background-color: var(--header-bgcolor);
    color: var(--header-text);
}
header a:hover{
    color: var(--header-hover);
}
#menuGauche2, #menuGauche2 caption{
    background-color: var(--menuG-bgcolor);
    color: var(--menuG-color);
}
#calendriers .calendar caption{
    background-color: var(--cal-titrebgcolor);
    color: var(--cal-titrecolor);
}
.calendar th{
    background-color: var(--cal-joursbgcolor);
    color: var(--cal-jourscolor);
}
table.calendar {
    background-color: var(--couleurC3)!important;

    /*border:1px solid var(--cal-cellhoverbgcolor);*/
}
.calendar td, .calendar td>a{
    background-color: var(--cal-cellbgcolor);
    color: var(--cal-cellcolor);
    padding:1px;
}
.calendar td>a:hover{
    background-color: var(--cal-cellhoverbgcolor);
    color: var(--cal-cellhovercolor);
}
td.calendarcol1, td.calendarcol1>a {
    background-color: var(--couleurC3)!important;
    color: var(--cal-semcolor);
}
td.calendarcol1>a:hover{
    color: var(--cal-semhovercolor);
}
.calendar td.week, .calendar td.week a, .calendar tr.week>td.calendarcol1, tr.week>td.calendarcol1>a{
    background-color:var(--cal-weekbgcolor);
    color: #000000;
}
.cal_current_day{
    background-color: var(--cal-current-day-bg);
    color: var(--cal-current-day-col);
}
#planning2 caption a .glyphicon{
    background-color: var(--pl2-titrebgcolor);
    color: var(--pl2-titrecolor);
}
#planning2 thead, .jour th, a.lienPlanning, #planning2 thead .glyphicon {
    background-color: var(--pl2-entetebgcolor);
    color: var(--pl2-entetecolor);
}
.monthday a {
    background-color: transparent;
    color: var(--pl2-cellcolor);
}
.monthday{font-size:1.4rem;text-align:center}
.glyphicon {
    color: var(--icons-color);
}
.btn-primary{
    color: var(--btn-primary-color);
    background-color: var(--btn-primary-bgcolor);
    border-color: var(--btn-primary-bordcolor)
}
.btn-primary:hover,.btn-primary:focus{
    background-color: var(--focus-btn-primary-bgcolor);
    border-color: var(--focus-btn-primary-bordcolor);
    color: var(--focus-btn-primary-color);
}
.btn-primary:active{
    background-color: var(--active-btn-primary-bgcolor);
    border-color: var(--active-btn-primary-bordcolor);
    color: var(--active-btn-primary-color);
}
.dropdown-menu > li > a.active{
    color:var(--menuadm-item-actif);
}
.dropdown .actif{
    background-color: var(--ssmenuadm-actif-bg);
    color: var(--ssmenuadm-actif-color);
}


.fontcolor2, .fontcolor3{
    color:#a18084;
    
}

legend {
  font-size: 26px;
  font-weight:900;
  border: 0;
    border-bottom-color: currentcolor;
    border-bottom-style: none;
    border-bottom-width: 0px;
  border-bottom: 1px solid #e5e5e5;
}


.btn-group-xs > .btn, .btn-xs  {
  font-size: 1.5rem;
  font-weight:900;
}
/*responsive*/

header #panel{min-height: 125px;}
@media only screen and (max-width: 600px) {

  header .logo{margin:auto;float:none;text-align:center;max-width:100%;}
  header .administration, header .configuration{display:none;}
  
  #menuGauche2{width:100%;}
  #planning2{width:100%;}
  
  #calendriersG, resource_selectorG{float:left;}
  
  #resource_selectorG div.panel:nth-of-type(2) {
   display:none;
}
  
  #legendeG{display:none;}
}