/* show_days_tasks.php */
/*############################### HEADER ###############################*/
header { background-color:white; height:52px;border-top: 3px solid; border-top-color: #3fa9c8; border-top-width: 2px;box-shadow: 1px 6px 5px -4px rgba(50,50,50,0.12);}

header div#toggle-menu { position: absolute; left: 22px; top: 20px; }

header div#logo-top { position:absolute; left:85px; top:5px; }
header div#logo-top img { width: 80%;}

header div#title { width:400px; position:relative; margin:0 auto; top:10px; text-align: center; }
header div#title h1 { color: gray; }

header div#user-profile { float:right; position:absolute; right:10px; top:0; text-align:right; width:155px; }
header div#user-profile img { float:left; padding-top:2px; }
header div#user-profile div:nth-child(2) { margin-top: 15px; }
header div#user-profile div:nth-child(2) p { color:gray;font-size: 13px;}


/*############################### NAVIGATION ###############################*/
nav#leftNav ul a { text-decoration: none; }

nav#leftNav ul#textNav { text-decoration:none; padding:0; }
nav#leftNav ul#textNav > h2:nth-child(1) { color:white; line-height:50px; vertical-align:center; font-size: 1.3em; padding:5px 0; }
nav#leftNav ul#textNav > h2:nth-child(1) img { height:50px; padding-top: 5px; }
nav#leftNav ul#textNav > h2:nth-child(1) span { background: #091726; }

nav#leftNav ul#iconNav {display:none; text-decoration:none;}
nav#leftNav ul#iconNav > h2:nth-child(1) { color:white; line-height:50px; vertical-align:center; font-size: 1.3em; padding:5px 0; }
nav#leftNav ul#iconNav > h2:nth-child(1) img { height:50px; padding-top: 5px; }
nav#leftNav ul#iconNav > h2:nth-child(1) span { background: #091726; }


/*############################### RESPONSIVE MEDIA QUERIES ###############################*/
@media all and (max-width:667px) {
  /*#leftNav { width: 90px; }
  #iconNav { display: block; }
  #textNav { display: none; }  
  #minbutton { display: block; }
  #hidebutton { display: none; }
  #showbutton { display: none; }*/
  
  header div#logo-top { left: 40px; top:15px;}
  header div#logo-top img { width: 50%; }
  header div#title { top:18px;}
  header div#title h1 { font-size: 1.5em; }
  header div#user-profile { right:20px; }
  header div#user-profile div:nth-child(2) { display: none; }
  header div#user-profile img { float:right; padding-top:4px; width:50px; height:50px; }
}
@media all and (max-width:466px) {
  div#main { margin-left:0;}
}
@media all and (max-width:450px) {     

  header div#logo-top { left: 10px; top:10px;}
  header div#logo-top img { width: 30%; }
  header div#title { width:150px; position:relative; left:8px; text-align: center;}
  header div#title h1 { font-size: 1.3em; }
  header div#user-profile { right:10px; }
  header div#user-profile div:nth-child(2) { display: none; }
  header div#user-profile img { float:right; padding-top:7px; width:45px; height:45px; }
}

@media all and (max-width:420px) {   

}
### for ag-grid
    .rag-light-red {
        color: lightcoral;
    }    
    .rag-red {
        color: red;
        font-weight:bold;
    }
    .rag-green {
        color: green;
        font-weight:bold;
    }
    .rag-orange {
        color: orange;
        font-weight:bold;
    }
    .rag-yellow {
        color: yellow;
        font-weight:bold;
    }


#popup-complete, #popup-comments, #popup-task{
 
}