.agendaContent
{
    width:100%;
    direction: ltr;
}

.agendaTable { font-size: 10px;}
.agendaTable td { border-color: gray; vertical-align: top;}
.agendaTable tr { border-color: Black; }
.agendaTable th { border-color: gray;  font-size: 12px; color:black; background-color: whitesmoke; height: 30px;}


.agSelectDimension { padding: 5px; }
.agSelectDimension span{ font-size: 11px; }


.cmt /* comment */
{
  /*  float:left;*/
    background-color: rgb(154,205,50); /*YellowGreen;*/
    padding: 1px 2px;
}

.ecmt /* custom unit comment (employee) from work time page */ {
    background-color: #17fcf5;  /*Cyan*/
    padding: 1px 2px;
}

.pcmt /* custom unit comment (planner) from work time page */ {
    background-color: #fc95ef; /*Pink*/
    padding: 1px 2px;
}

.tis /* time items style*/
{
    font-weight: bold;
}

/* styles for grid */
.agCellTtl
{
   /* background-color: gray;*/
    background-color: lightgray;
    width:100%;
    height:16px;
    border-bottom:1px dashed darkBlue;
    text-align :right;
    border-bottom-style:none;
}

.agCellTtl div:hover { color:White; }

.agCell /* Used only in WeekAgenda!*/ 
{
  /*  height:89px;   */
    overflow:auto;
    overflow-x: hidden; /* for IE9 in compatibility mode*/
	line-height: 100%;
} 

.cellAny 
{ 
    border-top: 1px solid transparent; 
}

.notContract { background-color: #E5E4E2;}

.agCellDate
{
    padding: 1px 5px;
    float:left;
}

.agCellDateToday
{
    background-color: red;
}



.agHdrWkd
{
    float:left;
    padding:2px;
    padding-left:5px;
}

.agHdrDate
{  
    color: #336666;
    float:right;
    font-size:10px;
    padding:2px;    
    padding-right:5px;
}

.agRowHdr
{
    height:70px;
    font-weight:bold;
    text-align :right;
    padding-right: 5px;
 }
  
.agRowHdrTtl
{
    background-color: lightgray;
    width:100%;
    height:16px;
    border-bottom:1px dashed darkBlue;
    text-align :right;
    border-bottom-style:none;
}

.agendaSelectPeriod
{
    background-color:gray;
    padding:5px;
    text-align:right;
    border: 1px solid Black;
    border-radius:10px;
    height:20px;
}


 /*stylePerRoster*/
 .ros, .rosExt, .rosNew, .rosOld
{
    background-color: rgb(255,255,224); /*LightYellow;*/
    border: 1px solid rgb(218,165,32); /*GoldenRod;*/
    border-radius: 8px;
    margin: 4px;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;

   /* Introduced in IE 10. See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/ */
    -ms-user-select: none;
    user-select: none;
    line-height: 120%;
    padding-bottom: 3px;
}

.rosSel {background-color:#FFFFF0; border-color: #FFD33F; }
.rosExt {background-color:whitesmoke; border-color: gray;}
.rosExtSel {background-color:white; border-color: lightgray;}

.rosNew {background-color: #f2c8ac;} /*grey peach*/
.rosOld {background-color: #c3dbc3;} /*grey green*/


.ros-hdr {
    font-weight:bold;
	min-height: 15px;
    border-radius: 8px 8px 0 0;
    padding: 2px 3px 0 3px;
}

.ros-inf {min-height: 34px; padding: 0 3px 0;}
.ros-ftr {min-height: 14px; padding: 0 3px;}

.cmti /*comment times*/
{
    background-color: Yellow;
    padding: 1px 2px;
}


/*stylePerRosterSet*/
.rosSet
{
    width:100%;
    padding-bottom: 6px;
}

.agendaCellPopup
{
    background-color:rgb(245,245,220); /*beige;*/
    border:1px dashed black;
    left:100px;
    position:absolute;
    top:100px;
    width:200px;
}


.calColName{ background-color: whitesmoke;}


.agendaPeriodInfo
{
    color: rgb(245,222,179); /* wheat*/
    float:left;
    font-size:11px;
    text-align:left;
    font-family:Monospace;
    margin-top:-4px;
	font-weight: bold;
    padding-left: 4px;    
}

.cellInfo{ float:right;}
    

/* Popup styles*/
/*popupStylePerRoster */
.popRos, .popRosExt
{    
    background-color: rgb(255,255,224);/*LightYellow;*/
    border: 1px solid rgb(218,165,32);/*GoldenRod;*/
    border-radius: 6px;
    margin-top: 5px;
    padding: 5px;
}
   
.popRosExt { background-color:whitesmoke; border-color: gray; }
.popRosSet { font-size:10px; width:100%;}

.moreInfo
{
    color:Red;
    float:right;
    font-size:9px;   
    padding-right:5px;        
}


.agendaHeaderRow
{
    background-color: rgb(153, 153, 204);
	font-weight:bold;
	text-align:left;
	color :White;    
}
 

/* valid - start*/
.agExRowAct
{
    background-color: white; /*#F8F8FF; */
    border:1px solid  lightgray; 
}

.agExRowArch 
{
    background-color: white; /*#F3F3F4;*/
    border:1px solid lightGray;
}
 
 /*For active employee*/
.agRowAct
{
    background-color: rgb(255, 247, 204);
    border: 1px solid lightgray;
}

.agRowArch
{    
    background-color: rgb(255, 247, 224);
    border: 1px solid lightGray;    
 }

/* valid - end */
.filterContent Label { color: Black; }

/* column person */
.agColPers { font-weight:bold;}

.centerCol
{
    text-align:center !important;
}

.calToday
{
    background-color: red;
    border: 1px solid red;
    color: white;
    width: 92%;
}
/* Stryles for period navigation panel */
 .periodNavContainer
{
    float:left; 
    left :190px;
    position:absolute;
}

.periodNavTitle
{
    padding:5px;
    color:White;
    font-weight:bold;
    float:left;
}

.periodNavData
{
    float: left;
    min-width: 190px;
}

.btn.p2 {float: right; padding-left: 4px;}
.btnShowWD{float:left;}


.wdLow{color:limegreen;}
.wdHigh{color:red;}
.wdOk{color:Gray;}
.wdEmpty{color:gray;}

.wdInfo > div {
    text-align: right;
	display: none;
}



/* extended table with basic styles*/
.smlTable
{
    background-color:White;
}

.smlTable td
{    
    white-space: nowrap;
    padding:1px 2px;
    text-align:left;
    height:30px;
}    

.smlTable .aRow
{  
    border: 1px solid lightgray;    
}

.smlTable .tRow
{  
    border: 1px solid lightgray;    
}
   
   
.smlTable .aRow .hover {background-color: #7FFFD4;}
.smlTable .tRow .hover {background-color: #7FFFD4;}
.smlTable .aRow .hover {background-color: #7FFFD4;}
.smlTable .tRow .hover {background-color: #7FFFD4;}
.smlTable td .hover {background-color: #7FFFD4;}
.smlTable td .hover {background-color: #7FFFD4;}

.smlTable .hRow
{
    text-align:left;
    height:30px;
    font-size: 10px;
    border: 1px solid lightgray;
    background-color: whitesmoke;
}
.smlTable .hRow a { color: black;}

.avBar
{
    display: block;
    height:3px;
    width:100%;
}

.btReq{float:left;padding-left:5px;}
.wdInfo a { color: #008000; }


.statBarMonth
{
    height:12px;
    background-color:LightGray;
}

.statBarYear
{
    height:6px;
    background-color:LightGray;
}
.whProcMonth
{
    float: right;
}

.whHoursInfo
{
    font-size: smaller;
    float:left;
}

.colValue { width:50px; }


.btn,.btn-atw { width: 14px; height: 14px; border: 0 solid rgb(255, 255, 224); display: block;}
.btn-status  { width: 8px; height: 8px; border: 0px solid transparent; display: block;margin: 3px;border-radius: 3px;}

.sbtn { width: 14px; height: 14px; border: 0 solid rgb(255, 255, 224); display: block; float: right; padding-left: 4px;}
.btnSel { background-color: #F5F5DC; border-color: #FFD33F; }
.btnN {background-color:rgb(255,255,224); }

.btn-status { float: right; }
.btn-atw { float: right; }


.eIm {
    float:right; border-width: 0;
}

.eComment {
    display: inline-block;
    max-height: 200px;
    width: 100%;
    max-width: 100%;
    overflow-y: auto;
    white-space: normal;
}

.statHdr {
    font-weight: bolder;
    padding-bottom: 5px;
}

.details {
    background-color: #FFFFE0;
    border-color: #DEB887;
    border-style: solid solid none none;
    border-top-right-radius: 8px;
    border-width: 1px;
    font-size: smaller;
    height: 12px;
    width: 30%;
    padding-left: 6px;
}

.details:hover { background-color: lightgoldenrodyellow;}

.cellPers {
    height: 82px;
    border: 1px solid transparent;
}

.multLine { white-space: normal; }

.btnAddRoster{}

.hidden {
    display: none;
}

.today {
    background-color:red;
    color:white;
    padding-left:5px;
    padding-Right:5px;
}


.cellRequestDetails {
    white-space: normal;
}

.cellComment {
    border-top-style: dashed;
    border-top-width: 1px;
    color: gray;
    font-size: 11px;
    margin-top: 10px;
    max-width: 100%;
    width: 100%;
    white-space: pre-wrap;
    padding-top: 5px;
    padding-bottom: 5px;
}

.commentOfUser { color: gray;}

.commentOfPlanner { color: darkgoldenrod;}

.photoPersonName {
    font-weight: bold;
    padding: 10px;
    font-size: 14px;
    padding-bottom: 20px;
}

.photoFrame {
    float:left;
    margin-right:10px;
    display: block;
    height: 100%;
    max-height: 250px;
    max-width: 300px;
    border: 1px solid gray;
}

.personalInformation { float: left;}

.ros-photo {
    float:right;
    width: 32px;/*width:18%;*/
}