/*
*   Core styles
*
*   
*
*/

/*********************************************************************************************   GLOBAL CSS-STYLES   **********************************************************************************************/

html, body{
	overflow:hidden !important;
	width:100% !important;
	padding:0 !important;
	margin:0 !important;
	position: fixed;
}

.form-group {
	margin-bottom: 8px;
}

.dropdown-menu li:hover {
	cursor: pointer;
}

md-input-container .md-input[disabled] {
    color: rgba(0,0,0,0.55) !important;
}
/*******************************   TABS-START   ********************************/
.tabsdemoDynamicHeight md-content {
    background-color: transparent !important;
}
.tabsdemoDynamicHeight md-content md-tabs {
	}
.tabsdemoDynamicHeight md-content md-tabs md-tabs-wrapper {
	  background: #ffffff; }
.tabsdemoDynamicHeight md-content h1:first-child {
	margin-top: 0; }

md-next-button, md-prev-button {
	visibility: hidden;
}

md-tabs-canvas{
	margin: 0 !important;
}

md-ink-bar{
	color: #FF6D00 !important;
	background-color: #FF6D00 !important;
}

md-tab-item{
	color: rgba(0,0,0, 0.6) !important;
}

md-tab-item.md-active{
	color: rgba(0,0,0, 1) !important;
}

/*******************************   TABS-END   ********************************/

/*******************************   CARD-START   ********************************/
.card-header {
  position: relative;
  padding: 20px 24px;
}

.card-header h2 {
  margin: 0;
  font-size: 18px;
}

.card-header small {
  display: block;
  margin-top: 8px;
}

.card-slim {
	padding:10px 7px 2px 7px !important;
}

/*******************************   CARD-END   ********************************/

.alert-message {
  border-radius: 3px;
}

.alert-body {
  padding: 16px 24px;
}

/*******************************   MENU-START   ********************************/
#nav-menu,
#nav-menu ul,
#nav-menu ul li,
#nav-menu ul li a {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  cursor:pointer;
}
#nav-menu {
  width: 100%;
  color: rgba(0, 0, 0, 0.870588);
}
#nav-menu ul ul {
  display: none;
}
.align-right {
  float: right;
}
#nav-menu > ul > li > a {
  padding: 12px 16px;
  cursor: pointer;
  z-index: 2;
  font-weight: bold;
  text-decoration: none;
  color: rgba(0, 0, 0, 0.870588);
  background: #ffffff;
}
#nav-menu > ul > li > a:hover{
  color: #2b2b2b;
  background: #ececec;
	
}

.menu-text {
	position: relative;
	bottom: 5px;
	left: 2px;
}

#nav-menu > ul > li.active > a,
#nav-menu > ul > li.open > a {
  color: rgba(0, 0, 0, 0.870588);
  background: #f3f3f3;
}

#nav-menu ul ul li a {
  cursor: pointer;
  padding: 10px 16px;
  z-index: 1;
  text-decoration: none;
  color: #2b2b2b;
  background: #f3f3f3;
}
#nav-menu ul ul li:hover > a {
  color: rgba(0, 0, 0, 0.870588);
  background: #ececec;
}
#nav-menu ul ul li.open > a,
#nav-menu ul ul li.active > a {
  background: #f3f3f3;
  color: rgba(0, 0, 0, 0.870588);
}
#nav-menu ul ul  li a {
  padding-left: 45px;
}

#nav-menu ul ul ul li a {
  padding-left: 60px;
}

.menuchildicon{
	position:relative;
	top:-5px;
}
/*******************************   MENU-END   ********************************/
/*******************************   BUTTONS-START   ********************************/
.button-icon {
	position: relative;
	top: 5px;
}

.btn-rect{
	 min-width: 40px !important;
	 width: 40px !important;
}

.toolbar-btn{
   padding-top:12px !important;
}

.groupX {
	font-size: 16px;
	margin: 20px 0;
	padding: 3px;
	color: #000;
	background-color: rgba(255, 255, 255, 0.96);
	text-transform: none;
	font-weight: 400;
	border: 1px solid rgba(230, 230, 230, 0.96);
}

.groupX.explorer {
	min-width: 50px !important;
	padding: 3px 15px 3px 15px !important;
	border-left: 1px solid rgba(230, 230, 230, 0.96) !important;
	border-right: 1px solid rgba(230, 230, 230, 0.96) !important;
}

.groupX.left {
	border-left:none;
	border-radius: 5px 0 0 5px;
}

.groupX.input {
	padding: 3px;
	border: 1px solid rgba(230, 230, 230, 0.96);
	width: 100%;
	height: 44px;
	font-size: 14px;
}

.groupX.tiny-input {
		padding: 3px;
		border: 1px solid rgba(230, 230, 230, 0.96);
		width: auto;
		min-width: 40px !important;
		height: 44px;
		font-size: 14px;
}

.groupX.middle {
	border-radius: 0px;
	border-left: 1px solid rgba(230, 230, 230, 0.96);
	border-right: 1px solid rgba(230, 230, 230, 0.96);
}

.groupX.right{
	border-right:none;
	border-radius: 0 5px 5px 0;
}
.groupX.single {
	border-radius: 5px 5px 5px 5px;
}


.md-button:not([disabled]):hover {
	background-color: rgba(193, 193, 193, 0.96);
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

.btn-selected{
	background-color: rgba(193, 193, 193, 0.96);
}

md-radio-button .md-on {
	background-color: #16509e !important;
}

md-radio-button .md-off {
	border-color: #16509e !important;
}

md-checkbox.md-checked .md-ink-ripple {
	color: #16509e !important;
}

.md-icon:after {
    border-color: white !important;
}

md-checkbox.md-checked .md-icon{
	background-color: #16509e !important;
}

md-checkbox[disabled].md-checked .md-icon {
    background-color: rgba(193, 193, 193, 0.96)!important;
}

md-list-item[disabled] label {
    color: rgba(193, 193, 193, 0.96) !important;
}

md-checkbox[disabled]:not(.md-checked) .md-icon {
    border-color: rgba(0,0,0,0.38) !important;
}

md-input-container:not(.md-input-invalid).md-input-has-value label {
  color: #16509e !important; 
}

md-input-container:not(.md-input-invalid).md-input-focused .md-input {
  border-color: #16509e !important; 
}
md-input-container:not(.md-input-invalid).md-input-focused label {
  color: #16509e !important; 
}

/*******************************   BUTTONS-END   ********************************/

md-list-item .md-button:not([disabled]):hover {
   background-color: rgba(150,150,150,0.2) !important;
   color: #272727 !important; 
}



.wizard-parameters md-input-container {
	margin: 0 !important;
	padding-bottom:16px !important;
}

wizard-parameter div:first-child {
	margin-top: 18px !important;
}

.profile-img{
	border-radius:50%; 
	width:64px; 
	height:64px;
	position:relative;
	top:48px;
	left:20px;
	visibility: hidden;
}

.profile-name{
	color: #101010;
	position:absolute;
	bottom:0;
	width: 480px;
	padding: 3px 0 3px 20px;
	font-size:medium;
	font-weight:500;
	background-color: rgba(255,255,255,0.65);
}


.ui-grid-row.ui-grid-row-selected > [ui-grid-row] > .ui-grid-cell {
    background-color: #96ba1a !important;
}

md-switch.md-default-theme.md-checked .md-ink-ripple, md-switch.md-checked .md-ink-ripple {
	color: rgb(22,80,158) !important;
}


md-switch.md-default-theme.md-checked .md-thumb, md-switch.md-checked .md-thumb {
	color: rgb(22,80,158) !important;
}

md-switch.md-default-theme.md-checked .md-bar, md-switch.md-checked .md-bar {
	background-color: rgba(22,80,158, 0.5) !important;
}


.menu-col-text {
	position:relative;
	bottom:5px;
	left:2px;
	color: gray;
}

.md-offset{
	padding: 0 0 0 0;
	margin: 0 0 -60px 0;
}
.header-text{
	font-size: large; 
}

nav ul li span{
	font-weight:normal;
}

.list-group-item {
  border: none !important;
}

md-progress-linear .md-bar{
	background-color: #d8531e !important;
}

md-progress-linear .md-container{
	background-color: #f7dcd2 !important;
}



a.selected {
	background-color: #f5f5f5 !important;
}
/*******************************   EXPLORER-START   ********************************/
.folder_top {
	margin-left: 0;
}

.folder_enterprise {
	margin-left: 12px;
}

.folder_site {
	margin-left: 24px;
}

.folder_area {
	margin-left: 36px;
}

.folder_workcenter {
	margin-left: 48px;
}

.folder_workunit {
	margin-left: 60px;
}

.explorer-first-line {
	position: relative;
	bottom: 4px;
	left: 2px;
	font-size: 1.1em;
	white-space:pre-line;
}

.explorer-second-line{
	position:relative;
	left:36px;
	font-size: 0.85em;
	color: #121212;
	line-height: 1.4em;
}

.md-subheader, .md-subheader-content {
	background-color: #fff !important;
}

/*******************************   EXPLORER-END   ********************************/

/*******************************   COLORS-START   ********************************/


.mops-blue{
	background-color:#16509e !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.mops-orange{
	background-color: #d8531e !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.mops-grey{
	background-color: #696a6d !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.mops-green{
	background-color:#96ba1a !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}



.red {
	background-color:#F44336 !important; 
	color: #ffffff !important;   
	fill:#ffffff !important;
}
 
.pink {
	background-color:#E91E63 !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.purple {
	background-color:#9C27B0 !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.deeppurple {
	background-color:#673AB7 !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.indigo {
	background-color:#3F51B5 !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.blue {
	background-color:#2196F3 !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.lightblue {
	background-color:#03A9F4 !important;
	color: #000000 !important; 
	fill:#000000 !important;
}

.cyan {
	background-color:#00BCD4 !important;
	color: #000000 !important; 
	fill:#000000 !important;
}

.teal {
	background-color:#009688 !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.green {
	background-color:#4CAF50 !important;
	color: #000000 !important; 
	fill:#000000 !important;
}

.lightgreen {
	background-color:#8BC34A !important;
	color: #000000 !important; 
	fill:#000000 !important;
}

.lime {
	background-color:#CDDC39 !important;
	color: #000000 !important; 
	fill:#000000 !important;
}

.yellow {
	background-color:#FFEB3B !important;
	color: #000000 !important; 
	fill:#000000 !important;
}

.amber {
	background-color:#FFC107 !important;
	color: #000000 !important; 
	fill:#000000 !important;
}

.orange {
	background-color:#FF9800 !important;
	color: #000000 !important; 
	fill:#000000 !important;
}

.deeporange{
	background-color:#FF5722 !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.brown {
	background-color:#795548 !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.grey {
	background-color:#9E9E9E !important;
	color: #000000 !important; 
	fill:#000000 !important;
}

.bluegrey {
	background-color:#607D8B !important;
	color: #ffffff !important; 
	fill:#ffffff !important;

}

.black {
	background-color:#000000 !important;
	color: #ffffff !important; 
	fill:#ffffff !important;
}

.white {
	background-color:#FFFFFF !important;
	color: #000000 !important; 
	fill:#000000 !important;
}

.disabled{
	background-color:#e0e0e0 !important;
	color: #a8a8a8 !important; 
	fill:#a8a8a8 !important;
}

/*******************************   COLORS-END   ********************************/

/*******************************   UI-GRID-START   ********************************/

.ui-grid-row:nth-child(even) .ui-grid-cell {
    background-color: #f3f3f3 !important;
    padding-left: 5px !important;
    padding-top: 5px !important;
}

.ui-grid-row:nth-child(odd) .ui-grid-cell {
    background-color: #fdfdfd !important;
    padding-left: 5px !important;
    padding-top: 5px !important;
}

.expandableRow .ui-grid-row:nth-child(odd) .ui-grid-cell {
    background-color: #fdfdfd !important;
	padding-left: 5px !important;
}

.expandableRow .ui-grid-row:nth-child(even) .ui-grid-cell {
	background-color: #f3f3f3 !important;
	padding-left: 5px !important;	
}

.ui-grid-cell {
    overflow: hidden;
    float: left;
    background-color: inherit !important;
    border-color: #d4d4d4;
    box-sizing: border-box;
    vertical-align: middle !important;
}

.uigrid003dae span:first-child:before {
	content: '__';
	background-color: #003dae !important;
	color: #003dae !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigrid0aac00 span:first-child:before {
	content: '__';
	background-color: #0aac00 !important;
	color: #0aac00 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigridffbe00 span:first-child:before {
	content: '__';
	background-color: #ffbe00 !important;
	color: #ffbe00 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigridff2900 span:first-child:before {
	content: '__';
	background-color: #ff2900 !important;
	color: #ff2900 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigrid0076b9 span:first-child:before {
	content: '__';
	background-color: #0076b9 !important;
	color: #0076b9 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigrid6dc200 span:first-child:before {
	content: '__';
	background-color: #6dc200 !important;
	color: #6dc200 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigridffea00 span:first-child:before {
	content: '__';
	background-color: #ffea00 !important;
	color: #ffea00 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigride90038 span:first-child:before {
	content: '__';
	background-color: #e90038 !important;
	color: #e90038 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigrid6400a2 span:first-child:before {
	content: '__';
	background-color: #6400a2 !important;
	color: #6400a2 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigrid00c0b7 span:first-child:before {
	content: '__';
	background-color: #00c0b7 !important;
	color: #00c0b7 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigridcbe800 span:first-child:before {
	content: '__';
	background-color: #cbe800 !important;
	color: #cbe800 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigridbf0094 span:first-child:before {
	content: '__';
	background-color: #bf0094 !important;
	color: #bf0094 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigrid0900a6 span:first-child:before {
	content: '__';
	background-color: #0900a6 !important;
	color: #0900a6 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}

.uigridff9200 span:first-child:before {
	content: '__';
	background-color: #ff9200 !important;
	color: #ff9200 !important;
	padding: 1px;
	border: 1px solid rgba(0,0,0,0.2);
	margin-right: 5px;
}


/*******************************   UI-GRID-END   ********************************/

.disabledicon{
	fill:#a8a8a8 !important;
	outline:0;
}

.enabledicon{
	fill:#000000 !important;
	outline:0;
}

.fullSize {
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box; 
	height: 100%;
	padding-bottom: 15px;
}

.fullSize-overflow {
	overflow:hidden;
}

.y-scroll {
	overflow-y:scroll;
}

.no-x-scroll {
	overflow-x: hidden !important;
}

.no-scroll {
	overflow: hidden !important;
}

.hz-space {
	margin-left:0.5em;
	margin-right:0.5em;
}

#leftSidenav {
	min-width: 318px !important;
	max-width: 318px !important;
	width: 318px !important;

}


.md-view-view-only {
	padding: 0 0 0 0;
	height:100vh !important;
	background:transparent !important;
}

.content-container {
	height: 100% !important;
}
.navigation-mobile {
	background-color: #d3d3d3 !important;
}

.mobile-timepicker {
	width: 175px;
	margin: 10px 7px;
}
/*********************************************************************************************   SIZEDEPENDEND CSS-STYLES   **********************************************************************************************/



/* iphone specific */
@media screen and (max-width: 400px) {
	.groupX.tiny-input {
		padding: 3px;
		border: 1px solid rgba(230, 230, 230, 0.96);
		width: 65px;
		height: 44px;
		font-size: 14px;
	}

	.btn-rect {
		min-width: 35px !important;
		width: 35px !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

    .mobile-timepicker {
        width: auto !important;
    }

    .mobile-timepicker .md-input[disabled]{
       color: rgba(0,0,0, 0.8) !important;
    }
}


@media screen and (max-width: 959px) {
	.fullSize {
		padding-bottom: 0;
	}




	body {
		overflow-y: hidden !important;
	}

	#rightSidenav {
		width: 100% !important;
		min-width: 100% !important;
		 max-width: 100% !important;
	}

	#mainview {
		background-color: #fff !important;
	}



	.content-view {
		height: 100%;
		background-color: #fff;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

	.md-view {
		padding: 0 0 25px 0;
		height: inherit;
		background: transparent !important;
	}

	md-card {
		box-shadow: none !important;
	}



	.fw-mobile {
		width: 100% !important;
	}

	#trend-md-card {
		margin: 0 !important;
		padding: 0 !important;
	}

	.content-view div.row.content-container {
		height: 100%;
	}

	.md-dialog-container {
		height: 100% !important;
	}

	.md-dialog-container .layout-padding {
		padding-left: 0px !important;
		padding-right: 0px !important;
	}

    #explorercontent {
        margin-left: 5px !important;
    }

    .btn-rect{
        margin:0 !important;
    }

    .md-toolbar-tools h2 {
        font-size:15px !important;
    }
}

@media screen and (max-width: 959px) and (orientation: landscape) {
	.nav-toolbar {
		background-color: white !important;
		background-image: none;
		border-bottom: #dcdcdc 1px solid !important;
	}

	#mainview {
		background-color: #fff !important;
	}

	.md-xtall {
		background-color: white !important;
		height: 51px;
		min-height: 51px;
		max-height: 51px;
	}

	.navigation-mobile {
		background-color: #d3d3d3 !important;
		height: 48px;
	}
}

@media screen and (max-width: 959px) and (orientation: portrait) {
	#mainview {
		background-color: #fff !important;
	}

	.nav-toolbar {
		background-image: url('../images/profilebackground.jpg');
		background-repeat: no-repeat;
		background-size: cover;
	}

	.md-xtall {
		height: 192px;
		min-height: 192px;
		max-height: 192px;
	}
}


@media screen and (min-width: 960px) {
		.nav-toolbar {
		background-image: url('../images/profilebackground.jpg');
		background-repeat: no-repeat;
		background-size: cover;
	}

	.md-xtall {
		height: 192px;
		min-height: 192px;
		max-height: 192px;
	}

	#navigation {
		height: 64px;
	}
}

@media screen and (min-width: 960px) and (max-width: 1279px) {
	#rightSidenav {
		width: 350px !important;
		min-width: 350px !important;
		 max-width: 350px !important;
	}


	 .content-view {
		height: 100%;
		background-color: #fff;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		overflow: hidden;
	}

	.md-view {
		padding: 0 0 25px 0;
		height: inherit;
		background: transparent !important;
	}

	md-card {
		box-shadow: none !important;
	}
    .md-virtual-repeat-container.md-autocomplete-suggestions-container {
        width: 500px !important;
    }


	.content-view div.row.content-container {
		height: 100%;
	}
}

@media screen and (min-width: 1280px) and (max-width: 1919px) {
	#rightSidenav {
		width: 400px !important;
		min-width: 400px !important;
		 max-width: 400px !important;
	}

    .md-virtual-repeat-container.md-autocomplete-suggestions-container {
        width: 650px !important;
    }
}

@media screen and (min-width: 1920px)  {
	#rightSidenav {
		width: 450px !important;
		min-width: 450px !important;
		 max-width: 450px !important;
	}

    .md-virtual-repeat-container.md-autocomplete-suggestions-container {
        width: 100% !important;
    }
}

@media screen and (max-width: 1380px) {
	.mobile-expander {
		clear: both;
		width: 100%;
		height: 1px;
		padding-bottom: 3px;
	}
}

@media screen and (min-width: 1280px) {


	.double-card {
		height: 970px !important;
		min-height: 970px !important;
	}

    .modal-dialog {
        width: 800px; 
        margin: 30px auto;
    }
	#showREmoveRulerBtn {
		margin-right: 25px;
	}


	.content-view {
		height: 100%;
		background-color: #ffffff;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		overflow: hidden;
	}

	.content-view div.content-container {
			height: inherit;
		padding: 8px !important;
		-moz-box-sizing: border-box !important;
		-webkit-box-sizing: border-box !important;
		box-sizing: border-box !important;
	}

	.md-view {
		padding: 0 15px 0 15px;
		height: inherit;
		background: transparent !important;
	}



   .content-view div.row.content-container {
		height: 100%;
	}
}