/*
.dashboard-css {
	width: calc(100% - 20px) !important;
	
  	sjustify-content: flex-start;
  	salign-items: flex-start; 
	position:absolute;
	adisplay: table;
	padding: 0px;

	apadding-left:10px;
	sspadding-right:20px;
	apadding-top:10px;
}

.dashboard1-css {
	width: calc(100% - 20px) !important;
	sposition:relative;
	padding: 10px;
	margin-top: 10px;
}

	
.db-statcard-grid-main{	
	float: left;
	margin: 5px;
    background-color: #ffffff;
    color: #ffffff;
    height: 400px;
	display: flex;
  	justify-content: center;
  	align-items: center; 
	position:relative;
	
}

*/


.tooltip-header {
    margin-bottom: 5px;
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 5px;
    border-bottom: 1px solid #c5c5c5;
}

.tooltip-body {
    width: 170px;
}

.tooltip-body .series-name {
    font-weight: normal;
    opacity: 0.6;
    display: inline-block;
    line-height: 1.5;
    padding-right: 10px;
    width: 126px;
}

.tooltip-body .value-text {
    display: inline-block;
    line-height: 1.5;
    width: 30px;
}

.dashboatrd-filterbar {	
	font-family: 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
	cursor:default;
	background-color: #fff;
	margin-left: 5px;
	margin-top: 5px;
	padding: 5px;
	border-color: rgba(228, 228, 228, 1);
	border-width: 1px;
	border-style:solid;
	float:left;
	display: block; height: auto; overflow: auto;	
	width:200px;

}

.dashboatrd-content {
	width:calc(100% - 220px);
	float:left;
	background-color: #fff;
}


.dashboatrd-filterbar .dx-fieldset {
	margin-top: 10px;
}

.dashboatrd-filterbar .dx-fieldset-header{
	font-weight:bold;
	font-size: 10pt;
	margin-bottom: 10px;
	margin-top: 5px;
	color:rgba(37, 37, 37, 0.8);
}

.dashboatrd-filterbar .dx-field-label {
	margin: 0px;
	font-size: 8pt;
	padding-top: 0px;
    padding-right: 15px;
    padding-bottom: 0px;
    padding-left: 0px;
}

.dashboatrd-filterbar .dx-field {
	min-height: 10px;
	padding: 0px;
	margin-bottom: 5px;

}

.filtereditbox .dx-toolbar .dx-texteditor {
    height: 21px!important;
	font-size: 8pt;
}

.filtereditbox .dx-button-has-icon .dx-button-content {
    padding: 2px;
}

.filtereditbox .dx-toolbar .dx-texteditor {
    height: 21px!important;
	padding: 2px;
}

.filtereditbox .dx-datebox.dx-auto-width.dx-dropdowneditor-button-visible .dx-texteditor-input, 
.filtereditbox.dx-datebox:not(.dx-texteditor-empty).dx-auto-width.dx-dropdowneditor-button-visible .dx-texteditor-input {
	padding-right: 25px;
}

.filtereditbox .dx-texteditor-input,
.filtereditbox.dx-datebox.dx-auto-width.dx-dropdowneditor-button-visible,
.filtereditbox .dx-datebox:not(.dx-texteditor-empty).dx-auto-width.dx-dropdowneditor-button-visible .dx-texteditor-input{
    margin: 0;    
	padding-right: 2px;
	padding-bottom: 2px;
	padding-left: 4px;
	padding-top: 2px;
	
    background: #fff;
    color: #333;
    font-size: 8pt;
    border-radius: 4px;
    min-height: 21px;
}

.filtereditbox .dx-placeholder {
    color: #999999;
    margin-top: -4px;
    margin-left: -5px;
	font-size: 8pt;
}

.filtereditbox.dx-datebox-calendar .dx-dropdowneditor-icon {
    font: 14px/1 DXIcons;
    width: 22px;
    height: 100%;
    font-size: 13px;
    text-align: center;
    line-height: 18px;
    border-radius: 3px;
}

.filtereditbox .dx-dropdowneditor-button {
    width: 22px;
    padding: 1px;
    border-radius: 4px;
}

#filter_button {
    display: block;
}

.flex-db-statCard-container {
  padding: 0;
  margin: 0;
  list-style: none;
  -ms-box-orient: horizontal;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  font-family: 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
  cursor:default;
}

.nowrap  { 
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

.db_statcard_main{	
	float: left;
	padding: 0px;
	width: 20%;
	margin: 5px;
    background-color: #b200ff;
    color: rgba(255, 255, 255, 0.8);
    height: 65px;
    
	display: flex;
  	justify-content: center;
  	align-items: center; 
	position:relative
}

.db_statcard_progress {
	position: absolute;
	left: 5%;
    bottom: 3px;
	width:90%;
}

.db_statcard_masspunch {
	background-color:rgba(239, 108, 0, 1);
}

.db_statcard_masspunch_present {
	background-color:rgba(255, 255, 0, 1);
	color: rgba(37, 37, 37, 1);
}

.db_statcard_absent {
	background-color:#d50000;
}

.db_statcard_present {
	background-color:rgba(34, 139, 34, 1);
}

.db_statcard_usedexcuse {
	background-color:rgba(40, 53, 147, 1);
}

.db_statcard_AuthorizedLeave {
	background-color:rgba(98, 0, 234, 1);
}

.db_statcard_label {
    font-size: 12px;
    opacity: 1;
    margin-top: 3px;
    font-weight:normal;

    sposition: absolute;
  	stop: 50%; 
    sleft: 50%;
  	stransform: translate(-50%,-50%);
    sbackground-color: #999;
  	swidth: auto;
  	sheight: auto;
}

.db_statcard_value {
    font-size: 30px;
    font-weight:bold;
    opacity: 1;
    dbackground-color: black;
    aposition: absolute;
  	atop: 50%; 
    aleft: 50%;
  	atransform: translate(-50%,-50%);
  	awidth: auto;
  	aheight: auto;
    
}

#statSummery-tabpanel-container{
    height: 350px !important;
	max-height: 350px !important;
	margin: 5px;
	background-color: #ffffff;
}

.db-widget-itemBorder {
	border-color: rgba(228, 228, 228, 1);
	border-width: 1px;
	border-style:solid;
}

.db-widget-item300{	
    background-color: transparent;
	margin: 5px;
	
    background-color: #ffffff;
    color: #ffffff;
    height: 300px;
}


#StatCardsPresentTypePie, #StatCardsAbsentTypePie {
	height: 300px;
}

.db-widget-item-container {
}

.grid-title {
    padding-left: 10px;
    font-family: 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
	font-weight:bold;
	margin: 0;
    text-align: left;
    color: rgba(37, 37, 37, 0.7);
	font-size: 12pt
}

.grid-title-WebReq {
    padding-left: 10px;
	padding-top:5px;
    font-family: 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
	font-weight:bold;
	margin: 0;
    text-align: left;
    color: rgba(37, 37, 37, 0.7);
	font-size: 12pt
}

.grid-subtitle {
    padding-left: 10px;
    font-family: 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
	font-weight:normal;
	margin: 0;
    text-align: left;
    color: rgba(37, 37, 37, 0.7);
	font-size: 8pt
}


/*Dashboard grid*/
.dx-datagrid{
	font: 8pt 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
	color:rgba(37, 37, 37, 0.7);
}

.DB-grid-cell[role="columnheader"]{
	font-weight:bold;
	color: rgba(37, 37, 37, 0.8);
    background-image: url(images/gridhdr.jpg);
	background-size:contain;
    background-position:top;
    background-repeat:repeat-x;
    background-color: rgba(68, 68, 68, 1);
	height:25px !important;
	padding:5px;
	border: solid 0px #d5d5d5;

}

.DB-grid-cell[role="gridcell"]{
	height:20px !important;
	max-height: 25px !important;
	padding:5px;
	color: rgba(37, 37, 37, 1);
}

.DB-grid-cell[role="row"]{
	height:20px !important;
	padding:5px;
	color: #000000;
}

.DB-grid-cell{
	height:20px !important;
	max-height: 25px !important;
	padding:5px;
}

.dx-datagrid .dx-row > td {
    padding: 5px;
	height:20px !important;
	max-height: 21px !important;

}

.dx-datagrid-content .dx-datagrid-table .dx-row > td, .dx-datagrid-content .dx-datagrid-table .dx-row > tr > td {
	padding: 4px;
	vertical-align:middle;
}

.StatDBGridCss .dx-texteditor-input[role="combobox"] {
    height: 21px!important;
	font-size: 8pt;
	padding-left: 2px;
}

.StatDBGridCss .dx-dropdowneditor-button {
    width: 20px;
    padding: 1px;
    border-radius: 4px;
}

.StatDBGridCss  .dx-toolbar .dx-texteditor {
    height: 21px!important;
	font-size: 8pt;
}

.StatDBGridCss .dx-button-has-icon .dx-button-content {
    padding: 2px;
}

.StatDBGridCss .dx-toolbar .dx-texteditor {
    height: 21px!important;
	padding: 2px;
}

.StatDBGridCss .dx-datagrid-search-panel {
    margin: 0;
    margin-left: 3px;
}

.StatDBGridCss .dx-toolbar .dx-toolbar-after {
    Xpadding-left: 0px;
    eheight: 21px!important;
}

#STOPStatCardsGrid .dx-datagrid-search-panel {
    Xmargin-left: 0px;
}

.StatDBGridCss .dx-texteditor-input {
    margin: 0;
    padding: 0px 25px 6px;
    background: #fff;
    color: #333;
    font-size: 1em;
    border-radius: 4px;
    min-height: 21px;
}

.StatDBGridCss .dx-searchbox .dx-icon-search {
    font: 14px/1 DXIcons;
    position: absolute;
    top: 0px;
    margin-top: 0px;
    width: 21px;
    height: 21px;
    background-position: 8px 8px;
    background-size: 18px 18px;
    padding: 2px;
    font-size: 18px;
    text-align: center;
    line-height: 12px;
    font-size: 14px;
    color: #999999;
}

.StatDBGridCss .dx-placeholder {
    color: #999999;
    margin-top: -5px;
    margin-left: -10px;
}

.StatDBGridCss .dx-show-clear-button .dx-icon-clear {
    color: #999999;
    position: absolute;
    top: -3px;
    margin-top: 0px;
    width: 21px;
    height: 21px;
    background-position: 8px 8px;
    background-size: 18px 18px;
    padding: 2px;
    font-size: 12px;
    text-align: center;
    line-height: 18px;
    font-size: 12pt;
    padding-left: 15px;
}

.StatDBGridCss .dx-toolbar-after .dx-toolbar-item {
    padding-top: 0px;
    padding-right: 6px;
    padding-bottom: 0px;
    padding-left: 5px;
}





#STOPStatCardsGrid .dx-texteditor-input[role="combobox"] {
    height: 21px!important;
	font-size: 8pt;
	padding-left: 2px;
}

#STOPStatCardsGrid .dx-dropdowneditor-button {
    width: 20px;
    padding: 1px;
    border-radius: 4px;
}

.customGrid .dx-toolbar .dx-texteditor {
    height: 21px!important;
	font-size: 8pt;
}

.customGrid .dx-button-has-icon .dx-button-content {
    padding: 2px;
}

.customGrid .dx-toolbar .dx-texteditor {
    height: 21px!important;
	padding: 2px;
}

.customGrid .dx-datagrid-search-panel {
    margin: 0;
    margin-left: 3px;
}

.customGrid .dx-toolbar .dx-toolbar-after {
    Xpadding-left: 0px;
    eheight: 21px!important;
}

.customGrid .dx-datagrid-search-panel {
    Xmargin-left: 0px;
}

.customGrid .dx-texteditor-input {
    margin: 0;
    padding: 0px 25px 6px;
    background: #fff;
    color: #333;
    font-size: 1em;
    border-radius: 4px;
    min-height: 21px;
}

.customGrid .dx-searchbox .dx-icon-search {
    font: 14px/1 DXIcons;
    position: absolute;
    top: 0px;
    margin-top: 0px;
    width: 21px;
    height: 21px;
    background-position: 8px 8px;
    background-size: 18px 18px;
    padding: 2px;
    font-size: 18px;
    text-align: center;
    line-height: 12px;
    font-size: 14px;
    color: #999999;
}

.customGrid .dx-placeholder {
    color: #999999;
    margin-top: -5px;
    margin-left: -10px;
}

.customGrid .dx-show-clear-button .dx-icon-clear {
    color: #999999;
    position: absolute;
    top: -3px;
    margin-top: 0px;
    width: 21px;
    height: 21px;
    background-position: 8px 8px;
    background-size: 18px 18px;
    padding: 2px;
    font-size: 12px;
    text-align: center;
    line-height: 18px;
    font-size: 12pt;
    padding-left: 15px;
}

.customGrid .dx-toolbar-after .dx-toolbar-item {
    padding-top: 0px;
    padding-right: 6px;
    padding-bottom: 0px;
    padding-left: 5px;
}

.customGrid .dx-datagrid-group-panel .dx-group-panel-item {
    margin-right: 10px;
    color: #959595;
    font-weight: normal;
    border: 1px solid #ddd;
    padding: 2px;
    font-size: 8pt;
}

.customGrid .dx-toolbar .dx-toolbar-item:last-child {
    padding-left: 0px;
}

.customGrid .dx-toolbar .dx-toolbar-menu-container {    
    padding-top: 0px;
    padding-right: 2px;
    padding-bottom: 0px;
    padding-left: 5px;
}
.customGrid .informer {
    height: 45px;
    width: 90px;
    text-align: center;
    color: #fff;
    background-color: rgba(85, 149, 222, 0.6);
	font: 8pt 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
}

.customGrid .name {
	font-size: 8pt;
	font-weight: normal;
	padding-top: 5px;
}

.customGrid .count {
    padding-top: 5px;
    line-height: 15px;
	margin: 0;
	font-size: 12pt;
	font-weight: normal;	
}

#STOPStatCardsGrid  .dx-toolbar .dx-texteditor {
    height: 21px!important;
	font-size: 8pt;
}

#STOPStatCardsGrid .dx-button-has-icon .dx-button-content {
    padding: 2px;
}

#STOPStatCardsGrid .dx-toolbar .dx-texteditor {
    height: 21px!important;
	padding: 2px;
}

#STOPStatCardsGrid .dx-datagrid-search-panel {
    margin: 0;
    margin-left: 3px;
}

#STOPStatCardsGrid .dx-toolbar .dx-toolbar-after {
    Xpadding-left: 0px;
    eheight: 21px!important;
}

#STOPStatCardsGrid .dx-datagrid-search-panel {
    Xmargin-left: 0px;
}

#STOPStatCardsGrid .dx-texteditor-input {
    margin: 0;
    padding: 0px 25px 6px;
    background: #fff;
    color: #333;
    font-size: 1em;
    border-radius: 4px;
    min-height: 21px;
}

#STOPStatCardsGrid .dx-searchbox .dx-icon-search {
    font: 14px/1 DXIcons;
    position: absolute;
    top: 0px;
    margin-top: 0px;
    width: 21px;
    height: 21px;
    background-position: 8px 8px;
    background-size: 18px 18px;
    padding: 2px;
    font-size: 18px;
    text-align: center;
    line-height: 12px;
    font-size: 14px;
    color: #999999;
}

#STOPStatCardsGrid .dx-placeholder {
    color: #999999;
    margin-top: -5px;
    margin-left: -10px;
}

#STOPStatCardsGrid .dx-show-clear-button .dx-icon-clear {
    color: #999999;
    position: absolute;
    top: -3px;
    margin-top: 0px;
    width: 21px;
    height: 21px;
    background-position: 8px 8px;
    background-size: 18px 18px;
    padding: 2px;
    font-size: 12px;
    text-align: center;
    line-height: 18px;
    font-size: 12pt;
    padding-left: 15px;
}

#STOPStatCardsGrid .dx-toolbar-after .dx-toolbar-item {
    padding-top: 0px;
    padding-right: 6px;
    padding-bottom: 0px;
    padding-left: 5px;
}

.MonthlyAttendanceLineChart {
    height: 200px;
    Xwidth: 100%;
    Xbackground-color: #ffffff;
	border-color: rgba(228, 228, 228, 1);
	border-width: 1px;
	border-style:solid;

    background-color: transparent;
	margin: 5px;
    background-color: #ffffff;
    color: #ffffff;

}



 .MonthlyAttendanceLineChart-container {
    	position: relative;
        width: inherit;
        display: inline-block;
}

.MonthlyAttendanceLineChart-selectbox {
    	position: absolute;
    	right: 60px;
    	top: 14px;
		width:150px;
}

.OffDayRow{
	background-color: green !important;
	color: #ffffff  !important;
}